<!--Collapse关联框  单个导入项目-->
<template>
  <div>
    <div>
      <Collapse left-title="资质项目" right-title="已选的检测项目" :left-width="18" @on-result-change="_optionResult">
        <template slot="left">
          <AptitudeItem ref="leftModal" @on-result-change="_leftResult" />
        </template>
        <template slot="right">
          <AddItem
            ref="rightModal"
            :get-page="getPage"
            :page-columns="pageColumns"
            @on-result-change="_rightResult"
          />
        </template>
      </Collapse>
    </div>
  </div>
</template>

<script>
import Collapse from '../../../../../components/base/Collapse'
import AddItem from '../RightAddTestItemTable'
import AptitudeItem from './AptitudeItem'
export default {
  components: {
    Collapse,
    AddItem,
    AptitudeItem
  },
  data() {
    return {
      pageColumns: [
        { title: '检测项目', key: 'name', width: 100 },
        { title: '检测依据', key: 'code', width: 120 },
        { title: '检测依据名称', key: 'standardName', width: 180 },
        { title: '检测科室', key: 'groupName', width: 100 }
      ],
      selectData: [],
      addIds: [],
      delData: [],
      getPage: [],
      isEditModal: false
    }
  },
  methods: {
    _open(sampleIds) {
      this.sampleIds = sampleIds
      this.selectData = []
      this.addIds = []
      this.delData = []
      this.getPage = []
      this.$refs.leftModal._open()
    },
    _optionResult(name) {
      switch (name) {
        case '添加':
          this._add()
          break
        case '删除':
          this._deleteSelected()
          break
      }
    },
    // 未关联方法返回的数据
    _leftResult(msg, data) {
      switch (msg) {
        case 'click':
          this.selectData = data
          break
        case 'dbClick':
          this.selectData = [data]
          this._add()
          break
        case 'search':
          this.selectData = []
          break
      }
    },
    // 已关联方法返回的数据
    _rightResult(msg, data) {
      switch (msg) {
        case 'click':
          this.delData = data
          break
      }
    },
    // 添加关联方法
    _add() {
      if (this.selectData.length === 0) {
        this.$Message.warning('请至少选择一条数据！')
      } else {
        for (let i = 0; i < this.selectData.length; i++) {
          if (
            !this.getPage.find(item => item.name === this.selectData[i].name)
          ) {
            this.getPage.push(this.selectData[i])
            this.addIds.push(this.selectData[i].id)
          }
        }
        this.$refs.leftModal._clearSelection()
      }
    },
    _deleteSelected() {
      if (this.delData.length === 0) {
        this.$Message.warning('请选择一条或多条数据！')
      } else {
        this._deleteByIds(
          this.delData,
          '确定删除 ' + this.delData.length + ' 条记录？'
        )
      }
    },
    _deleteByIds(row, content) {
      for (let i = 0; i < row.length; i++) {
        const dataIndex = this.getPage.indexOf(row[i])
        this.getPage.splice(dataIndex, 1)
        const idIndex = this.addIds.indexOf(row[i].id)
        this.addIds.splice(idIndex, 1)
      }
    }
  }
}
</script>
