From 335b6642a23ddfbfc9e0108289c8ee04cb50f56a Mon Sep 17 00:00:00 2001
From: Vce <daisy_vce@yeah.net>
Date: Mon, 3 Jun 2024 16:46:14 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AF=B9=E6=8E=A5=E5=B7=A6=E8=BE=B9=E6=8E=A5?=
 =?UTF-8?q?=E5=8F=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                              |   4 +-
 src/api/modules/agjtCommandApi.ts             |  14 ++
 .../commandCenter/leftBottom.vue              | 184 ++++++++++++++----
 3 files changed, 160 insertions(+), 42 deletions(-)

diff --git a/.env.development b/.env.development
index c77c6ea..a2acb68 100644
--- a/.env.development
+++ b/.env.development
@@ -5,7 +5,7 @@ NODE_ENV = 'development'
 # 后端本地
 # VITE_API_URL = 'http://192.168.34.221:19111'
 # VITE_API_URL = 'http://192.168.34.221:9111' #雄哥本地
-# VITE_API_URL = 'http://182.90.224.237:51234'  #雄哥远程
+VITE_API_URL = 'http://182.90.224.237:51234'  #雄哥远程
 # VITE_API_URL = 'http://192.168.34.221:28889'
 # VITE_API_URL = 'http://121.196.214.246/api'
 # VITE_API_URL = 'http://jxj.zhgdyun.com:100'
@@ -24,7 +24,7 @@ NODE_ENV = 'development'
 # VITE_API_URL = 'http://182.90.224.237:15551'
 # agjt
 # VITE_API_URL = 'http://42.180.188.17:9809' #生产环境
-VITE_API_URL = 'http://42.180.188.17:11211' #测试环境
+# VITE_API_URL = 'http://42.180.188.17:11211' #测试环境
 # VITE_API_URL = 'http://jxj.zhgdyun.com:19812'
 # 苏立信
 # VITE_API_URL = 'http://101.43.164.214:11111'
