Merge branch 'liucan' into 'main'

fix:修改状态监控数字显示格式

See merge request !28

src/utils/formatExactLargeNum.ts

 const formatExactLargeNum = (num: number | string | null) => {
-  if (num === null || num === undefined) return "";
-  if (typeof num !== "number" && typeof num !== "string") return num;
+  if (num === null || num === undefined) return ''
+  if (typeof num !== 'number' && typeof num !== 'string') return num
 
-  const parsedNum = typeof num === "string" ? Number(num.replace(/,/g, "")) : num;
+  const parsedNum = typeof num === 'string' ? Number(num.replace(/,/g, '')) : num
 
-  if (isNaN(parsedNum)) return num;
+  if (isNaN(parsedNum)) return num
 
-  // 如果大于 100 万 或大于 1 亿，使用科学计数法
-  if (Math.abs(parsedNum) > 1_000_000) {
-    return parsedNum.toExponential(2);
+  const absNum = Math.abs(parsedNum)
+
+  if (absNum >= 100_000_000) {
+    return (parsedNum / 100_000_000).toFixed(2) + '亿'
+  } else if (absNum >= 10_000) {
+    return (parsedNum / 10_000).toFixed(2) + '万'
   } else {
-    return parsedNum.toLocaleString("en-US", {
+    return parsedNum.toLocaleString('en-US', {
       useGrouping: true,
-      maximumFractionDigits: 0,
-      minimumFractionDigits: 0,
-    });
+      maximumFractionDigits: 2,
+      minimumFractionDigits: 0
+    })
   }
-};
+}
 
-export default formatExactLargeNum;
+export default formatExactLargeNum

src/views/os-status/components/dataCard.vue

@@ -9,21 +9,21 @@
         <div class="wordStyle">
           <span>总数据量(条):</span>
           <span class="total-num" v-if="totalDataNumber !== null">{{
-            formatExactLargeNum(totalDataNumber) ?? "--"
+            formatExactLargeNum(totalDataNumber) ?? '--'
           }}</span>
           <span class="loading" v-else></span>
         </div>
         <div class="wordStyle">
           <span>采集的页面数量(个):</span>
           <span class="total-num" v-if="totalPageNumber !== null">
-            {{ formatExactLargeNum(totalPageNumber) ?? "--" }}</span
+            {{ formatExactLargeNum(totalPageNumber) ?? '--' }}</span
           >
           <span class="loading" v-else></span>
         </div>
         <div class="wordStyle">
           <span>采集的目标数量(个):</span>
           <span class="total-num" v-if="totalTargetNumber !== null">
-            {{ formatExactLargeNum(totalTargetNumber) ?? "--" }}</span
+            {{ formatExactLargeNum(totalTargetNumber) ?? '--' }}</span
           >
           <span class="loading" v-else></span>
         </div>
@@ -36,17 +36,12 @@
       <div class="items">
         <div class="wordStyle">
           <span>任务执行成功统计(个):</span>
-          <span class="total-num" v-if="successTask !== null">{{ formatExactLargeNum(successTask) ?? "--" }}</span>
+          <span class="total-num" v-if="successTask !== null">{{ formatExactLargeNum(successTask) ?? '--' }}</span>
           <span class="loading" v-else></span>
         </div>
         <div class="wordStyle">
           <span>任务执行失败统计(个):</span>
-          <span class="total-num" v-if="failTask !== null">{{ formatExactLargeNum(failTask) ?? "--" }}</span>
-          <span class="loading" v-else></span>
-        </div>
-        <div class="wordStyle">
-          <span>任务异常数统计(个):</span>
-          <span class="total-num" v-if="unusualTask !== null">{{ formatExactLargeNum(unusualTask) ?? "--" }}</span>
+          <span class="total-num" v-if="failTask !== null">{{ formatExactLargeNum(failTask) ?? '--' }}</span>
           <span class="loading" v-else></span>
         </div>
       </div>
@@ -58,17 +53,16 @@
       <div class="items">
         <div class="wordStyle">
           <span>平均成功率:</span>
-          <span class="total-num" v-if="speed !== null"> {{ speed ?? "--" }}</span>
+          <span class="total-num" v-if="speed !== null">
+            {{ `${Number(Math.floor(speed * 100) / 100).toFixed(2)}%` }}</span
+          >
           <span class="loading" v-else></span>
         </div>
         <div class="wordStyle">
           <span>平均错误率: </span>
-          <span class="total-num" v-if="errorRate !== null">{{ errorRate ?? "--" }}</span>
-          <span class="loading" v-else></span>
-        </div>
-        <div class="wordStyle">
-          <span>平均异常率:</span>
-          <span class="total-num" v-if="unusualRate !== null">{{ unusualRate ?? "--" }}</span>
+          <span class="total-num" v-if="errorRate !== null">{{
+            `${Number(Math.ceil(errorRate * 100) / 100).toFixed(2)}%`
+          }}</span>
           <span class="loading" v-else></span>
         </div>
       </div>
