管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2023-02-14 c1514cfc69b679d05398bb1def6b24c772426aa0
综合展示图层管理图标切换
已修改14个文件
1787 ■■■■■ 文件已修改
src/assets/css/config.css 248 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/css/configure.css 261 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/css/index.css 13 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/MapView/mapMenuPop.vue 136 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/MapView/mapMenuTop.vue 102 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/MapView/mapSpacePop.vue 107 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/mapol.vue 138 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/mapsdk.vue 20 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/store/index.js 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Synthesis/LeftMenu.vue 307 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Synthesis/index.vue 20 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Tools/LayerTree.vue 298 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Tools/pipeLineAnaly.vue 134 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/Tools/queryinfo.vue 2 ●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/css/config.css
@@ -246,9 +246,253 @@
    background-color: #303030;
    color: #FFF;
}
.Black_theme .contentBox{
.Black_theme .contentBox {
    color: #FFF;
}
.Black_theme .scopeRowColor{
.Black_theme .scopeRowColor {
    color: #FFF;
}
.Black_theme .popupBox .popupContainer {
    background-color: rgba(48, 48, 48, 0.85) !important;
}
.Black_theme .popupBox .popupContainer .popupTitle {
    color: #FFF;
}
.Black_theme .el-icon-arrow-up {
    color: #FFF;
}
.Black_theme .el-icon-close {
    color: #FFF;
}
.Black_theme  .el-icon-arrow-down{
    color: #FFF;
}
.Black_theme .twoMenu_imge11 {
    background: url("../../assets/img/synthesis/图层 32.png") no-repeat center;
}
.Black_theme .twoMenu_imge12 {
    background: url("../../assets/img/synthesis/图层 35.png") no-repeat center;
}
.Black_theme .twoMenu_imge13 {
    background: url("../../assets/img/synthesis/发布.png") no-repeat center;
}
/* //视图 */
.Black_theme .twoMenu_imge21 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge22 {
    background: url("../../assets/img/synthesis/图层 10 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge23 {
    background: url("../../assets/img/synthesis/图层 11 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge24 {
    background: url("../../assets/img/synthesis/图层 12 拷贝 2.png") no-repeat center;
}
.Black_theme .twoMenu_imge25 {
    background: url("../../assets/img/synthesis/圆角矩形 5 拷贝 2.png") no-repeat center;
}
.Black_theme .twoMenu_imge26 {
    background: url("../../assets/img/synthesis/圆角矩形 5 拷贝 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge27 {
    background: url("../../assets/img/synthesis/矩形 9.png") no-repeat center;
}
.Black_theme .twoMenu_imge28 {
    background: url("../../assets/img/synthesis/椭圆 4.png") no-repeat center;
}
.Black_theme .twoMenu_imge29 {
    background: url("../../assets/img/synthesis/z_03.png") no-repeat center;
}
/* //漫游 */
.Black_theme .twoMenu_imge31 {
    background: url("../../assets/img/synthesis/椭圆 6.png") no-repeat center;
}
.Black_theme .twoMenu_imge32 {
    background: url("../../assets/img/synthesis/椭圆 7 拷贝 2.png") no-repeat center;
}
.Black_theme .twoMenu_imge33 {
    background: url("../../assets/img/synthesis/图层 14 副本 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge34 {
    background: url("../../assets/img/synthesis/图层 74 拷贝 2.png") no-repeat center;
}
.Black_theme .twoMenu_imge35 {
    background: url("../../assets/img/synthesis/椭圆 7 拷贝 4.png") no-repeat center;
}
/* //分析 */
.Black_theme .twoMenu_imge41 {
    background: url("../../assets/img/synthesis/椭圆 8 拷贝 8.png") no-repeat center;
}
.Black_theme .twoMenu_imge42 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 5.png") no-repeat center;
}
.Black_theme .twoMenu_imge43 {
    background: url("../../assets/img/synthesis/圆角矩形 10 副本 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge44 {
    background: url("../../assets/img/synthesis/图层 74 拷贝 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge45 {
    background: url("../../assets/img/synthesis/图层 20.png") no-repeat center;
}
.Black_theme .twoMenu_imge46 {
    background: url("../../assets/img/synthesis/图层 14 拷贝 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge47 {
    background: url("../../assets/img/synthesis/图层 18.png") no-repeat center;
}
.Black_theme .twoMenu_imge48 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 6.png") no-repeat center;
}
.Black_theme .twoMenu_imge49 {
    background: url("../../assets/img/synthesis/管道.png") no-repeat center;
}
.Black_theme .twoMenu_imge410 {
    background: url("../../assets/img/synthesis/dxkw.png") no-repeat center;
}
.Black_theme .twoMenu_imge411 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
/* // 通视分析、视域分析 预留 */
.Black_theme .twoMenu_imge412 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
.Black_theme .twoMenu_imge413 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
.Black_theme .twoMenu_imge414 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
/* //查询 */
.Black_theme .twoMenu_imge51 {
    background: url("../../assets/img/synthesis/图层 23.png") no-repeat center;
}
.Black_theme .twoMenu_imge52 {
    background: url("../../assets/img/synthesis/空间查询.png") no-repeat center;
}
/* //定位 */
.Black_theme .twoMenu_imge61 {
    background: url("../../assets/img/synthesis/图层 27.png") no-repeat center;
}
.Black_theme .twoMenu_imge62 {
    background: url("../../assets/img/synthesis/图层 28.png") no-repeat center;
}
/* //测量 */
.Black_theme .twoMenu_imge71 {
    background: url("../../assets/img/synthesis/图层 31.png") no-repeat center;
}
.Black_theme .twoMenu_imge72 {
    background: url("../../assets/img/synthesis/图层 31 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge73 {
    background: url("../../assets/img/synthesis/矩形 13 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge74 {
    background: url("../../assets/img/synthesis/图层 18 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge75 {
    background: url("../../assets/img/synthesis/M 拷贝.png") no-repeat center;
}
.Black_theme .twoMenu_imge76 {
    background: url("../../assets/img/synthesis/空间测距.png") no-repeat center;
}
/*  高层量测图标 */
.Black_theme .twoMenu_imge77 {
    background: url("../../assets/img/synthesis/图层 31 拷贝.png") no-repeat center;
}
/* 标绘 */
.Black_theme .twoMenu_imge81 {
    background: url("../../assets/img/synthesis/椭圆 5 拷贝 3.png") no-repeat center;
}
.Black_theme .twoMenu_imge82 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 16.png") no-repeat center;
}
.Black_theme .twoMenu_imge83 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 20.png") no-repeat center;
}
.Black_theme .twoMenu_imge84 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 23.png") no-repeat center;
}
.twoMenu_imge85 {
    background: url("../../assets/img/synthesis/导入.png") no-repeat center;
}
.Black_theme .twoMenu_imge86 {
    background: url("../../assets/img/synthesis/导出.png") no-repeat center;
}
.Black_theme .twoMenu_imge87 {
    background: url("../../assets/img/synthesis/清除.png") no-repeat center;
}
.Black_theme .twoMenu_imge88 {
    background: url("../../assets/img/synthesis/图层 32.png") no-repeat center;
}
.Black_theme .menuPop .leftBox li{
    color: #FFF  ;
}
.Black_theme .popupBox .popupContainer{
    color: #FFF;
}
.Black_theme .popupBox .popupContainer{
    color: #FFF !important;
}
src/assets/css/configure.css
@@ -40,13 +40,16 @@
    background: transparent !important;
}
.el-tree {
    background: transparent !important;
}
.el-tree-node.is-current>.el-tree-node__content {
    color: #409eff !important;
}
.el-tree-node__content {
    background-color: transparent !important;
}
.el-tree-node__content :hover {
@@ -74,6 +77,256 @@
.el-dialog__wrapper {
    z-index: 999;
}
.scopeRowColor{
.scopeRowColor {
    color: #606266;
}
.popupBox .popupContainer {
    background-color: rgba(244, 248, 255, 0.85) !important;
}
.popupBox .popupContainer .popupTitle {
    color: #202020;
}
.el-icon-arrow-up {
    color: black;
}
.el-icon-close {
    color: black;
}
.el-tree-node__content:hover {
    background: transparent;
}
.el-icon-arrow-down {
    color: black;
}
.twoMenu_imge11 {
    background: url("../../assets/img/synthesis/images/3白底_26.png") no-repeat center;
}
.twoMenu_imge12 {
    background: url("../../assets/img/synthesis/图层 35.png") no-repeat center;
}
.twoMenu_imge13 {
    background: url("../../assets/img/synthesis/发布.png") no-repeat center;
}
/* //视图 */
.twoMenu_imge21 {
    background: url("../../assets/img/synthesis/images/3白底_64.png") no-repeat center;
}
.twoMenu_imge22 {
    background: url("../../assets/img/synthesis/images/3白底_55.png") no-repeat center;
}
.twoMenu_imge23 {
    background: url("../../assets/img/synthesis/images/3白底_49.png") no-repeat center;
}
.twoMenu_imge24 {
    background: url("../../assets/img/synthesis/images/3白底_58.png") no-repeat center;
}
.twoMenu_imge25 {
    background: url("../../assets/img/synthesis/images/3白底_67.png") no-repeat center;
}
.twoMenu_imge26 {
    background: url("../../assets/img/synthesis/images/3白底_69.png") no-repeat center;
}
.twoMenu_imge27 {
    background: url("../../assets/img/synthesis/images/3白底_61.png") no-repeat center;
}
.twoMenu_imge28 {
    background: url("../../assets/img/synthesis/images/3白底_52.png") no-repeat center;
}
.twoMenu_imge29 {
    background: url("../../assets/img/synthesis/images/3白底_157.png") no-repeat center;
}
/* //漫游 */
.twoMenu_imge31 {
    background: url("../../assets/img/synthesis/images/3白底_84.png") no-repeat center;
}
.twoMenu_imge32 {
    background: url("../../assets/img/synthesis/images/3白底_90.png") no-repeat center;
}
.twoMenu_imge33 {
    background: url("../../assets/img/synthesis/images/3白底_87.png") no-repeat center;
}
.twoMenu_imge34 {
    background: url("../../assets/img/synthesis/images/3白底_93.png") no-repeat center;
}
.twoMenu_imge35 {
    background: url("../../assets/img/synthesis/椭圆 7 拷贝 4.png") no-repeat center;
}
/* //分析 */
.twoMenu_imge41 {
    background: url("../../assets/img/synthesis/images/3白底_122.png") no-repeat center;
}
.twoMenu_imge42 {
    background: url("../../assets/img/synthesis/images/3白底_125.png") no-repeat center;
}
.twoMenu_imge43 {
    background: url("../../assets/img/synthesis/images/3白底_135.png") no-repeat center;
}
.twoMenu_imge44 {
    background: url("../../assets/img/synthesis/images/3白底_128.png") no-repeat center;
}
.twoMenu_imge45 {
    background: url("../../assets/img/synthesis/images/3白底_130.png") no-repeat center;
}
.twoMenu_imge46 {
    background: url("../../assets/img/synthesis/images/3白底_133.png") no-repeat center;
}
.twoMenu_imge47 {
    background: url("../../assets/img/synthesis/images/3白底_105.png") no-repeat center;
}
.twoMenu_imge48 {
    background: url("../../assets/img/synthesis/images/3白底_114.png") no-repeat center;
}
.twoMenu_imge49 {
    background: url("../../assets/img/synthesis/images/3白底_116.png") no-repeat center;
}
.twoMenu_imge410 {
    background: url("../../assets/img/synthesis/images/3白底_111.png") no-repeat center;
}
.twoMenu_imge411 {
    background: url("../../assets/img/synthesis/images/3白底_108-33.png") no-repeat center;
}
/* // 通视分析、视域分析 预留 */
.twoMenu_imge412 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
.twoMenu_imge413 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
.twoMenu_imge414 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat center;
}
/* //查询 */
.twoMenu_imge51 {
    background: url("../../assets/img/synthesis/images/3白底_154.png") no-repeat center;
}
.twoMenu_imge52 {
    background: url("../../assets/img/synthesis/images/3白底_148.png") no-repeat center;
}
/* //定位 */
.twoMenu_imge61 {
    background: url("../../assets/img/synthesis/images/3白底_186.png") no-repeat center;
}
.twoMenu_imge62 {
    background: url("../../assets/img/synthesis/images/3白底_183.png") no-repeat center;
}
/* //测量 */
.twoMenu_imge71 {
    background: url("../../assets/img/synthesis/images/3白底_206.png") no-repeat center;
}
.twoMenu_imge72 {
    background: url("../../assets/img/synthesis/images/3白底_198.png") no-repeat center;
}
.twoMenu_imge73 {
    background: url("../../assets/img/synthesis/images/3白底_201.png") no-repeat center;
}
.twoMenu_imge74 {
    background: url("../../assets/img/synthesis/images/3白底_203.png") no-repeat center;
}
.twoMenu_imge75 {
    background: url("../../assets/img/synthesis/images/3白底_208.png") no-repeat center;
}
.twoMenu_imge76 {
    background: url("../../assets/img/synthesis/images/3白底_195.png") no-repeat center;
}
/*  高层量测图标 */
.twoMenu_imge77 {
    background: url("../../assets/img/synthesis/images/3白底_198.png") no-repeat center;
}
/* 标绘 */
.twoMenu_imge81 {
    background: url("../../assets/img/synthesis/images/3白底_231.png") no-repeat center;
}
.twoMenu_imge82 {
    background: url("../../assets/img/synthesis/images/3白底_233.png") no-repeat center;
}
.twoMenu_imge83 {
    background: url("../../assets/img/synthesis/images/3白底_13.png") no-repeat center;
}
.twoMenu_imge84 {
    background: url("../../assets/img/synthesis/images/3白底_238.png") no-repeat center;
}
.twoMenu_imge85 {
    background: url("../../assets/img/synthesis/images/3白底_220.png") no-repeat center;
}
.twoMenu_imge86 {
    background: url("../../assets/img/synthesis/images/3白底_217.png") no-repeat center;
}
.twoMenu_imge87 {
    background: url("../../assets/img/synthesis/images/3白底_222.png") no-repeat center;
}
.twoMenu_imge88 {
    background: url("../../assets/img/synthesis/images/3白底_166.png") no-repeat center;
}
.el-icon-download{
    color: black;
}
.menuPop .leftBox li{
    color: black  ;
}
.popupBox .popupContainer{
    color: #606266 !important;
}
src/assets/css/index.css
@@ -258,4 +258,15 @@
    /* 
    */
    
}
}
.distance-legend {
    bottom: 55px !important;
  }
  .ol-scale-line {
    bottom: 55px !important;
    right:10px
  }
  .ol-scale-line{
    display: block !important;
  }
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;
      }
    },
    async signGetPublicKey() {
      const res = await sign_getPublicKey();
@@ -400,7 +400,7 @@
        var std = [];
        var std1 = [];
        for (var i in this.option) {
          std.push(this.option[i].tabDesc)
          std1.push(this.option[i].entity)
        }
@@ -421,10 +421,10 @@
          message: '数据申请成功',
          type: 'success'
        });
        this.closeDown();
      }
    },
    async selectDownloadFile(rsid, rspwd) {
      var downObj = {
@@ -481,7 +481,7 @@
      }, []);
      this.option = arr;
      this.listdata.name = this.option[0].entity;
      this.getTableDateHidder();
    },
    async getTableDateHidder() {
@@ -497,7 +497,7 @@
      this.attributeData = [];
      var valadata = data.result;
      var laydomain = data1.result;
      for (var i in valadata) {
        if (valadata[i].showtype == 1) {
          if (
@@ -525,7 +525,7 @@
      if (data.code != 200) {
        this.$message.error("列表调用失败");
      }
      var val1 = decr(data.result);
      if (val1) {
        if (this.imagePoint != null) {
@@ -554,7 +554,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 +573,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 +604,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];
@@ -725,7 +725,7 @@
          break;
      }
    },
    closeMenuBox() {
      if (this.imagePoint != null) {
        sgworld.Creator.DeleteObject(this.imagePoint);
@@ -765,7 +765,6 @@
    float: left;
    border-right: 1px solid gray;
    li {
      color: white;
      line-height: 20px;
      border-bottom: 1px solid gray;
      padding: 5px;
@@ -782,14 +781,14 @@
      justify-content: flex-end;
    }
  }
  .rightBox {
    width: calc(80% - 1px);
    height: 100%;
    float: left;
    .rightTitle {
      padding: 5px;
      color: white;
      width: 100%;
    }
    .tableBox {
@@ -799,107 +798,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;
src/components/MapView/mapMenuTop.vue
@@ -43,7 +43,7 @@
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-select
          @change="changeValue($event)"
@@ -87,6 +87,19 @@
          plain
        >重置</el-button>
      </el-form-item>
      <!-- <el-form-item>
        <el-button
          plain
          size="small"
          @click="flyQuery"
        >查看</el-button>
        <el-button
          plain
          size="small"
          @click="flyRemove"
        >取消</el-button>
      </el-form-item> -->
    </el-form>
    <queryinfo ref="queryinfo" />
  </div>
@@ -122,7 +135,7 @@
          children: [],
        },
      ],
      queryOption: [
        {
          value: 'point',
@@ -154,16 +167,45 @@
        label: 'label',
      },
      graphicLayer: null,
      flyEntity: null,
    };
  },
  mounted() {
    // sgworld.Creator.SimpleGraphic.edit(false, { editProp: false });
    this.menuTopFrom.queryType = 'rectangle';
    this.getAllTable();
  },
  methods: {
    flyRemove() {
    },
    flyQuery() {
    // Viewer.flyTo( sgworld.Creator.SimpleGraphic._viewer.entities._entities._array[0])
      // switch (this.menuTopFrom.queryType) {
      //   case 'point': //点
      //     Viewer.camera.flyTo({
      //       destination: Cesium.Cartesian3.fromDegrees(this.flyEntity.lng, this.flyEntity.lat, 3000),
      //     });
      //     break;
      //   case 'polyline': //线
      //     debugger
      //     break;
      //   case 'rectangle': //矩形
      //     debugger
      //     break;
      //   case 'circle': //圆
      //     debugger
      //     break;
      //   case 'polygon': //多边形
      //     debugger
      //     break;
      // }
    },
    changeValue(value) {
      // var obj = {};
      // obj = this.queryOption.find(function (item) {
@@ -179,11 +221,11 @@
        this.$message.error('列表调用失败');
      }
      var option = data.result;
      for (var i in option) {
        var val_Data = option[i];
        val_Data.id = '1' + i;
        val_Data.label = val_Data.tabDesc  ;
        val_Data.label = val_Data.tabDesc;
        if (option[i].ns == 'bd') {
          this.layerData[0].children.push(val_Data);
        } else {
@@ -195,7 +237,7 @@
    getCheckedNodes() {
      var valTree = this.$refs.tree.getCheckedNodes();
      if (valTree.length == 0) return;
      this.menuTopFrom.queryLayer = valTree[0].tabDesc;
      for (var i = 0; i < valTree.length; i++) {
        this.treeChange.push(valTree[i]);
@@ -206,7 +248,7 @@
      this.treeChange = [];
      this.menuTopFrom.queryLayer = null;
      this.$refs.tree.setCheckedKeys([]);
    },
    //导入shp文件
    async setMenuTopFile() {
@@ -224,7 +266,7 @@
        }
      }
      if (count != 4) {
        this.$message({
          message: 'ShapeFile文件选择不全!',
          type: 'warning'
@@ -258,7 +300,7 @@
      //清空标绘
      sgworld.Creator.SimpleGraphic.edit(false, { editProp: false });
      sgworld.Creator.SimpleGraphic.clear();
      if (this.treeChange.length == 0) {
        this.$message.error('请选择要查询的数据');
        return;
@@ -272,6 +314,7 @@
            outlineWidth: 5,
          },
          (entity) => {
            this.setTurfGeometry(entity);
          }
        );
@@ -281,36 +324,42 @@
    },
    setTurfGeometry(res) {
      var that = this;
      var res_val;
      switch (this.menuTopFrom.queryType) {
        case 'point': //点
          var val = that.setCartesianToEightFour(res.position.getValue());
          res_val = val;
          that.setTurfCircle([val.lng, val.lat], 10);
          break;
        case 'polyline': //线
          var polyline = res.polyline.positions.getValue();
          res_val = polyline;
          that.setTurfPolyOrLine(polyline, 'polyline');
          break;
        case 'rectangle': //矩形
          let rectangle = res.rectangle.coordinates.getValue();
          res_val = rectangle;
          var result = new Cesium.Rectangle.subsample(
            rectangle,
            Cesium.Ellipsoid.WGS84,
            rectangle.height
          );
          that.setTurfPolyOrLine(result, 'rectangle');
          break;
        case 'circle': //圆
          var val = that.setCartesianToEightFour(res.position.getValue());
          res_val = res.position.getValue();
          var radius = res.ellipse.semiMajorAxis.getValue();
          that.setTurfCircle([val.lng, val.lat], radius);
          break;
        case 'polygon': //多边形
          var polygon = res.polygon.hierarchy.getValue().positions;
          res_val = polygon;
          that.setTurfPolyOrLine(polygon, 'polygon');
          break;
      }
      this.flyEntity = res_val
    },
    setTurfCircle(position, radius) {
      var options = {
@@ -342,12 +391,12 @@
      }
      this.setJonToWKT(restVal);
    },
    setJonToWKT(res) {
      console.log(res.geometry)
      var jsonToWkt = this.$wkt.convert(res.geometry);
      this.$store.state.mapMenuShpFile = encr(jsonToWkt);
      this.showMapMenuPop();
    },
    showMapMenuPop() {
@@ -356,12 +405,12 @@
      // this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close();
      this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.open("空间查询", null, {
        close: () => {
          if (this.$store.state.primitLayer != null) {
            sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
            // sgworld.Creator.DeleteObject(this.$store.state.primitLayer);
            this.$store.state.primitLayer = null;
          }
          if (window.Viewer.scene.primitives.length != 0) {
            window.Viewer.scene.primitives.removeAll()
          }
@@ -369,7 +418,7 @@
      });
      this.$bus.$emit('changeMapMenuTop', 'true');
      sgworld.Creator.SimpleGraphic.edit(false, { editProp: false });
     // sgworld.Creator.SimpleGraphic.clear();
      // sgworld.Creator.SimpleGraphic.clear();
      //清空inputFile
      // var file = document.getElementById('getMenuTopFile');
      // file.outerHTML = file.outerHTML;
@@ -381,8 +430,10 @@
      this.menuTopFrom.queryLayer = null;
      this.menuTopFrom.queryType = 'rectangle';
      this.$refs.tree.setCheckedKeys([]);
 //清空标绘
      sgworld.Creator.SimpleGraphic.edit(false, { editProp: false });
      sgworld.Creator.SimpleGraphic.clear();
      // //清除对象
      // if (window.Viewer.scene.primitives.length != null) {
      //   window.Viewer.scene.primitives.removeAll();
@@ -393,10 +444,10 @@
      // }
      //关闭窗口
      this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo");
    },
    setCartesianToEightFour(res) {
      var std = {};
@@ -426,5 +477,4 @@
  padding: 4px 20px;
  font-weight: 400;
}
</style>
src/components/MapView/mapSpacePop.vue
@@ -412,118 +412,19 @@
  }
  .rightTitle {
    padding: 5px;
    color: white;
    width: 100%;
    .boxClose {
      float: right;
      margin-right: 20px;
      color: white;
    }
  }
  .bottomPage {
    position: absolute;
    bottom: 1%;
  }
  // 设置输入框的背景色、字体颜色、边框属性设置;
  /deep/.el-input__inner {
    background-color: transparent !important ;
    color: #fff;
    border: 1px solid;
  }
  /deep/ .el-select .el-input__inner {
    border-color: #fff !important;
  }
  /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;
    }
  }
  .pagination_box {
    margin-top: 20px;
    /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;
    }
  }
}
</style>
src/components/mapol.vue
@@ -9,16 +9,35 @@
        id="cenBg"
        v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
      ></div>
    </div>
    <div v-show="$store.state.isNaviget"  class="sindagis-map-compass">
      <span
        class="left"
        @click="leftClick"
      ></span>
      <span
        class="center"
        @click="recoveryClick"
        :style="{transform: `rotate(${rotate}deg)`}"
      ></span>
      <span
        class="right"
        @click="rightClick"
      ></span>
    </div>
  </div>
</template>
<script>
import { easeOut } from 'ol/easing'
import TileLayer from "ol/layer/Tile"
import XYZ from "ol/source/XYZ"
import Map from "ol/Map"
import View from "ol/View"
import { transform } from "ol/proj"
import {
  OverviewMap,
  defaults as defaultControls,
@@ -37,6 +56,8 @@
      centerFlag: false,
      isActive: true,
      isMenuLayer: false,
      rotate: 0,
      currentDir: ''
    }
  },
  mounted() {
@@ -64,10 +85,20 @@
        }),
        controls: defaultControls().extend([
          new FullScreen(),
          new ScaleLine(),
        ]),
        interactions: defaultInteractions().extend([new DragRotateAndZoom()]),
      })
      // var scaleLine = new  ScaleLine({
      //   units: "metric"
      // });
      // map.addControl(scaleLine);
      map.on("moveend", function (e) {
        console.log(($(window).width() - $(".ol-scale-line-inner").width()) + "px");
        // $(".ol-scale-line").css("left", ($(window).width() - $(".ol-scale-line").width() - 25) + "px");
      });
    },
    changeMenulayer() {
@@ -84,11 +115,54 @@
        map.getLayers().item(1).setVisible(false)
      }
    },
    leftClick() {
      var view = map.getView();
      var center = map.getView().getCenter();
      var rotation = map.getView().getRotation();
      rotation = rotation - Math.PI / 2
      this.rotate -= 90
      view.animate({
        center: center,                                            //旋转中心点
        rotation: rotation,
        easing: easeOut                               //旋转速度
      })
      this.currentDir = 'left'
    },
    recoveryClick() {
      var view = map.getView();
      var center = map.getView().getCenter();
      let a = this.rotate % 360 // -270
      if (a != 0) { // 复位
        let dis = 360 - Math.abs(a)
        let dis1 = Math.abs(a)
        dis = dis > dis1 ? dis1 : dis
        if (dis == 180) dis = -180
        this.rotate = (this.rotate + dis) % 360 == 0 ? this.rotate + dis : this.rotate - dis
      }
      view.animate({
        center: center,
        rotation: 0,
        easing: easeOut
      })
    },
    rightClick() {
      var view = map.getView();
      var center = map.getView().getCenter();
      var rotation = map.getView().getRotation();
      rotation = rotation + Math.PI / 2
      this.rotate += 90
      view.animate({
        center: center,
        rotation: rotation,
        easing: easeOut
      })
      this.currentDir = 'right'
    },
  },
}
</script>
<style scoped>
<style lang="scss" scoped>
#mapol {
  width: 100%;
  height: 100%;
