Quellcode durchsuchen

feat(order): 加载全部商品列表并优化关联订单表格

- 在 App.vue 中添加加载全部商品列表的请求
- 在 OrderDetailCardProductList 和 SelectOrderDetailCard 组件中为关联订单表格添加 productCode 字段
- 调整关联订单表格的样式,设置固定宽度
- 优化 calcProductTypeTextWithCode 方法,增加对 info 对象的判空处理
- 修改 getProductTypeConfWithSpecCode 方法,使用 store.state.order.productListAll 替代 productList

Signed-off-by: tangshizhe <48740614+tangshizhe@users.noreply.github.com>
tangshizhe vor 1 Monat
Ursprung
Commit
dbc3364c9a

+ 1 - 0
src/App.vue

@@ -15,6 +15,7 @@ export default {
   },
   created() {
     this.$store.dispatch('order/getConfigWithReq')
+    this.$store.dispatch('order/getProductList', { showAll: 1 })
   },
   mounted() {
     // 修复字体

+ 10 - 4
src/views/create-order/components/order-detail-submodule/OrderDetailCardProductList.vue

@@ -20,7 +20,7 @@
                 >
                 <div v-if="item.key === 'linkedOrder'" class="linkedOrder">
                   {{ item.label }}:
-                  <RelatedOrderTable v-if="product.linkedOrder && Object.keys(product.linkedOrder).length" :table-data="product.options">
+                  <RelatedOrderTable class="detail-order-table" v-if="product.linkedOrder && Object.keys(product.linkedOrder).length" :table-data="product.options">
                   </RelatedOrderTable>
                   <span v-else>-</span>
                 </div>
@@ -266,7 +266,7 @@ export default {
               const finalPrice = this.formatNumber(product.final_price);
               let originalPrice = this.formatNumber(product.original_price);
               const linkedOrder = product.linkedOrder || {}; // 关联订单信息
-              const { buySubject, empowerCount, name, serviceStartTime, serviceEndTime, provinceCount, orderArr } = linkedOrder || {}
+              const { buySubject, empowerCount, name, serviceStartTime, serviceEndTime, provinceCount, product_code: productCode, orderArr } = linkedOrder || {}
 
               const options = [{
                 buySubject,
@@ -280,7 +280,7 @@ export default {
                 serviceList: [],
                 linkedOrder: orderArr,
                 vipExist: false, //当前服务是否在有限期内
-                
+                productCode
               }]
               const item = options[0]
               const arr = []
@@ -348,7 +348,7 @@ export default {
     sortTableText(service) {
       const order = service.linkedOrderSplit || {}
       return {
-        productTypeText: service.name || '-',
+        // productTypeText: service.name || '-',
         empowerCountText: service.empowerCount ? `${service.empowerCount}个` : '-',
         serviceEndTimeText: service.serviceEndTime ? dateFormatter(service.serviceEndTime, 'yyyy-MM-dd') : '-',
         buySubjectText: service.buySubject === 1 ? '个人' : '企业',
@@ -358,6 +358,7 @@ export default {
         service_type: order.service_type || '-',
         service_type_text: findPaymentType(order.service_type)?.label || '-',
         create_time: order.create_time || '-',
+        productCode: service.productCode || ''
       }
     },
     divided(a, b) {
@@ -771,5 +772,10 @@ export default {
       }
     }
   }
+  .detail-order-table {
+    &.relate-order-table {
+      width: 800px;
+    }
+  }
 }
 </style>

+ 10 - 4
src/views/create-order/components/order-detail-submodule/SelectOrderDetailCard.vue

@@ -56,7 +56,7 @@
                   >
                     <div v-if="item.key === 'linkedOrder'" class="linkedOrder">
                       {{ item.label }}:
-                  <RelatedOrderTable v-if="product.linkedOrder && Object.keys(product.linkedOrder).length" :table-data="product.options">
+                  <RelatedOrderTable class="detail-order-table" v-if="product.linkedOrder && Object.keys(product.linkedOrder).length" :table-data="product.options">
                   </RelatedOrderTable>
                       <span v-else>-</span>
                     </div>
@@ -445,7 +445,7 @@ export default {
                 const finalPrice = this.formatNumber(product.final_price);
                 let originalPrice = this.formatNumber(product.original_price);
                 const linkedOrder = product.linkedOrder || {}; // 关联订单信息
-                const { buySubject, empowerCount, name, serviceStartTime, serviceEndTime, provinceCount, orderArr } = linkedOrder || {}
+                const { buySubject, empowerCount, name, serviceStartTime, serviceEndTime, provinceCount, product_code: productCode, orderArr } = linkedOrder || {}
 
                 const options = [{
                   buySubject,
@@ -459,7 +459,7 @@ export default {
                   serviceList: [],
                   linkedOrder: orderArr,
                   vipExist: false, //当前服务是否在有限期内
-
+                  productCode
                 }]
                 const item = options[0]
                 const arr = []
@@ -528,7 +528,7 @@ export default {
     sortTableText(service) {
       const order = service.linkedOrderSplit || {}
       return {
-        productTypeText: service.name || '-',
+        // productTypeText: service.name || '-',
         empowerCountText: service.empowerCount ? `${service.empowerCount}个` : '-',
         serviceEndTimeText: service.serviceEndTime ? dateFormatter(service.serviceEndTime, 'yyyy-MM-dd') : '-',
         buySubjectText: service.buySubject === 1 ? '个人' : '企业',
@@ -538,6 +538,7 @@ export default {
         service_type: order.service_type || '-',
         service_type_text: findPaymentType(order.service_type)?.label || '-',
         create_time: order.create_time || '-',
+        productCode: service.productCode || ''
       }
     },
     // 权限开通
@@ -1094,5 +1095,10 @@ export default {
       }
     }
   }
+  .detail-order-table {
+    &.relate-order-table {
+      width: 800px;
+    }
+  }
 }
 </style>

+ 2 - 2
src/views/create-order/components/product-info-submodule/RelatedOrderTable.vue

@@ -175,14 +175,14 @@ export default {
     },
     getProductTypeText(row) {
       let text  = row.productTypeText || ''
-      if (!text) {
+      if (!text && row.productCode) {
         text = this.calcProductTypeTextWithCode(row.productCode)
       }
       return text?.replaceAll('VIP订阅', '超级订阅')
     },
     calcProductTypeTextWithCode(code) {
       const info = getProductTypeConfWithSpecCode(code)
-      if (Array.isArray(info.product_list) && info.product_list.length > 1) {
+      if (info && Array.isArray(info.product_list) && info.product_list.length > 1) {
         const t = info.product_list.find(p => p.code === code)
         if (t) {
           const mainName = info.label

+ 1 - 1
src/views/create-order/hooks/utils.js

@@ -127,7 +127,7 @@ export function calcChannelSelectorList(code) {
 // 根据规格code(cjdy/cjdy001)取出商品大类的信息
 export function getProductTypeConfWithSpecCode(code) {
   if (!code) return
-  const productListGroup = store.state.order.productList.filter(r => !r.activityMark)
+  const productListGroup = store.state.order.productListAll.filter(r => !r.activityMark)
   const productList = productListGroup.map(r => {
     if (Array.isArray(r.children) && r.children.length > 0) {
       return r.children