<template>
  <div>
    <el-form ref="form" :model="form">
      <!-- 数据表格 -->
      <ele-pro-table
        ref="table"
        :columns="columns"
        :datasource="form.datasource"
        :needPage="false"
        :toolkit="[]"
        :minHeight="100"
        tool-class="ele-toolbar-form"
        cache-key="eomContactPageTable"
      >
        <!-- 表头工具栏 -->
        <template v-slot:toolbar>
          <el-button
            v-if="dialogType !== 'view'"
            size="small"
            type="primary"
            icon="el-icon-plus"
            class="ele-btn-icon"
            @click="handleSelectDevice"
          >
            新增
          </el-button>
        </template>

        <template v-slot:action="{ row, $index }" v-if="dialogType !== 'view'">
          <el-popconfirm
            class="ele-action"
            title="确定要删除此信息吗？"
            @confirm="handleDelInfo($index)"
          >
            <template v-slot:reference>
              <el-link type="danger" :underline="false" icon="el-icon-delete">
                删除
              </el-link>
            </template>
          </el-popconfirm>
        </template>
        <template v-slot:isUpload="{ row }">
          <el-select v-model="row.isUpload"  style="width: 100%">
              <el-option label="装" :value="0" ></el-option>
              <el-option label="卸" :value="1" ></el-option>
            </el-select>
        </template>
        <template v-slot:headerGLLXMC="{ column }">
          <span class="is-required">{{ column.label }}</span>
        </template>
      </ele-pro-table>
    </el-form>
    <select-equipment-list
      ref="selectEquipmentListRef"
      :code="treeClassifyCodeEnum['CHACHE']"
      @changeParent="getSelectEquipment"
    ></select-equipment-list>
  </div>
</template>


<script>
import selectEquipmentList from '@/BIZComponents/selectEquipmentList.vue';
import { treeClassifyCodeEnum } from '@/enum/dict';

export default {
  name: 'relatedInfoTable',
  components: { selectEquipmentList },
  props: {
    dialogType: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      form: {
        datasource: []
      }
    };
  },
  computed: {
    treeClassifyCodeEnum() {
      return treeClassifyCodeEnum;
    },
    columns() {
      let list = [
        {
          columnKey: 'index',
          label: '序号',
          type: 'index',
          width: 55,
          align: 'center',
          showOverflowTooltip: true,
          fixed: 'left'
        },
        {
          columnKey: 'index',
          type: 'index',
          label: '序号',
          width: 55,
          align: 'center',
          showOverflowTooltip: true,
          fixed: 'left'
        },
        {
          columnKey: 'code',
          prop: 'code',
          slot: 'code',
          label: '编码',
          showOverflowTooltip: true,
          minWidth: 180,
          align: 'center'
        },
        {
          prop: 'isUpload',
          label: '类型',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center',
          slot: 'isUpload'
        },
        {
          prop: 'name',
          label: '名称',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'category.brandNum',
          label: '牌号',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'fixCode',
          label: '固资编码',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },

        {
          prop: 'codeNumber',
          label: '编号',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'category.modelType',
          label: '型号',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        },
        {
          prop: 'category.specification',
          label: '规格',
          showOverflowTooltip: true,
          minWidth: 110,
          align: 'center'
        }
      ];
      let action = [
        {
          columnKey: 'action',
          slot: 'action',
          label: '操作',
          resizable: false,
          width: 80,
          align: 'center',
          showOverflowTooltip: true,
          fixed: 'right'
        }
      ];
      this.dialogType === 'view'
        ? (list = [...list])
        : (list = [...list, ...action]);
      return list;
    }
  },

  methods: {
    getSelectEquipment(list) {
      this.form.datasource.push(...list);
    },
    //选择叉车
    handleSelectDevice() {
      this.$refs.selectEquipmentListRef.open('', -1);
    },
    //删除任务信息数据
    handleDelInfo(index) {
      this.form.datasource.splice(index, 1);
    },
    putTableValue(list) {
      if (list) {
        this.form.datasource = JSON.parse(JSON.stringify(list));
      }
    },
    getTableValue() {
      return this.form.datasource;
    }
  }
};
</script>


<style scoped lang="scss">
:deep(.el-form-item) {
  margin-bottom: 0;
}
</style>
