diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/inputSearch.vue b/src/views/pictureOnMap/inputSearch.vue
index 282aa28..b30703a 100644
--- a/src/views/pictureOnMap/inputSearch.vue
+++ b/src/views/pictureOnMap/inputSearch.vue
@@ -61,7 +61,7 @@
appStore.MapData.map(item => {
SelectList.value = SelectList.value.concat(item.data);
});
- console.log('MapData', appStore.MapData, SelectList.value);
+ // console.log('MapData', appStore.MapData, SelectList.value);
filterList.value = JSON.parse(JSON.stringify(SelectList.value));
}
@@ -93,6 +93,7 @@
onMounted(() => {
bus.on('YQ_head', val => {
+ console.log('appStore.MapData',appStore.MapData);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/inputSearch.vue b/src/views/pictureOnMap/inputSearch.vue
index 282aa28..b30703a 100644
--- a/src/views/pictureOnMap/inputSearch.vue
+++ b/src/views/pictureOnMap/inputSearch.vue
@@ -61,7 +61,7 @@
appStore.MapData.map(item => {
SelectList.value = SelectList.value.concat(item.data);
});
- console.log('MapData', appStore.MapData, SelectList.value);
+ // console.log('MapData', appStore.MapData, SelectList.value);
filterList.value = JSON.parse(JSON.stringify(SelectList.value));
}
@@ -93,6 +93,7 @@
onMounted(() => {
bus.on('YQ_head', val => {
+ console.log('appStore.MapData',appStore.MapData);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
index 09f4910..b627d68 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
@@ -137,10 +137,7 @@
{{ item.abbreviation ? item.abbreviation : "" }}
-
-
-
+
水量分析
@@ -158,6 +155,8 @@
import bus from "@/bus";
// 引入接口
import * as MonitorAPI from "@/api/MonitoringAnalysis.js";
+import { getSectionByWellCode } from "@/api/MonitorAssetsOnMap";
+
// 引入echarts组件
// 纵向立体柱状体以及标线和折现
import DraBarCharts2Y from "./components/DraBarCharts2Y.vue";
@@ -426,6 +425,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData3();
+ getData7();
}
if (item.sort == 2) {
bus.emit("panelDataToMap", {
@@ -446,6 +450,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData2();
+ getData3();
}
if (item.sort == 3) {
bus.emit("panelDataToMap", {
@@ -459,127 +468,149 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData4();
+ getData5();
}
- // 切换时进行数据请求,默认视角请求
- clearEchartsData();
- getData1();
- getData3();
+ if (item.sort == 4) {
+ bus.emit("panelDataToMap", {
+ name: item.abbreviation,
+ id: item.id,
+ });
+ clearEchartsData();
+ getData2();
+ getData4();
+ getData5();
+ }
};
// 分区点击切换
-const FenQuClick = (properties) => {
- console.log("FenQuClick", properties);
- if (!!!properties.pid) return;
- // 请求面包屑的数据
- let params = {
- regionType: AllData.TypeID,
- id: Number(properties.pid),
- };
- MonitorAPI.lineGrade(params).then((res) => {
- if (res && res.code == 200) {
- // 默认设置基础的分区
- if (AllData.TypeID == "sewage") {
- // 污水
- AllData.TitleName[0].abbreviation = "一级分区";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
- } else {
- // 雨水
- AllData.TitleName[0].abbreviation = "一级流域";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
+const FenQuClick = (Row) => {
+ console.log("FenQuClick", Row.properties, Row.layerId);
+ //判断点击的是片区还是点位
+ if (Row.layerId == "排水分区") {
+ // 片区
+ AllData.RightShow = false;
+ // if (!!!Row.properties.pid) return;
+ // 原本是判断没有pid就不请求↑↑↑,现在gis图层数据改变,从而使用层级来判断↓↓↓
+ if (Row.properties.level == "4") return;
+ // 请求面包屑的数据
+ let params = {
+ regionType: AllData.TypeID,
+ id: Number(Row.properties.pid || Row.properties.w_id),
+ };
+ MonitorAPI.lineGrade(params).then((res) => {
+ if (res && res.code == 200) {
+ // 默认设置基础的分区
+ if (AllData.TypeID == "sewage") {
+ // 污水
+ AllData.TitleName[0].abbreviation = "一级分区";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ } else {
+ // 雨水
+ AllData.TitleName[0].abbreviation = "一级流域";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ }
+ // 设置1 2 3 4 级分区
+ clearMianBaoData();
+ res.data.forEach((element) => {
+ if (element.grade == "one") {
+ AllData.TitleName[1] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "two",
+ sort: 1,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "two") {
+ AllData.TitleName[2] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "three",
+ sort: 2,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "three") {
+ AllData.TitleName[3] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "four",
+ sort: 3,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "four") {
+ AllData.TitleName[4] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "five",
+ sort: 4,
+ Name: element.name,
+ };
+ }
+ });
+ // }
+ // 赋值需要进行echarts数据请求的数据
+ AllData.regionGrade =
+ res.data.length == 1
+ ? "two"
+ : res.data.length == 2
+ ? "three"
+ : res.data.length == 3
+ ? "four"
+ : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
+ AllData.regionName = AllData.TitleName[res.data.length].Name;
+ AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
+ // clearEchartsData();
+ if (AllData.regionGrade == "two") {
+ // 二级
+ console.log("二级");
+ getData1();
+ getData2();
+ getData3();
+ } else if (AllData.regionGrade == "three") {
+ // 三级
+ console.log("三级");
+ getData1();
+ getData4();
+ getData5();
+ } else if (AllData.regionGrade == "four") {
+ // 四级
+ console.log("四级");
+ getData2();
+ getData4();
+ getData5();
+ } else {
+ // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
+ console.log("五级");
+ }
}
- // 设置1 2 3 4 级分区
- clearMianBaoData();
- res.data.forEach((element) => {
- if (element.grade == "one") {
- AllData.TitleName[1] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "two",
- sort: 1,
- Name: element.name,
- };
- }
- if (element.grade == "two") {
- AllData.TitleName[2] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "three",
- sort: 2,
- Name: element.name,
- };
- }
- if (element.grade == "three") {
- AllData.TitleName[3] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "four",
- sort: 3,
- Name: element.name,
- };
- }
- if (element.grade == "four") {
- AllData.TitleName[4] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "five",
- sort: 4,
- Name: element.name,
- };
- }
+ });
+ } else if (Row.layerId == "point") {
+ // 点位
+ if (Row.properties.pointType == "rainwater_pipeline_quality") {
+ AllData.RightShow = true;
+ // Row.properties.wellCode
+ // 获取管网信息
+ getSectionByWellCode(Row.properties.wellcode).then((res) => {
+ console.log("res.data", res.data);
+ GetpoumianList.value = res.data;
});
- // }
- // 赋值需要进行echarts数据请求的数据
- AllData.regionGrade =
- res.data.length == 1
- ? "two"
- : res.data.length == 2
- ? "three"
- : res.data.length == 3
- ? "four"
- : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
- AllData.regionName = AllData.TitleName[res.data.length].Name;
- AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
- // clearEchartsData();
- if (AllData.regionGrade == "two") {
- // 二级
- console.log("二级");
- getData1();
- getData2();
- getData3();
- } else if (AllData.regionGrade == "three") {
- // 三级
- console.log("三级");
- getData1();
- getData4();
- getData5();
- } else if (AllData.regionGrade == "four") {
- // 四级
- console.log("四级");
- getData2();
- getData4();
- getData5();
- } else {
- // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
- console.log("五级");
- }
+ // 上下游水量分析
+ getDataSXY();
}
- });
+ }
};
-const events_params = {
- setHighlight: { key: "setHighlight" },
- setLayerVisible: { key: "setLayerVisible" },
- clearTemporaryData: { key: "clearTemporaryData" },
-};
-const operationLayer = (name, visible) => {
- const { setLayerVisible, setHighlight } = events_params;
- bus.emit(setLayerVisible.key, { layername: name, isCheck: visible });
-};
// 清除面包屑的数据
const clearMianBaoData = () => {
AllData.TitleName[1] = {
@@ -652,21 +683,45 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "two") {
- AllData.chartData1.xAxis = res.data.regionNameList;
- AllData.chartData1.yAxis = res.data.pipelinePointCount; //运行风险点位数
- AllData.chartData1.yAxis2 = res.data.pipelineRunRiskPointCount; //管网监测点位数
- AllData.chartData1.yAxis_Name = "运行风险数";
- AllData.chartData1.yAxis_Unit = "个";
- AllData.chartData1.yAxis2_Name = "点位数";
- AllData.chartData1.yAxis_Unit = "个";
+ AllData.chartData1.xAxis = res.data.regionNameList; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = false; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = res.data.pipelinePointCount; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = res.data.pipelineRunRiskPointCount; //数据2
+ AllData.chartData1.yAxis2_bar_Name = "运行风险数"; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "";
+ AllData.chartData1.yAxis2_line_Index = 0;
+ AllData.chartData1.yAxis3_line = null;
+ AllData.chartData1.yAxis3_line_Name = "";
+ AllData.chartData1.yAxis3_line_Index = 1;
AllData.refresh1++;
}
if (AllData.regionGrade == "four") {
+ // AllData.chartData3.xAxis = res.data.regionNameList;
+ // AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
+ // AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
+ // AllData.chartData3.yAxis_Name = "溢流风险";
+ // AllData.chartData3.yAxis2_Name = "满管风险";
+ // AllData.refresh3++;
AllData.chartData3.xAxis = res.data.regionNameList;
- AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
- AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
- AllData.chartData3.yAxis_Name = "溢流风险";
- AllData.chartData3.yAxis2_Name = "满管风险";
+ AllData.chartData3.yAxis1_bar = null;
+ AllData.chartData3.yAxis1_bar_Name = "";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "";
+ AllData.chartData3.yAxis2_line = res.data.fullPipeTimesList;
+ AllData.chartData3.yAxis2_line_Name = "满管";
+ AllData.chartData3.yAxis2_line_Index = 0;
+ AllData.chartData3.yAxis3_line = res.data.overFlowRiskTimesList;
+ AllData.chartData3.yAxis3_line_Name = "溢流";
+ AllData.chartData3.yAxis3_line_Index = 0;
+ AllData.chartData3.y1_Unit = "次"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
AllData.refresh3++;
}
}
@@ -695,7 +750,18 @@
AllData.refresh3++;
}
if (AllData.regionGrade == "two") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.outletsNumber;
+ AllData.chartData3.yAxis1_bar_Name = "排口";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = res.data.inflowWater;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = true;
+ AllData.refresh3++;
}
}
});
@@ -709,10 +775,27 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "three") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.pointNumber;
+ AllData.chartData3.yAxis1_bar_Name = "渍水风险点";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = null;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
+ AllData.refresh3++;
}
if (AllData.regionGrade == "four") {
- // AllData.chartData2
+ //
+ AllData.chartData2.xAxis = res.data.partitionName;
+ AllData.chartData2.yAxis = null;
+ AllData.chartData2.yAxis2 = res.data.pointNumber;
+ AllData.chartData2.yAxis2_Name = "总长度";
+ AllData.chartData2.yAxis_Name = null;
+ AllData.refresh2++;
}
}
});
@@ -757,10 +840,63 @@
const getData5 = () => {
MonitorAPI.waterRegionWaterYieldAnalysis({
waterRegionId: AllData.waterRegionCode,
- }).then((res) => {});
+ }).then((res) => {
+ if (res && res.code == 200) {
+ let XData = [];
+ let YData1 = [];
+ let YData2 = [];
+ let YData3 = [];
+ res.data.forEach((element) => {
+ XData.push(element.waterRegionName); //X轴数据
+ YData1.push(element.siteNum); //点位数量
+ YData2.push(element.inWaterYield); //进水
+ YData3.push(element.outWaterYield); //出水
+ });
+ if (AllData.regionGrade == "three") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = YData2;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ if (AllData.regionGrade == "four") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "接驳点数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ }
+ });
};
-// 获取数据 刘芳阳
-const getData6 = () => {};
+// 获取数据 刘芳阳 上下游分析
+const getDataSXY = () => {
+ MonitorAPI.siteWaterYieldAnalysis().then((res) => {});
+};
// 一级界面的河湖水情
// 清除本底分析echarts的数据
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/inputSearch.vue b/src/views/pictureOnMap/inputSearch.vue
index 282aa28..b30703a 100644
--- a/src/views/pictureOnMap/inputSearch.vue
+++ b/src/views/pictureOnMap/inputSearch.vue
@@ -61,7 +61,7 @@
appStore.MapData.map(item => {
SelectList.value = SelectList.value.concat(item.data);
});
- console.log('MapData', appStore.MapData, SelectList.value);
+ // console.log('MapData', appStore.MapData, SelectList.value);
filterList.value = JSON.parse(JSON.stringify(SelectList.value));
}
@@ -93,6 +93,7 @@
onMounted(() => {
bus.on('YQ_head', val => {
+ console.log('appStore.MapData',appStore.MapData);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
index 09f4910..b627d68 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
@@ -137,10 +137,7 @@
{{ item.abbreviation ? item.abbreviation : "" }}
-
-
-
+
水量分析
@@ -158,6 +155,8 @@
import bus from "@/bus";
// 引入接口
import * as MonitorAPI from "@/api/MonitoringAnalysis.js";
+import { getSectionByWellCode } from "@/api/MonitorAssetsOnMap";
+
// 引入echarts组件
// 纵向立体柱状体以及标线和折现
import DraBarCharts2Y from "./components/DraBarCharts2Y.vue";
@@ -426,6 +425,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData3();
+ getData7();
}
if (item.sort == 2) {
bus.emit("panelDataToMap", {
@@ -446,6 +450,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData2();
+ getData3();
}
if (item.sort == 3) {
bus.emit("panelDataToMap", {
@@ -459,127 +468,149 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData4();
+ getData5();
}
- // 切换时进行数据请求,默认视角请求
- clearEchartsData();
- getData1();
- getData3();
+ if (item.sort == 4) {
+ bus.emit("panelDataToMap", {
+ name: item.abbreviation,
+ id: item.id,
+ });
+ clearEchartsData();
+ getData2();
+ getData4();
+ getData5();
+ }
};
// 分区点击切换
-const FenQuClick = (properties) => {
- console.log("FenQuClick", properties);
- if (!!!properties.pid) return;
- // 请求面包屑的数据
- let params = {
- regionType: AllData.TypeID,
- id: Number(properties.pid),
- };
- MonitorAPI.lineGrade(params).then((res) => {
- if (res && res.code == 200) {
- // 默认设置基础的分区
- if (AllData.TypeID == "sewage") {
- // 污水
- AllData.TitleName[0].abbreviation = "一级分区";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
- } else {
- // 雨水
- AllData.TitleName[0].abbreviation = "一级流域";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
+const FenQuClick = (Row) => {
+ console.log("FenQuClick", Row.properties, Row.layerId);
+ //判断点击的是片区还是点位
+ if (Row.layerId == "排水分区") {
+ // 片区
+ AllData.RightShow = false;
+ // if (!!!Row.properties.pid) return;
+ // 原本是判断没有pid就不请求↑↑↑,现在gis图层数据改变,从而使用层级来判断↓↓↓
+ if (Row.properties.level == "4") return;
+ // 请求面包屑的数据
+ let params = {
+ regionType: AllData.TypeID,
+ id: Number(Row.properties.pid || Row.properties.w_id),
+ };
+ MonitorAPI.lineGrade(params).then((res) => {
+ if (res && res.code == 200) {
+ // 默认设置基础的分区
+ if (AllData.TypeID == "sewage") {
+ // 污水
+ AllData.TitleName[0].abbreviation = "一级分区";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ } else {
+ // 雨水
+ AllData.TitleName[0].abbreviation = "一级流域";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ }
+ // 设置1 2 3 4 级分区
+ clearMianBaoData();
+ res.data.forEach((element) => {
+ if (element.grade == "one") {
+ AllData.TitleName[1] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "two",
+ sort: 1,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "two") {
+ AllData.TitleName[2] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "three",
+ sort: 2,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "three") {
+ AllData.TitleName[3] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "four",
+ sort: 3,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "four") {
+ AllData.TitleName[4] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "five",
+ sort: 4,
+ Name: element.name,
+ };
+ }
+ });
+ // }
+ // 赋值需要进行echarts数据请求的数据
+ AllData.regionGrade =
+ res.data.length == 1
+ ? "two"
+ : res.data.length == 2
+ ? "three"
+ : res.data.length == 3
+ ? "four"
+ : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
+ AllData.regionName = AllData.TitleName[res.data.length].Name;
+ AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
+ // clearEchartsData();
+ if (AllData.regionGrade == "two") {
+ // 二级
+ console.log("二级");
+ getData1();
+ getData2();
+ getData3();
+ } else if (AllData.regionGrade == "three") {
+ // 三级
+ console.log("三级");
+ getData1();
+ getData4();
+ getData5();
+ } else if (AllData.regionGrade == "four") {
+ // 四级
+ console.log("四级");
+ getData2();
+ getData4();
+ getData5();
+ } else {
+ // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
+ console.log("五级");
+ }
}
- // 设置1 2 3 4 级分区
- clearMianBaoData();
- res.data.forEach((element) => {
- if (element.grade == "one") {
- AllData.TitleName[1] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "two",
- sort: 1,
- Name: element.name,
- };
- }
- if (element.grade == "two") {
- AllData.TitleName[2] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "three",
- sort: 2,
- Name: element.name,
- };
- }
- if (element.grade == "three") {
- AllData.TitleName[3] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "four",
- sort: 3,
- Name: element.name,
- };
- }
- if (element.grade == "four") {
- AllData.TitleName[4] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "five",
- sort: 4,
- Name: element.name,
- };
- }
+ });
+ } else if (Row.layerId == "point") {
+ // 点位
+ if (Row.properties.pointType == "rainwater_pipeline_quality") {
+ AllData.RightShow = true;
+ // Row.properties.wellCode
+ // 获取管网信息
+ getSectionByWellCode(Row.properties.wellcode).then((res) => {
+ console.log("res.data", res.data);
+ GetpoumianList.value = res.data;
});
- // }
- // 赋值需要进行echarts数据请求的数据
- AllData.regionGrade =
- res.data.length == 1
- ? "two"
- : res.data.length == 2
- ? "three"
- : res.data.length == 3
- ? "four"
- : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
- AllData.regionName = AllData.TitleName[res.data.length].Name;
- AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
- // clearEchartsData();
- if (AllData.regionGrade == "two") {
- // 二级
- console.log("二级");
- getData1();
- getData2();
- getData3();
- } else if (AllData.regionGrade == "three") {
- // 三级
- console.log("三级");
- getData1();
- getData4();
- getData5();
- } else if (AllData.regionGrade == "four") {
- // 四级
- console.log("四级");
- getData2();
- getData4();
- getData5();
- } else {
- // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
- console.log("五级");
- }
+ // 上下游水量分析
+ getDataSXY();
}
- });
+ }
};
-const events_params = {
- setHighlight: { key: "setHighlight" },
- setLayerVisible: { key: "setLayerVisible" },
- clearTemporaryData: { key: "clearTemporaryData" },
-};
-const operationLayer = (name, visible) => {
- const { setLayerVisible, setHighlight } = events_params;
- bus.emit(setLayerVisible.key, { layername: name, isCheck: visible });
-};
// 清除面包屑的数据
const clearMianBaoData = () => {
AllData.TitleName[1] = {
@@ -652,21 +683,45 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "two") {
- AllData.chartData1.xAxis = res.data.regionNameList;
- AllData.chartData1.yAxis = res.data.pipelinePointCount; //运行风险点位数
- AllData.chartData1.yAxis2 = res.data.pipelineRunRiskPointCount; //管网监测点位数
- AllData.chartData1.yAxis_Name = "运行风险数";
- AllData.chartData1.yAxis_Unit = "个";
- AllData.chartData1.yAxis2_Name = "点位数";
- AllData.chartData1.yAxis_Unit = "个";
+ AllData.chartData1.xAxis = res.data.regionNameList; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = false; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = res.data.pipelinePointCount; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = res.data.pipelineRunRiskPointCount; //数据2
+ AllData.chartData1.yAxis2_bar_Name = "运行风险数"; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "";
+ AllData.chartData1.yAxis2_line_Index = 0;
+ AllData.chartData1.yAxis3_line = null;
+ AllData.chartData1.yAxis3_line_Name = "";
+ AllData.chartData1.yAxis3_line_Index = 1;
AllData.refresh1++;
}
if (AllData.regionGrade == "four") {
+ // AllData.chartData3.xAxis = res.data.regionNameList;
+ // AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
+ // AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
+ // AllData.chartData3.yAxis_Name = "溢流风险";
+ // AllData.chartData3.yAxis2_Name = "满管风险";
+ // AllData.refresh3++;
AllData.chartData3.xAxis = res.data.regionNameList;
- AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
- AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
- AllData.chartData3.yAxis_Name = "溢流风险";
- AllData.chartData3.yAxis2_Name = "满管风险";
+ AllData.chartData3.yAxis1_bar = null;
+ AllData.chartData3.yAxis1_bar_Name = "";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "";
+ AllData.chartData3.yAxis2_line = res.data.fullPipeTimesList;
+ AllData.chartData3.yAxis2_line_Name = "满管";
+ AllData.chartData3.yAxis2_line_Index = 0;
+ AllData.chartData3.yAxis3_line = res.data.overFlowRiskTimesList;
+ AllData.chartData3.yAxis3_line_Name = "溢流";
+ AllData.chartData3.yAxis3_line_Index = 0;
+ AllData.chartData3.y1_Unit = "次"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
AllData.refresh3++;
}
}
@@ -695,7 +750,18 @@
AllData.refresh3++;
}
if (AllData.regionGrade == "two") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.outletsNumber;
+ AllData.chartData3.yAxis1_bar_Name = "排口";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = res.data.inflowWater;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = true;
+ AllData.refresh3++;
}
}
});
@@ -709,10 +775,27 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "three") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.pointNumber;
+ AllData.chartData3.yAxis1_bar_Name = "渍水风险点";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = null;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
+ AllData.refresh3++;
}
if (AllData.regionGrade == "four") {
- // AllData.chartData2
+ //
+ AllData.chartData2.xAxis = res.data.partitionName;
+ AllData.chartData2.yAxis = null;
+ AllData.chartData2.yAxis2 = res.data.pointNumber;
+ AllData.chartData2.yAxis2_Name = "总长度";
+ AllData.chartData2.yAxis_Name = null;
+ AllData.refresh2++;
}
}
});
@@ -757,10 +840,63 @@
const getData5 = () => {
MonitorAPI.waterRegionWaterYieldAnalysis({
waterRegionId: AllData.waterRegionCode,
- }).then((res) => {});
+ }).then((res) => {
+ if (res && res.code == 200) {
+ let XData = [];
+ let YData1 = [];
+ let YData2 = [];
+ let YData3 = [];
+ res.data.forEach((element) => {
+ XData.push(element.waterRegionName); //X轴数据
+ YData1.push(element.siteNum); //点位数量
+ YData2.push(element.inWaterYield); //进水
+ YData3.push(element.outWaterYield); //出水
+ });
+ if (AllData.regionGrade == "three") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = YData2;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ if (AllData.regionGrade == "four") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "接驳点数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ }
+ });
};
-// 获取数据 刘芳阳
-const getData6 = () => {};
+// 获取数据 刘芳阳 上下游分析
+const getDataSXY = () => {
+ MonitorAPI.siteWaterYieldAnalysis().then((res) => {});
+};
// 一级界面的河湖水情
// 清除本底分析echarts的数据
diff --git a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
index 9c5906c..71a5077 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
@@ -55,7 +55,7 @@
var relVal = "" + params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
if (params[i].seriesName) {
- let unit = "个";
+ let unit = "km";
relVal +=
"
" +
params[i].marker +
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/inputSearch.vue b/src/views/pictureOnMap/inputSearch.vue
index 282aa28..b30703a 100644
--- a/src/views/pictureOnMap/inputSearch.vue
+++ b/src/views/pictureOnMap/inputSearch.vue
@@ -61,7 +61,7 @@
appStore.MapData.map(item => {
SelectList.value = SelectList.value.concat(item.data);
});
- console.log('MapData', appStore.MapData, SelectList.value);
+ // console.log('MapData', appStore.MapData, SelectList.value);
filterList.value = JSON.parse(JSON.stringify(SelectList.value));
}
@@ -93,6 +93,7 @@
onMounted(() => {
bus.on('YQ_head', val => {
+ console.log('appStore.MapData',appStore.MapData);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
index 09f4910..b627d68 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
@@ -137,10 +137,7 @@
{{ item.abbreviation ? item.abbreviation : "" }}
-
-
-
+
水量分析
@@ -158,6 +155,8 @@
import bus from "@/bus";
// 引入接口
import * as MonitorAPI from "@/api/MonitoringAnalysis.js";
+import { getSectionByWellCode } from "@/api/MonitorAssetsOnMap";
+
// 引入echarts组件
// 纵向立体柱状体以及标线和折现
import DraBarCharts2Y from "./components/DraBarCharts2Y.vue";
@@ -426,6 +425,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData3();
+ getData7();
}
if (item.sort == 2) {
bus.emit("panelDataToMap", {
@@ -446,6 +450,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData2();
+ getData3();
}
if (item.sort == 3) {
bus.emit("panelDataToMap", {
@@ -459,127 +468,149 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData4();
+ getData5();
}
- // 切换时进行数据请求,默认视角请求
- clearEchartsData();
- getData1();
- getData3();
+ if (item.sort == 4) {
+ bus.emit("panelDataToMap", {
+ name: item.abbreviation,
+ id: item.id,
+ });
+ clearEchartsData();
+ getData2();
+ getData4();
+ getData5();
+ }
};
// 分区点击切换
-const FenQuClick = (properties) => {
- console.log("FenQuClick", properties);
- if (!!!properties.pid) return;
- // 请求面包屑的数据
- let params = {
- regionType: AllData.TypeID,
- id: Number(properties.pid),
- };
- MonitorAPI.lineGrade(params).then((res) => {
- if (res && res.code == 200) {
- // 默认设置基础的分区
- if (AllData.TypeID == "sewage") {
- // 污水
- AllData.TitleName[0].abbreviation = "一级分区";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
- } else {
- // 雨水
- AllData.TitleName[0].abbreviation = "一级流域";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
+const FenQuClick = (Row) => {
+ console.log("FenQuClick", Row.properties, Row.layerId);
+ //判断点击的是片区还是点位
+ if (Row.layerId == "排水分区") {
+ // 片区
+ AllData.RightShow = false;
+ // if (!!!Row.properties.pid) return;
+ // 原本是判断没有pid就不请求↑↑↑,现在gis图层数据改变,从而使用层级来判断↓↓↓
+ if (Row.properties.level == "4") return;
+ // 请求面包屑的数据
+ let params = {
+ regionType: AllData.TypeID,
+ id: Number(Row.properties.pid || Row.properties.w_id),
+ };
+ MonitorAPI.lineGrade(params).then((res) => {
+ if (res && res.code == 200) {
+ // 默认设置基础的分区
+ if (AllData.TypeID == "sewage") {
+ // 污水
+ AllData.TitleName[0].abbreviation = "一级分区";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ } else {
+ // 雨水
+ AllData.TitleName[0].abbreviation = "一级流域";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ }
+ // 设置1 2 3 4 级分区
+ clearMianBaoData();
+ res.data.forEach((element) => {
+ if (element.grade == "one") {
+ AllData.TitleName[1] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "two",
+ sort: 1,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "two") {
+ AllData.TitleName[2] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "three",
+ sort: 2,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "three") {
+ AllData.TitleName[3] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "four",
+ sort: 3,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "four") {
+ AllData.TitleName[4] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "five",
+ sort: 4,
+ Name: element.name,
+ };
+ }
+ });
+ // }
+ // 赋值需要进行echarts数据请求的数据
+ AllData.regionGrade =
+ res.data.length == 1
+ ? "two"
+ : res.data.length == 2
+ ? "three"
+ : res.data.length == 3
+ ? "four"
+ : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
+ AllData.regionName = AllData.TitleName[res.data.length].Name;
+ AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
+ // clearEchartsData();
+ if (AllData.regionGrade == "two") {
+ // 二级
+ console.log("二级");
+ getData1();
+ getData2();
+ getData3();
+ } else if (AllData.regionGrade == "three") {
+ // 三级
+ console.log("三级");
+ getData1();
+ getData4();
+ getData5();
+ } else if (AllData.regionGrade == "four") {
+ // 四级
+ console.log("四级");
+ getData2();
+ getData4();
+ getData5();
+ } else {
+ // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
+ console.log("五级");
+ }
}
- // 设置1 2 3 4 级分区
- clearMianBaoData();
- res.data.forEach((element) => {
- if (element.grade == "one") {
- AllData.TitleName[1] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "two",
- sort: 1,
- Name: element.name,
- };
- }
- if (element.grade == "two") {
- AllData.TitleName[2] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "three",
- sort: 2,
- Name: element.name,
- };
- }
- if (element.grade == "three") {
- AllData.TitleName[3] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "four",
- sort: 3,
- Name: element.name,
- };
- }
- if (element.grade == "four") {
- AllData.TitleName[4] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "five",
- sort: 4,
- Name: element.name,
- };
- }
+ });
+ } else if (Row.layerId == "point") {
+ // 点位
+ if (Row.properties.pointType == "rainwater_pipeline_quality") {
+ AllData.RightShow = true;
+ // Row.properties.wellCode
+ // 获取管网信息
+ getSectionByWellCode(Row.properties.wellcode).then((res) => {
+ console.log("res.data", res.data);
+ GetpoumianList.value = res.data;
});
- // }
- // 赋值需要进行echarts数据请求的数据
- AllData.regionGrade =
- res.data.length == 1
- ? "two"
- : res.data.length == 2
- ? "three"
- : res.data.length == 3
- ? "four"
- : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
- AllData.regionName = AllData.TitleName[res.data.length].Name;
- AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
- // clearEchartsData();
- if (AllData.regionGrade == "two") {
- // 二级
- console.log("二级");
- getData1();
- getData2();
- getData3();
- } else if (AllData.regionGrade == "three") {
- // 三级
- console.log("三级");
- getData1();
- getData4();
- getData5();
- } else if (AllData.regionGrade == "four") {
- // 四级
- console.log("四级");
- getData2();
- getData4();
- getData5();
- } else {
- // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
- console.log("五级");
- }
+ // 上下游水量分析
+ getDataSXY();
}
- });
+ }
};
-const events_params = {
- setHighlight: { key: "setHighlight" },
- setLayerVisible: { key: "setLayerVisible" },
- clearTemporaryData: { key: "clearTemporaryData" },
-};
-const operationLayer = (name, visible) => {
- const { setLayerVisible, setHighlight } = events_params;
- bus.emit(setLayerVisible.key, { layername: name, isCheck: visible });
-};
// 清除面包屑的数据
const clearMianBaoData = () => {
AllData.TitleName[1] = {
@@ -652,21 +683,45 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "two") {
- AllData.chartData1.xAxis = res.data.regionNameList;
- AllData.chartData1.yAxis = res.data.pipelinePointCount; //运行风险点位数
- AllData.chartData1.yAxis2 = res.data.pipelineRunRiskPointCount; //管网监测点位数
- AllData.chartData1.yAxis_Name = "运行风险数";
- AllData.chartData1.yAxis_Unit = "个";
- AllData.chartData1.yAxis2_Name = "点位数";
- AllData.chartData1.yAxis_Unit = "个";
+ AllData.chartData1.xAxis = res.data.regionNameList; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = false; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = res.data.pipelinePointCount; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = res.data.pipelineRunRiskPointCount; //数据2
+ AllData.chartData1.yAxis2_bar_Name = "运行风险数"; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "";
+ AllData.chartData1.yAxis2_line_Index = 0;
+ AllData.chartData1.yAxis3_line = null;
+ AllData.chartData1.yAxis3_line_Name = "";
+ AllData.chartData1.yAxis3_line_Index = 1;
AllData.refresh1++;
}
if (AllData.regionGrade == "four") {
+ // AllData.chartData3.xAxis = res.data.regionNameList;
+ // AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
+ // AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
+ // AllData.chartData3.yAxis_Name = "溢流风险";
+ // AllData.chartData3.yAxis2_Name = "满管风险";
+ // AllData.refresh3++;
AllData.chartData3.xAxis = res.data.regionNameList;
- AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
- AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
- AllData.chartData3.yAxis_Name = "溢流风险";
- AllData.chartData3.yAxis2_Name = "满管风险";
+ AllData.chartData3.yAxis1_bar = null;
+ AllData.chartData3.yAxis1_bar_Name = "";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "";
+ AllData.chartData3.yAxis2_line = res.data.fullPipeTimesList;
+ AllData.chartData3.yAxis2_line_Name = "满管";
+ AllData.chartData3.yAxis2_line_Index = 0;
+ AllData.chartData3.yAxis3_line = res.data.overFlowRiskTimesList;
+ AllData.chartData3.yAxis3_line_Name = "溢流";
+ AllData.chartData3.yAxis3_line_Index = 0;
+ AllData.chartData3.y1_Unit = "次"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
AllData.refresh3++;
}
}
@@ -695,7 +750,18 @@
AllData.refresh3++;
}
if (AllData.regionGrade == "two") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.outletsNumber;
+ AllData.chartData3.yAxis1_bar_Name = "排口";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = res.data.inflowWater;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = true;
+ AllData.refresh3++;
}
}
});
@@ -709,10 +775,27 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "three") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.pointNumber;
+ AllData.chartData3.yAxis1_bar_Name = "渍水风险点";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = null;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
+ AllData.refresh3++;
}
if (AllData.regionGrade == "four") {
- // AllData.chartData2
+ //
+ AllData.chartData2.xAxis = res.data.partitionName;
+ AllData.chartData2.yAxis = null;
+ AllData.chartData2.yAxis2 = res.data.pointNumber;
+ AllData.chartData2.yAxis2_Name = "总长度";
+ AllData.chartData2.yAxis_Name = null;
+ AllData.refresh2++;
}
}
});
@@ -757,10 +840,63 @@
const getData5 = () => {
MonitorAPI.waterRegionWaterYieldAnalysis({
waterRegionId: AllData.waterRegionCode,
- }).then((res) => {});
+ }).then((res) => {
+ if (res && res.code == 200) {
+ let XData = [];
+ let YData1 = [];
+ let YData2 = [];
+ let YData3 = [];
+ res.data.forEach((element) => {
+ XData.push(element.waterRegionName); //X轴数据
+ YData1.push(element.siteNum); //点位数量
+ YData2.push(element.inWaterYield); //进水
+ YData3.push(element.outWaterYield); //出水
+ });
+ if (AllData.regionGrade == "three") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = YData2;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ if (AllData.regionGrade == "four") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "接驳点数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ }
+ });
};
-// 获取数据 刘芳阳
-const getData6 = () => {};
+// 获取数据 刘芳阳 上下游分析
+const getDataSXY = () => {
+ MonitorAPI.siteWaterYieldAnalysis().then((res) => {});
+};
// 一级界面的河湖水情
// 清除本底分析echarts的数据
diff --git a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
index 9c5906c..71a5077 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
@@ -55,7 +55,7 @@
var relVal = "" + params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
if (params[i].seriesName) {
- let unit = "个";
+ let unit = "km";
relVal +=
"
" +
params[i].marker +
diff --git a/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue b/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
index a721a90..a6d86c0 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
@@ -69,7 +69,7 @@
},
},
legend: {
- data: [props.data.yAxis_Name, props.data.yAxis2_Name],
+ data: [props.data.yAxis2_line_Name, props.data.yAxis3_line_Name],
textStyle: {
color: "#FFFFFF",
fontSize: 12,
@@ -119,7 +119,7 @@
},
},
yAxis: {
- name: "次",
+ name: props.data.y1_Unit,
type: "value",
minInterval: 1,
axisLabel: {
@@ -139,9 +139,9 @@
},
series: [
{
- name: props.data.yAxis_Name,
+ name: props.data.yAxis2_line_Name,
type: "line",
- data: props.data.yAxis,
+ data: props.data.yAxis2_line,
// 修改折线颜色
lineStyle: {
color: "aqua", // 折线颜色
@@ -152,10 +152,13 @@
color: "aqua", // 数据点颜色
},
},
+
+
+
{
- name: props.data.yAxis2_Name,
+ name: props.data.yAxis3_line_Name,
type: "line",
- data: props.data.yAxis2,
+ data: props.data.yAxis3_line,
// 修改折线颜色
lineStyle: {
color: "yellow", // 折线颜色
diff --git a/src/components/Map/MapBox.vue b/src/components/Map/MapBox.vue
index 885a837..af67bbb 100644
--- a/src/components/Map/MapBox.vue
+++ b/src/components/Map/MapBox.vue
@@ -285,7 +285,7 @@
let p_feature = turf.flatten(turf.feature(Terraformer.WKT.parse(properties.geometry))).features[0];
let features = newfiberMap.map.getSource("point")._data.features.filter(i => _keys[2].includes(i.properties.type)).filter(o => turf.booleanPointInPolygon(o,p_feature));
- // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
+ // .filter(i => ids.includes(Number(i.properties.waterRegionId)));
features = features.map(i => Object.assign(_.cloneDeep(i),{properties:{...i.properties,type:i.properties.type+1}}));
busEmit(setGeoJSON.key, {json: turf.featureCollection(features), key: _keys[2]});
}
@@ -415,7 +415,7 @@
proxy.$emit("loadCallback");
ww();
ysFlow();
- geoRegeo({lngLat:[114.364339,30.536334],callback:(results)=>{
+ geoRegeo({lnglat:[114.364339,30.536334],callback:(results)=>{
debugger;
}});
};
diff --git a/src/router/index.js b/src/router/index.js
index 3ce9afb..4887f7c 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -96,7 +96,7 @@
},
{
path: '/DrainageSystem',
- name: 'PublicOpinionAnalysis',
+ name: 'DrainageSystem',
component: () => import('@/views/pictureOnMap/page/DrainageSystem/index.vue'),
},
],
diff --git a/src/views/pictureOnMap/LayerControl.vue b/src/views/pictureOnMap/LayerControl.vue
index 8a858a0..797858b 100644
--- a/src/views/pictureOnMap/LayerControl.vue
+++ b/src/views/pictureOnMap/LayerControl.vue
@@ -219,6 +219,7 @@
changeyangshi();
});
bus.on('YQ_head', val => {
+ console.log('valvalvalval',val);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/inputSearch.vue b/src/views/pictureOnMap/inputSearch.vue
index 282aa28..b30703a 100644
--- a/src/views/pictureOnMap/inputSearch.vue
+++ b/src/views/pictureOnMap/inputSearch.vue
@@ -61,7 +61,7 @@
appStore.MapData.map(item => {
SelectList.value = SelectList.value.concat(item.data);
});
- console.log('MapData', appStore.MapData, SelectList.value);
+ // console.log('MapData', appStore.MapData, SelectList.value);
filterList.value = JSON.parse(JSON.stringify(SelectList.value));
}
@@ -93,6 +93,7 @@
onMounted(() => {
bus.on('YQ_head', val => {
+ console.log('appStore.MapData',appStore.MapData);
if (val == false) {
Show.value = false;
} else {
diff --git a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
index 09f4910..b627d68 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/YSIndex.vue
@@ -137,10 +137,7 @@
{{ item.abbreviation ? item.abbreviation : "" }}
-
-
-
+
水量分析
@@ -158,6 +155,8 @@
import bus from "@/bus";
// 引入接口
import * as MonitorAPI from "@/api/MonitoringAnalysis.js";
+import { getSectionByWellCode } from "@/api/MonitorAssetsOnMap";
+
// 引入echarts组件
// 纵向立体柱状体以及标线和折现
import DraBarCharts2Y from "./components/DraBarCharts2Y.vue";
@@ -426,6 +425,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData3();
+ getData7();
}
if (item.sort == 2) {
bus.emit("panelDataToMap", {
@@ -446,6 +450,11 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData2();
+ getData3();
}
if (item.sort == 3) {
bus.emit("panelDataToMap", {
@@ -459,127 +468,149 @@
grade: "five",
sort: 4,
};
+ // 切换时进行数据请求,默认视角请求
+ clearEchartsData();
+ getData1();
+ getData4();
+ getData5();
}
- // 切换时进行数据请求,默认视角请求
- clearEchartsData();
- getData1();
- getData3();
+ if (item.sort == 4) {
+ bus.emit("panelDataToMap", {
+ name: item.abbreviation,
+ id: item.id,
+ });
+ clearEchartsData();
+ getData2();
+ getData4();
+ getData5();
+ }
};
// 分区点击切换
-const FenQuClick = (properties) => {
- console.log("FenQuClick", properties);
- if (!!!properties.pid) return;
- // 请求面包屑的数据
- let params = {
- regionType: AllData.TypeID,
- id: Number(properties.pid),
- };
- MonitorAPI.lineGrade(params).then((res) => {
- if (res && res.code == 200) {
- // 默认设置基础的分区
- if (AllData.TypeID == "sewage") {
- // 污水
- AllData.TitleName[0].abbreviation = "一级分区";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
- } else {
- // 雨水
- AllData.TitleName[0].abbreviation = "一级流域";
- AllData.TitleName[0].id = ""; //分区信息-动态
- AllData.TitleName[0].grade = "one"; //分区层级-静态
- AllData.TitleName[0].sort = 0; //面包屑的顺序
- AllData.TitleName[0].Name = ""; //全称
+const FenQuClick = (Row) => {
+ console.log("FenQuClick", Row.properties, Row.layerId);
+ //判断点击的是片区还是点位
+ if (Row.layerId == "排水分区") {
+ // 片区
+ AllData.RightShow = false;
+ // if (!!!Row.properties.pid) return;
+ // 原本是判断没有pid就不请求↑↑↑,现在gis图层数据改变,从而使用层级来判断↓↓↓
+ if (Row.properties.level == "4") return;
+ // 请求面包屑的数据
+ let params = {
+ regionType: AllData.TypeID,
+ id: Number(Row.properties.pid || Row.properties.w_id),
+ };
+ MonitorAPI.lineGrade(params).then((res) => {
+ if (res && res.code == 200) {
+ // 默认设置基础的分区
+ if (AllData.TypeID == "sewage") {
+ // 污水
+ AllData.TitleName[0].abbreviation = "一级分区";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ } else {
+ // 雨水
+ AllData.TitleName[0].abbreviation = "一级流域";
+ AllData.TitleName[0].id = ""; //分区信息-动态
+ AllData.TitleName[0].grade = "one"; //分区层级-静态
+ AllData.TitleName[0].sort = 0; //面包屑的顺序
+ AllData.TitleName[0].Name = ""; //全称
+ }
+ // 设置1 2 3 4 级分区
+ clearMianBaoData();
+ res.data.forEach((element) => {
+ if (element.grade == "one") {
+ AllData.TitleName[1] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "two",
+ sort: 1,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "two") {
+ AllData.TitleName[2] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "three",
+ sort: 2,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "three") {
+ AllData.TitleName[3] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "four",
+ sort: 3,
+ Name: element.name,
+ };
+ }
+ if (element.grade == "four") {
+ AllData.TitleName[4] = {
+ abbreviation: element.shortName,
+ id: element.id,
+ grade: "five",
+ sort: 4,
+ Name: element.name,
+ };
+ }
+ });
+ // }
+ // 赋值需要进行echarts数据请求的数据
+ AllData.regionGrade =
+ res.data.length == 1
+ ? "two"
+ : res.data.length == 2
+ ? "three"
+ : res.data.length == 3
+ ? "four"
+ : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
+ AllData.regionName = AllData.TitleName[res.data.length].Name;
+ AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
+ // clearEchartsData();
+ if (AllData.regionGrade == "two") {
+ // 二级
+ console.log("二级");
+ getData1();
+ getData2();
+ getData3();
+ } else if (AllData.regionGrade == "three") {
+ // 三级
+ console.log("三级");
+ getData1();
+ getData4();
+ getData5();
+ } else if (AllData.regionGrade == "four") {
+ // 四级
+ console.log("四级");
+ getData2();
+ getData4();
+ getData5();
+ } else {
+ // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
+ console.log("五级");
+ }
}
- // 设置1 2 3 4 级分区
- clearMianBaoData();
- res.data.forEach((element) => {
- if (element.grade == "one") {
- AllData.TitleName[1] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "two",
- sort: 1,
- Name: element.name,
- };
- }
- if (element.grade == "two") {
- AllData.TitleName[2] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "three",
- sort: 2,
- Name: element.name,
- };
- }
- if (element.grade == "three") {
- AllData.TitleName[3] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "four",
- sort: 3,
- Name: element.name,
- };
- }
- if (element.grade == "four") {
- AllData.TitleName[4] = {
- abbreviation: element.shortName,
- id: element.id,
- grade: "five",
- sort: 4,
- Name: element.name,
- };
- }
+ });
+ } else if (Row.layerId == "point") {
+ // 点位
+ if (Row.properties.pointType == "rainwater_pipeline_quality") {
+ AllData.RightShow = true;
+ // Row.properties.wellCode
+ // 获取管网信息
+ getSectionByWellCode(Row.properties.wellcode).then((res) => {
+ console.log("res.data", res.data);
+ GetpoumianList.value = res.data;
});
- // }
- // 赋值需要进行echarts数据请求的数据
- AllData.regionGrade =
- res.data.length == 1
- ? "two"
- : res.data.length == 2
- ? "three"
- : res.data.length == 3
- ? "four"
- : "five"; //分区级别（one：一级 || two：二级 || three：三级 || four：四级）
- AllData.regionName = AllData.TitleName[res.data.length].Name;
- AllData.waterRegionCode = AllData.TitleName[res.data.length].id;
- // clearEchartsData();
- if (AllData.regionGrade == "two") {
- // 二级
- console.log("二级");
- getData1();
- getData2();
- getData3();
- } else if (AllData.regionGrade == "three") {
- // 三级
- console.log("三级");
- getData1();
- getData4();
- getData5();
- } else if (AllData.regionGrade == "four") {
- // 四级
- console.log("四级");
- getData2();
- getData4();
- getData5();
- } else {
- // 五级 五级为排水单元,由上可知,因为没有pid 所以此方法无效
- console.log("五级");
- }
+ // 上下游水量分析
+ getDataSXY();
}
- });
+ }
};
-const events_params = {
- setHighlight: { key: "setHighlight" },
- setLayerVisible: { key: "setLayerVisible" },
- clearTemporaryData: { key: "clearTemporaryData" },
-};
-const operationLayer = (name, visible) => {
- const { setLayerVisible, setHighlight } = events_params;
- bus.emit(setLayerVisible.key, { layername: name, isCheck: visible });
-};
// 清除面包屑的数据
const clearMianBaoData = () => {
AllData.TitleName[1] = {
@@ -652,21 +683,45 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "two") {
- AllData.chartData1.xAxis = res.data.regionNameList;
- AllData.chartData1.yAxis = res.data.pipelinePointCount; //运行风险点位数
- AllData.chartData1.yAxis2 = res.data.pipelineRunRiskPointCount; //管网监测点位数
- AllData.chartData1.yAxis_Name = "运行风险数";
- AllData.chartData1.yAxis_Unit = "个";
- AllData.chartData1.yAxis2_Name = "点位数";
- AllData.chartData1.yAxis_Unit = "个";
+ AllData.chartData1.xAxis = res.data.regionNameList; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = false; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = res.data.pipelinePointCount; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = res.data.pipelineRunRiskPointCount; //数据2
+ AllData.chartData1.yAxis2_bar_Name = "运行风险数"; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "";
+ AllData.chartData1.yAxis2_line_Index = 0;
+ AllData.chartData1.yAxis3_line = null;
+ AllData.chartData1.yAxis3_line_Name = "";
+ AllData.chartData1.yAxis3_line_Index = 1;
AllData.refresh1++;
}
if (AllData.regionGrade == "four") {
+ // AllData.chartData3.xAxis = res.data.regionNameList;
+ // AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
+ // AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
+ // AllData.chartData3.yAxis_Name = "溢流风险";
+ // AllData.chartData3.yAxis2_Name = "满管风险";
+ // AllData.refresh3++;
AllData.chartData3.xAxis = res.data.regionNameList;
- AllData.chartData3.yAxis = res.data.overFlowRiskTimesList; //溢流风险
- AllData.chartData3.yAxis2 = res.data.fullPipeTimesList; //满管风险
- AllData.chartData3.yAxis_Name = "溢流风险";
- AllData.chartData3.yAxis2_Name = "满管风险";
+ AllData.chartData3.yAxis1_bar = null;
+ AllData.chartData3.yAxis1_bar_Name = "";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "";
+ AllData.chartData3.yAxis2_line = res.data.fullPipeTimesList;
+ AllData.chartData3.yAxis2_line_Name = "满管";
+ AllData.chartData3.yAxis2_line_Index = 0;
+ AllData.chartData3.yAxis3_line = res.data.overFlowRiskTimesList;
+ AllData.chartData3.yAxis3_line_Name = "溢流";
+ AllData.chartData3.yAxis3_line_Index = 0;
+ AllData.chartData3.y1_Unit = "次"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
AllData.refresh3++;
}
}
@@ -695,7 +750,18 @@
AllData.refresh3++;
}
if (AllData.regionGrade == "two") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.outletsNumber;
+ AllData.chartData3.yAxis1_bar_Name = "排口";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = res.data.inflowWater;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = true;
+ AllData.refresh3++;
}
}
});
@@ -709,10 +775,27 @@
}).then((res) => {
if (res && res.code == 200) {
if (AllData.regionGrade == "three") {
- // AllData.chartData3
+ AllData.chartData3.xAxis = res.data.partitionName;
+ AllData.chartData3.yAxis1_bar = res.data.pointNumber;
+ AllData.chartData3.yAxis1_bar_Name = "渍水风险点";
+ AllData.chartData3.yAxis2_bar = null;
+ AllData.chartData3.yAxis2_bar_Name = "风险排口";
+ AllData.chartData3.yAxis3_line = null;
+ AllData.chartData3.yAxis3_line_Name = "进水量";
+ AllData.chartData3.yAxis3_line_Index = 1;
+ AllData.chartData3.y1_Unit = "个"; //Y轴单位
+ AllData.chartData3.y2_Unit = "万方"; //Y轴单位
+ AllData.chartData3.y2_show = false;
+ AllData.refresh3++;
}
if (AllData.regionGrade == "four") {
- // AllData.chartData2
+ //
+ AllData.chartData2.xAxis = res.data.partitionName;
+ AllData.chartData2.yAxis = null;
+ AllData.chartData2.yAxis2 = res.data.pointNumber;
+ AllData.chartData2.yAxis2_Name = "总长度";
+ AllData.chartData2.yAxis_Name = null;
+ AllData.refresh2++;
}
}
});
@@ -757,10 +840,63 @@
const getData5 = () => {
MonitorAPI.waterRegionWaterYieldAnalysis({
waterRegionId: AllData.waterRegionCode,
- }).then((res) => {});
+ }).then((res) => {
+ if (res && res.code == 200) {
+ let XData = [];
+ let YData1 = [];
+ let YData2 = [];
+ let YData3 = [];
+ res.data.forEach((element) => {
+ XData.push(element.waterRegionName); //X轴数据
+ YData1.push(element.siteNum); //点位数量
+ YData2.push(element.inWaterYield); //进水
+ YData3.push(element.outWaterYield); //出水
+ });
+ if (AllData.regionGrade == "three") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "点位数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = YData2;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ if (AllData.regionGrade == "four") {
+ AllData.chartData1.xAxis = XData; //X轴数据
+ AllData.chartData1.y1_Unit = "个"; //Y轴单位
+ AllData.chartData1.y2_Unit = "万方"; //2号Y轴单位
+ AllData.chartData1.y2_show = true; //是否展示右侧的2号轴
+ AllData.chartData1.yAxis1_bar = YData1; //数据1
+ AllData.chartData1.yAxis1_bar_Name = "接驳点数"; //数据1的名称
+ AllData.chartData1.yAxis1_bar_index = 0;
+ AllData.chartData1.yAxis2_bar = null; //数据2
+ AllData.chartData1.yAxis2_bar_Name = ""; //数据1的名称
+ AllData.chartData1.yAxis2_bar_index = 0;
+ AllData.chartData1.yAxis2_line = null;
+ AllData.chartData1.yAxis2_line_Name = "进水";
+ AllData.chartData1.yAxis2_line_Index = 1;
+ AllData.chartData1.yAxis3_line = YData3;
+ AllData.chartData1.yAxis3_line_Name = "出水";
+ AllData.chartData1.yAxis3_line_Index = 1;
+ AllData.refresh1++;
+ }
+ }
+ });
};
-// 获取数据 刘芳阳
-const getData6 = () => {};
+// 获取数据 刘芳阳 上下游分析
+const getDataSXY = () => {
+ MonitorAPI.siteWaterYieldAnalysis().then((res) => {});
+};
// 一级界面的河湖水情
// 清除本底分析echarts的数据
diff --git a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
index 9c5906c..71a5077 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/components/DraBarChartsLeft.vue
@@ -55,7 +55,7 @@
var relVal = "" + params[0].name;
for (var i = 0, l = params.length; i < l; i++) {
if (params[i].seriesName) {
- let unit = "个";
+ let unit = "km";
relVal +=
"
" +
params[i].marker +
diff --git a/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue b/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
index a721a90..a6d86c0 100644
--- a/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
+++ b/src/views/pictureOnMap/page/DrainageSystem/components/DraLineChartsLeft.vue
@@ -69,7 +69,7 @@
},
},
legend: {
- data: [props.data.yAxis_Name, props.data.yAxis2_Name],
+ data: [props.data.yAxis2_line_Name, props.data.yAxis3_line_Name],
textStyle: {
color: "#FFFFFF",
fontSize: 12,
@@ -119,7 +119,7 @@
},
},
yAxis: {
- name: "次",
+ name: props.data.y1_Unit,
type: "value",
minInterval: 1,
axisLabel: {
@@ -139,9 +139,9 @@
},
series: [
{
- name: props.data.yAxis_Name,
+ name: props.data.yAxis2_line_Name,
type: "line",
- data: props.data.yAxis,
+ data: props.data.yAxis2_line,
// 修改折线颜色
lineStyle: {
color: "aqua", // 折线颜色
@@ -152,10 +152,13 @@
color: "aqua", // 数据点颜色
},
},
+
+
+
{
- name: props.data.yAxis2_Name,
+ name: props.data.yAxis3_line_Name,
type: "line",
- data: props.data.yAxis2,
+ data: props.data.yAxis3_line,
// 修改折线颜色
lineStyle: {
color: "yellow", // 折线颜色
diff --git a/src/views/pictureOnMap/page/MonitoringAnalysis/index.vue b/src/views/pictureOnMap/page/MonitoringAnalysis/index.vue
index ecc2cee..5727d44 100644
--- a/src/views/pictureOnMap/page/MonitoringAnalysis/index.vue
+++ b/src/views/pictureOnMap/page/MonitoringAnalysis/index.vue
@@ -296,18 +296,22 @@
regionName: "", //分区名称
yw_type: [
- { name: "污水体系", key: "sewage",
- values: [
- {key: "污水分区1", visible: true},
- {key: "尾水路径", visible: true},
- ]},
{
- name: "雨水体系", key: "rain",
+ name: "污水体系",
+ key: "sewage",
values: [
- {key: "雨水分区1", visible: true},
- {key: "雨水系统流向", visible: true},
- {key: "雨水系统流向1", visible: true}
- ]
+ { key: "污水分区1", visible: true },
+ { key: "尾水路径", visible: true },
+ ],
+ },
+ {
+ name: "雨水体系",
+ key: "rain",
+ values: [
+ { key: "雨水分区1", visible: true },
+ { key: "雨水系统流向", visible: true },
+ { key: "雨水系统流向1", visible: true },
+ ],
},
],
TitleName: [
@@ -599,12 +603,15 @@
}
};
-const TypeClick_ = (item)=>{
+const TypeClick_ = (item) => {
closeAllLayer();
bus.emit("clearTemporaryData");
const { setLayerVisible } = events_params;
newfiberMap.map.easeTo(newfiberMap.config_.params.init);
- item.values && item.values.filter((i) => i.visible).forEach((i) => bus.emit(setLayerVisible.key, { layername: i.key, isCheck: true }));
+ item.values &&
+ item.values
+ .filter((i) => i.visible)
+ .forEach((i) => bus.emit(setLayerVisible.key, { layername: i.key, isCheck: true }));
};
const events_params = {
setHighlight: { key: "setHighlight" },
@@ -613,17 +620,27 @@
};
const closeAllLayer = () => {
const { setLayerVisible, setHighlight } = events_params;
- AllData.yw_type.map((i) => i.values).filter(Boolean).flat().forEach((i) => bus.emit(setLayerVisible.key, { layername: i.key, isCheck: false,values:i.values }));
+ AllData.yw_type
+ .map((i) => i.values)
+ .filter(Boolean)
+ .flat()
+ .forEach((i) =>
+ bus.emit(setLayerVisible.key, {
+ layername: i.key,
+ isCheck: false,
+ values: i.values,
+ })
+ );
bus.emit(setHighlight.key, []);
};
// 分区点击切换
-const FenQuClick = (properties) => {
- console.log("FenQuClick", properties);
- if (!!!properties.pid) return;
+const FenQuClick = (Row) => {
+ console.log("FenQuClick", Row.properties, Row.layerId);
+ if (!!!Row.properties.pid) return;
// 请求面包屑的数据
let params = {
regionType: AllData.TypeID,
- id: Number(properties.pid),
+ id: Number(Row.properties.pid),
};
MonitorAPI.lineGrade(params).then((res) => {
if (res && res.code == 200) {