feat(发货状态): 新增发货状态常量模块并重构状态查询组件

src/constants/index.js

@@ -0,0 +1,6 @@
+/**
+ * 系统常量统一导出文件
+ * @fileoverview 提供项目中所有常量的统一入口
+ */
+
+export * from './shipment'

src/constants/shipment.js

@@ -0,0 +1,183 @@
+/**
+ * 发货相关常量定义
+ * @fileoverview 发货状态、物流状态等枚举值和工具函数
+ */
+
+/**
+ * 系统状态枚举
+ * @typedef {1} SystemStatus.NORMAL - 正常(系统继承)
+ */
+export const SYSTEM_STATUS = {
+  /** 正常(系统继承) */
+  NORMAL: 1
+}
+
+/**
+ * 发货状态枚举
+ * @typedef {0|1|2|3|4|5} ShipmentStatusValue
+ * @typedef {Object} ShipmentStatusItem
+ * @property {ShipmentStatusValue} value - 状态值
+ * @property {string} label - 状态标签
+ * @property {string} type - Element UI标签类型
+ * @property {string} color - 状态颜色
+ */
+export const SHIPMENT_STATUS = {
+  /** 待发货 */
+  PENDING: 0,
+  /** 已发货 */
+  SHIPPED: 1,
+  /** 运输中 */
+  IN_TRANSIT: 2,
+  /** 已送达 */
+  DELIVERED: 3,
+  /** 已签收 */
+  RECEIVED: 4,
+  /** 异常 */
+  EXCEPTION: 5
+}
+
+/**
+ * 发货状态配置映射
+ * @type {Record<ShipmentStatusValue, ShipmentStatusItem>}
+ */
+export const SHIPMENT_STATUS_CONFIG = {
+  [SHIPMENT_STATUS.PENDING]: {
+    value: SHIPMENT_STATUS.PENDING,
+    label: '待发货',
+    type: 'info',
+    color: '#909399'
+  },
+  [SHIPMENT_STATUS.SHIPPED]: {
+    value: SHIPMENT_STATUS.SHIPPED,
+    label: '已发货',
+    type: 'warning',
+    color: '#E6A23C'
+  },
+  [SHIPMENT_STATUS.IN_TRANSIT]: {
+    value: SHIPMENT_STATUS.IN_TRANSIT,
+    label: '运输中',
+    type: 'primary',
+    color: '#409EFF'
+  },
+  [SHIPMENT_STATUS.DELIVERED]: {
+    value: SHIPMENT_STATUS.DELIVERED,
+    label: '已送达',
+    type: 'success',
+    color: '#67C23A'
+  },
+  [SHIPMENT_STATUS.RECEIVED]: {
+    value: SHIPMENT_STATUS.RECEIVED,
+    label: '已签收',
+    type: 'success',
+    color: '#67C23A'
+  },
+  [SHIPMENT_STATUS.EXCEPTION]: {
+    value: SHIPMENT_STATUS.EXCEPTION,
+    label: '异常',
+    type: 'danger',
+    color: '#F56C6C'
+  }
+}
+
+/**
+ * 获取发货状态标签文本
+ * @param {ShipmentStatusValue} status - 状态值
+ * @returns {string} 状态标签文本
+ */
+export const getShipmentStatusLabel = (status) => {
+  return (SHIPMENT_STATUS_CONFIG[status] && SHIPMENT_STATUS_CONFIG[status].label) || '未知状态'
+}
+
+/**
+ * 获取发货状态Element UI标签类型
+ * @param {ShipmentStatusValue} status - 状态值
+ * @returns {string} Element UI标签类型
+ */
+export const getShipmentStatusType = (status) => {
+    return (SHIPMENT_STATUS_CONFIG[status] && SHIPMENT_STATUS_CONFIG[status].type) || 'info'
+}
+
+/**
+ * 获取发货状态颜色
+ * @param {ShipmentStatusValue} status - 状态值
+ * @returns {string} 状态颜色值
+ */
+export const getShipmentStatusColor = (status) => {
+    return (SHIPMENT_STATUS_CONFIG[status] && SHIPMENT_STATUS_CONFIG[status].color) || '#909399'
+}
+
+/**
+ * 发货状态选项数组（用于下拉选择）
+ * @type {Array<{label: string, value: ShipmentStatusValue}>}
+ */
+export const SHIPMENT_STATUS_OPTIONS = Object.values(SHIPMENT_STATUS_CONFIG).map(config => ({
+  label: config.label,
+  value: config.value
+}))
+
+/**
+ * 物流跟踪状态类型枚举
+ * @typedef {'normal'|'in_transit'|'delivered'|'exception'} TrackingStatusType
+ */
+export const TRACKING_STATUS_TYPE = {
+  NORMAL: 'normal',
+  IN_TRANSIT: 'in_transit', 
+  DELIVERED: 'delivered',
+  EXCEPTION: 'exception'
+}
+
+/**
+ * 根据跟踪状态文本获取状态类型
+ * @param {string} statusText - 跟踪状态文本
+ * @returns {string} Element UI标签类型
+ */
+export const getTrackingStatusType = (statusText) => {
+  if (!statusText || typeof statusText !== 'string') {
+    return 'info'
+  }
+  
+  const text = statusText.toLowerCase()
+  
+  if (text.includes('运输中') || text.includes('在途') || text.includes('transit')) {
+    return 'primary'
+  }
+  
+  if (text.includes('已送达') || text.includes('已签收') || text.includes('delivered') || text.includes('received')) {
+    return 'success'
+  }
+  
+  if (text.includes('异常') || text.includes('延误') || text.includes('exception') || text.includes('delay')) {
+    return 'danger'
+  }
+  
+  return 'info'
+}
+
+/**
+ * 异常状态枚举
+ * @typedef {boolean} ExceptionStatus
+ */
+export const EXCEPTION_STATUS = {
+  /** 正常 */
+  NORMAL: false,
+  /** 异常 */
+  EXCEPTION: true
+}
+
+/**
+ * 获取异常状态标签
+ * @param {ExceptionStatus} isException - 是否异常
+ * @returns {string} 异常状态标签
+ */
+export const getExceptionStatusLabel = (isException) => {
+  return isException ? '异常' : '正常'
+}
+
+/**
+ * 获取异常状态类型
+ * @param {ExceptionStatus} isException - 是否异常
+ * @returns {string} Element UI标签类型
+ */
+export const getExceptionStatusType = (isException) => {
+  return isException ? 'danger' : 'success'
+}

