<template>
  <div>
    <Modal v-model="showModal" v-drag width="800">
      <p slot="header">
        {{ modalTitle }}
      </p>
      <div>
        <!--内容-->
        <Row>
          <!--查询-->
          <Col span="24">
          </Col>
          <!--操作-->
          <!-- 表格 -->
          <Col span="24">
            <PTVXETable ref="pageTable" :table-height="tableHeight" :form-id="formId" :loading="true"
                        :get-page="getPage" hide-page="true" is-edit  select-data @on-result-change="_tableResultChange">
              <vxe-table-column
                v-for="item in pageColumns"
                :key="item.key"
                :field="item.key"
                :title="item.title"
                :min-width="item.width?item.width:200"
                :edit-render="item.editCell?{autofocus: 'input'}:null"
                :fixed="item.fixed?item.fixed:undefined" sortable>
              <template slot-scope="scope">
                {{ scope.row[item.key] }}
              </template>
            </vxe-table-column>
            </PTVXETable>
          </Col>
        </Row>
      </div>
      <div slot="footer">
        <modal-footer ref="footerModal" :footer="footerList" @on-result-change="_footerResult" />
      </div>
    </Modal>
  </div>
</template>
<script>
import { soilEntrust } from '../../../api'
export default {
  components: {},
  data() {
    return {
      formId: 'SampleItemManage',
      currentComponent: '',
      btn: [],
      entrustId: '',
      showModal: false,
      modalTitle: '试验项目统计量',
      selectIds: [],
      itemId: '',
      showOption: true,
      searchOpen: true,
      selectData: {},
      getPage: { records: [] },
      currentRow: '',
      currentIndex: '',
      footerList: [
        { id: '', name: '取消', type: '' },
        { id: '', name: '关闭', type: 'primary' }
      ],
      pageColumns: [
        { title: '试验名称', key: 'name' },
        { title: '试验总数', key: 'num' }
      ],
      formObj: {
        entrustId: undefined
      }
    }
  },
  computed: {
    tableHeight: function() {
      return this.$tableHeight('tableModal')
    }
  },
  methods: {
    _footerResult(name) {
      switch (name) {
        case '取消':
          this._cancel()
          break
        case '关闭':
          this._cancel()
          break
      }
    },
    _cancel() {
      this.$emit('on-result-change')
      this.$refs.pageTable._hideLoading()
      this.$refs.footerModal._hideLoading()
      this.showModal = false
    },
    _modalResult(data1, data2) {
      switch (this.currentComponent) {
        case 'CopyModal':
          if (data1 === 0) {
            this._copySample(data2)
          } else {
            this._copyAll(data2)
          }
          break
        default:
          this._search()
      }
    },
    methodChange(data) {
      const editData = {}
      editData.testMethod = data.testMethod
      this._editItem(data.id, editData)
    },
    _handleRow(data) {
      this.currentRow = data.row
      this.currentIndex = data.rowIndex
    },
    _btnClick(msg, componentName) {
      this.currentComponent = componentName
      this.$nextTick(function() {
        switch (msg) {
          case '批量填写试验项目信息':
            this._writeInfo()
            break
          case 'search':
            this.searchOpen = !this.searchOpen
            break
        }
      })
    },
    _iconClick(res, data, componentName, index) {
      this.currentComponent = componentName
      this.$nextTick(function() {
        switch (res) {
          case '编辑':
            this._editModal(true, data)
            break
          case '删除':
            console.log(index)
            this._deleteById(data.id)
            break
          case '附件':
            this.$refs.refModal._open(data.id, 'sampleId')
            break
        }
      })
    },
    _tableResultChange(msg, data) {
      const selectIds = []
      switch (msg) {
        case 'selectData':
          for (let i = 0; i < data.length; i++) {
            selectIds.push(data[i].id)
          }
          this.selectIds = selectIds
          this.selectData = data
          break
        case 'page':
          this._pageByEntrustId()
          break
        case 'changeSize':
          this._pageByEntrustId()
          break
      }
    },
    _open(id) {
      this.formObj = this.$resetFields(this.formObj)
      this.formObj.entrustId = id
      this.showModal = true
      this.$refs.pageTable._hideLoading()
      this._pageByEntrustId()
    },
    _formSearch() {
      this.$refs.pageTable._pageChange(1)
    },
    _pageByEntrustId: async function() {
      Object.assign(this.formObj, this.$refs.pageTable._searchParams())
      const result = await soilEntrust.listEntrustItemNum(
        this.$serializeForm(this.formObj)
      )
      if (result) {
        this.$refs.pageTable._hideLoading()
        this.getPage.records = result
      }
    },
    _detailModal(data) {},
    _search() {
      this._pageByEntrustId()
    },
    _resultChange(msg) {
      this._pageByEntrustId()
      this.$Message.success(msg)
      this.$emit('on-result-change')
    }
  }
}
</script>