@@ -77,73 +71,73 @@
 </template>
 
 <script lang="ts" setup>
-import { useRouter } from "vue-router";
-import { getStatsDataList, getSpiderTaskList, getPerformanceList } from "@/api/staticData";
-import { onMounted, ref } from "vue";
-import formatExactLargeNum from "@/utils/formatExactLargeNum";
-import { useSlideStateStore } from "@/store/slideState";
-import { storeToRefs } from "pinia";
-
-const slideStateStore = useSlideStateStore();
-const { slideState } = storeToRefs(slideStateStore);
-
-const router = useRouter();
-const totalDataNumber = ref(null);
-const totalPageNumber = ref(null);
-const totalTargetNumber = ref(null);
-const successTask = ref(null);
-const failTask = ref(null);
-const unusualTask = ref(null);
-const speed = ref(null);
-const errorRate = ref(null);
-const unusualRate = ref(null);
+import { useRouter } from 'vue-router'
+import { getStatsDataList, getSpiderTaskList, getPerformanceList } from '@/api/staticData'
+import { onMounted, ref } from 'vue'
+import formatExactLargeNum from '@/utils/formatExactLargeNum'
+import { useSlideStateStore } from '@/store/slideState'
+import { storeToRefs } from 'pinia'
+
+const slideStateStore = useSlideStateStore()
+const { slideState } = storeToRefs(slideStateStore)
+
+const router = useRouter()
+const totalDataNumber = ref(null)
+const totalPageNumber = ref(null)
+const totalTargetNumber = ref(null)
+const successTask = ref(null)
+const failTask = ref(null)
+const unusualTask = ref(null)
+const speed = ref(null)
+const errorRate = ref(null)
+const unusualRate = ref(null)
 
 const goToAllDataPage = () => {
   router.push({
-    path: "/osDataDisplay/list",
+    path: '/osDataDisplay/list',
     query: {
-      jump: "yes",
-      mode: "DSN数据",
-    },
-  });
-};
+      jump: 'yes',
+      mode: 'DSN数据'
+    }
+  })
+}
 
 const goToTaskRecordPage = () => {
   router.push({
-    path: "/osTaskRecord/list",
+    path: '/osTaskRecord/list',
     query: {
-      jump: "yes",
-      mode: "状态监控",
-    },
-  });
-};
+      jump: 'yes',
+      mode: '状态监控'
+    }
+  })
+}
 
 // 获取数据统计数据的方法
 const getData = async () => {
-  const staticData = await getStatsDataList({});
-  const spiderTask = await getSpiderTaskList({});
-  const performance = await getPerformanceList({});
-  totalDataNumber.value = staticData.data.totalData;
-  totalPageNumber.value = staticData.data.ituPage;
-  totalTargetNumber.value = staticData.data.spaceTrackItemCount;
-  successTask.value = spiderTask.data.successCount;
-  failTask.value = spiderTask.data.failCount;
-  unusualTask.value = spiderTask.data.exceptionCount;
-  speed.value = performance.data.success;
-  errorRate.value = performance.data.error;
-  unusualRate.value = performance.data.exception;
-};
+  const staticData = await getStatsDataList({})
+  const spiderTask = await getSpiderTaskList({})
+  const performance = await getPerformanceList({})
+  totalDataNumber.value = staticData.data.totalData
+  totalPageNumber.value = staticData.data.ituPage
+  totalTargetNumber.value = staticData.data.spaceTrackItemCount
+  successTask.value = spiderTask.data.successCount
+  failTask.value = spiderTask.data.failCount
+  unusualTask.value = spiderTask.data.exceptionCount
+  speed.value = performance.data.success
+  errorRate.value = performance.data.error
+  unusualRate.value = performance.data.exception
+}
 
 //sidebarStatus
 
 onMounted(() => {
-  getData();
-});
+  getData()
+})
 </script>
 
 <style lang="scss" scoped>
 .dataCard {
-  background-image: url("@/assets/picture/box2.png");
+  background-image: url('@/assets/picture/box2.png');
   background-size: 100% 100%;
   background-repeat: no-repeat;
   // background: #c6ebfc;
@@ -221,22 +215,37 @@ onMounted(() => {
   aspect-ratio: 2;
   margin-right: 30px;
   --_g: no-repeat radial-gradient(circle closest-side, #4edaff 90%, #0000);
-  background: var(--_g) 0% 50%, var(--_g) 50% 50%, var(--_g) 100% 50%;
+  background:
+    var(--_g) 0% 50%,
+    var(--_g) 50% 50%,
+    var(--_g) 100% 50%;
   background-size: calc(100% / 3) 50%;
   animation: l3 1s infinite linear;
 }
 @keyframes l3 {
   20% {
-    background-position: 0% 0%, 50% 50%, 100% 50%;
+    background-position:
+      0% 0%,
+      50% 50%,
+      100% 50%;
   }
   40% {
-    background-position: 0% 100%, 50% 0%, 100% 50%;
+    background-position:
+      0% 100%,
+      50% 0%,
+      100% 50%;
   }
   60% {
-    background-position: 0% 50%, 50% 100%, 100% 0%;
+    background-position:
+      0% 50%,
+      50% 100%,
+      100% 0%;
   }
   80% {
-    background-position: 0% 50%, 50% 50%, 100% 100%;
+    background-position:
+      0% 50%,
+      50% 50%,
+      100% 100%;
   }
 }
 </style>

src/views/os-taskRecord/index.vue

@@ -50,27 +50,32 @@
           :cell-style="{ textAlign: 'center' }"
         >
           <el-table-column property="number" label="序号" width="55" type="index" />
+          <el-table-column label="任务名称" show-overflow-tooltip>
+            <template #default="scope">
+              {{ JSON.parse(scope.row.options).jobName }}
+            </template>
+          </el-table-column>
           <el-table-column property="spider" label="所属爬虫" show-overflow-tooltip />
           <el-table-column property="schedule_mode" label="调度模式" show-overflow-tooltip />
           <el-table-column property="run_status" label="调度状态" show-overflow-tooltip>
             <template #default="scope">
-              {{ "已完成" }}
+              {{ scope.row.status ? '已完成' : '未完成' }}
             </template>
           </el-table-column>
           <el-table-column label="错误消息" show-overflow-tooltip>
             <!-- 当错误消息为空时默认值为'-' -->
             <template #default="scope">
-              {{ scope.row.message || "-" }}
+              {{ scope.row.message || '-' }}
             </template>
           </el-table-column>
           <el-table-column property="run_status" label="运行状态" show-overflow-tooltip>
             <template #default="scope">
-              {{ scope.row.run_status === "unknown" ? "已结束" : scope.row.run_status }}
+              {{ scope.row.run_status === 'unknown' ? '已结束' : scope.row.run_status }}
             </template>
           </el-table-column>
           <el-table-column label="运行耗时/ms">
             <template #default="scope">
-              {{ scope.row.duration == 0 ? "-" : scope.row.duration }}
+              {{ scope.row.duration == 0 ? '-' : scope.row.duration }}
             </template>
           </el-table-column>
           <el-table-column property="create_time" label="采集时间" width="200" show-overflow-tooltip />
@@ -90,126 +95,123 @@
 </template>
 
 <script setup lang="ts">
-import { ref, onMounted } from "vue";
-import Pagination from "@/components/pagination/index.vue";
-import { useRoute } from "vue-router";
-import { useRouter } from "vue-router";
-import { getSpiderTaskRecord } from "@/api/spiderTask.ts";
-import { ElMessage } from "element-plus";
-import MenuTitle from "@/components/MenuTitle.vue";
-import TableSearch from "@/components/TableSearch.vue";
+import { ref, onMounted } from 'vue'
+import Pagination from '@/components/pagination/index.vue'
+import { useRoute } from 'vue-router'
+import { useRouter } from 'vue-router'
+import { getSpiderTaskRecord } from '@/api/spiderTask.ts'
+import MenuTitle from '@/components/MenuTitle.vue'
+import TableSearch from '@/components/TableSearch.vue'
 //时间处理库
-import dayjs from "dayjs";
+import dayjs from 'dayjs'
 // ElConfigProvider 组件
-import { ElConfigProvider } from "element-plus";
+import { ElConfigProvider } from 'element-plus'
 // 引入中文包
-import zhCn from "element-plus/es/locale/lang/zh-cn";
-defineOptions({ name: "Pagination" });
+import zhCn from 'element-plus/es/locale/lang/zh-cn'
+defineOptions({ name: 'Pagination' })
 // 更改分页文字
-zhCn.el.pagination.total = "共 `{total} 条`";
-zhCn.el.pagination.goto = "跳至";
-zhCn.el.pagination.pagesize = "条/页";
-zhCn.el.pagination.pageClassifier = "页";
-const route = useRoute();
-const router = useRouter();
+zhCn.el.pagination.total = '共 `{total} 条`'
+zhCn.el.pagination.goto = '跳至'
+zhCn.el.pagination.pagesize = '条/页'
+zhCn.el.pagination.pageClassifier = '页'
+const route = useRoute()
+const router = useRouter()
 //初始数据为近七天
-const timeValue = ref<string[]>([]);
-const tableData = ref([]);
+const timeValue = ref<string[]>([])
+const tableData = ref([])
 const pageObj = ref({
   total: 10,
   pageSize: 10,
   pageNo: 1,
-  pagerCount: 5,
-});
+  pagerCount: 5
+})
 
 const goToStatus = () => {
-  if (route.query.mode === "状态监控") {
+  if (route.query.mode === '状态监控') {
     router.push({
-      path: "/osStatus/list",
-    });
+      path: '/osStatus/list'
+    })
   } else {
     router.push({
-      path: "/osTaskInformation/list",
-    });
+      path: '/osTaskInformation/list'
+    })
   }
