管道基础大数据平台系统开发-【前端】-新系統界面
q
Surpriseplus
2022-12-23 8d301b885c7c433300b5bbeb47a0864eb738fad4
src/components/MapView/mapSpacePop.vue
@@ -1,13 +1,12 @@
<template>
  <div class="menuPop">
    <div class="rightTitle">
      <span>管道</span>
      <el-link @click="closeSpaceBox" :underline="false" class="boxClose"
        ><i class="el-icon-close"></i>
      </el-link>
    </div>
    <div style="padding: 5px">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <el-form
        :inline="true"
        :model="formInline"
        class="demo-form-inline"
      >
        <el-form-item>
          <el-select
            v-model="formInline.name"
@@ -47,19 +46,34 @@
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button plain @click="setSpaceTableLayer">查詢</el-button>
          <el-button plain @click="restSpacePopLayer">重置</el-button>
          <el-button
            plain
            @click="setSpaceTableLayer"
          >查询</el-button>
          <el-button
            plain
            @click="restSpacePopLayer"
          >重置</el-button>
        </el-form-item>
      </el-form>
      <div class="centTable">
        <el-table :data="tableData" height="220" style="width: 100%">
        <el-table
          :data="tableData"
          height="260px"
          ref="filterTable"
          style="width: 100%"
        >
          <el-table-column
            align="center"
            type="index"
            label="序号"
            width="50"
          />
          <el-table-column label="定位" width="100" align="center">
          <el-table-column
            label="定位"
            width="100"
            align="center"
          >
            <template slot-scope="scope">
              <el-button
                icon="el-icon-map-location"
@@ -308,6 +322,7 @@
        }
      }
      this.tableData = data.result;
      this.$refs.filterTable.doLayout();
    },
    async spaceLocation(index, row) {
      var param = {
@@ -321,9 +336,9 @@
      var val1 = decr(data.result);
      if (val1) {
        if (this.imagePoint != null) {
          sgworld.Creator.DeleteObject(this.imagePoint);
          this.imagePoint = null;
        if (this.$store.state.primitLayer != null) {
          sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
          this.$store.state.primitLayer = null;
        }
        var wkt = this.$wkt.parse(val1);
        this.setMapLoaction(wkt);
@@ -338,9 +353,13 @@
      this.getSpaceTableLayer();
    },
    setMapLoaction(res) {
          if (this.$store.state.primitLayer != null) {
          sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
          this.$store.state.primitLayer = null;
        }
      var coord = res.coordinates;
      if (res.type == 'Point') {
        this.imagePoint = sgworld.Creator.CreateLabel(
        this.$store.state.primitLayer = sgworld.Creator.CreateLabel(
          { X: coord[0], Y: coord[1], Altitude: 2000 },
          '',
          SmartEarthRootUrl + 'Workers/image/mark.png',
@@ -351,7 +370,29 @@
          0,
          '巡检点'
        );
        sgworld.Navigate.flyToObj(this.imagePoint.item);
        sgworld.Navigate.flyToObj(this.$store.state.primitLayer.item);
      } else if (res.type == 'MultiPolygon') {
        var val = res.coordinates[0][0];
        var std = [];
        for (var i in val) {
          std.push({ x: val[i][0], y: val[i][1], z: 1000 })
        }
        this.$store.state.primitLayer = sgworld.Creator.createPolygon(std, {
          fillColor: '#ffff00',
          outlineColor: '#fff',
          outlineWidth: 2
        }, 1, 0, "面");
        sgworld.Navigate.flyToObj(this.$store.state.primitLayer.item);
      } else if (res.type == 'MultiLineString') {
        var line = res.coordinates[0];
        var std = [];
        for (var i in line) {
          std.push({ x: line[i][0], y: line[i][1], z: 1000 })
        }
       this.$store.state.primitLayer = sgworld.Creator.createPolyline(std, "#ffff00", 1, 0, "线");
        sgworld.Navigate.flyToObj(this.$store.state.primitLayer.item);
      }
    },
  },
@@ -367,7 +408,9 @@
  overflow: hidden;
  border: 1px solid gray;
  float: left;
  .centTable {
    height: 230px;
  }
  .rightTitle {
    padding: 5px;
    color: white;
@@ -378,7 +421,6 @@
      color: white;
    }
  }
  .bottomPage {
    position: absolute;
    bottom: 1%;
@@ -394,7 +436,6 @@
  }
  /deep/ .el-table {
    background-color: transparent;
    th,
    td {
      background-color: transparent;