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

lixuliang

2023-11-10 13fdb067fc3d752e8bd278de539fb2de40fe8397

 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" />
@@ -224,7 +268,8 @@
    </div>
    <!-- 分层分户按钮 -->
    <div class="fcfhBox" v-if="isShowFCFH">
      <button
      <FCFH />
      <!-- <button
        id="btn1"
        class="layui-btn"
        :class="{ fcfhactive: fcfhopen }"
@@ -240,7 +285,7 @@
      >
        关闭拾取
      </button>
      <span class="closeBtn" @click="closefcfhBox">×</span>
      <span class="closeBtn" @click="closefcfhBox">×</span> -->
    </div>
  </div>
</template>
@@ -338,6 +383,7 @@
  pointer-events: all;
  margin: 0 auto;
}

.user_menu {
  right: 10px;
  top: 100px;
@@ -348,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;*/
@@ -667,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";
@@ -682,10 +777,11 @@
import { mapState, mapMutations } from "vuex";
import Bus from "../tools/Bus";
import { queryBySquare } from "@/utils/request";
import FCFH from "@/components/right/FCFH";

//交通图层
let trafficLayer, panoramaLayer;

let flyPoint;
export default {
  components: {
    location,
@@ -698,10 +794,34 @@
    leftztfx,
    lefttx,
    Layer,
    FCFH,
  },
  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,
@@ -790,12 +910,13 @@
      }
    });
    Bus.$on("showRangeBox", (layer, res) => {
      this.kuangxuan();
      this.rangeQuery();
    });
    Bus.$on("ShowFCFH", (data) => {
      if (data) {
        this.isShowFCFH = true;
      if (this.isShowFCFH == data) {
        return;
      }
      this.isShowFCFH = data;
    });
  },
  destroyed() {
@@ -807,6 +928,56 @@
  },
  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) {
        this.fcfhopen = true;
@@ -820,7 +991,7 @@
    closefcfhBox() {
      this.isShowFCFH = false;
    },
    kuangxuan() {
    rangeQuery() {
      let layersData = this.$store.state.selectedLayers.filter((item) => {
        return (
          item.urls &&
@@ -867,6 +1038,9 @@
      }
    },
    closePOIbox() {
      flyPoint && Viewer.entities.remove(flyPoint);
      flyPoint = undefined;

      this.isShowDetail = false;
      this.showRangeBox = false;
      this.pointInfo = {};
@@ -1338,6 +1512,7 @@
      this.isShowDetail = false;
    },
    flyToPOI(item) {
      flyPoint && Viewer.entities.remove(flyPoint);
      sgworld.Navigate.flyToPointsInterest({
        destination: Cesium.Cartesian3.fromDegrees(
          item.geometry.coordinates[0],
@@ -1351,6 +1526,19 @@
        },
        duration: 3,
      });
      flyPoint = Viewer.entities.add({
        position: Cesium.Cartesian3.fromDegrees(
          parseFloat(item.geometry.coordinates[0]),
          parseFloat(item.geometry.coordinates[1])
        ),
        billboard: {
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
          scale: 1,
          image: window.SmartEarthRootUrl + "Workers/image/mark.png",
          heightReference: 1,
          disableDepthTestDistance: Number.POSITIVE_INFINITY,
        },
      });
    },
  },
  watch: {