-};
+}
 
 const spideOptions = [
   {
-    label: "dsn_now",
-    value: "dsn_now",
+    label: 'dsn_now',
+    value: 'dsn_now'
   },
   {
-    label: "itu_space_expolorer",
-    value: "itu_space_expolorer",
+    label: 'itu_space_expolorer',
+    value: 'itu_space_expolorer'
   },
   {
-    label: "space_track",
-    value: "space_track",
+    label: 'space_track',
+    value: 'space_track'
   },
   {
-    label: "es_track_transmission",
-    value: "es_track_transmission",
-  },
-];
+    label: 'es_track_transmission',
+    value: 'es_track_transmission'
+  }
+]
 
 //表单loading标记
-const tableLoading = ref(false);
+const tableLoading = ref(false)
 
 //重置查询
 const resetQuery = () => {
-  timeValue.value = [];
-  spidername.value = "";
-  getData();
-};
+  timeValue.value = []
+  spidername.value = ''
+  getData()
+}
 
 // 获取任务执行记录列表
 const getData = async () => {
-  let resTime: any[] = [];
-  resTime.push(dayjs().subtract(7, "day").format("YYYY-MM-DD HH:mm:ss"));
-  resTime.push(dayjs().format("YYYY-MM-DD HH:mm:ss"));
+  let resTime: any[] = []
+  resTime.push(dayjs().subtract(7, 'day').format('YYYY-MM-DD HH:mm:ss'))
+  resTime.push(dayjs().format('YYYY-MM-DD HH:mm:ss'))
 
-  tableLoading.value = true;
+  tableLoading.value = true
   const res = await getSpiderTaskRecord({
     page: pageObj.value.pageNo,
     size: pageObj.value.pageSize,
-    status: "total",
-    times: resTime,
-  });
-  pageObj.value.total = res.data.total;
-  tableData.value = res.data.list;
-  tableLoading.value = false;
-};
+    status: 'total',
+    times: resTime
+  })
+  pageObj.value.total = res.data.total
+  tableData.value = res.data.list
+  tableLoading.value = false
+}
 
