{"remainingRequest":"/data/jenkins/workspace/badp-bcxin-web-5.x-vue/node_modules/vue-loader/lib/index.js??vue-loader-options!/data/jenkins/workspace/badp-bcxin-web-5.x-vue/src/views/ElectronicFence.vue?vue&type=script&lang=js","dependencies":[{"path":"/data/jenkins/workspace/badp-bcxin-web-5.x-vue/src/views/ElectronicFence.vue","mtime":1748499114702},{"path":"/data/jenkins/workspace/badp-bcxin-web-5.x-vue/node_modules/babel-loader/lib/index.js","mtime":456789000000},{"path":"/data/jenkins/workspace/badp-bcxin-web-5.x-vue/node_modules/cache-loader/dist/cjs.js","mtime":499162500000},{"path":"/data/jenkins/workspace/badp-bcxin-web-5.x-vue/node_modules/vue-loader/lib/index.js","mtime":499162500000}],"contextDependencies":[],"result":["\nimport { utils, VMap, VTile, VVector, VDraw } from \"v-ol-map\";\nimport \"v-ol-map/lib/v-ol-map.css\";\nimport { Message } from \"element-ui\";\nimport { deleteRailAccess, getRailDetailAccess, searchRailAccess } from \"@/api/security-station-rails-controller\";\nimport electronicFenceEditDialog from \"@/components/electronicFenceEdit.vue\";\n\nexport default {\n  name: \"rail\",\n  components: {\n    VMap,\n    VTile,\n    VVector,\n    VDraw,\n    electronicFenceEditDialog,\n  },\n  data() {\n    return {\n      view: {\n        city: \"晋城\",\n        zoom: 11,\n      },\n      tileType: \"GD\",\n      interactions: {\n        DragRotateAndZoom: true,\n        doubleClickZoom: false,\n      },\n      controls: {\n        zoom: true,\n        zoomOptions: {\n          className: \"ol-zoom-custom\",\n        },\n      },\n      stationId: \"\",\n      mapToolList: [\"fence\", \"tile\"],\n      tableData: [],\n      originData: [],\n      station: {},\n      info: {},\n      returnWin: {},\n      layers: {\n        // 驻勤点\n        stationLayer: {\n          features: [],\n          overlay: {\n            position: undefined,\n            offset: [0, -36],\n          },\n        },\n        pointLayer: {\n          features: [],\n          style: {\n            image: {\n              src: require(\"@/assets/images/mapToolbar/框选.png\"),\n              scale: 1.2,\n            },\n          }\n        },\n        // 企业\n        companyLayer: {\n          features: [],\n          overlay: {\n            position: undefined,\n            offset: [0, -36],\n          },\n        },\n        // 驻勤点人员\n        stationEmployeesLayer: {\n          features: [],\n          overlay: {\n            position: undefined,\n            offset: [0, -36],\n          },\n        },\n        // 电子围栏\n        railLayer: {\n          features: [],\n          cluster: {\n            distance: 110,\n            style: {\n              circle: {\n                radius: 50,\n                fill: {\n                  color: \"#0E71FF\",\n                },\n              },\n              text: {\n                font: \"22px Source Han Sans CN-Medium, Source Han Sans CN\",\n                fill: {\n                  color: \"#FFFFFF\",\n                },\n              },\n            },\n          },\n          style: {\n            fill: {\n              color: \"rgba(230,162,60,0.2)\",\n            },\n            stroke: {\n              color: \"#E6A23C\",\n              width: 2,\n            },\n          },\n          overlay: {\n            position: undefined,\n            offset: [0, -36],\n          },\n        },\n      },\n      isElectronicFenceEditDialog: false,\n      isElectronicFenceStationDialog: false,\n      isElectronicFenceDialog: false,\n      isElectronicFencePeople: false,\n      electronicFenceData: [],\n      electronicFenceInfo: {},\n      drawType: \"\",\n      electronicFencePeopleList: [],\n      peopleStationName: \"\",\n      showFenceEdit: true,\n    };\n  },\n  methods: {\n    clickRail(evt, feature) {\n      if (feature) {\n        console.log(feature);\n        const rails = feature.get(\"features\");\n        if (rails && rails.length === 1) {\n          this.showRailInfoFromList = false;\n          const rail = rails[0];\n          const info = rail.get(\"props\");\n          console.log(\"clickRailInfo\", info);\n          this.showRailInfo({ info });\n        } else {\n          if (feature.get(\"props\")) {\n            this.showRailInfoFromList = false;\n            const info = feature.get(\"props\");\n            console.log(\"clickRailInfo\", info);\n            this.showRailInfo({ info });\n          } else {\n            // 如果是聚合点就下钻一级\n            const zoom = this.$refs.map.map.getView().getZoom() + 1;\n            const center = evt.coordinate;\n            this.$refs.map.panTo({ zoom, center });\n          }\n        }\n      }\n    },\n    \n    onRailLayerChange(features) {\n      console.log(features);\n      if (features && features.length === 1) {\n        const feature = features[0];\n        const type = feature.get(\"type\");\n        if (type && !this.showRailInfoFromList) {\n          console.log(type);\n          if (type === \"polygon\" || type === \"Polygon\") {\n            const geometry = feature.get(\"geometry\");\n            // const view = this.$refs.map.map.getView();\n            // view.fit(geometry, {\n            //   duration: 1000,\n            // });\n            const result = this.$refs.map.calculateCenter(geometry);\n            const { center } = result;\n            // console.log(coordinates)\n            /**\n             * @弹框位置转高德转84\n             */\n            this.layers.railLayer.overlay.position = center;\n          } else if (type === \"circle\" || type === \"Circle\") {\n            const geometry = feature.get(\"geometry\");\n            // const view = this.$refs.map.map.getView();\n            // view.fit(geometry, {\n            //   duration: 1000,\n            // });\n            this.layers.railLayer.overlay.position = geometry.getCenter();\n          }\n        }\n      }\n    },\n    /**\n     * @电子围栏列表\n     */\n    setFence() {\n      this.isElectronicFenceDialog = true;\n    },\n    /**\n     * @清空地图\n     */\n    clearMap(exclude = [\"stationLayer\"]) {\n      for (let layersKey in this.layers) {\n        if (!exclude.includes(layersKey)) {\n          this.layers[layersKey].features = [];\n        }\n      }\n      this.$refs.map.closeOverlays();\n    },\n    onChangeLayer(type) {\n      // console.log(\"onChangeLayer\", type);\n      if (type.indexOf(\"default\") > -1) {\n        this.tileType = \"GD\";\n      } else {\n        this.tileType = \"GD_IMG\";\n      }\n    },\n    hideFenceTable() {\n      this.isElectronicFenceEditDialog = false;\n      this.isElectronicFenceStationDialog = false;\n      this.isElectronicFenceDialog = false;\n    },\n    electronicFenceCancel() {\n      this.isElectronicFenceDialog = false;\n    },\n    /**\n     * @新增电子围栏\n     */\n    addElectronic() {\n      this.isElectronicFenceEditDialog = true;\n      this.isElectronicFenceDialog = false;\n      this.electronicFenceInfo = JSON.parse(JSON.stringify(this.info));\n      this.electronicFenceInfo = {};\n      console.log(this.station);\n      this.$nextTick(() => {\n        this.$refs.electronicFenceEdit.updateStation({\n          stationName: this.station.name,\n          peopleNum: this.station.countOfSecurityMan,\n          countOfSecurityMan: this.station.countOfSecurityMan,\n          stationId: this.station.id,\n        });\n      });\n    },\n    /**\n     * @编辑某条电子围栏\n     * @param data\n     */\n    async electronicFenceEditFn({ data }) {\n      console.log(\"编辑某条电子围栏\", data);\n      this.showRailInfoFromList = true;\n      // this.map.clearMap();\n      this.isElectronicFenceDialog = false;\n      this.electronicFenceInfo = JSON.parse(JSON.stringify(data));\n      this.electronicFenceInfo.time = [this.electronicFenceInfo.beginTime, this.electronicFenceInfo.endTime];\n      const rail = await getRailDetailAccess(data.id);\n      this.info = { ...rail, ...this.electronicFenceInfo }; // 弹框信息\n      console.log(this.info);\n      this.isElectronicFenceEditDialog = true;\n      // 显示可编辑围栏区域\n      this.showMapEditor(data);\n    },\n    delElectronic(data) {\n      console.log(data);\n      let params = {\n        id: data.data.id,\n      };\n      deleteRailAccess(params)\n        .then((res) => {\n          console.log(\"deleteRailAccess\", res);\n          this.$refs[\"electronicFence\"].getRails();\n          this.$message({\n            message: \"删除成功\",\n            type: \"success\",\n          });\n        })\n        .catch((err) => {\n          console.log(err);\n        });\n    },\n \n    electronicFenceEditCancel() {\n      this.layers.railLayer.features = [];\n      this.isElectronicFenceEditDialog = false;\n      this.cleanDrawFigure();\n      searchRailAccess({\n        pageIndex: 1,\n        pageSize: 10,\n        searchModel: \"Station\",\n        stationId: this.stationId,\n      })\n        .then((res) => {\n          console.log(\"searchRail\", res);\n          if (res) {\n            this.electronicFenceData = res;\n          } else {\n            Message({\n              type: \"error\",\n              message: \"查询电子围栏信息失败\",\n              onClose: () => {\n                // window.location = \"https://www.baidu.com\";\n              },\n            });\n          }\n        })\n        .catch(() => {\n          Message({\n            type: \"error\",\n            message: \"查询电子围栏信息失败\",\n            onClose: () => {\n              // window.location = \"https://www.baidu.com\";\n            },\n          });\n        });\n    },\n    cleanDrawFigure() {\n      this.drawType = \"\";\n    },\n\n    showMapEditor({ shapeType, shapedLocation }) {\n      switch (shapeType) {\n        case \"Circle\": // 圆\n          this.showCircleEditor(shapedLocation);\n          break;\n        case \"Polygon\":\n          this.showPolygonEditor(shapedLocation);\n          break;\n        case \"Crib\":\n          this.showCribEditor(shapedLocation);\n          break;\n      }\n    },\n    showPolygonEditor({ geos }) {\n      let list = geos.map((item) => [item.lon, item.lat]);\n      console.log(list);\n      this.layers.railLayer.features = [\n        {\n          type: \"polygon\",\n          coordinates: list,\n          style: this.layers.railLayer.style,\n          convert: \"gd-84\",\n        },\n      ];\n      this.$refs.map.flyTo({\n        zoom: 13,\n        flyZoom: 8,\n        center: list[0],\n      });\n      console.log(this.layers.railLayer.features);\n    },\n    showCribEditor({ geos }) {\n      let list = geos.map((item) => [item.lon, item.lat]);\n      console.log(list);\n      this.layers.railLayer.features = [\n        {\n          type: \"polygon\",\n          coordinates: list,\n          style: this.layers.railLayer.style,\n          convert: \"gd-84\",\n        },\n      ];\n      this.$refs.map.flyTo({\n        zoom: 13,\n        flyZoom: 8,\n        center: list[0],\n      });\n      console.log(this.layers.railLayer.features);\n    },\n    showCircleEditor({ geos, radius }) {\n      const [center] = geos.map((item) => [item.lon, item.lat]);\n      console.log(center);\n      this.layers.railLayer.features = [\n        {\n          type: \"Circle\",\n          center,\n          radius,\n          style: this.layers.railLayer.style,\n          convert: \"gd-84\",\n        },\n      ];\n      this.$refs.map.flyTo({\n        zoom: 13,\n        // flyZoom: 8,\n        center,\n      });\n    },\n    drawRail(type) {\n      console.log(\"drawRail\", type);\n      // this.layers.railLayer.features = []\n      this.drawType = type;\n    },\n    drawend(evt, map) {\n      const { feature } = evt;\n      console.log(this.drawType);\n      this.layers.railLayer.features = []; // 清空上一个电子围栏\n      const geometry = feature.getGeometry();\n      if (this.drawType === \"Rectangle\" || this.drawType === \"Polygon\") {\n        const [coordinates] = geometry.getCoordinates();\n        const convertCoordinates = coordinates.map((coordinate) => {\n          return utils.convertCoordinate(coordinate, \"84-gd\");\n        });\n        console.log(coordinates);\n        console.log(convertCoordinates);\n        const params = {\n          geos: convertCoordinates.map((item) => {\n            return {\n              lon: item[0],\n              lat: item[1],\n            };\n          }),\n        };\n        console.log(params);\n        this.$refs.electronicFenceEdit.updateGeometry(params);\n      } else if (this.drawType === \"Circle\") {\n        const center = geometry.getCenter();\n        console.log(center);\n        const geoRadius = geometry.getRadius(); // 半径\n        const metersPerUnit = map.getView().getProjection().getMetersPerUnit(); // 半径以米为单位\n        const radius = (geoRadius * metersPerUnit).toFixed(2);\n        console.log(radius);\n        const convertCoordinates = utils.convertCoordinate(center, \"84-gd\");\n        const params = {\n          geos: [\n            {\n              lon: convertCoordinates[0],\n              lat: convertCoordinates[1],\n            },\n          ],\n          radius,\n        };\n        console.log(params);\n        this.$refs.electronicFenceEdit.updateGeometry(params);\n      }\n    },\n    initPosition(pathId) {\n      this.$api.getPointListApi({ \n        pathId: pathId,\n        pageIndex: 1,\n        pageSize: 999999\n       },{\n      onSucess: (res) => {\n        let list = res.data.data.map(item => [item.longitude, item.latitude]);\n       console.log('list',list)\n        this.layers.stationLayer.features = [\n          {\n            type: \"polyline\",\n            coordinates: list,\n            convert: \"gd-84\",\n          },\n        ];\n        this.layers.pointLayer.features = list.map(coord => ({\n          type: \"point\",\n          coordinates: coord,\n          properties: {\n            name: `站点-${coord.join(',')}`\n          },\n          // style: this.layers.pointLayer.style,\n        }));\n        this.$refs.map.flyTo({\n          zoom: 9,\n          flyZoom: 8,\n          center: list[0],\n        });\n        },\n      });  \n    }\n  },\n  \n  mounted() {\n    let query = this.$route.query;\n    if (query && query.pathId) {\n      this.showFenceEdit = false\n      this.initPosition(query.pathId)\n    }\n  },\n};\n",null]}