From 085cf2147684e4849f68d5f7c99e122815e45e0f Mon Sep 17 00:00:00 2001
From: buaixuexideshitongxue <2936013465@qq.com>
Date: Tue, 17 Mar 2026 11:44:17 +0800
Subject: [PATCH] =?UTF-8?q?fix--jwpy=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/views/datav/Jwpy.vue | 117 +++++++++++++++++++++++----------------
1 file changed, 70 insertions(+), 47 deletions(-)
diff --git a/src/views/datav/Jwpy.vue b/src/views/datav/Jwpy.vue
index 2439fae..2a0605f 100644
--- a/src/views/datav/Jwpy.vue
+++ b/src/views/datav/Jwpy.vue
@@ -292,10 +292,46 @@ const time = ref([
const getDistributionFun = async()=>{
console.log('---------')
const res = await selectDistribution(time.value);
- option4.value.series[0].data=res.total;
- option4.value.series[1].data=res.checkStatus;
- // option4.value.series[2].data=res.checkStatus;
- option4.value.yAxis.data=res.name;
+
+ // 准备数据
+ const names = res.name;
+ const totalData = res.total;
+ const checkStatusData = res.checkStatus;
+
+ // 组合数据并排序
+ const combinedData = names.map((name, index) => ({
+ name: name,
+ total: totalData[index],
+ checkStatus: checkStatusData[index]
+ }));
+
+ // 按照下发数排序
+ // combinedData.sort((a, b) => b.total - a.total);
+ combinedData.sort((a, b) => a.total - b.total);
+ // 更新图表配置
+ option4.value.yAxis.data = combinedData.map(item => item.name);
+ option4.value.series[0].data = combinedData.map(item => ({
+ value: item.checkStatus,
+ itemStyle: {
+ color: '#4987F6'
+ },
+ label: {
+ show: true,
+ position: 'right',
+ color: '#fff',
+ formatter: (params) => {
+ const item = combinedData[params.dataIndex];
+ return `${item.checkStatus}/${item.total}`;
+ }
+ }
+ }));
+ option4.value.series[1].data = combinedData.map(item => ({
+ value: item.total - item.checkStatus,
+ itemStyle: {
+ color: '#193775'
+ }
+ }));
+
console.log('option4',option4.value)
}
@@ -329,14 +365,14 @@ const toggleSelect=()=> {
const handleYearChange = (checkedYear) => {
toggleSelect()
- yearValue.value= years.value.find(s=>s.ID == checkedYear).PeriodName;
+ yearValue.value= years.value.find(s=>s.ID == checkedYear).PeriodName;
console.log("年份" + selectYear.value + " 月份" + selectMonth.value + " 单位" + selectOrg.value + " task" + task.value)
getData();
}
const handleMonthChange = (checkedMonth) => {
toggleSelect()
- monthValue.value= months.value.find(s=>s.ID === checkedMonth).SonPeriodName;
+ monthValue.value= months.value.find(s=>s.ID === checkedMonth).SonPeriodName;
console.log(monthValue.value)
console.log("年份" + selectYear.value + " 月份" + selectMonth.value + " 单位" + selectOrg.value + " task" + task.value)
getData();
@@ -648,9 +684,23 @@ const option3 = ref({
grid: {left: '8%', right: '0%', top: '10%', bottom: '10%'},
});
const option4 = ref({
- tooltip: {},
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ },
+ formatter: function(params) {
+ const check = params[0].value;
+ const remaining = params[1].value;
+ const total = check + remaining;
+ return `${params[0].name}
+ 下发数: ${total}
+ 查实数: ${check}
+ 占比: ${((check/total)*100).toFixed(1)}%`;
+ }
+ },
legend: {
- data: ['下发数', '查实数'],
+ data: ['查实数', '下发数'],
textStyle: {
color: '#fff',
},
@@ -681,54 +731,27 @@ const option4 = ref({
},
series: [
{
- name: '下发数',
+ name: '查实数',
type: 'bar',
+ stack: 'total',
+ barWidth: '60%',
data: [],
- label: {
- show: true,
- position: 'right',
- color:'#fff'
- },
itemStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- offset: 0,
- color: 'rgba(40,230,255,0.63)'
- }, {offset: 1, color: 'rgba(40,230,255,0)'}])
- },
+ color: '#4987F6'
+ }
},
{
- name: '查实数',
+ name: '下发数',
type: 'bar',
+ stack: 'total',
+ barWidth: '60%',
data: [],
- label: {
- show: true,
- position: 'right',
- color:'#fff'
- },
itemStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1,
- [{offset: 0, color: 'rgba(255,218,51,0.52)'},
- {offset: 1, color: 'rgba(255,219,49,0)'}])
- }
- },
- // {
- // name: '办结数',
- // type: 'bar',
- // data: [],
- // label: {
- // show: true,
- // position: 'right',
- // color:'#fff'
- // },
- // itemStyle: {
- // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
- // offset: 0,
- // color: '#6FDBA0'
- // }, {offset: 1, color: '#6FDBA0'}])
- // }
- // }
+ color: '#193775'
+ },
+ }
],
- grid: {left: '17%', right: '0%', top: '10%', bottom: '10%'},
+ grid: {left: '17%', right: '15%', top: '10%', bottom: '10%'},
});