Bladeren bron

refactor(mallOrder): 使用字典数据替换订单状态硬编码

将订单状态相关的硬编码文本替换为从字典数据中动态获取,提高可维护性
统一搜索组件、详情组件、列表项和标签页中的订单状态显示逻辑
修改支付方式文本显示格式,增加“支付”后缀
ylong 1 maand geleden
bovenliggende
commit
851c049f90

+ 5 - 10
src/views/mallOrder/all/components/order-base-info.vue

@@ -104,6 +104,8 @@ import { Lightning } from '@element-plus/icons-vue';
 import { EleMessage } from 'ele-admin-plus/es';
 import { ref } from 'vue';
 
+import { useDictData } from '@/utils/use-dict-data';
+
 const props = defineProps({
     detail: {
         type: Object,
@@ -115,22 +117,15 @@ const props = defineProps({
 defineEmits(['add-package', 'edit-receiver']);
 
 const activities = ref([]);
+const [shop_order_status] = useDictData(['shop_order_status']);
 
 const viewLogistics = () => {
     EleMessage.info('物流详情功能开发中');
 };
 
 const getStatusText = (status) => {
-    const statusMap = {
-        '1': '等待买家付款',
-        '2': '等待卖家发货',
-        '3': '等待买家确认收货',
-        '4': '已完成',
-        '5': '退款成功',
-        '6': '退款中',
-        '7': '已取消'
-    };
-    return statusMap[status] || status;
+    const item = shop_order_status.value.find(d => d.dictValue == status);
+    return item ? item.dictLabel : status;
 };
 
 const getPayType = (type) => {

+ 10 - 0
src/views/mallOrder/all/components/order-detail.vue

@@ -65,6 +65,8 @@ import OrderBaseInfo from './order-base-info.vue';
 import OrderProductList from './order-product-list.vue';
 import request from '@/utils/request';
 
+import { useDictData } from '@/utils/use-dict-data';
+
 const visible = defineModel({ type: Boolean });
 const detail = ref({});
 const loading = ref(false);
@@ -72,6 +74,8 @@ const packageRef = ref(null);
 const smsRef = ref(null);
 const refundRef = ref(null);
 
+const [shop_order_status] = useDictData(['shop_order_status']);
+
 const activeStep = computed(() => {
     const status = detail.value.status;
     if (status === '1') return 1; // 等待买家付款
@@ -81,6 +85,11 @@ const activeStep = computed(() => {
     return 1; // Default
 });
 
+const getStatusText = (status) => {
+    const item = shop_order_status.value.find(d => d.dictValue == status);
+    return item ? item.dictLabel : status;
+};
+
 const handleOpen = (row) => {
     visible.value = true;
     loading.value = true;
@@ -88,6 +97,7 @@ const handleOpen = (row) => {
         .then(res => {
             const data = res.data.data || res.data;
             detail.value = data;
+            detail.value.statusText = getStatusText(data.status);
         })
         .finally(() => {
             loading.value = false;

+ 7 - 13
src/views/mallOrder/all/components/order-item.vue

@@ -83,6 +83,7 @@
 import { Flag, CopyDocument } from '@element-plus/icons-vue';
 import { EleMessage } from 'ele-admin-plus/es';
 import { useClipboard } from '@vueuse/core';
+import { useDictData } from '@/utils/use-dict-data';
 
 const props = defineProps({
     order: {
@@ -94,6 +95,7 @@ const props = defineProps({
 defineEmits(['view-detail', 'push-sms', 'refund']);
 
 const { copy } = useClipboard();
+const [shop_order_status] = useDictData(['shop_order_status']);
 
 const handleCopy = async (text) => {
     try {
@@ -105,16 +107,8 @@ const handleCopy = async (text) => {
 };
 
 const getStatusText = (status) => {
-    const statusMap = {
-        '1': '等待买家付款',
-        '2': '等待卖家发货',
-        '3': '等待买家确认收货',
-        '4': '已完成',
-        '5': '退款成功',
-        '6': '退款中',
-        '7': '已取消'
-    };
-    return statusMap[status] || status;
+    const item = shop_order_status.value.find(d => d.dictValue == status);
+    return item ? item.dictLabel : status;
 };
 
 const getStatusColor = (status) => {
@@ -157,9 +151,9 @@ const getPayType = (type) => {
         return '-';
     }
     const map = {
-        '1': '余额',
-        '2': '微信',
-        '3': '支付宝'
+        '1': '余额支付',
+        '2': '微信支付',
+        '3': '支付宝支付'
     };
     return map[type] || type;
 };

+ 1 - 1
src/views/mallOrder/all/components/page-search.vue

@@ -26,7 +26,7 @@ const formItems = reactive([
         type: 'dictSelect', 
         label: '全部订单状态', 
         prop: 'status', 
-        props: { code: 'order_status' } 
+        props: { code: 'shop_order_status' } 
     },
     { type: 'input', label: '搜索备注关键字', prop: 'remark' },
     {

+ 7 - 13
src/views/mallOrder/all/index.vue

@@ -6,14 +6,7 @@
             <!-- Tabs -->
             <el-tabs v-model="activeTab" @tab-click="handleTabClick">
                 <el-tab-pane label="全部订单状态" name="all" />
-                <el-tab-pane label="等待买家付款" name="1" />
-                <el-tab-pane label="等待卖家发货" name="2" />
-                <el-tab-pane label="等待买家确认收货" name="3" />
-                <el-tab-pane label="交易成功" name="4" />
-                <el-tab-pane label="退款成功" name="5" />
-                <el-tab-pane label="退款中" name="6" />
-                <el-tab-pane label="订单取消" name="7" />
-                <el-tab-pane label="预警订单/催发货" name="warning" />
+                <el-tab-pane v-for="item in shop_order_status" :key="item.dictValue" :label="item.dictLabel" :name="item.dictValue" />
             </el-tabs>
 
             <!-- Custom Table Header -->
@@ -52,6 +45,7 @@
     import OrderTableHeader from './components/order-table-header.vue';
     import OrderItem from './components/order-item.vue';
     import request from '@/utils/request';
+    import { useDictData } from '@/utils/use-dict-data';
 
     defineOptions({ name: 'MallOrderAll' });
 
@@ -64,11 +58,12 @@
     });
     const searchParams = ref({});
 
+    const [shop_order_status] = useDictData(['shop_order_status']);
+
     const list = ref([]);
     const detailRef = ref(null);
     const smsRef = ref(null);
     const refundRef = ref(null);
-    const packageRef = ref(null);
 
     const fetchData = () => {
         loading.value = true;
@@ -78,11 +73,9 @@
         };
 
         // Handle Tab Filter
-        if (activeTab.value !== 'all' && activeTab.value !== 'warning') {
+        if (activeTab.value !== 'all') {
             params.status = activeTab.value;
         }
-        // Handle Warning/Urge Tab logic if needed
-        // if (activeTab.value === 'warning') { ... }
 
         request.get('/shop/shopOrder/pagelist', { params })
             .then(res => {
@@ -101,7 +94,8 @@
         fetchData();
     };
 
-    const handleTabClick = () => {
+    const handleTabClick = (tab) => {
+        activeTab.value = tab.props.name;
         pageParams.page = 1;
         fetchData();
     };