综合展示样式修改

584911253@qq.com

2023-02-26 2364c314288f26a4d29b7d22e9baa1e45f43aaeb

综合展示样式修改

 src/assets/css/index.css

@@ -237,7 +237,8 @@
    position: absolute;
    z-index: 1024;
    margin-top: 15px;
    background: rgba(244, 248, 255, 0.9);
    background: rgba(244, 248, 255, 1);
    box-shadow: 0px 0px 6px 2px rgba(244,248,255, 0.85);
    border-radius: 5px;
    border: 1px solid #DCDFE6;
}
@@ -245,12 +246,12 @@
.secondMenuDiv div {
    line-height: 30px;
    padding: 10px;
    font-size: 10px;
    font-size: 2px 0;
    font-family: Microsoft YaHei;
    font-weight: 400;

    text-align: center;
    line-height: 20px;
    min-width: 120px;
    min-width: 100px;
}

.secondMenuDiv .changeLiStyle {
@@ -258,7 +259,7 @@
    box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.1);
    border: 1px solid #409eff;
    /* background: #182E45 */
    /* 
    /*
    */

}
@@ -274,4 +275,4 @@

.ol-scale-line {
    display: block !important;
}
}

 src/assets/img/2dmap.png

 src/assets/img/3dmap.png

 src/components/mapol.vue

@@ -1,16 +1,32 @@
<template>
  <div id="mapol">
    <div
      @click="changeMenulayer"
      class="center CenDiv"
      :class="{ center1: centerFlag }"
    >
    <div style="display: flex">
      <div
        id="cenBg"
        v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
      ></div>
          @click="changeMenulayer"
          class="center CenDiv"
          :class="{ center1: centerFlag }"
      >
        <div
            id="cenBg"
            v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
        ></div>

      </div>
      <div @click="changeMapType" class="changeMapType">
        <div id="cenBg" :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"></div>
      </div>
    </div>
<!--    <div-->
<!--      @click="changeMenulayer"-->
<!--      class="center CenDiv"-->
<!--      :class="{ center1: centerFlag }"-->
<!--    >-->
<!--      <div-->
<!--        id="cenBg"-->
<!--        v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"-->
<!--      ></div>-->

<!--    </div>-->
    <div v-show="$store.state.isNaviget"  class="sindagis-map-compass">
      <span
        class="left"
@@ -57,11 +73,15 @@
      isActive: true,
      isMenuLayer: false,
      rotate: 0,
      currentDir: ''
      currentDir: '',
      show2DMap:false,
    }
  },
  mounted() {
    this.init2DMap()
    this.init2DMap();
    this.$bus.$on('changemapType', (e) => {
      this.show2DMap = e;
    });
  },
  methods: {
    init2DMap() {
@@ -85,7 +105,7 @@
        }),
        controls: defaultControls().extend([
          new FullScreen(),
          

        ]),
        interactions: defaultInteractions().extend([new DragRotateAndZoom()]),
      })
@@ -99,6 +119,21 @@
        // $(".ol-scale-line").css("left", ($(window).width() - $(".ol-scale-line").width() - 25) + "px");
      });

    },

    //二维/三维地图切换
    changeMapType(){
      // debugger
      this.show2DMap = !this.show2DMap;
      //二维
      if (this.show2DMap){
        this.$bus.$emit("changemap", 2);
      }
      //三维
      else {
        this.$bus.$emit("changemap", 3);
      }
      this.$bus.$emit("changemapType", this.show2DMap);
    },

    changeMenulayer() {
@@ -281,4 +316,36 @@
  background: url("../assets/img/compass.png") -89px -5px / 266px no-repeat;
}