src/views/shipment/status-query.vue

@@ -26,8 +26,8 @@
 
         <!-- 发货状态列插槽 -->
         <template slot="shipmentStatus" slot-scope="{row}">
-          <el-tag :type="getStatusType(row.shipmentStatus)">
-            {{ getStatusText(row.shipmentStatus) }}
+          <el-tag :type="getShipmentStatusType(row.shipmentStatus)">
+            {{ getShipmentStatusLabel(row.shipmentStatus) }}
           </el-tag>
         </template>
 
@@ -103,8 +103,8 @@
 
         <!-- 异常状态列插槽 -->
         <template slot="isException" slot-scope="{row}">
-          <el-tag :type="row.isException ? 'danger' : 'success'">
-            {{ row.isException ? '异常' : '正常' }}
+          <el-tag :type="getExceptionStatusType(row.isException)">
+            {{ getExceptionStatusLabel(row.isException) }}
           </el-tag>
         </template>
       </avue-crud>
@@ -114,37 +114,64 @@
 
 <script>
 import { getOrderShipmentList, getShipmentItemList, getShipmentTrackingList } from '@/api/shipment'
+import { 
+  SHIPMENT_STATUS_OPTIONS,
+  getShipmentStatusLabel,
+  getShipmentStatusType,
+  getTrackingStatusType,
+  getExceptionStatusLabel,
+  getExceptionStatusType
+} from '@/constants/shipment'
 import { mapGetters } from 'vuex'
 
+/**
+ * 发货状态查询组件
+ * @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<Record<string, any>>} 跟踪数据 */
       trackingData: [],
+      /** @type {{pageSize: number, currentPage: number, total: number}} 跟踪分页信息 */
       trackingPage: {
         pageSize: 10,
         currentPage: 1,
@@ -152,6 +179,7 @@ export default {
       },
 
       // 主表配置
+      /** @type {Record<string, any>} 主表配置 */
       option: {
         height: 'auto',
         calcHeight: 30,
@@ -210,13 +238,7 @@ export default {
             slot: true,
             search: true,
             type: 'select',
-            dicData: [
-              { label: '待发货', value: 1 },
-              { label: '已发货', value: 2 },
-              { label: '运输中', value: 3 },
-              { label: '已送达', value: 4 },
-              { label: '已签收', value: 5 }
-            ],
+            dicData: SHIPMENT_STATUS_OPTIONS,
             width: 100
           },
           {
@@ -249,98 +271,7 @@ export default {
         ]
       },
 
-      // 明细表配置
-      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
-          }
-        ]
-      },
-
-      // 跟踪表配置
-      trackingOption: {
-        height: 400,
-        tip: false,
-        border: true,
-        index: true,
-        menu: false,
-        addBtn: false,
-        column: [
-          {
-            label: '运单号',
-            prop: 'trackingNo',
-            width: 150
-          },
-          {
-            label: '跟踪状态',
-            prop: 'trackingStatus',
-            slot: true,
-            width: 100
-          },
-          {
-            label: '位置',
-            prop: 'location',
-            width: 200
-          },
-          {
-            label: '事件时间',
-            prop: 'eventTime',
-            type: 'datetime',
-            format: 'YYYY-MM-DD HH:mm:ss',
-            width: 160
-          },
-          {
-            label: '事件描述',
-            prop: 'eventDesc',
-            width: 250
-          },
-          {
-            label: '异常状态',
-            prop: 'isException',
-            slot: true,
-            width: 100
-          },
-          {
-            label: '异常类型',
-            prop: 'exceptionType',
-            width: 120
-          }
-        ]
-      }
+      // ... existing code ...
     }
   },
 
