From 5fb65ada8ccc28eabf823b284de70fbd3ca1f41e Mon Sep 17 00:00:00 2001
From: ZZJ <zzjdsg2300@163.com>
Date: 星期二, 28 九月 2021 18:29:36 +0800
Subject: [PATCH] 抓拍大图层级修复v1
---
src/pages/desktop/index/components/Tools.vue | 369 +++++++++++++++++++++++++++++++++++++++++++++++++---
1 files changed, 345 insertions(+), 24 deletions(-)
diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue
index 063952c..04fc852 100644
--- a/src/pages/desktop/index/components/Tools.vue
+++ b/src/pages/desktop/index/components/Tools.vue
@@ -21,9 +21,13 @@
@click.stop
>
<div class="top">
- <img :src="`data:image/png;base64,${userInfo.headpic}`" alt="" />
+ <img
+ v-if="userInfo"
+ :src="`data:image/png;base64,${userInfo.headpic}`"
+ alt=""
+ />
- <span class="username">{{ userInfo.username }}</span>
+ <span class="username">{{ userInfo && userInfo.username }}</span>
</div>
<div class="link-list">
<div
@@ -36,7 +40,7 @@
</div>
</div>
<div class="bot">
- <div class="set" @click="gotoSet">
+ <div class="set" @click="clickFastPath('绯荤粺璁剧疆')">
<span class="icon iconfont">{{ "\ue60f" }}</span>
<span>璁剧疆</span>
</div>
@@ -49,7 +53,7 @@
<div class="tools-icon no-hover-style">
<img
class="smart-ai"
- :src="`${publicPath}images/desktop/header-icon/SmartAI.png`"
+ :src="`${publicPath}images/desktop/header-icon/SmartAI-鏂�.png`"
alt
/>
</div>
@@ -73,6 +77,12 @@
</div>
</div>
<div class="tools-right">
+ <div class="tools-icon my-tools-icon" @click="goToWireSet">
+ <span class="icon iconfont"></span>
+ </div>
+ <div class="tools-icon my-tools-icon" @click.stop="toggleShowWifi">
+ <span class="icon iconfont"></span>
+ </div>
<div class="tools-icon">
<img :src="`${publicPath}images/desktop/header-icon/search.png`" alt />
</div>
@@ -93,7 +103,7 @@
</span>
<el-dropdown-menu slot="dropdown" style="top: 44px">
<el-dropdown-item style="text-align: left">
- <b>Hi {{ userInfo.username }}</b>
+ <b>Hi {{ userInfo && userInfo.username }}</b>
</el-dropdown-item>
<el-dropdown-item @click.native="showPasswdForm = true"
>淇敼瀵嗙爜</el-dropdown-item
@@ -151,12 +161,106 @@
>
</div>
</el-dialog>
+
+ <div class="sys-remind" v-if="showSysRemind">
+ <!-- -->
+ <div class="remind-title">绯荤粺鏇存柊鎻愰啋</div>
+
+ <div class="remind-content">
+ 宸插仛濂�<b>绯荤粺鏇存柊</b>鐨勫噯澶囷紝<span style="color: red"
+ >鏇存柊棰勮闇�瑕佷竴瀹氱殑鏃堕棿</span
+ >锛屽鏋滄偍鏈噯澶囧ソ锛屾垜浠皢鍦ㄤ竴灏忔椂鍚庡啀娆″悜鎮ㄧ‘璁ゃ��
+ </div>
+
+ <div class="btns">
+ <el-button size="mini" type="primary" @click="delaySysRemind(3600 * 24)"
+ >鍏抽棴姝ゆ鎻愰啋</el-button
+ >
+ <el-button size="mini" type="primary" @click="delaySysRemind(60 * 60)"
+ >1灏忔椂鍚庢彁閱�</el-button
+ >
+ <el-button
+ :loading="upgrading"
+ size="mini"
+ type="primary"
+ @click="updateSysNow"
+ >
+ {{ upgrading ? "鏇存柊涓�" : "绔嬪嵆鏇存柊" }}</el-button
+ >
+ </div>
+ </div>
+
+ <div class="sys-remind" v-if="showAppRemind">
+ <!-- -->
+ <div class="remind-title">绠楁硶/搴旂敤鏇存柊鎻愰啋</div>
+
+ <div class="remind-content">
+ 鍙戠幇 <b>绠楁硶/搴旂敤 </b>鏇存柊锛�<span style="color: red"
+ >璇峰墠寰�鏌ョ湅鏇存柊</span
+ >銆傚鏋滄偍鏈噯澶囧ソ锛屾垜浠皢鍦ㄤ竴灏忔椂鍚庡啀娆″悜鎮ㄧ‘璁ゃ��
+ </div>
+
+ <div class="btns">
+ <el-button size="mini" type="primary" @click="delayAppRemind(3600 * 24)"
+ >鍏抽棴姝ゆ鎻愰啋</el-button
+ >
+ <el-button size="mini" type="primary" @click="delayAppRemind(60 * 60)"
+ >1灏忔椂鍚庢彁閱�</el-button
+ >
+ <el-button
+ :loading="upgrading"
+ size="mini"
+ type="primary"
+ @click="goToUpdate"
+ >
+ 鍓嶅線鏇存柊</el-button
+ >
+ </div>
+ </div>
+
+ <div class="wifi-pop" :class="showWifi ? 'wifi-pop-show' : ''">
+ <div class="top-title">
+ <div class="text">鏃犵嚎缃戠粶</div>
+ <el-switch v-model="isOpenWifi" active-color="rgba(61, 104, 225, 1)">
+ </el-switch>
+ </div>
+
+ <div class="wifi-list">
+ <div
+ class="item"
+ :class="i == activeWifi ? 'item-active' : ''"
+ v-for="(x, i) in wifiList"
+ :key="i"
+ @click="pickWifi(x, i)"
+ >
+ <!-- -->
+ <div class="top">
+ <span class="icon iconfont"></span>
+ <div class="name">
+ <span style="font-size: 14px">{{ x.name }}</span>
+ <span>瀹夊叏</span>
+ </div>
+ </div>
+ <div class="bot" v-if="x.showBottom">
+ <el-checkbox v-model="x.checked">鑷姩杩炴帴</el-checkbox>
+ <el-button size="mini">杩炴帴</el-button>
+ </div>
+ </div>
+ </div>
+ </div>
</div>
</template>
<script>
-import html2canvas from "html2canvas";
import { logout, updatePwd } from "@/api/login";
+
+import {
+ getUpgradeNotice,
+ delayUpgradeNotice,
+ getAppUpgradeNotice,
+ upgradeNewVersion,
+ delayAppNotice,
+} from "@/api/system";
export default {
name: "Tools",
data() {
@@ -184,12 +288,19 @@
notificationCenterVisible: false,
notificationCenterMessageCount: 0,
userInfo: {},
+ activeWifi: null,
+ wifiList: [
+ { name: "缃戠粶1", connected: false, showBottom: false, checked: false },
+ { name: "缃戠粶2", connected: false, showBottom: false, checked: false },
+ { name: "缃戠粶3", connected: true, showBottom: false, checked: false },
+ ],
linkList: [
{ name: "鏂囨。涓績" },
{ name: "绯荤粺鐩戞帶鍣�" },
{ name: "鏃ュ織绠＄悊" },
],
showPasswdForm: false,
+ showWifi: false,
rules: {
oldPwd: [{ required: true, message: "璇疯緭鍏ユ棫瀵嗙爜", trigger: "blur" }],
newPwd: [{ required: true, validator: validatePass, trigger: "blur" }],
@@ -198,6 +309,13 @@
],
},
showFastPath: false,
+ showSysRemind: false,
+ showAppRemind: false,
+ sysTimeout: 60 * 60 * 1000,
+ sysTimer: null,
+ appTimeout: 60 * 60 * 1000,
+ upgrading: false,
+ isOpenWifi: false,
passwdForm: {
oldPwd: "",
newPwd: "",
@@ -210,7 +328,6 @@
this.userInfo =
sessionStorage.getItem("userInfo") &&
JSON.parse(sessionStorage.getItem("userInfo"));
- console.log(this.userInfo);
if (window.toolIntervalArr) {
window.toolIntervalArr.forEach((item) => clearInterval(item));
}
@@ -220,16 +337,109 @@
}, 600),
];
},
+ beforeDestroy() {
+ clearTimeout(this.sysTimer);
+ this.sysTimer = null;
+ },
mounted() {
document.addEventListener("click", (e) => {
- // debugger
- // this.showFastPath=false
- if (this.showFastPath) {
+ if (this.showFastPath||this.showWifi) {
this.showFastPath = false;
+ this.showWifi = false;
}
});
+ this.askSysUpdate();
+ this.askAppUpdate();
+
+
},
methods: {
+ askAppUpdate() {
+ getAppUpgradeNotice().then((res) => {
+ if (res.code == 200) {
+ if (res.data.NeedUpdate && res.data.NoticeStatus) {
+ if (res.data.LastNoticeTime == 0) {
+ this.showAppRemind = true;
+ } else {
+ this.appTimeout = res.data.LastNoticeTime * 1000;
+ this.delayAppAsk();
+ }
+ }
+ }
+ });
+ },
+ pickWifi(x, i) {
+ this.wifiList.forEach((x) => {
+ x.showBottom = false;
+ });
+ x.showBottom = !x.showBottom;
+ this.activeWifi = i;
+ },
+ goToUpdate() {
+ this.showAppRemind = false;
+ window.parent.postMessage({ msg: `toAI?activeName=鏇存柊` }, "*");
+ },
+ goToWireSet() {
+ window.parent.postMessage(
+ { msg: `toSetting?menu=缃戠粶璁剧疆&subMenu=鏈夌嚎缃戠粶` },
+ "*"
+ );
+ },
+ updateSysNow() {
+ window.parent.postMessage(
+ { msg: `toVindicate?autoUpdate=1` },
+ "*"
+ );
+ },
+ delaySysRemind(sec) {
+ delayUpgradeNotice({
+ delaySecond: sec,
+ }).then((res) => {
+ if (res.code == 200) {
+ this.$notify.success("璁剧疆鎴愬姛");
+ this.showSysRemind = false;
+ this.sysTimeout = res.data.LastNoticeTime * 1000;
+ this.delaySysAsk();
+ }
+ });
+ },
+ delayAppRemind(sec) {
+ delayAppNotice({
+ delay: sec,
+ }).then((res) => {
+ if (res.code == 200) {
+ this.$notify.success("璁剧疆鎴愬姛");
+ this.showAppRemind = false;
+ this.appTimeout = res.data.LastNoticeTime * 1000;
+ this.delayAppAsk();
+ }
+ });
+ },
+ delaySysAsk() {
+ this.sysTimer = setTimeout(() => {
+ this.askSysUpdate();
+ }, this.sysTimeout);
+ },
+ delayAppAsk() {
+ this.appTimer = setTimeout(() => {
+ this.askAppUpdate();
+ }, this.appTimeout);
+ },
+ askSysUpdate() {
+ getUpgradeNotice().then((res) => {
+ if (res.data.HaveNewVersion > 0 && res.data.NoticeStatus) {
+ if (res.data.LastNoticeTime == 0) {
+ this.showSysRemind = true;
+ } else {
+ this.sysTimeout = res.data.LastNoticeTime * 1000;
+ this.delaySysAsk();
+ }
+ }
+ });
+ },
+ toggleShowWifi() {
+ this.showWifi = !this.showWifi;
+ },
submitForm(formName) {
this.$refs[formName].validate((valid) => {
if (valid) {
@@ -238,16 +448,12 @@
newPwd: this.passwdForm.checkPwd,
};
updatePwd(json).then((res) => {
- console.log(res, "淇敼瀵嗙爜");
this.$notify({
type: res.success ? "success" : "error",
message: res.msg,
});
if (res.success) {
this.showPasswdForm = false;
- // this.$nextTick(_=>{
- // this.toLogout('淇敼瀵嗙爜鎴愬姛锛岃閲嶆柊鐧诲綍锛�')
- // })
}
});
} else {
@@ -304,16 +510,9 @@
clickFastPath(name) {
this.$emit("jumpToDock", name);
},
- gotoSet() {
- this.$emit("jumpToDock", "绯荤粺璁剧疆");
- },
- toolHover(dock) {
- //this.$parent.screenShot(dock)
- },
toLogout() {
let _this = this;
this.$confirm("纭畾閫�鍑虹櫥褰曞悧锛�", "鎻愮ず", {
- // center: true,
type: "warning",
cancelButtonClass: "comfirm-class-cancle",
confirmButtonClass: "comfirm-class-sure",
@@ -362,7 +561,7 @@
margin: auto;
}
.tools .tools-left {
- width: 200px;
+ width: 275px;
height: 100%;
float: left;
margin-left: 14px;
@@ -421,10 +620,16 @@
text-align: center;
height: 100%;
display: inline-block;
- vertical-align: top;
+ vertical-align: bottom;
+
line-height: 56px;
padding: 0 15px;
position: relative;
+ .iconfont {
+ display: block;
+ line-height: 42px;
+ font-size: 25px;
+ }
}
@keyframes move {
0% {
@@ -454,7 +659,6 @@
img {
height: 50px;
width: 50px;
- background-color: bisque;
border-radius: 50%;
}
.username {
@@ -505,6 +709,36 @@
}
}
+.sys-remind {
+ background-color: white;
+ width: 400px;
+ position: absolute;
+ right: 5px;
+ top: 45px;
+ border-radius: 5px;
+ .remind-title {
+ box-sizing: border-box;
+ text-align: left;
+ padding: 0 20px;
+ border-bottom: 1px solid lightgray;
+ font-size: 16px;
+ line-height: 35px;
+ }
+ .remind-content {
+ text-align: left;
+ line-height: 20px;
+ font-size: 14px;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ padding: 15px 20px;
+ }
+ .btns {
+ padding: 0px 12px 8px 12px;
+ /* background-color: antiquewhite; */
+ text-align: right;
+ }
+}
+
.tools-icon img {
-webkit-user-drag: none;
}
@@ -513,6 +747,88 @@
color: white;
background-color: #98aabe;
cursor: pointer;
+}
+
+.wifi-pop {
+ position: absolute;
+ width: 210px;
+ top: 55px;
+ height: 400px;
+ border-radius: 6px;
+ background-color: white;
+ transition: 0.2s;
+ display: none;
+ box-sizing: border-box;
+ right: 100px;
+ .top-title {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ padding: 0 20px;
+ font-size: 14px;
+ border-bottom: 1px solid lightgray;
+ }
+ .wifi-list {
+ overflow: auto;
+ height: 340px;
+ .item-active {
+ background-color: rgba(66, 102, 153, 1);
+ color: white;
+ }
+ .item {
+ box-sizing: border-box;
+ cursor: pointer;
+ /* background-color: aqua; */
+ padding: 10px 20px;
+ .top {
+ display: flex;
+ .icon {
+ font-size: 20px;
+ margin-right: 10px;
+ }
+ .name {
+ display: flex;
+ flex-direction: column;
+ line-height: 20px;
+ text-align: left;
+ }
+ }
+ .bot {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ .el-checkbox {
+ color: white;
+ .el-checkbox__input.is-checked + .el-checkbox__label {
+ color: white;
+ }
+ .el-checkbox__label {
+ padding-left: 5px;
+ font-size: 12px;
+ }
+ .el-checkbox__inner {
+ width: 12px;
+ height: 12px;
+
+ .el-checkbox__inner::after {
+ height: 6px;
+ left: 3px;
+ }
+ }
+ }
+
+ .el-button--mini,
+ .el-button--mini.is-round {
+ padding: 5px 10px;
+ }
+ }
+ }
+ }
+}
+.wifi-pop-show {
+ animation: move linear 0.2s 1;
+ display: block;
}
.fast-path-show {
@@ -525,6 +841,11 @@
height: 100%;
margin-right: 14px;
}
+
+.smart-ai {
+ height: 65%;
+}
+
.el-dropdown-menu {
top: 40px !important;
}
--
Gitblit v1.8.0