Niko
/
sy-water-data-board-ui
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

fix: 冲突

feature-v1.0.0
ruancuihong 1 month ago
parent
f185d436ba 1181be33ec
commit
ade4ea6164
7 changed files with 3719 additions and 2972 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 6144
      pnpm-lock.yaml
  2. 174
      src/hooks/web/useProject.tsx
  3. 1
      src/views/BottomPanel/index.vue
  4. 3
      src/views/Main/Map/components/LayerTree.vue
  5. 61
      src/views/Main/ProjectOperation/components/MonitorWarning.vue
  6. 2
      src/views/Main/ProjectOperation/index.vue
  7. 44
      src/views/Main/SafetyAppraise/index.vue

6144
pnpm-lock.yaml
View File

File diff suppressed because it is too large

174
src/hooks/web/useProject.tsx
View File

@ -1,9 +1,8 @@
import { reactive } from "vue"; import { reactive } from "vue";
import * as SyCim from "sy-cesium-sdk"; import * as SyCim from "sy-cesium-sdk";
import { LayerTypeEnum } from "@/enums/projectEnum"; import { LayerTypeEnum } from "@/enums/projectEnum";
import { queryLayersByPos } from "@/utils/mapUtils";
import axios from "axios"; import axios from "axios";
import { useProjectStore } from "@/store/modules/project"; import { throttle } from "lodash-es";
const clustering = reactive({ const clustering = reactive({
enabled: true, enabled: true,
pixelRange: 200, pixelRange: 200,
@ -274,26 +273,19 @@ const baseLayerActions: Record<string, any> = {
}; };
export function useLayer() { export function useLayer() {
const viewerClick = (e: any) => { const mouseMoveEvent = throttle((e: any) => {
const projectStore = useProjectStore(); const winPos = e.windowPosition;
const selectedLayers: any = projectStore.selectedLayers; const target = viewer.scene.pick(winPos);
queryLayersByPos(e.wgs84SurfacePosition, selectedLayers, (res: any) => { console.log(target);
if (res?.attributes?.showCode) { }, 500);
const { showCode, showName } = res?.attributes; const addMouseMove = () => {
window.$bus.$emit("open-water-dialog", { window.viewer?.on(SyCim.MouseEventType.MOUSE_MOVE, mouseMoveEvent, window.viewer);
code: showCode,
name: showName,
});
}
});
}; };
const addViewerClick = () => { const removeMouseMove = () => {
window.viewer?.on(SyCim.MouseEventType.CLICK, viewerClick, window.viewer); window.viewer?.off(SyCim.MouseEventType.MOUSE_MOVE, mouseMoveEvent, window.viewer);
};
const removeViewerClick = () => {
window.viewer?.off(SyCim.MouseEventType.CLICK, viewerClick, window.viewer);
}; };
const addLayer = async (layerData: any) => { const addLayer = async (layerData: any) => {
// removeMouseMove();
const { layerType, url, id, isNeedCluster } = layerData; const { layerType, url, id, isNeedCluster } = layerData;
let action = null; let action = null;
// 超图 S3M图层 // 超图 S3M图层
@ -317,49 +309,92 @@ export function useLayer() {
} }
if (!layerType || !(action = layerActions[layerType as string])) return; if (!layerType || !(action = layerActions[layerType as string])) return;
let layer: any = await action(layerData); let layer: any = await action(layerData);
if (isNeedCluster === "1" && layerData.nameCn === "水库点") { if (isNeedCluster === "1") {
// let baseUrl = import.meta.env.VITE_BASE_URL; let baseUrl = import.meta.env.VITE_BASE_URL;
// const data = await getFeatures(layerData); const data = await getFeatures(layerData);
// if (data?.features?.[0]?.geometry?.type === 'Point') { if (data?.features?.[0]?.geometry?.type === 'Point') {
// let layerConfig = {}; let layerConfig = {};
// switch (layerData.nameCn) { switch (layerData.nameCn) {
// case "水库点": case "水库点":
// layerConfig = { layerConfig = {
// isUniqueRender: true, isUniqueRender: true,
// field: "ENG_SCAL", field: "ENG_SCAL",
// fieldOptions: [ fieldOptions: [
// { name: "1.0", attr: "image", value: "reservoir_big.png" }, { name: "1.0", attr: "image", value: "reservoir_big.png" },
// { name: "2.0", attr: "image", value: "reservoir_big.png" }, { name: "2.0", attr: "image", value: "reservoir_big.png" },
// { name: "3.0", attr: "image", value: "reservoir_normal.png" }, { name: "3.0", attr: "image", value: "reservoir_normal.png" },
// { name: "4.0", attr: "image", value: "reservoir_small.png" }, { name: "4.0", attr: "image", value: "reservoir_small.png" },
// { name: "5.0", attr: "image", value: "reservoir_small.png" }, { name: "5.0", attr: "image", value: "reservoir_small.png" },
// ], ],
// image: "map-title-o.png", width: 24,
// }; height: 24,
// break; image: "reservoir_big.png",
// } };
// layer = new SyCim.ClusterWfsLayer(layerData.id, { break;
// data, case "水闸":
// symbol: { layerConfig = {
// type: "billboardP", isUniqueRender: true,
// imageProxy: `${baseUrl}/img/map/`, // 图片代理 field: "ENG_SCAL",
// style: { fieldOptions: [
// clampToGround: false, { name: "1.0", attr: "image", value: "sluice_big.png" },
// image: "reservoir_small.png", { name: "2.0", attr: "image", value: "sluice_big.png" },
// ...layerConfig, { name: "3.0", attr: "image", value: "sluice_middle.png" },
// }, { name: "4.0", attr: "image", value: "sluice_small.png" },
// }, { name: "5.0", attr: "image", value: "sluice_small.png" },
// clustering: { ],
// enabled: clustering.enabled, image: "sluice_middle.png",
// pixelRange: clusstering.pixelRange, };
// minimumClusterSize: clustering.minimumClusterSize, break;
// clusterEvent: undefined, }
// clusterColors: undefined, // 聚合点颜色 layer = new SyCim.ClusterWfsLayer(layerData.id, {
// getImage: undefined, // 获取聚合图片的函数 data,
// }, symbol: {
// }); type: "billboardP",
// } imageProxy: `${baseUrl}/img/map/`, // 图片代理
addViewerClick(); style: {
clampToGround: true,
image: "reservoir_small.png",
...layerConfig,
},
clustering: {
enabled: clustering.enabled,
pixelRange: clustering.pixelRange,
minimumClusterSize: clustering.minimumClusterSize,
clusterEvent: undefined,
clusterColors: undefined, // 聚合点颜色
getImage: undefined, // 获取聚合图片的函数
},
},
});
layer.bindPopup(
(e: any) => {
const graphic = e.graphic;
if (graphic) {
const attr = graphic?.attr;
const code = attr?.RES_CODE ?? attr?.WAGA_CODE;
const name = attr?.RES_NAME ?? attr?.WAGA_NAME;
const scale = attr?.ENG_SCAL ?? attr?.WAGA_TYPE;
if (attr?.RES_CODE) {
window.$bus.$emit("open-water-dialog", {
code,
name,
scale
});
return "";
} else {
return `<div class="box">
<div class="detail-item"><span>水闸名称</span>：${name}</div>
<div class="detail-item"><span>水闸编码</span>：${code}</div>
<div class="detail-item"><span>水闸位置</span>：${attr.WAGA_LOC}</div>
</div>`;
}
}
},
{
closeButton: true,
},
);
}
} }
layer && window.viewer.addLayer(layer); layer && window.viewer.addLayer(layer);
if (["013000"].includes(layerType)) { if (["013000"].includes(layerType)) {
@ -378,9 +413,10 @@ export function useLayer() {
model.id = layerData.id; model.id = layerData.id;
layer.addGraphic(model); layer.addGraphic(model);
} }
// addMouseMove();
}; };
const removeLayer = (layerData: any) => { const removeLayer = (layerData: any) => {
const { id, layerType, isNeedCluster, nameCn } = layerData; const { id, layerType, isNeedCluster } = layerData;
if (!layerType) return; if (!layerType) return;
const type: any = LayerTypeEnum[layerType as never]; const type: any = LayerTypeEnum[layerType as never];
@ -395,8 +431,13 @@ export function useLayer() {
} as any); } as any);
} }
if (isNeedCluster === "1" && nameCn === "水库点") { if (isNeedCluster === "1") {
removeViewerClick(); const layer = window.viewer.getLayer(id);
layer?.clear();
window.viewer.removeLayer({
id,
type: SyCim.LayerType['CLUSTER_WFS_PRIMITIVE'],
} as any);
} }
}; };
const zoomToLayer = (data: any) => { const zoomToLayer = (data: any) => {
@ -407,7 +448,8 @@ export function useLayer() {
addLayer, addLayer,
removeLayer, removeLayer,
zoomToLayer, zoomToLayer,
removeViewerClick, addMouseMove,
removeMouseMove,
}; };
} }

