功能修改

src/views/home/cpns/FloatPanelFcky.vue

@@ -49,7 +49,7 @@
 					<el-checkbox-group
 						v-if="form.layeringType === '广域分层'"
 						v-model="form.layersBig"
-						@change="(val) => handleCheck('big', val, 3)">
+						@change="(val) => handleCheck('big', val)">
 						<el-checkbox v-for="item in layersListBig" :label="item.label" :value="item.value" />
 					</el-checkbox-group>
 
@@ -333,8 +333,9 @@ function handleCheck(type, checkVal) {
 		checkedLen = checkVal.length
 		typeAll = layersListBig
 	} else {
-		typeAll = layersListSmall.value.slice(typeMap[type][0], typeMap[type][1])
-		checkedLen = typeAll.filter((a) => checkVal.indexOf(a) > -1).length
+		typeAll = layersListSmall.value.slice(typeMap[type][0], typeMap[type][1] + 1)
+		checkedLen = typeAll.filter((a) => checkVal.indexOf(a.value) > -1).length
+		console.log(typeAll, checkVal)
 	}
 	indeterminate[type] = checkedLen < typeAll.length && checkedLen > 0
 	checkAll[type] = checkedLen === typeAll.length
@@ -374,7 +375,7 @@ function clearAll(all = false) {
 	const currentList = form.value.layeringType === '广域分层' ? layersListBig : layersListSmall.value
 	currentList.forEach((i) => {
 		if ([...lastBigLayers, ...lastSmallLayers].includes(i.value)) {
-			toggleSingleLayer({ id: i.id, value: i.value })
+			toggleSingleLayer({ id: i.id, value: i.value }, false)
 		}
 	})
 	lastBigLayers = []
@@ -450,5 +451,9 @@ onBeforeUnmount(() => {
 			width: 105px;
 		}
 	}
+
+	.mr-0 {
+		margin-right: 0 !important;
+	}
 }
 </style>

src/views/home/cpns/FloatPanelTsjs.vue

@@ -29,7 +29,7 @@
 				:alert="alertInfo"
 				:base="baseInfo"
 				@close="handleCloseInfo"
-				@showLine="handleToggleSingleLine" />
+				v-model:showLine="showSingleLine" />
 		</Transition>
 	</div>
 </template>
@@ -193,11 +193,29 @@ function handleCloseInfo() {
 	if ((currentDemo.value.value = 'BreakInto')) {
 		renderBreakIntoArea(false)
 	}
+	showSingleLine.value = false
 }
 
-function handleToggleSingleLine(val) {
-	console.log('handleToggleSingleLine', val)
-}
+let currentLineId
+
+const showSingleLine = ref(false)
+
+watch(showSingleLine, (val) => {
+	const targetLine = routeList.find((r) => r.id === currentLineId)
+	if (!targetLine) return
+	renderShapes({
+		id: 'single_' + currentLineId,
+		data: val
+			? {
+					type: targetLine.type,
+					shape: {
+						...JSON.parse(targetLine.shape),
+						color: hexToRgb('#ffff00', 0.5),
+					},
+				}
+			: null,
+	})
+})
 
 onBeforeMount(() => {
 	getData()
@@ -210,6 +228,7 @@ onBeforeMount(() => {
 				baseInfo.value.battery = msg.Data.electricity
 				baseInfo.value.height = msg.Data.height.toFixed(2) + 'm'
 				baseInfo.value.velocity = msg.Data.speed.toFixed(2) + 'm/s'
+				currentLineId = msg.Data.TravelId
 
 				const { electricityWarning, weatherWarning, collision, noFlyZone, clearZone, nearstAircraft, routeDeviate } =
 					msg.Data.flightDataStatus

src/views/home/cpns/FloatPanelTsjsGis.vue

@@ -1,5 +1,5 @@
 <template>
-	<div class="panel-tsjs-gis" :class="{ collapse: layoutStore.leftCollapse }">
+	<div class="panel-tsjs-gis" :class="{ collapse: layoutStore.rightCollapse }">
 		<div class="options">
 			<div class="switch" v-for="item in optionList" @click="toggleOption(item)">
 				<span>{{ item.label }}</span>

src/views/home/cpns/FloatPanelUav.vue

@@ -30,7 +30,7 @@
 
 			<div class="title-sub my-2">
 				飞行动态
-				<el-checkbox class="ml-auto" v-model="showLine" @change="handleToggleLine">航线</el-checkbox>
+				<el-checkbox class="ml-auto" v-model="localShowLine">航线</el-checkbox>
 			</div>
 			<ul class="des-list">
 				<li>
@@ -157,11 +157,15 @@
 <script setup>
 import useLayoutStore from '@/store/layout'
 import { getAssetsFile } from '@/utils/require'
-import { ref, watch } from 'vue'
+import { ref, watch, computed } from 'vue'
 
 const layoutStore = useLayoutStore()
 
 const props = defineProps({
+	showLine: {
+		type: Boolean,
+		default: false,
+	},
 	base: {
 		type: Object,
 		default: {
@@ -244,7 +248,7 @@ function genWeatherDes(type) {
 	}
 }
 
-const emit = defineEmits(['close', 'showLine'])
+const emit = defineEmits(['close', 'update:showLine'])
 
 function handleClose() {
 	emit('close')
@@ -263,11 +267,14 @@ watch(
 	{ deep: true, immediate: true }
 )
 
-const showLine = ref(false)
-
-function handleToggleLine(val) {
-	emit('showLine', val)
-}
+const localShowLine = computed({
+	get() {
+		return props.showLine
+	},
+	set(value) {
+		emit('update:showLine', value)
+	},
+})
 </script>
 
 <style lang="scss" scoped>