|
|
@@ -1,144 +1,143 @@
|
|
|
<template>
|
|
|
- <div class="map-ditu">
|
|
|
- <!-- 分析事件中 风场信息展示地图组件 -->
|
|
|
- <Tmap ref="map" :windEngineGroupByFieldCodeDetail="windEngineGroupByFieldCodeDetail">
|
|
|
- </Tmap>
|
|
|
- </div>
|
|
|
+ <div class="map-ditu">
|
|
|
+ <!-- 分析事件中 风场信息展示地图组件 -->
|
|
|
+ <Tmap
|
|
|
+ ref="map"
|
|
|
+ :windEngineGroupByFieldCodeDetail="windEngineGroupByFieldCodeDetail"
|
|
|
+ >
|
|
|
+ </Tmap>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {
|
|
|
- getWindEngineGroupByFieldCode,
|
|
|
- getWindEngineGroupRatedListByFieldCodePage,
|
|
|
+ getWindEngineGroupByFieldCode,
|
|
|
+ getWindEngineGroupRatedListByFieldCodePage,
|
|
|
} from "@/api/ledger.js";
|
|
|
import Tmap from "@/components/map";
|
|
|
|
|
|
export default {
|
|
|
- name: "Index",
|
|
|
- components: {
|
|
|
- Tmap,
|
|
|
- },
|
|
|
- props: {
|
|
|
- fieldCode: "",
|
|
|
- batchCode: "",
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
-
|
|
|
- windEngineGroupByFieldCodeDetail: {},
|
|
|
- };
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- // this.fieldCode = this.$route.query.fieldEngineCode;
|
|
|
- // this.batchCode = this.$route.query.batchCode;
|
|
|
- // this.addMarkersAndZoom();
|
|
|
- },
|
|
|
- watch: {
|
|
|
- fieldCode(newVal) {
|
|
|
- if (newVal) {
|
|
|
- console.log(newVal, 'newVal')
|
|
|
- this.GETfengji();
|
|
|
- }
|
|
|
- },
|
|
|
+ name: "Index",
|
|
|
+ components: {
|
|
|
+ Tmap,
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ fieldCode: "",
|
|
|
+ batchCode: "",
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ windEngineGroupByFieldCodeDetail: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ // this.fieldCode = this.$route.query.fieldEngineCode;
|
|
|
+ // this.batchCode = this.$route.query.batchCode;
|
|
|
+ // this.addMarkersAndZoom();
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ fieldCode(newVal) {
|
|
|
+ if (newVal) {
|
|
|
+ this.GETfengji();
|
|
|
+ }
|
|
|
},
|
|
|
+ },
|
|
|
|
|
|
- methods: {
|
|
|
- GETfengji() {
|
|
|
- let dataArr = {
|
|
|
- fieldCode: this.fieldCode,
|
|
|
- batchCode: this.batchCode,
|
|
|
- };
|
|
|
- console.log(dataArr,'dataArr')
|
|
|
- getWindEngineGroupByFieldCode(dataArr).then((res) => {
|
|
|
- const result = res.data;
|
|
|
- console.log(result,dataArr,'dataArr')
|
|
|
- this.windEngineGroupByFieldCodeDetail = result;
|
|
|
- if (result !== null && result.anemometerTowerList) {
|
|
|
- this.addMarkersAndZoom(result.anemometerTowerList, "5");
|
|
|
- }
|
|
|
- if (this.fieldCode) {
|
|
|
- getWindEngineGroupRatedListByFieldCodePage({
|
|
|
- fieldCode: this.fieldCode,
|
|
|
- pageSize: 9999999,
|
|
|
- }).then((windRes) => {
|
|
|
- if (windRes.data && windRes.data.list) {
|
|
|
- // 定义两个数组来存放不同errorState的元素
|
|
|
- const errorStateFalse = [];
|
|
|
- const errorStateTrue = [];
|
|
|
- // 遍历数组并根据errorState的值将元素放入不同的数组中
|
|
|
+ methods: {
|
|
|
+ GETfengji() {
|
|
|
+ let dataArr = {
|
|
|
+ fieldCode: this.fieldCode,
|
|
|
+ batchCode: this.batchCode,
|
|
|
+ };
|
|
|
+ getWindEngineGroupByFieldCode(dataArr).then((res) => {
|
|
|
+ const result = res.data;
|
|
|
+ this.windEngineGroupByFieldCodeDetail = result;
|
|
|
+ if (result !== null && result.anemometerTowerList) {
|
|
|
+ this.addMarkersAndZoom(result.anemometerTowerList, "5");
|
|
|
+ }
|
|
|
+ if (this.fieldCode) {
|
|
|
+ getWindEngineGroupRatedListByFieldCodePage({
|
|
|
+ fieldCode: this.fieldCode,
|
|
|
+ pageSize: 9999999,
|
|
|
+ }).then((windRes) => {
|
|
|
+ if (windRes.data && windRes.data.list) {
|
|
|
+ // 定义两个数组来存放不同errorState的元素
|
|
|
+ const errorStateFalse = [];
|
|
|
+ const errorStateTrue = [];
|
|
|
+ // 遍历数组并根据errorState的值将元素放入不同的数组中
|
|
|
|
|
|
- windRes.data.list.forEach((item) => {
|
|
|
- errorStateFalse.push({
|
|
|
- ...item,
|
|
|
- longitudeAndLatitudeString: `${item.longitude}00,${item.latitude}00`,
|
|
|
- });
|
|
|
- });
|
|
|
+ windRes.data.list.forEach((item) => {
|
|
|
+ errorStateFalse.push({
|
|
|
+ ...item,
|
|
|
+ longitudeAndLatitudeString: `${item.longitude}00,${item.latitude}00`,
|
|
|
+ });
|
|
|
+ });
|
|
|
|
|
|
- // 调用this.addMarkersAndZoom方法
|
|
|
- if (errorStateFalse.length > 0) {
|
|
|
- this.addMarkersAndZoom(errorStateFalse, "4");
|
|
|
- }
|
|
|
+ // 调用this.addMarkersAndZoom方法
|
|
|
+ if (errorStateFalse.length > 0) {
|
|
|
+ this.addMarkersAndZoom(errorStateFalse, "4");
|
|
|
+ }
|
|
|
|
|
|
- if (errorStateTrue.length > 0) {
|
|
|
- this.addMarkersAndZoom(errorStateTrue, "6");
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- parseCoordinates(input) {
|
|
|
- if (input && typeof input === "string") {
|
|
|
- return input.split(",").map(Number);
|
|
|
+ if (errorStateTrue.length > 0) {
|
|
|
+ this.addMarkersAndZoom(errorStateTrue, "6");
|
|
|
+ }
|
|
|
}
|
|
|
- return [];
|
|
|
- },
|
|
|
- addMarkersAndZoom(data, type) {
|
|
|
- const dataMapList = data;
|
|
|
- dataMapList.forEach((element) => {
|
|
|
- if (
|
|
|
- this.parseCoordinates(element.longitudeAndLatitudeString).length > 0
|
|
|
- ) {
|
|
|
- this.$refs.map.addMarker({
|
|
|
- point: this.parseCoordinates(element.longitudeAndLatitudeString),
|
|
|
- val: type,
|
|
|
- ...element,
|
|
|
- });
|
|
|
- // this.$refs.map.moveAndZoom({
|
|
|
- // point: this.parseCoordinates(element.longitudeAndLatitudeString),
|
|
|
- // zoom: 15,
|
|
|
- // });
|
|
|
- return;
|
|
|
- }
|
|
|
- this.$refs.map.clearMarkers();
|
|
|
- });
|
|
|
- // const points = [
|
|
|
- // { point: [120.2, 30.35], val: "4" },
|
|
|
- // { point: [120.21, 30.35], val: "5" },
|
|
|
- // ];
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ parseCoordinates(input) {
|
|
|
+ if (input && typeof input === "string") {
|
|
|
+ return input.split(",").map(Number);
|
|
|
+ }
|
|
|
+ return [];
|
|
|
+ },
|
|
|
+ addMarkersAndZoom(data, type) {
|
|
|
+ const dataMapList = data;
|
|
|
+ dataMapList.forEach((element) => {
|
|
|
+ if (
|
|
|
+ this.parseCoordinates(element.longitudeAndLatitudeString).length > 0
|
|
|
+ ) {
|
|
|
+ this.$refs.map.addMarker({
|
|
|
+ point: this.parseCoordinates(element.longitudeAndLatitudeString),
|
|
|
+ val: type,
|
|
|
+ ...element,
|
|
|
+ });
|
|
|
+ // this.$refs.map.moveAndZoom({
|
|
|
+ // point: this.parseCoordinates(element.longitudeAndLatitudeString),
|
|
|
+ // zoom: 15,
|
|
|
+ // });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.$refs.map.clearMarkers();
|
|
|
+ });
|
|
|
+ // const points = [
|
|
|
+ // { point: [120.2, 30.35], val: "4" },
|
|
|
+ // { point: [120.21, 30.35], val: "5" },
|
|
|
+ // ];
|
|
|
|
|
|
- // // Add markers to the map
|
|
|
- // points.forEach((point) => {
|
|
|
- // this.$refs.map.addMarker(point);
|
|
|
- // });
|
|
|
+ // // Add markers to the map
|
|
|
+ // points.forEach((point) => {
|
|
|
+ // this.$refs.map.addMarker(point);
|
|
|
+ // });
|
|
|
|
|
|
- // // Zoom to a specific point
|
|
|
- const zoomPoint = {
|
|
|
- point: this.parseCoordinates(
|
|
|
- this.windEngineGroupByFieldCodeDetail.windEngineGroupVoList[0]
|
|
|
- .longitudeAndLatitudeString
|
|
|
- ),
|
|
|
- zoom: 15,
|
|
|
- };
|
|
|
- this.$refs.map.moveAndZoom(zoomPoint);
|
|
|
- },
|
|
|
+ // // Zoom to a specific point
|
|
|
+ const zoomPoint = {
|
|
|
+ point: this.parseCoordinates(
|
|
|
+ this.windEngineGroupByFieldCodeDetail.windEngineGroupVoList[0]
|
|
|
+ .longitudeAndLatitudeString
|
|
|
+ ),
|
|
|
+ zoom: 15,
|
|
|
+ };
|
|
|
+ this.$refs.map.moveAndZoom(zoomPoint);
|
|
|
},
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
.map-ditu {
|
|
|
- height: 93vh;
|
|
|
- position: relative;
|
|
|
+ height: 93vh;
|
|
|
+ position: relative;
|
|
|
}
|
|
|
-</style>
|
|
|
+</style>
|