From c658f316d2f464e510d10f1081c52848c3aefeb2 Mon Sep 17 00:00:00 2001
From: lixuliang <lixuliang_hd@126.com>
Date: 星期三, 15 十一月 2023 23:21:16 +0800
Subject: [PATCH] 企业 视频弹框
---
src/components/right/right-top.vue | 246 ++++++++++++++++++++++++++++++++++++++++++++----
1 files changed, 223 insertions(+), 23 deletions(-)
diff --git a/src/components/right/right-top.vue b/src/components/right/right-top.vue
index 4c6ce8e..1fcc4a1 100644
--- a/src/components/right/right-top.vue
+++ b/src/components/right/right-top.vue
@@ -1,16 +1,60 @@
<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" />
+ <el-button class="searchElBg" @click="showInput">
+ <div class="searchBg"></div>
<img
class="searchBtn"
v-if="!isShowInput"
@@ -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,55 @@
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;
+ z-index: 9999;
+}
+.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;*/
@@ -584,16 +678,25 @@
margin: 1px;
margin: 20px 0;
}
-
-.searchBtn {
- width: 40px;
+.searchElBg{
+ background-image: url("~@/assets/img/new/leftCircle.png") !important;
+ background-size: 48px 48px !important;
}
-
+.searchBtn {
+ margin-top: 3px;
+ width: 40px;
+ pointer-events: none;
+}
+.searchElBg:hover{
+ background-image: url("~@/assets/img/new/leftCircle-y.png") !important;
+ background-size: 48px 48px !important;
+}
.searchBg {
position: absolute;
left: -4px;
top: 15px;
- width: 54.5px;
+ width: 56px;
+ height: 56px;
z-index: -10;
}
.active {
@@ -604,11 +707,13 @@
position: absolute;
right: 26px;
top: 17px;
- width: 70.6px;
- height: 70.6px;
+ width: 71px;
+ height: 71px;
background-image: url("~@/assets/img/new/rightCircle.png");
}
-
+.user:hover {
+ background-image: url("~@/assets/img/new/rightCircle-y.png");
+}
.user .el-avatar {
background-color: transparent;
margin: 3px auto 0;
@@ -667,6 +772,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 +789,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 +806,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 +922,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 +940,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 +1003,7 @@
closefcfhBox() {
this.isShowFCFH = false;
},
- kuangxuan() {
+ rangeQuery() {
let layersData = this.$store.state.selectedLayers.filter((item) => {
return (
item.urls &&
@@ -867,6 +1050,9 @@
}
},
closePOIbox() {
+ flyPoint && Viewer.entities.remove(flyPoint);
+ flyPoint = undefined;
+
this.isShowDetail = false;
this.showRangeBox = false;
this.pointInfo = {};
@@ -1338,6 +1524,7 @@
this.isShowDetail = false;
},
flyToPOI(item) {
+ flyPoint && Viewer.entities.remove(flyPoint);
sgworld.Navigate.flyToPointsInterest({
destination: Cesium.Cartesian3.fromDegrees(
item.geometry.coordinates[0],
@@ -1350,6 +1537,19 @@
roll: Cesium.Math.toRadians(0.0),
},
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,
+ },
});
},
},
@@ -1370,10 +1570,10 @@
// this.showInfoBox = true;
if (this.info["JK鍐呯爜"]) {
- this.$message({
- showClose: true,
- message: "杩炴帴鐘舵�佹煡璇腑",
- });
+ // this.$message({
+ // showClose: true,
+ // message: "杩炴帴鐘舵�佹煡璇腑",
+ // });
this.spjkLoad(this.info);
}
},
--
Gitblit v1.9.3