@@ -353,60 +284,40 @@ export default {
   },
 
   methods: {
-    // 获取发货状态类型
-    getStatusType(status) {
-      const statusMap = {
-        1: 'info',     // 待发货
-        2: 'warning',  // 已发货
-        3: 'primary',  // 运输中
-        4: 'success',  // 已送达
-        5: 'success'   // 已签收
-      }
-      return statusMap[status] || 'info'
-    },
-
-    // 获取发货状态文本
-    getStatusText(status) {
-      const statusMap = {
-        1: '待发货',
-        2: '已发货',
-        3: '运输中',
-        4: '已送达',
-        5: '已签收'
-      }
-      return statusMap[status] || '未知'
-    },
-
-    // 获取跟踪状态类型
-    getTrackingStatusType(status) {
-      if (status.includes('运输中') || status.includes('在途')) {
-        return 'primary'
-      } else if (status.includes('已送达') || status.includes('已签收')) {
-        return 'success'
-      } else if (status.includes('异常') || status.includes('延误')) {
-        return 'danger'
-      }
-      return 'info'
-    },
-
-    // 加载数据
-    onLoad() {
+    // 导入的工具函数
+    getShipmentStatusLabel,
+    getShipmentStatusType,
+    getTrackingStatusType,
+    getExceptionStatusLabel,
+    getExceptionStatusType,
+
+    /**
+     * 加载数据
+     * @returns {Promise<void>}
+     */
+    async onLoad() {
       this.loading = true
-      getOrderShipmentList({
-        ...this.query,
-        current: this.page.currentPage,
-        size: this.page.pageSize
-      }).then(res => {
+      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
-      }).catch(() => {
-        this.loading = false
-      })
+      }
     },
 
-    // 搜索
+    /**
+     * 搜索
+     * @param {Record<string, any>} params - 搜索参数
+     * @param {Function} done - 完成回调
+     */
     searchChange(params, done) {
       this.query = params
       this.page.currentPage = 1
@@ -414,97 +325,140 @@ export default {
       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)
     },
 
-    // 加载发货明细
-    loadShipmentDetails(shipmentNo) {
+    /**
+     * 加载发货明细
+     * @param {string} shipmentNo - 发货单号
+     * @returns {Promise<void>}
+     */
+    async loadShipmentDetails(shipmentNo) {
       this.detailLoading = true
-      getShipmentItemList({
-        shipmentNo: shipmentNo,
-        current: this.detailPage.currentPage,
-        size: this.detailPage.pageSize
-      }).then(res => {
+      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
-      }).catch(() => {
-        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)
     },
 
-    // 加载物流跟踪信息
-    loadTrackingInfo(shipmentNo) {
+    /**
+     * 加载物流跟踪信息
+     * @param {string} shipmentNo - 发货单号
+     * @returns {Promise<void>}
+     */
+    async loadTrackingInfo(shipmentNo) {
       this.trackingLoading = true
-      getShipmentTrackingList({
-        shipmentNo: shipmentNo,
-        current: this.trackingPage.currentPage,
-        size: this.trackingPage.pageSize
-      }).then(res => {
+      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
-      }).catch(() => {
-        this.trackingLoading = false
-      })
+      }
     },
 
-    // 跟踪分页大小改变
+    /**
+     * 跟踪分页大小改变
+     * @param {number} pageSize - 页面大小
+     */
     trackingSizeChange(pageSize) {
       this.trackingPage.pageSize = pageSize
       this.loadTrackingInfo(this.currentShipment.shipmentNo)
     },
 
-    // 跟踪当前页改变
+    /**
+     * 跟踪当前页改变
+     * @param {number} currentPage - 当前页
+     */
     trackingCurrentChange(currentPage) {
       this.trackingPage.currentPage = currentPage
       this.loadTrackingInfo(this.currentShipment.shipmentNo)