<!--
  @description: 采购计划-计划查询待打包列表，表格数据
  @author: lxl
  @date： 2020-11-02 13:32
-->
<template>
  <el-table
    ref="smallTable"
    v-loading="loading"
    :data="tableData"
    :row-key="getRowKeys"
    :stripe="stripeFlag"
    :row-class-name="fileIsClass"
    @selection-change="handleSelectionChange"
    @sort-change="sortChange"
  >
    <!-- <el-table-column
      :reserve-selection="selFlag"
      type="selection"
      width="60px"
      align="center"
      fixed="left"
    /> -->
    <el-table-column
      type="index"
      label="序号"
      width="60px"
      align="center"
      fixed="left"
    />
    <el-table-column prop="importPackCode" sortable="custom" min-width="100" label="打包序号" align="center" fixed="left" />
    <el-table-column prop="purchaseNo" sortable="custom" min-width="150" label="行项目编号" header-align="center" align="left" />
    <el-table-column prop="purchaseCode" sortable="custom" min-width="110" label="物资编码" align="center" fixed="left" />
    <el-table-column prop="purchaseName" sortable="custom" min-width="150" label="物资名称" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="tenderMethod" min-width="150" label="采购方式" align="center">
      <template slot-scope="scope">
        {{ filterDictText(tenderMethodList,scope.row.tenderMethod) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="suppliersName" min-width="150" label="供货厂商" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchaseBrand" min-width="150" label="品牌" header-align="center" align="left" />
    <el-table-column prop="purchaseClassificationParent" width="150" label="一级专业分类" header-align="center" />
    <el-table-column sortable="custom" prop="purchaseClassification" min-width="150" label="二级专业分类" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchaseSpecification" min-width="220" label="物资描述" header-align="center" align="left" />
    <!-- <el-table-column sortable="custom" prop="resultExeNo" min-width="150" label="结果执行编号" header-align="center" align="left" />
    <el-table-column sortable="custom" min-width="100" label="是否集采" align="center">
      <template slot-scope="scope">
        {{ filterDictText(collectionTypeList,scope.row.collectionType) }}
      </template>
    </el-table-column> -->
    <el-table-column sortable="custom" prop="purchaseNum" min-width="110" label="数量" header-align="center" align="right" />
    <el-table-column sortable="custom" prop="purchaseUnit" width="100" label="计量单位" align="center">
      <template slot-scope="scope">
        {{ filterDictText(purchaseUnitList,scope.row.purchaseUnit) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="purchaseBudget" width="130" label="预算净单价(元)" header-align="center" align="right">
      <template slot-scope="scope">
        {{ scope.row.purchaseBudget && numFilter(scope.row.purchaseBudget) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" width="130" label="预算净总价(元)" header-align="center" align="right">
      <template slot-scope="scope">
        {{ scope.row.purchaseTotalBudget && numFilter(scope.row.purchaseTotalBudget) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="purchaseTaxRate" min-width="150" label="税率(%)" header-align="center" align="left">
      <template slot-scope="scope">
        {{ filterDictText(taxRateList,scope.row.purchaseTaxRate) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="deliveryTime" min-width="110" label="交货日期" align="center">
      <template slot-scope="scope">
        {{ scope.row.deliveryTime && $Moment(scope.row.deliveryTime).format(momentDate) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="deliveryAddress" min-width="220" label="交货地点" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchaseDepartName" min-width="220" label="采购单位" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchaseUserRealName" min-width="150" label="上报人" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="planManagerName" min-width="150" label="技术联系人/电话" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="remark" min-width="220" label="备注" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchaseUserRealName" min-width="150" label="采购员" header-align="center" align="left" />
    <el-table-column sortable="custom" prop="purchasePlanNo" min-width="150" label="采购计划编号" header-align="center" align="left" />
    <!-- 预算编号 -->
    <el-table-column
      min-width="160"
      sortable="custom"
      prop="ykNo"
      label="预算编号"
      header-align="center"
      align="left"
    />
    <!-- 预算年度 -->
    <el-table-column
      min-width="180"
      sortable="custom"
      prop="ykYear"
      label="预算年度"
      header-align="center"
      align="left"
    />
    <!-- 计划编号 -->
    <el-table-column
      min-width="180"
      sortable="custom"
      prop="ykPlanno"
      label="计划编号"
      header-align="center"
      align="left"
    />
    <!-- Book ID -->
<!--    <el-table-column
      min-width="180"
      sortable="custom"
      prop="ykBookid"
      label="Book ID"
      header-align="center"
      align="left"
    />-->
    <!-- 计划名称 -->
    <el-table-column
      min-width="180"
      prop="ykPlannoT"
      label="计划名称"
      header-align="center"
      align="left"
    />
    <!-- 预算编号描述 -->
    <el-table-column
      min-width="230"
      prop="post1"
      label="预算编号描述"
      header-align="center"
      align="left"
    />
    <el-table-column sortable="custom" prop="createTime" min-width="110" label="创建日期" align="center">
      <template slot-scope="scope">
        {{ scope.row.createTime && $Moment(scope.row.createTime).format(momentDate) }}
      </template>
    </el-table-column>
    <el-table-column sortable="custom" prop="approvalTime" min-width="110" label="批准日期" align="center">
      <template slot-scope="scope">
        {{ scope.row.approvalTime && $Moment(scope.row.approvalTime).format(momentDate) }}
      </template>
    </el-table-column>
    <el-table-column width="80" fixed="right" label="附件" align="center">
      <template slot-scope="scope">
        <el-link v-if="scope.row.isContainAttachment==='1'" type="primary" @click.stop="checkAccessory(scope.row)">
          查看
        </el-link>
      </template>
    </el-table-column>
  </el-table>
</template>
<script>
import { filterDictText, numFilter } from '@/assets/js/utils' // 字典方法
// import { procurementPlanGrounpMixins } from '@views/procurement/procurementPlan/mixins/procurementPlanGroupMixins' // 字典信息
export default {
  name: 'StayBaleTable',
  // mixins: [procurementPlanGrounpMixins],
  props: {
    tableData: {
      type: Array,
      default: () => []
    },
    loading: {
      type: Boolean,
      default: true
    },
    selFlag: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      stripeFlag: true, // table斑马纹状态
      tenderMethodList: [], // 采购方式
      // collectionTypeList: [], // 是否集采
      taxRateList: [], // 税率
      purchaseUnitList: [], // 计量单位
      dictionaryType: ['tenderMethod', 'taxRate', 'purchaseUnit']
    }
  },
  created() {
    this.getGroupType() // 字典请求初始化
  },
  // // 组件离开清空选中
  // beforeDestroy() {
  //   this.empitSel()
  // },
  methods: {
    filterDictText,
    numFilter,
    // 字典请求
    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]
          }
        }
      })
    },
    // 附件查看
    checkAccessory(row) {
      this.$emit('checkFile', row)
    },
    // 获取row的key值优化表格的渲染
    getRowKeys(row) {
      return row.planDetailId
    },
    // 选择事件
    handleSelectionChange(row) {
      this.$emit('delMultiple', row)
    },
    // 清空复选框选中
    empitSel() {
      this.$refs.smallTable.clearSelection()
    },
    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 })
    },
    // 判断附件动态添加类名
    fileIsClass({ row }) {
      if (row.isContainAttachment === '1') {
        this.stripeFlag = false
        return 'rowRed'
      }
      return ''
    }
  }
}
</script>
<style lang="less" scoped>
@import "~@assets/style/procurement/procurement.rewrite.element";

</style>
