From 1674d97e51850e10845a65c2bb1c8d35345640e5 Mon Sep 17 00:00:00 2001
From: cjp <3096114695@qq.com>
Date: Wed, 13 Sep 2023 11:08:38 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20AI=E9=A2=84=E8=AD=A6=EF=BC=8C=E5=9C=B0?=
 =?UTF-8?q?=E7=A3=85=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=E8=B0=83=E6=95=B4?=
 =?UTF-8?q?=EF=BC=8C=E6=B8=A9=E5=BA=A6=E8=AE=A1=E4=BC=98=E5=8C=96=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../aIEarlyWarning/bottomLeft.vue             |  4 +-
 .../aIEarlyWarning/bottomRight.vue            | 10 ++--
 .../aIEarlyWarning/index.vue                  |  2 +-
 .../aIEarlyWarning/topLeft.vue                |  9 ---
 .../loadometerManage/topLeft.vue              |  4 +-
 .../standardCureRoom/bottomLeft.vue           | 20 +++----
 .../standardCureRoom/bottomRight.vue          | 38 +++++++++---
 .../standardCureRoom/index.vue                |  7 +--
 .../standardCureRoom/topLeft.vue              | 44 ++++++++------
 .../standardCureRoom/topRight.vue             | 58 +++++++++++--------
 10 files changed, 114 insertions(+), 82 deletions(-)

