<template>
  <div class="batchDetailDialog">
    <el-dialog :visible.sync="visible" :title="`${title}明细`" width="70%">
      <div class="info">
        <div>批次号 {{ info.batchNum }}</div>
        <div>{{ title }} {{ info.bizNum }}</div>
      </div>
      <el-table
        :data="tableData"
        height="500px"
        class="w100"
        border
        :header-cell-style="{ background: '#EEEEEE', border: 'none' }"
      >
        <el-table-column label="序号" type="index"></el-table-column>
        <el-table-column label="编号" prop="num"></el-table-column>
        <el-table-column
          label="生产日期"
          prop="manufactureTime"
        ></el-table-column>
        <el-table-column label="过期日期" prop=""></el-table-column>
        <el-table-column label="最小单元" prop="">
          <template slot-scope="{ row }">{{
            `${row.measurementUnit || ''}${row.unit}/${row.minPackUnit}`
          }}</template>
        </el-table-column>
        <el-table-column
          label="货位"
          prop=""
          v-if="title !== '调拨单号'"
          show-overflow-tooltip
        >
          <template slot-scope="{ row }">{{
            `${row.warehouseName}-${row.areaName}-${row.shelfCode}-${row.cargoSpaceCode}`
          }}</template>
        </el-table-column>
        <el-table-column
          label="调出货位"
          prop="warehouseName"
          v-if="title === '调拨单号'"
        >
          <template slot-scope="{ row }">
            {{ row.warehouseName }} - {{ row.outWarehouseAreaName }} -
            {{ row.outWarehouseAreaGoodsCode }} -
            {{ row.outGoodsAllocationCode }}
          </template>
        </el-table-column>
        <el-table-column
          label="调入货位"
          prop="inWarehouseName"
          v-if="title === '调拨单号'"
        >
          <template slot-scope="{ row }">
            {{ row.inWarehouseName }} - {{ row.inWarehouseAreaName }} -
            {{ row.inWarehouseAreaGoodsCode }} - {{ row.inGoodsAllocationCode }}
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </div>
</template>

<script>
  // import { titleCof } from '../enums'
  // import {
  //   getWarehouseSceneDetail,
  //   getTransferDetail
  // } from '@/api/stockManagement/stockLedger'
  export default {
    props: {
      assetCode: String
    },
    data() {
      return {
        visible: false,
        title: '',
        tableData: [],
        info: {}
      };
    },
    methods: {
      open(active, { bizNum, batchNum, dialNumber }) {
        this.title = titleCof[active];
        this.info = { bizNum, batchNum };
        switch (active) {
          case 'second':
            this._getWarehouseSceneDetail(bizNum, batchNum, 1);
            break;
          case 'third':
            this.info.bizNum = dialNumber;
            this._getTransferDetail(dialNumber, batchNum, 1);
            break;
          case 'fourth':
            this._getWarehouseSceneDetail(bizNum, batchNum, 2);
            break;

          default:
            break;
        }

        this.visible = true;
      },
      async _getWarehouseSceneDetail(bizNum, batchNum, bizStatus) {
        const res = await getWarehouseSceneDetail({
          bizNum,
          batchNum,
          bizStatus,
          inventoryCode: this.assetCode
        });
        if (res?.success) {
          this.tableData = res.data;
        }
      },
      async _getTransferDetail(bizNum, batchNum) {
        const res = await getTransferDetail({
          bizNum,
          batchNum,
          inventoryCode: this.assetCode
        });
        if (res?.success) {
          this.tableData = res.data;
        }
      }
    }
  };
</script>

<style lang="scss" scoped>
  .batchDetailDialog {
    .info {
      font-weight: bold;
      color: #000;
      display: flex;
      justify-content: space-around;
      align-items: center;
      margin-bottom: 20px;
    }
  }
</style>
