tmr-admin/.svn/pristine/34/349c4c92eeeb4d4ab128218fb6f4d307c761d7e1.svn-base

<template>
  <div v-if="visible">
    <!-- 干物质调节-配方选择 -->
    <el-dialog title="干物质调节-配方选择" :destroy-on-close="true" :visible.sync="visible" :close-on-click-modal="false" append-to-body :before-close="closeDialog" width="35%">
      <div style="min-height:200px;justify-content:center;align-items:center;display:flex;">
        <div style="height: 40px;width: 80%;">
          <span style="margin-right: 10px;">请选择栏舍配方:</span>
          <el-select v-model="temp.ftid" filterable class="filter-item">
            <el-option v-for="item in balconicFormulaList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
        </div>
      </div>
      <div slot="footer" class="dialog-footer" style="bottom: 10px;">
        <el-button class="minCancel" @click="closeDialog()">取消</el-button>
        <el-button class="miniSuccess" @click="handleNextSamplingSelection()">下一步</el-button>
      </div>
    </el-dialog>

    <!-- 干物质调节—采样选择 -->
    <el-dialog :title="textMap[samplingSelection.dialogStatus]" :visible.sync="samplingSelection.dialogFormVisible" append-to-body :close-on-click-modal="false" width="80%">
      <div class="dialogMinHeight">
        <div class="search filter-item">
          <el-date-picker v-model="samplingSelection.getdataListParm.parammaps.date" type="date" placeholder="请选择时间" :clearable="false" style="width: 230px;" format="yyyy-MM-dd" value-format="yyyy-MM-dd" />
          <el-select v-model="samplingSelection.getdataListParm.parammaps.enable" filterable placeholder="栏舍名称" class="filter-item" style="width: 120px;" clearable>
            <el-option v-for="item in samplingSelection.shedNameList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
          <el-select v-model="samplingSelection.getdataListParm.parammaps.enable" filterable placeholder="栏舍名称" class="filter-item" style="width: 120px;" clearable>
            <el-option v-for="item in samplingSelection.frequencyList" :key="item.id" :label="item.name" :value="item.id" />
          </el-select>
          <el-button class="successBorder" @click="handleSearch">查询</el-button>
        </div>
        <div class="table" style="margin-top: 10px;">
          <el-table
            :key="samplingSelection.tableKey"
            v-loading="samplingSelection.listLoading"
            element-loading-text="给我一点时间"
            :data="samplingSelection.list"
            border
            fit
            highlight-current-row
            style="width: 100%;"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            @selection-change="handleSelectionChange"
          >
            <el-table-column type="selection" align="center" width="50" />
            <el-table-column label="序号" align="center" type="index" width="50px" />
            <el-table-column label="栏舍名称" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="班次" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="鲜样重量（g）" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="烘干重量（g）" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="理论干物质" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="实际干物质" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="操作人" prop="drivercode" min-width="110px" align="center" />
            <el-table-column label="操作日期" prop="drivercode" min-width="110px" align="center" />
          </el-table>
        </div>
      </div>
      <div slot="footer" class="dialog-footer" style="bottom: 10px;">
        <el-button class="minCancel" @click="closeDialog();">取消</el-button>
        <el-button class="miniSuccess" @click="handleNextChangeDetails()">下一步</el-button>
      </div>
    </el-dialog>

    <!-- 干物质调节-变化详情 -->
    <el-dialog :title="textMap[changeDetails.dialogStatus]" :visible.sync="changeDetails.dialogFormVisible" append-to-body :close-on-click-modal="false" width="80%">
      <div class="dialogMinHeight">
        <div class="table">
          <el-table
            :key="changeDetails.tableKey"
            v-loading="changeDetails.listLoading"
            element-loading-text="给我一点时间"
            :data="changeDetails.list"
            border
            fit
            highlight-current-row
            style="width: 100%;"
            :row-style="rowStyle"
            :cell-style="cellStyle"
            class="elTable table-fixed"
            :span-method="objectSpanMethod"
          >
            <el-table-column label="栏舍" prop="barname" min-width="90px" align="center" class-name="small-padding fixed-width" fixed="left" />
            <el-table-column label="班次" prop="times" min-width="90px" align="center" class-name="small-padding fixed-width" fixed="left" />
            <el-table-column label="调节前班次重量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节后班次重量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节前饲喂干物质量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节后饲喂干物质量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节前采样干物质量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节后采样干物质量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节前日投喂量" prop="softccount" min-width="70px" align="center" />
            <el-table-column label="调节后日投喂量" prop="softccount" min-width="70px" align="center" />
          </el-table>
        </div>
      </div>
      <div slot="footer" class="dialog-footer" style="bottom: 10px;">
        <el-button class="minCancel" @click="closeDialog();">取消</el-button>
        <el-button class="miniSuccess" @click="handleNextLast()">下一步</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
