土地管理弹窗、工具栏整合、功能点击响应

lixuliang

2023-11-10 13fdb067fc3d752e8bd278de539fb2de40fe8397

土地管理弹窗、工具栏整合、功能点击响应

 src/components/index.vue

@@ -45,8 +45,6 @@
        :show-tooltip="false"
        @input="changeAlpha"
      ></el-slider> -->

      <lefttop ref="lefttop" />
      <right ref="Right" />
      <leftpanel ref="Left" />
      <menupanel />
@@ -61,7 +59,6 @@
import viewer from "@/components/map/viewer";
import viewer1 from "@/components/map/viewer1";
// import left from "@/components/left/left";
import lefttop from "@/components/left/lefttop";
import leftpanel from "@/components/left/index";
import right from "@/components/right/right";
// import bottom from "@/components/bottom/bottom";
@@ -82,7 +79,6 @@
    leftpanel,
    right,
    // bottom,
    lefttop,
    yqfk,
    menupanel,
    bottommenu,

 src/components/left/layerTree.vue

@@ -598,13 +598,10 @@
    Bus.$on("switchImage", () => {
      this.clearSwitchLayer();
      this.$refs.tree.setChecked("C0698021", true, true);

      this.setChecked("C0698021", true);

      //this.$refs.tree.setChecked("shijingsanwei", true, true);
    });
    // Bus.$on("switchImage", () => {

    //   this.$refs.tree.setChecked("shijingsanwei", true, true);
    // });
  },

 src/components/left/layerTree/Layer.vue

