<!--
  @description: 采购员-采购方式维护-物料采购方式维护 变更记录 表格
  @author: hdk
  @date： 2020-10-29
-->
<template>
  <div>
    <el-table ref="smallTable" v-loading="loading" :data="tableData" @sort-change="sortChange">
      <el-table-column key="1010" fixed type="index" label="序号" align="center" min-width="60" />
      <el-table-column
        key="1012"
        fixed
        prop="purchaseCode"
        sortable="custom"
        label="物资编号"
        header-align="center"
        align="left"
        min-width="140"
      />
      <el-table-column
        key="1013"
        fixed
        prop="purchaseName"
        sortable="custom"
        label="物资信息"
        min-width="140"
        header-align="center"
        align="center"
      />
      <el-table-column
        key="1015"
        prop="purchaseBrand"
        sortable="custom"
        label="品牌"
        min-width="180"
        header-align="center"
        align="center"
      />
      <el-table-column
        key="1016"
        prop="suppliersName"
        sortable="custom"
        label="供货供应商"
        min-width="180"
        header-align="center"
        align="center"
      />
      <el-table-column
        key="1017"
        prop="purchaseMethodValue"
        sortable="custom"
        label="采购方式"
        min-width="200"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          {{ filterDictText(tenderMethodList, scope.row.purchaseMethodValue) }}
        </template>
      </el-table-column>
      <el-table-column
        key="1018"
        label="创建人"
        sortable="custom"
        min-width="180"
        prop="createUserName"
        header-align="center"
        align="left"
      />
      <el-table-column
        key="1019"
        label="创建日期"
        prop="createTime"
        sortable="custom"
        min-width="110"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          {{ scope.row.createTime && $Moment(scope.row.createTime).format(momentDate) }}
        </template>
      </el-table-column>
      <el-table-column
        key="1020"
        prop="auditStatus"
        label="状态"
        sortable="custom"
        min-width="100"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          {{ filterDictText(planAuditStatusList, scope.row.auditStatus) }}
        </template>
      </el-table-column>
      <el-table-column
        key="1021"
        prop="updateReason"
        label="变更原因"
        min-width="180"
        header-align="center"
        align="center"
      />
      <el-table-column
        prop="updateUserName"
        sortable="custom"
        label="变更操作人"
        min-width="120"
        header-align="center"
        align="center"
      />
      <el-table-column
        prop="updateTime"
        sortable="custom"
        label="变更时间"
        min-width="150"
        header-align="center"
        align="center"
      >
        <template slot-scope="scope">
          {{ scope.row.updateTime && $Moment(scope.row.updateTime).format(momentDateTime) }}
        </template>
      </el-table-column>
      <el-table-column
        key="1025"
        label="操作"
        min-width="230"
        header-align="center"
        align="center"
        fixed="right"
      >
        <template slot-scope="scope">
          <el-link v-if="scope.row.auditStatus === '02'" type="primary" @click="materielAdd('02', scope.row)">
            [编辑]
          </el-link>
          <el-link v-if="scope.row.auditStatus === '02'" type="primary" @click="materielAdd('02')">
            [取消变更]
          </el-link>
          <el-link
            v-if="purchasplanMethodChangeAuditConfig"
            type="primary"
            @click.stop="onFlowTrace(scope.row)"
          >
            [流程追踪]
          </el-link>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>
<script>
import { filterDictText } from '@/assets/js/utils'// 常用方法
import { materielMixins } from './mixins/materielMixins'
export default {
  name: 'ChangeRecordTable',
  mixins: [materielMixins],
  props: {
    tableData: {
      type: Array,
      default: () => []
    },
    loading: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {}
  },
  methods: {
    filterDictText,
    // 编辑/取消变更
    materielAdd(editMode, row) {
      const params = {
        editMode,
        row
      }
      this.$emit('materielAdd', params)
    },
    // 流程追踪
    onFlowTrace(row) {
      this.$emit('onFlowTrace', 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>
