管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-02-18 cbbbc6bd2d854270b9342ce2ff2a3432aaca22cf
src/components/MapView/mapMenuPop.vue
@@ -266,7 +266,7 @@
        entity: [],
        wkt: null,
        descr: null,
      },
      listPage: {
        pageSize: 10,
@@ -331,9 +331,9 @@
        this.$message.error("数据请求失败");
        return;
      }
      if (data.result.length == 0 || data.result == null) {
        this.insertFlag = 1;
        this.dialogVisible = true;
      } else {
@@ -347,20 +347,20 @@
          } else {
            val += "&ids=" + data.result[i]
          }
          std.push({
            name: data.result[i]
          })
        }
        const data1 = await dataLib_selectDepsByIds(val);
        this.ruleForm.depid = data1.result;
        this.ruleForm.depname = std;
        this.ruleForm.wkt = decr(this.listdata.wkt)
        this.ruleForm.tabs = this.option;
        this.dialogInsertVisible = true;
      }
      }download
    },
    async signGetPublicKey() {
      const res = await sign_getPublicKey();
@@ -400,12 +400,12 @@
        var std = [];
        var std1 = [];
        for (var i in this.option) {
          std.push(this.option[i].tabDesc)
          std1.push(this.option[i].entity)
        }
        var obj = {
          ids: this.insertOption.ids,
          depcodes: this.insertOption.ids,
          pwd: encr(this.codeForm.password),
          tabs: std,
          entities: std1,
@@ -421,10 +421,10 @@
          message: '数据申请成功',
          type: 'success'
        });
        this.closeDown();
      }
    },
    async selectDownloadFile(rsid, rspwd) {
      var downObj = {
@@ -467,7 +467,21 @@
      this.listdata.name = null;
      this.option = [];
    },
    clearQuerInfo() {
      if (this.$store.state.queryInfo.length != 0) {
        for (var i in this.$store.state.queryInfo) {
          sgworld.Viewer.entities.remove(this.$store.state.queryInfo[i]);
        }
        this.$store.state.queryInfo = [];
        if (this.$store.state.primitLayer != null) {
            sgworld.Viewer.entities.remove(this.$store.state.primitLayer);
          sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
          this.$store.state.primitLayer = null;
        }
      }
    },
    setTableAll() {
      this.clearQuerInfo();
      this.signGetPublicKey();
      this.startTableMssage();
      this.listdata.wkt = this.$store.state.mapMenuShpFile;
@@ -481,7 +495,7 @@
      }, []);
      this.option = arr;
      this.listdata.name = this.option[0].entity;
      this.getTableDateHidder();
    },
    async getTableDateHidder() {
@@ -497,7 +511,7 @@
      this.attributeData = [];
      var valadata = data.result;
      var laydomain = data1.result;
      for (var i in valadata) {
        if (valadata[i].showtype == 1) {
          if (
@@ -525,7 +539,7 @@
      if (data.code != 200) {
        this.$message.error("列表调用失败");
      }
      var val1 = decr(data.result);
      if (val1) {
        if (this.imagePoint != null) {
@@ -554,7 +568,7 @@
      } 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 });
        }
@@ -573,7 +587,7 @@
      } 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 });
        }