import { GetDataByName, PostDataByName } from '@/api/common'
import { handleTableSpan, handleObjectSpanMethod } from '@/utils/index.js'
import Cookies from 'js-cookie'
import { MessageBox } from 'element-ui'
export default {
  name: 'RevisePlan',
  components: {},
  props: {
    show: { type: Boolean, default: false }
  },
  data() {
    return {
      visible: this.show,
      dialogFormVisible: false,
      dialogStatus: '',
      balconicFormulaList: [{ id: 1, name: '泌乳牛高产  V1' }, { id: 2, name: '泌乳牛高产  V2' }, { id: 3, name: '泌乳牛高产  V3' }],
      temp: {
        ftid: ''
      },

      samplingSelection: {
        dialogFormVisible: false,
        dialogStatus: '',
        shedNameList: [{ id: 1, name: '栏舍名称1' }, { id: 2, name: '栏舍名称2' }, { id: 3, name: '栏舍名称3' }],
        frequencyList: [{ id: 1, name: '第一班' }, { id: 2, name: '第二班' }, { id: 3, name: '第三班' }, { id: 4, name: '第四班' }],
        getdataListParm: {
          name: 'getDriverList',
          page: 1,
          offset: 1,
          pagecount: 0,
          returntype: 'Map',
          parammaps: {
            pastureid: Cookies.get('pastureid'),
            enable: '',
            drivername: '',
            drivercode: ''
          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true
      },
      changeDetails: {
        dialogFormVisible: false,
        dialogStatus: '',
        getdataListParm: {
          name: 'getPlanModifyFPlist',
          page: 1,
          offset: 1,
          pagecount: 0,
          returntype: 'Map',
          parammaps: {
            pastureid: Cookies.get('pastureid'),
            enable: '',
            drivername: '',
            drivercode: ''
          }
        },
        tableKey: 0,
        list: [],
        total: 0,
        listLoading: true,
        spanObj: {},
        mergekeys: ['barname', 'sumweight']
      },

      textMap: {
        samplingSelection: '干物质调节—采样选择',
        changeDetails: '干物质调节—变化详情'
      },
      selectionList: [],
      isokDisable: false,
      requestParam: {},
      rowStyle: { maxHeight: 50 + 'px', height: 45 + 'px' },
      cellStyle: { padding: 0 + 'px' }
    }
  },
  watch: {
    // 监听show,visible 随着show变化而变化
    show: {
      immediate: true,
      handler(show) {
        this.visible = show
      }
    }
  },
  created() {

  },
  methods: {
    closeDialog() {
      this.$emit('update:show', false) // 子组件更新弹框隐藏
      this.samplingSelection.dialogFormVisible = false
      this.changeDetails.dialogFormVisible = false
    },
    handleNextSamplingSelection() {
      if (this.temp.ftid !== '') {
        this.samplingSelection.dialogStatus = 'samplingSelection'
        this.samplingSelection.dialogFormVisible = true
        this.getListSamplingSelection()
      } else {
        this.$message({ type: 'error', message: '选择需调节配方', duration: 2000 })
      }
    },
    handleSearch() {},
    handleSelectionChange(item) {
      this.selectionList = item
    },
    getListSamplingSelection() {
      this.samplingSelection.listLoading = true
      GetDataByName(this.samplingSelection.getdataListParm).then(response => {
        console.log('table数据', response.data.list)
        if (response.data.list !== null) {
          this.samplingSelection.list = response.data.list
          this.samplingSelection.pageNum = response.data.pageNum
          this.samplingSelection.pageSize = response.data.pageSize
          this.samplingSelection.total = response.data.total
        } else {
          this.samplingSelection.list = []
        }
        setTimeout(() => {
          this.samplingSelection.listLoading = false
        }, 100)
      })
    },
    handleNextChangeDetails() {
      if (this.selectionList.length == 1) {
        this.changeDetails.dialogStatus = 'changeDetails'
        this.changeDetails.dialogFormVisible = true
        this.getListChangeDetails()
      } else {
        if (this.selectionList.length == 0) {
          this.$message({ type: 'error', message: '请选择采样内容对应干物质比例调节', duration: 2000 })
        } else {
          this.$message({ type: 'error', message: '仅可选择一条采样内容进行调节', duration: 2000 })
        }
      }
    },
    getListChangeDetails() {
      this.changeDetails.listLoading = true
      this.changeDetails.getdataListParm.parammaps.date = '2021-04-09'
      GetDataByName(this.changeDetails.getdataListParm).then(response => {
        console.log('table数据', response.data.list)
        if (response.data.list !== null) {
          this.changeDetails.list = response.data.list
          this.changeDetails.pageNum = response.data.pageNum
          this.changeDetails.pageSize = response.data.pageSize
          this.changeDetails.total = response.data.total
          this.handleSpan()
        } else {
          this.changeDetails.list = []
        }
        setTimeout(() => {
          this.changeDetails.listLoading = false
        }, 100)
      })
    },
    handleSpan() {
      this.changeDetails.mergekeys.forEach(key => {
        this.changeDetails.spanObj[key] = []
        let position = 0
        this.changeDetails.list.forEach((item, index) => {
          if (index === 0) {
            this.changeDetails.spanObj[key].push(1)
            position = 0
          } else {
            if (key == 'sumweight') {
              if (this.changeDetails.list[index][key] === this.changeDetails.list[index - 1][key] && this.changeDetails.list[index]['barname'] === this.changeDetails.list[index - 1]['barname']) {
                this.changeDetails.spanObj[key][position] += 1
                this.changeDetails.spanObj[key].push(0)
              } else {
                this.changeDetails.spanObj[key].push(1)
                position = index
              }
            } else {
              if (this.changeDetails.list[index][key] === this.changeDetails.list[index - 1][key]) {
                this.changeDetails.spanObj[key][position] += 1
                this.changeDetails.spanObj[key].push(0)
              } else {
                this.changeDetails.spanObj[key].push(1)
                position = index
              }
            }
          }
        })
      })
    },
    objectSpanMethod({ row, column, rowIndex, columnIndex }) {
      for (let i = 0; i < this.changeDetails.mergekeys.length; i++) {
        if (column.property === this.changeDetails.mergekeys[i]) {
          const _row = this.changeDetails.spanObj[this.changeDetails.mergekeys[i]][rowIndex]
          const _col = _row > 0 ? 1 : 0
          return {
            rowspan: _row,
            colspan: _col
          }
        }
      }
    },
    handleNextLast() {
      MessageBox.confirm('是否确认进行当前干物质调节操作', '提示', {
        confirmButtonText: '确认', cancelButtonText: '取消', type: 'warning',
        beforeClose: (action, instance, done) => {
          console.log(action, instance, done)
          this.closeDialog()
          done()
        }
      }).then(() => {

      })
    }
  }
}
</script>

<style lang="scss" scoped>

</style>