@@ -147,4 +221,64 @@
  background-size: 100% 100%;
  border-radius: 5px;
}
.ol-scale-line {
  bottom: 55px !important;
}
.sindagis-map-compass {
  position: absolute;
  right: 50px;
  bottom: 90px;
  z-index: 5;
  right: 25px;
  width: 52px;
  height: 54px;
  background: url("../assets/img/compass.png") 0% 0% / 266px no-repeat;
}
.sindagis-map-compass .left,
.sindagis-map-compass .center,
.sindagis-map-compass .right {
  position: absolute;
  outline: none;
  border: none;
  cursor: pointer;
  opacity: 1;
}
.sindagis-map-compass .left {
  background: url("../assets/img/compass.png") -75px -5px / 266px no-repeat;
  left: 2px;
  top: 5px;
  z-index: 1;
  width: 15px;
  height: 42px;
}
.sindagis-map-compass .left:hover {
  background: url("../assets/img/compass.png") -89px -5px / 266px no-repeat;
}
.sindagis-map-compass .center {
  background: url("../assets/img/compass.png") -56px -4px / 266px no-repeat;
  left: 19px;
  top: 4px;
  width: 14px;
  height: 44px;
  transform: rotate(0deg);
  transition: 1s;
}
.sindagis-map-compass .right {
  background: url("../assets/img/compass.png") -75px -5px / 266px no-repeat;
  right: 2px;
  top: 5px;
  z-index: 1;
  width: 15px;
  height: 42px;
  transform: scaleX(-1);
}
.sindagis-map-compass .right:hover {
  background: url("../assets/img/compass.png") -89px -5px / 266px no-repeat;
}
</style>
src/components/mapsdk.vue
@@ -294,14 +294,18 @@
      window.Viewer = window.sgworld._Viewer
      Viewer.imageryLayers._layers[0].show = false
      //定位
      sgworld.Navigate.jumpTo({
        //跳转视角
        destination: new Cesium.Cartesian3.fromDegrees(
          116.3911,
          39.9115,
          100000
        ),
      })
      // sgworld.Navigate.jumpTo({
      //   //跳转视角
      //   destination: new Cesium.Cartesian3.fromDegrees(
      //     116.3911,
      //     39.9115,
      //     100000
      //   ),
      // })
        Viewer.camera.flyTo({
        destination: Cesium.Cartesian3.fromDegrees(110, 33, 8000000),
      });
      Viewer.imageryLayers.addImageryProvider(
        new Cesium.UrlTemplateImageryProvider({
          url: gaoDeBaseUrl[0].url,
src/store/index.js
@@ -54,6 +54,7 @@
    layerMnage: false,
    themeflag:false,
    language: true,
    isNaviget:false,
  },
  mutations: {
    //获取权限合集
src/views/Synthesis/LeftMenu.vue
@@ -28,7 +28,14 @@
import { transform } from 'ol/proj';
import mapinfo from '../Tools/mapinfo.vue';
import maplayer from '../Tools/maplayer.vue';
import queryinfo from '../Tools/queryinfo.vue'
import queryinfo from '../Tools/queryinfo.vue';
import {
  OverviewMap,
  defaults as defaultControls,
  FullScreen,
  ScaleLine,
  Rotate,
} from "ol/control.js"
export default {
  components: { mapinfo, maplayer, queryinfo },
  data() {
@@ -36,7 +43,7 @@
      showTwoMenuFlag: false,
      setListTwoMenu: [],
      setListTwoMenuAll: [
          [
        [
          {
            id: 'a1',
            label: 'synthesis.layer',
@@ -195,7 +202,7 @@
            name: '地形开挖',
            css: 'twoMenu_imge411',
          },
           {
          {
            id: "d12",
            label: "synthesis.visibilityAnalysis",
            name: "通视分析",
@@ -331,12 +338,12 @@
            name: '导出',
            css: 'twoMenu_imge86',
          },
          {
            id: 'h8',
            label: 'synthesis.addlabel',
            name: '文字',
            css: 'twoMenu_imge88',
          },
          {
            id: 'h8',
            label: 'synthesis.addlabel',
            name: '文字',
            css: 'twoMenu_imge88',
          },
          {
            id: 'h7',
            label: 'synthesis.removepaint',
@@ -368,26 +375,28 @@
      isolineFlag: false,
      isslopeFlag: false,
      isContrastFlag: false,
      UndergroundMode: false
      UndergroundMode: false,
      scaleLine: null,
      Excavation:false,
    };
  },
  methods: {
    //二級菜单点击切换
    setChangeTwoMenu(res) {
        //清除绘制图形对象
        sgworld.Creator.SimpleGraphic.clear();
        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;
        }
        //关闭打开的信息窗体
      //清除绘制图形对象
      sgworld.Creator.SimpleGraphic.clear();
      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;
      }
      //关闭打开的信息窗体
      this.showTwoMenuFlag = res.id;
      this.$store.state.mapMenuBoolean = false;
      this.$store.state.mapMenuBoxFlag = null;
@@ -398,10 +407,10 @@
        window.model.deleteObject();
        window.model = null;
      }
      switch (val) {
        case 'a': //图层管理
          this.setCoverage(res.id);
@@ -470,11 +479,11 @@
        case 'h7':
          sgworld.Creator.SimpleGraphic.clear();
          break;
        case 'h8':
           sgworld.Creator.createSimpleGraphic('label', {}, function (entity) {
            });
          break;
        case 'h8':
          sgworld.Creator.createSimpleGraphic('label', {}, function (entity) {
          });
          break;
      }
    },
    handleSaveClick() {
@@ -515,7 +524,7 @@
        alert('当前场景没有entities实体');
      }
    },
    handleOpenClick() {
      sgworld.Creator.SimpleGraphic.edit(true, { editProp: true });
      let fileInput = document.querySelector('.file');
@@ -687,7 +696,7 @@
            }
          );
          break;
          case "j7":
        case "j7":
          var measure = window.sgworld.Command.execute(
            1,
            11,
@@ -768,7 +777,7 @@
      }
    },
    setAnalsy(res) {
      //this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo");
      //this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo");
      var that = this;
      switch (res) {
        case 'd1':
@@ -842,9 +851,9 @@
          );
          break;
        case 'd9':
         this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo");
          this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.close("queryinfo");
          this.$store.state.mapPopBoxFlag = '3';
          this.$refs && this.$refs.queryinfo && this.$refs.queryinfo.open("管道空间分析", null, {
            close: () => {
              if (this.$store.state.pipelineEntity.length != 0) {
@@ -903,7 +912,7 @@
          }
          break;
          case "d12":
        case "d12":
          if (window.Excavation) {
            window.Excavation.deleteObject()
            window.Excavation = null
@@ -914,11 +923,11 @@
          }
          break
        case "d13":
          if (window.Excavation) {
            window.Excavation.destroy()
            window.Excavation = null
          if (this.Excavation ) {
            this.Excavation.destroy()
            this.Excavation = null
          } else {
            window.Excavation = sgworld.Analysis.create3DViewshedPoss({
            this.Excavation = sgworld.Analysis.create3DViewshedPoss({
              height: 1.8,
            })
          }
@@ -1115,10 +1124,21 @@
        case 'b7': //比例尺
          this.isRuler = !this.isRuler;
          window.sgworld.navControl('scale', this.isRuler);
          if (this.isRuler == true) {
            this.scaleLine = new ScaleLine({
              units: "metric"
            });
            window.map.addControl(this.scaleLine);
          } else {
            window.map.removeControl(this.scaleLine);
            this.scaleLine = false;
          }
          break;
        case 'b8': //指北针
          this.isNaviget = !this.isNaviget;
          window.sgworld.navControl('nav', this.isNaviget);
          this.$store.state.isNaviget = this.isNaviget
          break;
        case 'b9': //地下模式
          this.UndergroundMode = !this.UndergroundMode;
@@ -1171,8 +1191,6 @@
.menu_Box {
  width: 100%;
  height: 100%;
  background: #303030;
  color: white;
  margin: 0;
  padding: 0;
  overflow-y: auto;
@@ -1202,206 +1220,9 @@
    border: 1px solid #409eff;
  }
  .menuTwoImage {
    width: 32px;
    height: 32px;
    width: 40px;
    height: 40px;
    display: inline-block;
  }
  .twoMenu_imge11 {
    background: url("../../assets/img/synthesis/图层 32.png") no-repeat center;
  }
  .twoMenu_imge12 {
    background: url("../../assets/img/synthesis/图层 35.png") no-repeat center;
  }
  .twoMenu_imge13 {
    background: url("../../assets/img/synthesis/发布.png") no-repeat center;
  }
  //视图
  .twoMenu_imge21 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 3.png")
      no-repeat center;
  }
  .twoMenu_imge22 {
    background: url("../../assets/img/synthesis/图层 10 拷贝.png") no-repeat
      center;
  }
  .twoMenu_imge23 {
    background: url("../../assets/img/synthesis/图层 11 拷贝.png") no-repeat
      center;
  }
  .twoMenu_imge24 {
    background: url("../../assets/img/synthesis/图层 12 拷贝 2.png") no-repeat
      center;
  }
  .twoMenu_imge25 {
    background: url("../../assets/img/synthesis/圆角矩形 5 拷贝 2.png")
      no-repeat center;
  }
  .twoMenu_imge26 {
    background: url("../../assets/img/synthesis/圆角矩形 5 拷贝 3.png")
      no-repeat center;
  }
  .twoMenu_imge27 {
    background: url("../../assets/img/synthesis/矩形 9.png") no-repeat center;
  }
  .twoMenu_imge28 {
    background: url("../../assets/img/synthesis/椭圆 4.png") no-repeat center;
  }
  .twoMenu_imge29 {
    background: url("../../assets/img/synthesis/z_03.png") no-repeat center;
  }
  //漫游
  .twoMenu_imge31 {
    background: url("../../assets/img/synthesis/椭圆 6.png") no-repeat center;
  }
  .twoMenu_imge32 {
    background: url("../../assets/img/synthesis/椭圆 7 拷贝 2.png") no-repeat
      center;
  }
  .twoMenu_imge33 {
    background: url("../../assets/img/synthesis/图层 14 副本 拷贝.png")
      no-repeat center;
  }
  .twoMenu_imge34 {
    background: url("../../assets/img/synthesis/图层 74 拷贝 2.png") no-repeat
      center;
  }
  .twoMenu_imge35 {
    background: url("../../assets/img/synthesis/椭圆 7 拷贝 4.png") no-repeat
      center;
  }
  //分析
  .twoMenu_imge41 {
    background: url("../../assets/img/synthesis/椭圆 8 拷贝 8.png") no-repeat
      center;
  }
  .twoMenu_imge42 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 5.png")
      no-repeat center;
  }
  .twoMenu_imge43 {
    background: url("../../assets/img/synthesis/圆角矩形 10 副本 3.png")
      no-repeat center;
  }
  .twoMenu_imge44 {
    background: url("../../assets/img/synthesis/图层 74 拷贝 3.png") no-repeat
      center;
  }
  .twoMenu_imge45 {
    background: url("../../assets/img/synthesis/图层 20.png") no-repeat center;
  }
  .twoMenu_imge46 {
    background: url("../../assets/img/synthesis/图层 14 拷贝 3.png") no-repeat
      center;
  }
  .twoMenu_imge47 {
    background: url("../../assets/img/synthesis/图层 18.png") no-repeat center;
  }
  .twoMenu_imge48 {
    background: url("../../assets/img/synthesis/圆角矩形 12 拷贝 6.png")
      no-repeat center;
  }
  .twoMenu_imge49 {
    background: url("../../assets/img/synthesis/管道.png") no-repeat center;
  }
  .twoMenu_imge410 {
    background: url("../../assets/img/synthesis/dxkw.png") no-repeat center;
  }
  .twoMenu_imge411 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat
      center;
  }
 // 通视分析、视域分析 预留
 .twoMenu_imge412 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat
      center;
  }
  .twoMenu_imge413 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat
      center;
  }
  .twoMenu_imge414 {
    background: url("../../assets/img/synthesis/矩形 14 拷贝 7.png") no-repeat
      center;
  }
  //查询
  .twoMenu_imge51 {
    background: url("../../assets/img/synthesis/图层 23.png") no-repeat center;
  }
  .twoMenu_imge52 {
    background: url("../../assets/img/synthesis/空间查询.png") no-repeat center;
  }
  //定位
  .twoMenu_imge61 {
    background: url("../../assets/img/synthesis/图层 27.png") no-repeat center;
  }
  .twoMenu_imge62 {
    background: url("../../assets/img/synthesis/图层 28.png") no-repeat center;
  }
  //测量
  .twoMenu_imge71 {
    background: url("../../assets/img/synthesis/图层 31.png") no-repeat center;
  }
  .twoMenu_imge72 {
    background: url("../../assets/img/synthesis/图层 31 拷贝.png") no-repeat
      center;
  }
  .twoMenu_imge73 {
    background: url("../../assets/img/synthesis/矩形 13 拷贝.png") no-repeat
      center;
  }
  .twoMenu_imge74 {
    background: url("../../assets/img/synthesis/图层 18 拷贝.png") no-repeat
      center;
  }
  .twoMenu_imge75 {
    background: url("../../assets/img/synthesis/M 拷贝.png") no-repeat center;
  }
  .twoMenu_imge76 {
    background: url("../../assets/img/synthesis/空间测距.png") no-repeat center;
  }
    // 高层量测图标
    .twoMenu_imge77 {
    background: url("../../assets/img/synthesis/图层 31 拷贝.png") no-repeat
      center;
  }
  //标绘
  .twoMenu_imge81 {
    background: url("../../assets/img/synthesis/椭圆 5 拷贝 3.png") no-repeat
      center;
  }
  .twoMenu_imge82 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 16.png") no-repeat
      center;
  }
  .twoMenu_imge83 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 20.png") no-repeat
      center;
  }
  .twoMenu_imge84 {
    background: url("../../assets/img/synthesis/椭圆 3 拷贝 23.png") no-repeat
      center;
  }
  .twoMenu_imge85 {
    background: url("../../assets/img/synthesis/导入.png") no-repeat center;
  }
  .twoMenu_imge86 {
    background: url("../../assets/img/synthesis/导出.png") no-repeat center;
  }
  .twoMenu_imge87 {
    background: url("../../assets/img/synthesis/清除.png") no-repeat center;
  }
  .twoMenu_imge88 {
    background: url("../../assets/img/synthesis/图层 32.png") no-repeat center;
  }
}
</style>
src/views/Synthesis/index.vue
@@ -22,23 +22,7 @@
          ></div>
        </div>
      </div>
      <!-- <ul>
        <li
          v-for="item in showMenuList"
          :class="{ lefMenuActive: showMenuFlag == item.id }"
        >
          <div
            class="menuDiv"
            :title="item.name"
            @click="setMenuChange(item)"
          >
            <div
              class="menuImage"
              :class="item.class"
            ></div>
          </div>
        </li>
      </ul> -->
    </div>
    <div class="rightContent">
      <div
@@ -237,7 +221,7 @@
    width: 63px;
    height: 100%;
    overflow-y: auto;
    background: #3b4d6e;
    background: #3B4D6E;
    position: absolute;
    z-index: 30;
    .MenuIcon {
src/views/Tools/LayerTree.vue
@@ -12,21 +12,10 @@
      default-expand-all
      show-checkbox
      @node-click="handleLeftclick"
      @node-drag-start="handleDragStart"
      @node-drag-enter="handleDragEnter"
      @node-drag-leave="handleDragLeave"
      @node-drag-over="handleDragOver"
      @node-drag-end="handleDragEnd"
      @node-drop="handleDrop"
      @node-contextmenu="rightClick"
      :filter-node-method="filterNode"
      @check-change="handleCheckChange"
      :default-checked-keys="handleTreeCheck"
      draggable
      :allow-drop="allowDrop"
      :allow-drag="allowDrag"
      ref="tree"
    >
      ref="tree"     >
      <span
        class="slot-t-node"
        slot-scope="{ node, data }"
@@ -49,6 +38,7 @@
          ></el-input>
        </span>
      </span>
    </el-tree>
    <el-card
@@ -57,15 +47,13 @@
      :style="{ ...rightClickMenuStyle }"
      v-show="menuVisible"
    >
      <div
        @click="addSameLevelNode()"
        v-show="firstLevel"
      >
      <div @click="addSameLevelNode()">
        <i class="el-icon-circle-plus-outline"></i>&nbsp;&nbsp;同级增加
      </div>
      <div
        class="add"
        @click="addChildNode()"
        v-show="firstLevel"
      >
        <i class="el-icon-circle-plus-outline"></i>&nbsp;&nbsp;子级增加
      </div>
@@ -81,6 +69,18 @@
      >
        <i class="el-icon-edit"></i>&nbsp;&nbsp;修改节点
      </div>
      <!-- <div
        class="edit"
        @click="menuMoveF( 'up')"
      >
        <i class="el-icon-top"></i>&nbsp;&nbsp;上移
      </div>
      <div
        class="edit"
        @click="menuMoveF( 'down')"
      >
        <i class="el-icon-bottom"></i>&nbsp;&nbsp;下移
      </div> -->
    </el-card>
    <el-dialog
      :title="appendNodetitle"
@@ -95,11 +95,35 @@
        :model="addFormServer"
        label-width="100px"
      >
        <el-form-item label="服务名称">
        <el-form-item label="服务类型">
          <!-- <el-input v-model="addFormServer.type"></el-input> -->
          <el-select
            style="width:100%"
            :popper-append-to-body="false"
            v-model="addFormServer.layerType"
            placeholder="请选择"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="图层名称">
          <el-input v-model="addFormServer.label"></el-input>
        </el-form-item>
        <el-form-item label="服务名称">
          <el-input v-model="addFormServer.resource"></el-input>
        </el-form-item>
        <el-form-item label="服务地址">
          <el-input v-model="addFormServer.value"></el-input>
          <el-input v-model="addFormServer.url"></el-input>
        </el-form-item>
        <el-form-item label="透明度">
          <el-slider v-model="addFormServer.opacity"></el-slider>
        </el-form-item>
      </el-form>
      <span
@@ -136,7 +160,11 @@
      rightClickMenuStyle: {},
      handleTreeCheck: [],
      dialogVisible: false,
      addFormServer: {},
      addFormServer: {
        opacity: 100,
        layerType: 'WMS',
        type: 2,
      },
      layerId: [
        'm_pipeline',
        'th_strategic_channel',
@@ -149,7 +177,15 @@
      defaultProps: {
        children: 'children',
        label: 'label',
      },
      options: [{
        value: 'WMS',
        label: 'WMS'
      }, {
        value: 'WFS',
        label: 'WFS'
      }],
    };
  },
  methods: {
@@ -184,7 +220,7 @@
    },
    // 鼠标右击事件
    rightClick(event, object, Node, element) {
      console.log(event, object);
      this.currentData = object;
      this.currentNode = Node;
      if (Node.level === 1) {
@@ -218,10 +254,16 @@
    },
    // 增加同级节点事件
    addSameLevelNode() {
      this.foo();
      let id = Math.ceil(Math.random() * 100);
      var data = { id: id, label: '新增节点' };
      this.$refs.tree.append(data, this.currentNode.parent);
      if (this.currentNode.level == 2) {
        this.appendNodetitle = this.currentData.label;
        this.dialogVisible = true;
      } else {
        let id = Math.ceil(Math.random() * 100);
        var data = { id: id, label: '新增节点' };
        this.$refs.tree.append(data, this.currentNode.parent);
      }
    },
    // 增加子级节点事件
    addChildNode() {
@@ -232,34 +274,35 @@
      }
      this.appendNodetitle = this.currentData.label;
      this.dialogVisible = true;
      // let id = Math.ceil(Math.random() * 100);
      // var data = { id: id, label: '新增节点' };
      // this.$refs.tree.append(data, this.currentNode);
    },
    handleClose() {
      this.dialogVisible = false;
      this.addFormServer = {};
      this.addFormServer = {
        opacity: 100,
        layerType: 'WMS',
        type: 2,
      };
    },
    setAddServer() {
      var val = this.currentNode;
      if (this.currentNode.level == 2) {
        val = this.currentNode.parent;
      }
      var data = this.addFormServer;
      data.id = Math.ceil(Math.random() * 100);
      this.$refs.tree.append(data, this.currentNode);
      this.$refs.tree.append(data, val);
      this.handleClose();
    },
    // 删除节点
    deleteNode() {
      this.foo();
      if (this.currentNode.level == 1) {
        this.$message.error('当前级别无法删除!');
        return false;
      }
      this.foo();
      this.$refs.tree.remove(this.currentNode);
    },
    // 编辑节点
    editNode(data) {
      this.foo();
      this.currentData = data ? data : this.currentData;
      if (!this.currentData.isEdit) {
@@ -270,6 +313,47 @@
        this.$refs['slotTreeInput' + this.currentData.id].focus();
      });
    },
    menuMoveF(type) {
        // 将变动之前的node备份
        var node= this.currentNode;
        var data = this.currentData;
        let copyNode = this.currentNode
        debugger
        // copyNode.previousSibling = {...node. }
        // copyNode.nextSibling = {...node.nextSibling}
        // window.sessionStorage.setItem('menuNode',CircularJSON.stringify(copyNode))
        let nodeData = {}
        if (type==='up') {
           // 上移
          if (node.previousSibling) {
            // 删除原先的node
            this.$refs.tree.remove(node.data)
            // 拿到copy的node
            // nodeData = CircularJSON.parse(window.sessionStorage.getItem('menuNode'))
            // // 复制该node到指定位置(参数:1. 要增加的节点的 data 2. 要增加的节点的后一个节点的 data、key 或者 node)
            // this.$refs.tree.insertBefore(nodeData.data,nodeData.previousSibling.data)
            window.sessionStorage.removeItem('menuNode')
          } else {
            this.$message.warning('该菜单已经是当前层最上级')
          }
        } else {
          // 下移
          if (node.nextSibling) {
            this.$refs.tree.remove(node.data)
            nodeData = CircularJSON.parse(window.sessionStorage.getItem('menuNode'))
            // 参数:1. 要增加的节点的 data 2. 要增加的节点的前一个节点的 data、key 或者 node
            this.$refs.tree.insertAfter(nodeData.data,nodeData.nextSibling.data)
            window.sessionStorage.removeItem('menuNode')
          } else {
            this.$message.warning('该菜单已经是当前层最下级')
          }
        }
      },
    handleDragStart(node, ev) {
      console.log('drag start', node);
    },
@@ -292,42 +376,86 @@
      if (data.type != 2) return;
      var std = [];
      var layers_ol = window.map.getAllLayers();
      for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) {
        var val_id = window.Viewer.imageryLayers._layers[i].imageryProvider.name;
        if (val_id == data.label) {
      if (data.layerType == 'WMS') {
        var layers_ol = window.map.getAllLayers();
        for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) {
          var val_id = window.Viewer.imageryLayers._layers[i].imageryProvider.name;
          if (val_id == data.label) {
          std.push(data.label)
            std.push(data.label)
          const img_layer = window.Viewer.imageryLayers._layers[i];
          img_layer.show = checked;
            const img_layer = window.Viewer.imageryLayers._layers[i];
            img_layer.show = checked;
          }
        }
        for (var i in layers_ol) {
          var layerOl = layers_ol[i];
          if (layerOl.values_.name == data.label) {
            layerOl.setVisible(checked); //显示图层
          }
        }
      } else if (data.layerType == 'WFS') {
        if (window.Viewer.dataSources._dataSources.length == 0) {
          this.setAddLayers(data);
        } else {
          for (var i in window.Viewer.dataSources._dataSources) {
            if (window.Viewer.dataSources._dataSources[i].name == data.label) {
              window.Viewer.dataSources._dataSources[i].show = checked;
              std.push(data.label)
            }
          }
        }
      }
      if (std.length == 0 && checked == true) {
        this.setAddLayers(data)
      }
      for (var i in layers_ol) {
        var layerOl = layers_ol[i];
        if (layerOl.values_.name == data.label) {
          layerOl.setVisible(checked); //显示图层
        }
      }
    },
    setAddLayers(res) {
      let layerWMS = new Cesium.WebMapServiceImageryProvider({
        url: geoServerURl,
        layers: res.resource,
        parameters: {
          transparent: true,
          format: 'image/png',
        },
      });
      layerWMS.name = res.label;
      window.Viewer.imageryLayers.addImageryProvider(layerWMS);
      if (res.layerType == 'WMS') {
        var url = geoServerURl;
        if (res.url != null && res.url != undefined) {
          url = res.url
        }
        let layerWMS = new Cesium.WebMapServiceImageryProvider({
          url: url,
          layers: res.resource,
          parameters: {
            transparent: true,
            format: 'image/png',
          },
        });
        layerWMS.name = res.label;
        window.Viewer.imageryLayers.addImageryProvider(layerWMS);
      } else if (res.layerType == 'WFS') {
        var url = res.url + "?service=WFS&version=1.0.0&request=GetFeature&typeName=" + res.resource + "&outputFormat=application%2Fjson"
        $.ajax({
          url: url,
          cache: false,
          async: true,
          success: function (data) {
            var datasource = Cesium.GeoJsonDataSource.load(data, {
              stroke: Cesium.Color.YELLOW,
              fill: Cesium.Color.YELLOW.withAlpha(0.5),
              strokeWidth: 8,
              clampToGround: true //是否贴地
            });
            datasource.then((data) => {
              data.name = res.label;
              window.Viewer.dataSources.add(data);
            })
          },
          error: function (data) {
            console.log("error");
          }
        });
      }
    },
