1

src/views/system/jdorder/components/TencentDocPushMonitor.vue

@@ -132,18 +132,24 @@
                 <div v-if="expandedRecords.includes(record.batchId)" class="record-detail">
                   <el-divider></el-divider>
                   
-                  <div v-if="record.resultMessage" class="detail-message">
-                    <div class="message-label">结果消息：</div>
-                    <div class="message-content">{{ record.resultMessage }}</div>
+                  <!-- 加载状态 -->
+                  <div v-if="record.loadingDetail" class="loading-detail" v-loading="true" element-loading-text="正在加载详情...">
+                    <div style="height: 100px;"></div>
                   </div>
 
-                  <div v-if="record.errorMessage" class="detail-error">
-                    <div class="error-label">错误信息：</div>
-                    <div class="error-content">{{ record.errorMessage }}</div>
-                  </div>
+                  <template v-else>
+                    <div v-if="record.resultMessage" class="detail-message">
+                      <div class="message-label">结果消息：</div>
+                      <div class="message-content">{{ record.resultMessage }}</div>
+                    </div>
 
-                  <!-- 操作日志列表 -->
-                  <div v-if="record.operationLogs && record.operationLogs.length > 0" class="operation-logs">
+                    <div v-if="record.errorMessage" class="detail-error">
+                      <div class="error-label">错误信息：</div>
+                      <div class="error-content">{{ record.errorMessage }}</div>
+                    </div>
+
+                    <!-- 操作日志列表 -->
+                    <div v-if="record.operationLogs && record.operationLogs.length > 0" class="operation-logs">
                     <div class="logs-header">
                       <i class="el-icon-document"></i>
                       <span>操作日志（{{ record.operationLogs.length }} 条）</span>
@@ -168,6 +174,13 @@
                       <el-table-column prop="errorMessage" label="错误信息" min-width="150" show-overflow-tooltip />
                     </el-table>
                   </div>
+
+                    <!-- 暂无操作日志 -->
+                    <div v-else class="no-logs">
+                      <i class="el-icon-info"></i>
+                      <span>暂无操作日志</span>
+                    </div>
+                  </template>
                 </div>
               </el-collapse-transition>
             </el-card>
@@ -330,12 +343,48 @@ export default {
       }
     },
 
-    toggleRecordDetail(batchId) {
+    async toggleRecordDetail(batchId) {
       const index = this.expandedRecords.indexOf(batchId)
       if (index > -1) {
+        // 收起
         this.expandedRecords.splice(index, 1)
       } else {
+        // 展开 - 加载详情
         this.expandedRecords.push(batchId)
+        await this.loadRecordDetail(batchId)
+      }
+    },
+
+    async loadRecordDetail(batchId) {
+      try {
+        const record = this.batchRecords.find(r => r.batchId === batchId)
+        if (!record) return
+
+        // 如果已经加载过详情，则不再重复加载
+        if (record.operationLogs && record.operationLogs.length > 0) {
+          return
+        }
+
+        // 显示加载状态
+        this.$set(record, 'loadingDetail', true)
+
+        const res = await getBatchPushRecordDetail(batchId)
+        if (res.code === 200 && res.data) {
+          // 更新记录的详细信息
+          this.$set(record, 'operationLogs', res.data.operationLogs || [])
+          this.$set(record, 'errorMessage', res.data.errorMessage)
+          this.$set(record, 'resultMessage', res.data.remark)
+        } else {
+          this.$message.warning('加载详情失败: ' + (res.msg || '未知错误'))
+        }
+      } catch (e) {
+        console.error('加载推送详情失败', e)
+        this.$message.error('加载详情失败: ' + (e.message || '未知错误'))
+      } finally {
+        const record = this.batchRecords.find(r => r.batchId === batchId)
+        if (record) {
+          this.$set(record, 'loadingDetail', false)
+        }
       }
     },
 
@@ -711,5 +760,25 @@ export default {
 .logs-header i {
   color: #409eff;
 }
+
+.loading-detail {
+  text-align: center;
+  padding: 20px;
+  color: #909399;
+}
+
+.no-logs {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 8px;
+  padding: 30px;
+  color: #909399;
+  font-size: 14px;
+}
+
+.no-logs i {
+  font-size: 18px;
+}
 </style>