<template>
  <el-dialog :visible.sync="visible" title="入库明细" width="70%">
    <div class="info">
      <div>入库单号 {{ info.bizNum }}</div>
      <div class="search-box">
        <el-input
          v-model="searchVal"
          size="small"
          v-if="dimension === 1"
          :placeholder="`搜索${assetTypeName}编码/批次号`"
        ></el-input>
        <el-input
          v-else
          size="small"
          v-model="searchVal"
          :placeholder="`搜索${assetTypeName}编码`"
        ></el-input>
        <!-- <el-button size="small" @click="handleCreateCode"
          >批量生成二维码</el-button
        > -->
      </div>
    </div>
    <el-table
      :data="showTableData"
      height="60vh"
      class="w100"
      border
      @selection-change="handleSelectionChange"
      :header-cell-style="{ background: '#EEEEEE', border: 'none' }"
    >
      <el-table-column label="序号" type="index"></el-table-column>
      <el-table-column
        :label="`${assetTypeName}编码`"
        prop="onlyCode"
      ></el-table-column>
      <el-table-column label="包装编码" prop="num"></el-table-column>
      <el-table-column
        label="最小包装单元"
        align="center"
        prop=""
        v-if="!baseInfo.isUnpack"
      >
        <template slot-scope="{ row }">{{
          `${row.measurementUnit || ''}${row.unit}/${row.minPackUnit}`
        }}</template>
      </el-table-column>
      <el-table-column
        label="批次号"
        prop="batchNum"
        v-if="dimension == 1"
      ></el-table-column>
      <el-table-column label="生产日期" prop="manufactureTime">
        <template slot-scope="{ row }">{{
          row.manufactureTime || row.procurementTime
        }}</template></el-table-column
      >
      <el-table-column label="过期时间" prop="expirationTime"></el-table-column>
      <el-table-column label="货位" prop="" show-overflow-tooltip>
        <template slot-scope="{ row }">
          {{
            `${row.warehouseName}-${row.areaName}-${row.shelfCode}-${row.cargoSpaceCode}`
          }}
        </template>
      </el-table-column>
      <el-table-column type="selection"></el-table-column>
    </el-table>
    <QrPrint
      ref="QrPrint"
      @close="QrPrintClose"
      :config="barCodeConfig"
      :openBarCode.sync="openWindows"
    />
  </el-dialog>
</template>

