<template>
  <div>
    <Row>
      <!--查询-->
      <Col span="24">
        <Form id="task-assign-sample-left" inline onsubmit="return false">
          <label class="label-sign"></label>
          <Form-item class="search-btn">
            <Button @click="_formSearch" type="primary">搜索</Button>
          </Form-item>
        </Form>
      </Col>
      <!--操作-->
      <Col span="24">
        <btn-list :msg="btn" @on-result-change="_btnClick" class="contHide"></btn-list>
      </Col>
      <!-- 表格 -->
      <Col span="24">
        <PTVXETable ref="pageTable" :pageColumns="pageColumns" :table-name="tableName"
                    :tableHeight="tableHeight"
                    @on-result-change="_tableResultChange" :getPage="getPage" >
          <vxe-table-column
            v-for="item in userColumns.length > 0 ?userColumns:pageColumns"
            :key="item.key"
            :field="item.key"
            :title="item.title"
            :min-width="item.width"
            :fixed="item.fixed?item.fixed:undefined"
            sortable>
            <template slot-scope="scope">
              <a v-if="item.key==='code'" @click.stop="_detailModal(scope.row)">{{scope.row[item.key]}}</a>
              <a v-else-if="item.key==='num'" @click.stop="_sampleDetail(scope.row)">{{scope.row[item.key]}}</a>
              <span
                v-else-if="item.date">{{scope.row[item.key]?$dateformat(scope.row[item.key],'yyyy-mm-dd'):''}}</span>
              <span v-else>{{scope.row[item.key]}}</span>
            </template>
          </vxe-table-column>
          <VXESettingCol slot="setting" :pageColumns="pageColumns" :userColumns="userColumns"
                         @on-result-change="_resetColumn" :table-name="tableName"></VXESettingCol>
        </PTVXETable>
      </Col>
    </Row>
    <keep-alive>
      <!-- eslint-disable-next-line vue/require-component-is -->
      <component ref="refModal" :is="currentComponent" @on-result-change="_modalResult"></component>
    </keep-alive>
  </div>
</template>
<script>
import { soilTest } from '../../../../api'

export default {
  components: {},
  props: {
    id: null
  },
  data() {
    return {
      currentComponent: '',
      tableName: 'food-task-assign-sample-left',
      // 用户自己选中的列
      userColumns: [],
      switchStatusData: this.id,
      formObj: {
        entrustId: ''
      },
      optionList: [
        { key: 'code', name: '委托编号', placeholder: '请输入委托编号' },
        { key: 'cname', name: '委托单位', placeholder: '请输入委托单位' },
        { key: 'testedName', name: '受检单位', placeholder: '请输入受检单位' },
        { key: 'num', name: '样品编号', placeholder: '请输入样品编号' },
        { key: 'name', name: '样品名称', placeholder: '请输入样品名称' },
        {
          key: 'resultDate',
          name: '数据出具日期',
          placeholder: '请选择数据出具日期',
          date: true
        }
      ],
      btn: [{ id: 'food-task-assign-auto', name: '自动分配' }],
      getPage: {},
      pageColumns: [
        { title: '委托编号', key: 'code', width: 180 },
        { title: '受检单位', key: 'testedName', width: 180 },
        { title: '样品编号', key: 'num', width: 180 },
        { title: '样品名称', key: 'name', width: 140 },
        { title: '委托单位', key: 'cname', width: 180 },
        { title: '数据出具日期', key: 'resultDate', width: 120, date: true }
      ],
      resultDateBegin: '',
      resultDateEnd: ''
    }
  },
  computed: {
    tableHeight: function() {
      return this.$tableHeight('tabSearch')
    }
  },
  mounted() {
    this._page()
  },
  methods: {
    // 重置column
    _resetColumn(colList) {
      this.userColumns = colList
      this.$refs.pageTable._loadColumn(colList)
    },
    _modalResult() {
      if (this.currentComponent === 'AutoAssignModal') {
        this._formSearch()
      }
    },
    _selInputResult1(msg, data) {
      switch (msg) {
        case 'search':
          this._formSearch()
          break
      }
    },
    _open() {
      this._page()
    },
    _searchParams() {
      const obj = {}
      const obj1 = this.$refs.selInput1._getFormObj()
      Object.assign(obj, obj1)
      return obj
    },
    _page: async function() {
      console.log('样品')
      Object.assign(this.formObj, this.$refs.pageTable._searchParams())
      this.formObj.entrustId = this.switchStatusData
      const result = await soilTest.pageExpTestSample(
        this.$serializeForm(this.formObj)
      )
      if (result) {
        this.$refs.pageTable._hideLoading()
        this.getPage = result
      }
    },
    _formSearch() {
      this.$refs.pageTable._pageChange(1)
    },
    _tableResultChange(msg, data) {
      switch (msg) {
        case 'page':
          this.getPage = this.$store.state.FoodSample.page
          break
        case 'selectIds':
          this.$emit('on-result-change', data)
          break
        case 'changeSize':
          this._page()
          break
        case 'table-col':
          // 用户选中的表格列
          this.userColumns = data
          break
      }
    },
    _btnClick(msg) {
      switch (msg) {
        case '自动分配':
          this._autoAssign()
          break
      }
    },
    _autoAssign() {
      this.currentComponent = 'AutoAssignModal'
      this.$store.dispatch('FoodItem/autoAllotNum').then(() => {
        const num = this.$store.state.FoodItem.count
        if (num !== undefined) {
          this.$nextTick(function() {
            this.$refs.refModal._open(num)
          })
        }
      })
    },
    // 委托详情
    _detailModal(data) {
      this.$store.dispatch('FoodContract/getById', data.contractId).then(() => {
        if (data.type === 1) {
          this.currentComponent = 'FoodContractGovernDetail'
        } else {
          this.currentComponent = 'FoodContractCompanyDetail'
        }
        this.$nextTick(function() {
          this.$refs.refModal._open(this.$store.state.FoodContract.model)
        })
      })
    },
    // 样品详情
    _sampleDetail(data) {
      this.$nextTick(function() {
        if (data.type === 1) {
          this.currentComponent = 'FoodSampleGovernDetail'
          this.$store.dispatch('FoodSample/getByGovernId', data.id).then(() => {
            this.$refs.refModal._open(this.$store.state.FoodSample.governModel)
          })
        } else {
          this.currentComponent = 'FoodSampleCompanyDetail'
          this.$store
            .dispatch('FoodSample/getByCompanyId', data.id)
            .then(() => {
              this.$refs.refModal._open(
                this.$store.state.FoodSample.companyModel
              )
            })
        }
      })
    }
  }
}
</script>
