From 1e38d05ea637b9d64161b99764fa967fe6c7fb66 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@smartai.com> Date: 星期三, 23 三月 2022 02:34:22 +0800 Subject: [PATCH] 桌面wifi功能添加后端查询功能 --- src/pages/desktop/index/components/Tools.vue | 394 +++++++++++++++++++++---------------------------------- 1 files changed, 151 insertions(+), 243 deletions(-) diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue index be2bd4a..2cfe3ec 100644 --- a/src/pages/desktop/index/components/Tools.vue +++ b/src/pages/desktop/index/components/Tools.vue @@ -2,40 +2,20 @@ <div class="tools"> <div class="tools-left"> <div - :class="[ - 'tools-icon', - 'tools-show-desktop', - { clicked: this.$store.state.desktop.preferenceVisiable }, - ]" + :class="['tools-icon', 'tools-show-desktop', { clicked: this.$store.state.desktop.preferenceVisiable }]" @click.stop="togglePreference" > - <img - class="system" - :src="`${publicPath}images/desktop/header-icon/system.png`" - /> + <img class="system" :src="`${publicPath}images/desktop/header-icon/system.png`" /> </div> - <div - class="fast-path" - :class="showFastPath ? 'fast-path-show' : ''" - @click.stop - > + <div class="fast-path" :class="showFastPath ? 'fast-path-show' : ''" @click.stop> <div class="top"> - <img - v-if="userInfo" - :src="`data:image/png;base64,${userInfo.headpic}`" - alt="" - /> + <img v-if="userInfo" :src="`data:image/png;base64,${userInfo.headpic}`" alt="" /> <span class="username">{{ userInfo && userInfo.username }}</span> </div> <div class="link-list"> - <div - class="list-item" - v-for="(x, i) in linkList" - :key="i" - @click="clickFastPath(x.name)" - > + <div class="list-item" v-for="(x, i) in linkList" :key="i" @click="clickFastPath(x.name)"> {{ x.name }} </div> </div> @@ -51,11 +31,7 @@ </div> </div> <div class="tools-icon no-hover-style"> - <img - class="smart-ai" - :src="`${publicPath}images/desktop/header-icon/SmartAI-鏂�.png`" - alt - /> + <img class="smart-ai" :src="`${publicPath}images/desktop/header-icon/SmartAI-鏂�.png`" alt /> </div> </div> <div class="tools-middle"> @@ -67,11 +43,7 @@ > <a @click="dockClick(dock)"> <img class="dock-item" :src="dock.src" :alt="dock.alt" /> - <img - class="dock-shot" - :src="dock.screenshot" - v-if="dock.screenshot" - /> + <img class="dock-shot" :src="dock.screenshot" v-if="dock.screenshot" /> <!-- <iframe class="dock-shot" :src="dock.url" ></iframe> --> </a> </div> @@ -80,7 +52,7 @@ <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"> + <div class="tools-icon my-tools-icon" @click.stop="toggleShowWifi" v-show="wifiList.length"> <span class="icon iconfont"></span> </div> <div class="tools-icon"> @@ -95,22 +67,15 @@ <div class="tools-icon"> <el-dropdown size="small" placement="bottom"> <span class="el-dropdown-link"> - <img - :src="`${publicPath}images/desktop/header-icon/user.png`" - alt - /> + <img :src="`${publicPath}images/desktop/header-icon/user.png`" alt /> <!-- <i class="el-icon-arrow-down el-icon--right"></i> --> </span> <el-dropdown-menu slot="dropdown" style="top: 44px"> <el-dropdown-item style="text-align: left"> <b>Hi {{ userInfo && userInfo.username }}</b> </el-dropdown-item> - <el-dropdown-item @click.native="showPasswdForm = true" - >淇敼瀵嗙爜</el-dropdown-item - > - <el-dropdown-item @click.native="toLogout" - >閫�鍑虹櫥褰�</el-dropdown-item - > + <el-dropdown-item @click.native="showPasswdForm = true">淇敼瀵嗙爜</el-dropdown-item> + <el-dropdown-item @click.native="toLogout">閫�鍑虹櫥褰�</el-dropdown-item> </el-dropdown-menu> </el-dropdown> </div> @@ -122,44 +87,20 @@ width="500px" @close="cancelPasswordChange" > - <el-form - :model="passwdForm" - ref="ruleForm" - :rules="rules" - label-width="90px" - > + <el-form :model="passwdForm" ref="ruleForm" :rules="rules" label-width="90px"> <el-form-item label="鏃у瘑鐮�" prop="oldPwd"> - <el-input - show-password - v-model="passwdForm.oldPwd" - autocomplete="off" - size="small" - ></el-input> + <el-input show-password v-model="passwdForm.oldPwd" autocomplete="off" size="small"></el-input> </el-form-item> <el-form-item label="鏂板瘑鐮�" prop="newPwd"> - <el-input - show-password - v-model="passwdForm.newPwd" - autocomplete="off" - size="small" - ></el-input> + <el-input show-password v-model="passwdForm.newPwd" autocomplete="off" size="small"></el-input> </el-form-item> <el-form-item label="纭瀵嗙爜" prop="checkPwd"> - <el-input - show-password - v-model="passwdForm.checkPwd" - autocomplete="off" - size="small" - ></el-input> + <el-input show-password v-model="passwdForm.checkPwd" autocomplete="off" size="small"></el-input> </el-form-item> </el-form> <div slot="footer" class="dialog-footer"> - <el-button type="info" size="small" @click="cancelPasswordChange" - >鍙� 娑�</el-button - > - <el-button type="primary" @click="submitForm('ruleForm')" size="small" - >纭� 瀹�</el-button - > + <el-button type="info" size="small" @click="cancelPasswordChange">鍙� 娑�</el-button> + <el-button type="primary" @click="submitForm('ruleForm')" size="small">纭� 瀹�</el-button> </div> </el-dialog> @@ -168,24 +109,14 @@ <div class="remind-title">绯荤粺鏇存柊鎻愰啋</div> <div class="remind-content"> - 宸插仛濂�<b>绯荤粺鏇存柊</b>鐨勫噯澶囷紝<span style="color: red" - >鏇存柊棰勮闇�瑕佷竴瀹氱殑鏃堕棿</span + 宸插仛濂�<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" - > + <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> @@ -196,34 +127,21 @@ <div class="remind-title">绠楁硶/搴旂敤鏇存柊鎻愰啋</div> <div class="remind-content"> - 鍙戠幇 <b>绠楁硶/搴旂敤 </b>鏇存柊锛�<span style="color: red" - >璇峰墠寰�鏌ョ湅鏇存柊</span + 鍙戠幇 <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 - > + <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="wifi-pop" :class="showWifiList ? '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> + <el-switch v-model="isOpenWifi" active-color="rgba(61, 104, 225, 1)"> </el-switch> </div> <div class="wifi-list"> @@ -253,7 +171,7 @@ </template> <script> -import { logout, updatePwd } from "@/api/login"; +import { logout, updatePwd } from "@/api/login" import { getUpgradeNotice, @@ -261,29 +179,30 @@ getAppUpgradeNotice, upgradeNewVersion, delayAppNotice, -} from "@/api/system"; + getWifi +} from "@/api/system" export default { name: "Tools", data() { var validatePass = (rule, value, callback) => { if (value === "") { - callback(new Error("璇疯緭鍏ュ瘑鐮�")); + callback(new Error("璇疯緭鍏ュ瘑鐮�")) } else { if (this.passwdForm.checkPwd !== "") { - this.$refs.ruleForm.validateField("checkPwd"); + this.$refs.ruleForm.validateField("checkPwd") } - callback(); + callback() } - }; + } var validatePass2 = (rule, value, callback) => { if (value === "") { - callback(new Error("璇峰啀娆¤緭鍏ュ瘑鐮�")); + callback(new Error("璇峰啀娆¤緭鍏ュ瘑鐮�")) } else if (value !== this.passwdForm.newPwd) { - callback(new Error("涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!")); + callback(new Error("涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!")) } else { - callback(); + callback() } - }; + } return { publicPath: process.env.BASE_URL, notificationCenterVisible: false, @@ -293,21 +212,15 @@ 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 }, + { name: "缃戠粶3", connected: true, showBottom: false, checked: false } ], - linkList: [ - { name: "鏂囨。涓績" }, - { name: "绯荤粺鐩戞帶鍣�" }, - { name: "鏃ュ織绠$悊" }, - ], + linkList: [{ name: "鏂囨。涓績" }, { name: "绯荤粺鐩戞帶鍣�" }, { name: "鏃ュ織绠$悊" }], showPasswdForm: false, - showWifi: false, + showWifiList: false, rules: { oldPwd: [{ required: true, message: "璇疯緭鍏ユ棫瀵嗙爜", trigger: "blur" }], newPwd: [{ required: true, validator: validatePass, trigger: "blur" }], - checkPwd: [ - { required: true, validator: validatePass2, trigger: "blur" }, - ], + checkPwd: [{ required: true, validator: validatePass2, trigger: "blur" }] }, showFastPath: false, showSysRemind: false, @@ -320,243 +233,238 @@ passwdForm: { oldPwd: "", newPwd: "", - checkPwd: "", - }, - }; + checkPwd: "" + } + } }, created() { - let _that = this; - this.userInfo = - sessionStorage.getItem("userInfo") && - JSON.parse(sessionStorage.getItem("userInfo")); + let _that = this + this.userInfo = sessionStorage.getItem("userInfo") && JSON.parse(sessionStorage.getItem("userInfo")) if (window.toolIntervalArr) { - window.toolIntervalArr.forEach((item) => clearInterval(item)); + window.toolIntervalArr.forEach((item) => clearInterval(item)) } window.toolIntervalArr = [ - setInterval(function () { - _that.notificationCenterMessageCount += 1; - }, 600), - ]; + setInterval(function() { + _that.notificationCenterMessageCount += 1 + }, 600) + ] }, beforeDestroy() { - clearTimeout(this.sysTimer); - this.sysTimer = null; + clearTimeout(this.sysTimer) + this.sysTimer = null }, mounted() { document.addEventListener("click", (e) => { - if (this.showFastPath || this.showWifi) { - this.showFastPath = false; - this.showWifi = false; + if (this.showFastPath || this.showWifiList) { + this.showFastPath = false + this.showWifiList = false } - }); - this.askSysUpdate(); - this.askAppUpdate(); + }) + this.askSysUpdate() + this.askAppUpdate() + this.askWifiConfig() }, methods: { + askWifiConfig() { + getWifi().then((res) => { + this.wifiList = [] + if (res && res.data) { + this.wifiList = res.data + } + }) + }, askAppUpdate() { getAppUpgradeNotice().then((res) => { if (res.code == 200) { if (res.data.NeedUpdate && res.data.NoticeStatus) { if (res.data.LastNoticeTime == 0) { - this.showAppRemind = true; + this.showAppRemind = true } else { - this.appTimeout = res.data.LastNoticeTime * 1000; - this.delayAppAsk(); + 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; + x.showBottom = false + }) + x.showBottom = !x.showBottom + this.activeWifi = i }, goToUpdate() { - this.showAppRemind = false; - window.parent.postMessage({ msg: `toAI?activeName=鏇存柊` }, "*"); + this.showAppRemind = false + window.parent.postMessage({ msg: `toAI?activeName=鏇存柊` }, "*") }, goToWireSet() { - window.parent.postMessage( - { msg: `toSetting?menu=缃戠粶璁剧疆&subMenu=鏈夌嚎缃戠粶` }, - "*" - ); + window.parent.postMessage({ msg: `toSetting?menu=缃戠粶璁剧疆&subMenu=鏈夌嚎缃戠粶` }, "*") }, updateSysNow() { - window.parent.postMessage({ msg: `toVindicate?autoUpdate=1` }, "*"); + window.parent.postMessage({ msg: `toVindicate?autoUpdate=1` }, "*") }, delaySysRemind(sec) { delayUpgradeNotice({ - delaySecond: sec, + delaySecond: sec }).then((res) => { if (res.code == 200) { - this.$notify.success("璁剧疆鎴愬姛"); - this.showSysRemind = false; - this.sysTimeout = res.data.LastNoticeTime * 1000; - this.delaySysAsk(); + this.$notify.success("璁剧疆鎴愬姛") + this.showSysRemind = false + this.sysTimeout = res.data.LastNoticeTime * 1000 + this.delaySysAsk() } - }); + }) }, delayAppRemind(sec) { delayAppNotice({ - delay: sec, + delay: sec }).then((res) => { if (res.code == 200) { - this.$notify.success("璁剧疆鎴愬姛"); - this.showAppRemind = false; - this.appTimeout = res.data.LastNoticeTime * 1000; - this.delayAppAsk(); + this.$notify.success("璁剧疆鎴愬姛") + this.showAppRemind = false + this.appTimeout = res.data.LastNoticeTime * 1000 + this.delayAppAsk() } - }); + }) }, delaySysAsk() { this.sysTimer = setTimeout(() => { - this.askSysUpdate(); - }, this.sysTimeout); + this.askSysUpdate() + }, this.sysTimeout) }, delayAppAsk() { this.appTimer = setTimeout(() => { - this.askAppUpdate(); - }, this.appTimeout); + this.askAppUpdate() + }, this.appTimeout) }, askSysUpdate() { getUpgradeNotice().then((res) => { if (res.data.HaveNewVersion > 0 && res.data.NoticeStatus) { if (res.data.LastNoticeTime == 0) { - this.showSysRemind = true; + this.showSysRemind = true } else { - this.sysTimeout = res.data.LastNoticeTime * 1000; - this.delaySysAsk(); + this.sysTimeout = res.data.LastNoticeTime * 1000 + this.delaySysAsk() } } - }); + }) }, toggleShowWifi() { - this.notificationCenterVisible = false; - this.showWifi = !this.showWifi; - this.$store.commit( - "desktop/changeNotificationCenterVisible", - this.notificationCenterVisible - ); + this.notificationCenterVisible = false + this.showWifiList = !this.showWifiList + this.$store.commit("desktop/changeNotificationCenterVisible", this.notificationCenterVisible) }, submitForm(formName) { this.$refs[formName].validate((valid) => { if (valid) { let json = { oldPwd: this.passwdForm.oldPwd, - newPwd: this.passwdForm.checkPwd, - }; + newPwd: this.passwdForm.checkPwd + } updatePwd(json) .then((res) => { this.$notify({ type: res.success ? "success" : "error", - message: res.msg, - }); + message: res.msg + }) if (res.success) { - this.cancelPasswordChange(); + this.cancelPasswordChange() } }) .catch((err) => { this.$notify({ type: "error", - message: err.msg, - }); - }); + message: err.msg + }) + }) } else { - console.log("error submit!!"); - return false; + console.log("error submit!!") + return false } - }); + }) }, - notificationCenterClick: function () { - this.notificationCenterVisible = !this.notificationCenterVisible; - this.$store.commit( - "desktop/changeNotificationCenterVisible", - this.notificationCenterVisible - ); + notificationCenterClick: function() { + this.notificationCenterVisible = !this.notificationCenterVisible + this.$store.commit("desktop/changeNotificationCenterVisible", this.notificationCenterVisible) }, - notificationCenterNoMessage: function () { - return this.$store.state.desktop.messageNotices.length === 0; + notificationCenterNoMessage: function() { + return this.$store.state.desktop.messageNotices.length === 0 }, - notificationCenterMessageFlicker: function () { - return ( - this.notificationCenterMessageCount % 2 === 0 && - !this.notificationCenterNoMessage() - ); + notificationCenterMessageFlicker: function() { + return this.notificationCenterMessageCount % 2 === 0 && !this.notificationCenterNoMessage() }, togglePreference() { - this.showFastPath = !this.showFastPath; + this.showFastPath = !this.showFastPath this.$store.state.desktop.frames.forEach((frame) => { this.$store.commit("desktop/addMinDock", { id: frame.id, src: frame.icon, alt: frame.title, type: "3", - screenshot: "", - }); - }); + screenshot: "" + }) + }) }, dockClick(dock) { if (dock.type === "1") { - window.open(dock.url); + window.open(dock.url) } else if (dock.type === "2") { this.$store.dispatch("desktop/addFrame", { id: dock.id, icon: dock.src, title: dock.name, - url: dock.url, - }); + url: dock.url + }) } else if (dock.type === "3") { - this.$store.commit("desktop/resetMinFrame", dock.id); + this.$store.commit("desktop/resetMinFrame", dock.id) //鐐瑰嚮鐨刬frame缃《骞堕珮浜� - this.$store.commit("desktop/refreshFrame", dock); + this.$store.commit("desktop/refreshFrame", dock) } }, clickFastPath(name) { - this.$emit("jumpToDock", name); + this.$emit("jumpToDock", name) }, toLogout() { - let _this = this; + let _this = this this.$confirm("纭畾閫�鍑虹櫥褰曞悧锛�", "鎻愮ず", { type: "warning", cancelButtonClass: "comfirm-class-cancle", - confirmButtonClass: "comfirm-class-sure", + confirmButtonClass: "comfirm-class-sure" }) .then((_) => { logout().then((res) => { if (res.success) { - this.$notify.success(res.msg); - location.assign("/view/index"); - sessionStorage.removeItem("userInfo"); + this.$notify.success(res.msg) + location.assign("/view/index") + sessionStorage.removeItem("userInfo") // 鎵嬪姩閫�鍑�, 鍙栨秷鑷姩鐧诲綍 - sessionStorage.removeItem("autoLogin"); - _this.userInfo = {}; + sessionStorage.removeItem("autoLogin") + _this.userInfo = {} } else { this.$notify({ title: "鎻愮ず", type: "success", - message: "閫�鍑哄け璐�!", - }); + message: "閫�鍑哄け璐�!" + }) } - }); + }) }) .catch((_) => { - console.log("閫�鍑哄け璐�"); - }); + console.log("閫�鍑哄け璐�") + }) }, cancelPasswordChange() { - this.showPasswdForm = false; + this.showPasswdForm = false this.passwdForm = { oldPwd: "", newPwd: "", - checkPwd: "", - }; - }, - }, -}; + checkPwd: "" + } + } + } +} </script> <style scoped lang="scss"> @@ -865,4 +773,4 @@ .el-dropdown-menu { top: 40px !important; } -</style> \ No newline at end of file +</style> -- Gitblit v1.8.0