kd-aiot-frontend-wms/src/views/warehouseManagement/stockLedger/batchDetails.vue

<template>
  <div id="stockLedger__batchDetails">
    <!--    <div class="page-title">
      <PageHeader :title="`批次号${baseInfo.batchNum || ''}`"></PageHeader>
    </div> -->
    <div class="content-detail">
      <el-tabs v-model="activeName">
        <el-tab-pane label="基本信息" name="zero">
          <BaseInfo :baseInfo="baseInfo" ref="baseInfoRef"></BaseInfo>
          <warehouseConfigVue ref="warehouseConfigRef"></warehouseConfigVue>
        </el-tab-pane>
        <!-- <el-tab-pane label="库存明细" name="first">
          <WarehouseDetail
            :baseInfo="baseInfo"
            :baseParams="baseParams"
            :stockList="stockList"
            ref="WarehouseDetailRef"
          ></WarehouseDetail>
        </el-tab-pane>
        <el-tab-pane label="批次明细" name="pcmx">
          <BatchDetail></BatchDetail>
        </el-tab-pane> -->
        <el-tab-pane label="入库单" name="second" lazy>
          <InWarehouse :baseInfo="baseInfo" :baseParams="baseParams" />
        </el-tab-pane>
        <el-tab-pane label="调拨记录" name="third" lazy>
          <InventoryAllocation :baseInfo="baseInfo" :baseParams="baseParams" />
        </el-tab-pane>
        <el-tab-pane label="出库单" name="fourth" lazy>
          <OutWarehouse :baseInfo="baseInfo" :baseParams="baseParams" />
        </el-tab-pane>
        <el-tab-pane label="报损报溢" name="fifth" lazy>
          <ReportLoss :baseInfo="baseInfo" :baseParams="baseParams" />
        </el-tab-pane>
        <el-tab-pane label="质检单" name="sixth" lazy v-if="baseInfo.assetType == 3"></el-tab-pane>

        <el-tab-pane label="库存明细" name="seventeen" lazy>
          <InventoryDetails :categoryCode="categoryCode" />
        </el-tab-pane>
      </el-tabs>

      <template v-if="activeName === 'sixth'">
        <img class="certificate" :src="certificate" />
      </template>
    </div>
  </div>
</template>

<script>
import BaseInfo from './components/details/BaseInfo.vue';
import OutWarehouse from './components/details/OutWarehouse.vue';
import InWarehouse from './components/details/InWarehouse.vue';
import ReportLoss from './components/details/ReportLoss.vue';
import InventoryDetails from './components/details/InventoryDetails.vue';
import InventoryAllocation from './components/details/InventoryAllocation.vue';
import WarehouseDetail from './components/details/WarehouseDetail.vue';
import BatchDetail from './components/details/BatchDetail.vue';
import warehouseConfigVue from './components/details/warehouseConfig.vue';
// import PageHeader from '@/components/PageHeader'
import BatchDetailDialog from './components/BatchDetailDialog.vue';
import {
  getCateInfo,
  getDetails,
  ledgerdetailPage,
  ledgerPage
} from '@/api/classifyManage/itemInformation';
// import outin from '@/api/warehouseManagement/outin';
export default {
  components: {
    // PageHeader,
    BaseInfo,
    BatchDetailDialog,
    InWarehouse,
    OutWarehouse,
    InventoryAllocation,
    ReportLoss,
    BatchDetail,
    WarehouseDetail,
    warehouseConfigVue,
    InventoryDetails
  },
  data() {
    return {
      activeName: 'zero',
      categoryId: '',
      tableData: {
        first: [],
        second: [],
        third: [],
        fourth: [],
        fifth: [],
        seventeen: []
      },
      certificate: '',
      stockList: []
    };
  },
  computed: {
    dimension() {
      return this.$route.query.dimension;
    },
    categoryCode() {
      return this.$route.query.categoryCode;
    },
    baseInfo() {
      return {};
      // this.$store.state.stockManagement.stockLedgerBaseInfo[
      //   this.$route.query.key
      // ] || {}
    },
    tableColumn() {
      return this.tableColumnConfig[this.activeName] || [];
    },
    baseParams() {
      return {
        // inventoryCode: this.baseInfo.assetCode,
        // // name: this.baseInfo.assetName,
        // // warehousingType: _warehousingType(this.baseInfo.assetType)
        // //   .warehousingType,
        categoryId: this.categoryId
      };
    }
  },
  created() {
    this.getDetailInfo(this.$route.query);
  },
  methods: {
    async getDetailInfo(row) {
      console.log('===', row);
      this.categoryId = row.id;
      const res = await getDetails(row.id);
      this.$nextTick(() => {
        console.log(res);
        // this.categoryId = res.categoryWms && res.categoryWms.categoryId;
        this.$refs.baseInfoRef.getDetailInfoAugr(res.category); //基本信息
        this.$refs.warehouseConfigRef.getDetailInfoAugr(res.categoryWms);
      });
      // const rep = await outin.getInventoryDetails({
      //   pageNum: 1,
      //   size: 10,
      //   categoryId: row.id
      // });
      // console.log('===', rep);
      // this.stockList = rep.list;
    },
    handleCellClick(row) {
      this.$refs.batchDetailRef.open(this.activeName, {
        ...row,
        batchNum: this.baseInfo.batchNum
      });
    }
  }
};
</script>

<style lang="scss" scoped>
#stockLedger__batchDetails {
  background: #fff;
  margin: 10px;
  height: calc(100vh - 116px);
  overflow-y: auto;

  .content-detail {
    height: 100%;
    width: 100%;
    padding: 10px 20px;
    box-sizing: border-box;

    ::v-deep .el-tabs {
      height: 100%;
      width: 100%;
      display: flex;
      flex-direction: column;

      .el-tabs__content {
        flex: 1;

        .el-tab-pane {
          height: 100%;
        }
      }
    }
  }
}
</style>