Commit 457c70a7 by liucan

feat:添加表单分页切换loading效果

parent d1356d4d
...@@ -35,7 +35,6 @@ defineProps({ ...@@ -35,7 +35,6 @@ defineProps({
const handleClick = (item: InfoItem) => { const handleClick = (item: InfoItem) => {
// 处理点击事件 // 处理点击事件
console.log('Clicked item:', item)
} }
</script> </script>
......
<!-- 解析路径并跳转路由 --> <!-- 解析路径并跳转路由 -->
<script setup lang="ts"> <script setup lang="ts">
import { computed, onMounted } from 'vue' import { computed, onMounted } from "vue";
import { RouterLink } from 'vue-router' import { RouterLink } from "vue-router";
import { isExternal } from '@/utils/validate' import { isExternal } from "@/utils/validate";
const props = defineProps({ const props = defineProps({
to: { to: {
type: String, type: String,
required: true required: true,
} },
}) });
const isExtLink = computed(() => isExternal(props.to)) const isExtLink = computed(() => isExternal(props.to));
onMounted(()=>{ onMounted(() => {});
// console.log(props.to,'111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111111')
})
</script> </script>
<template> <template>
......
...@@ -621,6 +621,7 @@ const handleMissionDetails = async (id: any) => { ...@@ -621,6 +621,7 @@ const handleMissionDetails = async (id: any) => {
// 获取esa数据列表的方法 // 获取esa数据列表的方法
const getData = async () => { const getData = async () => {
tableData.value.length = 0;
searchStation.value = ""; searchStation.value = "";
searchTargetName.value = ""; searchTargetName.value = "";
searchTimeValue.value = ""; searchTimeValue.value = "";
......
...@@ -337,6 +337,7 @@ const handleDetails = async (id: any) => { ...@@ -337,6 +337,7 @@ const handleDetails = async (id: any) => {
}; };
// 获取itu数据列表的方法 // 获取itu数据列表的方法
const getData = async () => { const getData = async () => {
tableData.value.length = 0;
const res = await getItuList({ page: pageObj.value.pageNo, size: pageObj.value.pageSize }); const res = await getItuList({ page: pageObj.value.pageNo, size: pageObj.value.pageSize });
searchTargetName.value = ""; searchTargetName.value = "";
searchTargetId.value = ""; searchTargetId.value = "";
......
...@@ -40,6 +40,8 @@ ...@@ -40,6 +40,8 @@
<div class="table-content"> <div class="table-content">
<el-table <el-table
:data="tableData" :data="tableData"
v-loading="tableData.length == 0"
element-loading-background="rgba(48, 65, 86, 0.7)"
style="width: 100%" style="width: 100%"
border border
:row-style="{ height: '45.5px' }" :row-style="{ height: '45.5px' }"
...@@ -297,6 +299,7 @@ ${res.data.data[0].TLE_LINE2}`; ...@@ -297,6 +299,7 @@ ${res.data.data[0].TLE_LINE2}`;
}; };
// 获取st数据列表的方法 // 获取st数据列表的方法
const getData = async () => { const getData = async () => {
tableData.value.length = 0;
const res = await getStList({ page: pageObj.value.pageNo, size: pageObj.value.pageSize }); const res = await getStList({ page: pageObj.value.pageNo, size: pageObj.value.pageSize });
pageObj.value.total = res.data.total; pageObj.value.total = res.data.total;
tableData.value = res.data.list; tableData.value = res.data.list;
......
...@@ -32,7 +32,6 @@ import stDataTab from "./components/stDataTab.vue"; ...@@ -32,7 +32,6 @@ import stDataTab from "./components/stDataTab.vue";
import dsnDataTab from "./components/dsnData/dsnTab.vue"; import dsnDataTab from "./components/dsnData/dsnTab.vue";
import esDataTab from "./components/esDataTab.vue"; import esDataTab from "./components/esDataTab.vue";
import exportDialog from "@/components/Export/index.vue"; import exportDialog from "@/components/Export/index.vue";
import type { UploadInstance } from "element-plus";
import MenuTitle from "@/components/MenuTitle.vue"; import MenuTitle from "@/components/MenuTitle.vue";
const mode = ref(sessionStorage.getItem("dataDisplayMode") || "DSN数据"); const mode = ref(sessionStorage.getItem("dataDisplayMode") || "DSN数据");
......
...@@ -123,7 +123,6 @@ const handleDetails = (row: any) => { ...@@ -123,7 +123,6 @@ const handleDetails = (row: any) => {
const getData = async () => { const getData = async () => {
const res = await getSpiderList({ scrapydServerId: "1", project: "spiders" }); const res = await getSpiderList({ scrapydServerId: "1", project: "spiders" });
tableData.value = res.data; tableData.value = res.data;
console.log(res.data);
}; };
const editDialogVisible = ref(false); const editDialogVisible = ref(false);
...@@ -217,7 +216,6 @@ const handleEditSateId = async () => { ...@@ -217,7 +216,6 @@ const handleEditSateId = async () => {
if (res.code === 0) { if (res.code === 0) {
sateNoList.value = res.data || []; sateNoList.value = res.data || [];
} }
console.log(res);
} catch (error: any) { } catch (error: any) {
ElMessage.error(error.message); ElMessage.error(error.message);
} }
......
...@@ -8,17 +8,19 @@ ...@@ -8,17 +8,19 @@
<div class="items"> <div class="items">
<div class="wordStyle"> <div class="wordStyle">
<span>DSN爬虫任务数:</span> <span>DSN爬虫任务数:</span>
<span class="total-num" v-if="dsnTotalTaskNumber != null">{{ dsnTotalTaskNumber }}</span> <span class="total-num" v-if="dsnTotalTaskNumber != null">{{ formatExactLargeNum(dsnTotalTaskNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行成功统计:</span> <span>任务执行成功统计:</span>
<span class="total-num" v-if="dsnTaskSuccessNumber != null">{{ dsnTaskSuccessNumber }}</span> <span class="total-num" v-if="dsnTaskSuccessNumber != null">{{
formatExactLargeNum(dsnTaskSuccessNumber)
}}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行失败统计:</span> <span>任务执行失败统计:</span>
<span class="total-num" v-if="dsnTaskFailNumber != null">{{ dsnTaskFailNumber }}</span> <span class="total-num" v-if="dsnTaskFailNumber != null">{{ formatExactLargeNum(dsnTaskFailNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
...@@ -35,22 +37,24 @@ ...@@ -35,22 +37,24 @@
<div class="items"> <div class="items">
<div class="wordStyle"> <div class="wordStyle">
<span>ITU爬虫任务数:</span> <span>ITU爬虫任务数:</span>
<span class="total-num" v-if="ituTotalTaskNumber != null">{{ ituTotalTaskNumber }}</span> <span class="total-num" v-if="ituTotalTaskNumber != null">{{ formatExactLargeNum(ituTotalTaskNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行成功统计:</span> <span>任务执行成功统计:</span>
<span class="total-num" v-if="ituTaskSuccessNumber != null">{{ ituTaskSuccessNumber }}</span> <span class="total-num" v-if="ituTaskSuccessNumber != null">{{
formatExactLargeNum(ituTaskSuccessNumber)
}}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行失败统计:</span> <span>任务执行失败统计:</span>
<span class="total-num" v-if="ituTaskFailNumber != null">{{ ituTaskFailNumber }}</span> <span class="total-num" v-if="ituTaskFailNumber != null">{{ formatExactLargeNum(ituTaskFailNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行失败统计:</span> <span>任务执行失败统计:</span>
<span class="total-num" v-if="ituTaskFailNumber != null">{{ ituTaskFailNumber }}</span> <span class="total-num" v-if="ituTaskFailNumber != null">{{ formatExactLargeNum(ituTaskFailNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
...@@ -67,17 +71,17 @@ ...@@ -67,17 +71,17 @@
<div class="items"> <div class="items">
<div class="wordStyle"> <div class="wordStyle">
<span>ST爬虫任务数:</span> <span>ST爬虫任务数:</span>
<span class="total-num" v-if="stTotalTaskNumber != null">{{ stTotalTaskNumber }}</span> <span class="total-num" v-if="stTotalTaskNumber != null">{{ formatExactLargeNum(stTotalTaskNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>任务执行成功统计:</span> <span>任务执行成功统计:</span>
<span class="total-num" v-if="stTaskSuccessNumber != null">{{ stTaskSuccessNumber }}</span> <span class="total-num" v-if="stTaskSuccessNumber != null">{{ formatExactLargeNum(stTaskSuccessNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
<span>采集速度:</span> <span>采集速度:</span>
<span class="total-num" v-if="stTaskFailNumber != null">{{ stTaskFailNumber }}</span> <span class="total-num" v-if="stTaskFailNumber != null">{{ formatExactLargeNum(stTaskFailNumber) }}</span>
<span class="loading" v-else></span> <span class="loading" v-else></span>
</div> </div>
<div class="wordStyle"> <div class="wordStyle">
...@@ -97,6 +101,7 @@ import { onMounted, ref } from "vue"; ...@@ -97,6 +101,7 @@ import { onMounted, ref } from "vue";
import { getSpiderTaskList } from "@/api/spiderTask"; import { getSpiderTaskList } from "@/api/spiderTask";
import { useSlideStateStore } from "@/store/slideState"; import { useSlideStateStore } from "@/store/slideState";
import { storeToRefs } from "pinia"; import { storeToRefs } from "pinia";
import formatExactLargeNum from "@/utils/formatExactLargeNum";
const slideStateStore = useSlideStateStore(); const slideStateStore = useSlideStateStore();
const { slideState } = storeToRefs(slideStateStore); const { slideState } = storeToRefs(slideStateStore);
......
...@@ -115,16 +115,7 @@ const pageObj = ref({ ...@@ -115,16 +115,7 @@ const pageObj = ref({
pageNo: 1, pageNo: 1,
pagerCount: 5, pagerCount: 5,
}); });
// 前往运行日志,暂时不要
// const handleDetails = (row: any) => {
// console.log(row);
// router.push({
// path: '/os-log/list',
// query: {
// id: row.id
// }
// })
// }
const goToStatus = () => { const goToStatus = () => {
if (route.query.mode === "状态监控") { if (route.query.mode === "状态监控") {
router.push({ router.push({
...@@ -138,6 +129,7 @@ const goToStatus = () => { ...@@ -138,6 +129,7 @@ const goToStatus = () => {
}; };
// 获取任务执行记录列表 // 获取任务执行记录列表
const getData = async () => { const getData = async () => {
tableData.value.length = 0;
const res = await getSpiderTaskRecord({ page: pageObj.value.pageNo, size: pageObj.value.pageSize, status: "total" }); const res = await getSpiderTaskRecord({ page: pageObj.value.pageNo, size: pageObj.value.pageSize, status: "total" });
pageObj.value.total = res.data.total; pageObj.value.total = res.data.total;
tableData.value = res.data.list; tableData.value = res.data.list;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment