一张图图层控制修改，发布管理添加表格双击复制功能，发布管理页面模型附件管理页面修改，在线制图修改

Surpriseplus

2023-03-24 bab3c509ded84f1caa3d8e79a65b7113db8913df

 src/components/Screen/ProjectTree.vue

@@ -1,5 +1,17 @@
<template>
  <div class="project_tree" :class="{ left_main_show: !leftMenuOpen }">
  <div
    class="project_tree"
    :class="{ left_main_show: !leftMenuOpen }"
  >
    <div class="project_tree__title">工程项目</div>
    <el-input
      style="width: 80%"
      placeholder="输入关键字进行查询"
      suffix-icon="el-icon-search"
      v-model="filterText"
      size="mini"
    >
    </el-input>
    <div class="tree-container">
      <el-tree
        :data="treeData"
@@ -9,23 +21,40 @@
        :props="defaultProps"
        ref="tree"
        class="el-tree"
        @check-change="handleCheckChange"
        @check="handleCheckChange"
        :filter-node-method="filterNode"
      >
        <div
          style="display: flex"
          class="custom-tree-node"
          slot-scope="{ node, data }"
        >
          <div style="margin-left: 0px; padding-left: 15px">
          <div style="">
            <i
              v-if="data.children && data.children.length > 0"
              style="color: yellow"
              class="el-icon-folder-opened"
            ></i>
            <i v-else style="color: skyblue" class="el-icon-folder-opened"></i>
            <i
              v-else
              style="color: skyblue"
              class="el-icon-folder-opened"
            ></i>
          </div>

          <!-- <div style="">
            <i
              v-if="node.expanded && data.children && data.children.length > 0"
              style="color: yellow"
              class="el-icon-folder-opened"
            ></i>
            <i v-else style="color: skyblue" class="el-icon-folder-opened"></i>
          </div> -->
          <div
            :style="
              data.children && data.children.length > 0
                ? 'padding-left: 20px'
                : 'padding-left: 20px'
            "
            class="tree-label"
            :title="node.label || '-'"
          >
@@ -34,14 +63,14 @@
        </div>
      </el-tree>
    </div>
    <div class="changeBaseLayer">
    <!-- <div class="changeBaseLayer">
      <div @click="changeMenulayer" class="CenDiv">
        <div
          id="cenBg"
          v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
        ></div>
      </div>
    </div>
    </div> -->
  </div>
</template>

@@ -70,6 +99,7 @@
      isActive: false,
      isMenuLayer: true,
      openEcharts: false,
      filterText: "",
    }
  },

