在线制图出图申请重复，

Surpriseplus

2023-02-14 965b4ade196fc23c3138320edb7c1e0653c9964c

在线制图出图申请重复，

 src/assets/css/config.css

@@ -7,6 +7,10 @@
    background: rgba(48, 48, 48, 0.85);
}

.Black_theme .box_divm {
    background: rgba(48, 48, 48, 0.85) !important;
}

.Black_theme .box_div {
    background: #303030;
}
@@ -271,9 +275,10 @@
    color: #FFF;
}

.Black_theme  .el-icon-arrow-down{
.Black_theme .el-icon-arrow-down {
    color: #FFF;
}

.Black_theme .twoMenu_imge11 {
    background: url("../../assets/img/synthesis/图层 32.png") no-repeat center;
}
@@ -487,12 +492,15 @@
.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{

.Black_theme .menuPop .leftBox li {
    color: #FFF;
}
.Black_theme .popupBox .popupContainer{
    color: #FFF !important; 

.Black_theme .popupBox .popupContainer {
    color: #FFF;
}

.Black_theme .popupBox .popupContainer {
    color: #FFF !important;
}

 src/assets/css/configure.css

@@ -28,6 +28,9 @@
    background: #F4F8FF;
}

.box_divm {
    background-color: rgba(244, 248, 255, 0.85) !important;
}
.subpage_Div {
    border: 1px solid #dcdfe6;
}

 src/components/MapDiv.vue

@@ -10,7 +10,10 @@
    >
      <mapsdk></mapsdk>
    </div>
    <div id="ds" v-show="isShowDs"></div>
    <div
      id="ds"
      v-show="isShowDs"
    ></div>
    <!--openLayers显示界面-->
    <div
      v-show="isOlMapFlag"
@@ -102,7 +105,9 @@
        });
      let mapZoomAndMove = function (event) {
        var position = window.map.getView().getCenter();
        var pos = transform(position, 'EPSG:3857', 'EPSG:4326');

        // var pos = transform(position, 'EPSG:3857', 'EPSG:4326');
        var pos = position;
        var level = that.getHeight(parseInt(window.map.getView().getZoom()));
        window.Viewer.camera.setView({
          destination: Cesium.Cartesian3.fromDegrees(pos[0], pos[1], level),
@@ -166,9 +171,13 @@
      var lat = Cesium.Math.toDegrees(cartographic.latitude);
      var lng = Cesium.Math.toDegrees(cartographic.longitude);
      var level = this.getLevel(cartographic.height);
      var value
      // window.map
      //   .getView()
      //   .setCenter(transform([lng, lat], 'EPSG:4326', 'EPSG:3857'));
      window.map
        .getView()
        .setCenter(transform([lng, lat], 'EPSG:4326', 'EPSG:3857'));
        .setCenter([lng, lat]);
      window.map.getView().setZoom(level);
    },
    getLevel(height) {

 src/components/mapol.vue

@@ -79,7 +79,7 @@
        target: "mapol",
        layers: [imageLayer, vectorLayer],
        view: new View({
          center:  [105.02, 34.9], 
          center:  [105.02, 34.9] ,
          zoom: 4,
          projection: "EPSG:4326",
        }),

 src/views/Tools/LayerTree.vue

@@ -450,6 +450,7 @@
          source: new ImageWMS({
            crossOrigin: 'anonymous',
            url: url,

            params: {
              FORMAT: 'image/png',
              VERSION: '1.1.1',
@@ -485,7 +486,7 @@
        });

        var vectorLayer = new VectorLayer({
         
           name: res.label,
          source: new VectorSource({
            url: url,
            format: new GeoJSON(),

 src/views/exportMap/index.vue

@@ -1,23 +1,29 @@
<template>
  <div
    id="mapView"
    class="MapBox"
    class="MapBox "
    v-loading="loading"
    element-loading-background="rgba(0, 0, 0, 0.8)"
  >
    <div class="topMenu">
      <el-form :inline="true" :model="formInline" class="demo-form-inline">
    <div class="topMenu box_divm">
      <el-form
        :inline="true"
        :model="formInline"
        class="demo-form-inline"
      >
        <el-form-item>
          <el-link
            style="color: white"
            @click="showLeftMenu(1)"
            :underline="false"
            title="图层列表"
            ><i class="el-icon-s-operation"></i
          ></el-link>
          ><i class="el-icon-s-operation"></i></el-link>
        </el-form-item>
        <el-form-item>
          <el-select v-model="value" placeholder="请选择">
          <el-select
            :popper-append-to-body="false"
            v-model="value"
            placeholder="请选择"
          >
            <el-option
              v-for="item in options"
              :key="item.value"
@@ -30,55 +36,44 @@

        <el-form-item>
          <el-link
            style="color: white"
            @click="setMapAddDraw()"
            :underline="false"
            ><i class="el-icon-edit-outline"></i>绘制</el-link
          >
          ><i class="el-icon-edit-outline"></i>绘制</el-link>
        </el-form-item>
        <el-form-item>
          <el-link
            :disabled="layerExtent == null"
            style="color: white"
            @click="setMapRemoveDraw()"
            :underline="false"
            title="图层列表"
            ><i class="el-icon-delete"></i>清除</el-link
          >
          ><i class="el-icon-delete"></i>清除</el-link>
        </el-form-item>

        <el-form-item>
          <el-link
            style="color: white"
            @click="showMapApply = true"
            :underline="false"
            :disabled="layerExtent == null"
            >出图申请
          >出图申请
          </el-link>
        </el-form-item>
        <el-form-item>
          <el-link
            style="color: white"
            @click="getShowMapList"
            :underline="false"
            >出图列表</el-link
          >
          >出图列表</el-link>
        </el-form-item>
        <el-form-item>
          <el-link
            style="color: white"
            @click="changeMenulayer"
            :underline="false"
            v-show="isActive"
            >影像</el-link
          >
          >影像</el-link>
          <el-link
            style="color: white"
            v-show="!isActive"
            @click="changeMenulayer"
            :underline="false"
            >矢量</el-link
          >
          >矢量</el-link>
        </el-form-item>
        <el-form-item label="旋转角度">
          <el-input
@@ -94,14 +89,20 @@
      class="left_Menu"
      :class="{ left_main_show: !leftMenuOpen }"
    >
      <div class="menu_content">
        <div class="topHeader" v-show="lefMenuContent">
      <div class="menu_content box_divm">
        <div
          class="topHeader"
          v-show="lefMenuContent"
        >
          <div>图层列表</div>
          <div @click="showLeftMenu(2)"><i class="el-icon-s-fold"></i></div>
        </div>
        <el-divider></el-divider>
        <div class="bottomContent">
          <div style="width: 100%" v-show="lefMenuContent">
          <div
            style="width: 100%"
            v-show="lefMenuContent"
          >
            <el-tree
              :data="treeData"
              show-checkbox
@@ -117,46 +118,58 @@
      </div>
    </div>

    <div class="mapApplay" v-if="showMapApply">
    <div
      class="mapApplay box_divm"
      v-if="showMapApply"
    >
      <label>出图申请</label>
      <el-divider />
      <el-form ref="form" :model="form" label-width="80px">
      <el-form
        ref="form"
        :model="form"
        label-width="80px"
      >
        <el-form-item label="出图名称">
          <el-input v-model="form.name"></el-input>
        </el-form-item>
        <el-form-item>
          <div style="padding: 1%; border: 1px solid white">
          <div style="padding: 1%;  ">
            <el-table
              ref="singleTable"
              :data="tableData"
              style="width: 100%"
              height="200"
            >
              <el-table-column type="index" label="序号" width="50">
              <el-table-column
                type="index"
                label="序号"
                width="50"
              >
              </el-table-column>

              <el-table-column property="name" label="图层名称">
              <el-table-column
                property="name"
                label="图层名称"
              >
              </el-table-column>
            </el-table>
          </div>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="setMapApply">立即创建</el-button>
          <el-button
            type="primary"
            @click="setMapApply"
          >立即创建</el-button>
          <el-button @click="showMapApply = false">取消</el-button>
        </el-form-item>
      </el-form>
    </div>
    <div class="mapApplay" v-if="showMapList">
      <div>
        <label>出图列表</label>
        <div style="float: right">
          <el-link @click="showMapList = false" :underline="false"
            ><i style="color: white" class="el-icon-close"></i
          ></el-link>
        </div>
      </div>
      <el-divider />

    <el-dialog
      title="出图列表"
      :visible.sync="showMapList"
    >
      <el-table
        ref="singleTable"
        :data="exportable"
@@ -164,11 +177,24 @@
        height="200"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="index" width="50" label="序号">
        <el-table-column
          type="index"
          width="50"
          label="序号"
        >
        </el-table-column>
        <el-table-column property="descr" label="标题"> </el-table-column>
        <el-table-column property="name" label="文件名称"> </el-table-column>
        <el-table-column property="createName" label="出图人">
        <el-table-column
          property="descr"
          label="标题"
        > </el-table-column>
        <el-table-column
          property="name"
          label="文件名称"
        > </el-table-column>
        <el-table-column
          property="createName"
          label="出图人"
        >
        </el-table-column>
        <el-table-column
          property="createTime"
@@ -177,14 +203,15 @@
        >
        </el-table-column>

        <el-table-column label="操作" width="120">
        <el-table-column
          label="操作"
          width="120"
        >
          <template slot-scope="scope">
            <el-link
              style="color: white"
              @click.native.prevent="downloadMap(scope.$index, scope.row)"
              :underline="false"
              >下载</el-link
            >
            >下载</el-link>
          </template>
        </el-table-column>
      </el-table>
@@ -200,15 +227,18 @@
        >
        </el-pagination>
      </div>
    </div>

    </el-dialog>
    <el-dialog
      title="提示"
      :visible.sync="dialogVisible"
      width="30%"
      :before-close="handleClose"
    >
      <el-form ref="layerform" :model="layerform" label-width="80px">
      <el-form
        ref="layerform"
        :model="layerform"
        label-width="80px"
      >
        <el-form-item label="服务名称">
          <el-input v-model="layerform.name"></el-input>
        </el-form-item>
@@ -218,12 +248,21 @@
          </el-radio-group>
        </el-form-item>
        <el-form-item label="服务地址">
          <el-input type="textarea" v-model="layerform.resource"></el-input>
          <el-input
            type="textarea"
            v-model="layerform.resource"
          ></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
      <span
        slot="footer"
        class="dialog-footer"
      >
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="setAddMapLayer">确 定</el-button>
        <el-button
          type="primary"
          @click="setAddMapLayer"
        >确 定</el-button>
      </span>
    </el-dialog>
  </div>
@@ -234,7 +273,7 @@
import Map from "ol/Map"
import XYZ from "ol/source/XYZ"
import View from "ol/View"
import { OverviewMap, defaults as defaultControls, FullScreen, ScaleLine, Rotate} from "ol/control.js"
import { OverviewMap, defaults as defaultControls, FullScreen, ScaleLine, Rotate } from "ol/control.js"
import Image from "ol/layer/Image"
import TileLayer from "ol/layer/Tile"
import { transform } from "ol/proj"
@@ -337,6 +376,9 @@
            layer_list.push(layer_entity)
            if (data.result[i].isShow == 1) {
              std.push(data.result[i].id)
              this.tableData.push({
                name: layer_entity.label,
              })
              this.showMapLayer(layer_entity)
            }
          }
@@ -349,22 +391,31 @@
          }
        }
      }
      this.treeData = layer_groups
      for (var i in data.result) {
        if (data.result[i].type == 2 && data.result[i].url != null) {
          for (var j = 0; j < window.Viewer.imageryLayers._layers.length; j++) {
            var val_id = window.Viewer.imageryLayers._layers[j]
            if (val_id.show == true) {
              if (val_id.imageryProvider.name == data.result[i].cnName) {
                std.push(data.result[i].id)
              }
            }
          }
      layer_groups = layer_groups.filter((res) => {
        if (res.children != null && res.children.length != 0) {
          return res
        }
      }
      })
      this.treeData = layer_groups;

      // for (var i in data.result) {
      //   if (data.result[i].type == 2 && data.result[i].url != null) {
      //     for (var j = 0; j <  window.mapView.imageryLayers._layers.length; j++) {
      //       var val_id = window.mapView.imageryLayers._layers[j]
      //       if (val_id.show == true) {
      //         if (val_id.imageryProvider.name == data.result[i].cnName) {
      //           std.push(data.result[i].id)
      //         }
      //       }
      //     }
      //   }
      // }
      debugger
      this.$refs.tree.setCheckedKeys(std)
    },
    showMapLayer(val) {
      debugger
      if (val == undefined) return;
      var layer2 = new Image({
        name: val.label,
        source: new ImageWMS({
@@ -461,7 +512,7 @@
        data: JSON.stringify(data),
        contentType: "application/json",
        dataType: "json",
        error: function () {},
        error: function () { },
        success: rs => {
          this.loading = false
          var value = "code = " + rs.code + ", result = " + rs.result
@@ -559,7 +610,7 @@
      this.showMapApply = false
      this.form = {}
    },
    handleClose() {},
    handleClose() { },
    handleTreeNodeClick(data, nodes) {
      if (data.children != null) return
      var layers = mapView.getAllLayers()
@@ -570,13 +621,13 @@
          layer.setVisible(nodes) //显示图层
          if (nodes == true) {
            str++
            this.arrList.push({
            this.tableData.push({
              name: data.label,
            })
          } else {
            this.arrList.some((item, i) => {
            this.tableData.some((item, i) => {
              if (item.name === data.label) {
                this.arrList.splice(i, 1)
                this.tableData.splice(i, 1)
              }
            })
          }
@@ -585,12 +636,12 @@

      if (str == 0 && nodes == true) {
        this.showMapLayer(data)
        this.arrList.push({
        this.tableData.push({
          name: data.label,
        })
      }

      this.tableData = this.arrList
      // this.tableData = this.arrList
    },
    setAddMapLayer() {
      this.dialogVisible = false
@@ -670,7 +721,7 @@
  .topMenu {
    z-index: 40;
    position: absolute;
    background: rgba(0, 0, 0, 0.5);

    width: 100%;
    height: 70px;
    padding-left: 20px;
@@ -678,7 +729,7 @@
  .left_Menu {
    z-index: 40;
    width: 300px;
    background: rgba(0, 0, 0, 0.5);

    height: calc(100% - 220px);
    position: fixed;
    left: 0;
@@ -692,7 +743,6 @@
        margin: 10px;
        display: flex;
        justify-content: space-between;
        color: white;
      }
      .bottomContent {
        width: calc(100% - 40px);
@@ -738,140 +788,14 @@
  .mapApplay {
    width: 40%;
    position: absolute;
    background: #303030;

    z-index: 40;
    top: 15%;
    margin-left: 30%;
    padding: 1%;
    label {
      color: white;
    }
  }
  /deep/.el-form-item__label {
    color: white;
    line-height: 70px;
  }
  /deep/.el-form-item__content {
    line-height: 70px;
  }
  /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-divider--horizontal {
    margin: 5px 0px;
  }
  /*修改table 表体的背景颜色和文字颜色*/
  /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;
    }
  }
  /deep/.el-loading-spinner i {
    color: #409eff !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;
  /deep/.el-form-item {
    margin-top: 10px;
  }
}
</style>