<!--
  @description: 采购计划-框架计划编制待提交表格数据
  @author: lxl
  @date： 2020-11-02 13:32
-->
<template>
  <el-table
    ref="smallTable"
    v-loading="loading"
    :data="tableData"
    @sort-change="sortChange"
  >
    <el-table-column width="60" type="index" label="序号" align="center" />
    <el-table-column sortable="custom" prop="tenderNo" min-width="150" label="采购单编号" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchasePlanNo" min-width="150" label="框架计划编号" align="center" />
    <el-table-column sortable="custom" prop="tenderMethod" min-width="120" label="采购方式" align="center">
      <template slot-scope="scope">
        {{ filterDictText(tenderMethodList,scope.row.tenderMethod) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" min-width="100" prop="tenderType" label="公开/邀请" align="center">
      <template slot-scope="scope">
        {{ filterDictText(tenderTypeList,scope.row.tenderType) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" min-width="150" prop="supplierAttribute" label="供应商属性" header-align="center" align="left">
      <template slot-scope="scope">
        {{ filterDictText(supplierAttributeList,scope.row.supplierAttribute) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" min-width="150" prop="supplierCategory" label="供应商分类" header-align="center" align="left">
      <template slot-scope="scope">
        {{ filterDictText(supplierCategoryList,scope.row.supplierCategory) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" min-width="120" prop="bizAuditStatus" label="状态" align="center">
      <template slot-scope="scope">
        {{ filterDictText(planStatusList,scope.row.bizAuditStatus) }}
      </template>
    </el-table-column>
    <el-table-column label="操作" align="center" width="200" fixed="right">
      <template slot-scope="scope">
        <el-link
          type="primary"
          @click.stop="detail(scope.row)"
        >
          [查看]
        </el-link>
        <el-link
          type="primary"
          @click.stop="edit(scope.row)"
        >
          [编辑]
        </el-link>
        <el-link
          type="primary"
          @click.stop="deleteHandel(scope.row)"
        >
          [删除]
        </el-link>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
/* 公共方法*/
import { filterDictText } from '@/assets/js/utils' // 字典方法

export default {
  name: 'FramePurchaseTable',
  props: {
    loading: {
      type: Boolean,
      default: false
    },
    tableData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      /* -----------数据字典start-------------*/
      tenderMethodList: [], // 采购方式
      tenderTypeList: [], // 公开/邀请
      supplierAttributeList: [], // 供应商属性
      supplierCategoryList: [], // 供应商分类
      reviewMethodList: [], // 评审办法
      planStatusList: [], // 状态
      dictionaryType: ['tenderMethod', 'tenderType', 'supplierAttribute', 'supplierCategory', 'reviewMethod', 'planStatus']
      /* -----------数据字典end-------------*/
    }
  },
  created() {
    // 字典请求初始化
    this.getGroupType()
  },
  methods: {
    filterDictText, // 字典
    // 字典请求
    getGroupType() {
      this.$store.dispatch('getGroupType', this.dictionaryType).then((data) => {
        // 遍历key存储相应的数据
        for (const key in data.bidTypeData) {
          /* 是否有数据*/
          if (data.bidTypeData[key]) {
            this[key] = data.bidTypeData[key]
          }
        }
      })
    },
    // 查看
    detail(row) {
      this.$emit('checkDetail', row)
    },
    // 编辑
    edit(row) {
      this.$emit('edit', row)
    },
    // 删除
    deleteHandel(row) {
      this.$emit('deleteHandel', row)
    },
    sortChange: function(column, prop, order) {
      let orderType = ''
      switch (column.order) {
        case 'ascending':
          orderType = 'ASC'
          break
        case 'descending':
          orderType = 'DESC'
          break
      }
      this.$emit('orderData', { column: column.prop, orderSort: orderType })
    }
  }
}
</script>