@@ -604,12 +618,12 @@
    },
    async getTableData() {
      this.tableData = [];
      const data = await dataQuery_selectByPage(this.listdata);
      if (data.code != 200) {
        this.$message.error("列表调用失败");
      }
      var val_Data = data.result;
      for (var i in val_Data) {
        var valste = val_Data[i];
@@ -628,13 +642,7 @@
      this.showAllImage(data.result);
    },
    async showAllImage(res) {
      if (window.Viewer.scene.primitives.length != null) {
        window.Viewer.scene.primitives.removeAll();
      }
      if (this.$store.state.primitLayer != null) {
        sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
        this.$store.state.primitLayer = null;
      }
      for (var i in res) {
        var param = {
          gid: res[i].gid,
@@ -647,7 +655,7 @@
        var val1 = decr(data.result);
        if (val1) {
          var wkt = this.$wkt.parse(val1);
          this.getprimitiLayer(wkt);
          // this.getprimitiLayer(wkt);
          this.primitivesAddLayer(wkt);
        }
      }
@@ -662,41 +670,51 @@
      }
    },
    primitivesAddLayer(res) {
      switch (res.type) {
        case "Point":
          var val = Cesium.Cartesian3.fromDegrees(
            res.coordinates[0],
            res.coordinates[1],
            200
          );
          this.$store.state.primitLayer.add({
          var point = Viewer.entities.add({
            position: val,
            image: SmartEarthRootUrl + "Workers/image/mark.png",
            billboard: {
              // 图像地址,URI或Canvas的属性
              image: SmartEarthRootUrl + "Workers/image/mark.png",
              heightReference: Cesium.HeightReference.CLAMP_TO_GROUND,
              // 大小是否以米为单位
              sizeInMeters: false,
              // 相对于坐标的垂直位置
              verticalOrigin: Cesium.VerticalOrigin.CENTER,
              // 相对于坐标的水平位置
              horizontalOrigin: Cesium.HorizontalOrigin.LEFT,
              // 应用于图像的统一比例。比例大于会1.0放大标签,而比例小于会1.0缩小标签。
              scale: 1.0,
              // 是否显示
              show: true
            }
          });
          point.billboard.disableDepthTestDistance = Number.POSITIVE_INFINITY;
          this.$store.state.queryInfo.push(point)
          break;
        case "LineString":
        case "MultiLineString":
          var line = res.coordinates[0];
          var std = [];
          for (var i in line) {
            std.push(line[i][0], line[i][1]);
          }
          var instance = new Cesium.GeometryInstance({
            geometry: new Cesium.GroundPolylineGeometry({
          var polyline = Viewer.entities.add({
            polyline: {
              positions: Cesium.Cartesian3.fromDegreesArray(std),
              width: 4.0,
            }),
            attributes: {
              color: Cesium.ColorGeometryInstanceAttribute.fromColor(
                new Cesium.Color(1.0, 0.0, 0.0, 0.3)
              ),
            },
          });
          window.Viewer.scene.primitives.add(
            new Cesium.GroundPolylinePrimitive({
              geometryInstances: instance,
              appearance: new Cesium.PolylineColorAppearance(),
            })
          );
              width: 5,
              material: new Cesium.Color(1.0, 0.0, 0.0, 0.3),
              clampToGround: true,
            }
          })
          this.$store.state.queryInfo.push(polyline)
          break;
        case "MultiPolygon":
          var val = res.coordinates[0][0];
@@ -704,28 +722,20 @@
          for (var i in val) {
            std.push(val[i][0], val[i][1]);
          }
          var primitive = new Cesium.GroundPrimitive({
            //贴地的primitive
            geometryInstances: new Cesium.GeometryInstance({
              geometry: new Cesium.PolygonGeometry({
                //支持CircleGeometry,CorridorGeometry,EllipseGeometry,RectangleGeometry
                polygonHierarchy: new Cesium.PolygonHierarchy(
                  Cesium.Cartesian3.fromDegreesArray(std)
                ),
              }),
              attributes: {
                color: Cesium.ColorGeometryInstanceAttribute.fromColor(
                  new Cesium.Color(1.0, 0.0, 0.0, 0.3)
                ),
              },
            }),
            appearance: Cesium.EllipsoidSurfaceAppearance(),
          });
          window.Viewer.scene.primitives.add(primitive);
          var entity = Viewer.entities.add({
            polygon: {
              hierarchy: Cesium.Cartesian3.fromDegreesArray(std),
              //height : 100000,
              material: new Cesium.Color(1.0, 0.0, 0.0, 0.3),
              outline: true,
              outlineColor: new Cesium.Color(1.0, 0.0, 0.0, 0.3),
            }
          })
          this.$store.state.queryInfo.push(entity)
          break;
      }
    },
    closeMenuBox() {
      if (this.imagePoint != null) {
        sgworld.Creator.DeleteObject(this.imagePoint);
@@ -765,7 +775,6 @@
    float: left;
    border-right: 1px solid gray;
    li {
      color: white;
      line-height: 20px;
      border-bottom: 1px solid gray;
      padding: 5px;
@@ -782,14 +791,14 @@
      justify-content: flex-end;
    }
  }
  .rightBox {
    width: calc(80% - 1px);
    height: 100%;
    float: left;
    .rightTitle {
      padding: 5px;
      color: white;
      width: 100%;
    }
    .tableBox {
@@ -799,107 +808,14 @@
      margin-left: 50px;
      /*不可点击的*/
    }
    .pagination_box {
      position: absolute;
      bottom: 10px;
      /deep/.el-input__inner {
        background-color: transparent !important;
        border: 1px solid;
        color: white;
      }
      /deep/.el-pagination__total {
        color: white;
      }
      /deep/.el-pagination__jump {
        color: white;
      }
      /deep/.el-pager li.active {
        color: #409eff;
      }
      /deep/.el-pager li {
        color: white;
        background: transparent;
      }
      /deep/.el-pager li {
        color: white;
      }
      /deep/.btn-prev {
        background: transparent;
      }
      /deep/.btn-next {
        background: transparent;
      }
      /deep/.btn-next i {
        color: white;
      }
      /deep/.btn-prev i {
        color: white;
      }
    }
    .boxClose {
      float: right;
      margin-right: 20px;
      color: white;
    }
  }
  /deep/ .el-table {
    background-color: transparent;
    th,
    td {
      background-color: transparent;
    }
    .el-table__expanded-cell {
      background-color: transparent !important;
    }
    // 表头背景色
    th.el-table__cell {
      background-color: #303030;
      color: #fff;
    }
    tr > td {
      background-color: #303030;
      color: #fff;
    }
    // hover效果
    tr:hover > td {
      background-color: rgba(255, 255, 255, 0.3) !important;
    }
    tbody tr:hover {
      background-color: rgba(255, 255, 255, 0.3) !important;
      // text-align: center;
    }
    // 滚动条宽高
    .el-table__body-wrapper::-webkit-scrollbar {
      width: 5px;
      height: 5px;
    }
    .el-table__body-wrapper::-webkit-scrollbar {
      width: 5px;
      /*滚动条宽度*/
      height: 5px;
      /*滚动条高度*/
    }
    /*定义滚动条轨道 内阴影+圆角*/
    .el-table__body-wrapper::-webkit-scrollbar-track {
      box-shadow: 0px 1px 3px #216fe6 inset;
      /*滚动条的背景区域的内阴影*/
      border-radius: 10px;
    }
    /*定义滑块 内阴影+圆角*/
    .el-table__body-wrapper::-webkit-scrollbar-thumb {
      box-shadow: 0px 1px 3px #216fe6 inset;
      border-radius: 6px;
      background-color: #216fe6;
    }
  }
}
li {
  line-height: 20px;
  border-bottom: 1px solid gray;