From 99af9b1224ad07291b07ab69a305d7be0f75a125 Mon Sep 17 00:00:00 2001
From: kun <1422840143@qq.com>
Date: Mon, 20 Nov 2023 14:12:58 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20BUG=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../frontLargeScreen/components/flyRoam.vue   | 42 +++++++++++++++++-
 .../components/mapMeasurement.vue             | 31 +++++++++++++
 .../components/regionalNavigation.vue         | 37 +++++++++++++++-
 .../goverment/frontLargeScreen/index.vue      | 37 +++++++++++++++-
 .../largeScreen/components/flyRoam.vue        | 42 +++++++++++++++++-
 .../largeScreen/components/mapMeasurement.vue | 44 ++++++++++++++++++-
 .../components/regionalNavigation.vue         | 37 +++++++++++++++-
 src/views/goverment/largeScreen/index.vue     | 37 +++++++++++++++-
 8 files changed, 298 insertions(+), 9 deletions(-)

diff --git a/src/views/goverment/frontLargeScreen/components/flyRoam.vue b/src/views/goverment/frontLargeScreen/components/flyRoam.vue
index 98fb3cb..6c1cf3c 100644
--- a/src/views/goverment/frontLargeScreen/components/flyRoam.vue
+++ b/src/views/goverment/frontLargeScreen/components/flyRoam.vue
@@ -42,7 +42,7 @@
 			<div class="item-classify-item">
 				<div>视角模式：</div>
 				<div>
-					<el-select v-model="viewParams.viewModel" @change="viewChange">
+					<el-select v-model="viewParams.viewModel" :teleported="false" @change="viewChange">
 						<el-option v-for="item in modelOptions" :key="item.value" :label="item.name" :value="item.value" />
 					</el-select>
 				</div>
@@ -541,5 +541,45 @@ onUnmounted(() => {
 		// background-color: #008bff !important;
 		background-color: transparent !important;
 	}
+
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
+
+	.el-input-number__increase,
+	.el-input-number__decrease {
+		background-color: transparent;
+		color: white;
+	}
 }
 </style>
