From 02409bfbe15f22fc3b5dccadabfd860a660a49d9 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 11 Oct 2025 10:37:14 +0800
Subject: [PATCH] feat: 名称修改
---
src/views/wel/components/taskOutcome.vue | 111 ++++++++++++++++++++++++++++++++++++++-----------------
1 files changed, 77 insertions(+), 34 deletions(-)
diff --git a/src/views/wel/components/taskOutcome.vue b/src/views/wel/components/taskOutcome.vue
index 5c71603..773c115 100644
--- a/src/views/wel/components/taskOutcome.vue
+++ b/src/views/wel/components/taskOutcome.vue
@@ -3,7 +3,7 @@
<div class="card-title">
<div class="cardtotal">
<p>任务成果</p>
- <span class="total-number">1856</span>
+ <span class="total-number">{{totalNum}}</span>
<p>个</p>
<img @click="refresh" src="/src/assets/images/workbench/st1.svg" alt="" />
</div>
@@ -24,32 +24,43 @@
</template>
<script setup>
-import { getdisposeApi } from '@/api/home/index';
+import { getdisposeApi, gettaskOutcomApi } from '@/api/home/index';
import * as echarts from 'echarts';
import dayjs from 'dayjs';
import useEchartsResize from '@/hooks/useEchartsResize';
-let checked = ref('YEAR');
+let checked = ref('CURRENT_YEAR');
let timeListStr = ['本周', '本月', '本年'];
-let timeListEnum = ['WEEK', 'MONTH', 'YEAR'];
+let timeListEnum = ['CURRENT_WEEK', 'CURRENT_MONTH', 'CURRENT_YEAR'];
const params = ref({
- date_enum: 'YEAR',
+ dateEnum: 'CURRENT_YEAR',
device_sn: '',
end_date: undefined,
start_date: undefined,
});
-const dateSelect = ref('YEAR');
+const totalNum = ref(0)
+const dateSelect = ref('CURRENT_YEAR');
const refresh = () => {
- params.value.date_enum = 'YEAR';
- checked.value = 'YEAR';
- dateSelect.value = 'YEAR';
+
getBarChartData(params.value);
};
let timeClick = (item, index) => {
checked.value = item;
- params.value.date_enum = item;
+ params.value.dateEnum = item;
dateSelect.value = item;
+ getBarChartData(params.value);
};
+const seriesObj = {};
const echartsOption = {
+ title: {
+ text: seriesObj ? '' :'暂无数据',
+ left: 'center',
+ top: 'center',
+ textStyle: {
+ color: '#999',
+ fontSize: '1.6rem',
+ fontWeight: 'normal'
+ }
+ },
tooltip: {
trigger: 'axis',
axisPointer: {
@@ -59,7 +70,7 @@
legend: {
itemWidth: 14,
itemHeight: 8,
- data: ['待处理', '处理中', '已完成'], // 确保包含所有系列名称
+ data: ['照片总数', '视频总数', 'AI识别', '全景', '三维', '正射'],
top: '-1%',
textStyle: {
color: '#383838',
@@ -67,7 +78,7 @@
},
},
grid: {
- // top: '5%',
+ top: '9%',
left: 0,
right: 0,
bottom: 0,
@@ -77,9 +88,9 @@
type: 'category',
axisLine: {
show: true, // 隐藏轴线
- lineStyle: {
- color: '#cdd5e2',
- },
+ lineStyle: {
+ color: '#cdd5e2',
+ },
},
axisLabel: {
color: '#383838',
@@ -120,13 +131,15 @@
],
series: [],
};
-
const eventTypeList = ref([
- { name: '待处理', value: 0, color: '#FF7411' },
- { name: '处理中', value: 0, color: '#FFFF61' },
- { name: '已完成', value: 0, color: '#06D957' },
+ {name: '照片总数', value: 0, type: '0', color: '#ED672D' },
+ { name: '视频总数', value: 0, type: '1', color: '#F5B763' },
+ { name: 'AI识别', value: 0, type: '2', color: '#6851C3' },
+ { name: '全景', value: 0, type: '5', color: '#FFE100' },
+ { name: '三维', value: 0, type: '3', color: '#04C598' },
+ { name: '正射', value: 0, type: '4', color: '#3673E8' },
]);
-const seriesObj = {};
+
eventTypeList.value.forEach(item => {
seriesObj[item.name] = {
type: 'bar',
@@ -144,22 +157,53 @@
let { chart } = useEchartsResize(echartsRef);
// 获取柱状图数据
const getBarChartData = value => {
- getdisposeApi(value).then(res => {
+ gettaskOutcomApi(value).then(res => {
const list = res?.data?.data || [];
+
+
+ eventTypeList.value.forEach(item => {
+ item.value = 0;
+ });
+ const typeMap = new Map();
+ eventTypeList.value.forEach(item => {
+ typeMap.set(item.type, item);
+ });
echartsOption.xAxis.data = list.map(item => item.name);
- // 赋值前清空数据
+
Object.keys(seriesObj).forEach(key => {
seriesObj[key].data = [];
- });
- list.forEach(item => {
- item.data.forEach((item1, index) => {
- if (!seriesObj?.[item1.name]) return;
- seriesObj[item1.name].data.push(item1.value);
+ });
+ // 遍历所有月份
+ list.forEach(month => {
+ totalNum.value = month.total
+ const monthData = new Map();
+ month.data.forEach(item => {
+ monthData.set(item.name, item.value);
+ });
+ eventTypeList.value.forEach(typeItem => {
+ const value = monthData.get(typeItem.type) || 0;
+ if (seriesObj[typeItem.name]) {
+ seriesObj[typeItem.name].data.push(value);
+ }
});
});
-
+ if (list.length > 0) {
+ const lastMonth = list[list.length - 1];
+ const lastMonthData = new Map();
+ lastMonth.data.forEach(item => {
+ lastMonthData.set(item.name, item.value);
+ });
+
+ eventTypeList.value.forEach(item => {
+ const value = lastMonthData.get(item.type);
+ if (value !== undefined) {
+ item.value = value;
+ }
+ });
+ }
+
+ // 更新图表
echartsOption.series = Object.values(seriesObj);
-
chart.value.setOption(echartsOption);
});
};
@@ -175,10 +219,10 @@
background: #ffffff !important;
margin-top: 10px;
margin-left: 10px;
- height: pxToVh(400);
+ height: pxToVh(473);
.card-title {
display: flex;
- margin-bottom: 10px;
+ // margin-bottom: 10px;
align-items: center;
justify-content: space-between;
.cardtotal {
@@ -260,9 +304,8 @@
}
.chart {
width: 98%;
- // height: 265px;
- height: pxToVh(285);
+ height: pxToVh(380);
padding-left: 10px;
- margin-top: 27px;
+ margin-top: 10px;
}
</style>
--
Gitblit v1.9.3