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">&#xe6dd;</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">&#xe6e5;</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