@@ -337,6 +465,8 @@
        return this.$message.error("图层列表查询失败");
      }
      this.newData = data.result;
      this.oriData = data.result;
      var std = [];
      var layer_list = [];
      var layer_groups = [];
@@ -350,6 +480,7 @@
            children: [],
          })
        } else if (data.result[i].type == 2) {
          if (data.result[i].url != null) {
            var layer_entity = {
              id: data.result[i].id,
@@ -358,6 +489,7 @@
              resource: data.result[i].url,
              type: data.result[i].type,
              isEdit: false,
              layerType: data.result[i].serveType
            }
            layer_list.push(layer_entity)
@@ -377,6 +509,11 @@
          }
        }
      }
      layer_groups = layer_groups.filter((res) => {
        if (res.children && res.children.length != 0) {
          return res
        }
      })
      this.treeData = layer_groups;
      this.$refs.tree.setCheckedKeys(std);
    },
@@ -418,6 +555,11 @@
          }
        }
      }
      layer_groups = layer_groups.filter((res) => {
        if (res.children && res.children.length != 0) {
          return res
        }
      })
      this.treeData = layer_groups;
      for (var i in data.result) {
@@ -452,7 +594,7 @@
      this.treelayersStart();
    }
  },
};
</script>
@@ -652,43 +794,9 @@
  position: fixed;
  display: block;
  z-index: 10000;
  padding: 10px 0;
  padding: 0px 0px;
  border: 1px solid #ebeef5;
  border-radius: 4px;
  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