1
src/views/BottomPanel/index.vue
View File

@ -18,7 +18,6 @@ const projectStore = useProjectStore();
defineOptions({ defineOptions({
name: "bottom-panel", name: "bottom-panel",
}); });
const activeLayers = ref<any[]>([]);
const listName = ref(["水库点", "堤防", "水闸"]); const listName = ref(["水库点", "堤防", "水闸"]);
const layerData: any = computed(() => { const layerData: any = computed(() => {
const list: any[] = []; const list: any[] = [];

3
src/views/Main/Map/components/LayerTree.vue
View File

@ -43,7 +43,7 @@ import { useProjectStore } from "@/store/modules/project";
import { useLayer } from "@/hooks/web/useProject"; import { useLayer } from "@/hooks/web/useProject";
import { flattenTree } from "@/utils/index"; import { flattenTree } from "@/utils/index";
import Tree from "@/components/Tree/index.vue"; import Tree from "@/components/Tree/index.vue";
const { zoomToLayer, removeViewerClick } = useLayer(); const { zoomToLayer } = useLayer();
const projectStore = useProjectStore(); const projectStore = useProjectStore();
defineOptions({ defineOptions({
@ -130,6 +130,5 @@ onMounted(() => {
onBeforeUnmount(() => { onBeforeUnmount(() => {
window.$bus.$off("change-layer"); window.$bus.$off("change-layer");
removeViewerClick();
}); });
</script> </script>

61
src/views/Main/ProjectOperation/components/MonitorWarning.vue
View File

@ -88,71 +88,70 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch } from 'vue'; import { ref, watch } from "vue";
import dayjs from 'dayjs'; import dayjs from "dayjs";
import { getReservoirCZAlarmPageData } from '@/api/reservoir'; import { getReservoirCZAlarmPageData } from "@/api/reservoir";
const props = defineProps({ const props = defineProps({
resCode: { resCode: {
type: String, type: String,
default: '' default: "",
} },
}); });
const dateRange: any = ref('0'); const dateRange: any = ref("0");
const startDate: any = ref(dayjs().subtract(1, 'month').format('YYYY-MM-DD HH:mm:ss')); const startDate: any = ref(dayjs().subtract(1, "month").format("YYYY-MM-DD HH:mm:ss"));
const endDate: any = ref(dayjs().format('YYYY-MM-DD HH:mm:ss')); const endDate: any = ref(dayjs().format("YYYY-MM-DD HH:mm:ss"));
const tableData: any = ref([]); const tableData: any = ref([]);
const paramsData: any = ref({ const paramsData: any = ref({
pageSize: 10, pageSize: 10,
pageNum: 1, pageNum: 1,
total: 0 total: 0,
}); });
const emit = defineEmits(['node-click']);
watch( watch(
() => props.resCode, () => props.resCode,
(val) => { (val) => {
getTableData(val); getTableData(val);
}, },
{ immediate: true } { immediate: true },
); );
// onMounted(() => { // onMounted(() => {
// getTableData(); // getTableData();
// }); // });
function getTableData(code = '') { function getTableData(code = "") {
getReservoirCZAlarmPageData({ getReservoirCZAlarmPageData({
startDate: startDate.value + ' 00:00:00', startDate: startDate.value + " 00:00:00",
endDate: endDate.value + ' 23:59:59', endDate: endDate.value + " 23:59:59",
pageSize: paramsData.value.pageSize, pageSize: paramsData.value.pageSize,
pageNum: paramsData.value.pageNum pageNum: paramsData.value.pageNum,
}).then((res: any) => { }).then((res: any) => {
console.log('res >>>>> ', res); console.log("res >>>>> ", res);
tableData.value = res.records || []; tableData.value = res.records || [];
paramsData.value.total = res.total; paramsData.value.total = res.total;
}); });
} }
function handleChangeDate(value: any) { function handleChangeDate(value: any) {
switch (value) { switch (value) {
case '0': case "0":
startDate.value = dayjs().subtract(1, 'month').format('YYYY-MM-DD HH:mm:ss'); startDate.value = dayjs().subtract(1, "month").format("YYYY-MM-DD HH:mm:ss");
endDate.value = dayjs().format('YYYY-MM-DD HH:mm:ss'); endDate.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
break; break;
case '1': case "1":
startDate.value = dayjs().subtract(1, 'day').format('YYYY-MM-DD HH:mm:ss'); startDate.value = dayjs().subtract(1, "day").format("YYYY-MM-DD HH:mm:ss");
endDate.value = dayjs().format('YYYY-MM-DD HH:mm:ss'); endDate.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
break; break;
case '2': case "2":
startDate.value = dayjs().subtract(7, 'day').format('YYYY-MM-DD HH:mm:ss'); startDate.value = dayjs().subtract(7, "day").format("YYYY-MM-DD HH:mm:ss");
endDate.value = dayjs().format('YYYY-MM-DD HH:mm:ss'); endDate.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
break; break;
case '3': case "3":
startDate.value = dayjs().subtract(3, 'month').format('YYYY-MM-DD HH:mm:ss'); startDate.value = dayjs().subtract(3, "month").format("YYYY-MM-DD HH:mm:ss");
endDate.value = dayjs().format('YYYY-MM-DD HH:mm:ss'); endDate.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
break; break;
case '4': case "4":
startDate.value = dayjs().subtract(1, 'year').format('YYYY-MM-DD HH:mm:ss'); startDate.value = dayjs().subtract(1, "year").format("YYYY-MM-DD HH:mm:ss");
endDate.value = dayjs().format('YYYY-MM-DD HH:mm:ss'); endDate.value = dayjs().format("YYYY-MM-DD HH:mm:ss");
break; break;
default: default:
break; break;

2
src/views/Main/ProjectOperation/index.vue
View File

@ -30,7 +30,7 @@
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, defineOptions, defineEmits, defineProps, watch, onMounted } from "vue"; import { ref, watch, onMounted } from "vue";
import BaseInfo from "./components/BaseInfo.vue"; import BaseInfo from "./components/BaseInfo.vue";
import DataStatistics from "./components/DataStatistics.vue"; import DataStatistics from "./components/DataStatistics.vue";
import MonitorWarning from "./components/MonitorWarning.vue"; import MonitorWarning from "./components/MonitorWarning.vue";

44
src/views/Main/SafetyAppraise/index.vue
View File

@ -41,29 +41,29 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch, computed, reactive } from 'vue'; import { ref, onMounted, watch, computed, reactive } from "vue";
import { useChartStore } from '@/store/modules/chart'; import { useChartStore } from "@/store/modules/chart";
const chartStore = useChartStore(); const chartStore = useChartStore();
defineOptions({ defineOptions({
name: 'safety-appraise' name: "safety-appraise",
}); });
const props = defineProps({ const props = defineProps({
timeRange: { timeRange: {
type: Object, type: Object,
default: () => ({ default: () => ({
startTime: '', startTime: "",
endTime: '' endTime: "",
}) }),
} },
}); });
const taskCount = ref(0); const taskCount = ref(0);
const safetyData: any = ref([]); const safetyData: any = ref([]);
const safety = reactive<any>({ const safety = reactive<any>({
rws: 0, rws: 0,
djd: 0, djd: 0,
yjd: 0 yjd: 0,
}); });
const okNum: any = computed(() => { const okNum: any = computed(() => {
// const num = safetyData.value.find((item: any) => item.name === '任务数'); // const num = safetyData.value.find((item: any) => item.name === '任务数');
@ -84,19 +84,19 @@ const getChartData = async (time: any) => {
// endTime: '', // endTime: '',
// startTime: '', // startTime: '',
...time, ...time,
group: 'K4' group: "K4",
}; };
const data: any = await chartStore.initStatisticChart(pramas); const data: any = await chartStore.initStatisticChart(pramas);
if (data?.yaxis?.length) { if (data?.yaxis?.length) {
let newArr = data.yaxis.flatMap((v: any) => v.series); let newArr = data.yaxis.flatMap((v: any) => v.series);
newArr?.forEach((item: any) => { newArr?.forEach((item: any) => {
if (item.code === 'YZT_TOUR_CHECK_RWS_SUM') { if (item.code === "YZT_TOUR_CHECK_RWS_SUM") {
safety.rws = +(+item.sum).toFixed(0); safety.rws = +(+item.sum).toFixed(0);
} }
if (item.code === 'YZT_TOUR_CHECK_DJD_SUM') { if (item.code === 'YZT_TOUR_CHECK_DJD_SUM') {
safety.djd = +(+item.sum).toFixed(0); safety.djd = +(+item.sum).toFixed(0);
} }
if (item.code === 'YZT_TOUR_CHECK_YJD_SUM') { if (item.code === "YZT_TOUR_CHECK_YJD_SUM") {
safety.yjd = +(+item.sum).toFixed(0); safety.yjd = +(+item.sum).toFixed(0);
} }
// safetyData.value.push({ // safetyData.value.push({
@ -110,15 +110,15 @@ const getChartData = async (time: any) => {
// 默认数据 // 默认数据
safetyData.value = [ safetyData.value = [
{ {
name: '任务数', name: "任务数",
value: 0, value: 0,
unit: '' unit: "",
}, },
{ {
name: '已完成', name: "已完成",
value: 0, value: 0,
unit: '' unit: "",
} },
]; ];
} }
}; };
@ -129,7 +129,7 @@ watch(
taskCount.value = 0; taskCount.value = 0;
safetyData.value = []; safetyData.value = [];
getChartData(newVal); getChartData(newVal);
} },
); );
onMounted(() => { onMounted(() => {
// getChartData(props.timeRange); // getChartData(props.timeRange);
@ -151,7 +151,7 @@ onMounted(() => {
.appraise-item { .appraise-item {
width: 104px; width: 104px;
height: 119px; height: 119px;
background: url('@/assets/card/safety-item-bg.png') no-repeat; background: url("@/assets/card/safety-item-bg.png") no-repeat;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
@ -165,8 +165,8 @@ onMounted(() => {
text-align: center; text-align: center;
letter-spacing: 0em; letter-spacing: 0em;
font-variation-settings: 'opsz' auto; font-variation-settings: "opsz" auto;
font-feature-settings: 'kern' on; font-feature-settings: "kern" on;
color: #ffffff; color: #ffffff;
} }
.count { .count {
@ -203,7 +203,7 @@ onMounted(() => {
line-height: 22px; line-height: 22px;
letter-spacing: 0px; letter-spacing: 0px;
font-variation-settings: 'opsz' auto; font-variation-settings: "opsz" auto;
color: rgba(0, 0, 0, 0.55); color: rgba(0, 0, 0, 0.55);
span { span {
font-family: DIN; font-family: DIN;
@ -212,7 +212,7 @@ onMounted(() => {
line-height: 22px; line-height: 22px;
letter-spacing: 0px; letter-spacing: 0px;
font-variation-settings: 'opsz' auto; font-variation-settings: "opsz" auto;
&.ok { &.ok {
color: #28ce8e; color: #28ce8e;
} }

Write Preview
Loading…
Cancel
Save