<script>
  // import { getWarehouseSceneDetail } from '@/api/stockManagement/stockLedger';
  // import dictMixin from '@/mixins/dictMixins'
  // import { batchBarPrint } from '@/api/ledgerAssets/booksList'
  // import QrPrint from '@/components/print/printPDF.vue'
  import { mapGetters, mapActions } from 'vuex';

  // 条码类型枚举
  const codeTypeObj = {
    生产设备: 0,
    // 舟皿: '',
    周转车: 1,
    模具: 3,
    混合料: 4,
    混炼料: 5,
    破碎料: 6,
    返回料: 8,
    返工料: 9,
    备品备件: 10,
    车削料: 11,
    风管料: 12,
    地面料: 13
  };
  export default {
    // mixins: [dictMixin],
    // components: { QrPrint },
    props: {
      assetCode: String,
      baseInfo: {
        type: Object,
        default: () => ({})
      }
    },
    data() {
      return {
        openWindows: false,
        visible: false,
        tableData: [],
        info: {},
        barCodeConfig: [],
        searchVal: '',
        selectList: []
      };
    },
    computed: {
      dimension() {
        return this.$route.query.dimension;
      },
      showTableData() {
        return this.tableData.filter((item) => {
          if (this.searchVal) {
            return (
              (item.onlyCode && item.onlyCode.indexOf(this.searchVal)) > -1 ||
              (item.batchNum &&
                this.dimension == 1 &&
                item.batchNum.indexOf(this.searchVal)) > -1
            );
          }
          return true;
        });
      },
      assetTypeName() {
        return this.getDictValue('类型用途', this.baseInfo.assetType);
      },
      ...mapGetters(['getDictValue'])
    },
    created() {},
    methods: {
      open({ bizNum, batchNum }) {
        this.info = { bizNum, batchNum };
        this._getWarehouseSceneDetail(bizNum, batchNum);

        this.visible = true;
      },

      async _getWarehouseSceneDetail(bizNum, batchNum) {
        const res = await getWarehouseSceneDetail({
          bizNum,
          batchNum,
          bizStatus: 1,
          inventoryCode: this.assetCode
        });
        if (res?.success) {
          this.tableData = res.data;
        }
      },
      handleSelectionChange(val) {
        this.selectList = val;
      },
      handleCreateCode() {
        console.log(this.baseInfo, 222);
        const classificationArr =
          this.baseInfo?.classificationUrl?.split('-') || [];

        let index = 0;
        let barType;
        while (classificationArr[index]) {
          barType = codeTypeObj[classificationArr[index]];
          if (barType !== undefined) {
            break;
          }
          index++;
        }

        if (barType === undefined) {
          return this.$message.error('当前物品类型不支持生成二维码');
        }
        if (!this.selectList?.length) {
          return this.$message.error('请选择数据');
        }

        this.handlPrint(barType);
      },
      QrPrintClose() {
        this.barCodeConfig = [];
      },
      async handlPrint(barType) {
        this.openWindows = true;
        let params = this.selectList.map((item) => {
          return {
            barType: barType,
            bizId: item.id
          };
        });
        let _this = this;
        const res = await batchBarPrint(params);
        async function getResList() {
          for (const el of res.data) {
            const fontTypeObj = { 1: '宋体', 2: '微软雅黑', 3: 'Arial' };
            let item = el;
            item.useModeList = item.useModeList.sort((a, b) => {
              return a.barAvg.substr(4) - b.barAvg.substr(4);
            });
            const useModeList = item.useModeList;
            // 条码框数据
            _this.barCodeConfig.push({
              putType: el.putType,
              qrCode: el.qrCode,
              sizeLong: el.sizeLong,
              sizeWide: el.sizeWide,
              code1: useModeList[0].sampleData,
              code2: useModeList[1].sampleData,
              code3: useModeList[2].sampleData,
              code4: useModeList[3].sampleData,
              code5: useModeList[4].sampleData,
              code6: useModeList[5].sampleData,
              code7: useModeList[6].sampleData,
              code8: useModeList[7].sampleData,
              code9: useModeList[8].sampleData,
              code10: useModeList[9].sampleData,
              code11: useModeList[10].sampleData,
              code12: useModeList[11].sampleData,
              code13: useModeList[12].sampleData,
              code14: useModeList[13].sampleData,
              fontSizeCode1: useModeList[0].fontSize,
              fontSizeCode2: useModeList[1].fontSize,
              fontSizeCode3: useModeList[2].fontSize,
              fontSizeCode4: useModeList[3].fontSize,
              fontSizeCode5: useModeList[4].fontSize,
              fontSizeCode6: useModeList[5].fontSize,
              fontSizeCode7: useModeList[6].fontSize,
              fontSizeCode8: useModeList[7].fontSize,
              fontSizeCode9: useModeList[8].fontSize,
              fontSizeCode10: useModeList[9].fontSize,
              fontSizeCode11: useModeList[10].fontSize,
              fontSizeCode12: useModeList[11].fontSize,
              fontSizeCode13: useModeList[12].fontSize,
              fontSizeCode14: useModeList[13].fontSize,
              typefaceCode1: fontTypeObj[useModeList[0].fontType],
              typefaceCode2: fontTypeObj[useModeList[1].fontType],
              typefaceCode3: fontTypeObj[useModeList[2].fontType],
              typefaceCode4: fontTypeObj[useModeList[3].fontType],
              typefaceCode5: fontTypeObj[useModeList[4].fontType],
              typefaceCode6: fontTypeObj[useModeList[5].fontType],
              typefaceCode7: fontTypeObj[useModeList[6].fontType],
              typefaceCode8: fontTypeObj[useModeList[7].fontType],
              typefaceCode9: fontTypeObj[useModeList[8].fontType],
              typefaceCode10: fontTypeObj[useModeList[9].fontType],
              typefaceCode11: fontTypeObj[useModeList[10].fontType],
              typefaceCode12: fontTypeObj[useModeList[11].fontType],
              typefaceCode13: fontTypeObj[useModeList[12].fontType],
              typefaceCode14: fontTypeObj[useModeList[13].fontType]
            });
          }
        }
        getResList();
      }
    }
  };
</script>

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