/deep/ .el-dialog {
  background: rgba(0, 0, 0, 0.6);
}
/deep/.el-range-editor.is-active,
.el-range-editor.is-active:hover,
.el-select .el-input.is-focus .el-input__inner {
  border: 1px solid;
}
/deep/.el-dialog__title {
  color: white;
}
/deep/ .el-select .el-input__inner {
  border-color: #fff !important;
}
/deep/.el-cascader .el-input__inner {
  border-color: #fff !important;
}
// 设置输入框的背景色、字体颜色、边框属性设置;
/deep/.el-input__inner {
  background-color: transparent !important ;
  color: #fff !important;
  border: 1px solid !important;
}
/deep/.el-tree .el-tree-node__content:hover {
  background-color: transparent !important;
}
/deep/.el-tree {
  color: white !important;
  background: transparent !important;
}
/deep/.el-tree-node:focus > .el-tree-node__content {
  background: transparent !important;
}
</style>
src/views/Tools/pipeLineAnaly.vue
@@ -104,7 +104,7 @@
      </div>
    </div>
    <div class="contentBox">
      <div class="contentRight">
      <div class="contentRight leftBox">
        <ul>
          <li
            @click="setlistChange(item)"
@@ -699,9 +699,7 @@
        overflow-y: auto;
      }
      label {
        color: white;
      }
    }
    .transInfo {
@@ -738,84 +736,7 @@
  .checkhover {
    color: #409eff;
  }
  /deep/ .el-select .el-input__inner {
    border-color: #fff !important;
  }
  /deep/.el-button {
    background: #303030;
    color: white;
  }
  /deep/.el-form-item__label {
    color: white;
  }
  // 设置输入框的背景色、字体颜色、边框属性设置;
  /deep/.el-input__inner {
    background-color: transparent !important ;
    color: #fff;
    border: 1px solid;
  }
  /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: 10px;
      /*滚动条高度*/
    }
    /*定义滚动条轨道 内阴影+圆角*/
    .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;
    }
  }
  /deep/.el-checkbox__input.is-checked + .el-checkbox__label {
    color: #fff;
  }
  /deep/.el-checkbox__label {
    float: right;
  }
  .country-group {
    display: flex;
    justify-content: center;
@@ -824,52 +745,7 @@
      margin: 4px 0;
    }
  }
  .pagination_box {
    margin-top: 20px;
    /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;
    }
  }
  /deep/ .el-dialog {
    background: #303030;
  }
  /deep/.el-range-editor.is-active,
  .el-range-editor.is-active:hover,
  .el-select .el-input.is-focus .el-input__inner {
    border: 1px solid;
  }
  /deep/.el-dialog__title {
    color: white;
  }
}
</style>
src/views/Tools/queryinfo.vue
@@ -65,7 +65,7 @@
        return item.id === id;
      });
      let data = this.PopupData.splice(index, 1)[0];
      data.close && data.close();
      // data.close && data.close();