-const spidername = ref("");
+const spidername = ref('')
 
 //查询数据的方法
 const searchData = async () => {
-  let resTime: any[] = [];
+  let resTime: any[] = []
   if (timeValue.value.length !== 0) {
-    const startTime = timeValue.value[0];
-    const endTime = timeValue.value[1];
-    resTime.push(dayjs(startTime).format("YYYY-MM-DD HH:mm:ss"));
-    resTime.push(dayjs(endTime).format("YYYY-MM-DD HH:mm:ss"));
+    const startTime = timeValue.value[0]
+    const endTime = timeValue.value[1]
+    resTime.push(dayjs(startTime).format('YYYY-MM-DD HH:mm:ss'))
+    resTime.push(dayjs(endTime).format('YYYY-MM-DD HH:mm:ss'))
   }
-  tableLoading.value = true;
+  tableLoading.value = true
   const res = await getSpiderTaskRecord({
     page: pageObj.value.pageNo,
     size: pageObj.value.pageSize,
-    status: "total",
+    status: 'total',
     spider: spidername.value,
-    times: resTime,
-  });
-  pageObj.value.total = res.data.total;
-  tableData.value = res.data.list;
-  console.log(tableData.value);
-
-  tableLoading.value = false;
-};
+    times: resTime
+  })
+  pageObj.value.total = res.data.total
+  tableData.value = res.data.list
+  tableLoading.value = false
+}
 
 onMounted(() => {
-  getData();
-});
+  getData()
+})
 </script>
 
 <style scoped>
@@ -218,7 +220,7 @@ onMounted(() => {
 }
 /* 工具栏样式 */
 .toolbarStyle {
-  background-image: url("@/assets/picture/box3.png");
+  background-image: url('@/assets/picture/box3.png');
   background-size: 100% 100%;
   background-repeat: no-repeat;
 }
@@ -244,7 +246,7 @@ onMounted(() => {
 }
 
 .backStyle {
-  background-image: url("@/assets/picture/back.png");
+  background-image: url('@/assets/picture/back.png');
   background-size: 100% 100%;
   background-repeat: no-repeat;
   height: 5vh;