.changeMapType{
  position: absolute;
  bottom: 1%;
  left: calc(1% + 75px);
  height: 40px;
  width: 60px;
  z-index: 101;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 3px 3px 6px #666;
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
}
.mapTypeTwo{
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/3dmap.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.mapTypeThree{
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/2dmap.png");
  background-repeat: no-repeat;
  background-size: contain;
}

</style>

 src/components/mapsdk.vue

@@ -117,11 +117,10 @@
            <el-form
              :model="comprehensive"
              :inline="true"
              label-width="50px"
            >
              <el-form-item label="地名:">
                <el-input
                  style="width: 200px"
                  style="width: 160px"
                  v-model="comprehensive.name"
                ></el-input>
              </el-form-item>
@@ -141,27 +140,34 @@
                align="center"
                type="index"
                label="序号"
                width="70px"
              />
              <el-table-column
                prop="name"
                align="center"
                label="定位"
              >
              <el-table-column prop="name" align="center" label="地名">
                <template slot-scope="scope">
                  <el-button
                    @click="handleLocation(scope.$index, scope.row)"
                    size="small"
                    icon="el-icon-place"
                  ></el-button>
                      @click="handleLocation(scope.$index, scope.row)"
                      size="small"
                  >{{scope.row.name}}<i class="el-icon-place" style="padding-left: 5px"></i></el-button>
                </template>
              </el-table-column>
              <el-table-column
                prop="name"
                align="center"
                label="地名"
              >
              </el-table-column>
<!--              <el-table-column-->
<!--                prop="name"-->
<!--                align="center"-->
<!--                label="定位"-->
<!--              >-->
<!--                <template slot-scope="scope">-->
<!--                  <el-button-->
<!--                    @click="handleLocation(scope.$index, scope.row)"-->
<!--                    size="small"-->
<!--                    icon="el-icon-place"-->
<!--                  ></el-button>-->
<!--                </template>-->
<!--              </el-table-column>-->
<!--              <el-table-column-->
<!--                prop="name"-->
<!--                align="center"-->
<!--                label="地名"-->
<!--              >-->
<!--              </el-table-column>-->
            </el-table>
            <div class="pagination_box">
              <el-pagination
@@ -169,8 +175,9 @@
                @current-change="handleCurrentChange"
                :current-page="listData.pageIndex"
                :page-sizes="[10, 20, 50, 100]"
                :pager-count = "3"
                :page-size="listData.pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                layout="total, prev, pager, next"
                :total="count"
              >
              </el-pagination>
@@ -242,16 +249,31 @@
          </div>
        </el-card>
      </div>
      <div
        @click="changeMenulayer"
        class="center CenDiv"
        :class="{ center1: centerFlag }"
      >
      <div style="display: flex">
        <div
          id="cenBg"
          v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
        ></div>
            @click="changeMenulayer"
            class="center CenDiv"
            :class="{ center1: centerFlag }"
        >
          <div
              id="cenBg"
              v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"
          ></div>
        </div>
        <div @click="changeMapType" class="changeMapType">
          <div id="cenBg" :class="show2DMap ? 'mapTypeTwo' : 'mapTypeThree'"></div>
        </div>
      </div>
<!--      <div-->
<!--        @click="changeMenulayer"-->
<!--        class="center CenDiv"-->
<!--        :class="{ center1: centerFlag }"-->
<!--      >-->
<!--        <div-->
<!--          id="cenBg"-->
<!--          v-bind:class="{ active: isActive, menuLayer: isMenuLayer }"-->
<!--        ></div>-->
<!--      </div>-->
    </div>
  </div>
</template>
@@ -359,12 +381,16 @@
        children: "children",
        label: "label",
      }, //树绑定对象
      show2DMap:false,
    };
  },
  mounted() {
    this.init3DMap();
    this.$bus.$on("mapChangeBox", (res) => {
      this.showChangeBox(res);
    });
    this.$bus.$on('changemapType', (e) => {
      this.show2DMap = e;
    });
  },
  methods: {
@@ -503,8 +529,10 @@
      } else if (res.name == "Coord") {
        if (res.id == "1") {
          this.showCoordLocalBoxDialog = true;
          this.showToponymicLocalBoxDialog = false;
        } else if (res.id == "2") {
          this.showToponymicLocalBoxDialog = true;
          this.showCoordLocalBoxDialog = false;
          this.getToponymicData();
        }
      } else if (res.name == "Analysis") {
@@ -609,10 +637,35 @@
      var lon = parseFloat(this.coordFrom.lon);
      var lat = parseFloat(this.coordFrom.lat);
      var height = parseFloat(this.coordFrom.height);
      var position = {
        X: lon,
        Y: lat,
        Altitude: 2000,
      };
      this.imagePoint = sgworld.Creator.CreateLabel(
          position,
          "",
          SmartEarthRootUrl + "Workers/image/mark.png",
          {
            disableDepthTestDistance: Infinity,
            scale: 0.8,
          },
          0,
          "巡检点"
      );

      sgworld.Navigate.jumpTo({
        //跳转视角
        destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height),
        destination: new Cesium.Cartesian3.fromDegrees(
            lon,
            lat,
            height
        ),
      });
      // sgworld.Navigate.jumpTo({
      //   //跳转视角
      //   destination: new Cesium.Cartesian3.fromDegrees(lon, lat, height),
      // });
    },
    //缓冲区分析
    clearBuffer() {
@@ -856,6 +909,20 @@
        }
      }
    },
    //二维/三维地图切换
    changeMapType(){
      // debugger
      this.show2DMap = !this.show2DMap;
      //二维
      if (this.show2DMap){
        this.$bus.$emit("changemap", 2);
      }
      //三维
      else {
        this.$bus.$emit("changemap", 3);
      }
      this.$bus.$emit("changemapType", this.show2DMap);
    },
  },
};
</script>
@@ -872,11 +939,12 @@
    overflow: hidden;
    position: relative;
    .toponymicLocalBox {
      width: 750px;
      width: 350px;
      //width: 750px;
      height: 450x;
      z-index: 40;
      position: absolute;
      right: 1%;
      right: 6%;
      bottom: 1%;
    }
    .bufferBox {
@@ -884,7 +952,7 @@
      height: 230px;
      z-index: 40;
      position: absolute;
      right: 1%;
      right: 6%;
      bottom: 1%;
    }
    .coordLocalBox {
@@ -892,7 +960,7 @@
      height: 370px;
      z-index: 40;
      position: absolute;
      right: 1%;
      right: 6%;
      bottom: 1%;
    }
    .pathAnalysisBox {
@@ -900,7 +968,7 @@

      z-index: 40;
      position: absolute;
      right: 1%;
      right: 6%;
      bottom: 1%;
    }

