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/TaskEvent.vue |   60 ++++++++++++++++++++++++++++--------------------------------
 1 files changed, 28 insertions(+), 32 deletions(-)

diff --git a/src/views/TaskManage/TaskTop/TaskEvent.vue b/src/views/TaskManage/TaskTop/TaskEvent.vue
index 59c695e..cb3189d 100644
--- a/src/views/TaskManage/TaskTop/TaskEvent.vue
+++ b/src/views/TaskManage/TaskTop/TaskEvent.vue
@@ -1,13 +1,12 @@
-<!-- 任务事件统计 -->
+<!-- 任务事件数量比统计 -->
 <template>
-  <!-- <common-title title="任务事件统计"></common-title> -->
   <div class="task-event">
+    <div class="title">任务事件数量比统计</div>
     <div class="chart" ref="chartRef"></div>
   </div>
  </template>
 
 <script setup>
-import CommonTitle from '@/components/CommonTitle.vue';
 import * as echarts from 'echarts';
 import { jobEventBar } from '@/api/home/task';
 import dayjs from 'dayjs';
@@ -24,20 +23,22 @@
     trigger: 'axis',
     axisPointer: {
       type: 'shadow'
-    }
+    },
+    formatter: '{b}: {c} 件'
   },
   legend: {
     data: ['任务', '事件'],
+    top: '2%',
     textStyle: {
-      color: '#fff'
+      color: '#6B90B5',
+      fontSize: 12,
     },
-    bottom: '5%'
   },
   grid: {
     top: '15%',
     left: '3%',
     right: '4%',
-    bottom: '15%',
+    bottom: '2%',
     containLabel: true
   },
   xAxis: {
@@ -55,6 +56,7 @@
   },
   yAxis: {
     type: 'value',
+    name: '单位:件',
     axisLine: {
       lineStyle: {
         color: '#fff'
@@ -73,22 +75,22 @@
     {
       name: '任务',
       type: 'bar',
-      barWidth: '20%',
+      barWidth: '6px',
       itemStyle: {
         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          { offset: 0, color: '#1EE7E7' },
-          { offset: 1, color: 'rgba(30, 231, 231, 0.1)' }
+          { offset: 0, color: '#1EE7C5' },
+          { offset: 1, color: '#84EDFF' }
         ])
       }
     },
     {
       name: '事件',
       type: 'bar',
-      barWidth: '20%',
+      barWidth: '6px',
       itemStyle: {
         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-          { offset: 0, color: '#0070FF' },
-          { offset: 1, color: 'rgba(0, 112, 255, 0.1)' }
+          { offset: 0, color: '#69BCFF' },
+          { offset: 1, color: '#183FFF' }
         ])
       }
     }
@@ -104,12 +106,6 @@
     option.series[1].data = res.data?.data.map(item => item.data[1].value);
     chart.setOption(option);
   });
-};
-
-// 生成随机颜色
-const getRandomColor = () => {
-  const colors = ['#1890FF', '#36CBCB', '#4ECB73', '#FBD437', '#F2637B', '#975FE5'];
-  return colors[Math.floor(Math.random() * colors.length)];
 };
 
 onBeforeUnmount(() => {
@@ -140,21 +136,21 @@
 <style lang="scss" scoped>
 .task-event {
   font-family: YouSheBiaoTiHei, YouSheBiaoTiHei;
-  // margin-left: 29px;
-  // padding: 16px 16px;
-  width: 340px;
-  height: 200px;
-  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;
+  width: 660px;
+  height: 100%;
+  margin-left: 40px;
+  .title {
+    margin-top: 10px; 
+    width: 660px;
+    height: 28.6px;
+    background: url('@/assets/images/task/task-event-total.png') no-repeat center / 100% 100%;
+    color: #CFEAFF;
+    padding-left: 44px;
+    line-height: 8px;
+  }
   .chart {
     width: 100%;
-    height: 100%;
+    height: 200px;
   }
 }
 </style>
\ No newline at end of file

--
Gitblit v1.9.3