From 4b43bfb3f6f499f480712dd29bef52275466afd6 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期五, 30 七月 2021 22:10:59 +0800 Subject: [PATCH] change all --- src/pages/desktop/index/components/Tools.vue | 371 +++++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 349 insertions(+), 22 deletions(-) diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue index 063952c..0d77afc 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> @@ -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,120 @@ }, 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=update` }, "*"); + }, + goToWireSet() { + window.parent.postMessage( + { msg: `toSetting?menu=缃戠粶璁剧疆&subMenu=鏈夌嚎缃戠粶` }, + "*" + ); + }, + updateSysNow() { + window.parent.postMessage( + { msg: `toVindicate?autoUpdate=1` }, + "*" + ); + // this.upgrading = true; + // upgradeNewVersion() + // .then((res) => { + // if (res.code == 200) { + // this.upgrading = true; + + // this.$notify.success("鏇存柊鐗堟湰鎴愬姛"); + // this.showSysRemind = false; + // } + // }) + // .catch((err) => { + // this.$notify.error("鏇存柊鐗堟湰澶辫触"); + // }); + }, + 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 +459,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 +521,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", @@ -421,10 +631,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 +670,6 @@ img { height: 50px; width: 50px; - background-color: bisque; border-radius: 50%; } .username { @@ -505,6 +720,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; } @@ -515,6 +760,88 @@ 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 { animation: move linear 0.2s 1; display: block; -- Gitblit v1.8.0