<template>
  <div>
    <el-page-header @back="handleBack" content="详情" style="padding: 20px 20px 0 20px"></el-page-header>
    <warehousing-header page-type="details" :details="details" />
    <sales-table :dataList="dataList" :column="column"> </sales-table>
    <div class="warehousing" v-if="details.approvalName">
      <div class="diy-table-1">
        <el-row>
          <el-col :span="8" class="item">
            <div class="label">审核人</div>
            <div class="value">{{ details.approvalName }}</div>
          </el-col>
          <el-col :span="8" class="item">
            <div class="label">制单时间</div>
            <div class="value">{{ details.approvalTime }}</div>
          </el-col>
          <el-col :span="8" class="item">
            <div class="label">审核结果</div>
            <div class="value">{{ statusFilter[details.examineStatus] }}</div>
          </el-col>
          <el-col :span="24" class="item">
            <div class="label">备注</div>
            <div class="value">{{ details.approvalRemark }}</div>
          </el-col>
        </el-row>
      </div>
    </div>
  </div>
</template>

<script>
import WarehousingHeader from '@/components/WarehousingHeader/WarehousingHeader'
import SalesTable from '@/components/SalesTable/SalesTable'
import { getFrontDetail } from '@/api/stock'

export default {
  name: 'WarehouseExamine',
  props: ['detailsId', 'pageType'],
  components: {
    WarehousingHeader,
    SalesTable
  },
  data() {
    return {
      dataList: [],
      details: {},
      column: [
        {
          prop: 'materialName',
          label: '产品名称',
          width: '180'
        },
        {
          prop: 'materialOldNumber',
          label: '物料编码',
          width: '180'
        },
        {
          prop: 'specification',
          label: '规格型号',
          width: '300'
        },
        {
          prop: 'stockLockQty',
          label: '库存',
          width: '180'
        },
        {
          prop: 'directFlag',
          label: '发生方向',
          width: '180'
        },
        {
          prop: 'stockChangeQty',
          label: '数量',
          width: '180'
        },
        {
          prop: 'notes',
          label: '备注'
        }
      ],
      statusFilter: {
        SAVE: '保存',
        WAIT: '待审核',
        OK: '通过',
        FAIL: '不通过',
        CLOSE: '关闭'
      }
    }
  },
  created() {
    this.getFrontDetail()
  },
  methods: {
    getFrontDetail() {
      getFrontDetail({ id: this.detailsId }).then(res => {
        this.details = res.data
        res.data.orders.forEach(k => {
          k.directFlag = k.directFlag == 1 ? '增加' : '减少'
        })
        this.dataList = res.data.orders
      })
    },

    handleBack() {
      this.$emit('close')
    }
  }
}
</script>

<style scoped>
.warehousing {
  margin: 20px;
  padding: 20px;
  box-shadow: 0 0 8px 0 rgb(0 0 0 / 20%);
}
</style>