diff --git a/src/views/goverment/frontLargeScreen/components/mapMeasurement.vue b/src/views/goverment/frontLargeScreen/components/mapMeasurement.vue
index 39d8a6f..527badc 100644
--- a/src/views/goverment/frontLargeScreen/components/mapMeasurement.vue
+++ b/src/views/goverment/frontLargeScreen/components/mapMeasurement.vue
@@ -325,5 +325,36 @@ onUnmounted(() => {
 		border-radius: 6px;
 		border: 0;
 	}
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>
diff --git a/src/views/goverment/frontLargeScreen/components/regionalNavigation.vue b/src/views/goverment/frontLargeScreen/components/regionalNavigation.vue
index 8b0b1b0..06bcaab 100644
--- a/src/views/goverment/frontLargeScreen/components/regionalNavigation.vue
+++ b/src/views/goverment/frontLargeScreen/components/regionalNavigation.vue
@@ -7,7 +7,7 @@
 		<div class="areabox">
 			<div class="flex-box">
 				<span>省：</span>
-				<el-select v-model="address.province" placeholder="请选择省" @change="handleProvinceSelect">
+				<el-select v-model="address.province" :teleported="false" placeholder="请选择省" @change="handleProvinceSelect">
 					<el-option v-for="item in regionData" :label="item.label" :value="item.value" />
 				</el-select>
 			</div>
@@ -17,6 +17,7 @@
 					v-model="address.city"
 					placeholder="请选择市"
 					:disabled="!address.province || cityList.length == 0"
+					:teleported="false"
 					@change="handleCitySelect"
 				>
 					<el-option v-for="item in cityList" :label="item.label" :value="item.value" />
@@ -28,6 +29,7 @@
 					v-model="address.area"
 					placeholder="请选择区"
 					:disabled="!address.province || !address.city || areaList.length == 0"
+					:teleported="false"
 					@change="handleAreaSelect"
 				>
 					<el-option v-for="item in areaList" :label="item.label" :value="item.value" />
@@ -244,5 +246,38 @@ onUnmounted(() => {
 		border-radius: 6px;
 		border: 0;
 	}
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>
diff --git a/src/views/goverment/frontLargeScreen/index.vue b/src/views/goverment/frontLargeScreen/index.vue
index 6b7d474..41333a9 100644
--- a/src/views/goverment/frontLargeScreen/index.vue
+++ b/src/views/goverment/frontLargeScreen/index.vue
@@ -98,11 +98,11 @@
 		<div class="roller-add" v-if="rollerComparisonShow">
 			<div class="roller-add-content">
 				<span>左侧图层：</span>
-				<el-select v-model="rollerVal.leftRollerVal" placeholder="请选择" @change="changeLeft">
+				<el-select v-model="rollerVal.leftRollerVal" :teleported="false" placeholder="请选择" @change="changeLeft">
 					<el-option v-for="item in leftRollerList" :key="item.id" :label="item.name" :value="item.id" />
 				</el-select>
 				<span>右侧图层：</span>
-				<el-select v-model="rollerVal.rightRollerVal" placeholder="请选择" @change="changeRight">
+				<el-select v-model="rollerVal.rightRollerVal" :teleported="false" placeholder="请选择" @change="changeRight">
 					<el-option v-for="item in rightRollerList" :key="item.id" :label="item.name" :value="item.id" />
 				</el-select>
 				<el-icon size="16" color="#fff" style="cursor: pointer" @click="clearRollerComparison"><CloseBold /></el-icon>
@@ -2248,5 +2248,38 @@ onUnmounted(() => {
 			color: white;
 		}
 	}
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>
diff --git a/src/views/goverment/largeScreen/components/flyRoam.vue b/src/views/goverment/largeScreen/components/flyRoam.vue
index 3447bb3..5dc97bd 100644
--- a/src/views/goverment/largeScreen/components/flyRoam.vue
+++ b/src/views/goverment/largeScreen/components/flyRoam.vue
@@ -42,7 +42,7 @@
 			<div class="item-classify-item">
 				<div>视角模式：</div>
 				<div>
-					<el-select v-model="viewParams.viewModel" @change="viewChange">
+					<el-select v-model="viewParams.viewModel" :teleported="false" @change="viewChange">
 						<el-option v-for="item in modelOptions" :key="item.value" :label="item.name" :value="item.value" />
 					</el-select>
 				</div>
@@ -541,5 +541,45 @@ onUnmounted(() => {
 		// background-color: #008bff !important;
 		background-color: transparent !important;
 	}
+
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
+
+	.el-input-number__increase,
+	.el-input-number__decrease {
+		background-color: transparent;
+		color: white;
+	}
 }
 </style>
diff --git a/src/views/goverment/largeScreen/components/mapMeasurement.vue b/src/views/goverment/largeScreen/components/mapMeasurement.vue
index 31694e5..19bafc9 100644
--- a/src/views/goverment/largeScreen/components/mapMeasurement.vue
+++ b/src/views/goverment/largeScreen/components/mapMeasurement.vue
@@ -15,7 +15,7 @@
 		</div>
 		<div class="unit-select">
 			<span>单位</span>
-			<el-select v-model="formData.unitVal" placeholder="请选择">
+			<el-select v-model="formData.unitVal" placeholder="请选择" :teleported="false">
 				<el-option v-for="item in unitList" :key="item.value" :label="item.name" :value="item.value" />
 			</el-select>
 		</div>
@@ -325,5 +325,47 @@ onUnmounted(() => {
 		border-radius: 6px;
 		border: 0;
 	}
+	.el-select,
+	.el-input,
+	.el-input__inner {
+		border-radius: 10px;
+		color: #fff;
+		//border: 1px solid green;
+		border-radius: 0px;
+		border-color: green;
+		text-align: center;
+	}
+
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>
diff --git a/src/views/goverment/largeScreen/components/regionalNavigation.vue b/src/views/goverment/largeScreen/components/regionalNavigation.vue
index 3090b22..56dc2e8 100644
--- a/src/views/goverment/largeScreen/components/regionalNavigation.vue
+++ b/src/views/goverment/largeScreen/components/regionalNavigation.vue
@@ -7,7 +7,7 @@
 		<div class="areabox">
 			<div class="flex-box">
 				<span>省：</span>
-				<el-select v-model="address.province" placeholder="请选择省" @change="handleProvinceSelect">
+				<el-select v-model="address.province" placeholder="请选择省" @change="handleProvinceSelect" :teleported="false">
 					<el-option v-for="item in regionData" :label="item.label" :value="item.value" />
 				</el-select>
 			</div>
@@ -17,6 +17,7 @@
 					v-model="address.city"
 					placeholder="请选择市"
 					:disabled="!address.province || cityList.length == 0"
+					:teleported="false"
 					@change="handleCitySelect"
 				>
 					<el-option v-for="item in cityList" :label="item.label" :value="item.value" />
@@ -28,6 +29,7 @@
 					v-model="address.area"
 					placeholder="请选择区"
 					:disabled="!address.province || !address.city || areaList.length == 0"
+					:teleported="false"
 					@change="handleAreaSelect"
 				>
 					<el-option v-for="item in areaList" :label="item.label" :value="item.value" />
@@ -244,5 +246,38 @@ onUnmounted(() => {
 		border-radius: 6px;
 		border: 0;
 	}
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>
diff --git a/src/views/goverment/largeScreen/index.vue b/src/views/goverment/largeScreen/index.vue
index cb8152b..e999b8a 100644
--- a/src/views/goverment/largeScreen/index.vue
+++ b/src/views/goverment/largeScreen/index.vue
@@ -98,11 +98,11 @@
 		<div class="roller-add" v-if="rollerComparisonShow">
 			<div class="roller-add-content">
 				<span>左侧图层：</span>
-				<el-select v-model="rollerVal.leftRollerVal" placeholder="请选择" @change="changeLeft">
+				<el-select v-model="rollerVal.leftRollerVal" :teleported="false" placeholder="请选择" @change="changeLeft">
 					<el-option v-for="item in leftRollerList" :key="item.id" :label="item.name" :value="item.id" />
 				</el-select>
 				<span>右侧图层：</span>
-				<el-select v-model="rollerVal.rightRollerVal" placeholder="请选择" @change="changeRight">
+				<el-select v-model="rollerVal.rightRollerVal" :teleported="false" placeholder="请选择" @change="changeRight">
 					<el-option v-for="item in rightRollerList" :key="item.id" :label="item.name" :value="item.id" />
 				</el-select>
 				<el-icon size="16" color="#fff" style="cursor: pointer" @click="clearRollerComparison"><CloseBold /></el-icon>
@@ -2232,5 +2232,38 @@ onUnmounted(() => {
 			color: white;
 		}
 	}
+	//修改总体选项的样式 最外层
+	.el-select__popper.el-popper {
+		border: 0;
+		background-color: transparent;
+		box-shadow: none;
+		inset: 42px auto auto 0px !important;
+	}
+	.el-select-dropdown {
+		background: rgba(11, 22, 51, 0.7);
+		box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
+		opacity: 1;
+		border: 1px solid #3b60a7;
+		border-radius: 0px;
+	}
+
+	//修改单个的选项的样式
+
+	.el-select-dropdown__item {
+		background-color: transparent;
+		color: #fff;
+		text-align: center;
+	}
+
+	//item选项的hover样式
+
+	.el-select-dropdown__item.hover,
+	.el-select-dropdown__item:hover {
+		color: white;
+		background: linear-gradient(90deg, rgba(49, 96, 179, 0) 0%, #3160b3 51%, rgba(49, 96, 179, 0) 100%);
+	}
+	.el-popper__arrow::before {
+		display: none;
+	}
 }
 </style>