<template>
  <!--仓库-->
  <Modal v-model="showModal" width="1000" class="modal-footer-none">
    <p slot="header">实验室列表</p>
    <Row>
      <Col span="24">
        <Form :id="formId" :label-width="90" inline onsubmit="return false">
          <label class="label-sign"></label>
          <Form-item label="实验室名称:">
            <Input @on-enter="_formSearch" v-model="subcontractorName" name="subcontractorName" placeholder="请输入实验室名称"
                   style="width: 200px;"
                   clearable/>
          </Form-item>
          <Form-item class="search-btn">
            <Button @click="_formSearch" type="primary">搜索</Button>
          </Form-item>
        </Form>
      </Col>
      <Col span="24">
        <PTVXETable ref="pageTable" :tableHeight="400"
                    @on-result-change="_tableResultChange" :getPage="getPage" hide-checkbox>
          <vxe-table-column
            :field="item.key"
            :title="item.title"
            :min-width="item.width?item.width:200"
            :fixed="item.fixed?item.fixed:undefined"
            v-for="item in pageColumns"
            :key="item.key" sortable>
            <template slot-scope="scope">
              <div v-if="item.datetime">{{$dateformat(scope.row[item.key],'yyyy-mm-dd HH:MM')}}</div>
              <div v-else>{{scope.row[item.key]}}</div>
            </template>
          </vxe-table-column>
        </PTVXETable>
      </Col>
    </Row>
  </Modal>
</template>
<script>
/**
 * 选择实验室
 */
import { meterSubcontractor } from '../../../api'
export default {
  data() {
    return {
      showModal: false,
      formId: '',
      selectNames: '',
      selectIds: '',
      getPage: {},
      pageColumns: [
        { title: '实验室名称', key: 'name', width: 160 },
        { title: '资质', key: 'aptitude', width: 160 },
        { title: '检测项目', key: 'itemName' },
        { title: '报价', key: 'price', width: 160 }
      ],
      voList: [],
      subcontractorName: ''
    }
  },
  methods: {
    _open(voList, formId) {
      this.formId = formId
      this.voList = voList
      this.showModal = true
      this.subcontractorName = ''
      this.$nextTick(() => {
        this._page()
      })
    },
    _formSearch() {
      this.$refs.pageTable._pageChange(1)
    },
    _page: async function() {
      const data = {}
      if (this.voList && this.voList.length) {
        data.voList = this.voList
      }
      // this.$refs.pageTable._page(
      //   this.formId,
      //   'FoodSubcontracter/getLabByAptitude',
      //   data
      // )
      const result = await meterSubcontractor.page(data)
      console.log('实验室名称', result)
      if (result) {
        this.getPage = result
        // console.log(result.records)
        // this.labList = result.records
        // console.log(this.labList)
      }
    },
    _tableResultChange(msg, data) {
      switch (msg) {
        case 'page':
          this.getPage = this.$store.state.FoodSubcontracter.page
          break
        case 'dbSelect':
          this.$emit('on-result-change', data)
          this.showModal = false
          break
        case 'changeSize':
          this._page()
          break
      }
    }
  }
}
</script>
