<template>
  <div>
    <Modal v-model="showSampleModal" @on-visible-change="_visibleChange" width="1200"
           class="zIndex-900 modal-footer-none">
      <p slot="header"> {{name}}--管理样品</p>
      <div>
        <el-tabs v-model="activeName" @tab-click="_changeTabs">
          <el-tab-pane label="待接收样品" name="waitReceive">
            <WaitReceive ref="waitReceiveModal" @on-result-change="_search"></WaitReceive>
          </el-tab-pane>
          <el-tab-pane label="待发放样品" name="waitScan">
            <WaitScan ref="waitScanModal" @-result-change="_search"></WaitScan>
          </el-tab-pane>
        </el-tabs>
      </div>
    </Modal>
  </div>
</template>
<script>
import WaitReceive from './WaitReceive'
import WaitScan from './WaitScan'

export default {
  components: {
    WaitReceive,
    WaitScan
  },
  data() {
    return {
      type: '',
      contractId: '', // 合同id
      showSampleModal: false,
      modalTitle: '',
      selectIds: [],
      activeName: 'waitReceive',
      name: ''
    }
  },
  methods: {
    _initTab() {
      if (this.$showBtn('food-wait-Issue-sample')) {
        this.activeName = 'waitScan'
        this._waitSend()
      }
    },
    _open(contractId, type, name) {
      this.type = type // 类型（采样或送样）
      this.name = name
      this.showSampleModal = true
      this.entrustId = contractId // 合同id
      this.activeName = 'waitReceive'
      this.selectIds = []
      this._waitPage()
    },
    // 待接收
    _waitPage() {
      this.$refs.waitReceiveModal._open(this.entrustId, this.type)
    },
    // 待发放
    _waitSend() {
      this.$refs.waitScanModal._open(this.contractId, this.type)
    },
    // 已接收
    _issuedPage() {
      this.$refs.alreadyIssuedModal._open(this.contractId, this.type)
    },
    _changeTabs(tab, event) {
      if (tab.name === 'alreadyIssued') {
        this._issuedPage()
      } else if (tab.name === 'waitReceive') {
        this._waitPage()
      } else if (tab.name === 'waitScan') {
        this._waitSend()
      }
    },
    _search() {
      this.$emit('on-result-change')
    },
    // 关闭弹框的时候刷新上个界面
    _visibleChange(data) {
      if (data === false) {
        this._search()
      }
    }
  }
}
</script>
