|
@@ -113,532 +113,11 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getOrderShipmentList, getShipmentItemList, getShipmentTrackingList } from '@/api/shipment'
|
|
|
-import {
|
|
|
- SHIPMENT_STATUS_OPTIONS,
|
|
|
- getShipmentStatusLabel,
|
|
|
- getShipmentStatusType,
|
|
|
- getTrackingStatusType,
|
|
|
- getExceptionStatusLabel,
|
|
|
- getExceptionStatusType
|
|
|
-} from '@/constants/shipment'
|
|
|
-import { mapGetters } from 'vuex'
|
|
|
+import shipStatusMixin from './shipStatusMixin';
|
|
|
|
|
|
-/**
|
|
|
- * 物流跟踪记录类型定义
|
|
|
- * @typedef {Object} TrackingRecord
|
|
|
- * @property {string} id - 记录ID
|
|
|
- * @property {string} createUser - 创建用户ID
|
|
|
- * @property {string} createDept - 创建部门ID
|
|
|
- * @property {string} createTime - 创建时间
|
|
|
- * @property {string} updateUser - 更新用户ID
|
|
|
- * @property {string} updateTime - 更新时间
|
|
|
- * @property {1} status - 状态(1正常)
|
|
|
- * @property {0} isDeleted - 是否删除(0未删除)
|
|
|
- * @property {number} shipmentId - 发货单ID
|
|
|
- * @property {string} shipmentNo - 发货单号
|
|
|
- * @property {string} trackingNo - 运单号
|
|
|
- * @property {string} trackingStatus - 跟踪状态
|
|
|
- * @property {string} location - 位置
|
|
|
- * @property {string} eventTime - 事件时间
|
|
|
- * @property {string} eventDesc - 事件描述
|
|
|
- * @property {0|1} isException - 是否异常(0正常,1异常)
|
|
|
- * @property {string|null} exceptionType - 异常类型
|
|
|
- */
|
|
|
-
|
|
|
-/**
|
|
|
- * 发货状态查询组件
|
|
|
- * @description 提供发货单状态查询、明细查看、物流跟踪等功能
|
|
|
- */
|
|
|
export default {
|
|
|
- name: 'ShipmentStatusQuery',
|
|
|
-
|
|
|
- data() {
|
|
|
- return {
|
|
|
- /** @type {Record<string, any>} 表单数据 */
|
|
|
- form: {},
|
|
|
- /** @type {Record<string, any>} 查询参数 */
|
|
|
- query: {},
|
|
|
- /** @type {boolean} 加载状态 */
|
|
|
- loading: true,
|
|
|
- /** @type {{pageSize: number, currentPage: number, total: number}} 分页信息 */
|
|
|
- page: {
|
|
|
- pageSize: 10,
|
|
|
- currentPage: 1,
|
|
|
- total: 0
|
|
|
- },
|
|
|
- /** @type {Array<Record<string, any>>} 表格数据 */
|
|
|
- data: [],
|
|
|
-
|
|
|
- // 明细相关
|
|
|
- /** @type {boolean} 明细对话框显示状态 */
|
|
|
- detailDialogVisible: false,
|
|
|
- /** @type {boolean} 明细加载状态 */
|
|
|
- detailLoading: false,
|
|
|
- /** @type {Array<Record<string, any>>} 明细数据 */
|
|
|
- detailData: [],
|
|
|
- /** @type {{pageSize: number, currentPage: number, total: number}} 明细分页信息 */
|
|
|
- detailPage: {
|
|
|
- pageSize: 10,
|
|
|
- currentPage: 1,
|
|
|
- total: 0
|
|
|
- },
|
|
|
- /** @type {Record<string, any>|null} 当前选中的发货单 */
|
|
|
- currentShipment: null,
|
|
|
-
|
|
|
- // 跟踪相关
|
|
|
- /** @type {boolean} 跟踪对话框显示状态 */
|
|
|
- trackingDialogVisible: false,
|
|
|
- /** @type {boolean} 跟踪加载状态 */
|
|
|
- trackingLoading: false,
|
|
|
- /** @type {Array<TrackingRecord>} 跟踪数据 */
|
|
|
- trackingData: [],
|
|
|
- /** @type {{pageSize: number, currentPage: number, total: number}} 跟踪分页信息 */
|
|
|
- trackingPage: {
|
|
|
- pageSize: 10,
|
|
|
- currentPage: 1,
|
|
|
- total: 0
|
|
|
- },
|
|
|
-
|
|
|
- // 主表配置
|
|
|
- /** @type {Record<string, any>} 主表配置 */
|
|
|
- option: {
|
|
|
- height: 'auto',
|
|
|
- calcHeight: 30,
|
|
|
- tip: false,
|
|
|
- searchShow: true,
|
|
|
- searchMenuSpan: 6,
|
|
|
- border: true,
|
|
|
- index: true,
|
|
|
- viewBtn: true,
|
|
|
- editBtn: false,
|
|
|
- delBtn: false,
|
|
|
- addBtn: false,
|
|
|
- column: [
|
|
|
- {
|
|
|
- label: '发货单号',
|
|
|
- prop: 'shipmentNo',
|
|
|
- search: true,
|
|
|
- width: 150
|
|
|
- },
|
|
|
- {
|
|
|
- label: '订单编号',
|
|
|
- prop: 'orderCode',
|
|
|
- search: true,
|
|
|
- width: 150
|
|
|
- },
|
|
|
- {
|
|
|
- label: '发货日期',
|
|
|
- prop: 'shipmentDate',
|
|
|
- type: 'date',
|
|
|
- format: 'YYYY-MM-DD',
|
|
|
- valueFormat: 'YYYY-MM-DD',
|
|
|
- search: true,
|
|
|
- searchRange: true,
|
|
|
- width: 120
|
|
|
- },
|
|
|
- {
|
|
|
- label: '承运商',
|
|
|
- prop: 'carrierName',
|
|
|
- search: true,
|
|
|
- width: 120
|
|
|
- },
|
|
|
- {
|
|
|
- label: '运单号',
|
|
|
- prop: 'trackingNo',
|
|
|
- search: true,
|
|
|
- width: 150
|
|
|
- },
|
|
|
- {
|
|
|
- label: '运输方式',
|
|
|
- prop: 'shippingMethod',
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '发货状态',
|
|
|
- prop: 'shipmentStatus',
|
|
|
- slot: true,
|
|
|
- search: true,
|
|
|
- type: 'select',
|
|
|
- dicData: SHIPMENT_STATUS_OPTIONS,
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '包裹数',
|
|
|
- prop: 'totalPackages',
|
|
|
- width: 80
|
|
|
- },
|
|
|
- {
|
|
|
- label: '总重量(kg)',
|
|
|
- prop: 'totalWeight',
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '总体积(m³)',
|
|
|
- prop: 'totalVolume',
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '发货人',
|
|
|
- prop: 'shipperName',
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '创建时间',
|
|
|
- prop: 'createTime',
|
|
|
- type: 'datetime',
|
|
|
- format: 'yyyy-MM-dd HH:mm:ss',
|
|
|
- width: 160
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
-
|
|
|
- // 明细表配置
|
|
|
- /** @type {Record<string, any>} 明细表配置 */
|
|
|
- detailOption: {
|
|
|
- height: 400,
|
|
|
- tip: false,
|
|
|
- border: true,
|
|
|
- index: true,
|
|
|
- menu: false,
|
|
|
- addBtn: false,
|
|
|
- column: [
|
|
|
- {
|
|
|
- label: '物料编码',
|
|
|
- prop: 'itemCode',
|
|
|
- width: 120
|
|
|
- },
|
|
|
- {
|
|
|
- label: '物料名称',
|
|
|
- prop: 'itemName',
|
|
|
- width: 150
|
|
|
- },
|
|
|
- {
|
|
|
- label: '规格',
|
|
|
- prop: 'specs',
|
|
|
- width: 120
|
|
|
- },
|
|
|
- {
|
|
|
- label: '发货数量',
|
|
|
- prop: 'shippedQuantity',
|
|
|
- width: 100
|
|
|
- },
|
|
|
- {
|
|
|
- label: '包装号',
|
|
|
- prop: 'packageNo',
|
|
|
- width: 120
|
|
|
- },
|
|
|
- {
|
|
|
- label: '批次号',
|
|
|
- prop: 'batchNo',
|
|
|
- width: 120
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
-
|
|
|
- // 跟踪表配置
|
|
|
- /** @type {Record<string, any>} 跟踪表配置 */
|
|
|
- trackingOption: {
|
|
|
- height: 400,
|
|
|
- tip: false,
|
|
|
- border: true,
|
|
|
- index: true,
|
|
|
- menu: false,
|
|
|
- addBtn: false,
|
|
|
- editBtn: false,
|
|
|
- delBtn: false,
|
|
|
- viewBtn: false,
|
|
|
- selection: false,
|
|
|
- column: [
|
|
|
- {
|
|
|
- label: 'ID',
|
|
|
- prop: 'id',
|
|
|
- width: 180,
|
|
|
- hide: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '发货单号',
|
|
|
- prop: 'shipmentNo',
|
|
|
- width: 140,
|
|
|
- search: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '运单号',
|
|
|
- prop: 'trackingNo',
|
|
|
- width: 150,
|
|
|
- search: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '跟踪状态',
|
|
|
- prop: 'trackingStatus',
|
|
|
- slot: true,
|
|
|
- width: 100,
|
|
|
- search: true,
|
|
|
- type: 'select',
|
|
|
- dicData: [
|
|
|
- { label: '待发货', value: '待发货' },
|
|
|
- { label: '已发货', value: '已发货' },
|
|
|
- { label: '运输中', value: '运输中' },
|
|
|
- { label: '派送中', value: '派送中' },
|
|
|
- { label: '已送达', value: '已送达' },
|
|
|
- { label: '已签收', value: '已签收' },
|
|
|
- { label: '异常', value: '异常' }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '当前位置',
|
|
|
- prop: 'location',
|
|
|
- width: 200,
|
|
|
- search: true,
|
|
|
- overHidden: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '事件时间',
|
|
|
- prop: 'eventTime',
|
|
|
- type: 'datetime',
|
|
|
- format: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- valueFormat: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- width: 160,
|
|
|
- search: true,
|
|
|
- searchRange: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '事件描述',
|
|
|
- prop: 'eventDesc',
|
|
|
- width: 250,
|
|
|
- search: true,
|
|
|
- overHidden: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '异常状态',
|
|
|
- prop: 'isException',
|
|
|
- slot: true,
|
|
|
- width: 100,
|
|
|
- search: true,
|
|
|
- type: 'select',
|
|
|
- dicData: [
|
|
|
- { label: '正常', value: 0 },
|
|
|
- { label: '异常', value: 1 }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- label: '异常类型',
|
|
|
- prop: 'exceptionType',
|
|
|
- width: 120,
|
|
|
- search: true,
|
|
|
- hide: false
|
|
|
- },
|
|
|
- {
|
|
|
- label: '创建时间',
|
|
|
- prop: 'createTime',
|
|
|
- type: 'datetime',
|
|
|
- format: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- width: 160,
|
|
|
- hide: true
|
|
|
- },
|
|
|
- {
|
|
|
- label: '更新时间',
|
|
|
- prop: 'updateTime',
|
|
|
- type: 'datetime',
|
|
|
- format: 'YYYY-MM-DD HH:mm:ss',
|
|
|
- width: 160,
|
|
|
- hide: true
|
|
|
- }
|
|
|
- ]
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- computed: {
|
|
|
- ...mapGetters(['permission'])
|
|
|
- },
|
|
|
-
|
|
|
- created() {
|
|
|
- this.onLoad()
|
|
|
- },
|
|
|
-
|
|
|
- methods: {
|
|
|
- // 导入的工具函数
|
|
|
- getShipmentStatusLabel,
|
|
|
- getShipmentStatusType,
|
|
|
- getTrackingStatusType,
|
|
|
- getExceptionStatusLabel,
|
|
|
- getExceptionStatusType,
|
|
|
-
|
|
|
- /**
|
|
|
- * 加载数据
|
|
|
- * @returns {Promise<void>}
|
|
|
- */
|
|
|
- async onLoad() {
|
|
|
- this.loading = true
|
|
|
- try {
|
|
|
- const res = await getOrderShipmentList({
|
|
|
- ...this.query,
|
|
|
- current: this.page.currentPage,
|
|
|
- size: this.page.pageSize
|
|
|
- })
|
|
|
- const data = res.data.data
|
|
|
- this.data = data.records
|
|
|
- this.page.total = data.total
|
|
|
- } catch (error) {
|
|
|
- console.error('加载发货数据失败:', error)
|
|
|
- } finally {
|
|
|
- this.loading = false
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 搜索
|
|
|
- * @param {Record<string, any>} params - 搜索参数
|
|
|
- * @param {Function} done - 完成回调
|
|
|
- */
|
|
|
- searchChange(params, done) {
|
|
|
- this.query = params
|
|
|
- this.page.currentPage = 1
|
|
|
- this.onLoad()
|
|
|
- done()
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 重置搜索
|
|
|
- */
|
|
|
- searchReset() {
|
|
|
- this.query = {}
|
|
|
- this.page.currentPage = 1
|
|
|
- this.onLoad()
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 分页大小改变
|
|
|
- * @param {number} pageSize - 页面大小
|
|
|
- */
|
|
|
- sizeChange(pageSize) {
|
|
|
- this.page.pageSize = pageSize
|
|
|
- this.onLoad()
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 当前页改变
|
|
|
- * @param {number} currentPage - 当前页
|
|
|
- */
|
|
|
- currentChange(currentPage) {
|
|
|
- this.page.currentPage = currentPage
|
|
|
- this.onLoad()
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 行点击
|
|
|
- * @param {Record<string, any>} row - 行数据
|
|
|
- * @param {Record<string, any>} column - 列信息
|
|
|
- * @param {Event} event - 事件对象
|
|
|
- */
|
|
|
- rowClick(row, column, event) {
|
|
|
- this.viewDetails(row)
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 查看明细
|
|
|
- * @param {Record<string, any>} row - 行数据
|
|
|
- */
|
|
|
- viewDetails(row) {
|
|
|
- this.currentShipment = row
|
|
|
- this.detailDialogVisible = true
|
|
|
- this.loadShipmentDetails(row.shipmentNo)
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 加载发货明细
|
|
|
- * @param {string} shipmentNo - 发货单号
|
|
|
- * @returns {Promise<void>}
|
|
|
- */
|
|
|
- async loadShipmentDetails(shipmentNo) {
|
|
|
- this.detailLoading = true
|
|
|
- try {
|
|
|
- const res = await getShipmentItemList({
|
|
|
- shipmentNo: shipmentNo,
|
|
|
- current: this.detailPage.currentPage,
|
|
|
- size: this.detailPage.pageSize
|
|
|
- })
|
|
|
- const data = res.data.data
|
|
|
- this.detailData = data.records
|
|
|
- this.detailPage.total = data.total
|
|
|
- } catch (error) {
|
|
|
- console.error('加载发货明细失败:', error)
|
|
|
- } finally {
|
|
|
- this.detailLoading = false
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 明细分页大小改变
|
|
|
- * @param {number} pageSize - 页面大小
|
|
|
- */
|
|
|
- detailSizeChange(pageSize) {
|
|
|
- this.detailPage.pageSize = pageSize
|
|
|
- this.loadShipmentDetails(this.currentShipment.shipmentNo)
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 明细当前页改变
|
|
|
- * @param {number} currentPage - 当前页
|
|
|
- */
|
|
|
- detailCurrentChange(currentPage) {
|
|
|
- this.detailPage.currentPage = currentPage
|
|
|
- this.loadShipmentDetails(this.currentShipment.shipmentNo)
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 查看物流跟踪
|
|
|
- * @param {Record<string, any>} row - 行数据
|
|
|
- */
|
|
|
- viewTracking(row) {
|
|
|
- this.currentShipment = row
|
|
|
- this.trackingDialogVisible = true
|
|
|
- this.loadTrackingInfo(row.shipmentNo)
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 加载物流跟踪信息
|
|
|
- * @param {string} shipmentNo - 发货单号
|
|
|
- * @returns {Promise<void>}
|
|
|
- */
|
|
|
- async loadTrackingInfo(shipmentNo) {
|
|
|
- this.trackingLoading = true
|
|
|
- try {
|
|
|
- const res = await getShipmentTrackingList({
|
|
|
- shipmentNo: shipmentNo,
|
|
|
- current: this.trackingPage.currentPage,
|
|
|
- size: this.trackingPage.pageSize
|
|
|
- })
|
|
|
-
|
|
|
- const data = res.data.data
|
|
|
- this.trackingData = data.records
|
|
|
- this.trackingPage.total = data.total
|
|
|
- } catch (error) {
|
|
|
- console.error('加载物流跟踪信息失败:', error)
|
|
|
- } finally {
|
|
|
- this.trackingLoading = false
|
|
|
- }
|
|
|
- },
|
|
|
-
|
|
|
- /**
|
|
|
- * 跟踪分页大小改变
|
|
|
- * @param {number} pageSize - 页面大小
|
|
|
- */
|
|
|
- trackingSizeChange(pageSize) {
|
|
|
- this.trackingPage.pageSize = pageSize
|
|
|
- this.loadTrackingInfo(this.currentShipment.shipmentNo)
|
|
|
- },
|
|
|
+ mixins: [shipStatusMixin],
|
|
|
|
|
|
- /**
|
|
|
- * 跟踪当前页改变
|
|
|
- * @param {number} currentPage - 当前页
|
|
|
- */
|
|
|
- trackingCurrentChange(currentPage) {
|
|
|
- this.trackingPage.currentPage = currentPage
|
|
|
- this.loadTrackingInfo(this.currentShipment.shipmentNo)
|
|
|
- }
|
|
|
- }
|
|
|
}
|
|
|
</script>
|
|
|
|