@@ -79,8 +109,28 @@
    this.changeSelectli = this.rightList[0].id
    this.changeSelectStyle = this.rightMenu[0].id
    this.addImageLayer()
    this.$bus.$on("changeProjectLayer", (res) => {
      this.setShowCheckedLayer();
    })
  },
  watch: {
    filterText(val) {
      this.$refs.tree.filter(val)
    },
  },
  methods: {
    setShowCheckedLayer() {
      var value = this.$refs.tree.getCheckedNodes();
      var std = [];
      for (var i in value) {
        std.push(value[i].id)
      }
      if (std.indexOf(3) == -1) {
        std.push(3);
        this.$refs.tree.setCheckedKeys(std)
      }

    },
    async addImageLayer() {
      const data = await perms_selectLayers()
      if (data.code != 200) {
@@ -89,6 +139,7 @@
      var std = []
      var layer_list = []
      var layer_groups = []
      var layerData = [];
      for (var i in data.result) {
        if (data.result[i].type == 1) {
          layer_groups.push({
@@ -111,7 +162,8 @@
            layer_list.push(layer_entity)
            if (data.result[i].isShow == 1) {
              std.push(data.result[i].id)
              this.setAddImageLayer(layer_entity)
              layerData.push(data.result[i])
              // this.setAddImageLayer(layer_entity)
            }
          }
        }
@@ -126,33 +178,71 @@
      this.treeData = layer_groups

      this.$refs.tree.setCheckedKeys(std)
      this.setShowImageLayer(layerData)
    },
    handleCheckChange(data, checked, indeterminate) {
      if (data.children != null) return
      var std = []
      for (var i = 0; i < Viewer.imageryLayers._layers.length; i++) {
        var val_id = Viewer.imageryLayers._layers[i].imageryProvider.name
        if (val_id == data.label) {
          std.push(data.label)
          const img_layer = Viewer.imageryLayers._layers[i]
          img_layer.show = checked
      // if (data.children != null) return
      // var std = []
      // for (var i = 0; i < Viewer.imageryLayers._layers.length; i++) {
      //   var val_id = Viewer.imageryLayers._layers[i].imageryProvider.name
      //   if (val_id == data.label) {
      //     std.push(data.label)
      //     const img_layer = Viewer.imageryLayers._layers[i]
      //     img_layer.show = checked
      //   }
      // }
      // if (std.length == 0 && checked == true) {
      //   this.setAddImageLayer(data)
      // }
      this.setClearWmsLayer()
      var value = this.$refs.tree.getCheckedNodes();
      var url = [];
      for (var i in value) {
        if (value[i].resource && value[i].type == 2) {

          url.push(value[i].resource)
        }
      }
      if (std.length == 0 && checked == true) {
        this.setAddImageLayer(data)
      url = url.reverse();
      this.setAddImageLayer(url)
    },

    setShowImageLayer(res) {
      this.setClearWmsLayer()
      var url = [];
      for (var i in res) {
        url.push(res[i].enName)
      }
      url = url.reverse();
      this.setAddImageLayer(url)
    },
    setClearWmsLayer() {
      for (var i = 0; i < window.Viewer.imageryLayers._layers.length; i++) {
        var val_id = window.Viewer.imageryLayers._layers[i].imageryProvider.name;
        if (val_id == "Wms_Layer") {
          window.Viewer.imageryLayers.remove(
            window.Viewer.imageryLayers._layers[i]
          );
        }
      }
    },


    setAddImageLayer(res) {
      let layerWMS = new Cesium.WebMapServiceImageryProvider({
      var layerWMS = new Cesium.WebMapServiceImageryProvider({
        url: geoServerURl,
        layers: res.resource,
        layers: res.toString(),
        parameters: {
          transparent: true,
          format: "image/png",
          srs: "EPSG:4490",
          styles: "",
        },
      })
      layerWMS.name = res.label
      Viewer.imageryLayers.addImageryProvider(layerWMS)
        tileWidth: 512,
        tileHeight: 512,
      });
      layerWMS.name = "Wms_Layer";
      window.Viewer.scene.imageryLayers.addImageryProvider(layerWMS);
    },
    changeMenulayer() {
      this.isActive = !this.isActive
@@ -170,6 +260,10 @@
        Viewer.imageryLayers._layers[3].show = true
      }
    },
    filterNode(value, data) {
      if (!value) return true
      return data.label.indexOf(value) !== -1
    },
  },
}
</script>
@@ -177,15 +271,40 @@
<style lang="scss" scoped>
.project_tree {
  margin: 0;
  width: 300px;
  width: 100%;
  height: 100%;
  transition: width 2s;
  background: url("~@/assets/img/themic/左框.png") no-repeat center;
  background: url("~@/assets/img/Screen/prjectree.png") no-repeat center;

  background-size: 100% 100%;
  &__title {
    color: #fff;
    height: 30px;
    font-size: 20px;
    width: 130px;
    text-align: center;
    width: 140px;
    padding-top: 15px;
    color: #fff;
    background: linear-gradient(
      0deg,
      rgba(81, 192, 243, 0.65) 0%,
      rgba(255, 255, 255, 0.65) 86%
    );
    -webkit-background-clip: text;
    font-size: 17.5px;
    font-family: HYLingXinJ, HYLingXinJ-regular;
    font-weight: normal;
    letter-spacing: 1.05px;
  }
  .el-input {
    width: 80%;
    padding: 5px 0 5px 30px;
  }

  .tree-container {
    margin: 10px;
    height: 90%;
    height: 85%;
    overflow-y: auto;
  }
  .changeBaseLayer {
@@ -197,7 +316,6 @@
  .CenDiv {
    height: 40px;
    width: 60px;

    margin-right: 7%;
    border-radius: 5px;
    bottom: 3%;
@@ -223,11 +341,43 @@
    border-radius: 5px;
  }
}
/*  滚动条样式 */

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
  background-color: #409eff;
}

::-webkit-scrollbar-track {
  background: #eee;
}

::-webkit-scrollbar-thumb {
  background: #409eff;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: #409eff;
}

::-webkit-scrollbar-corner {
  background: #409eff;
}
</style>

<style lang="scss">
.leftContainer {
  .project_tree {
    .el-tree-node__content {
      margin-left: 20px;
    }

    .el-tree .el-tree-node .is-leaf {
      margin-left: -14px;
    }

    .el-tree-node__content > label.el-checkbox {
      margin-right: -30px;
    }
@@ -243,7 +393,6 @@
      // visibility: hidden;
    }
    .tree-label {
      padding-left: 10px;
      font-size: 16px;
      color: #fff;
    }