From 516b908d7d2df5e0eeb36f2f5ca3ccb103d1e14b Mon Sep 17 00:00:00 2001
From: zxl <763096477@qq.com>
Date: 星期四, 11 十二月 2025 15:49:35 +0800
Subject: [PATCH] 首页工作台
---
src/views/index-nongtou.vue | 1125 +++++++++++++++++++++++++++++++++-------------------------
1 files changed, 643 insertions(+), 482 deletions(-)
diff --git a/src/views/index-nongtou.vue b/src/views/index-nongtou.vue
index 2850d36..31aeb41 100644
--- a/src/views/index-nongtou.vue
+++ b/src/views/index-nongtou.vue
@@ -60,19 +60,15 @@
<div slot="header" class="clearfix row">
<div style="flex: 1">椤圭洰杩涘害缁熻</div>
<div style="flex: 3;display: flex;justify-content: flex-end">
- <el-select
+ <el-date-picker
v-model="selectedMonth"
+ type="month"
placeholder="閫夋嫨鏈堜唤"
- style="width: 120px; margin-right: 10px;"
+ style="width: 180px; margin-right: 10px;"
@change="updateProgressChart"
- >
- <el-option
- v-for="month in months"
- :key="month.value"
- :label="month.label"
- :value="month.value"
- ></el-option>
- </el-select>
+ format="yyyy-MM"
+ value-format="yyyy-MM"
+ ></el-date-picker>
<el-select
v-model="selectedProjects"
multiple
@@ -88,7 +84,7 @@
:value="project.id"
></el-option>
</el-select>
- <el-button type="text" @click="showDetail">璇︽儏</el-button>
+<!-- <el-button type="text" @click="showDetail">璇︽儏</el-button>-->
</div>
</div>
<div class="chart-container" ref="progressChart" style="height: 400px;"></div>
@@ -99,17 +95,17 @@
<div slot="header" class="clearfix row">
<div style="flex: 1">鎺ㄨ繘鍗＄偣</div>
<div style="flex: 3; display: flex; justify-content: flex-end">
- <el-button type="text">鍏ㄩ儴</el-button>
+<!-- <el-button type="text">鍏ㄩ儴</el-button>-->
</div>
</div>
<el-table :data="blockingTasks" style="width: 100%" height="250">
<el-table-column prop="taskName" label="浠诲姟鍚嶇О" width="180"></el-table-column>
- <el-table-column prop="project" label="鎵�灞為」鐩�"></el-table-column>
- <el-table-column prop="owner" label="璐熻矗浜�" width="100"></el-table-column>
+ <el-table-column prop="checkPointInfo.projectName" label="鎵�灞為」鐩�"></el-table-column>
+ <el-table-column prop="customerTaskInfo.promoterName" label="璐熻矗浜�" width="100"></el-table-column>
<el-table-column prop="startTime" label="寮�濮嬫椂闂�" width="120"></el-table-column>
- <el-table-column prop="deadline" label="鎴鏃ユ湡" width="120"></el-table-column>
- <el-table-column prop="overTime" label="宸茶秴鏃�" width="120"></el-table-column>
- <el-table-column prop="totalOverTimes" label="绱瓒呮椂娆℃暟" width="120" align="center"></el-table-column>
+ <el-table-column prop="endTime" label="鎴鏃ユ湡" width="120"></el-table-column>
+ <el-table-column prop="totalOverTime" label="宸茶秴鏃�" width="120"></el-table-column>
+ <el-table-column prop="overTimeCount" label="绱瓒呮椂娆℃暟" width="120" align="center"></el-table-column>
<el-table-column label="鎿嶄綔" width="80">
<template slot-scope="scope">
<el-button size="mini" @click="handleTaskDetail(scope.row)">鏌ョ湅</el-button>
@@ -141,7 +137,7 @@
:value="project.id"
></el-option>
</el-select>
- <el-button type="text" @click="showFundDetail">璇︽儏</el-button>
+<!-- <el-button type="text" @click="showFundDetail">璇︽儏</el-button>-->
</div>
</div>
<div class="chart-container" ref="fundChart" style="height: 400px;"></div>
@@ -152,7 +148,7 @@
<div slot="header" class="clearfix row">
<div style="flex:1">椤圭洰闃舵缁熻</div>
<div style="flex:3;display: flex;justify-content: flex-end">
- <el-button type="text">璇︽儏</el-button>
+<!-- <el-button type="text">璇︽儏</el-button>-->
</div>
</div>
<div class="chart-container" ref="stageChart" style="height: 250px;"></div>
@@ -164,66 +160,52 @@
<script>
import * as echarts from 'echarts';
-import {getCodingCount ,getFundingStatus } from '@/api/index/index.js'
+import {
+ getCodingCount,
+ getFundingStatus,
+ getTaskStatus,
+ getProjectSelectList,
+ getStageCount,
+ getProjectAdvanceCheckPoint
+} from '@/api/index/index.js'
export default {
name: 'ProjectManagement',
data() {
return {
+ pathMap:{
+ '鍦ㄥ簱': { path: '/projectEngineering/project/projectLibrary' },
+ '鍌ㄥ': {
+ path: '/projectEngineering/project/reserveProjects',
+ query: { projectPhase: 1 }
+ },
+ '鍓嶆湡': {
+ path:'/projectEngineering/project/previousProjects',
+ query: { projectPhase: 2 }
+ },
+ '瀹炴柦': {
+ path:'/projectEngineering/project/implementationProject',
+ query: { projectPhase: 3 }
+ },
+ '绔ｅ伐': {
+ path:'/projectEngineering/project/completedProjects',
+ query: { projectPhase: 4 }
+ }
+ },
userName: '寮犵粡鐞�',
userAvatar: 'https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png',
overviewData: {
- totalProjects: 42,
- inProgress: 28,
- atRisk: 7,
- delayed: 5
+ totalProjects: 0,
+ inProgress: 0,
+ atRisk: 0,
+ delayed: 0
},
blockingTasks: [
- {
- taskName: '鍙栧緱鍦熷湴鏉冨睘',
- project: '灏勬椽甯傞厭绮熀鍦板缓璁鹃」鐩�',
- owner: '鏉庡洓',
- startTime: '2025-05-15',
- overTime: '10澶�06灏忔椂',
- deadline: '2025-06-05',
- totalOverTimes: 4,
- status: '绱ф��'
- },
- {
- taskName: '鍙鎬х爺绌舵姤鍛婄敵璇�',
- project: '灏勬椽甯傞厭绮熀鍦板缓璁鹃」鐩�',
- owner: '鐜嬩簲',
- startTime: '2025-05-21',
- overTime: '8澶�',
- deadline: '2025-05-30',
- totalOverTimes: '5',
- status: '楂橀闄�'
- },
- {
- taskName: '寤鸿宸ョ▼绔ｅ伐楠屾敹鐢宠',
- project: '灏勬椽甯傚疁灞呭疁涓氬拰缇庝埂鏉戝缓璁鹃」鐩�',
- owner: '璧靛叚',
- startTime: '2025-05-24',
- overTime: '4澶�14灏忔椂',
- deadline: '2025-06-04',
- totalOverTimes: '4',
- status: '寤舵湡'
- },
- {
- taskName: '鐢熶骇寤鸿椤圭洰姘村湡淇濇寔鏂规缂栧埗',
- project: '灏勬椽甯傚疁灞呭疁涓氬拰缇庝埂鏉戝缓璁鹃」鐩�',
- owner: '閽变竷',
- startTime: '2025-06-01',
- overTime: '4澶�',
- deadline: '2025-06-07',
- totalOverTimes: '6',
- status: '杩涜涓�'
- },
],
progressChart: null,
fundChart: null,
stageChart: null,
// 绛涢�夋暟鎹�
- selectedMonth: '2025-06',
+ selectedMonth: this.getCurrentMonth(),
months: [
{ value: '2025-05', label: '2025骞�5鏈�' },
{ value: '2025-06', label: '2025骞�6鏈�' },
@@ -233,134 +215,15 @@
selectedProjects: [],
fundSelectedProjects: [],
allProjects: [
- { id: 'p1', name: '灏勬椽甯傚浗瀹跺偍澶囨灄寤鸿椤圭洰锛堜竴鏈燂級' },
- { id: 'p2', name: '灏勬椽甯傜櫧缇借倝楦′骇涓氬缓璁鹃」鐩�' },
- { id: 'p3', name: '閬傚畞甯傚皠娲�2024鈥�2027骞村害涓滃寳鐗囧尯楂樻爣鍑嗗啘鐢板缓璁鹃」鐩�' },
- { id: 'p4', name: '灏勬椽甯傜幇浠ｇ涓氱ず鑼冨熀鍦板缓璁鹃」鐩�' },
- { id: 'p5', name: '灏勬椽甯傚疁灞呭疁涓氬拰缇庝埂鏉戝缓璁鹃」鐩�' },
- { id: 'p6', name: '灏勬椽甯傛脖鐗岄晣缁煎悎姘村埄璁炬柦寤鸿椤圭洰' }
],
// 椤圭洰杩涘害妯℃嫙鏁版嵁
- progressData: {
- '2025-05': {
- 'p1': { completed: 30, inProgress: 50, notStarted: 20 },
- 'p2': { completed: 40, inProgress: 40, notStarted: 20 },
- 'p3': { completed: 10, inProgress: 60, notStarted: 30 },
- 'p4': { completed: 60, inProgress: 30, notStarted: 10 },
- 'p5': { completed: 25, inProgress: 45, notStarted: 30 },
- 'p6': { completed: 35, inProgress: 35, notStarted: 30 }
- },
- '2025-06': {
- 'p1': { completed: 50, inProgress: 40, notStarted: 10 },
- 'p2': { completed: 60, inProgress: 30, notStarted: 10 },
- 'p3': { completed: 30, inProgress: 50, notStarted: 20 },
- 'p4': { completed: 80, inProgress: 15, notStarted: 5 },
- 'p5': { completed: 45, inProgress: 35, notStarted: 20 },
- 'p6': { completed: 55, inProgress: 25, notStarted: 20 }
- },
- '2025-07': {
- 'p1': { completed: 70, inProgress: 25, notStarted: 5 },
- 'p2': { completed: 80, inProgress: 15, notStarted: 5 },
- 'p3': { completed: 50, inProgress: 40, notStarted: 10 },
- 'p4': { completed: 90, inProgress: 10, notStarted: 0 },
- 'p5': { completed: 65, inProgress: 25, notStarted: 10 },
- 'p6': { completed: 75, inProgress: 15, notStarted: 10 }
- },
- '2025-08': {
- 'p1': { completed: 90, inProgress: 10, notStarted: 0 },
- 'p2': { completed: 95, inProgress: 5, notStarted: 0 },
- 'p3': { completed: 70, inProgress: 25, notStarted: 5 },
- 'p4': { completed: 100, inProgress: 0, notStarted: 0 },
- 'p5': { completed: 85, inProgress: 10, notStarted: 5 },
- 'p6': { completed: 90, inProgress: 5, notStarted: 5 }
- }
- },
- // 璧勯噾浣跨敤妯℃嫙鏁版嵁
- fundData: {
- 'p1': {
- total: 5000,
- allocated: 3500,
- remaining: 1500,
- completed: 2800,
- sources: {
- projectCapital: 2000,
- countyInvestment: 1500,
- otherInvestment: 1000,
- governmentInvestment: 500
- }
- },
- 'p2': {
- total: 3200,
- allocated: 2500,
- remaining: 700,
- completed: 1800,
- sources: {
- projectCapital: 1200,
- countyInvestment: 1000,
- governmentInvestment: 1000
- }
- },
- 'p3': {
- total: 4200,
- allocated: 3000,
- remaining: 1200,
- completed: 2200,
- sources: {
- projectCapital: 1500,
- otherInvestment: 1200,
- governmentInvestment: 1500
- }
- },
- 'p4': {
- total: 2800,
- allocated: 2000,
- remaining: 800,
- completed: 1500,
- sources: {
- projectCapital: 1000,
- countyInvestment: 800,
- otherInvestment: 500,
- governmentInvestment: 500
- }
- },
- 'p5': {
- total: 3800,
- allocated: 3000,
- remaining: 800,
- completed: 2500,
- sources: {
- projectCapital: 1500,
- countyInvestment: 1000,
- governmentInvestment: 1300
- }
- },
- 'p6': {
- total: 4500,
- allocated: 3500,
- remaining: 1000,
- completed: 3000,
- sources: {
- projectCapital: 2000,
- countyInvestment: 1500,
- otherInvestment: 500,
- governmentInvestment: 500
- }
- }
- }
+ progressData: {},
+ fundData: {}
};
},
mounted() {
- getCodingCount().then(res =>{
+ this.initData();
- })
- getFundingStatus().then(res=>{
-
- })
-
- this.selectedProjects = this.allProjects.map(p => p.id); // 榛樿鍏ㄩ��
- this.fundSelectedProjects = this.allProjects.map(p => p.id); // 榛樿鍏ㄩ��
- this.initCharts();
- window.addEventListener('resize', this.handleResize);
},
beforeDestroy() {
window.removeEventListener('resize', this.handleResize);
@@ -375,6 +238,52 @@
}
},
methods: {
+ getCurrentMonth() {
+ const now = new Date();
+ const year = now.getFullYear();
+ const month = String(now.getMonth() + 1).padStart(2, '0'); // 鏈堜唤浠�0寮�濮嬶紝闇�瑕�+1
+ return `${year}-${month}`;
+ },
+ async initData(){
+
+ await this.initSelect();
+ await this.initCodingCount();
+ await this.initCharts();
+ await this.initProjectAdvanceCheckPoint();
+ window.addEventListener('resize', this.handleResize);
+ },
+ initProjectAdvanceCheckPoint(){
+ getProjectAdvanceCheckPoint().then(res =>{
+ if (res.code === 200){
+ this.blockingTasks = res.data;
+
+ }
+
+ })
+ },
+ initCodingCount(){
+ getCodingCount().then(res =>{
+ if(res.code === 200){
+ this.overviewData.totalProjects = res.data.total;
+ this.overviewData.inProgress = res.data.green;
+ this.overviewData.atRisk = res.data.yellow;
+ this.overviewData.delayed = res.data.red;
+ }
+ })
+
+ },
+ initSelect(){
+ getProjectSelectList().then(res =>{
+ if (res.code === 200){
+ this.allProjects = Object.entries(res.data).map(([id, name]) => ({
+ id: id, // 椤圭洰ID锛堝"151"锛�
+ name: name // 椤圭洰鍚嶇О锛堝"灏勬椽甯備竾鏋楅挗鍘傜墖鍖烘鎴峰尯鏀归�犻」鐩�"锛�
+ }));
+ this.selectedProjects = this.allProjects.slice(0, 5).map(p => p.id);
+ this.fundSelectedProjects = this.allProjects.slice(0, 5).map(p => p.id);
+ }
+ })
+ },
initCharts() {
// 鍒濆鍖栭」鐩繘搴﹀浘琛�
this.progressChart = echarts.init(this.$refs.progressChart);
@@ -386,329 +295,560 @@
// 鍒濆鍖栭」鐩樁娈电粺璁″浘琛�
this.stageChart = echarts.init(this.$refs.stageChart);
- this.stageChart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- }
- },
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: {
- type: 'category',
- data: ['鍦ㄥ簱', '鍌ㄥ', '鍓嶆湡', '瀹炴柦', '绔ｅ伐'],
- axisLine: {
- lineStyle: {
- color: '#409EFF'
- }
- }
- },
- yAxis: {
- type: 'value',
- axisLine: {
- lineStyle: {
- color: '#409EFF'
- }
- }
- },
- series: [
- {
- data: [15, 12, 10, 8, 6, 4, 2],
- type: 'line',
- smooth: true,
- lineStyle: {
- width: 3,
- color: '#409EFF'
- },
- itemStyle: {
- color: '#409EFF'
- },
- areaStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
- {
- offset: 0,
- color: 'rgba(64, 158, 255, 0.5)'
- },
- {
- offset: 1,
- color: 'rgba(64, 158, 255, 0.1)'
- }
- ])
- }
- }
- ]
- });
- },
+ this.updateStageChart();
+ },
+ updateStageChart(){
+ if (!this.stageChart) return;
+ getStageCount().then(res =>{
+ if (res.code ===200){
+ const xData = res.data.xData || [];
+ const yData = res.data.yData || [];
+ this.stageChart.setOption({
+ tooltip: {
+ trigger: 'axis',
+ triggerOn: 'mousemove',
+ axisPointer: {
+ type: 'shadow'
+ }
+ },
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
+ },
+ xAxis: {
+ type: 'category',
+ data: xData,
+ axisLine: {
+ lineStyle: {
+ color: '#409EFF'
+ }
+ }
+ },
+ yAxis: {
+ type: 'value',
+ axisLine: {
+ lineStyle: {
+ color: '#409EFF'
+ }
+ }
+ },
+ series: [
+ {
+ data: yData,
+ type: 'line',
+ smooth: true,
+ lineStyle: {
+ width: 3,
+ color: '#409EFF'
+ },
+ itemStyle: {
+ color: '#409EFF'
+ },
+ emphasis: {
+ itemStyle: {
+ color: '#1989fa',
+ size: 10
+ },
+ lineStyle: {
+ width: 4
+ },
+ // 鏁翠釜绯诲垪鍖哄煙hover閮芥樉绀烘墜鍨�
+ cursor: 'pointer',
+ areaStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: 'rgba(25, 137, 250, 0.6)' },
+ { offset: 1, color: 'rgba(25, 137, 250, 0.2)' }
+ ])
+ }
+ },
+ areaStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: 'rgba(64, 158, 255, 0.5)'
+ },
+ {
+ offset: 1,
+ color: 'rgba(64, 158, 255, 0.1)'
+ }
+ ])
+ },
+ triggerLineEvent: true,
+ triggerAreaEvent: true
+ }
+ ]
+ });
+
+ this.stageChart.off('click');
+ this.stageChart.on('click', (params) => {
+ console.log('鍥捐〃鐐瑰嚮鍙傛暟锛�', params);
+ // 浠呯偣鍑荤郴鍒楀尯鍩熸椂澶勭悊
+ if (params.componentType === 'series') {
+ // 1. 灏嗙偣鍑荤殑鍍忕礌鍧愭爣杞崲涓篨杞寸储寮�
+ const pointInPixel = [params.event.offsetX, params.event.offsetY];
+ const xAxisIndex = 0; // X杞寸储寮曪紙鍙湁涓�涓猉杞达紝鍥哄畾涓�0锛�
+ const xAxisValue = this.stageChart.convertFromPixel({ seriesIndex: 0, axisIndex: xAxisIndex }, pointInPixel)[0];
+
+ // 2. 璁＄畻鎵�灞炵殑X杞存爣绛剧储寮曪紙鍙栨暣锛�
+ const targetIndex = Math.max(0, Math.min(xData.length - 1, Math.floor(xAxisValue)));
+ // 3. 鑾峰彇瀵瑰簲鏍囩
+ const targetLabel = xData[targetIndex];
+
+ // 4. 鍖归厤pathMap璺宠浆锛堟棤鍖归厤鍒欒蛋榛樿锛�
+ if (targetLabel && Object.keys(this.pathMap).includes(targetLabel)) {
+ console.log(targetLabel)
+ const targetRoute = this.pathMap[targetLabel] || { path: '/projectEngineering/project/projectLibrary' };
+ this.$router.push(targetRoute);
+ }
+ }
+ });
+ }
+ })
+ },
// 鏇存柊椤圭洰杩涘害鍥捐〃鏁版嵁
updateProgressChart() {
if (!this.progressChart) return;
+ const form ={
+ startTime:this.selectedMonth
+ }
+ getTaskStatus(form).then(res => {
+ if (res.code === 200) {
+ // 浠庡搷搴旀暟鎹腑鎻愬彇娴佺▼缁熻淇℃伅
+ const processStatistics = res.data || [];
- const monthData = this.progressData[this.selectedMonth];
- const filteredProjects = this.allProjects.filter(p =>
- this.selectedProjects.includes(p.id)
- );
- const categories = filteredProjects.map(p => p.name);
- const completedData = filteredProjects.map(p => monthData[p.id].completed);
- const inProgressData = filteredProjects.map(p => monthData[p.id].inProgress);
- const notStartedData = filteredProjects.map(p => monthData[p.id].notStarted);
+ // 灏嗗悗绔暟鎹浆鎹负鍓嶇闇�瑕佺殑鏍煎紡
+ const monthData = {};
+ processStatistics.forEach(item => {
+ // 鍋囪鍚庣杩斿洖鐨勯」鐩甀D瀛楁鏄� projectId锛岄渶瑕佸拰鍓嶇鐨� allProjects 涓殑 id 鍖归厤
+ monthData[item.id] = {
+ completed: item.completed || 0,
+ inProgress: item.inProgress || 0,
+ notStarted: item.notStarted || 0
+ };
+ });
+ // 绛涢�夐�変腑鐨勯」鐩�
+ const filteredProjects = this.allProjects.filter(p =>
+ this.selectedProjects.includes(p.id)
+ );
- this.progressChart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- },
- formatter: function(params) {
- let result = params[0].name + '<br/>';
- params.forEach(param => {
- result += `${param.seriesName}: ${param.value}%<br/>`;
- });
- result += `鎬昏: ${params.reduce((sum, param) => sum + param.value, 0)}%`;
- return result;
- }
- },
- legend: {
- data: ['宸插畬鎴愪簨椤�', '杩涜涓簨椤�', '鏈紑濮嬩簨椤�']
- },
- grid: {
- left: '3%',
- right: '4%',
- bottom: '3%',
- containLabel: true
- },
- xAxis: {
- type: 'value',
- max: 100,
- axisLabel: {
- formatter: '{value}%'
- }
- },
- yAxis: {
- type: 'category',
- data: categories
- },
- series: [
- {
- name: '宸插畬鎴愪簨椤�',
- type: 'bar',
- stack: 'total',
- emphasis: {
- focus: 'series'
+ // 鍑嗗鍥捐〃鏁版嵁
+ const categories = filteredProjects.map(p => p.name);
+ const completedData = filteredProjects.map(p => monthData[p.id]?.completed || 0);
+ const inProgressData = filteredProjects.map(p => monthData[p.id]?.inProgress || 0);
+ const notStartedData = filteredProjects.map(p => monthData[p.id]?.notStarted || 0);
+
+ // 鏇存柊鍥捐〃閰嶇疆
+ this.progressChart.setOption({
+ tooltip: {
+ trigger: 'axis',
+ axisPointer: {
+ type: 'shadow'
+ },
+ formatter: function(params) {
+ let result = params[0].name + '<br/>';
+ params.forEach(param => {
+ result += `${param.seriesName}: ${param.value}%<br/>`;
+ });
+ // result += `鎬昏: ${params.reduce((sum, param) => sum + param.value, 0)}%`;
+ return result;
+ }
},
- data: completedData,
- itemStyle: {
- color: '#67C23A'
+ legend: {
+ data: ['宸插畬鎴愪簨椤�', '杩涜涓簨椤�', '鏈紑濮嬩簨椤�']
},
- label: {
- show: true,
- position: 'inside',
- formatter: '{c}%'
- }
- },
- {
- name: '杩涜涓簨椤�',
- type: 'bar',
- stack: 'total',
- emphasis: {
- focus: 'series'
+ grid: {
+ left: '3%',
+ right: '4%',
+ bottom: '3%',
+ containLabel: true
},
- data: inProgressData,
- itemStyle: {
- color: '#409EFF'
+ xAxis: {
+ type: 'value',
+ max: 100,
+ axisLabel: {
+ formatter: '{value}%'
+ }
},
- label: {
- show: true,
- position: 'inside',
- formatter: '{c}%'
- }
- },
- {
- name: '鏈紑濮嬩簨椤�',
- type: 'bar',
- stack: 'total',
- emphasis: {
- focus: 'series'
+ yAxis: {
+ type: 'category',
+ data: categories
},
- data: notStartedData,
- itemStyle: {
- color: '#E6A23C'
- },
- label: {
- show: true,
- position: 'inside',
- formatter: '{c}%'
- }
- }
- ]
+ series: [
+ {
+ name: '宸插畬鎴愪簨椤�',
+ type: 'bar',
+ stack: 'total',
+ emphasis: {
+ focus: 'series'
+ },
+ data: completedData,
+ itemStyle: {
+ color: '#67C23A'
+ },
+ label: {
+ show: true,
+ position: 'inside',
+ formatter: '{c}%'
+ }
+ },
+ {
+ name: '杩涜涓簨椤�',
+ type: 'bar',
+ stack: 'total',
+ emphasis: {
+ focus: 'series'
+ },
+ data: inProgressData,
+ itemStyle: {
+ color: '#409EFF'
+ },
+ label: {
+ show: true,
+ position: 'inside',
+ formatter: '{c}%'
+ }
+ },
+ {
+ name: '鏈紑濮嬩簨椤�',
+ type: 'bar',
+ stack: 'total',
+ emphasis: {
+ focus: 'series'
+ },
+ data: notStartedData,
+ itemStyle: {
+ color: '#E6A23C'
+ },
+ label: {
+ show: true,
+ position: 'inside',
+ formatter: '{c}%'
+ }
+ }
+ ]
+ });
+ }
+ }).catch(error => {
+ // 閿欒澶勭悊
+ this.progressChart.hideLoading();
+ console.error('鑾峰彇浠诲姟鐘舵�佹暟鎹け璐�:', error);
+ // 鍙互鏄剧ず閿欒鎻愮ず鎴栦娇鐢ㄩ粯璁ゆ暟鎹�
});
},
// 鏇存柊璧勯噾浣跨敤鍥捐〃鏁版嵁
updateFundChart() {
if (!this.fundChart) return;
+ getFundingStatus().then(res=> {
+ if (res.code === 200) {
+ const fundingData = res.data || [];
+ const data = {};
+ fundingData.forEach(item => {
+ // 浠呯粍瑁� SQL 鏌ヨ杩斿洖鐨� 9 涓瓧娈碉紝瀛楁鍚嶄笌 VO 涓�鑷�
+ data[item.projectId] = {
+ id: item.projectId || '', // 椤圭洰ID锛堝叧鑱旈敭锛�
+ totalInvestment: item.totalInvestment || '0', // 椤圭洰鎬绘姇璧勯
+ principal: item.principal || '0', // 椤圭洰鏈噾
+ governmentInvestmentTotal: item.governmentInvestmentTotal || '0', // 鏀垮簻鎶曡祫鎬婚
+ centralInvestmentTotal: item.centralInvestmentTotal || '0', // 涓ぎ鎶曡祫鎬婚
+ provincialInvestmentTotal: item.provincialInvestmentTotal || '0', // 鐪佺骇鎶曡祫鎬婚
+ cityInvestmentTotal: item.cityInvestmentTotal || '0', // 甯傦紙宸烇級鎶曡祫鎬婚
+ countyInvestmentTotal: item.countyInvestmentTotal || '0', // 鍘匡紙甯傘�佸尯锛夋姇璧勬�婚
+ otherInvestmentTotal: item.otherInvestmentTotal || '0', // 鍏朵粬鎶曡祫鎬婚
+ enterpriseSelfRaisedTotal: item.enterpriseSelfRaisedTotal || '0',
+ foreignInvestmentTotal: item.foreignInvestmentTotal || '0',
+ bankLoan: item.bankLoan || '0',//閾惰璐锋
+ domesticLoanTotal: item.domesticLoanTotal || '0',
+ };
+ });
+ console.log(data)
+ const filteredProjects = this.allProjects.filter(p =>
+ this.fundSelectedProjects.includes(p.id)
+ );
+ const categories = filteredProjects.map(p => p.name);
+ // console.log(categories)
+ // const allocatedData = filteredProjects.map(p => data[p.id].allocated);
+ // console.log(allocatedData)
+ // const remainingData = filteredProjects.map(p => data[p.id].remaining);
+ // console.log(remainingData)
- const filteredProjects = this.allProjects.filter(p =>
- this.fundSelectedProjects.includes(p.id)
- );
+ // 璧勯噾鏉ユ簮鏁版嵁 鏈噾
+ const projectCapitalData = filteredProjects.map(p =>
+ data[p.id].principal || 0
+ );
+ //鎬绘姇璧�
+ const totalInvestmentData = filteredProjects.map(p =>
+ data[p.id].totalInvestment || 0
+ );
+ // 鍘匡紙甯傘�佸尯锛夋姇璧勬�婚
+ const countyInvestmentData = filteredProjects.map(p =>
+ data[p.id].countyInvestmentTotal || 0
+ );
+ // 甯傦紙宸烇級鎶曡祫鎬婚
+ const cityInvestmentTotalData = filteredProjects.map(p =>
+ data[p.id].cityInvestmentTotal || 0)
+ // 鐪佺骇鎶曡祫鎬婚
+ const provincialInvestmentTotalData = filteredProjects.map(p =>
+ data[p.id].provincialInvestmentTotal || 0)
+ //鏀垮簻鎶曡祫
+ const governmentInvestmentData = filteredProjects.map(p =>
+ data[p.id].governmentInvestmentTotal || 0
+ );
+ //鍏朵粬鎶曡祫
+ const otherInvestmentData = filteredProjects.map(p =>
+ data[p.id].otherInvestmentTotal || 0
+ );
+ //涓ぎ
+ const centralInvestmentTotalData = filteredProjects.map(p =>
+ data[p.id].centralInvestmentTotal || 0
+ );
+ //浼佷笟鑷
+ const enterpriseSelfRaisedTotalData = filteredProjects.map(p =>
+ data[p.id].enterpriseSelfRaisedTotal || 0
+ );
+ //澶栧晢鎶曡祫
+ const foreignInvestmentTotalData = filteredProjects.map(p =>
+ data[p.id].foreignInvestmentTotal || 0
+ );
+ const bankLoanData = filteredProjects.map(p =>
+ data[p.id].bankLoan || 0
+ );
+ const domesticLoanTotalData = filteredProjects.map(p =>
+ data[p.id].domesticLoanTotal || 0
+ );
- const categories = filteredProjects.map(p => p.name);
- const allocatedData = filteredProjects.map(p => this.fundData[p.id].allocated);
- const remainingData = filteredProjects.map(p => this.fundData[p.id].remaining);
- // 璧勯噾鏉ユ簮鏁版嵁
- const projectCapitalData = filteredProjects.map(p =>
- this.fundData[p.id].sources.projectCapital || 0
- );
- const countyInvestmentData = filteredProjects.map(p =>
- this.fundData[p.id].sources.countyInvestment || 0
- );
- const otherInvestmentData = filteredProjects.map(p =>
- this.fundData[p.id].sources.otherInvestment || 0
- );
- const governmentInvestmentData = filteredProjects.map(p =>
- this.fundData[p.id].sources.governmentInvestment || 0
- );
+ this.fundChart.setOption({
+ tooltip: {
+ trigger: 'axis',
+ confine: true,
+ axisPointer: {
+ type: 'shadow'
+ },
+ zIndex: 9999,
- this.fundChart.setOption({
- tooltip: {
- trigger: 'axis',
- axisPointer: {
- type: 'shadow'
- },
- formatter: function(params) {
- let result = params[0].name + '<br/>';
- // 璧勯噾鎷ㄤ粯鍜屽墿浣�
- result += `璧勯噾鎷ㄤ粯: ${params[0].value}涓囧厓<br/>`;
- result += `鍓╀綑閲戦: ${params[1].value}涓囧厓<br/>`;
- result += `鎬婚噾棰�: ${params[0].value + params[1].value}涓囧厓<br/>`;
- result += `瀹屾垚鎶曡祫: ${params[0].axisValueLabel}涓囧厓<br/><br/>`;
-
- // 璧勯噾鏉ユ簮
- result += '<strong>璧勯噾鏉ユ簮鏋勬垚:</strong><br/>';
- result += `椤圭洰鏈噾: ${params[2].value}涓囧厓<br/>`;
- result += `鍘�(甯傘�佸尯)鎶曡祫: ${params[3].value}涓囧厓<br/>`;
- result += `鍏朵粬鎶曡祫: ${params[4].value}涓囧厓<br/>`;
- result += `鏀垮簻鎶曡祫: ${params[5].value}涓囧厓<br/>`;
-
- return result;
- }
- },
- legend: {
- data: ['鍓╀綑閲戦', '璧勯噾鎷ㄤ粯', '椤圭洰鏈噾', '鍘�(甯傘�佸尯)鎶曡祫', '鏀垮簻鎶曡祫', '鍏朵粬鎶曡祫']
- },
- grid: {
- top: '30%',
- left: '3%',
- right: '4%',
- bottom: '5%',
- containLabel: true
- },
- xAxis: {
- type: 'category',
- data: categories,
- axisLabel: {
- interval: 0,
- rotate: 30
- }
- },
- yAxis: {
- type: 'value',
- name: '閲戦(涓囧厓)'
- },
- series: [
- {
- name: '璧勯噾鎷ㄤ粯',
- type: 'bar',
- stack: 'total',
- emphasis: {
- focus: 'series'
+ formatter: function(params) {
+ let result = params[0].name + '<br/>';
+ // 璧勯噾鎷ㄤ粯鍜屽墿浣�
+ // result += `璧勯噾鎷ㄤ粯: ${params[0].value}涓囧厓<br/>`;
+ // result += `鍓╀綑閲戦: ${params[1].value}涓囧厓<br/>`;
+ const value1 = Number(params[0].value) || 0;
+ const value2 = Number(params[1].value) || 0;
+ result += `鎬婚噾棰�: ${value1 + value2}涓囧厓<br/>`;
+ // result += `瀹屾垚鎶曡祫: ${params[0].axisValueLabel}涓囧厓<br/><br/>`;
+ //
+ // // 璧勯噾鏉ユ簮
+ result += '<strong>璧勯噾鏉ユ簮鏋勬垚:</strong><br/>';
+ result += `椤圭洰鏈噾: ${params[0].value}涓囧厓<br/>`;
+ result += `鍘�(甯傘�佸尯)鎶曡祫: ${params[2].value}涓囧厓<br/>`;
+ result += `甯傦紙宸烇級鎶曡祫: ${params[3].value}涓囧厓<br/>`;
+ result += `鐪佺骇鎶曡祫: ${params[4].value}涓囧厓<br/>`;
+ result += `涓ぎ鎶曡祫: ${params[5].value}涓囧厓<br/>`;
+ result += `鏀垮簻鎶曡祫: ${params[6].value}涓囧厓<br/>`;
+ result += `鍏朵粬鎶曡祫: ${params[7].value}涓囧厓<br/>`;
+ result += `浼佷笟鑷: ${params[8].value}涓囧厓<br/>`;
+ result += `澶栧晢鎶曡祫: ${params[9].value}涓囧厓<br/>`;
+ result += `閾惰璐锋: ${params[10].value}涓囧厓<br/>`;
+ result += `鍥藉唴璐锋: ${params[11].value}涓囧厓<br/>`;
+ return result;
+ }
},
- data: allocatedData,
- itemStyle: {
- color: '#409EFF'
+ legend: {
+ data: [
+ // '鍓╀綑閲戦', '璧勯噾鎷ㄤ粯',
+ '椤圭洰鏈噾','椤圭洰鎬绘姇璧�', '鍘�(甯傘�佸尯)鎶曡祫','甯傦紙宸烇級鎶曡祫','鐪佺骇鎶曡祫','涓ぎ鎶曡祫', '鏀垮簻鎶曡祫', '鍏朵粬鎶曡祫',
+ '浼佷笟鑷', '澶栧晢鎶曡祫', '閾惰璐锋', '鍥藉唴璐锋',]
},
- label: {
- show: true,
- position: 'inside',
- formatter: '{c}'
- }
- },
- {
- name: '鍓╀綑閲戦',
- type: 'bar',
- stack: 'total',
- emphasis: {
- focus: 'series'
+ grid: {
+ top: '30%',
+ left: '3%',
+ right: '4%',
+ bottom: '5%',
+ containLabel: true
},
- data: remainingData,
- itemStyle: {
- color: '#E6A23C'
+ xAxis: {
+ type: 'category',
+ data: categories,
+ axisLabel: {
+ interval: 0,
+ rotate: 30
+ }
},
- label: {
- show: true,
- position: 'inside',
- formatter: '{c}'
- }
- },
- {
- name: '椤圭洰鏈噾',
- type: 'bar',
- stack: 'sources',
- emphasis: {
- focus: 'series'
+ yAxis: {
+ type: 'value',
+ name: '閲戦(涓囧厓)'
},
- data: projectCapitalData,
- itemStyle: {
- color: '#67C23A'
- }
- },
- {
- name: '鍘�(甯傘�佸尯)鎶曡祫',
- type: 'bar',
- stack: 'sources',
- emphasis: {
- focus: 'series'
- },
- data: countyInvestmentData,
- itemStyle: {
- color: '#F56C6C'
- }
- },
- {
- name: '鍏朵粬鎶曡祫',
- type: 'bar',
- stack: 'sources',
- emphasis: {
- focus: 'series'
- },
- data: otherInvestmentData,
- itemStyle: {
- color: '#909399'
- }
- },
- {
- name: '鏀垮簻鎶曡祫',
- type: 'bar',
- stack: 'sources',
- emphasis: {
- focus: 'series'
- },
- data: governmentInvestmentData,
- itemStyle: {
- color: '#8E44AD'
- }
- }
- ]
+ series: [
+ {
+ name: '椤圭洰鏈噾',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: projectCapitalData,
+ itemStyle: {
+ color: '#42B983' // 涓荤豢鑹诧細椤圭洰鏍稿績鑷湁璧勯噾
+ }
+ },
+ {
+ name: '椤圭洰鎬绘姇璧�',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: totalInvestmentData,
+ itemStyle: {
+ color: '#36CFC9' // 闈掔豢鑹诧細鎬绘姇璧勬眹鎬绘暟鎹�
+ }
+ },
+ {
+ name: '鍘�(甯傘�佸尯)鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: countyInvestmentData,
+ itemStyle: {
+ color: '#A0D911' // 娴呴粍缁胯壊锛氬幙绾ф姇璧�
+ }
+ },
+ {
+ name: '甯傦紙宸烇級鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: cityInvestmentTotalData,
+ itemStyle: {
+ color: '#7CB305' // 浜豢鑹诧細甯傚窞绾ф姇璧�
+ }
+ },
+ {
+ name: '鐪佺骇鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: provincialInvestmentTotalData,
+ itemStyle: {
+ color: '#40A9FF' // 涓摑鑹诧細鐪佺骇鎶曡祫
+ }
+ },
+ {
+ name: '涓ぎ鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: centralInvestmentTotalData,
+ itemStyle: {
+ color: '#1890FF' // 娣辫摑鑹诧細涓ぎ鎶曡祫锛堝眰绾ф渶楂橈級
+ }
+ },
+ {
+ name: '鏀垮簻鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: governmentInvestmentData,
+ itemStyle: {
+ color: '#8E44AD' // 绱壊锛氭斂搴滄姇璧勬�婚锛堟眹鎬婚」锛�
+ }
+ },{
+ name: '鍏朵粬鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: otherInvestmentData,
+ itemStyle: {
+ color: '#909399' // 娣辩伆鑹诧細鍏朵粬鎶曡祫
+ }
+ },
+ {
+ name: '浼佷笟鑷',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: enterpriseSelfRaisedTotalData,
+ itemStyle: {
+ color: '#e6cb6d' // 娣辩伆鑹诧細鍏朵粬鎶曡祫
+ }
+ },
+ {
+ name: '澶栧晢鎶曡祫',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: foreignInvestmentTotalData,
+ itemStyle: {
+ color: '#f443b9' // 娣辩伆鑹诧細鍏朵粬鎶曡祫
+ }
+ },{
+ name: '閾惰璐锋',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: bankLoanData,
+ itemStyle: {
+ color: '#bd5fd8' // 娣辩伆鑹诧細鍏朵粬鎶曡祫
+ }
+ },{
+ name: '鍥藉唴璐锋',
+ type: 'bar',
+ stack: 'sources',
+ emphasis: {
+ focus: 'series'
+ },
+ data: domesticLoanTotalData,
+ itemStyle: {
+ color: '#4373d3' // 娣辩伆鑹诧細鍏朵粬鎶曡祫
+ }
+ }
+ ]
+ });
+ this.fundChart.on('click', (params) => { // 杩欓噷鏀逛负绠ご鍑芥暟
+ const clickedProject = filteredProjects[params.dataIndex];
+ const projectId = clickedProject ? clickedProject.id : '鏃�';
+ const audit = 1;
+ // 姝ゆ椂 this 鎸囧悜 Vue 缁勪欢锛屽彲姝ｅ父璁块棶 $router
+ this.$router.push({
+ path: '/projectEngineering/project/ProjectDetails',
+ query: { projectId: projectId, disabled: 'true', audit: audit }
+ });
+ });
+ }
});
- },
+
+ },
+ removeStore() {
+ localStorage.removeItem("projectForm")
+ localStorage.removeItem("investmentForm")
+ localStorage.removeItem("investmentFundsForm")
+ localStorage.removeItem("legalPersonForm")
+ localStorage.removeItem("policyInfoForm")
+ localStorage.removeItem("documentsInfoForm")
+ },
// 鏇存柊鎵�鏈夊浘琛�
updateCharts() {
this.updateProgressChart();
@@ -736,7 +876,28 @@
return map[status] || '';
},
handleTaskDetail(task) {
- this.$message.info(`鏌ョ湅浠诲姟璇︽儏: ${task.taskName}`);
+ console.log(task)
+ const queryParams= {
+ taskName: '',
+ taskType: 'todo',
+ pageSize: 5,
+ currentPage: 1,
+ projectId: null,
+ processDefId: null,
+ processInsId: null,
+ deployId: null,
+ processName: '' // 娴佺▼鍚嶇О
+ }
+ this.$router.push({ path: '/flowable/task/myProcess/detail/index',
+ query: {
+ projectName: task.checkPointInfo.projectName,
+ flowName: task.checkPointInfo.processName,
+ procInsId: task.checkPointInfo.processInstanceId,
+ deployId: task.checkPointInfo.deployId,
+ taskId: task.id,
+ projectId: task.checkPointInfo.id,
+ goBackParams: queryParams
+ }})
},
showDetail() {
this.$message.info(`鏌ョ湅${this.selectedMonth}鏈堜唤鐨勯」鐩繘搴﹁鎯卄);
--
Gitblit v1.8.0