@@ -1026,6 +1094,39 @@
  border-radius: 5px;
}

.changeMapType{
  position: absolute;
  bottom: 1%;
  left: calc(1% + 75px);
  height: 40px;
  width: 60px;
  z-index: 101;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 3px 3px 6px #666;
  //border: 1px solid rgba(204, 204, 204, 0.76);
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
}
.mapTypeTwo{
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/3dmap.png");
  background-repeat: no-repeat;
  background-size: contain;
}
.mapTypeThree{
  width: 100%;
  height: 100%;
  margin-left: 10px;
  background-image: url("../assets/img/2dmap.png");
  background-repeat: no-repeat;
  background-size: contain;
}

// .menuSelect .el-input__inner {
//   background: rgba(255, 255, 255, 0.2) !important;
//   color: white !important;

 src/views/AuthorizationManagement/roleResAuthorization.vue

@@ -694,13 +694,13 @@
    .content_left_box{
      padding: 10px;
      width: 20%;
      height: 94%;
      height: calc(100% - 20px);
      border-radius: 5px;
    }
    .content_box {
      padding: 10px;
      width: 36%;
      height: 94%;
      height: calc(100% - 20px);
      border-radius: 5px;
    }
    .divider {

 src/views/Synthesis/LeftMenu.vue

@@ -71,6 +71,18 @@
            name: "图层管理",
            css: "twoMenu_imge11",
          },
          {
            id: "b1",
            label: "synthesis.split",
            name: "分屏",
            css: "twoMenu_imge21",
          },
          {
            id: "b9",
            label: "synthesis.undergroundMode",
            name: "地下模式",
            css: "twoMenu_imge29",
          },
        ],
        [
          {

 src/views/Synthesis/index.vue

@@ -15,6 +15,11 @@
          <div class="menuImage" :class="item.class"></div>
        </div>
      </div>
      <div class="MenuIcon menu-class" :class="{ lefMenuActive: showMenuFlag == menuItem.id }">
        <div class="menuDiv" :title="menuItem.name" @click="setMenuChange(menuItem)">
          <div class="menuImage" :class="menuItem.class"></div>
        </div>
      </div>
    </div>
    <div class="rightContent">
      <div class="left_main" :class="{ left_main_show: !openStatus }">
@@ -50,24 +55,25 @@
      isActive: false,
      showMenuList: [],
      menuOption: [
        {
          id: 1,
          name: "菜单",
          class: "menu_img1",
          show: true,
        },
        // {
        //   id: 1,
        //   name: "菜单",
        //   class: "menu_img1",
        //   show: true,
        // },
        {
          id: 2,
          name: "图层",
          class: "menu_img2",
          show: false,
          show: true,
          // show: false,
        },
        {
          id: 3,
          name: "视图",
          class: "menu_img3",
          show: false,
        },
        // {
        //   id: 3,
        //   name: "视图",
        //   class: "menu_img3",
        //   show: false,
        // },
        {
          id: 4,
          name: "漫游",
@@ -111,6 +117,12 @@
          show: false,
        },
      ],
      menuItem: {
        id: 1,
        name: "折叠",
        class: "menu_img1",
        show: true,
      },
    };
  },
  watch: {},
