管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-06-29 f30dbe373cc0d4296a71b545811f0a0ad92e4cec
src/views/exportMap/index.vue
@@ -127,7 +127,7 @@
      <el-form
        ref="form"
        :model="form"
        label-width="80px"
        label-width="110px"
      >
        <el-form-item label="出图名称">
          <el-input v-model="form.name"></el-input>
@@ -315,7 +315,7 @@
      rowtype: true,
      loading: false,
      form: {},
      formInline: { role: "" },
      formInline: { role: 0 },
      layerform: {},
      tableData: [],
      exportable: [],
@@ -371,23 +371,31 @@
      });
    },
    async LayerStart() {
      this.treeData = [];
      const data = await perms_selectLayers()
      if (data.code != 200) {
        return this.$message.error("图层列表查询失败")
      }
      var res = data.result;
      var val = [];
      var std = [];
      var layerWMS = [];
      for (var i in res) {
      const val = [];
      const std = [];
      const layerWMS = [];
      for (var i = 0; i < res.length; i++) {
        var str = res[i];
        if (str.type == 1 && str.icon == 1) {
        if (str.type == 1
          && str.cnName.indexOf('模型') == -1
          && str.cnName.indexOf('倾斜摄影') == -1
          && str.cnName.indexOf('数字正射影像') == -1
          && str.cnName.indexOf('点云') == -1
          && str.isProject != 1) {
          val.push(str)
        } else if (str.url != null && str.type == 2 && str.icon == 1) {
          if (str.isShow == 1) {
        }
        if (str.url != null && str.type == 2 && str.serveType == 'WMS') {
          if (str.isShow == 1) {
            std.push(str.id)
            layerWMS.push(str)
            this.tableData.push({
@@ -398,12 +406,26 @@
          val.push(str)
        }
      }
      var res = this.setTreeData(val);
      this.treeData = res;
      const val_data = val.filter(ts => {
        if (ts.type == 1) {
          return ts
        }
        if (ts.url != null && ts.type == 2 && ts.serveType == 'WMS') {
          return ts
        }
      })
      var layer_data = this.setTreeData(val_data);
      this.treeData = layer_data;
      this.$refs.tree.setCheckedKeys(std)
      this.showMapLayer(layerWMS);
    },
    setClearMap() {
      var layers_ol = mapView.getAllLayers();
      for (var i in layers_ol) {
@@ -418,6 +440,7 @@
        this.setClearMap();
        var url = [];
        for (var i in val) {
          console.log(val[i])
          if (val[i].url) {
            url.push(val[i].url)
          }
@@ -508,7 +531,7 @@
        resolution: "20米",
        date: this.getYMD(),
        layers: res.toString(),
        rotation: this.form.role,
        rotation: this.formInline.role,
        xmin: this.layerExtent.xmin,
        ymin: this.layerExtent.ymin,
        xmax: this.layerExtent.xmax,
@@ -555,6 +578,7 @@
        mapView.removeLayer(this.vector)
      }
      this.layerExtent = null
      this.formInline.role = '';
    },
    stopDraw() {
      // if (this.draw !== null) {
@@ -577,7 +601,9 @@
      mapView.addLayer(this.vector)
      let type = 'Circle'
      let geometryFunction2 = createRegularPolygon(4)
      // var geometryFunction = ol.interaction.Draw.createBox();
      // console.log(geometryFunction)
      let geometryFunction2 = createBox()
      this.draw = new Draw({
        source: this.source,
        type: type,
@@ -587,6 +613,11 @@
      this.draw.on("drawend", e => {
        let feature = e.feature
        let geom = feature.getGeometry()
        var bbox = geom.getExtent();
        debugger
        var ss = turf.square(bbox);
        geom.setCoordinates([[[ss[0], ss[3]], [ss[2], ss[3]], [ss[2], ss[1]], [ss[0], ss[1]], [ss[0], ss[3]]]]);
        e.feature.setGeometry(geom);
        var extent = geom.getExtent()
        var a1 = transform([extent[0], extent[1]], "EPSG:3857", "EPSG:4326")
        var a2 = transform([extent[2], extent[3]], "EPSG:3857", "EPSG:4326")
@@ -600,7 +631,7 @@
        mapView.removeInteraction(this.draw)
      })
      mapView.addInteraction(this.draw);
    },
    //绘制图形
    setMapAddDraw() {
@@ -737,22 +768,43 @@
    },
    //地图初始化
    initMap() {
      var TiandiLayer = new TileLayer({
        source: new XYZ({
          url: "http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}",
        }),
      })
      var TiandiLayer, GaoDeLayer;
      if (is_production) {
        var base_ulr = window.sceneConfig.baseUrl;
        if (base_ulr.indexOf('{host}') > -1) {
          base_ulr = base_ulr.replace("{host}", iisHost)
        }
        GaoDeLayer = new TileLayer({
          title: "高德地图",
          source: new XYZ({
            url: base_ulr,
            wrapX: false
          })
        });
        var base_ulr_sl = window.sceneConfig.baseUrl_sl;
        if (base_ulr_sl.indexOf('{host}') > -1) {
          base_ulr_sl = base_ulr_sl.replace("{host}", iisHost)
        }
        TiandiLayer = new TileLayer({
          source: new XYZ({
            url: base_ulr_sl,
          }),
        })
      } else {
        TiandiLayer = new TileLayer({
          source: new XYZ({
            url: "http://wprd0{1-4}.is.autonavi.com/appmaptile?lang=zh_cn&size=1&style=7&x={x}&y={y}&z={z}",
          }),
        })
      var GaoDeLayer = new TileLayer({
        source: new XYZ({
          url: "http://wprd01.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=6",
        }),
      })
      // var GaoDeTitle = new TileLayer({
      //   source: new XYZ({
      //     url: "http://wprd01.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=8",
      //   }),
      // })
        GaoDeLayer = new TileLayer({
          source: new XYZ({
            url: "http://wprd01.is.autonavi.com/appmaptile?x={x}&y={y}&z={z}&lang=zh_cn&size=1&scl=1&style=6",
          }),
        })
      }
      window.mapView = new Map({
        target: "mapView",
        layers: [TiandiLayer, GaoDeLayer],
@@ -763,8 +815,10 @@
        }),
        controls: defaultControls().extend([new FullScreen(), new ScaleLine(), new Rotate()]),
      })
      // console.log(mapView.getLayers().item(2))
      mapView.getLayers().item(1).setVisible(false)
      mapView.getLayers().item(2).setVisible(false)
      // mapView.getLayers().item(2).setVisible(false)
      // this.formInline.role = mapView.getView().getRotation()
    },
    //切换底图
@@ -873,14 +927,14 @@
  /deep/.el-form-item {
    margin-top: 10px;
  }
  /deep/ .el-tree-node {
    .is-leaf + .el-checkbox .el-checkbox__inner {
      display: inline-block;
    }
  // /deep/ .el-tree-node {
  //   .is-leaf + .el-checkbox .el-checkbox__inner {
  //     display: inline-block;
  //   }
    .el-checkbox .el-checkbox__inner {
      display: none;
    }
  }
  //   .el-checkbox .el-checkbox__inner {
  //     display: none;
  //   }
  // }
}
</style>