diff --git a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomLeft.vue b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomLeft.vue
index b2c5953..23b8e06 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomLeft.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomLeft.vue
@@ -268,8 +268,8 @@ onBeforeUnmount(async () => {
 	}
 	.history-content {
 		height: 100%;
-		background: url("@/assets/images/cardImg.png") no-repeat;
-		background-size: 100% 100%;
+		// background: url("@/assets/images/cardImg.png") no-repeat;
+		// background-size: 100% 100%;
 		position: relative;
 		.rightHeader {
 			width: 20%;
diff --git a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomRight.vue b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomRight.vue
index ec3900e..53678b1 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomRight.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/bottomRight.vue
@@ -1,7 +1,7 @@
 <template>
 	<Card title="今日告警">
 		<div class="bottomBox">
-			<div class="content">
+			<div class="list-content">
 				<div class="tabList">
 					<div>序号</div>
 					<div>抓拍照片</div>
@@ -282,12 +282,12 @@ onMounted(async () => {});
 			font-family: OPPOSansH;
 		}
 	}
-	.content {
+	.list-content {
 		height: 95%;
 		width: 100%;
 		margin-top: 10px;
-		background: url("@/assets/images/cardImg.png") no-repeat;
-		background-size: 100% 100%;
+		// background: url("@/assets/images/cardImg.png") no-repeat;
+		// background-size: 100% 100%;
 		.tabList {
 			display: flex;
 			width: 100%;
@@ -307,7 +307,7 @@ onMounted(async () => {});
 			}
 		}
 		.listBox {
-			height: 90%;
+			height: 95%;
 			overflow: scroll;
 			.listStyle {
 				display: flex;
diff --git a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/index.vue b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/index.vue
index 872796c..cfe9433 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/index.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/index.vue
@@ -54,7 +54,7 @@ export default {
 		}
 	}
 	.bottom {
-		height: 50%;
+		height: 45%;
 		display: flex;
 		.bottomLeft {
 			width: 50%;
diff --git a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/topLeft.vue b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/topLeft.vue
index 991d141..44b9974 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/topLeft.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/aIEarlyWarning/topLeft.vue
@@ -278,13 +278,4 @@ onBeforeUnmount(async () => {
 		}
 	}
 }
-::v-deep .el-input__wrapper {
-	background: #112d59;
-}
-::v-deep .el-input__inner {
-	color: #fff;
-}
-::v-deep .el-select .el-input .el-select__caret {
-	color: #fff;
-}
 </style>
diff --git a/src/views/sevenLargeScreen/digitalConstruction/loadometerManage/topLeft.vue b/src/views/sevenLargeScreen/digitalConstruction/loadometerManage/topLeft.vue
index 49353c1..a1d9a7c 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/loadometerManage/topLeft.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/loadometerManage/topLeft.vue
@@ -53,7 +53,7 @@ const option = reactive({
 		left: "0%",
 		right: "0%",
 		bottom: "0%",
-		top: "5%",
+		top: "2%",
 		containLabel: true
 	},
 	// backgroundColor: '#101129',
@@ -287,6 +287,8 @@ onMounted(async () => {
 .box {
 	width: 100%;
 	height: 100%;
+	padding-left: 3%;
+	padding-top: 3%;
 	position: relative;
 }
 .rightHeader {
diff --git a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomLeft.vue b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomLeft.vue
index 05c9f5f..30ee396 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomLeft.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomLeft.vue
@@ -1,21 +1,20 @@
 <template>
 	<Card title="今日告警">
-		<div class="bottomBox">
-			<div class="content">
+		<div class="bottom-left">
+			<div class="left-content">
 				<div class="tabList">
 					<div>序号</div>
 					<div>报警设备</div>
 					<div>报警时间</div>
 					<div>报警类型</div>
 				</div>
-
 				<div class="listBox">
 					<div v-for="(item, index) in list" class="listStyle" :key="item.id">
 						<div>{{ index + 1 }}</div>
 						<!-- <div>{{ item.dev }}</div> -->
 						<div>{{ item.devName }}</div>
 						<div>{{ item.warnTime }}</div>
-						<div style="padding-left: 1%">{{ item.warnType }}</div>
+						<div>{{ item.warnType }}</div>
 					</div>
 					<div class="notoDta" v-if="list.length == 0">
 						<img src="@/assets/images/noData.png" alt="" />
@@ -204,7 +203,7 @@ onMounted(async () => {});
 		}
 	}
 }
-.bottomBox {
+.bottom-left {
 	width: 100%;
 	height: 100%;
 	.title {
@@ -220,12 +219,11 @@ onMounted(async () => {});
 			font-family: OPPOSansH;
 		}
 	}
-	.content {
-		height: 95%;
+	.left-content {
+		height: 100%;
 		width: 100%;
-		margin-top: 10px;
-		background: url("@/assets/images/cardImg.png") no-repeat;
-		background-size: 100% 100%;
+		// background: url("@/assets/images/cardImg.png") no-repeat;
+		// background-size: 100% 100%;
 		.tabList {
 			display: flex;
 			align-items: center;
@@ -251,7 +249,7 @@ onMounted(async () => {});
 				display: flex;
 				align-items: center;
 				color: #fff;
-				height: 10%;
+				height: 14%;
 				font-size: calc(100vw * 12 / 1920);
 				.list-img {
 					width: 10%;
diff --git a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomRight.vue b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomRight.vue
index f881aad..c005b9b 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomRight.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/bottomRight.vue
@@ -17,6 +17,8 @@
 <script lang="ts" setup>
 import Card from "@/components/card.vue";
 import symbolIcon from "@/assets/images/lineSymbol.png";
+import symbolIcon2 from "@/assets/images/lineSymbol2.png";
+
 import { onMounted, reactive, ref, onBeforeUnmount } from "vue";
 import * as echarts from "echarts";
 // import { getSelectDataListApi } from "@/api/modules/distribution";
@@ -32,21 +34,19 @@ let unit = ref("单位:V" as any);
 let yData = ref([10, 5, 20, 25, 15, 25, 12, 13, 14, 20] as any);
 // 图表数据项
 let option = ref(null as any);
-
 // 选中
 let checked = ref(1);
+// 当前对应的种类
+let nowType = ref("温度");
 function getNowData(type: any) {
 	checked.value = type;
+	nowType.value = "温度";
 	// 初始化option
 	// initOption();
 }
 function getWeekData(type: any) {
 	checked.value = type;
-	// 初始化option
-	// initOption();
-}
-function getMonthData(type: any) {
-	checked.value = type;
+	nowType.value = "湿度";
 	// 初始化option
 	// initOption();
 }
@@ -66,6 +66,11 @@ function initOption() {
 		},
 		tooltip: {
 			trigger: "axis",
+			backgroundColor: "#010306",
+			borderColor: "#010306",
+			textStyle: {
+				color: "#FFFFFF"
+			},
 			axisPointer: {
 				lineStyle: {
 					color: {
@@ -91,13 +96,16 @@ function initOption() {
 						global: false
 					}
 				}
+			},
+			formatter: function (params) {
+				return params[0].name + "<br/>" + params[0].marker + nowType.value + ":" + params[0].value + "℃";
 			}
 		},
 		grid: {
 			top: "20%",
 			left: "6%",
 			right: "4%",
-			bottom: "30%"
+			bottom: "12%"
 			// containLabel: true
 		},
 		xAxis: [
@@ -164,6 +172,22 @@ function initOption() {
 		],
 		series: [
 			{
+				// markPoint: {
+				// 	// 标记的数据，可以是最大值最小值也可以是自定义的坐标
+				// 	data: [
+				// 		{
+				// 			name: "今日上报",
+				// 			yAxis: yData.value[2],
+				// 			xAxis: twenty_four_time.value[2] // 标记数据的x轴的位置，由于是最后一个点，所以这个位置是固定的，用百分比表示该图标内最后一个点的位置即可
+				// 		}
+				// 	],
+				// 	symbol: `image://${symbolIcon2}`,
+				// 	symbolSize: 30 // 标记图形的大小
+				// 	// 标注点的样式
+				// 	// itemStyle: {
+				// 	// 	color: "#FF4747" // 标注点颜色
+				// 	// }
+				// },
 				type: "line",
 				// smooth: true, //是否平滑
 				showAllSymbol: true,
diff --git a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/index.vue b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/index.vue
index 415a179..cc9dfeb 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/index.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/index.vue
@@ -40,9 +40,8 @@ export default {
 	.top {
 		height: 67%;
 		display: flex;
-		margin-bottom: 1%;
 		.topLeft {
-			width: 23%;
+			width: 25%;
 			// background-color: orchid;
 		}
 		.topCenter {
@@ -55,11 +54,11 @@ export default {
 			}
 		}
 		.topRight {
-			width: 23%;
+			width: 25%;
 		}
 	}
 	.bottom {
-		height: 35%;
+		height: 30%;
 		display: flex;
 		.bottomLeft {
 			width: 50%;
diff --git a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topLeft.vue b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topLeft.vue
index bd3f9ef..d95b8a5 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topLeft.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topLeft.vue
@@ -25,9 +25,8 @@ import { onMounted, reactive, ref } from "vue";
 import Card from "@/components/card.vue";
 const store = GlobalStore();
 let option = ref();
-let realValue = ref(0);
+let realValue = ref(-12);
 function initOption() {
-	realValue.value = -8; //真实温度
 	let TP_value = 0; // 展示温度
 	TP_value = realValue.value;
 	let kd = []; // 刻度
@@ -38,6 +37,16 @@ function initOption() {
 	let boxPosition = [65, 0]; // 显示内容的定位
 	let TP_txt = ""; // 显示内容 文本
 
+	// 刻度最大值
+	let maxValue = 80;
+	if (TP_value > maxValue) {
+		maxValue = TP_value;
+	}
+
+	// 刻度差值
+	let diffValue = 0;
+	diffValue = 130 - maxValue;
+
 	// 刻度使用柱状图模拟，短设置1，长的设置3；构造一个数据
 	for (let i = 0, len = 145; i <= len; i++) {
 		if (i < 10 || i > 130) {
@@ -68,7 +77,7 @@ function initOption() {
 	}
 
 	//中间线的渐变色和文本内容
-	if (realValue.value > 70) {
+	if (TP_value > 70) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -91,7 +100,7 @@ function initOption() {
 				color: "#E01F28"
 			}
 		);
-	} else if (realValue.value > 20) {
+	} else if (TP_value > 20) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -110,7 +119,7 @@ function initOption() {
 				color: "#E4D225"
 			}
 		);
-	} else if (realValue.value > 2) {
+	} else if (TP_value > 2) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -137,15 +146,16 @@ function initOption() {
 			}
 		);
 	}
-	if (realValue.value > 82) {
-		showValue = 80;
-	} else {
-		if (realValue.value < -40) {
-			showValue = -40;
-		} else {
-			showValue = TP_value;
-		}
-	}
+	// if (TP_value > 82) {
+	// 	showValue = 80;
+	// } else {
+	// 	if (TP_value < -40) {
+	// 		showValue = -40;
+	// 	} else {
+	// 		showValue = TP_value;
+	// 	}
+	// }
+	showValue = TP_value;
 	// 避免温度过低 右侧指示内容出界
 	if (TP_value < -10) {
 		boxPosition = [65, -120];
@@ -226,7 +236,7 @@ function initOption() {
 				xAxisIndex: 0,
 				data: [
 					{
-						value: showValue + 50
+						value: showValue + diffValue
 					}
 				],
 				barWidth: 13,
@@ -353,7 +363,7 @@ function initOption() {
 								return "";
 							} else {
 								if ((params.dataIndex - 10) % 20 === 0) {
-									return params.dataIndex - 50;
+									return params.dataIndex - diffValue;
 								} else {
 									return "";
 								}
@@ -392,7 +402,7 @@ function initOption() {
 								return "";
 							} else {
 								if ((params.dataIndex - 10) % 20 === 0) {
-									return params.dataIndex - 50;
+									return params.dataIndex - diffValue;
 								} else {
 									return "";
 								}
diff --git a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topRight.vue b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topRight.vue
index 76f43c9..9f5d134 100644
--- a/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topRight.vue
+++ b/src/views/sevenLargeScreen/digitalConstruction/standardCureRoom/topRight.vue
@@ -5,7 +5,9 @@
 				<img src="@/assets/images/standardCureRoom/yuanZhu.png" alt="" />
 			</div>
 			<div class="humidity-detail">
-				<div class="text-detail"><i>湿度: {{ realValue }}%RH</i></div>
+				<div class="text-detail">
+					<i>湿度: {{ realValue }}%RH</i>
+				</div>
 				<div class="icon-detail">
 					<img src="@/assets/images/standardCureRoom/thermometer.png" alt="" />
 				</div>
@@ -27,21 +29,26 @@ import { onMounted, reactive, ref } from "vue";
 import Card from "@/components/card.vue";
 const store = GlobalStore();
 let option = ref();
-let realValue = ref(0 as any);
+let realValue = ref(120 as any);
 function initOption() {
-	realValue.value = 120; //真实温度
-	let TP_value = 0; // 展示温度
-	TP_value = realValue.value - 60;
+	let TP_value = realValue.value; // 展示温度
 	let kd = []; // 刻度
 	let kd2 = [];
 	let Gradient = []; // 存放颜色的数组
-	let leftColor = ""; // 显示文本的颜色
 	let showValue = ""; // 显示内容 温度数字
-	let boxPosition = [65, 0]; // 显示内容的定位
-	let TP_txt = ""; // 显示内容 文本
+
+	// 刻度最大值
+	let maxValue = 120;
+	if (TP_value > 120) {
+		maxValue = TP_value;
+	}
+
+	// 刻度差值
+	let diffValue = 0;
+	diffValue = 130 - maxValue;
 
 	// 刻度使用柱状图模拟，短设置1，长的设置3；构造一个数据
-	for (let i = 0, len = 145; i <= len; i++) {
+	for (let i = 0, len = 155; i <= len; i++) {
 		if (i < 10 || i > 130) {
 			kd.push("");
 		} else {
@@ -54,7 +61,7 @@ function initOption() {
 			}
 		}
 	}
-
+	console.log("刻度", kd);
 	for (let i = 0, len = 145; i <= len; i++) {
 		if (i < 10 || i > 130) {
 			kd2.push("");
@@ -70,7 +77,7 @@ function initOption() {
 	}
 
 	//中间线的渐变色和文本内容
-	if (realValue.value > 110) {
+	if (TP_value > 110) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -93,7 +100,7 @@ function initOption() {
 				color: "#E01F28"
 			}
 		);
-	} else if (realValue.value > 60) {
+	} else if (TP_value > 60) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -112,7 +119,7 @@ function initOption() {
 				color: "#E4D225"
 			}
 		);
-	} else if (realValue.value > 42) {
+	} else if (TP_value > 42) {
 		Gradient.push(
 			{
 				offset: 0,
@@ -139,15 +146,16 @@ function initOption() {
 			}
 		);
 	}
-	if (realValue.value > 122) {
-		showValue = 120;
-	} else {
-		if (realValue.value < 0) {
-			showValue = 0;
-		} else {
-			showValue = TP_value;
-		}
-	}
+	// if (TP_value > 120) {
+	// 	showValue = 120;
+	// } else {
+	// 	if (TP_value < 0) {
+	// 		showValue = 0;
+	// 	} else {
+	// 		showValue = TP_value;
+	// 	}
+	// }
+	showValue = TP_value;
 	// 避免温度过低 右侧指示内容出界
 	if (TP_value < -10) {
 		boxPosition = [65, -120];
@@ -228,7 +236,7 @@ function initOption() {
 				xAxisIndex: 0,
 				data: [
 					{
-						value: showValue + 70
+						value: showValue + diffValue
 					}
 				],
 				barWidth: 13,
@@ -355,7 +363,7 @@ function initOption() {
 								return "";
 							} else {
 								if ((params.dataIndex - 10) % 20 === 0) {
-									return params.dataIndex - 10;
+									return params.dataIndex - diffValue;
 								} else {
 									return "";
 								}
@@ -394,7 +402,7 @@ function initOption() {
 								return "";
 							} else {
 								if ((params.dataIndex - 10) % 20 === 0) {
-									return params.dataIndex - 10;
+									return params.dataIndex - diffValue;
 								} else {
 									return "";
 								}