@@ -118,9 +130,14 @@
  methods: {
    //左侧菜单滑动显隐
    setMenuChange(res) {
      if (res.id == this.showMenuFlag){
        return;
      }
      //清除查询弹窗
      this.$store.state.mapMenuBoolean = false;
      this.$store.state.mapMenuBoxFlag = "";
      //清除分析模块的全局变量
      ClearAlayse();

      switch (res.id) {
        case 1:
          if (this.showMenuFlag == null) return;
@@ -159,7 +176,6 @@
          this.showMenuChange(permsEntity[i], permsEntity);
        }
      }

      for (var i in this.menuOption) {
        if (this.menuOption[i].show != false) {
          this.showMenuList.push(this.menuOption[i]);
@@ -192,6 +208,7 @@
  },
  mounted() {
    // this.$bus.$emit('showLeftMenu', true);
    window.sgworld.navControl("nav", true);
    this.$store.state.mapMenuBoolean = false;
    this.$store.state.mapMenuBoxFlag = null;
    this.$store.state.mapPopBoolean = false;
@@ -295,9 +312,14 @@
    display: flex;
    .left_main {
      margin: 0;
      width: 255px;
      height: auto;
      transition: width 2s;
      //width: 255px;
      width: 130px;
      padding-bottom: 10px;
      height: calc(100% - 10px);
      overflow-y: auto;
      //height: auto;
      transition: width 1s;
      background: #F4F8FF;
    }

    .right_main {
@@ -346,6 +368,12 @@
      border-radius: 5px;
    }
  }

  .menu-class{
    position: absolute;
    bottom: 10px;
    left: 0;
  }
  /deep/.el-loading-spinner i {
    color: #1890ff;
  }

 src/views/maintenance/blackwhiteList.vue

@@ -22,7 +22,9 @@
                    style="width: 200px"
                    v-model="queryInfo.ip"
                    :placeholder="$t('operatManage.BWL.blackListIPHolder')"
                  />
                  >
                    <i slot="suffix" class="el-icon-search" @click="queryBlackInfo"></i>
                  </el-input>
                </el-form-item>
<!--                <el-form-item-->
<!--                  :label="$t('operatManage.BWL.interceptionNumber')"-->
@@ -37,15 +39,15 @@
<!--                </el-form-item>-->
              </div>
              <div>
                <el-form-item>
                  <el-button
                    type="primary"
                    @click="queryBlackInfo()"
                    size="small"
                    icon="el-icon-search"
                    >{{ $t("operatManage.BWL.search") }}
                  </el-button>
                </el-form-item>
<!--                <el-form-item>-->
<!--                  <el-button-->
<!--                    type="primary"-->
<!--                    @click="queryBlackInfo()"-->
<!--                    size="small"-->
<!--                    icon="el-icon-search"-->
<!--                    >{{ $t("operatManage.BWL.search") }}-->
<!--                  </el-button>-->
<!--                </el-form-item>-->
                <el-form-item>
                  <el-button
                      icon="el-icon-edit"
@@ -168,7 +170,9 @@
                    style="width: 200px"
                    v-model="queryInfo.ip"
                    :placeholder="$t('operatManage.BWL.whiteListIPHolder')"
                  />
                  >
                    <i slot="suffix" class="el-icon-search" @click="queryWhiteInfo"></i>
                  </el-input>
                </el-form-item>
<!--                <el-form-item-->
<!--                  :label="$t('operatManage.BWL.interceptionNumber')"-->
@@ -183,21 +187,21 @@
<!--                </el-form-item>-->
              </div>
              <div>
<!--                <el-form-item>-->
<!--                  <el-button size="small" type="primary" @click="queryWhiteInfo"-->
<!--                    ><i class="el-icon-search"></i> &nbsp;{{-->
<!--                      $t("operatManage.BWL.search")-->
<!--                    }}</el-button-->
<!--                  >-->
<!--                </el-form-item>-->
                <el-form-item>
                  <el-button
                    @click="resetForm('queryInfo')"
                    type="info"
                    size="small"
                    ><i class="el-icon-delete"></i> &nbsp;{{
                      $t("operatManage.BWL.reset")
                    }}</el-button
                  >
                </el-form-item>
                <el-form-item>
                  <el-button size="small" type="primary" @click="queryWhiteInfo"
                    ><i class="el-icon-search"></i> &nbsp;{{
                      $t("operatManage.BWL.search")
                    }}</el-button
                      type="success"
                      size="small"
                      icon="el-icon-edit"
                      v-if="menuStatus.insert"
                      @click="showInsertdialog(2)"
                  >{{ $t("common.append") }}</el-button
                  >
                </el-form-item>
                <el-form-item>
@@ -212,12 +216,12 @@
                </el-form-item>
                <el-form-item>
                  <el-button
                    type="success"
                    size="small"
                    icon="el-icon-edit"
                    v-if="menuStatus.insert"
                    @click="showInsertdialog(2)"
                    >{{ $t("common.append") }}</el-button
                      @click="resetForm('queryInfo')"
                      type="info"
                      size="small"
                  ><i class="el-icon-delete"></i> &nbsp;{{
                      $t("operatManage.BWL.reset")
                    }}</el-button
                  >
                </el-form-item>
              </div>