From 2592dc279ec82bf3649a4dbe644c6416263a10ef Mon Sep 17 00:00:00 2001
From: riku <risaku@163.com>
Date: 星期五, 07 三月 2025 17:10:25 +0800
Subject: [PATCH] 各模块功能新增
---
src/views/dataproduct/ProductManage.vue | 19
src/views/satellitetelemetry/SatelliteTelemetry.vue | 98 +-
src/utils/map/grid.js | 131 ++-
src/api/gridApi.js | 9
src/components.d.ts | 8
src/views/HomePage.vue | 27
src/views/satellitetelemetry/SatelliteProxy.js | 520 +++++--------
src/views/satellitetelemetry/component/SatelliteMixTool.vue | 288 +++++-
src/views/dataproduct/component/ProductSecondaryMake.vue | 144 +++
src/views/satellitetelemetry/component/SatelliteManage.vue | 44
src/components/search/OptionPrimaryProduct.vue | 67 +
src/views/satellitetelemetry/component/SatelliteImport.vue | 265 ++++--
src/utils/map/index_old.js | 2
src/api/index.js | 2
src/views/satellitetelemetry/component/GridStyleTool.vue | 113 ++
src/views/dataproduct/component/ProductMake.vue | 10
src/components/search/OptionGridGroup.vue | 4
src/utils/map/line.js | 67
src/styles/base.scss | 2
src/views/satellitetelemetry/component/AODImport.vue | 267 ++++--
src/components/grid/GridTool.vue | 91 ++
src/stores/grid-info.js | 6
src/views/satellitetelemetry/component/SatelliteSearchBar.vue | 46
23 files changed, 1,446 insertions(+), 784 deletions(-)
diff --git a/src/api/gridApi.js b/src/api/gridApi.js
index 2e9469f..8abfe14 100644
--- a/src/api/gridApi.js
+++ b/src/api/gridApi.js
@@ -5,10 +5,11 @@
* 鍗槦閬ユ祴缃戞牸鐩稿叧鎺ュ彛API
*/
export default {
- fetchGridGroup(area, page, perPage) {
+ fetchGridGroup(area, type, page, perPage) {
return $http
.post(`air/satellite/grid/group`, area, {
params: {
+ type,
page: page,
per_page: perPage
}
@@ -141,5 +142,11 @@
return $http
.post(`air/satellite/grid/data/mix`, dataIdList)
.then((res) => res.data);
+ },
+
+ buildUnderwayProduct(missionCode, groupId) {
+ return $http.get(`air/satellite/import/grid/aod/download/template`, {
+ responseType: 'blob'
+ });
}
};
diff --git a/src/api/index.js b/src/api/index.js
index fd8d2c9..b7a1bfb 100644
--- a/src/api/index.js
+++ b/src/api/index.js
@@ -1,7 +1,7 @@
import axios from 'axios';
import { ElMessage } from 'element-plus';
-const debug = false;
+const debug = true;
let ip1 = 'http://47.100.191.150:9029/';
// console.log(import.meta.env);
diff --git a/src/components.d.ts b/src/components.d.ts
index 86cdcb5..b4d838c 100644
--- a/src/components.d.ts
+++ b/src/components.d.ts
@@ -28,6 +28,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']
@@ -37,10 +38,16 @@
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']
ElTabPane: typeof import('element-plus/es')['ElTabPane']
@@ -68,6 +75,7 @@
OptionLocation: typeof import('./components/search/OptionLocation.vue')['default']
OptionLocation2: typeof import('./components/search/OptionLocation2.vue')['default']
OptionMission: typeof import('./components/search/OptionMission.vue')['default']
+ OptionPrimaryProduct: typeof import('./components/search/OptionPrimaryProduct.vue')['default']
OptionTime: typeof import('./components/search/OptionTime.vue')['default']
OptionType: typeof import('./components/search/OptionType.vue')['default']
ProgressLineChart: typeof import('./components/chart/ProgressLineChart.vue')['default']
diff --git a/src/components/grid/GridTool.vue b/src/components/grid/GridTool.vue
index e69de29..a0f98fd 100644
--- a/src/components/grid/GridTool.vue
+++ b/src/components/grid/GridTool.vue
@@ -0,0 +1,91 @@
+<template>
+ <el-row class="wrap">
+ <el-col span="2">
+ <el-row>
+ <CardButton
+ name="缃戞牸鏍峰紡"
+ direction="left"
+ @click="() => (show = !show)"
+ ></CardButton>
+ </el-row>
+ </el-col>
+ <el-col span="2">
+ <BaseCard v-show="show" direction="right" borderless="r">
+ <template #content>
+ <div class="content-wrap">
+ <div v-for="(g, i) in gridStore.gridClzList" :key="i">
+ <div>
+ <el-text>g.name</el-text>
+ </div>
+ <el-row>
+ <el-text>缃戞牸</el-text>
+ <el-switch
+ v-model="gridVisible"
+ width="60"
+ inline-prompt
+ active-text="鏄剧ず"
+ inactive-text="闅愯棌"
+ />
+ </el-row>
+ </div>
+ </div>
+ </template>
+ </BaseCard>
+ </el-col>
+ </el-row>
+</template>
+<script setup>
+/**
+ * 缃戞牸鏍峰紡鎺у埗宸ュ叿
+ */
+import { ref } from 'vue';
+import { useGridStore } from '@/stores/grid-info';
+
+const gridStore = useGridStore();
+
+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 emits = defineEmits([
+ 'showRank',
+ 'showData',
+ 'changeColor',
+ 'changeOpacity'
+]);
+
+function handleRankClick() {
+ rankVisible.value = !rankVisible.value;
+ emits('showRank', rankVisible.value);
+}
+
+function handleDataClick() {
+ dataVisible.value = !dataVisible.value;
+ emits('showData', dataVisible.value);
+}
+
+function handleColorClick() {
+ isStandardColor.value = !isStandardColor.value;
+ emits('changeColor', isStandardColor.value);
+}
+
+function handleOpacityClick() {
+ // isOpacity.value = !isOpacity.value;
+ // emits('changeOpacity', isOpacity.value);
+}
+
+function handleOpacityChange(value) {
+ emits('changeOpacity', value);
+}
+</script>
+<style scoped>
+.content-wrap {
+ min-width: 300px;
+ min-height: 600px;
+}
+</style>
diff --git a/src/components/search/OptionGridGroup.vue b/src/components/search/OptionGridGroup.vue
index 4fde967..0fa404f 100644
--- a/src/components/search/OptionGridGroup.vue
+++ b/src/components/search/OptionGridGroup.vue
@@ -32,9 +32,9 @@
const gridGroupList = ref([]);
const index = ref(null);
-function fetchGridGroup(area) {
+function fetchGridGroup(area, type) {
return fetchData((page, pageSize) => {
- return gridApi.fetchGridGroup(area, page, pageSize).then((res) => {
+ return gridApi.fetchGridGroup(area, type, page, pageSize).then((res) => {
gridGroupList.value = res.data;
if (res.data.length > 0) {
index.value = 0;
diff --git a/src/components/search/OptionPrimaryProduct.vue b/src/components/search/OptionPrimaryProduct.vue
new file mode 100644
index 0000000..eb9051f
--- /dev/null
+++ b/src/components/search/OptionPrimaryProduct.vue
@@ -0,0 +1,67 @@
+<template>
+ <el-form-item label="鍒濈骇浜у搧">
+ <el-select
+ :loading="loading"
+ v-model="index"
+ @change="handleChange"
+ placeholder="閫夋嫨AOD鏁版嵁"
+ size="small"
+ class="w-150"
+ >
+ <el-option
+ v-for="(s, i) in allGridDataList"
+ :key="i"
+ :label="timeFormatter(s.dataTime)"
+ :value="i"
+ />
+ </el-select>
+ </el-form-item>
+</template>
+<script setup>
+import { ref, onMounted } from 'vue';
+import moment from 'moment';
+import gridApi from '@/api/gridApi';
+import { useFetchData } from '@/composables/fetchData';
+
+defineProps({
+ modelValue: Object
+});
+
+const emits = defineEmits(['update:modelValue']);
+
+const { loading, fetchData } = useFetchData();
+const allGridDataList = ref([]);
+const index = ref(null);
+
+function fetchAOD(groupId, dataTime) {
+ return fetchData(() => {
+ return gridApi.fetchGridData(groupId).then((res) => {
+ allGridDataList.value = res.data;
+ if (res.data.length > 0) {
+ index.value = 0;
+ handleChange(0);
+ } else {
+ index.value = null;
+ handleChange(null);
+ }
+ });
+ });
+}
+
+function timeFormatter(value) {
+ return moment(value).format('YYYY-MM-DD');
+}
+
+function handleChange(value) {
+ emits(
+ 'update:modelValue',
+ value != null ? allGridDataList.value[value] : null
+ );
+}
+
+// onMounted(() => {
+// fetchAOD();
+// });
+
+defineExpose({ fetchAOD });
+</script>
diff --git a/src/stores/grid-info.js b/src/stores/grid-info.js
index c193329..3b673d6 100644
--- a/src/stores/grid-info.js
+++ b/src/stores/grid-info.js
@@ -1,11 +1,13 @@
import { ref } from 'vue';
import { defineStore } from 'pinia';
-// 璧拌埅璁惧
export const useGridStore = defineStore('grid', () => {
+ // 缃戞牸鎺у埗绫婚泦鍚�
+ const gridClzList = ref([]);
+
const selectedSatelliteProxy = undefined;
const selectedGridCellAndDataDetail = ref(undefined);
- return { selectedSatelliteProxy, selectedGridCellAndDataDetail };
+ return { gridClzList, selectedSatelliteProxy, selectedGridCellAndDataDetail };
});
diff --git a/src/styles/base.scss b/src/styles/base.scss
index 8e29e01..bf66424 100644
--- a/src/styles/base.scss
+++ b/src/styles/base.scss
@@ -71,7 +71,7 @@
default: var(--el-component-size-default),
large: var(--el-component-size-large)
);
-$ws: (20, 40, 50, 60, 80, 100, 120, 150, 300);
+$ws: (20, 40, 50, 60, 80, 100, 120, 150, 200, 250, 300);
@each $name, $value in $csize {
.w-#{$name} {
width: #{$value};
diff --git a/src/utils/map/grid.js b/src/utils/map/grid.js
index 49b87d9..cbd6e1c 100644
--- a/src/utils/map/grid.js
+++ b/src/utils/map/grid.js
@@ -84,15 +84,17 @@
* 鏂囨湰鏍囪
* 鍙慨鏀筽osition
*/
-function textMaker(position, text, anchor, type) {
+function textMaker({ position, text, anchor, type, color }) {
let style = {};
if (type == 'data') {
style = {
'font-size': '12px',
'text-align': 'center',
- color: 'white',
+ 'font-weight': 600,
+ color: color ? color : 'white',
background: '#122b54a9',
- 'text-shadow': 'black 2px 2px 2px',
+ // background: 'white',
+ 'text-shadow': 'black 1px 1px 1px',
border: '0px',
'margin-top': '4px'
};
@@ -100,11 +102,12 @@
style = {
'font-size': '14px',
'text-align': 'center',
- color: 'white',
+ color: color ? color : 'white',
background: 'transparent',
'text-shadow': 'black 2px 2px 2px',
'border-radius': '2px',
border: '1px solid #122b54a9',
+ // border: '1px solid rgba(255, 255, 255, 0.62)',
'margin-bottom': '4px'
};
}
@@ -152,6 +155,60 @@
}
}
});
+}
+
+/**
+ * 璁＄畻姣忎釜缃戞牸棰滆壊
+ */
+function calGridColor({ factorName, data, isCustomColor }) {
+ let _colorList = [];
+ if (isCustomColor) {
+ var max, min;
+ data.forEach((t) => {
+ if (!t) return;
+ if (!max || t > max) {
+ max = t;
+ }
+ if (!min || t < min) {
+ min = t;
+ }
+ });
+ data.forEach((d) => {
+ if (d) {
+ // 鏍规嵁閬ユ祴鏁版嵁璁＄畻缃戞牸棰滆壊
+ const { color, nextColor, range, nextRange } =
+ Legend.getCustomColorAndNext(d, min, max);
+ const ratio = (d - range) / (nextRange - range);
+
+ const _color = getColorBetweenTwoColors(
+ color.map((v) => v * 255),
+ nextColor.map((v) => v * 255),
+ ratio
+ );
+ _colorList.push(_color);
+ } else {
+ _colorList.push(undefined);
+ }
+ });
+ } else {
+ data.forEach((d) => {
+ if (d) {
+ // 鏍规嵁閬ユ祴鏁版嵁璁＄畻缃戞牸棰滆壊
+ const { color, nextColor, range, nextRange } =
+ Legend.getStandardColorAndNext(factorName, d);
+ const ratio = (d - range) / (nextRange - range);
+ const _color = getColorBetweenTwoColors(
+ color.map((v) => v * 255),
+ nextColor.map((v) => v * 255),
+ ratio
+ );
+ _colorList.push(_color);
+ } else {
+ _colorList.push(undefined);
+ }
+ });
+ }
+ return _colorList;
}
export default {
@@ -222,28 +279,27 @@
return gridViews;
},
- drawGridText(points, textViews, anchor, type) {
- // if (textViews) {
- // points.forEach((p, i) => {
- // textViews[i].setPosition(p.lnglat_GD);
- // textViews[i].setText(p.data);
- // });
- // return textViews;
- // } else {
- // const _textViews = [];
- // points.forEach((p) => {
- // const m = textMaker(p.lnglat_GD, p.data, anchor, type);
- // _textViews.push(m);
- // });
- // map.add(_textViews);
- // return { textViews: _textViews };
- // }
+ drawGridText({ points, textViews, anchor, type, isCustomColor, useColor }) {
+ let colorList = [];
+ if (useColor) {
+ colorList = calGridColor({
+ factorName: 'PM25',
+ data: points.map((p) => p.data),
+ isCustomColor: isCustomColor
+ });
+ }
if (textViews) {
map.remove(textViews);
}
const _textViews = [];
- points.forEach((p) => {
- const m = textMaker(p.lnglat_GD, p.data, anchor, type);
+ points.forEach((p, i) => {
+ const m = textMaker({
+ position: p.lnglat_GD,
+ text: p.data,
+ anchor,
+ type,
+ color: useColor ? colorList[i] : 'white'
+ });
_textViews.push(m);
});
// map.add(_textViews);
@@ -320,21 +376,6 @@
});
return res;
- // gridViews.forEach((g, i) => {
- // const data = parseFloat(gridDataDetail[i]);
- // const { color, nextColor, range, nextRange } =
- // Legend.getStandardColorAndNext(factorName, data);
- // const ratio = (data - range) / (nextRange - range);
- // const _color = getColorBetweenTwoColors(
- // color.map((v) => v * 255),
- // nextColor.map((v) => v * 255),
- // ratio
- // );
- // g.setOptions({
- // fillColor: _color,
- // fillOpacity: color[3] == 0 ? 0 : 0.7
- // });
- // });
},
drawGridColorCustom(gridViews, gridDataDetail, opacity) {
@@ -375,21 +416,5 @@
});
return res;
- // gridViews.forEach((g, i) => {
- // const data = parseFloat(gridDataDetail[i]);
- // const { color, nextColor, range, nextRange } =
- // Legend.getCustomColorAndNext(data, min, max);
- // const ratio = (data - range) / (nextRange - range);
-
- // const _color = getColorBetweenTwoColors(
- // color.map((v) => v * 255),
- // nextColor.map((v) => v * 255),
- // ratio
- // );
- // g.setOptions({
- // fillColor: _color,
- // fillOpacity: color[3] == 0 ? 0 : 0.7
- // });
- // });
}
};
diff --git a/src/utils/map/index_old.js b/src/utils/map/index_old.js
index 8085547..68503cb 100644
--- a/src/utils/map/index_old.js
+++ b/src/utils/map/index_old.js
@@ -74,7 +74,7 @@
position: {
right: '10px',
// top: '260px',
- bottom: '0px'
+ bottom: '-190px'
}
});
map.addControl(controlbar);
diff --git a/src/utils/map/line.js b/src/utils/map/line.js
index 57869ac..39dbccc 100644
--- a/src/utils/map/line.js
+++ b/src/utils/map/line.js
@@ -2,7 +2,8 @@
import calculate from './calculate';
import { getHexColor } from '../color';
-var _polylineArr = [];
+// var _polylineArr = [];
+const lineMap = new Map();
function newPolyline(path, color) {
// eslint-disable-next-line no-undef
@@ -21,10 +22,11 @@
export default {
drawLine(fDatas, factor) {
+ const _polylineArr = [];
const lnglats_GD = fDatas.lnglats_GD;
const colors = factor.colors;
- this.hideLine();
+ // this.hideLine();
var path = calculate.parse2LngLat(lnglats_GD);
@@ -38,40 +40,31 @@
const lastC = colors[i - 1];
if (distance > 500 || c != lastC) {
let _path, _color;
+ _path = path.slice(sIndex, i);
+ _color = getHexColor(
+ lastC.map((v, index) => {
+ if (index < lastC.length - 1) {
+ return v * 255;
+ } else {
+ return v;
+ }
+ })
+ );
// 褰撲袱鐐硅窛绂昏秴杩�500鏃讹紝璁や负涓ょ偣涓嶈繛缁紝涓嶇粯鍒惰繛绾�
if (distance > 500) {
- _path = path.slice(sIndex, i);
- _color = getHexColor(
- lastC.map((v, index) => {
- if (index < lastC.length - 1) {
- return v * 255;
- } else {
- return v;
- }
- })
- );
+ sIndex = i;
} else {
- _path = path.slice(sIndex, i + 1);
- _color = getHexColor(
- c.map((v, index) => {
- if (index < c.length - 1) {
- return v * 255;
- } else {
- return v;
- }
- })
- );
+ sIndex = i - 1;
}
// 鍒涘缓鎶樼嚎瀹炰緥
const polyline = newPolyline(_path, _color);
_polylineArr.push(polyline);
-
- sIndex = i;
}
}
- if (sIndex == 0) {
- const c = colors[sIndex];
+ if (sIndex < path.length - 1) {
+ const c = colors[path.length - 1];
+ const _path = path.slice(sIndex, path.length);
const _color = getHexColor(
c.map((v, index) => {
if (index < c.length - 1) {
@@ -81,7 +74,7 @@
}
})
);
- const polyline = newPolyline(path, _color);
+ const polyline = newPolyline(_path, _color);
_polylineArr.push(polyline);
}
// 灏嗘姌绾挎坊鍔犺嚦鍦板浘瀹炰緥
@@ -89,10 +82,24 @@
return _polylineArr;
},
- hideLine() {
- if (_polylineArr) {
+ drawTagLine(tag, fDatas, factor) {
+ if (lineMap.has(tag)) {
+ const _polylineArr = lineMap.get(tag);
+ map.add(_polylineArr);
+ } else {
+ const _polylineArr = this.drawLine(fDatas, factor);
+ lineMap.set(tag, _polylineArr);
+ }
+ },
+
+ hideLine(tag) {
+ if (tag && lineMap.has(tag)) {
+ const _polylineArr = lineMap.get(tag);
map.remove(_polylineArr);
- _polylineArr = [];
+ } else {
+ lineMap.forEach((v) => {
+ map.remove(v);
+ });
}
}
};
diff --git a/src/views/HomePage.vue b/src/views/HomePage.vue
index ebe6bfb..e10cc2f 100644
--- a/src/views/HomePage.vue
+++ b/src/views/HomePage.vue
@@ -11,37 +11,22 @@
<MapScene></MapScene>
<SceneSearch></SceneSearch>
<GridSearch></GridSearch>
- <!-- <el-button
- @click="satelliteImportVisible = !satelliteImportVisible"
- type="primary"
- class="el-button-custom satellite-right-top p-events-auto"
- >鐩戞祴鏁版嵁瀵煎叆</el-button
- >
- <el-button
- @click="aodImportVisible = !aodImportVisible"
- type="primary"
- class="el-button-custom aod-right-top p-events-auto"
- >AOD鏁版嵁瀵煎叆</el-button
- > -->
- <PollutionTrace class="aod-right-top"></PollutionTrace>
- <ProductManage class="satellite-right-top"></ProductManage>
+ <PollutionTrace class="satellite-right-top"></PollutionTrace>
</el-row>
+ <el-space>
+ <ProductManage></ProductManage>
+ <SatelliteMixTool :group-id="3"></SatelliteMixTool>
+ </el-space>
<!-- <CoreMenu></CoreMenu> -->
<router-view></router-view>
</div>
- <!-- <SatelliteImport v-model="satelliteImportVisible"></SatelliteImport>
- <AODImport v-model="aodImportVisible"></AODImport> -->
</template>
<script setup>
-// import SatelliteTelemetry from '@/views/satellitetelemetry/SatelliteTelemetry.vue';
import { ref } from 'vue';
-import SatelliteImport from './satellitetelemetry/component/SatelliteImport.vue';
-import AODImport from './satellitetelemetry/component/AODImport.vue';
import ProductManage from './dataproduct/ProductManage.vue';
import PollutionTrace from './satellitetelemetry/PollutionTrace.vue';
-const satelliteImportVisible = ref(false);
-const aodImportVisible = ref(false);
+import SatelliteMixTool from './satellitetelemetry/component/SatelliteMixTool.vue';
</script>
<style scoped>
diff --git a/src/views/dataproduct/ProductManage.vue b/src/views/dataproduct/ProductManage.vue
index e91ffff..85872e2 100644
--- a/src/views/dataproduct/ProductManage.vue
+++ b/src/views/dataproduct/ProductManage.vue
@@ -18,29 +18,28 @@
<el-tab-pane label="鍒濈骇浜у搧鍒朵綔" name="first">
<ProductMake></ProductMake>
</el-tab-pane>
+ <el-tab-pane label="璧拌埅铻嶅悎浜у搧鍒朵綔" name="fourth">
+ <ProductSecondaryMake></ProductSecondaryMake>
+ </el-tab-pane>
<el-tab-pane label="AOD鏁版嵁瀵煎叆" name="second">
<AODImport></AODImport>
</el-tab-pane>
<el-tab-pane label="鍒濈骇浜у搧瀵煎叆" name="third">
<SatelliteImport></SatelliteImport>
</el-tab-pane>
- <el-tab-pane label="浜岀骇浜у搧鍒朵綔" name="fourth">
-
- </el-tab-pane>
</el-tabs>
</CardDialog>
</div>
</template>
<script setup>
-import SatelliteImport from "@/views/satellitetelemetry/component/SatelliteImport.vue";
-import AODImport from "@/views/satellitetelemetry/component/AODImport.vue";
-import ProductMake from "@/views/dataproduct/component/ProductMake.vue";
+import SatelliteImport from '@/views/satellitetelemetry/component/SatelliteImport.vue';
+import AODImport from '@/views/satellitetelemetry/component/AODImport.vue';
+import ProductMake from '@/views/dataproduct/component/ProductMake.vue';
+import ProductSecondaryMake from '@/views/dataproduct/component/ProductSecondaryMake.vue';
import { ref, onMounted } from 'vue';
const dialogVisible = ref(false);
const activeName = ref('first');
-
-
// AOD鏁版嵁鎷熷悎锛岀敓鎴愬垵绾ф暟鎹骇鍝�
// 1. 鍙嚜鍔ㄩ�氳繃鍏紡鎷熷悎涓篜M2.5鏁版嵁锛岀敤鎴峰彲淇敼鐩稿叧鍙傛暟锛�
@@ -55,6 +54,6 @@
color: white;
}
::v-deep .is-active {
- color: #23dad0a2;
+ color: #f0ff1d;
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/dataproduct/component/ProductMake.vue b/src/views/dataproduct/component/ProductMake.vue
index b39afa0..b363558 100644
--- a/src/views/dataproduct/component/ProductMake.vue
+++ b/src/views/dataproduct/component/ProductMake.vue
@@ -69,7 +69,7 @@
</el-form>
</template>
<script setup>
-import { ref, watch } from 'vue';
+import { ref, watch, onUnmounted } from 'vue';
import gridApi from '@/api/gridApi';
import aodApi from '@/api/aodApi';
import moment from 'moment';
@@ -196,4 +196,12 @@
checkHistoryGridData();
}
});
+
+onUnmounted(() => {
+ satelliteProxy.changeVisibility({
+ showGridViews: false,
+ showDataTxt: false,
+ showRankTxt: false
+ });
+});
</script>
diff --git a/src/views/dataproduct/component/ProductSecondaryMake.vue b/src/views/dataproduct/component/ProductSecondaryMake.vue
new file mode 100644
index 0000000..bee49de
--- /dev/null
+++ b/src/views/dataproduct/component/ProductSecondaryMake.vue
@@ -0,0 +1,144 @@
+<template>
+ <el-form
+ :inline="true"
+ :model="formObj"
+ :rules="rules"
+ ref="formRef"
+ label-position="right"
+ label-width="80px"
+ >
+ <!-- <div>閫夋嫨鍒濈骇浜у搧</div> -->
+ <SatelliteSearchBar
+ v-show="false"
+ ref="searchBarRef"
+ label-width="80px"
+ :loading="loading"
+ @search="onSearchAOD"
+ ></SatelliteSearchBar>
+ <!-- <OptionPrimaryProduct
+ ref="optionAODRef"
+ v-model="aodData"
+ ></OptionPrimaryProduct> -->
+ <div>閫夋嫨璧拌埅浠诲姟</div>
+ <OptionMission v-model="mission"></OptionMission>
+ <div>閫夋嫨缃戞牸</div>
+ <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
+ <el-form-item label="浜у搧璁板綍">
+ <el-text :type="fusionData ? 'warning' : 'success'">{{
+ fusionData ? '宸茬敓鎴�' : '鏈敓鎴�'
+ }}</el-text>
+ </el-form-item>
+ <div></div>
+ <el-form-item>
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleShowHistoryClick"
+ >
+ {{ '鏄剧ず鍘嗗彶铻嶅悎璁板綍' }}
+ </el-button>
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handlePreviewClick"
+ >
+ {{ '鎷熷悎鏁版嵁' }}
+ </el-button>
+ <!-- <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleSaveClick"
+ >
+ {{ '淇濆瓨鎷熷悎缁撴灉' }}
+ </el-button> -->
+ </el-form-item>
+ </el-form>
+</template>
+<script setup>
+import { ref, watch, onUnmounted } from 'vue';
+import moment from 'moment';
+import gridApi from '@/api/gridApi';
+import { SatelliteProxy } from '@/views/satellitetelemetry/SatelliteProxy';
+import SatelliteSearchBar from '@/views/satellitetelemetry/component/SatelliteSearchBar.vue';
+
+const satelliteProxy = new SatelliteProxy();
+
+const searchBarRef = ref(null);
+const optionAODRef = ref(null);
+const gridGroupRef = ref(null);
+
+const gridGroup = ref(null);
+
+const mission = ref(undefined);
+const fusionData = ref(undefined);
+
+const gridDataDetailMap = new Map();
+
+function onSearchAOD(options) {
+ // gridGroup.value = options;
+ // gridApi.fetchGridCell(options.id).then((res) => {
+ // satelliteProxy.gridPrepare(res.data);
+ // });
+ // optionAODRef.value.fetchAOD(options.id);
+
+ gridGroupRef.value.fetchGridGroup(searchBarRef.value.area, 'sub');
+}
+
+// 妫�鏌ヨ蛋鑸暟鎹槸鍚﹀拰100绫崇綉鏍煎凡铻嶅悎
+function checkUnderwayFusionResult() {
+ const time = moment(mission.value.startTime).format('YYYY-MM-DD HH:mm:ss');
+ gridApi.fetchGridData(gridGroup.value.id, time, 3).then((res) => {
+ if (res.data.length > 0) {
+ fusionData.value = res.data[0];
+ } else {
+ fusionData.value = undefined;
+ }
+ });
+}
+
+watch(mission, (nV, oV) => {
+ if (nV != oV && gridGroup.value) {
+ checkUnderwayFusionResult();
+ // search(nV);
+ }
+});
+
+watch(gridGroup, (nV, oV) => {
+ if (nV != oV) {
+ gridApi.fetchGridCell(gridGroup.value.id).then((res) => {
+ // gridCellList.value = res.data;
+ // prepareGrid(gridCellList.value);
+ satelliteProxy.gridPrepare(res.data);
+ });
+ checkUnderwayFusionResult();
+ }
+});
+
+let selectedGridDataDetail;
+function handleShowHistoryClick() {
+ // resetButton();
+ const d = fusionData.value;
+ if (gridDataDetailMap.has(d.id)) {
+ selectedGridDataDetail = gridDataDetailMap.get(d.id);
+ // selectedGridData = gridData;
+ satelliteProxy.changeVisibility({ tag: d.id, showGridViews: true });
+ } else {
+ gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => {
+ gridDataDetailMap.set(d.id, res.data);
+ selectedGridDataDetail = res.data;
+ // selectedGridData = gridData;
+ satelliteProxy.drawTagGrid({
+ tag: d.id,
+ gridDataDetail: selectedGridDataDetail,
+ opacity: 1,
+ zIndex: 11
+ });
+ });
+ }
+}
+
+function handlePreviewClick() {}
+</script>
diff --git a/src/views/satellitetelemetry/SatelliteProxy.js b/src/views/satellitetelemetry/SatelliteProxy.js
index 8e652e0..7de249c 100644
--- a/src/views/satellitetelemetry/SatelliteProxy.js
+++ b/src/views/satellitetelemetry/SatelliteProxy.js
@@ -1,10 +1,19 @@
import calculate from '@/utils/map/calculate';
import gridMapUtil from '@/utils/map/grid';
import { map, onMapMounted } from '@/utils/map/index_old';
+import { useCloned } from '@vueuse/core';
export class SatelliteProxy {
+ constructor(name) {
+ this.name = name;
+ }
+
// 鍦板浘缃戞牸鐩稿叧瀵硅薄
mapViews;
+
+ mapViewsList = [];
+
+ mapViewsMap = new Map();
districtPolygon;
@@ -72,8 +81,11 @@
}
}
+ firstEvent;
+
// 缁樺埗缃戞牸绾�
drawPolyline(gridInfo, event) {
+ this.firstEvent = event;
// 缁樺埗缃戞牸
const points = gridInfo.map((v) => {
return calculate.wgs84_To_Gcj02(v.longitude, v.latitude);
@@ -108,7 +120,7 @@
}
// 缁樺埗鐩戞祴鏁版嵁鍊�
- drawDataText(points, gridDataDetail, textViews, labelsLayer) {
+ drawDataText(points, gridDataDetail, textViews, isCustomColor, useColor) {
const data = gridDataDetail.map((v, i) => {
return {
lnglat_GD: points[i],
@@ -117,7 +129,14 @@
};
});
// return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'bottom');
- return gridMapUtil.drawGridText(data, textViews, 'top-center', 'data');
+ return gridMapUtil.drawGridText({
+ points: data,
+ textViews,
+ anchor: 'top-center',
+ type: 'data',
+ isCustomColor,
+ useColor
+ });
}
// 缁樺埗鐩戞祴鏁版嵁鎺掑悕鏂囨湰
@@ -130,7 +149,12 @@
};
});
// return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'top');
- return gridMapUtil.drawGridText(data, textViews, 'bottom-center', 'rank');
+ return gridMapUtil.drawGridText({
+ points: data,
+ textViews,
+ anchor: 'bottom-center',
+ type: 'rank'
+ });
}
// 缁樺埗鐩戞祴鏁版嵁鍊煎搴旂綉鏍奸鑹�
@@ -182,7 +206,7 @@
map.remove(lastGridViews);
}
map.add(resGridViews);
- map.setFitView(resGridViews);
+ // map.setFitView(resGridViews);
return { resGridViews, pointsRes };
}
@@ -201,73 +225,228 @@
opacity,
zIndex,
showDataTxt,
- showRankTxt
+ showRankTxt,
+ useDataTxtColor,
+ mapViews
}) {
+ const _mapViews = mapViews ? mapViews : this.mapViews;
// SatelliteProxy.clearText(mapViews);
const { resGridViews, pointsRes } = this.drawColor({
- gridViews: this.mapViews.gridViews,
- points: this.mapViews.points,
+ gridViews: _mapViews.gridViews,
+ points: _mapViews.points,
gridDataDetail: gridDataDetail,
- lastGridViews: this.mapViews.lastGridViews,
+ lastGridViews: _mapViews.lastGridViews,
customColor: useCustomColor,
opacity: opacity,
zIndex: zIndex
});
- this.mapViews.lastGridViews = resGridViews;
- this.mapViews.lastPoints = pointsRes;
+ _mapViews.lastGridViews = resGridViews;
+ _mapViews.lastPoints = pointsRes;
// 鏁版嵁鏍囪
const { textViews: dataTxt, labelsLayer: dataLayer } = this.drawDataText(
- this.mapViews.lastPoints,
+ _mapViews.lastPoints,
gridDataDetail,
- this.mapViews.dataTxt,
- this.mapViews.dataLayer
+ _mapViews.dataTxt,
+ useCustomColor,
+ useDataTxtColor
);
- this.mapViews.dataTxt = dataTxt;
- this.mapViews.dataLayer = dataLayer;
+ _mapViews.dataTxt = dataTxt;
+ _mapViews.dataLayer = dataLayer;
const { textViews: rankTxt, labelsLayer: rankLayer } = this.drawRankText(
- this.mapViews.lastPoints,
+ _mapViews.lastPoints,
gridDataDetail,
- this.mapViews.rankTxt,
- this.mapViews.rankLayer
+ _mapViews.rankTxt,
+ _mapViews.rankLayer
);
- this.mapViews.rankTxt = rankTxt;
- this.mapViews.rankLayer = rankLayer;
+ _mapViews.rankTxt = rankTxt;
+ _mapViews.rankLayer = rankLayer;
if (showDataTxt) {
- map.add(this.mapViews.dataTxt);
+ map.add(_mapViews.dataTxt);
}
if (showRankTxt) {
- map.add(this.mapViews.rankTxt);
+ map.add(_mapViews.rankTxt);
}
+ }
+
+ //
+ drawGrids({
+ gridDataDetailList,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt
+ }) {
+ if (this.mapViewsList.length < gridDataDetailList.length) {
+ let index = this.mapViewsList.length;
+ while (index < gridDataDetailList.length) {
+ const newMapViews = {
+ gridViews: gridMapUtil.drawPolylines({
+ points: this.mapViews.gridPoints,
+ event: this.firstEvent
+ }),
+ gridPoints: JSON.parse(JSON.stringify(this.mapViews.gridPoints)),
+ points: JSON.parse(JSON.stringify(this.mapViews.points))
+ };
+ this.mapViewsList.push(newMapViews);
+ }
+ }
+
+ this.mapViewsList.forEach((m, i) => {
+ this.drawGrid({
+ gridDataDetail: gridDataDetailList[i],
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt,
+ mapViews: m
+ });
+ });
+ }
+
+ drawNewGrid({
+ gridDataDetail,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt
+ }) {
+ const newMapViews = {
+ gridViews: gridMapUtil.drawPolylines({
+ points: this.mapViews.gridPoints,
+ event: this.firstEvent
+ }),
+ gridPoints: JSON.parse(JSON.stringify(this.mapViews.gridPoints)),
+ points: JSON.parse(JSON.stringify(this.mapViews.points))
+ };
+ this.mapViewsList.push(newMapViews);
+ this.drawGrid({
+ gridDataDetail,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt,
+ mapViews: newMapViews
+ });
+ }
+ drawTagGrid({
+ tag,
+ gridDataDetail,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt
+ }) {
+ if (!this.mapViewsMap.has(tag)) {
+ const newMapViews = {
+ gridViews: gridMapUtil.drawPolylines({
+ points: this.mapViews.gridPoints,
+ event: this.firstEvent
+ }),
+ gridPoints: JSON.parse(JSON.stringify(this.mapViews.gridPoints)),
+ points: JSON.parse(JSON.stringify(this.mapViews.points))
+ };
+ this.mapViewsMap.set(tag, newMapViews);
+ }
+ const _mapViews = this.mapViewsMap.get(tag);
+ this.drawGrid({
+ gridDataDetail,
+ useCustomColor,
+ opacity,
+ zIndex,
+ showDataTxt,
+ showRankTxt,
+ mapViews: _mapViews
+ });
}
// 璋冩暣鍚勭被鍦板浘瑕嗙洊鐗╃殑鍙鎬�
- changeVisibility({ showGridViews, showDataTxt, showRankTxt }) {
+ changeVisibility({ tag, showGridViews, showDataTxt, showRankTxt }) {
+ let _mapViewsList = [];
+ if (this.mapViews) {
+ _mapViewsList.push(this.mapViews);
+ }
+ if (tag && this.mapViewsMap.has(tag)) {
+ _mapViewsList.push(this.mapViewsMap.get(tag));
+ } else {
+ this.mapViewsMap.forEach((v) => {
+ _mapViewsList.push(v);
+ });
+ }
if (showGridViews != undefined) {
- showGridViews
- ? map.add(this.mapViews.lastGridViews)
- : map.remove(this.mapViews.lastGridViews);
+ if (showGridViews) {
+ // map.add(this.mapViews.lastGridViews);
+ _mapViewsList.forEach((v) => {
+ if (v.lastGridViews) map.add(v.lastGridViews);
+ });
+ } else {
+ // map.remove(this.mapViews.lastGridViews);
+ _mapViewsList.forEach((v) => {
+ if (v.lastGridViews) map.remove(v.lastGridViews);
+ });
+ }
}
if (showDataTxt != undefined) {
- showDataTxt
- ? map.add(this.mapViews.dataTxt)
- : map.remove(this.mapViews.dataTxt);
+ if (showDataTxt) {
+ // map.add(this.mapViews.dataTxt);
+ _mapViewsList.forEach((v) => {
+ if (v.dataTxt) map.add(v.dataTxt);
+ });
+ } else {
+ // map.remove(this.mapViews.dataTxt);
+ _mapViewsList.forEach((v) => {
+ if (v.dataTxt) map.remove(v.dataTxt);
+ });
+ }
}
if (showRankTxt != undefined) {
- showRankTxt
- ? map.add(this.mapViews.rankTxt)
- : map.remove(this.mapViews.rankTxt);
+ if (showRankTxt) {
+ // map.add(this.mapViews.rankTxt);
+ _mapViewsList.forEach((v) => {
+ if (v.rankTxt) map.add(v.rankTxt);
+ });
+ } else {
+ // map.remove(this.mapViews.rankTxt);
+ _mapViewsList.forEach((v) => {
+ if (v.rankTxt) map.remove(v.rankTxt);
+ });
+ }
}
}
- changeGridOpacity({ isOpacity, opacityValue }) {
- this.mapViews.lastGridViews.forEach((e) => {
- e.setOptions({
- fillOpacity: opacityValue ? opacityValue : isOpacity ? 0.1 : 0.7
+ changeGridOpacity({ tag, isOpacity, opacityValue }) {
+ let _mapViewsList = [];
+ if (this.mapViews) {
+ _mapViewsList.push(this.mapViews);
+ }
+ if (tag && this.mapViewsMap.has(tag)) {
+ _mapViewsList.push(this.mapViewsMap.get(tag));
+ } else {
+ this.mapViewsMap.forEach((v) => {
+ _mapViewsList.push(v);
});
+ }
+ _mapViewsList.forEach((v) => {
+ if (v.lastGridViews) {
+ v.lastGridViews.forEach((e) => {
+ e.setOptions({
+ fillOpacity:
+ typeof opacityValue === 'number'
+ ? opacityValue
+ : isOpacity
+ ? 0.1
+ : 0.7
+ });
+ });
+ }
});
}
@@ -304,272 +483,3 @@
}
}
}
-
-// // 鍦板浘缃戞牸鐩稿叧瀵硅薄
-// let mapViews;
-
-// let districtPolygon;
-// // 缁樺埗鍖哄幙杈圭晫
-// function drawDistrict(districtName, isNew) {
-// onMapMounted(() => {
-// if (districtPolygon && !isNew) {
-// map.remove(districtPolygon);
-// map.add(districtPolygon);
-// } else {
-// // eslint-disable-next-line no-undef
-// var district = new AMap.DistrictSearch({
-// extensions: 'all', //杩斿洖琛屾斂鍖鸿竟鐣屽潗鏍囩瓑鍏蜂綋淇℃伅
-// level: 'district' //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖�
-// });
-// district.search(districtName, function (status, result) {
-// var bounds = result.districtList[0].boundaries; //鑾峰彇鏈濋槼鍖虹殑杈圭晫淇℃伅
-// if (bounds) {
-// for (var i = 0; i < bounds.length; i++) {
-// //鐢熸垚琛屾斂鍖哄垝 polygon
-// // eslint-disable-next-line no-undef
-// districtPolygon = new AMap.Polygon({
-// map: map, //鏄剧ず璇ヨ鐩栫墿鐨勫湴鍥惧璞�
-// strokeWeight: 2, //杞粨绾垮搴�
-// path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁�
-// fillOpacity: 0, //澶氳竟褰㈠～鍏呴�忔槑搴�
-// fillColor: '#CCF3FF', //澶氳竟褰㈠～鍏呴鑹�
-// // strokeColor: '#ffffff' //绾挎潯棰滆壊
-// strokeColor: '#0552f7', //绾挎潯棰滆壊
-// zIndex: 9
-// });
-// }
-// map.setFitView(); //灏嗚鐩栫墿璋冩暣鍒板悎閫傝閲�
-// }
-// });
-// }
-// });
-// }
-
-// function clearAll(mapViews) {
-// if (mapViews) {
-// if (typeof mapViews.gridViews === 'object') {
-// map.remove(mapViews.gridViews);
-// }
-// }
-// clearText(mapViews);
-// }
-
-// function clearText(mapViews) {
-// if (mapViews) {
-// if (typeof mapViews.dataTxt === 'object') {
-// map.remove(mapViews.dataTxt);
-// }
-// if (typeof mapViews.dataLayer === 'object') {
-// map.remove(mapViews.dataLayer);
-// }
-// if (typeof mapViews.rankTxt === 'object') {
-// map.remove(mapViews.rankTxt);
-// }
-// if (typeof mapViews.rankLayer === 'object') {
-// map.remove(mapViews.rankLayer);
-// }
-// }
-// }
-
-// // 缁樺埗缃戞牸绾�
-// function drawPolyline(gridInfo, event) {
-// // 缁樺埗缃戞牸
-// const points = gridInfo.map((v) => {
-// return calculate.wgs84_To_Gcj02(v.longitude, v.latitude);
-// // return [v.longitude, v.latitude];
-// });
-// // const gridPoints = gridMapUtil.parseGridPoint(points);
-// // console.log('gridPoints:', gridPoints);
-
-// const gridPoints = gridInfo.map((v, i) => {
-// return {
-// path: [
-// calculate.wgs84_To_Gcj02(v.point1Lon, v.point1Lat),
-// calculate.wgs84_To_Gcj02(v.point2Lon, v.point2Lat),
-// calculate.wgs84_To_Gcj02(v.point3Lon, v.point3Lat),
-// calculate.wgs84_To_Gcj02(v.point4Lon, v.point4Lat)
-// // [v.point1Lon, v.point1Lat],
-// // [v.point2Lon, v.point2Lat],
-// // [v.point3Lon, v.point3Lat],
-// // [v.point4Lon, v.point4Lat]
-// ]
-// // eslint-disable-next-line no-undef
-// .map((d) => new AMap.LngLat(d[0], d[1])),
-// extData: points[i]
-// };
-// });
-// const gridViews = gridMapUtil.drawPolylines({ points: gridPoints, event });
-// return { gridViews, gridPoints, points };
-// }
-
-// // 缁樺埗鐩戞祴鏁版嵁鍊�
-// function drawDataText(points, gridDataDetail, textViews, labelsLayer) {
-// const data = gridDataDetail.map((v, i) => {
-// return {
-// lnglat_GD: points[i],
-// // data: v.pm25 ? (v.pm25 + '渭g/m鲁') : ''
-// data: v.pm25 ? v.pm25 : ''
-// };
-// });
-// // return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'bottom');
-// return gridMapUtil.drawGridText(data, textViews, 'top-center', 'data');
-// }
-
-// // 缁樺埗鐩戞祴鏁版嵁鎺掑悕鏂囨湰
-// function drawRankText(points, gridDataDetail, textViews, labelsLayer) {
-// const data = gridDataDetail.map((v, i) => {
-// return {
-// lnglat_GD: points[i],
-// // data: v.pm25 ? ('鎺掑悕: ' + v.rank) : ''
-// data: v.pm25 ? v.rank : ''
-// };
-// });
-// // return gridMapUtil.drawGridTextLabel(data, textViews, labelsLayer, 'top');
-// return gridMapUtil.drawGridText(data, textViews, 'bottom-center', 'rank');
-// }
-
-// // 缁樺埗鐩戞祴鏁版嵁鍊煎搴旂綉鏍奸鑹�
-// function drawColor({
-// gridViews,
-// points,
-// gridDataDetail,
-// lastGridViews,
-// opacity,
-// zIndex,
-// customColor
-// }) {
-// // 鏍规嵁鏁版嵁绛涢�夋湁鏁版嵁鐨勭綉鏍�
-// const res = [];
-// // 浠ュ強瀵瑰簲鐨勪腑蹇冪偣鍧愭爣
-// const pointsRes = [];
-// gridDataDetail.forEach((d) => {
-// // 鏍规嵁鏁版嵁鍏宠仈鐨勭綉鏍肩紪鍙凤紝鎵惧埌瀵瑰簲缃戞牸
-// const cellId = d.cellId;
-// if (cellId > gridViews.length) {
-// throw Error(
-// '閬ユ祴鏁版嵁鐨勭綉鏍肩储寮曠紪鍙疯秴鍑虹綉鏍肩粍鑼冨洿锛屾暟鎹拰缃戞牸缁勫彲鑳戒笉瀵瑰簲'
-// );
-// }
-// res.push(gridViews[cellId - 1]);
-// pointsRes.push(points[cellId - 1]);
-// });
-
-// // 鏍规嵁缁樺埗棰滆壊鏂瑰紡缁樺埗缃戞牸
-// let resGridViews;
-// if (customColor) {
-// resGridViews = gridMapUtil.drawGridColorCustom(
-// res,
-// gridDataDetail,
-// opacity,
-// zIndex
-// );
-// } else {
-// resGridViews = gridMapUtil.drawGridColor(
-// res,
-// gridDataDetail,
-// 'PM25',
-// opacity,
-// zIndex
-// );
-// }
-
-// if (lastGridViews) {
-// map.remove(lastGridViews);
-// }
-// map.add(resGridViews);
-// map.setFitView(resGridViews);
-
-// return { resGridViews, pointsRes };
-// }
-
-// // 鍗槦缃戞牸閰嶇疆鍑嗗
-// function gridPrepare(gridInfo, event) {
-// // clearText(mapViews);
-// clearAll(mapViews);
-// mapViews = drawPolyline(gridInfo, event);
-// }
-
-// // 缁樺埗缃戞牸閬ユ劅鏁版嵁鍊煎拰缃戞牸棰滆壊
-// function drawGrid({
-// gridData,
-// useCustomColor,
-// opacity,
-// zIndex,
-// showDataTxt,
-// showRankTxt
-// }) {
-// // SatelliteProxy.clearText(mapViews);
-// const { resGridViews, pointsRes } = drawColor({
-// gridViews: mapViews.gridViews,
-// points: mapViews.points,
-// gridDataDetail: gridData,
-// lastGridViews: mapViews.lastGridViews,
-// customColor: useCustomColor,
-// opacity: opacity,
-// zIndex: zIndex
-// });
-// mapViews.lastGridViews = resGridViews;
-// mapViews.lastPoints = pointsRes;
-
-// // 鏁版嵁鏍囪
-// const { textViews: dataTxt, labelsLayer: dataLayer } = drawDataText(
-// mapViews.lastPoints,
-// gridData,
-// mapViews.dataTxt,
-// mapViews.dataLayer
-// );
-// mapViews.dataTxt = dataTxt;
-// mapViews.dataLayer = dataLayer;
-
-// const { textViews: rankTxt, labelsLayer: rankLayer } = drawRankText(
-// mapViews.lastPoints,
-// gridData,
-// mapViews.rankTxt,
-// mapViews.rankLayer
-// );
-// mapViews.rankTxt = rankTxt;
-// mapViews.rankLayer = rankLayer;
-
-// if (showDataTxt) {
-// map.add(mapViews.dataTxt);
-// }
-
-// if (showRankTxt) {
-// map.add(mapViews.rankTxt);
-// }
-// }
-
-// // 璋冩暣鍚勭被鍦板浘瑕嗙洊鐗╃殑鍙鎬�
-// function changeVisibility({ showGridViews, showDataTxt, showRankTxt }) {
-// if (showGridViews != undefined) {
-// showGridViews ? map.add(mapViews.lastGridViews) : map.remove(mapViews.lastGridViews);
-// }
-// if (showDataTxt != undefined) {
-// showDataTxt ? map.add(mapViews.dataTxt) : map.remove(mapViews.dataTxt);
-// }
-// if (showRankTxt != undefined) {
-// showRankTxt ? map.add(mapViews.rankTxt) : map.remove(mapViews.rankTxt);
-// }
-// }
-
-// function changeGridOpacity({ isOpacity, opacityValue }) {
-// mapViews.lastGridViews.forEach((e) => {
-// e.setOptions({
-// fillOpacity: opacityValue ? opacityValue : isOpacity ? 0.1 : 0.7
-// });
-// });
-// }
-
-// export default {
-// drawDistrict,
-// drawPolyline,
-// drawDataText,
-// drawRankText,
-// drawColor,
-// gridPrepare,
-// drawGrid,
-// changeVisibility,
-// changeGridOpacity,
-// clearText,
-// clearAll
-// };
diff --git a/src/views/satellitetelemetry/SatelliteTelemetry.vue b/src/views/satellitetelemetry/SatelliteTelemetry.vue
index 9e2998f..9cfd538 100644
--- a/src/views/satellitetelemetry/SatelliteTelemetry.vue
+++ b/src/views/satellitetelemetry/SatelliteTelemetry.vue
@@ -1,53 +1,40 @@
<template>
- <SatelliteMixTool :group-id="3"></SatelliteMixTool>
-
- <el-row class="wrap">
- <el-col span="2">
- <!-- <div class="p-events-auto">
- <el-button
- type="primary"
- class="el-button-custom"
- size="small"
- @click="previousGrid"
- >
- 涓婁竴涓�
- </el-button>
- <el-button
- type="primary"
- class="el-button-custom"
- size="small"
- @click="nextGrid"
- >
- 涓嬩竴涓�
- </el-button>
- </div> -->
- <el-row>
- <SatelliteManage
- v-show="show"
- class="satellite-manage"
- :gridDataList="satelliteGridStore.gridDataList"
- :loading="loading"
- @search="onSearch"
- @row-click="handleRowClick"
- @show-rank="handleRankClick"
- @show-data="handleDataClick"
- @change-color="handleColorClick"
- @change-opacity="handleOpacityClick"
- ></SatelliteManage>
- </el-row>
- </el-col>
- <el-col span="2">
- <el-row>
- <CardButton
- name="鍗槦閬ユ祴鏁版嵁"
- direction="right"
- @click="() => (show = !show)"
- ></CardButton>
- </el-row>
- </el-col>
+ <el-row justify="space-between">
+ <el-row class="wrap">
+ <el-col span="2">
+ <el-row>
+ <SatelliteManage
+ v-show="show"
+ class="satellite-manage"
+ :gridDataList="satelliteGridStore.gridDataList"
+ :loading="loading"
+ @search="onSearch"
+ @row-click="handleRowClick"
+ ></SatelliteManage>
+ </el-row>
+ </el-col>
+ <el-col span="2">
+ <el-row>
+ <CardButton
+ name="鍗槦閬ユ祴鏁版嵁"
+ direction="right"
+ @click="() => (show = !show)"
+ ></CardButton>
+ </el-row>
+ <el-row class="flex-col">
+ <GridStyleTool
+ @show-rank="handleRankClick"
+ @show-data="handleDataClick"
+ @change-color="handleColorClick"
+ @change-opacity="handleOpacityClick"
+ ></GridStyleTool>
+ </el-row>
+ </el-col>
+ </el-row>
+ <GridTool></GridTool>
</el-row>
- <SatelliteDataMix class="data-mix" @mix-data="handleMixDataClick">
- </SatelliteDataMix>
+ <!-- <SatelliteDataMix class="data-mix" @mix-data="handleMixDataClick">
+ </SatelliteDataMix> -->
<!-- <el-row class="historical" justify="center">
<SatelliteAnimation
@@ -68,6 +55,7 @@
import SatelliteManage from './component/SatelliteManage.vue';
import SatelliteDataMix from './component/SatelliteDataMix.vue';
import SatelliteMixTool from './component/SatelliteMixTool.vue';
+import GridStyleTool from './component/GridStyleTool.vue';
import { SatelliteProxy } from './SatelliteProxy';
import { useFetchData } from '@/composables/fetchData';
import { useSatelliteGridStore } from '@/stores/satellite-grid';
@@ -155,7 +143,7 @@
// });
});
satelliteProxy.setGridEvent('click', (e) => {
- const polygon = e.target
+ const polygon = e.target;
const { gridCell } = polygon.getExtData();
const cellIndex = gridCell.cellIndex;
const gridDataDetail =
@@ -168,7 +156,10 @@
}
function drawGrid(gridDataDetail) {
- satelliteProxy.drawGrid({ gridDataDetail: gridDataDetail });
+ satelliteProxy.drawGrid({
+ gridDataDetail: gridDataDetail,
+ useDataTxtColor: true
+ });
}
function handleRowClick(row) {
@@ -186,12 +177,13 @@
function handleColorClick(isStandardColor) {
satelliteProxy.drawGrid({
gridDataDetail: satelliteGridStore.selectedGridDataDetail,
- useCustomColor: !isStandardColor
+ useCustomColor: !isStandardColor,
+ useDataTxtColor: true
});
}
-function handleOpacityClick(isOpacity) {
- satelliteProxy.changeGridOpacity({ isOpacity });
+function handleOpacityClick(value) {
+ satelliteProxy.changeGridOpacity({ opacityValue: value });
}
function handleMixDataClick(gridData) {
diff --git a/src/views/satellitetelemetry/component/AODImport.vue b/src/views/satellitetelemetry/component/AODImport.vue
index 26b107c..4bb397e 100644
--- a/src/views/satellitetelemetry/component/AODImport.vue
+++ b/src/views/satellitetelemetry/component/AODImport.vue
@@ -1,49 +1,105 @@
<template>
<!-- <CardDialog title="AOD鏁版嵁瀵煎叆" :model-value="modelValue" :width="420" @changed="handleChange"> -->
- <div class="download">
- <el-button @click="downloadTemplate" type="primary" class="el-button-custom" size="small"
- v-loading="downloadLoading">涓嬭浇妯℃澘</el-button>
- </div>
- <el-form :model="formObj" :rules="rules" ref="formRef" label-position="right" label-width="60px">
- <el-form-item label="鍖哄煙">
- <OptionLocation2 :level="3" :initValue="true" :checkStrictly="false" :allOption="true" v-model="location"
- width="200">
- </OptionLocation2>
- </el-form-item>
- <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
- <el-form-item label="鏃堕棿" prop="dateTime">
- <el-date-picker v-model="formObj.dateTime" type="date" placeholder="閫夋嫨鏃堕棿" size="small" :clearable="false" />
- </el-form-item>
- <el-form-item label="">
- <el-row>
- <el-col>
- <label><el-checkbox v-model="formObj.update" label="" size="small"
- :disabled="hasGridAod == undefined || hasGridAod == false" />鍚屾剰</label>
- </el-col>
- <el-col>
- <el-text class="mx-1" type="danger" v-if="hasGridAod == true">褰撴棩AOD鏁版嵁宸插瓨鍦紝璇峰嬀閫夊悓鎰忓悗杩涜鏁版嵁鏇存柊瑕嗙洊</el-text>
- <el-text class="mx-1" type="success" v-else-if="hasGridAod == false">褰撴棩AOD鏃犳暟鎹紝鍙柊澧炲鍏�</el-text>
- </el-col>
- </el-row>
- </el-form-item>
- <el-form-item>
- <el-upload v-model:file-list="formObj.file" accept=".xlsx" :limit="1" :auto-upload="false" ref="uploadRef"
- :on-exceed="handleUploadExceed" :on-change="handleUploadChange">
- <template #trigger>
- <el-button :disabled="formObj.update == undefined || (hasGridAod == true && formObj.update == false)"
- type="primary" class="el-button-custom select-file-button" size="small" accept=".xlsx">閫夋嫨鏂囦欢</el-button>
- </template>
- <el-button @click="onSubmit" type="primary" class="el-button-custom import-button" size="small"
- :disabled="!formObj.file || formObj.file.length == 0" v-loading="loading">
- 瀵煎叆
- </el-button>
- </el-upload>
- </el-form-item>
- <el-form-item>
- <el-text class="mx-1" type="danger">{{ errorTipMsg }}</el-text>
- <el-text class="mx-1" type="success">{{ successTipMsg }}</el-text>
- </el-form-item>
- </el-form>
+ <div class="download">
+ <el-button
+ @click="downloadTemplate"
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ v-loading="downloadLoading"
+ >涓嬭浇妯℃澘</el-button
+ >
+ </div>
+ <el-form
+ :model="formObj"
+ :rules="rules"
+ ref="formRef"
+ label-position="right"
+ label-width="60px"
+ >
+ <el-form-item label="鍖哄煙">
+ <OptionLocation2
+ :level="3"
+ :initValue="true"
+ :checkStrictly="false"
+ :allOption="true"
+ v-model="location"
+ width="200"
+ >
+ </OptionLocation2>
+ </el-form-item>
+ <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
+ <el-form-item label="鏃堕棿" prop="dateTime">
+ <el-date-picker
+ v-model="formObj.dateTime"
+ type="date"
+ placeholder="閫夋嫨鏃堕棿"
+ size="small"
+ :clearable="false"
+ />
+ </el-form-item>
+ <el-form-item label="">
+ <el-row>
+ <el-col>
+ <label
+ ><el-checkbox
+ v-model="formObj.update"
+ label=""
+ size="small"
+ :disabled="hasGridAod == undefined || hasGridAod == false"
+ />鍚屾剰</label
+ >
+ </el-col>
+ <el-col>
+ <el-text class="mx-1" type="danger" v-if="hasGridAod == true"
+ >褰撴棩AOD鏁版嵁宸插瓨鍦紝璇峰嬀閫夊悓鎰忓悗杩涜鏁版嵁鏇存柊瑕嗙洊</el-text
+ >
+ <el-text class="mx-1" type="success" v-else-if="hasGridAod == false"
+ >褰撴棩AOD鏃犳暟鎹紝鍙柊澧炲鍏�</el-text
+ >
+ </el-col>
+ </el-row>
+ </el-form-item>
+ <el-form-item>
+ <el-upload
+ v-model:file-list="formObj.file"
+ accept=".xlsx"
+ :limit="1"
+ :auto-upload="false"
+ ref="uploadRef"
+ :on-exceed="handleUploadExceed"
+ :on-change="handleUploadChange"
+ >
+ <template #trigger>
+ <el-button
+ :disabled="
+ formObj.update == undefined ||
+ (hasGridAod == true && formObj.update == false)
+ "
+ type="primary"
+ class="el-button-custom select-file-button"
+ size="small"
+ accept=".xlsx"
+ >閫夋嫨鏂囦欢</el-button
+ >
+ </template>
+ <el-button
+ @click="onSubmit"
+ type="primary"
+ class="el-button-custom import-button"
+ size="small"
+ :disabled="!formObj.file || formObj.file.length == 0"
+ v-loading="loading"
+ >
+ 瀵煎叆
+ </el-button>
+ </el-upload>
+ </el-form-item>
+ <el-form-item>
+ <el-text class="mx-1" type="danger">{{ errorTipMsg }}</el-text>
+ <el-text class="mx-1" type="success">{{ successTipMsg }}</el-text>
+ </el-form-item>
+ </el-form>
<!-- </CardDialog> -->
</template>
<script setup>
@@ -55,7 +111,7 @@
const gridGroupRef = ref(null);
const uploadRef = ref(null);
-// 鏄惁鏈夋暟鎹竷灏旂被鍨� 榛樿涓虹┖
+// 鏄惁鏈夋暟鎹竷灏旂被鍨� 榛樿涓虹┖
const hasGridAod = ref(null);
const location = ref({});
const gridGroup = ref({});
@@ -81,24 +137,32 @@
};
const downloadTemplate = () => {
- downloadLoading.value = true
- gridApi.downloadAODTemplate().then(res => {
- downloadLoading.value = false
- }).catch(e => {
- downloadLoading.value = false
- });
+ downloadLoading.value = true;
+ gridApi
+ .downloadAODTemplate()
+ .then((res) => {
+ downloadLoading.value = false;
+ })
+ .catch((e) => {
+ downloadLoading.value = false;
+ });
};
// 閫氳繃缃戞牸缁勫拰鏃堕棿 鏌ヨ 鍦ㄨ繖涓や釜鍙傛暟鏉′欢涓嬫槸鍚︽湁缃戞牸鏁版嵁锛屽苟鎻愮ず鍦ㄧ晫闈腑鏈夋垨鑰呮病鏈�
const checkEmpty = () => {
- aodApi.fetchAOD(gridGroup.value.id, dayjs(formObj.value.dateTime).format('YYYY-MM-DD HH:mm:ss')).then(res => {
- if (res.data && res.data.length > 0) {
- hasGridAod.value = true;
- } else {
- formObj.value.update = false
- hasGridAod.value = false;
- }
- })
+ aodApi
+ .fetchAOD(
+ gridGroup.value.id,
+ dayjs(formObj.value.dateTime).format('YYYY-MM-DD HH:mm:ss')
+ )
+ .then((res) => {
+ if (res.data && res.data.length > 0) {
+ hasGridAod.value = true;
+ } else {
+ formObj.value.update = false;
+ hasGridAod.value = false;
+ }
+ });
};
const handleImportClick = () => {
loading.value = true;
@@ -109,7 +173,9 @@
const reader = new FileReader();
reader.readAsArrayBuffer(formObj.value.file[0].raw);
reader.onload = async (theFile) => {
- const binary = new Blob([theFile.target.result], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+ const binary = new Blob([theFile.target.result], {
+ type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+ });
formData.append('excel', binary);
formData.append('groupId', gridGroup.value.id);
formData.append(
@@ -120,60 +186,60 @@
gridApi
.importAOD(formData)
.then((res) => {
- resetApiTipMsg()
+ resetApiTipMsg();
loading.value = false;
if (res && res.success == true) {
// 瀵煎叆鎴愬姛锛�1.瀵煎叆鎴栬�呰鐩栨垚鍔燂紝鏄惁涓虹┖鐘舵�佹敼鍙樹簡锛岄噸鏂版鏌�
- checkEmpty()
- successTipMsg.value = res.data.result
+ checkEmpty();
+ successTipMsg.value = res.data.result;
} else {
- errorTipMsg.value = res.message
+ errorTipMsg.value = res.message;
}
- }).catch(e => {
- loading.value = false;
- errorTipMsg.value = e
})
- }
+ .catch((e) => {
+ loading.value = false;
+ errorTipMsg.value = e;
+ });
+ };
};
const resetApiTipMsg = () => {
- successTipMsg.value = ''
- errorTipMsg.value = ''
+ successTipMsg.value = '';
+ errorTipMsg.value = '';
};
// 褰撻�夋嫨鏂囦欢鍚庯細 1. 閲嶇疆鎻愮ず淇℃伅锛岄槻姝㈣瀵� 2.瀵规枃浠剁被鍨嬬殑妫�鏌�
const handleUploadChange = (file, files) => {
- resetApiTipMsg()
+ resetApiTipMsg();
const fileType = file.raw.type;
// 妫�鏌ユ枃浠剁被鍨嬫槸鍚︿负 'xlsx'
- if (fileType !== 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
+ if (
+ fileType !==
+ 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+ ) {
ElMessage({
message: '鏂囦欢绫诲瀷閿欒锛岃閲嶆柊涓婁紶xlsx绫诲瀷鏂囦欢',
type: 'error'
- })
+ });
files.splice(0, 1); // 闃绘涓婁紶
}
};
// 鏂伴�夋嫨鏂囦欢鏇挎崲鏃ф枃浠�
const handleUploadExceed = (files) => {
- const file = files[0]
- uploadRef.value.clearFiles()
- uploadRef.value.handleStart(file)
+ const file = files[0];
+ uploadRef.value.clearFiles();
+ uploadRef.value.handleStart(file);
};
const { formObj, formRef, edit, onSubmit, onCancel } = useFormConfirm({
submit: {
do: handleImportClick
},
cancel: {
- do: () => {
-
- }
+ do: () => {}
}
});
-
-
watch(location, (nv, ov) => {
if (nv != ov) {
- resetApiTipMsg()
+ resetApiTipMsg();
const area = {
provinceCode: nv.pCode,
provinceName: nv.pName,
@@ -184,21 +250,34 @@
townCode: nv.tCode,
townName: nv.tName
};
- gridGroupRef.value.fetchGridGroup(area);
+ gridGroupRef.value.fetchGridGroup(area, 'origin');
}
});
-watch(gridGroup, (nv) => {
- if (nv && Object.keys(nv).length === 0 && formObj.value.dateTime && Object.keys(formObj.value.dateTime).length === 0) {
- checkEmpty()
- }
-}, { deep: true });
+watch(
+ gridGroup,
+ (nv) => {
+ if (
+ nv &&
+ Object.keys(nv).length === 0 &&
+ formObj.value.dateTime &&
+ Object.keys(formObj.value.dateTime).length === 0
+ ) {
+ checkEmpty();
+ }
+ },
+ { deep: true }
+);
-watch(formObj.value, (nv) => {
- if (nv.dateTime && gridGroup.value) {
- checkEmpty()
- }
-}, { deep: true });
+watch(
+ formObj.value,
+ (nv) => {
+ if (nv.dateTime && gridGroup.value) {
+ checkEmpty();
+ }
+ },
+ { deep: true }
+);
</script>
<style scoped>
.download {
@@ -225,4 +304,4 @@
::v-deep .el-select {
width: 200px !important;
}
-</style>
\ No newline at end of file
+</style>
diff --git a/src/views/satellitetelemetry/component/GridStyleTool.vue b/src/views/satellitetelemetry/component/GridStyleTool.vue
new file mode 100644
index 0000000..efeb025
--- /dev/null
+++ b/src/views/satellitetelemetry/component/GridStyleTool.vue
@@ -0,0 +1,113 @@
+<template>
+ <!-- <SatelliteMixTool :group-id="3"></SatelliteMixTool> -->
+
+ <el-row class="wrap">
+ <el-col span="2">
+ <BaseCard v-show="show" direction="left" borderless="r">
+ <template #content>
+ <div class="m-t-8">缃戞牸瑕佺礌</div>
+ <el-row class="m-b-8">
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleRankClick"
+ >
+ {{ rankVisible ? '闅愯棌鎺掑悕' : '鏄剧ず鎺掑悕' }}
+ </el-button>
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleDataClick"
+ >
+ {{ dataVisible ? '闅愯棌鏁版嵁' : '鏄剧ず鏁版嵁' }}
+ </el-button>
+ </el-row>
+ <div class="m-t-8">缃戞牸鏍峰紡</div>
+ <el-row class="m-b-8">
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleColorClick"
+ >
+ {{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }}
+ </el-button>
+ </el-row>
+ <div class="m-t-8">缃戞牸閫忔槑搴�</div>
+ <el-row class="m-b-8">
+ <el-slider
+ v-model="opacityValue"
+ :marks="marks"
+ :min="0"
+ :max="1"
+ :step="0.1"
+ show-stops
+ @change="handleOpacityChange"
+ />
+ <!-- <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleOpacityClick"
+ >
+ {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }}
+ </el-button> -->
+ </el-row>
+ </template>
+ </BaseCard>
+ </el-col>
+ <el-col span="2">
+ <el-row>
+ <CardButton
+ name="缃戞牸鏍峰紡"
+ direction="right"
+ @click="() => (show = !show)"
+ ></CardButton>
+ </el-row>
+ </el-col>
+ </el-row>
+</template>
+<script setup>
+import { ref } from 'vue';
+
+const show = ref(true);
+
+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'
+]);
+
+function handleRankClick() {
+ rankVisible.value = !rankVisible.value;
+ emits('showRank', rankVisible.value);
+}
+
+function handleDataClick() {
+ dataVisible.value = !dataVisible.value;
+ emits('showData', dataVisible.value);
+}
+
+function handleColorClick() {
+ isStandardColor.value = !isStandardColor.value;
+ emits('changeColor', isStandardColor.value);
+}
+
+function handleOpacityClick() {
+ // isOpacity.value = !isOpacity.value;
+ // emits('changeOpacity', isOpacity.value);
+}
+
+function handleOpacityChange(value) {
+ emits('changeOpacity', value);
+}
+</script>
diff --git a/src/views/satellitetelemetry/component/SatelliteImport.vue b/src/views/satellitetelemetry/component/SatelliteImport.vue
index 0ab79c0..31fcd27 100644
--- a/src/views/satellitetelemetry/component/SatelliteImport.vue
+++ b/src/views/satellitetelemetry/component/SatelliteImport.vue
@@ -1,49 +1,105 @@
<template>
<!-- <CardDialog title="鐩戞祴鏁版嵁瀵煎叆" :model-value="modelValue" :width="420" @changed="handleChange"> -->
- <div class="download">
- <el-button @click="downloadTemplate" type="primary" class="el-button-custom" size="small"
- v-loading="downloadLoading">涓嬭浇妯℃澘</el-button>
- </div>
- <el-form :model="formObj" :rules="rules" ref="formRef" label-position="right" label-width="60px">
- <el-form-item label="鍖哄煙">
- <OptionLocation2 :level="3" :initValue="true" :checkStrictly="false" :allOption="true" v-model="location"
- width="200">
- </OptionLocation2>
- </el-form-item>
- <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
- <el-form-item label="鏃堕棿" prop="dateTime">
- <el-date-picker v-model="formObj.dateTime" type="date" placeholder="閫夋嫨鏃堕棿" size="small" :clearable="false"/>
- </el-form-item>
- <el-form-item label="">
- <el-row>
- <el-col>
- <label><el-checkbox v-model="formObj.update" label="" size="small"
- :disabled="hasGridData == undefined || hasGridData == false" />鍚屾剰</label>
- </el-col>
- <el-col>
- <el-text class="mx-1" type="danger" v-if="hasGridData == true">褰撴棩閬ユ祴鏁版嵁宸插瓨鍦紝璇峰嬀閫夊悓鎰忓悗杩涜鏁版嵁鏇存柊瑕嗙洊</el-text>
- <el-text class="mx-1" type="success" v-else-if="hasGridData == false">褰撴棩閬ユ祴鏃犳暟鎹紝鍙柊澧炲鍏�</el-text>
- </el-col>
- </el-row>
- </el-form-item>
- <el-form-item>
- <el-upload v-model:file-list="formObj.file" accept=".xlsx" :limit="1" :auto-upload="false" ref="uploadRef"
- :on-exceed="handleUploadExceed" :on-change="handleUploadChange">
- <template #trigger>
- <el-button :disabled="formObj.update == undefined || (hasGridData == true && formObj.update == false)"
- type="primary" class="el-button-custom select-file-button" size="small" accept=".xlsx">閫夋嫨鏂囦欢</el-button>
- </template>
- <el-button @click="onSubmit" type="primary" class="el-button-custom import-button" size="small" :disabled="!formObj.file || formObj.file.length == 0"
- v-loading="loading">
- 瀵煎叆
- </el-button>
- </el-upload>
- </el-form-item>
- <el-form-item>
- <el-text class="mx-1" type="danger">{{ errorTipMsg }}</el-text>
- <el-text class="mx-1" type="success">{{ successTipMsg }}</el-text>
- </el-form-item>
- </el-form>
+ <div class="download">
+ <el-button
+ @click="downloadTemplate"
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ v-loading="downloadLoading"
+ >涓嬭浇妯℃澘</el-button
+ >
+ </div>
+ <el-form
+ :model="formObj"
+ :rules="rules"
+ ref="formRef"
+ label-position="right"
+ label-width="60px"
+ >
+ <el-form-item label="鍖哄煙">
+ <OptionLocation2
+ :level="3"
+ :initValue="true"
+ :checkStrictly="false"
+ :allOption="true"
+ v-model="location"
+ width="200"
+ >
+ </OptionLocation2>
+ </el-form-item>
+ <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
+ <el-form-item label="鏃堕棿" prop="dateTime">
+ <el-date-picker
+ v-model="formObj.dateTime"
+ type="date"
+ placeholder="閫夋嫨鏃堕棿"
+ size="small"
+ :clearable="false"
+ />
+ </el-form-item>
+ <el-form-item label="">
+ <el-row>
+ <el-col>
+ <label
+ ><el-checkbox
+ v-model="formObj.update"
+ label=""
+ size="small"
+ :disabled="hasGridData == undefined || hasGridData == false"
+ />鍚屾剰</label
+ >
+ </el-col>
+ <el-col>
+ <el-text class="mx-1" type="danger" v-if="hasGridData == true"
+ >褰撴棩閬ユ祴鏁版嵁宸插瓨鍦紝璇峰嬀閫夊悓鎰忓悗杩涜鏁版嵁鏇存柊瑕嗙洊</el-text
+ >
+ <el-text class="mx-1" type="success" v-else-if="hasGridData == false"
+ >褰撴棩閬ユ祴鏃犳暟鎹紝鍙柊澧炲鍏�</el-text
+ >
+ </el-col>
+ </el-row>
+ </el-form-item>
+ <el-form-item>
+ <el-upload
+ v-model:file-list="formObj.file"
+ accept=".xlsx"
+ :limit="1"
+ :auto-upload="false"
+ ref="uploadRef"
+ :on-exceed="handleUploadExceed"
+ :on-change="handleUploadChange"
+ >
+ <template #trigger>
+ <el-button
+ :disabled="
+ formObj.update == undefined ||
+ (hasGridData == true && formObj.update == false)
+ "
+ type="primary"
+ class="el-button-custom select-file-button"
+ size="small"
+ accept=".xlsx"
+ >閫夋嫨鏂囦欢</el-button
+ >
+ </template>
+ <el-button
+ @click="onSubmit"
+ type="primary"
+ class="el-button-custom import-button"
+ size="small"
+ :disabled="!formObj.file || formObj.file.length == 0"
+ v-loading="loading"
+ >
+ 瀵煎叆
+ </el-button>
+ </el-upload>
+ </el-form-item>
+ <el-form-item>
+ <el-text class="mx-1" type="danger">{{ errorTipMsg }}</el-text>
+ <el-text class="mx-1" type="success">{{ successTipMsg }}</el-text>
+ </el-form-item>
+ </el-form>
<!-- </CardDialog> -->
</template>
<script setup>
@@ -54,7 +110,7 @@
const gridGroupRef = ref(null);
const uploadRef = ref(null);
-// 鏄惁鏈夋暟鎹竷灏旂被鍨� 榛樿涓虹┖
+// 鏄惁鏈夋暟鎹竷灏旂被鍨� 榛樿涓虹┖
const hasGridData = ref(null);
const location = ref({});
const gridGroup = ref({});
@@ -66,15 +122,15 @@
const errorTipMsg = ref('');
const successTipMsg = ref('');
const rules = {
- dateTime: [{ required: true, message: '鏃堕棿涓嶈兘涓虹┖', trigger: 'blur' }],
+ dateTime: [{ required: true, message: '鏃堕棿涓嶈兘涓虹┖', trigger: 'blur' }]
};
const props = defineProps({
modelValue: Boolean
});
const resetApiTipMsg = () => {
- successTipMsg.value = ''
- errorTipMsg.value = ''
+ successTipMsg.value = '';
+ errorTipMsg.value = '';
};
const emit = defineEmits(['update:modelValue']);
@@ -84,23 +140,31 @@
};
const downloadTemplate = () => {
- downloadLoading.value = true
- gridApi.downloadTemplate().then(res => {
- downloadLoading.value = false
- }).catch(e => {
- downloadLoading.value = false
- });
+ downloadLoading.value = true;
+ gridApi
+ .downloadTemplate()
+ .then((res) => {
+ downloadLoading.value = false;
+ })
+ .catch((e) => {
+ downloadLoading.value = false;
+ });
};
// 閫氳繃缃戞牸缁勫拰鏃堕棿 鏌ヨ 鍦ㄨ繖涓や釜鍙傛暟鏉′欢涓嬫槸鍚︽湁缃戞牸鏁版嵁锛屽苟鎻愮ず鍦ㄧ晫闈腑鏈夋垨鑰呮病鏈�
const checkEmpty = () => {
- gridApi.fetchGridData(gridGroup.value.id, dayjs(formObj.value.dateTime).format('YYYY-MM-DD HH:mm:ss')).then(res => {
- if (res.data && res.data.length > 0) {
- hasGridData.value = true;
- } else {
- formObj.value.update = false
- hasGridData.value = false;
- }
- })
+ gridApi
+ .fetchGridData(
+ gridGroup.value.id,
+ dayjs(formObj.value.dateTime).format('YYYY-MM-DD HH:mm:ss')
+ )
+ .then((res) => {
+ if (res.data && res.data.length > 0) {
+ hasGridData.value = true;
+ } else {
+ formObj.value.update = false;
+ hasGridData.value = false;
+ }
+ });
};
const handleImportClick = () => {
loading.value = true;
@@ -112,7 +176,9 @@
const reader = new FileReader();
reader.readAsArrayBuffer(formObj.value.file[0].raw);
reader.onload = async (theFile) => {
- const binary = new Blob([theFile.target.result], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
+ const binary = new Blob([theFile.target.result], {
+ type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+ });
formData.append('excel', binary);
formData.append('groupId', gridGroup.value.id);
formData.append('type', type);
@@ -124,53 +190,55 @@
gridApi
.importData(formData)
.then((res) => {
- resetApiTipMsg()
+ resetApiTipMsg();
loading.value = false;
if (res && res.success == true) {
// 瀵煎叆鎴愬姛锛�1.瀵煎叆鎴栬�呰鐩栨垚鍔燂紝鏄惁涓虹┖鐘舵�佹敼鍙樹簡锛岄噸鏂版鏌�
- checkEmpty()
- successTipMsg.value = res.data.result
+ checkEmpty();
+ successTipMsg.value = res.data.result;
} else {
- errorTipMsg.value = res.message
+ errorTipMsg.value = res.message;
}
- }).catch(e => {
- loading.value = false;
- errorTipMsg.value = e
})
- }
+ .catch((e) => {
+ loading.value = false;
+ errorTipMsg.value = e;
+ });
+ };
};
// 褰撻�夋嫨鏂囦欢鍚庯細 1. 閲嶇疆鎻愮ず淇℃伅锛岄槻姝㈣瀵� 2.瀵规枃浠剁被鍨嬬殑妫�鏌�
const handleUploadChange = (file, files) => {
- resetApiTipMsg()
+ resetApiTipMsg();
const fileType = file.raw.type;
// 妫�鏌ユ枃浠剁被鍨嬫槸鍚︿负 'xlsx'
- if (fileType !== 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet') {
+ if (
+ fileType !==
+ 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
+ ) {
ElMessage({
message: '鏂囦欢绫诲瀷閿欒锛岃閲嶆柊涓婁紶xlsx绫诲瀷鏂囦欢',
type: 'error'
- })
+ });
files.splice(0, 1); // 闃绘涓婁紶
}
};
// 鏂伴�夋嫨鏂囦欢鏇挎崲鏃ф枃浠�
const handleUploadExceed = (files) => {
- const file = files[0]
- uploadRef.value.clearFiles()
- uploadRef.value.handleStart(file)
+ const file = files[0];
+ uploadRef.value.clearFiles();
+ uploadRef.value.handleStart(file);
};
const { formObj, formRef, edit, onSubmit, onCancel } = useFormConfirm({
submit: {
do: handleImportClick
},
cancel: {
- do: () => {
-
- }
+ do: () => {}
}
});
watch(location, (nv, ov) => {
if (nv != ov) {
- resetApiTipMsg()
+ resetApiTipMsg();
const area = {
provinceCode: nv.pCode,
provinceName: nv.pName,
@@ -181,21 +249,34 @@
townCode: nv.tCode,
townName: nv.tName
};
- gridGroupRef.value.fetchGridGroup(area);
+ gridGroupRef.value.fetchGridGroup(area, 'origin');
}
});
// 褰撶綉鏍肩粍鍜屾椂闂撮兘涓嶄负绌� 骞朵笖 鏈変竴涓潯浠舵敼鍙樺悗閲嶆柊妫�鏌ユ槸鍚︽湁缃戞牸鏁版嵁
-watch(gridGroup, (nv) => {
- if (nv && Object.keys(nv).length === 0 && formObj.value.dateTime && Object.keys(formObj.value.dateTime).length === 0) {
- checkEmpty()
- }
-}, { deep: true });
+watch(
+ gridGroup,
+ (nv) => {
+ if (
+ nv &&
+ Object.keys(nv).length === 0 &&
+ formObj.value.dateTime &&
+ Object.keys(formObj.value.dateTime).length === 0
+ ) {
+ checkEmpty();
+ }
+ },
+ { deep: true }
+);
-watch(formObj, (nv) => {
- if (nv.dateTime && gridGroup.value) {
- checkEmpty()
- }
-}, { deep: true });
+watch(
+ formObj,
+ (nv) => {
+ if (nv.dateTime && gridGroup.value) {
+ checkEmpty();
+ }
+ },
+ { deep: true }
+);
</script>
<style scoped>
.download {
diff --git a/src/views/satellitetelemetry/component/SatelliteManage.vue b/src/views/satellitetelemetry/component/SatelliteManage.vue
index 2fe2100..8e17604 100644
--- a/src/views/satellitetelemetry/component/SatelliteManage.vue
+++ b/src/views/satellitetelemetry/component/SatelliteManage.vue
@@ -6,7 +6,7 @@
:loading="loading"
@search="onSearch"
></SatelliteSearchBar>
- <el-row class="m-b-8">
+ <!-- <el-row class="m-b-8">
<el-button
type="primary"
class="el-button-custom"
@@ -39,7 +39,7 @@
>
{{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }}
</el-button>
- </el-row>
+ </el-row> -->
<el-table
:data="gridDataList"
table-layout="fixed"
@@ -118,10 +118,10 @@
}
});
-const rankVisible = ref(false);
-const dataVisible = ref(false);
-const isStandardColor = ref(true);
-const isOpacity = ref(false);
+// const rankVisible = ref(false);
+// const dataVisible = ref(false);
+// const isStandardColor = ref(true);
+// const isOpacity = ref(false);
const emits = defineEmits([
'search',
@@ -136,25 +136,25 @@
emits('search', options);
}
-function handleRankClick() {
- rankVisible.value = !rankVisible.value;
- emits('showRank', rankVisible.value);
-}
+// function handleRankClick() {
+// rankVisible.value = !rankVisible.value;
+// emits('showRank', rankVisible.value);
+// }
-function handleDataClick() {
- dataVisible.value = !dataVisible.value;
- emits('showData', dataVisible.value);
-}
+// function handleDataClick() {
+// dataVisible.value = !dataVisible.value;
+// emits('showData', dataVisible.value);
+// }
-function handleColorClick() {
- isStandardColor.value = !isStandardColor.value;
- emits('changeColor', isStandardColor.value);
-}
+// function handleColorClick() {
+// isStandardColor.value = !isStandardColor.value;
+// emits('changeColor', isStandardColor.value);
+// }
-function handleOpacityClick() {
- isOpacity.value = !isOpacity.value;
- emits('changeOpacity', isOpacity.value);
-}
+// function handleOpacityClick() {
+// isOpacity.value = !isOpacity.value;
+// emits('changeOpacity', isOpacity.value);
+// }
function handleRowClick(row, col, event) {
emits('rowClick', row);
diff --git a/src/views/satellitetelemetry/component/SatelliteMixTool.vue b/src/views/satellitetelemetry/component/SatelliteMixTool.vue
index 0086149..fb9ae68 100644
--- a/src/views/satellitetelemetry/component/SatelliteMixTool.vue
+++ b/src/views/satellitetelemetry/component/SatelliteMixTool.vue
@@ -11,25 +11,49 @@
title="璧拌埅铻嶅悎"
draggable
:modal="false"
- width="400px"
+ width="420px"
>
<template #default>
<el-row>
- <OptionMission v-model="mission"></OptionMission>
- <el-text size="small" :type="fusionData ? 'success' : 'warning'">{{
+ <!-- <OptionMission v-model="mission"></OptionMission> -->
+ <el-form :inline="true">
+ <el-form-item label="璧拌埅铻嶅悎">
+ <el-select
+ v-model="selectedfusionData"
+ multiple
+ clearable
+ @change="handleChange"
+ placeholder="閫夋嫨浠诲姟"
+ size="small"
+ class="w-200"
+ :loading="fusionLoading"
+ >
+ <el-option
+ v-for="(s, i) in fusionDataList"
+ :key="i"
+ :label="timeFormatter(s.dataTime)"
+ :value="i"
+ />
+ </el-select>
+ </el-form-item>
+ <el-form-item>
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ :disabled="!gridCellList || selectedfusionData.length == 0"
+ @click="handleFusionClick"
+ >
+ {{ '鍙犲姞铻嶅悎' }}
+ </el-button>
+ </el-form-item>
+ </el-form>
+ <!-- <el-text size="small" :type="fusionData ? 'success' : 'warning'">{{
fusionData ? '璧拌埅鏁版嵁宸茶瀺鍚�' : '璧拌埅鏁版嵁鏈瀺鍚�'
- }}</el-text>
+ }}</el-text> -->
</el-row>
- <el-row>
- <el-button
- type="primary"
- class="el-button-custom"
- size="small"
- :disabled="!gridCellList || !fusionData"
- @click="handleFusionClick"
- >
- {{ '鍙犲姞铻嶅悎' }}
- </el-button>
+ <div class="m-t-8">缃戞牸瑕佺礌</div>
+ <el-row class="m-t-8">
<el-button
type="primary"
class="el-button-custom"
@@ -38,17 +62,6 @@
>
{{ gridVisible ? '闅愯棌铻嶅悎' : '鏄剧ず铻嶅悎' }}
</el-button>
- <el-button
- type="primary"
- class="el-button-custom"
- size="small"
- :loading="loading"
- @click="handleUnderwayClick"
- >
- {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }}
- </el-button>
- </el-row>
- <el-row class="m-t-8">
<el-button
type="primary"
class="el-button-custom"
@@ -65,6 +78,17 @@
>
{{ dataVisible ? '闅愯棌鏁版嵁' : '鏄剧ず鏁版嵁' }}
</el-button>
+ </el-row>
+ <div class="m-t-8">缃戞牸鏍峰紡</div>
+ <el-row class="m-t-8">
+ <el-button
+ type="primary"
+ class="el-button-custom"
+ size="small"
+ @click="handleOpacityClick"
+ >
+ {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }}
+ </el-button>
<el-button
type="primary"
class="el-button-custom"
@@ -73,13 +97,19 @@
>
{{ isStandardColor ? '缁樺埗瀵规瘮鑹�' : '缁樺埗鏍囧噯鑹�' }}
</el-button>
+ </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"
class="el-button-custom"
size="small"
- @click="handleOpacityClick"
+ :loading="missionLoading || loading"
+ @click="handleUnderwayClick"
>
- {{ !isOpacity ? '閫忔槑鍖�' : '鍙栨秷閫忔槑鍖�' }}
+ {{ underwayVisible ? '闅愯棌璧拌埅璺嚎' : '鏄剧ず璧拌埅璺嚎' }}
</el-button>
</el-row>
</template>
@@ -112,6 +142,11 @@
const gridCellList = ref(undefined);
const fusionData = ref(undefined);
+// 璧拌埅铻嶅悎鏁版嵁
+const fusionLoading = ref(false);
+const fusionDataList = ref([]);
+const selectedfusionData = ref([]);
+
const gridDataDetailMap = new Map();
const gridVisible = ref(true);
@@ -121,17 +156,31 @@
const isStandardColor = ref(true);
const isOpacity = ref(false);
-// 妫�鏌ヨ蛋鑸暟鎹槸鍚﹀拰100绫崇綉鏍煎凡铻嶅悎
-function checkUnderwayFusionResult() {
- const time = moment(mission.value.startTime).format('YYYY-MM-DD HH:mm:ss');
- gridApi.fetchGridData(props.groupId, time, 3).then((res) => {
- if (res.data.length > 0) {
- fusionData.value = res.data[0];
- } else {
- fusionData.value = undefined;
- }
- });
+function timeFormatter(value) {
+ return moment(value).format('YYYY-MM-DD');
}
+
+function fetchFusionData() {
+ fusionLoading.value = true;
+ gridApi
+ .fetchGridData(props.groupId, undefined, 3)
+ .then((res) => {
+ fusionDataList.value = res.data;
+ })
+ .finally(() => (fusionLoading.value = false));
+}
+
+// 妫�鏌ヨ蛋鑸暟鎹槸鍚﹀拰100绫崇綉鏍煎凡铻嶅悎
+// function checkUnderwayFusionResult() {
+// const time = moment(mission.value.startTime).format('YYYY-MM-DD HH:mm:ss');
+// gridApi.fetchGridData(props.groupId, time, 3).then((res) => {
+// if (res.data.length > 0) {
+// fusionData.value = res.data[0];
+// } else {
+// fusionData.value = undefined;
+// }
+// });
+// }
function resetButton() {
gridVisible.value = true;
@@ -151,12 +200,12 @@
satelliteProxy.drawGrid({ gridDataDetail, opacity: 1, zIndex: 11 });
}
-watch(mission, (nV, oV) => {
- if (nV != oV) {
- checkUnderwayFusionResult();
- search(nV);
- }
-});
+// watch(mission, (nV, oV) => {
+// if (nV != oV) {
+// checkUnderwayFusionResult();
+// search(nV);
+// }
+// });
watch(
() => props.groupId,
@@ -166,6 +215,7 @@
gridCellList.value = res.data;
prepareGrid(gridCellList.value);
});
+ fetchFusionData();
}
},
{
@@ -179,26 +229,55 @@
gridCellList.value = res.data;
prepareGrid(gridCellList.value);
});
+ fetchFusionData();
}
});
let selectedGridDataDetail;
// 鍙犲姞铻嶅悎
+// function handleFusionClick() {
+// // resetButton();
+// const d = fusionData.value;
+// if (gridDataDetailMap.has(d.id)) {
+// selectedGridDataDetail = gridDataDetailMap.get(d.id);
+// // selectedGridData = gridData;
+// drawGrid(selectedGridDataDetail);
+// } else {
+// gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => {
+// gridDataDetailMap.set(d.id, res.data);
+// selectedGridDataDetail = res.data;
+// // selectedGridData = gridData;
+// drawGrid(selectedGridDataDetail);
+// });
+// }
+// }
function handleFusionClick() {
// resetButton();
- const d = fusionData.value;
- if (gridDataDetailMap.has(d.id)) {
- selectedGridDataDetail = gridDataDetailMap.get(d.id);
- // selectedGridData = gridData;
- drawGrid(selectedGridDataDetail);
- } else {
- gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => {
- gridDataDetailMap.set(d.id, res.data);
- selectedGridDataDetail = res.data;
- // selectedGridData = gridData;
- drawGrid(selectedGridDataDetail);
- });
- }
+ satelliteProxy.changeVisibility({ showGridViews: false });
+ selectedfusionData.value.forEach((i) => {
+ const d = fusionDataList.value[i];
+ if (gridDataDetailMap.has(d.id)) {
+ // const gdd = gridDataDetailMap.get(d.id);
+ // satelliteProxy.drawTagGrid({
+ // tag: d.id,
+ // gridDataDetail: gdd,
+ // opacity: 1,
+ // zIndex: 11
+ // });
+ satelliteProxy.changeVisibility({ tag: d.id, showGridViews: true });
+ } else {
+ gridApi.fetchGridDataDetail(d.id, d.groupId).then((res) => {
+ gridDataDetailMap.set(d.id, res.data);
+ const gdd = res.data;
+ satelliteProxy.drawTagGrid({
+ tag: d.id,
+ gridDataDetail: gdd,
+ opacity: 1,
+ zIndex: 11
+ });
+ });
+ }
+ });
}
function handleGridClick() {
@@ -223,11 +302,24 @@
function handleColorClick() {
isStandardColor.value = !isStandardColor.value;
- satelliteProxy.drawGrid({
- gridDataDetail: selectedGridData,
- useCustomColor: !isStandardColor.value,
- opacity: 1,
- zIndex: 11
+ // satelliteProxy.drawGrid({
+ // gridDataDetail: selectedGridDataDetail,
+ // useCustomColor: !isStandardColor.value,
+ // opacity: 1,
+ // zIndex: 11
+ // });
+ selectedfusionData.value.forEach((i) => {
+ const d = fusionDataList.value[i];
+ if (gridDataDetailMap.has(d.id)) {
+ const gdd = gridDataDetailMap.get(d.id);
+ satelliteProxy.drawTagGrid({
+ tag: d.id,
+ gridDataDetail: gdd,
+ useCustomColor: !isStandardColor.value,
+ opacity: 1,
+ zIndex: 11
+ });
+ }
});
}
@@ -243,29 +335,48 @@
import mapUtil from '@/utils/map/util';
import { fetchHistoryData } from '@/utils/factor/data';
import { useFetchData } from '@/composables/fetchData';
+import { useMissionStore } from '@/stores/mission';
-onMounted(() => (isUnmounted.value = false));
+onMounted(() => {
+ isUnmounted.value = false;
+ fetchMission();
+});
onUnmounted(() => {
mapUtil.clearMap();
isUnmounted.value = true;
});
-
const { loading, fetchData } = useFetchData(10000);
+
+const missionStore = useMissionStore();
+const missionLoading = ref(false);
const isUnmounted = ref(false);
const deviceType = ref(undefined);
const drawMode = ref(0);
// 鐩戞祴鏁版嵁
-const factorDatas = ref(new FactorDatas());
+// const factorDatas = ref(new FactorDatas());
+const factorDataMap = new Map();
// pm2.5
const factorType = 6;
-function onFetchData(dType, data) {
+function fetchMission() {
+ missionLoading.value = true;
+ missionStore
+ .fetchMission()
+ // .then((res) => {
+ // if (res.success && res.data.length > 0) {
+
+ // }
+ // })
+ .finally(() => (missionLoading.value = false));
+}
+
+function onFetchData(_factorDatas, dType, data) {
if (isUnmounted.value) return;
// todo 鏍规嵁璁惧绫诲瀷鍒囨崲鍦板浘鐩戞祴鍥犲瓙灞曠ず鍗曢�夋銆佹姌绾垮浘澶嶉�夋銆佹暟鎹〃鏍煎閫夋鐨勫洜瀛愮被鍨�
deviceType.value = dType;
- factorDatas.value.setData(data, drawMode.value, () => {
- factorDatas.value.refreshHeight(factorType.value);
+ _factorDatas.value.setData(data, drawMode.value, () => {
+ _factorDatas.value.refreshHeight(factorType.value);
});
}
@@ -275,7 +386,7 @@
// deviceCode.value = deviceCode;
const _startTime = moment(startTime).format('YYYY-MM-DD HH:mm:ss');
const _endTime = moment(endTime).format('YYYY-MM-DD HH:mm:ss');
- fetchData((page, pageSize) => {
+ return fetchData((page, pageSize) => {
return fetchHistoryData({
deviceType,
deviceCode,
@@ -283,15 +394,48 @@
endTime: _endTime,
page,
perPage: pageSize
- }).then((res) => onFetchData(deviceType, res.data));
+ });
+ // .then((res) => onFetchData(deviceType, res.data));
});
}
function draw() {
+ if (isUnmounted.value) return;
+
+ selectedfusionData.value.forEach((i) => {
+ const d = fusionDataList.value[i];
+
+ 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) {
// 鍒锋柊鍥句緥
- const factor = factorDatas.value.factor[factorType];
+ const factor = fd.factor[factorType];
sector.clearSector();
- factorDatas.value.refreshHeight(factorType);
- mapLine.drawLine(factorDatas.value, factor);
+ fd.refreshHeight(factorType);
+ mapLine.drawTagLine(missionCode, fd, factor);
}
</script>
+<style scoped>
+/* ::v-deep .el-divider__text {
+ background: #122b54;
+ color: white;
+} */
+</style>
diff --git a/src/views/satellitetelemetry/component/SatelliteSearchBar.vue b/src/views/satellitetelemetry/component/SatelliteSearchBar.vue
index 2533597..918112a 100644
--- a/src/views/satellitetelemetry/component/SatelliteSearchBar.vue
+++ b/src/views/satellitetelemetry/component/SatelliteSearchBar.vue
@@ -1,24 +1,21 @@
<template>
<!-- <el-row> -->
- <!-- <el-col :span="20"> -->
- <el-form label-position="right" label-width="60px" :inline="false">
- <el-form-item label="鍖哄煙">
- <OptionLocation2
- :level="3"
- :initValue="true"
- :checkStrictly="false"
- :allOption="true"
- v-model="location"
- ></OptionLocation2>
- </el-form-item>
- <OptionGridGroup
- ref="gridGroupRef"
- v-model="gridGroup"
- ></OptionGridGroup>
- </el-form>
- <!-- </el-col> -->
- <!-- <el-col :span="4"> -->
- <!-- <el-form-item>
+ <!-- <el-col :span="20"> -->
+ <el-form label-position="right" label-width="60px" :inline="false">
+ <el-form-item label="鍖哄煙">
+ <OptionLocation2
+ :level="3"
+ :initValue="true"
+ :checkStrictly="false"
+ :allOption="true"
+ v-model="location"
+ ></OptionLocation2>
+ </el-form-item>
+ <OptionGridGroup ref="gridGroupRef" v-model="gridGroup"></OptionGridGroup>
+ </el-form>
+ <!-- </el-col> -->
+ <!-- <el-col :span="4"> -->
+ <!-- <el-form-item>
<el-button
:loading="loading"
:disabled="!gridGroup"
@@ -30,25 +27,26 @@
鏌ヨ
</el-button>
</el-form-item> -->
- <!-- </el-col> -->
+ <!-- </el-col> -->
<!-- </el-row> -->
</template>
<script setup>
import { ref, watch } from 'vue';
defineProps({
- loading: Boolean,
+ loading: Boolean
});
const location = ref(undefined);
const gridGroup = ref(undefined);
const gridGroupRef = ref(null);
+const area = ref({});
const emits = defineEmits(['search']);
watch(location, (nv, ov) => {
if (nv != ov) {
- const area = {
+ area.value = {
provinceCode: nv.pCode,
provinceName: nv.pName,
cityCode: nv.cCode,
@@ -58,7 +56,7 @@
townCode: nv.tCode,
townName: nv.tName
};
- gridGroupRef.value.fetchGridGroup(area);
+ gridGroupRef.value.fetchGridGroup(area.value, 'origin');
}
});
@@ -73,4 +71,6 @@
function handleClick() {
emits('search', gridGroup.value);
}
+
+defineExpose({ area });
</script>
--
Gitblit v1.9.3