详细报告BUG修复。

src/views/yxgl/StatisticalAnalysis.vue

@@ -71,13 +71,13 @@
     <!-- 服务调用详情弹窗 -->
     <el-dialog
       v-model="showServerDetailReport"
-      width="60%"
+      width="80%"
       :close-on-click-modal="false"
       :close-on-press-escape="false"
       :show-close="true"
       title="服务调用详情"
     >
-      <div style="width: 100%; position: relative; padding-bottom: 20px">
+      <div style="width: 100%; position: relative; padding-bottom: 30px">
         <!-- 过滤条件，全字段（除了调用时间）下拉框选择 -->
         <div style="width: 100%; margin-bottom: 10px">
           <!-- 支持筛选条件清空 -->
@@ -93,6 +93,19 @@
           >
             <el-option v-for="item in value" :key="item" :label="item" :value="item" />
           </el-select>
+          <!-- 再添加一个时间搜索范围，字段是date, 格式是YYYY-MM-DD -->
+          <el-date-picker
+            style="margin-right: 10px"
+            v-model="selectedModel['date']"
+            type="daterange"
+            clearable
+            unlink-panels
+            @change="changeSelectModel"
+            range-separator="到"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            :shortcuts="shortcutsFun"
+          />
           <!-- 重置按钮 -->
           <el-button type="primary" @click="resetSelectModel">重置</el-button>
         </div>
@@ -110,14 +123,14 @@
           <el-table-column prop="type" label="服务类别" width="120" />
           <el-table-column prop="date" label="调用时间" width="120" />
         </el-table>
-        <div class="table_pagination">
+        <div style="float: right; padding-top: 10px">
           <el-pagination
             v-model:current-page="currentPage"
             v-model:page-size="pageSize"
             :page-sizes="[100, 200, 300, 400]"
             background
             layout="total, sizes, prev, pager, next, jumper"
-            :total="serverData.length"
+            :total="tableDataTotal"
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
           />
@@ -243,9 +256,9 @@ export default {
       },
       selectKeyName: {
         application: "应用名称",
-        path_comment: "接口注释",
-        unit: "单位",
-        type: "数据类型",
+        path_comment: "服务名称",
+        unit: "委办单位",
+        type: "服务类型",
       },
       // 筛选条件下拉框选中的值
       selectedModel: {
@@ -253,11 +266,15 @@ export default {
         path_comment: "",
         unit: "",
         type: "",
+        date: "",
       },
+      tableColumns: ["application", "path_comment", "unit", "type", "date"],
       // 分页大小
       pageSize: 100,
       // 当前页码
       currentPage: 1,
+      // 表格数据总条数
+      tableDataTotal: 0,
       TopCardDatas: [
         {
           name: "委办总数",
@@ -341,18 +358,45 @@ export default {
           (!this.selectedModel.type || item.type === this.selectedModel.type)
         );
       });
+      // 添加时间范围搜索逻辑
+      if (this.selectedModel.date) {
+        searchDatas = searchDatas.filter((item) => {
+          return (
+            new Date(item.date).getTime() >=
+              new Date(
+                this.$moment(new Date(this.selectedModel.date[0])).format(
+                  "YYYY-MM-DD 00:00:00"
+                )
+              ).getTime() &&
+            new Date(item.date).getTime() <=
+              new Date(
+                this.$moment(new Date(this.selectedModel.date[1])).format(
+                  "YYYY-MM-DD 23:59:59"
+                )
+              ).getTime()
+          );
+        });
+      }
+
+      // 格式化日期为YYYY-MM-DD格式
+      searchDatas.forEach((item) => {
+        item.date = this.$moment(new Date(item.date)).format("YYYY-MM-DD");
+      });
+
+      // 分页展示数据
       this.showServerData = searchDatas.slice(
         (this.currentPage - 1) * this.pageSize,
         this.currentPage * this.pageSize
       );
+
       // 遍历筛选条件下拉框选项，更新每个选项的数组
       for (let key in this.selectOptions) {
         this.selectOptions[key] = [
-          ...new Set(this.serverData.map((item) => (item[key] ? item[key] : "未知"))),
+          ...new Set(searchDatas.map((item) => (item[key] ? item[key] : "未知"))),
         ];
       }
       // 更新分页组件数据
-      this.total = searchDatas.length;
+      this.tableDataTotal = searchDatas.length;
       this.showServerDetailReport = true;
     },
     handleCurrentChange() {
@@ -385,6 +429,13 @@ export default {
         .then((res) => {
           if (res && res.code == 200) {
             if (res.content && res.content.length > 0) {
+              res.content.forEach((item) => {
+                this.tableColumns.forEach((key) => {
+                  if (item[key] == undefined) {
+                    item[key] = "未知";
+                  }
+                });
+              });
               this.serverData = res.content;
               this.handleSizeChange();
             } else {
@@ -551,7 +602,7 @@ export default {
               });
             }
 
-            console.log("getAllYxglDatas", res);
+            // console.log("getAllYxglDatas", res);
           }
           this.getDataStatus = false;
         })
@@ -584,7 +635,6 @@ export default {
             });
             // 转换为数组
             for (let key in statusMap) {
-              console.log(key, statusMap[key]);
               if (statusMap[key] && key) {
                 tableDatas.push({
                   name: this.$getDmsTypes("appstatus", key),
@@ -1043,9 +1093,7 @@ export default {
     border-bottom: none;
   }
   .table_pagination {
-    position: absolute;
-    bottom: 20px;
-    right: 20px;
+    float: right !important;
   }
 }
 </style>