From c67c9878d04b1fb339602bb0deb80847535e4268 Mon Sep 17 00:00:00 2001
From: Vce <daisy_vce@yeah.net>
Date: Sat, 27 Apr 2024 09:47:16 +0800
Subject: [PATCH] =?UTF-8?q?dev:=E6=8C=87=E6=8C=A5=E9=83=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../commandScreen/commandCenter/leftTop.vue   | 22 +++++++++-
 .../commandScreen/commandCenter/rightAll.vue  | 44 +++++++++++++------
 .../commandCenter/rightPage/rightCenter.vue   |  0
 .../commandCenter/rightPage/rightTop.vue      | 43 ++++++++++++++++++
 4 files changed, 95 insertions(+), 14 deletions(-)
 create mode 100644 src/views/commandScreen/commandCenter/rightPage/rightCenter.vue
 create mode 100644 src/views/commandScreen/commandCenter/rightPage/rightTop.vue

diff --git a/src/views/commandScreen/commandCenter/leftTop.vue b/src/views/commandScreen/commandCenter/leftTop.vue
index 18da178..cf1d3e5 100644
--- a/src/views/commandScreen/commandCenter/leftTop.vue
+++ b/src/views/commandScreen/commandCenter/leftTop.vue
@@ -5,7 +5,7 @@
 				人员履职情况分析
 			</div>
 			<div class="hRight">
-				<el-date-picker style="width: 85%" v-model="value1" type="daterange" range-separator="To" start-placeholder="Start date" end-placeholder="End date" :size="size"/>
+				<el-date-picker style="width: 85%" v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :size="size"/>
 			</div>
 		</div>
 		<div class="content">
@@ -47,6 +47,7 @@ import { getStageOption } from "@/api/modules/projectOverview";
 import type { TabsPaneContext } from 'element-plus'
 
 const activeName = ref('first')
+let dateRange = ref([] as any)
 
 const handleClick = (tab: TabsPaneContext, event: Event) => {
   console.log(tab, event)
@@ -185,4 +186,23 @@ onMounted( async () => {
 
 	}
 }
+::v-deep .el-input__inner {
+	color: #fff;
+}
+::v-deep .el-select .el-input .el-select__caret {
+	color: #fff;
+}
+::v-deep .el-input__wrapper {
+	width: 85%;
+	height: 0%;
+	background: #0d2956;
+}
+::v-deep .el-range-separator {
+	color: #ccc;
+	font-size: 10px;
+}
+::v-deep .el-range-input {
+	color: #ccc;
+	font-size: 10px;
+}
 </style>
diff --git a/src/views/commandScreen/commandCenter/rightAll.vue b/src/views/commandScreen/commandCenter/rightAll.vue
index 5e1fbb1..5006269 100644
--- a/src/views/commandScreen/commandCenter/rightAll.vue
+++ b/src/views/commandScreen/commandCenter/rightAll.vue
@@ -5,7 +5,7 @@
 				隐患统计智能分析
 			</div>
 			<div class="hRight">
-				<el-date-picker style="width: 85%" v-model="value1" type="daterange" range-separator="To" start-placeholder="Start date" end-placeholder="End date" :size="size"/>
+				<el-date-picker style="width: 85%" v-model="dateRange" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :size="size"/>
 			</div>
 		</div>
 		<div class="content">
@@ -59,12 +59,16 @@
 import Card from "@/components/card.vue";
 import { onMounted, ref } from "vue";
 import { GlobalStore } from "@/stores";
+import rightTop from "@/views/commandScreen/commandCenter/rightTop.vue";
+import rightCenter from "@/views/commandScreen/commandCenter/rightCenter.vue";
 const store = GlobalStore();
 import { getProjectInspectRecordCountApi } from "@/api/modules/projectOverview";
 import * as echarts from "echarts";
 const echartsTest = ref();
 let questionTotal = ref(0 as any);
 
+let dateRange = ref([] as any);
+
 let majorDangerCount = ref(20 as any);
 let majorDangerRate = ref(50 as any);
 let overdueMajorDangerCount = ref(20 as any);
@@ -460,11 +464,11 @@ onMounted(async () => {
 			margin-top: 10px;
 			width: 100%;
 			height: 25%;
-			background-color: darkblue;
 			.ctHead{
+				background-color: #002f69;
 				padding-bottom: 5px;
 				color: #fff;
-				height: 20%;
+				height: 15%;
 				font-size: 16px;
 				display: flex;
 				justify-content: center;
@@ -475,18 +479,18 @@ onMounted(async () => {
 				}
 			}
 			.ctContent{
-				height: 80%;
-				background-color: darkred;
+				height: 85%;
+				// background-color: darkred;
 			}
 		}
 		.contentMiddle{
 			width: 100%;
 			height: 25%;
-			background-color: darkblue;
 			.cmHead{
+				background-color: #002f69;
 				padding-bottom: 5px;
 				color: #fff;
-				height: 20%;
+				height: 15%;
 				font-size: 16px;
 				display: flex;
 				justify-content: center;
@@ -497,8 +501,8 @@ onMounted(async () => {
 				}
 			}
 			.cmContent{
-				height: 80%;
-				background-color: darkred;
+				height: 85%;
+				// background-color: darkred;
 			}
 		}
 		.contentBottom{
@@ -585,10 +589,24 @@ onMounted(async () => {
 		}
 	}
 }
-::v-deep .h-card .content {
-	height: 80%;
+
+::v-deep .el-input__inner {
+	color: #fff;
 }
-::v-deep .h-card {
-	position: relative;
+::v-deep .el-select .el-input .el-select__caret {
+	color: #fff;
+}
+::v-deep .el-input__wrapper {
+	width: 85%;
+	height: 0%;
+	background: #0d2956;
+}
+::v-deep .el-range-separator {
+	color: #ccc;
+	font-size: 10px;
+}
+::v-deep .el-range-input {
+	color: #ccc;
+	font-size: 10px;
 }
 </style>
diff --git a/src/views/commandScreen/commandCenter/rightPage/rightCenter.vue b/src/views/commandScreen/commandCenter/rightPage/rightCenter.vue
new file mode 100644
index 0000000..e69de29
diff --git a/src/views/commandScreen/commandCenter/rightPage/rightTop.vue b/src/views/commandScreen/commandCenter/rightPage/rightTop.vue
new file mode 100644
index 0000000..e44a9ef
--- /dev/null
+++ b/src/views/commandScreen/commandCenter/rightPage/rightTop.vue
@@ -0,0 +1,43 @@
+<template>
+	<div class="rightTop">
+		
+	</div>
+</template>
+
+<script setup lang="ts">
+import { GlobalStore } from "@/stores";
+import { ref, onMounted, watch } from "vue";
+import { getStageOption } from "@/api/modules/projectOverview";
+import type { TabsPaneContext } from 'element-plus'
+
+
+onMounted( async () => {
+	
+})
+</script>
+<style lang="scss" scoped>
+
+.rightTop {
+	margin-top: 10px;
+	width: 100%;
+	height: 25%;
+	.ctHead{
+		background-color: #002f69;
+		padding-bottom: 5px;
+		color: #fff;
+		height: 15%;
+		font-size: 16px;
+		display: flex;
+		justify-content: center;
+		align-items: flex-end;
+		text{
+			font-size: 24px;
+			color: #fc4c4c;
+		}
+	}
+	.ctContent{
+		height: 85%;
+		// background-color: darkred;
+	}
+}
+</style>