From d643050ffd11f45b4512865c09f4da6754ea90d2 Mon Sep 17 00:00:00 2001
From: chenyao <1219716595@qq.com>
Date: Sat, 12 Apr 2025 17:46:51 +0800
Subject: [PATCH] feat: 修改任务管理功能
---
src/views/TaskManage/TaskTop/TaskTotal.vue | 109 +++++++++++++++++++++++++++---------------------------
1 files changed, 55 insertions(+), 54 deletions(-)
diff --git a/src/views/TaskManage/TaskTop/TaskTotal.vue b/src/views/TaskManage/TaskTop/TaskTotal.vue
index 5a5178c..bfb8291 100644
--- a/src/views/TaskManage/TaskTop/TaskTotal.vue
+++ b/src/views/TaskManage/TaskTop/TaskTotal.vue
@@ -1,11 +1,15 @@
<!-- 任务统计 -->
<template>
- <!-- <common-title title="任务统计" :style="{ marginLeft: pxToRem(14) }"></common-title> -->
<div class="task-total">
- <div class="card" v-for="item in list">
- <div>
- <div class="value">{{ item.value }}</div>
- <div class="name">{{item.name}}</div>
+ <div class="total">
+ <div class="txt">总任务数</div>
+ <div class="num">{{ total }}</div>
+ <img src="@/assets/images/task/total.png" alt="">
+ </div>
+ <div class="other-total">
+ <div class="total" v-for="item in list">
+ <div class="value" :style="{ color:item.color }">{{ item.value }}</div>
+ <div class="name">{{ item.name }}</div>
</div>
</div>
</div>
@@ -13,23 +17,22 @@
<script setup>
import { pxToRem } from '@/utils/rem';
-import CommonTitle from '@/components/CommonTitle.vue';
import { totalJobNum, jobStatistics } from "@/api/home/task";
+const total = ref(0);
const list = ref([
- { name: '总任务数', value: '1888'},
- { name: '计划执行', value: '18'},
- { name: '执行中', value: '999'},
- { name: '待执行', value: '8888'},
- { name: '已执行', value: '666'},
- { name: '执行失败', value: '2222'},
+ { name: '计划执行', value: '0', color: '#FFFFFF'},
+ { name: '执行中', value: '0', color: '#FFA768'},
+ { name: '待执行', value: '0', color: '#FFE17E'},
+ { name: '已执行', value: '0', color: '#8EFFAC'},
+ { name: '执行失败', value: '0', color: '#FF8E8E'},
]);
// 获取任务统计总数
const getTotalJobNum = () => {
totalJobNum().then((res) => {
if (res.data.code !== 0) returen;
- list.value[0].value = res.data.data;
+ total.value = res.data.data;
});
};
// 获取其他任务统计
@@ -53,48 +56,46 @@
<style lang="scss" scoped>
.task-total {
font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
- // margin-left: 29px;
- // padding: 16px 16px;
- width: 340px;
- height: 200px;
- left: 40px;
- background: linear-gradient(
- 270deg,
- rgba(31, 62, 122, 0) 0%,
- rgba(31, 62, 122, 0.35) 21%,
- #1f3e7a 100%
- );
- border-radius: 0px 0px 0px 0px;
- opacity: 0.85;
- margin-bottom: 12px;
- display: grid;
- grid-template-columns: repeat(2, 1fr);
- grid-template-rows: repeat(3, 1fr);
- gap: 10px;
- padding: 20px;
- .card {
- /* position: absolute;
- top: 8px;
- right: 10px;
- width: 200px; */
- display: flex;
- flex-wrap: wrap;
- gap: 8px;
- justify-content: flex-start;
- line-height: 22px;
- padding: 0 10px 10px 0;
- color: #ffffff;
- .name {
- font-family: Source Han Sans CN, Source Han Sans CN;
- font-weight: 400;
- font-size: 14px;
-
+ display: flex;
+ justify-content: space-between;
+ color: #ffffff;
+ .total {
+ position: relative;
+ text-align: center;
+ left: 18px;
+ .txt {
+ font-size: 16px;
+ margin-bottom: 14px;
+ margin-top: 40px;
}
-
- .value {
- font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
- font-weight: 400;
- font-size: 26px;
+ img { width: 160px; height: 110px;}
+ .num {
+ position: absolute;
+ font-size: 32px;
+ top: 94px;
+ left: 56px;
+ }
+ }
+ .other-total {
+ width: 256px;
+ height: 188px;
+ background: url('@/assets/images/task/other-total.png') no-repeat center / 100% 100%;
+ margin-top: 22px;
+ padding: 20px;
+ display: flex;
+ flex-wrap: wrap;
+ align-content: space-around;
+ .total {
+ position: static;
+ width: 30%;
+ text-align: center;
+ left: 0;
+ .name {
+ font-size: 14px;
+ }
+ .value {
+ font-size: 26px;
+ }
}
}
}
--
Gitblit v1.9.3