任务130 后台-集运-包裹列表-包裹详情

src/views/ecw/cons/DetailConsProd.vue

+<template>
+  <div>
+    <el-table
+      :data="list"
+      border
+      style="width: 100%">
+      <el-table-column :label="$t('序号')" width="60px" fixed>
+        <template slot-scope="scope">
+          {{ scope.$index + 1 }}
+        </template>
+      </el-table-column>
+      <el-table-column prop="prodTitleZh" :label="$t('品名')" width="220px">
+        <template slot-scope="{row}">
+          <div>{{row.prodName}}</div>
+        </template>
+      </el-table-column>
+      <el-table-column :label="`${$t('填单数据')}(${$t('个')})`">
+        <template slot-scope="{row}">
+          {{row.quantity}}
+        </template>
+      </el-table-column>
+      <el-table-column :label="`${$t('验货数据')}(${$t('个')})`">
+        <template slot-scope="{row}">
+          <el-link type="primary" @click.native="$emit('showWarehouseLogs', row,1)" v-show="row.inspectionQuantity">
+            {{row.inspectionNum}}{{$t('箱')}}
+            {{row.inspectionWeight}}Kg
+            {{row.inspectionVolume}}m³
+            {{row.inspectionQuantity}}{{$t('个')}}
+          </el-link>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+
+</template>
+
+<script>
+import ProductSelector from "@/components/ProductSelector/index.vue";
+import Template from "@/views/cms/template/index.vue";
+
+export default {
+  name: 'DetailConsProd',
+  components: {Template, ProductSelector},
+  props: {
+    list: {
+      type: Array,
+      required: true
+    },
+  },
+  methods: {
+
+  },
+  computed: {
+  },
+}
+</script>
+<style scoped>
+
+</style>

src/views/ecw/cons/detail.vue

