From 419fe50acad4674f50c6639b3ec7ccbcaf2cbf44 Mon Sep 17 00:00:00 2001
From: feiyu02 <risaku@163.com>
Date: 星期四, 20 三月 2025 17:43:49 +0800
Subject: [PATCH] 走航融合（待完成）
---
src/model/SatelliteGrid.js | 3
src/views/underwaymix/UnderwayMixMode.vue | 95 ++++++++++++++-----
src/utils/map/grid.js | 2
src/components.d.ts | 4
src/views/underwaymix/component/GridStyleTool.vue | 162 +++++++++++++++++++++----------
src/router/index.js | 2
6 files changed, 187 insertions(+), 81 deletions(-)
diff --git a/src/components.d.ts b/src/components.d.ts
index f0bc47d..34b6c69 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -27,6 +27,7 @@
ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
ElDatePicker: typeof import('element-plus/es')['ElDatePicker']
ElDialog: typeof import('element-plus/es')['ElDialog']
+ ElDivider: typeof import('element-plus/es')['ElDivider']
ElDropdown: typeof import('element-plus/es')['ElDropdown']
ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
@@ -34,15 +35,16 @@
ElFormItem: typeof import('element-plus/es')['ElFormItem']
ElIcon: typeof import('element-plus/es')['ElIcon']
ElInput: typeof import('element-plus/es')['ElInput']
+ ElInputNumber: typeof import('element-plus/es')['ElInputNumber']
ElOption: typeof import('element-plus/es')['ElOption']
ElPagination: typeof import('element-plus/es')['ElPagination']
ElPopover: typeof import('element-plus/es')['ElPopover']
ElRadio: typeof import('element-plus/es')['ElRadio']
ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
ElRow: typeof import('element-plus/es')['ElRow']
+ ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
ElSelect: typeof import('element-plus/es')['ElSelect']
ElSlider: typeof import('element-plus/es')['ElSlider']
- ElSpace: typeof import('element-plus/es')['ElSpace']
ElSwitch: typeof import('element-plus/es')['ElSwitch']
ElTable: typeof import('element-plus/es')['ElTable']
ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
diff --git a/src/model/SatelliteGrid.js b/src/model/SatelliteGrid.js
index ddf731f..dad244c 100644
--- a/src/model/SatelliteGrid.js
+++ b/src/model/SatelliteGrid.js
@@ -503,6 +503,9 @@
style: {
isMixGridHighlight: true
}
+ },
+ extData: {
+ name: `璧拌埅铻嶅悎 - ${mixTag}`
}
});
}
diff --git a/src/router/index.js b/src/router/index.js
index 47edf4f..770dcf5 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -6,7 +6,7 @@
routes: [
{
path: '/',
- redirect: '/login'
+ redirect: '/index/underwaymix'
},
// 鐧婚檰椤甸潰
{
diff --git a/src/utils/map/grid.js b/src/utils/map/grid.js
index 64a4cdf..18241d1 100644
--- a/src/utils/map/grid.js
+++ b/src/utils/map/grid.js
@@ -426,7 +426,7 @@
grid.setOptions({
...style,
fillColor: _color, //澶氳竟褰㈠～鍏呴鑹�
- fillOpacity: style.opacity ? style.opacity : color[3] == 0 ? 0 : 0.7
+ fillOpacity: style.opacity ? style.opacity : color[3] == 0 ? 0 : 1
});
res.push(grid);
diff --git a/src/views/underwaymix/UnderwayMixMode.vue b/src/views/underwaymix/UnderwayMixMode.vue
index 3d690d3..3d321e7 100644
--- a/src/views/underwaymix/UnderwayMixMode.vue
+++ b/src/views/underwaymix/UnderwayMixMode.vue
@@ -51,8 +51,16 @@
@change="handleMixClick"
>
</CheckButton>
+ <CheckButton
+ :disabled="!mixActive"
+ active-text="椋庨櫓鐑姏鍥�"
+ inactive-text="椋庨櫓鐑姏鍥�"
+ :default-value="false"
+ @change="handleHeatMapClick"
+ >
+ </CheckButton>
</el-row>
- <div class="m-t-8">缃戞牸瑕佺礌</div>
+ <!-- <div class="m-t-8">缃戞牸瑕佺礌</div>
<el-row class="m-t-8">
<CheckButton
active-text="鏄剧ず缃戞牸"
@@ -99,7 +107,6 @@
</el-row>
<div class="m-t-8">璧拌埅瑕佺礌</div>
<el-row class="m-t-8">
- <!-- <el-divider content-position="left"></el-divider> -->
<el-button
type="primary"
@@ -110,7 +117,7 @@
>
{{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }}
</el-button>
- </el-row>
+ </el-row> -->
</template>
<template #footer> </template>
</BaseCard>
@@ -126,7 +133,10 @@
</el-row>
</el-col>
</el-row>
- <GridStyleTool :gridCtrls="gridCtrls"></GridStyleTool>
+ <GridStyleTool
+ :gridCtrls="gridCtrls"
+ @show-underway="handleUnderwayClick"
+ ></GridStyleTool>
</el-row>
<!-- </div> -->
</template>
@@ -272,12 +282,19 @@
});
if (mixActive.value) {
satelliteGrid.mixGrid(tags);
+ gridCtrls.value = [satelliteGrid];
} else {
satelliteGrid.changeVisibility({
tags,
showGridViews: true
});
}
+}
+
+function handleHeatMapClick() {
+ const tags = fusionDataList.value
+ .filter((v, i) => selectedfusionData.value.indexOf(i) != -1)
+ .map((v) => v.id);
}
function handleGridClick() {
@@ -291,9 +308,18 @@
});
}
-function handleUnderwayClick() {
+function handleUnderwayClick({ isShow, dataId }) {
underwayVisible.value = !underwayVisible.value;
- underwayVisible.value ? draw() : mapLine.hideLine();
+
+ if (isShow) {
+ draw(dataId);
+ } else {
+ const d = fusionDataList.value.find((v) => v.id == dataId);
+ const mission = missionStore.missionList.find((v) => {
+ return v.missionCode == d.mixDataId;
+ });
+ mapLine.hideLine(mission.missionCode);
+ }
}
function handleRankClick() {
@@ -389,30 +415,49 @@
});
}
-function draw() {
+function draw(dataId) {
if (isUnmounted.value) return;
- selectedfusionData.value.forEach((i) => {
- const d = fusionDataList.value[i];
+ // selectedfusionData.value.forEach((i) => {
+ // const d = fusionDataList.value[i];
- const mission = missionStore.missionList.find((v) => {
- return v.missionCode == d.mixDataId;
- });
+ // const mission = missionStore.missionList.find((v) => {
+ // return v.missionCode == d.mixDataId;
+ // });
- if (factorDataMap.has(mission.missionCode)) {
- const fd = factorDataMap.get(mission.missionCode);
- drawLine(mission.missionCode, fd);
- } else {
- search(mission).then((res) => {
- const fd = new FactorDatas();
- fd.setData(res.data, drawMode.value, () => {
- fd.refreshHeight(factorType.value);
- factorDataMap.set(mission.missionCode, fd);
- drawLine(mission.missionCode, fd);
- });
- });
- }
+ // if (factorDataMap.has(mission.missionCode)) {
+ // const fd = factorDataMap.get(mission.missionCode);
+ // drawLine(mission.missionCode, fd);
+ // } else {
+ // search(mission).then((res) => {
+ // const fd = new FactorDatas();
+ // fd.setData(res.data, drawMode.value, () => {
+ // fd.refreshHeight(factorType.value);
+ // factorDataMap.set(mission.missionCode, fd);
+ // drawLine(mission.missionCode, fd);
+ // });
+ // });
+ // }
+ // });
+
+ const d = fusionDataList.value.find((v) => v.id == dataId);
+ const mission = missionStore.missionList.find((v) => {
+ return v.missionCode == d.mixDataId;
});
+
+ if (factorDataMap.has(mission.missionCode)) {
+ const fd = factorDataMap.get(mission.missionCode);
+ drawLine(mission.missionCode, fd);
+ } else {
+ search(mission).then((res) => {
+ const fd = new FactorDatas();
+ fd.setData(res.data, drawMode.value, () => {
+ fd.refreshHeight(factorType.value);
+ factorDataMap.set(mission.missionCode, fd);
+ drawLine(mission.missionCode, fd);
+ });
+ });
+ }
}
function drawLine(missionCode, fd) {
diff --git a/src/views/underwaymix/component/GridStyleTool.vue b/src/views/underwaymix/component/GridStyleTool.vue
index 0b06203..76d636a 100644
--- a/src/views/underwaymix/component/GridStyleTool.vue
+++ b/src/views/underwaymix/component/GridStyleTool.vue
@@ -12,53 +12,81 @@
<el-col span="2">
<BaseCard v-show="show" direction="right" borderless="r">
<template #content>
- <div class="content-wrap">
+ <el-scrollbar class="content-wrap">
<div v-for="(g, i) in gridCtrlList" :key="i">
{{ g.name }}
<div v-for="(value, t) in g.views" :key="t">
<!-- {{ value[0] }} -->
- {{ value[1].extData.name }}
+ {{ value.extData.name }}
<!-- {{ key }} -->
<!-- <el-text>{{ g.name }}</el-text> -->
<!-- <div class="m-t-8">缃戞牸瑕佺礌</div> -->
- <el-row class="m-t-8">
+ <el-row class="m-t-8" justify="space-between">
<CheckButton
active-text="鏄剧ず缃戞牸"
inactive-text="闅愯棌缃戞牸"
:default-value="true"
- @change="handleGridClick"
+ @change="(e) => handleGridClick(e, i, value)"
>
</CheckButton>
<CheckButton
active-text="鏄剧ず鎺掑悕"
inactive-text="闅愯棌鎺掑悕"
:default-value="false"
- @change="handleGridClick"
+ @change="(e) => handleRankClick(e, i, value)"
>
</CheckButton>
<CheckButton
active-text="鏄剧ず鏁版嵁"
inactive-text="闅愯棌鏁版嵁"
:default-value="false"
- @change="handleGridClick"
+ @change="(e) => handleDataClick(e, i, value)"
>
</CheckButton>
</el-row>
- <el-row class="m-b-8" gap="2">
- <div class="m-t-8">缃戞牸閫忔槑搴�</div>
+ <el-row class="m-t-8" justify="space-between">
+ <CheckButton
+ active-text="缁樺埗瀵规瘮鑹�"
+ inactive-text="缁樺埗鏍囧噯鑹�"
+ :default-value="false"
+ @change="(e) => handleColorClick(e, i, value)"
+ >
+ </CheckButton>
+ <CheckButton
+ active-text="鏄剧ず璧拌埅杞ㄨ抗"
+ inactive-text="闅愯棌璧拌埅杞ㄨ抗"
+ :default-value="false"
+ @change="(e) => handleUnderwayClick(e, i, value)"
+ >
+ </CheckButton>
+ </el-row>
+ <!-- <el-row class="m-b-8" align="middle"> -->
+ <el-form-item label="閫忔槑搴�">
+ <!-- <div class="m-t-8">缃戞牸閫忔槑搴�</div> -->
<el-slider
- v-model="opacityValue"
+ v-model="value.opacityValue"
:min="0"
:max="1"
:step="0.1"
show-stops
- @change="handleOpacityChange"
- style="width: 200px"
+ @change="(e) => handleOpacityChange(e, i, value)"
+ style="width: 150px"
/>
- </el-row>
+ <el-input-number
+ class="m-l-16"
+ size="small"
+ v-model="value.opacityValue"
+ :min="0"
+ :max="1"
+ :step="0.1"
+ @change="(e) => handleOpacityChange(e, i, value)"
+ />
+ </el-form-item>
+ <!-- </el-row> -->
+ <el-divider />
</div>
</div>
- </div>
+ </el-scrollbar>
</template>
</BaseCard>
</el-col>
@@ -68,7 +96,7 @@
/**
* 缃戞牸鏍峰紡鎺у埗宸ュ叿
*/
-import { ref, watch, computed } from 'vue';
+import { ref, reactive, onMounted, onUnmounted, computed, toRaw } from 'vue';
const props = defineProps({
// 缃戞牸绠＄悊瀵硅薄[SatelliteGrid]鏁扮粍
@@ -78,63 +106,87 @@
}
});
+const emits = defineEmits(['showUnderway']);
+
const gridCtrlList = computed(() => {
return props.gridCtrls.map((g) => {
- return {
+ return reactive({
name: g.name,
- views: Array.from(g.mapViewsMap)
- };
+ views: Array.from(g.mapViewsMap).map((v) => {
+ return {
+ tag: v[0],
+ extData: v[1].extData,
+ opacityValue: 1
+ };
+ })
+ });
});
});
-// watch(
-// () => props.gridCtrls,
-// (nV, oV) => {
-// gridCtrlList.value = nV.map((v) => {
-// return Array.from(v.infoMap);
-// });
-// },
-// { deep: true }
-// );
-
const show = ref(true);
-const gridVisible = ref(false);
-const rankVisible = ref(false);
-const dataVisible = ref(false);
-const isStandardColor = ref(true);
-const isOpacity = ref(false);
-const opacityValue = ref(0.7);
+// const gridVisible = ref(false);
+// const rankVisible = ref(false);
+// const dataVisible = ref(false);
+// const isStandardColor = ref(true);
+// const isOpacity = ref(false);
+// const opacityValue = ref(0.7);
-const emits = defineEmits([
- 'showRank',
- 'showData',
- 'changeColor',
- 'changeOpacity'
-]);
+// const emits = defineEmits([
+// 'showRank',
+// 'showData',
+// 'changeColor',
+// 'changeOpacity'
+// ]);
-function handleRankClick() {
- rankVisible.value = !rankVisible.value;
- emits('showRank', rankVisible.value);
+function handleGridClick(e, index, value) {
+ const key = value.tag;
+ toRaw(props.gridCtrls[index]).changeVisibility({
+ tags: [key],
+ showGridViews: e
+ });
}
-function handleDataClick() {
- dataVisible.value = !dataVisible.value;
- emits('showData', dataVisible.value);
+function handleRankClick(e, index, value) {
+ const key = value.tag;
+ toRaw(props.gridCtrls[index]).changeVisibility({
+ tags: [key],
+ showRankTxt: e
+ });
}
-function handleColorClick() {
- isStandardColor.value = !isStandardColor.value;
- emits('changeColor', isStandardColor.value);
+function handleDataClick(e, index, value) {
+ const key = value.tag;
+ toRaw(props.gridCtrls[index]).changeVisibility({
+ tags: [key],
+ showDataTxt: e
+ });
}
-function handleOpacityClick() {
- // isOpacity.value = !isOpacity.value;
- // emits('changeOpacity', isOpacity.value);
+function handleColorClick(e, index, value) {
+ const key = value.tag;
+ toRaw(props.gridCtrls[index]).changeGridColor({
+ tag: key,
+ useCustomColor: e
+ });
}
-function handleOpacityChange(value) {
- emits('changeOpacity', value);
+function handleOpacityChange(e, index, value) {
+ console.log(e, index, value);
+
+ const key = value.tag;
+ // value.opacityValue = e;
+ toRaw(props.gridCtrls[index]).changeGridOpacity({
+ tag: key,
+ opacityValue: toRaw(value.opacityValue)
+ });
+}
+
+function handleUnderwayClick(e, index, value) {
+ emits('showUnderway', {
+ isShow: e,
+ dataId: value.tag
+ });
}
</script>
<style scoped>
@@ -142,4 +194,8 @@
min-width: 300px;
min-height: 600px;
}
+
+:deep(.el-input-number) {
+ width: 80px;
+}
</style>
--
Gitblit v1.9.3