warehouseDetail.vue

<template>
  <!-- 订单获取入仓记录 -->
  <el-dialog :title="title" visible :before-close="closeDialog" :close-on-click-modal="false" width="95%" append-to-body>
    <el-table v-if="warehouseItem && warehouseItem.orderWarehouseInBackItemDoList" :data="warehouseItem.orderWarehouseInBackItemDoList">
      <el-table-column type="index" :label="$t('序号')" />
      <el-table-column :label="$t('箱数')" prop="cartonsNum">
        <template slot-scope="{row}">
          <template v-if="row.orderWarehouseInDetailsVOList && row.orderWarehouseInDetailsVOList.length">
            <WarehouseRecordDetail v-model="row.orderWarehouseInDetailsVOList" :num="row.cartonsNum" text readonly />
          </template>
          <template v-else>{{ row.cartonsNum }}</template>
        </template>
      </el-table-column>
      <el-table-column :label="$t('入仓类型')" prop="cartonsNum">
        <template slot-scope="{row}">
          <dict-tag :type="DICT_TYPE.WAREHOUSING_SPECIFICATION_TYPE" :value="row.specificationType" />
        </template>
      </el-table-column>
      <el-table-column :label="$t('包装类型')" prop="unit">
        <template slot-scope="{row}">
          <dict-tag :type="DICT_TYPE.ECW_PACKAGING_TYPE" :value="row.unit" />
        </template>
      </el-table-column>
      <el-table-column :label="$t('长')" prop="boxGauge">
        <template slot-scope="{row}">
          {{row.boxGauge.split('*')[0]}}
        </template>
      </el-table-column>
      <el-table-column :label="$t('宽')" prop="boxGauge">
        <template slot-scope="{row}">
          {{row.boxGauge.split('*')[1]}}
        </template>
      </el-table-column>
      <el-table-column :label="$t('高')" prop="boxGauge">
        <template slot-scope="{row}">
          {{row.boxGauge.split('*')[2]}}
        </template>
      </el-table-column>
      <el-table-column :label="$t('体积') + '(m³)'" prop="volume" />
      <el-table-column :label="$t('重量') + '(kg)'" prop="weight" />
      <el-table-column :label="$t('数量（个）')" prop="quantityAll" />
      <el-table-column :label="$t('快递单号')" prop="expressNo" />
      <el-table-column :label="$t('储位')" align="center" prop="positionNo" width="250px">
        <template slot-scope="{row}">{{row.orderLocationBackVOList.map(e => (e.areaName + (e.locationName === null ? '' : e.locationName))).join(',')}}</template>
      </el-table-column>
      <el-table-column :label="$t('首次入仓时间')" prop="inTime">
        <template slot-scope="{row}">{{row.inTime|parseTime}}</template>
      </el-table-column>
    </el-table>
  </el-dialog>
</template>
<script>
import { getOrder, getOrderWarehouseIn } from "@/api/ecw/order";
import WarehouseRecordDetail from '@/views/ecw/order/warehousing/components/WarehouseRecordDetail.vue'
import { parseTime } from "@/utils/ruoyi";
export default {
  filters: { parseTime },
   components: {
    WarehouseRecordDetail
  },
  props: {
    order: Object, // order 和 orderId 二选一
    orderId: Number,
    orderItemId: Number,
  },
  data() {
    return {
      orderDetail: null,
      warehouseList: null,
    };
  },
  computed: {
    info() {
      return this.orderDetail || this.order;
    },
    orderItem() {
      if (!this.info) return null;
      return this.info.orderItemVOList.find(
        (item) => item.orderItemId == this.orderItemId
      );
    },
    warehouseItem() {
      if (!this.warehouseList) return [];
      return (
        this.warehouseList.find(
          (item) => item.orderItemId == this.orderItemId
        ) || []
      );
    },
    title() {
      if (!this.orderItem) return "-";
      return this.$l(this.orderItem, "prodTitle") + " - " + this.$t("入仓记录");
    }
  },

  created() {
    this.show = true;
    if (!this.order && this.orderId) {
      getOrder(this.orderId).then((res) => {
        this.orderDetail = res.data;
      });
    }
    this.getOrderWarehouseIn();
  },
  methods: {
    closeDialog() {
      this.show = false;
      this.$emit("close");
    },
    getOrderWarehouseIn() {
      getOrderWarehouseIn(this.info.orderId).then((res) => {
        this.warehouseList = res.data;
      });
    },
  },
};
</script>