+<template>
+  <div class="app-container" v-if="cons">
+    <el-card class="card">
+      <div slot="header" class="card-title">
+        {{ $t("快递单号") }}：{{ cons.expressNo }} - <dict-tag :type="DICT_TYPE.CONS_STATUS" :value="cons.status" />
+      </div>
+      <el-row :gutter="24">
+        <el-col :span="12" style="font-size: 16px">
+          {{ $t("ID") }}:{{ cons.consNum }}
+        </el-col>
+      </el-row>
+    </el-card>
+    <el-card class="card">
+      <div slot="header" class="card-title">
+        {{$t('发货人')}}
+      </div>
+      <el-row :gutter="24">
+        <el-col :span="24">
+          <el-descriptions class="margin-top" border  :column="3" :labelStyle="{ width: '110px' }" :contentStyle="{ width: '150px' }">
+            <el-descriptions-item :label="$t('名称')">
+              <component :is="'router-link'"
+                         :to="`/customer/query/${cons.customerId}`">{{ cons.customerName }}-{{cons.customerNumber}}
+              </component>
+            </el-descriptions-item>
+          </el-descriptions>
+        </el-col>
+      </el-row>
+    </el-card>
+    <el-card class="card">
+      <el-descriptions border :title="$t('运输')" :column="5" :labelStyle="{ width: '110px' }" :contentStyle="{ width: '150px' }">
+        <el-descriptions-item :label="$t('始发仓')">{{ $l(this.cons.initialLogisticsInfoDto, "startTitle") }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('目的仓')">
+          <div class="w-300">
+            {{ $l(this.cons.initialLogisticsInfoDto, "destCountryTitle") }} - {{ $l(this.cons.initialLogisticsInfoDto, "destCityTitle") }} -
+            {{ $l(this.cons.initialLogisticsInfoDto, "destTitle") }}
+          </div>
+        </el-descriptions-item>
+        <el-descriptions-item :label="$t('运输方式')">
+          <dict-tag :type="DICT_TYPE.ECW_TRANSPORT_TYPE" :value="cons.transportId" />
+        </el-descriptions-item>
+        <el-descriptions-item v-if="getDictData(DICT_TYPE.ECW_TRANSPORT_TYPE, cons.transportId).cssClass == 'channel'" :label="$t('出货渠道')">{{ cons.channelName }}</el-descriptions-item>
+      </el-descriptions>
+    </el-card>
+    <el-card class="card">
+      <el-descriptions class="mr-10" border :title="$t('基础')" :column="2" :labelStyle="{ width: '110px' }" :contentStyle="{ width: '150px' }">
+        <el-descriptions-item :label="$t('总货值')">{{ cons.worth }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('填单总数据')"> {{ cons.sumQuantity }} {{ $t("箱") }}</el-descriptions-item>
+        <el-descriptions-item :label="$t('入库总数据')"> {{ cons.sumQuantity }}{{ $t("箱") }} {{ cons.sumQuantity }}Kg {{ cons.sumQuantity }}m³ {{ cons.sumQuantity }}{{ $t("个") }} </el-descriptions-item>
+        <el-descriptions-item :label="$t('备注')" >{{ cons.remarks }}</el-descriptions-item>
+      </el-descriptions>
+    </el-card>
+    <el-card class="card">
+      <el-tabs v-model="activeName">
+        <el-tab-pane :label="$t('货物详情')" name="first">
+          <detail-cons-prod
+            :list="cons.consItemVOList"
+            @showWarehouseLogs="showWarehouseLogs"
+          ></detail-cons-prod>
+        </el-tab-pane>
+<!--        <el-tab-pane :label="$t('订单动态')" name="second">-->
+<!--          <el-timeline v-if="order.orderTimeVOList && order.orderTimeVOList.length" :reverse="true">-->
+<!--            <el-timeline-item v-for="(activity, index) in order.orderTimeVOList" :key="index" :timestamp="parseTime(activity.businessTime)">-->
+<!--              {{ $l(activity, "title") }}-->
+<!--              <div :class="{ red: !!activity.mark }">{{ $l(activity, "remarks") }}</div>-->
+<!--            </el-timeline-item>-->
+<!--          </el-timeline>-->
+<!--          <el-result v-else icon="info " :title="$t('暂无数据')" :subTitle="$t('暂无订单动态数据')" />-->
+<!--        </el-tab-pane>-->
+<!--        <el-tab-pane :label="$t('操作日志')" name="five" v-if="checkPermi(['ecw:order:logs'])">-->
+<!--          <el-table :data="logs" v-loading="logsLoading">-->
+<!--            <el-table-column :label="$t('时间')" width="150">-->
+<!--              <template slot-scope="{ row }">{{ row.createTime | parseTime }}</template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column :label="$t('操作人')" prop="creatorName" width="150"> </el-table-column>-->
+<!--            <el-table-column :label="$t('操作人类型')" width="100">-->
+<!--              <template slot-scope="{ row }">{{ row.userType == 1 ? $t("会员") : $t("管理员") }}</template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column :label="$t('操作类型')" prop="type" width="150"></el-table-column>-->
+<!--            <el-table-column :label="$t('操作描述')" prop="msg" width="300"></el-table-column>-->
+<!--            <el-table-column :label="$t('备注')" prop="note">-->
+<!--              <template slot-scope="{ row }">-->
+<!--                <div v-if="row.note">-->
+<!--                  <div v-for="item in parseLogNote(row.note)">-->
+<!--                    <template v-if="item.orgValue">-->
+<!--                      {{ $t("【{name}】从【{orgValue}】修改为【{newValue}】", item) }}-->
+<!--                    </template>-->
+<!--                    <template v-else>-->
+<!--                      {{ $t("【{name}】设置为【{newValue}】", item) }}-->
+<!--                    </template>-->
+<!--                  </div>-->
+<!--                </div>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+<!--            <el-table-column :label="$t('操作')" prop="note">-->
+<!--              <template slot-scope="{ row }">-->
+<!--                <el-link type="primary" @click="showLogDetailId = row.id">{{ $t("详情") }}</el-link>-->
+<!--              </template>-->
+<!--            </el-table-column>-->
+<!--          </el-table>-->
+<!--        </el-tab-pane>-->
+<!--        <el-tab-pane :label="$t('到仓详情')" name="seven">-->
+<!--          <check-detail-prod :list="warehouseCheckInfoData" :attr-list="attrList" :prod-type-list="prodTypeList" :currency-map="currencyMap" :unit-map="unitMap" :transport-id="order.transportId" :unload-time="order.unloadTime | parseTime"></check-detail-prod>-->
+<!--        </el-tab-pane>-->
+      </el-tabs>
+    </el-card>
+    <pack-detail ></pack-detail>
+  </div>
+</template>
+
+<script>
+import {getCons} from "@/api/ecw/cons";
+import { getDictDatas, DICT_TYPE, getDictData } from "@/utils/dict"
+import CheckDetailProd from "@/views/ecw/order/components/CheckDetailProd.vue";
+import DetailConsProd from "@/views/ecw/cons/DetailConsProd.vue";
+import PackHistory from "@/views/ecw/order/components/PackHistory.vue";
+import PackDetail from "@/views/ecw/cons/PackDetail.vue";
+
+export default {
+  name: "EcwConsDetail",
+  props: {},
+  components: {PackDetail, PackHistory, DetailConsProd,CheckDetailProd},
+  data() {
+    return {
+      cons:null,
+      type: 1,
+      activeName: "first",
+    }
+  },
+  watch: {},
+  computed: {
+    getDictData() {
+      return (type, value) => getDictData(type, value) || {}
+    },
+    DICT_TYPE() {
+      return DICT_TYPE
+    }
+  },
+  created() {
+    if (this.$route.query.consId) {
+      this.consId = this.$route.query.consId
+      this.getCons()
+    }
+  },
+  methods: {
+    // 显示入仓记录
+    showWarehouseLogs(row, type) {
+      this.type = type
+      this.showWarehouseInItemId = row.orderItemId
+    },
+    getCons() {
+      getCons(this.consId).then(res => {
+        this.cons = res.data
+        console.log(this.cons)
+      })
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.red {
+  color: red;
+}
+
+.card {
+  margin-bottom: 20px;
+}
+
+.card-title {
+  font-size: 18px;
+  font-weight: bold;
+}
+
+.el-dropdown-link {
+  cursor: pointer;
+  color: #409eff;
+}
+
+.el-icon-arrow-down {
+  font-size: 12px;
+}
+
+.hiddenInfo {
+  display: none;
+}
+
+.showInfo {
+  display: block;
+}
+</style>