fix(订单管理): 修复订单明细弹窗样式及数据加载问题

src/components/order-item-management/index.vue

@@ -11,7 +11,7 @@
         </el-descriptions-item>
       </el-descriptions>
     </div>
-    
+
     <div class="item-management" style="margin-top: 20px;">
       <avue-crud
         :option="option"
@@ -43,7 +43,7 @@
             删除
           </el-button>
         </template>
-        
+
         <template slot-scope="{row}" slot="itemStatus">
           <el-tag :type="getItemStatusType(row.itemStatus)">
             {{ getItemStatusText(row.itemStatus) }}
@@ -139,7 +139,7 @@ import { getList, add, update, remove, getDetail } from '@/api/order/order-item'
 
 export default {
   name: 'OrderItemManagement',
-  
+
   props: {
     /**
      * 订单信息
@@ -149,7 +149,7 @@ export default {
       type: Object,
       default: () => null
     },
-    
+
     /**
      * 是否显示组件
      * @type {boolean}
@@ -159,7 +159,7 @@ export default {
       default: false
     }
   },
-  
+
   data() {
     return {
       /**
@@ -167,19 +167,19 @@ export default {
        * @type {OrderItemForm}
        */
       form: {},
-      
+
       /**
        * 明细数据列表
        * @type {OrderItemRecord[]}
        */
       data: [],
-      
+
       /**
        * 明细加载状态
        * @type {boolean}
        */
       loading: true,
-      
+
       /**
        * 明细分页信息
        * @type {{pageSize: number, currentPage: number, total: number}}
@@ -189,13 +189,13 @@ export default {
         currentPage: 1,
         total: 0
       },
-      
+
       /**
        * 选中的明细行数据
        * @type {OrderItemRecord[]}
        */
       selectionList: [],
-      
+
       /**
        * 明细表格配置
        * @type {Object}
@@ -442,7 +442,7 @@ export default {
       }
     }
   },
-  
+
   watch: {
     /**
      * 监听订单信息变化
@@ -458,7 +458,7 @@ export default {
       },
       immediate: true
     },
-    
+
     /**
      * 监听显示状态变化
      * @param {boolean} newVal - 新的显示状态
@@ -472,7 +472,7 @@ export default {
       }
     }
   },
-  
+
   methods: {
     /**
      * 明细数据加载
@@ -486,19 +486,19 @@ export default {
         this.loading = false
         return
       }
-      
+
       this.loading = true
       try {
         const queryParams = {
           ...params,
           orderId: this.orderInfo.id
         }
-        
+
         const response = await getList(page.currentPage, page.pageSize, queryParams)
-        
-        if (response.data && response.data.records) {
-          this.data = response.data.records
-          this.page.total = response.data.total
+
+        if (response.data && response.data.data && response.data.data.records) {
+          this.data = response.data.data.records
+          this.page.total = response.data.data.total
         } else {
           this.data = []
           this.page.total = 0
@@ -512,7 +512,7 @@ export default {
         this.loading = false
       }
     },
-    
+
     /**
      * 明细弹窗打开前处理
      * @param {boolean} done - 完成回调
@@ -528,7 +528,7 @@ export default {
       }
       done()
     },
-    
+
     /**
      * 明细保存
      * @param {OrderItemForm} row - 明细表单数据
@@ -543,9 +543,9 @@ export default {
           orderId: this.orderInfo && this.orderInfo.id,
           orderCode: this.orderInfo && this.orderInfo.orderCode
         }
-        
+
         await add(formData)
-        
+
         this.$message.success('添加成功!')
         done()
         this.onLoad(this.page)
@@ -556,7 +556,7 @@ export default {
         loading()
       }
     },
-    
+
     /**
      * 明细更新
      * @param {OrderItemForm} row - 明细表单数据
@@ -572,9 +572,9 @@ export default {
           orderId: this.orderInfo && this.orderInfo.id,
           orderCode: this.orderInfo && this.orderInfo.orderCode
         }
-        
+
         await update(formData)
-        
+
         this.$message.success('修改成功!')
         done()
         this.onLoad(this.page)
@@ -585,7 +585,7 @@ export default {
         loading()
       }
     },
-    
+
     /**
      * 明细删除
      * @param {OrderItemRecord} row - 明细行数据
@@ -602,7 +602,7 @@ export default {
         this.$message.error('删除明细失败')
       }
     },
-    
+
     /**
      * 明细批量删除
      */
@@ -611,17 +611,17 @@ export default {
         this.$message.warning('请选择要删除的数据')
         return
       }
-      
+
       try {
         await this.$confirm('确定删除选中的明细吗？', '提示', {
           confirmButtonText: '确定',
           cancelButtonText: '取消',
           type: 'warning'
         })
-        
+
         const ids = this.selectionList.map(item => item.id).join(',')
         await remove(ids)
-        
+
         this.$message.success('删除成功!')
         this.selectionList = []
         this.onLoad(this.page)
@@ -633,7 +633,7 @@ export default {
         }
       }
     },
-    
+
     /**
      * 明细搜索
      * @param {Object} params - 搜索参数
@@ -643,14 +643,14 @@ export default {
       this.onLoad(this.page, params)
       done()
     },
-    
+
     /**
      * 明细搜索重置
      */
     searchReset() {
       this.onLoad(this.page)
     },
-    
+
     /**
      * 明细选择变化
      * @param {OrderItemRecord[]} list - 选中的行数据
@@ -658,7 +658,7 @@ export default {
     selectionChange(list) {
       this.selectionList = list
     },
-    
+
     /**
      * 明细页码变化
      * @param {number} currentPage - 当前页码
@@ -666,7 +666,7 @@ export default {
     currentChange(currentPage) {
       this.page.currentPage = currentPage
     },
-    
+
     /**
      * 明细页大小变化
      * @param {number} pageSize - 页大小
@@ -674,14 +674,14 @@ export default {
     sizeChange(pageSize) {
       this.page.pageSize = pageSize
     },
-    
+
     /**
      * 明细刷新
      */
     refreshChange() {
       this.onLoad(this.page)
     },
-    
+
     /**
      * 获取订单状态类型
      * @param {number} status - 状态值
@@ -697,7 +697,7 @@ export default {
       }
       return statusMap[status] || 'info'
     },
-    
+
     /**
      * 获取订单状态文本
      * @param {number} status - 状态值
@@ -713,7 +713,7 @@ export default {
       }
       return statusMap[status] || '未知'
     },
-    
+
     /**
      * 获取明细状态类型
      * @param {number} status - 状态值
@@ -729,7 +729,7 @@ export default {
       }
       return statusMap[status] || 'info'
     },
-    
+
     /**
      * 获取明细状态文本
      * @param {number} status - 状态值
@@ -745,7 +745,7 @@ export default {
       }
       return statusMap[status] || '未知'
     },
-    
+
     /**
      * 刷新数据
      */
@@ -768,4 +768,4 @@ export default {
 .item-management {
   min-height: 400px;
 }
-</style>
+</style>

src/views/order/order/index.vue

@@ -65,6 +65,10 @@
       width="90%"
       :close-on-click-modal="false"
       :close-on-press-escape="false"
+      :modal="true"
+      :modal-append-to-body="true"
+      :append-to-body="true"
+      custom-class="order-item-dialog"
     >
       <order-item-management
         :order-info="currentOrder"
@@ -906,4 +910,14 @@ export default {
 .dialog-footer {
   text-align: right;
 }
-</style>
+
+/* 无遮罩层弹窗样式 */
+:deep(.order-item-dialog-no-modal) {
+  z-index: 2000 !important;
+}
+
+:deep(.order-item-dialog-no-modal .el-dialog) {
+  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
+  border: 1px solid #e4e7ed;
+}
+</style>