@@ -1033,7 +1033,7 @@
  color: #ffffff !important;
}
.historyBtn {
  margin-left: 28px;
  margin-left: 10px;
}
.closeBtn {
  color: white;

 src/components/left/leftmenu.vue

@@ -546,6 +546,10 @@
      this.$refs.tree.setChecked("zhianjiankong", true, true);
      this.setChecked("zhianjiankong", true);
    });
    Bus.$on("closeSPJK", () => {
      this.$refs.tree.setChecked("zhianjiankong", false, false);
      this.setChecked("zhianjiankong", false);
    });
    //关闭菜单弹窗
    Bus.$on("closeMenuPop", (data) => {
      if (data) {

 src/components/left/lefttop.vue

@@ -57,7 +57,7 @@
export default {
  name: "lefttop",
  data() {
    ``;
    
    let checkpass = (rule, value, callback) => {
      if (value == this.form.newPassword) {
        callback();

 src/components/map/viewer.vue

@@ -87,8 +87,8 @@
      window.sgworld = new SmartEarth.EarthCtrl(
        "sdkContainer",
        {
          // StaticFileBaseUrl: "../../../static/CimSDK/",
          StaticFileBaseUrl: "../../../YZXNCS/static/CimSDK/",
          StaticFileBaseUrl: "../../../static/CimSDK/",
          // StaticFileBaseUrl: "../../../YZXNCS/static/CimSDK/",
        },
        {},
        {},
@@ -415,8 +415,8 @@
  display: block;
  position: absolute;
  /*bottom: 120px;*/
  bottom: 13px;
  right: 46px;
  bottom: 30px;
  right: 80px;
  /* margin-right: -105px; */
  z-index: 9999;
  border-radius: 10px;

 src/components/map/viewer1.vue

@@ -1275,8 +1275,8 @@
  position: absolute;
  z-index: 999;
  top: 20%;
  /* left: 50%; */
  right: -68%;
  left: 35%;
  /* right: -68%; */
  padding-top: 20px;
  width: 401px;
  height: 549px;

 src/components/menu/bottom-menu.vue

@@ -23,7 +23,7 @@
          <img src="@assets/img/new/chengshibujian.png" alt="" />
        </div>
        <div class="textbox">
          <span> åŸŽå¸‚部件 </span>
          <span> ç»¼åˆæ‰©å±• </span>
        </div>
        <el-dropdown-menu
          slot="dropdown"
@@ -36,10 +36,12 @@
          <el-dropdown-item command="bzdSystem"
            >标准地监管平台</el-dropdown-item
          >
          <el-dropdown-item command="spjkHandle"
          <el-dropdown-item v-if="isShowSPJK" command="spjkHandle"
            >视频集成与可视化</el-dropdown-item
          >

          <el-dropdown-item v-else command="closeSpjk"
            >关闭视频点位分布</el-dropdown-item
          >
          <el-dropdown-item v-if="isShowSjxl" command="sjxlHandle"
            >手机信令热力分布</el-dropdown-item
          >
@@ -65,8 +67,11 @@
        >
          <el-dropdown-item command="fcfhHandle">分层分户</el-dropdown-item>
          <!-- <el-dropdown-item command="sprhHandle">场景视频融合</el-dropdown-item> -->
          <el-dropdown-item command="jiqirendahui"
          <el-dropdown-item v-if="isShowSPRH" command="jiqirendahui"
            >场景视频融合</el-dropdown-item
          >
          <el-dropdown-item v-else command="jiqirendahui"
            >关闭视频融合</el-dropdown-item
          >
        </el-dropdown-menu>
      </el-dropdown>
@@ -341,6 +346,9 @@
  width: 155px;
  border: none;
}
.el-dropdown /deep/ .el-dropdown-selfdefine{
  margin-left: 8px !important;
}
.csbj .el-dropdown-menu {
  top: -215px !important;
}
@@ -428,6 +436,9 @@
  name: "bottom-menu",
  data() {
    return {
      isShowSPJK: true,
      isShowSjxl: true,
      isShowSPRH: true,
      csbjShow: false,
      jxmxShow: false,
      romanOption: [
@@ -609,7 +620,6 @@
      // é€æ˜Žåº¦
      far: 166,
      videoarrList: [],
      isShowSjxl: true,
    };
  },
  computed: {
@@ -637,6 +647,9 @@
        case "spjkHandle":
          this.spjkHandle();
          break;
        case "closeSpjk":
          this.closeSpjk();
          break;
        case "stdsjHandle":
          this.stdsjHandle();
          break;
@@ -653,7 +666,7 @@
          this.shoujixinling();
          break;
        case "closeSjxl":
          this.guanbi();
          this.closeSjxl();
          break;
        case "csgxHandle":
          this.csgxHandle();
@@ -664,19 +677,40 @@
      }
    },
    tdglHandle() {
      if (!this.viewer1Show) {
        const loading = this.$loading({
          lock: true,
          text: "土地管理功能加载中，请稍后",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        });
        setTimeout(() => {
          loading.close();
        }, 3500);
      }

      this.setViewer1Show(!this.viewer1Show);
    },
    stdsjHandle() {
      // window.location.href =
      //   "http://10.9.2.29:8080/#/login?token=1ed14c5157acb8088efe65bc93a032c3";
      window.open(
        "http://10.9.2.29:8080/#/login?token=1ed14c5157acb8088efe65bc93a032c3"
      );
    },
    bzdSystem() {
      window.open(
        "http://192.162.24.2:8076/login"
      );
      window.open("http://192.162.24.2:8076/login");
    },
    shoujixinling() {
      const loading = this.$loading({
        lock: true,
        text: "手机信令数据加载中，请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      setTimeout(() => {
        loading.close();
      }, 2000);
      this.isShowSjxl = false;
      let heatMapUrl = URLInCode.heatMapUrl;
      sgworld.Core.getJSON(heatMapUrl, (data) => {
@@ -705,7 +739,7 @@
        });
      });
    },
    guanbi() {
    closeSjxl() {
      if (heatMapItem) {
        this.isShowSjxl = true;
        heatMapItem.deleteObject();
@@ -762,6 +796,16 @@
      });
    },
    spjkHandle() {
      const loading = this.$loading({
        lock: true,
        text: "视频点位数据加载中，请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      setTimeout(() => {
        loading.close();
      }, 2000);
      this.isShowSPJK = false;
      if (window.sxtkGeojson) {
        window.sxtkGeojson.deleteObject();
        window.sxtkGeojson = null;
@@ -775,23 +819,51 @@
        // this.spjkLoad();
      }
    },
    closeSpjk() {
      this.isShowSPJK = true;
      if (window.sxtkGeojson) {
        window.sxtkGeojson.deleteObject();
        window.sxtkGeojson = null;
        window.sxthandler.destroy();
        //关闭弹窗
        Bus.$emit("closeRightPop", true);
        layuiLayer.close(SmartEarthPopupData.layerProp);
        return;
      } else {
        Bus.$emit("closeSPJK");
        // this.spjkLoad();
      }
    },
    // åˆ†å±‚分户
    fencengfenhu() {
      Bus.$emit("switchImage");
      const loading = this.$loading({
        lock: true,
        text: "建筑实景模型加载中，请稍后",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      setTimeout(() => {
        loading.close();
      }, 2000);
      Bus.$emit("ShowFCFH", true);
    },
    // æœºå™¨äººå¤§ä¼šè§†é¢‘融合
    async jiqirendahui(item) {
      Bus.$emit("switch3D");
      var that = this;
      this.isShowSPRH = false;
      if (that.robotvideoarrList.length > 0) {
        for (var i = 0; i < that.robotvideoarrList.length; i++) {
          that.robotvideoarrList[i].destroy();
          that.robotvideoarrList[i] = undefined;
        }
        that.robotvideoarrList = [];
        this.isShowSPRH = true;
      } else {
        const loading = this.$loading({
          lock: true,
          text: "Loading",
          text: "视频数据加载中，请稍后",
          spinner: "el-icon-loading",
          background: "rgba(0, 0, 0, 0.7)",
        });
@@ -807,7 +879,6 @@
              item[i].cameraIndexCode,
            // url: "http://10.10.4.116:8086/getCamerasInfoHls?cameraIndexCode=49ee9fed701444738112e80a4835122c",
            success: function (result) {
              loading.close();
              video = sgworld.Creator.Video3D({
                cameraPosition: position, //相机安装位置
                heading: item[i].heading, //64
@@ -823,6 +894,7 @@
                useLine: false, //是否试用辅助线
                success() {
                  sgworld.Navigate.flyToObj(video);
                  loading.close();
                },
              });
              that.robotvideoarrList.push(video);

 src/components/menu/index.vue

@@ -8,7 +8,7 @@
.menupanel {
  position: absolute;
  left: 12px;
  bottom: 85px;
  bottom: 50px;
  z-index: 9999999;
  pointer-events: all;
}

 src/components/menu/tools/analysis.vue

@@ -140,12 +140,12 @@
  /* border-radius: 30px; */
  box-shadow: 0px 0px 10px rgba(101, 180, 253, 0.8) inset;
  background-color: rgba(5, 39, 126, 0.7);
  border-image-source: radial-gradient(
  /* border-image-source: radial-gradient(
    52% 120%,
    transparent 0px,
    transparent 100%,
    cyan 100%
  );
  ); */
  border-image-slice: 1;
  border-width: 1px;
  border-style: solid;

 src/components/menu/tools/setting.vue

@@ -182,7 +182,7 @@
  position: absolute;
  z-index: 9999999;
  pointer-events: all;
  background: rgba(0, 0, 0, 0.7);
  background: rgba(14, 50, 143, 0.6);
  border: 3px rgba(255, 255, 255, 0.5) solid;
  border-radius: 7px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.5);

 src/components/menu/tools/special.vue

@@ -807,20 +807,7 @@
        });
      });
    },
    spjkHandle() {
      if (window.sxtkGeojson) {
        window.sxtkGeojson.deleteObject();
        window.sxtkGeojson = null;
        window.sxthandler.destroy();
        //关闭弹窗
        Bus.$emit("closeRightPop", true);
        layuiLayer.close(SmartEarthPopupData.layerProp);
        return;
      } else {
        Bus.$emit("showSPJK");
        // this.spjkLoad();
      }
    },
   
    handleCommand(command) {
      switch (command) {
        case "qytj":

 src/components/right/right-bottom.vue

@@ -14,47 +14,6 @@
          </div>
        </el-tooltip>
      </div>
      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
          content="场景快照"
          placement="left"
          popper-class="item_tooltip"
        >
          <div class="legend-bg" @click="screenShot">
            <img class="legendImg" src="@/assets/img/new/mengban.png" />
          </div>
        </el-tooltip>
      </div> -->
      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
          content="相机参数"
          placement="left"
          popper-class="item_tooltip"
        >
          <div class="legend-bg" @click="getcamera">
            <img class="legendImg" src="@/assets/img/new/mengban.png" />
          </div>
        </el-tooltip>
      </div> -->

      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
          content="超图"
          placement="left"
          popper-class="item_tooltip"
        >
          <div class="legend-bg" @click="S3M()">
            <img class="legendImg" src="@/assets/img/new/mengban.png" />
          </div>
        </el-tooltip>
      </div> -->

      <div class="mapTool">
        <el-tooltip
          class="item"
@@ -68,7 +27,7 @@
          </div>
        </el-tooltip>
      </div>
      <div class="mapTool">
      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
@@ -80,7 +39,7 @@
            <img class="dwImg" src="@/assets/img/new/location.png" />
          </div>
        </el-tooltip>
      </div>
      </div> -->
      <div class="mapTool">
        <el-tooltip
          class="item"
@@ -107,7 +66,7 @@
          </div>
        </el-tooltip>
      </div>
      <div class="mapTool" v-if="isActive">
      <!-- <div class="mapTool" v-if="isActive">
        <el-tooltip
          class="item"
          effect="dark"
@@ -132,7 +91,7 @@
            <img class="qpImg" src="@/assets/img/new/tuichuquanping.png" />
          </div>
        </el-tooltip>
      </div>
      </div> -->
      <div class="mapTool">
        <el-tooltip
          class="item"
@@ -159,6 +118,32 @@
          </div>
        </el-tooltip>
      </div>
      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
          content="场景快照"
          placement="left"
          popper-class="item_tooltip"
        >
          <div class="legend-bg" @click="screenShot">
            <img class="legendImg" src="@/assets/img/new/mengban.png" />
          </div>
        </el-tooltip>
      </div> -->
      <!-- <div class="mapTool">
        <el-tooltip
          class="item"
          effect="dark"
          content="相机参数"
          placement="left"
          popper-class="item_tooltip"
        >
          <div class="legend-bg" @click="getcamera">
            <img class="legendImg" src="@/assets/img/new/mengban.png" />
          </div>
        </el-tooltip>
      </div> -->
      <!-- <div class="mapTool">
        <el-tooltip class="item" effect="dark" content="二三维切换" placement="left">
          <el-button class="tool-23mode" @click="_23mode">
@@ -211,9 +196,7 @@
.trigger {
  pointer-events: all;
}
.mapTools {
  /* margin-bottom: 58px; */
}

.mapTool {
  margin: 2px 0;
}
@@ -221,8 +204,8 @@
  background-image: url("~@/assets/img/new/leftCircle.png");
  background-size: 100%;
  background-color: transparent;
  width: 54.5px;
  height: 54.5px;
  width:  35px;
  height:  35px;
  position: relative;
}
.legend-bg:hover {
@@ -238,8 +221,8 @@
/* 
.mapTool .el-button {
  padding: 0 !important;
  width: 54.5px;
  height: 54.5px;
  width:  30px;
  height:  30px;
  border: unset;
  float: unset;
  display: block;
@@ -253,7 +236,7 @@
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 28px;
  width: 20px;
}

.button-group-vertical {

 src/components/right/right-legend.vue

@@ -6,7 +6,12 @@
    </div>
    <div class="legend-box">
      <div class="legend" v-for="(item, index) in state.list" :key="index">
        <img class="img" :src="item.icon" alt="" :style="`width:${item.width}px;height:${item.height}px;`" />
        <img
          class="img"
          :src="item.icon"
          alt=""
          :style="`width:${item.width}px;height:${item.height}px;`"
        />
        <span>{{ item.name }}</span>
      </div>
    </div>
@@ -377,11 +382,10 @@
      this.$parent.showLegend = false;
    },
  },
  mounted(){
  },
  mounted() {},
  watch: {
    "state.list": function (val) {
      this.state = val
      this.state = val;
    },
  },
};
@@ -394,11 +398,12 @@
  border-radius: 5px; */
  background-color: #2153f87e;
  background-image: url("~@/assets/img/new/listbg.png");
  background-size: 100% 100%;  color: #fff;
  background-size: 100% 100%;
  color: #fff;
  padding: 0px 10px 10px;
  width: 400px;
  right: 60px;
  top: -240px;
  right: 6px;
  top: -427px;
  z-index: 9999999;
  pointer-events: all;
}

 src/components/right/right-top.vue

@@ -1,13 +1,57 @@
<template>
  <div class="trigger" style="margin-top: 140px; margin-right: 10px">
    <div class="user" @click="showLayer()">
    <div class="user">
      <el-avatar
        class="user_btn"
        :size="70.6"
        icon="el-icon-user-solid"
        alt="个人中心"
      ></el-avatar>
      <div class="transition-box">
        <ul>
          <li @click="showLayer()">标绘数据</li>
          <li @click="dialogFormVisible = true">修改密码</li>
        </ul>
    </div>
    </div>
    <el-dialog
      append-to-body
      title="修改密码"
      :visible.sync="dialogFormVisible"
      width="30%"
      :close-on-click-modal="false"
      custom-class="psdDialog"
    >
      <el-form :model="form" ref="pwdForm" :rules="rules">
        <el-form-item label="原密码">
          <el-input
            show-password
            v-model="form.oldPassword"
            autocomplete="off"
          ></el-input>
        </el-form-item>

        <el-form-item label="新密码" prop="newPassword">
          <el-input
            show-password
            v-model="form.newPassword"
            autocomplete="off"
          ></el-input>
        </el-form-item>

        <el-form-item label="确认密码" prop="checkPassword">
          <el-input
            show-password
            v-model="form.checkPassword"
            autocomplete="off"
          ></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button @click="closeDig('pwdForm')">取 æ¶ˆ</el-button>
        <el-button type="primary" @click="onSubmit('pwdForm')">ç¡® å®š</el-button>
      </div>
    </el-dialog>
    <div class="rightTool">
      <el-button @click="showInput">
        <img class="searchBg" src="@/assets/img/new/leftCircle.png" />
@@ -339,6 +383,7 @@
  pointer-events: all;
  margin: 0 auto;
}

.user_menu {
  right: 10px;
  top: 100px;
@@ -349,7 +394,54 @@
  margin-top: 0px !important;
  /* border-radius: 3px !important; */
}

.user:hover .transition-box {
  display: block;
}
.transition-box {
  display: none;
  width: 130px;
  height: 90px;
  position: relative;
  left: -50px;
  border-radius: 4px;
  background: rgba(14, 50, 143, 0.6);
  text-align: center;
  color: #fff;
  padding: 10px;
  box-sizing: border-box;
}
.transition-box ul li {
  /* min-width: 154px; */
  height: 35px;
  text-align: center;
  line-height: 35px;
}
.transition-box ul li:hover {
  background: rgba(18, 80, 172, 0.6);
  box-shadow: 0px 0px 10px 5px rgba(0, 132, 255, 0.7) inset;
}
.psdDialog .el-form-item {
  margin-bottom: 0px;
}
/* .psdDialog,
.psdDialog /deep/ .el-pager li {
    background-color: rgba(255, 0, 0, 0.0);
    color: #FFFFFF;
}
.psdDialog /deep/ .el-dialog__header {
    padding-top: 10px !important;
    background-color:rgb(255,255,255,0);
    border-radius: 14px 14px  0  0 ;
}
.psdDialog /deep/ .el-dialog__body {
    border-top: 0 !important;
    background-color: rgba(19, 31, 59, 0);
    color: #FFFFFF;
}
.psdDialog /deep/ .el-dialog__footer{
    text-align: center;
    background-color: rgba(255,255,255,0);
} */
.pointInfoBoxContext {
  position: relative;
  /*right: 12px;*/
@@ -668,6 +760,8 @@
</style>

<script>
import { getUserInfo, updateUserPwd } from "@/api/api";
import qs from "qs";
import axios from "axios";
import location from "@/components/right/tools/location";
import plotting from "@/components/right/tools/plotting";
@@ -704,7 +798,30 @@
  },
  name: "right-top",
  data() {
    let checkpass = (rule, value, callback) => {
      if (value == this.form.newPassword) {
        callback();
      } else {
        callback(new Error("密码不一致"));
      }
    };
    return {
      rules: {
        newPassword: [
          { required: true, message: "请输入新密码", trigger: "blur" },
        ],
        checkPassword: [
          { required: true, message: "不能为空", trigger: "blur" },
          { validator: checkpass, trigger: "blur" },
        ],
      },
      dialogFormVisible: false,
      nickName: "用户",
      form: {
        oldPassword: "",
        newPassword: "",
        checkPassword: "",
      },
      resBypoi: [],
      expands: [],
      showRangeBox: false,
@@ -811,6 +928,55 @@
  },
  methods: {
    ...mapMutations(["setViewer1Show", "setYqfk"]),
    onSubmit(formName) {
      this.$refs[formName].validate((valid) => {
        if (valid) {
          let pwdItem = {
            newPassword: this.form.newPassword,
            oldPassword: this.form.oldPassword,
          };

          const options = {
            method: "PUT",
            headers: {
              "content-type": "application/x-www-form-urlencoded",
              Authorization: window.localStorage.getItem("TokenKey"),
            },
            data: qs.stringify(pwdItem),
            url: "http://10.10.4.116:8089/system/user/profile/updatePwd",
          };
          axios(options).then((res) => {
            if (res.data.code != 200) {
              this.$message.error(res.data.msg);
            } else {
              this.$message({
                message: res.data.msg,
                type: "success",
              });
              this.form.newPassword = "";
              this.form.oldPassword = "";
              this.form.checkPassword = "";
              this.dialogFormVisible = false;
              setTimeout(() => {
                localStorage.removeItem("TokenKey");
                localStorage.removeItem("TokenTime");
                this.$router.push("/login");
              }, 3000);
            }
          });
        } else {
          alert("验证不通过");
          return false;
        }
      });
    },
    closeDig(formName) {
      this.form.newPassword = "";
      this.form.oldPassword = "";
      this.form.checkPassword = "";
      this.dialogFormVisible = false;
      this.$refs[formName].resetFields();
    },
    /*分层分户*/
    fcfhpick(open) {
      if (open) {

 static/layers.json

ÎļþÌ«´ó