diff --git a/src/api/modules/agjtCommandApi.ts b/src/api/modules/agjtCommandApi.ts
index a71b007..ff8f6e9 100644
--- a/src/api/modules/agjtCommandApi.ts
+++ b/src/api/modules/agjtCommandApi.ts
@@ -103,4 +103,18 @@ export const getStatScoreApi = (params: {}) => {
 export const getPersonTypeAndEduStatisticsApi = (params: {}) => {
 	return http.post(BASEURL + `/xmgl/workerInfo/selectPersonTypeAndEduStatistics`, params, { headers: { noLoading: true } });
 };
+// 总包出勤情况分析
+export const queryAttendanceOfEachCompanyApi = (params: {}) => {
+	return http.get(BASEURL + `/xmgl/workerAttendance/queryAttendanceOfEachCompany`, params, { headers: { noLoading: true } });
+};
+// 进度情况分析
+// 项目总进度/项目剩余天数
+export const getCountTaskProgressApi = (params: {}) => {
+	return http.post(BASEURL + `/xmgl/xzTaskProgress/countTaskProgress`, params, { headers: { noLoading: true } });
+};
+// 总包进度列表
+export const queryCountEnterpriseApi = (params: {}) => {
+	return http.post(BASEURL + `/xmgl/xzTaskProgressTotal/countEnterprise`, params, { headers: { noLoading: true } });
+};
+
 
diff --git a/src/views/commandScreen/commandCenter/leftBottom.vue b/src/views/commandScreen/commandCenter/leftBottom.vue
index 6b6fa42..367282b 100644
--- a/src/views/commandScreen/commandCenter/leftBottom.vue
+++ b/src/views/commandScreen/commandCenter/leftBottom.vue
@@ -10,11 +10,14 @@
 					<!-- <div class="numberCard" v-for="(item,i) in '0234'" :key="i">{{item}}</div> -->
 					<div class="numberCard" v-for="(item,i) in totalPerson" :key="i">{{item}}</div>
 					<span style="margin-left:15px">考勤日环比</span>
+					<div style="display:flex" v-if="typeof totalPersonRhbRatio == 'undefined'">
+						<div class="dayRadio">0%</div>
+					</div>
 					<div style="display:flex" v-if="totalPersonRhbRatio > 0">
 						<div class="dayRadio">{{totalPersonRhbRatio}}%</div>
 						<div class="iconCenter"><el-icon size="20" color="#1E90FF"><Top/></el-icon></div>
 					</div>
-					<div style="display:flex" v-if="totalPersonRhbRatio === 0">
+					<div style="display:flex" v-if="totalPersonRhbRatio == 0">
 						<div class="dayRadio">{{totalPersonRhbRatio}}%</div>
 					</div>
 					<div style="display:flex" v-if="totalPersonRhbRatio < 0">
@@ -37,20 +40,21 @@
 						<div class="cbLine1">
 							<div style="display:flex">
 								<span>项目总进度:</span>
-								<div class="numberCard" v-for="(item,i) in '023'" :key="i">{{item}}</div>
+								<div class="numberCard" v-for="(item,i) in projectTotalProgress" :key="i">{{item}}</div>
 								<span style="margin-left:5px">%</span>
 							</div>
 							<div style="display:flex">
 								<span style="margin-left:15px">项目剩余天数</span>
-								<div class="numberCard" v-for="(item,i) in '0234'" :key="i">{{item}}</div>
+								<div class="numberCard" v-for="(item,i) in projectSurplusDayNum" :key="i">{{item}}</div>
 								<span style="margin-left:5px">天</span>
 							</div>
 						</div>
-						<div class="cbProcess">
+						<div class="cbProcess" v-if="processList.length >= 5">
+							<!-- v-if="listData.length>0" :list="listData"  -->
 							<vue3-seamless-scroll 
-							v-if="listData.length>0" :list="listData" 
+							v-if="processList.length>0" :list="processList" 
 							:speed="1" :limitScrollNum="5" :step="0.3" :hover="true" class="scroll">
-								<div class="pItem" v-for="(item,i) in listData" :key="i">
+								<div class="pItem" v-for="(item,i) in processList" :key="i">
 									<div class="pLeft">
 										<span :class="['plInner','plBgc'+(i+1)%12]">
 											<span style="margin-left:10px">Top{{i+1}}</span>
@@ -58,12 +62,12 @@
 									</div>
 									<div class="pRight">
 										<div class="prTop">
-											<div class="prtLeft">{{item.a}}</div>
-											<div class="prtRight">{{item.b}}%</div>
+											<div class="prtLeft">{{item.enterpriseName}}</div>
+											<div class="prtRight">{{item.changeAfter}}%</div>
 										</div>
 										<div class="prBottom">
 											<div class="processLineBg">
-												<div :class="['processLine','plBtnBgc'+(i+1)%12]" :style="{width:item.b+'%'}">
+												<div :class="['processLine','plBtnBgc'+(i+1)%12]" :style="{width:item.changeAfter+'%'}">
 													<div class="processLineBtn"></div>
 												</div>
 											</div>
@@ -72,6 +76,33 @@
 								</div>
 							</vue3-seamless-scroll>
 						</div>
+						<div class="cbProcess" v-else>
+							<!-- v-if="listData.length>0" :list="listData"  -->
+							<!-- <vue3-seamless-scroll 
+							v-if="processList.length>0" :list="processList" 
+							:speed="1" :limitScrollNum="5" :step="0.3" :hover="true" class="scroll"> -->
+								<div class="pItem" v-for="(item,i) in processList" :key="i">
+									<div class="pLeft">
+										<span :class="['plInner','plBgc'+(i+1)%12]">
+											<span style="margin-left:10px">Top{{i+1}}</span>
+										</span>
+									</div>
+									<div class="pRight">
+										<div class="prTop">
+											<div class="prtLeft">{{item.enterpriseName}}</div>
+											<div class="prtRight">{{item.changeAfter}}%</div>
+										</div>
+										<div class="prBottom">
+											<div class="processLineBg">
+												<div :class="['processLine','plBtnBgc'+(i+1)%12]" :style="{width:item.changeAfter+'%'}">
+													<div class="processLineBtn"></div>
+												</div>
+											</div>
+										</div>
+									</div>
+								</div>
+							<!-- </vue3-seamless-scroll> -->
+						</div>
 					</div>
 				</div>
 			</div>
@@ -82,9 +113,13 @@
 <script setup lang="ts">
 import { onMounted, ref } from "vue";
 import * as echarts from "echarts";
+import ECharts from 'vue-echarts';
 import { selectQualityStatisticsApi } from "@/api/modules/projectOverview";
-import { getMemberJobStatusApi, getInspectManStatusApi, getEnterpriseStatusApi,
-	getPersonTypeAndEduStatisticsApi
+import { 
+	getPersonTypeAndEduStatisticsApi,
+	queryAttendanceOfEachCompanyApi,
+	getCountTaskProgressApi,
+	queryCountEnterpriseApi,
  } from "@/api/modules/agjtCommandApi"; 
 import type { TabsPaneContext, ElMessageBox } from "element-plus";
 import * as ElementPlusIconsVue from '@element-plus/icons-vue'
@@ -105,30 +140,40 @@ const getPersonTypeAndEduStatistics = async () => {
 	if (res.result) {
 		console.log("出勤人员数据/考勤日环比", res);
 		totalPerson.value = res.result.personType.attendancePerson.totalPerson
-		if(totalPerson.value.length < 4){
-			let temp = 4-totalPerson.value.length
-			for(let i = 0;i<temp;i++){
-				totalPerson.value = "0" + totalPerson.value
-			}
-		}
+		// if(totalPerson.value.length < 4){
+		// 	let temp = 4-totalPerson.value.length
+		// 	for(let i = 0;i<temp;i++){
+		// 		totalPerson.value = "0" + totalPerson.value
+		// 	}
+		// }
 		totalPersonRhbRatio.value = res.result.personType.attendancePerson.totalPersonRhbRatio
 	}
 };
+
+//总包出勤情况分析数据列表
+let projectCompanyWorkTotalList = ref([] as any)
+let xData = ref([] as any)
+let yData = ref([] as any)
+//获取总包出勤情况分析数据
+const queryAttendanceOfEachCompany = async () => {
+	const res: any = await queryAttendanceOfEachCompanyApi({
+		projectSn: store.sn
+	});
+	if (res.result) {
+		console.log("获取总包出勤情况分析数据", res);
+		projectCompanyWorkTotalList.value = res.result.projectCompanyWorkTotalList
+		xData.value = projectCompanyWorkTotalList.value.map(item => item.enterpriseName.substring(0,4))
+		yData.value = projectCompanyWorkTotalList.value.map(item => item.attendancePersonNum)
+		drawBar()
+	}
+};
+
 //切换tab
 const handleTab = (val:string) => {
 	activeIndex.value = val
 }
+
 //绘画柱状图
-let testData = ref({
-	xData:['中铝山东','中冶沈勘','鞍山电力','鞍钢矿业','上海建工','辽宁普凡','沈阳隆基','中科过程','宏大爆破','鞍钢设计'],
-	yData:[78,56,66,33,53,11,77,51,78,90,],
-	hData:[
-		{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},
-		{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},
-		{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},{a:120,b:100,c:'12%',d:'45%'},
-		{a:120,b:100,c:'12%',d:'45%'},
-	]
-} as any)
 function drawBar() {
 	console.log("---------------------bar--------")
 	type EChartsOption = echarts.EChartsOption;
@@ -140,28 +185,51 @@ function drawBar() {
 		xAxis: {
 			type: 'category',
 			// data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
-			data: testData.value.xData,
+			data: xData.value,
 			axisLabel: {
-				fontSize: 8, // 设置字体大小为12px
+				fontSize: 12, // 设置字体大小为12px
+				// rotate: 45,
+				interval: 0, // 显示所有标签
 			},
 			axisLine: {
 				lineStyle: {
-					color: 'white' // 设置X轴刻度线的颜色为灰色
+					// color: 'white' // 设置X轴刻度线的颜色为白色
+					color: 'rgba(200,200,200,1)'
 				}
 			},
+			
 		},
 		yAxis: {
 			type: 'value',
 			axisLabel: {
-				fontSize: 8, // 设置字体大小为12px
+				fontSize: 12, // 设置字体大小为12px
 			},
 			axisLine: {
 				lineStyle: {
-					color: 'white' // 设置Y轴刻度线的颜色为灰色
+					// color: 'white' // 设置Y轴刻度线的颜色为白色
+					color: 'rgba(200,200,200,1)'
 				}
 			},
 			// show:false
+			splitLine: {
+              show: true,
+              lineStyle: {
+                // type: 'dashed', //y轴分割线类型
+                type: 'solid', //y轴实线类型
+                color: 'rgba(102,102,102,0.25)',
+                width: 2.5,
+              },
+            },
 		},
+		dataZoom: [{
+			type: 'slider',
+			start: 0,
+			end: 30,
+			width:"100%",
+			height:5,
+			left:"center",
+			bottom:3
+        }],
 		grid: {
 			top: "8%", 
 			right: "0",
@@ -171,8 +239,9 @@ function drawBar() {
 		},
 		series: [{
 			// data: [120, 200, 150, 80, 70, 110, 130],
-			data: testData.value.yData,
+			data: yData.value,
 			type: 'bar',
+			barWidth: 50,
 			itemStyle: {
 				color: '#3398DB' // 设置柱状图颜色为蓝色
 			},
@@ -187,14 +256,14 @@ function drawBar() {
 		tooltip: {
 			borderColor: 'rgba(50,50,50, 0.5)',
 			backgroundColor: 'rgba(50,50,50, 0.5)', 
-			textStyle: { color: '#fff',fontSize:'13'},
+			textStyle: { color: '#fff',fontSize:'15'},
 			formatter: function(params) {
 				console.log(params)
 				return '<div style="font-weight:bold">'+params.name+'</div>' + 
-						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:darkred">●</span>在册人员：'+params.data+'</div>' + 
-						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:yellow">●</span>出勤人员总数：'+params.data+'</div>' +
-						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:darkblue">●</span>出勤率：'+params.data+'%</div>' +
-						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:green">●</span>出勤率日环比：'+params.data+'%</div>';
+						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:#1E90FF">●</span>在册人员：'+projectCompanyWorkTotalList.value[params.dataIndex].totalPersonNum+'</div>' + 
+						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:#4682B4">●</span>出勤人员总数：'+projectCompanyWorkTotalList.value[params.dataIndex].attendancePersonNum+'</div>' +
+						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:#87CEFA">●</span>出勤率：'+projectCompanyWorkTotalList.value[params.dataIndex].attendancePersonRate+'%</div>' +
+						'<div style="line-height:23px"><span style="font-size:16px;margin-right:5px;color:#00BFFF">●</span>出勤率日环比：'+projectCompanyWorkTotalList.value[params.dataIndex].attendancePersonRhbRate+'%</div>';
 			}
 		}
 	};
@@ -213,9 +282,44 @@ let listData = ref([
 	{a:'中铝山东工程技术有限公司',b:'59'},{a:'中国华冶科工集团有限公司',b:'14'},{a:'沈阳岩土工程技术测试开发有限公司',b:'38'},{a:'永明项目管理有限公司',b:'41'},
 ] as any)
 
+// 进度情况分析
+// 项目总进度
+let projectTotalProgress = ref("" as any)
+// 项目剩余天数
+let projectSurplusDayNum = ref({} as any)
+// 获取项目总进度/项目剩余天数
+const getCountTaskProgress = async () => {
+	const res: any = await getCountTaskProgressApi({
+		projectSn: store.sn
+	});
+	if (res.result) {
+		console.log("项目总进度/项目剩余天数", res);
+		projectTotalProgress.value = res.result.projectTotalProgress + ""
+		projectSurplusDayNum.value = res.result.projectSurplusDayNum + ""
+	}
+};
+// 总包进度列表
+let processList = ref([] as any)
+// 获取总包进度列表
+const queryCountEnterprise = async () => {
+	const res: any = await queryCountEnterpriseApi({
+		projectSn: store.sn,
+		isCountMainEnterprise: "1"
+	});
+	if (res.result) {
+		console.log("总包进度列表", res);
+		processList.value = res.result
+	}
+};
+
+
+
 onMounted(async () => {
-	drawBar()
+	// drawBar()
 	getPersonTypeAndEduStatistics()
+	queryAttendanceOfEachCompany()
+	getCountTaskProgress()
+	queryCountEnterprise()
 });
 </script>
 
@@ -359,7 +463,7 @@ onMounted(async () => {
 					}
 					.cbProcess{
 						padding-top: 5px;
-						height: calc(100% - 65px);
+						height: calc(100% - 55px);
 						overflow: hidden;
 						// background-color: #fff;
 						.pItem{