From 85da22c4861736f7b0cabbc75daecbe4fea1bf80 Mon Sep 17 00:00:00 2001
From: heyujie <516346543@qq.com>
Date: 星期日, 04 七月 2021 21:01:12 +0800
Subject: [PATCH] 周天更改

---
 src/pages/systemSettings/index/App.vue |  351 ++++++++++++++++++++++++++++++++++++----------------------
 1 files changed, 217 insertions(+), 134 deletions(-)

diff --git a/src/pages/systemSettings/index/App.vue b/src/pages/systemSettings/index/App.vue
index c477954..e5988b4 100644
--- a/src/pages/systemSettings/index/App.vue
+++ b/src/pages/systemSettings/index/App.vue
@@ -3,6 +3,7 @@
     <div class="container-left">
       <div
         class="left-card"
+        :class="activeIndex == index ? 'left-card-active' : ''"
         v-for="(item, index) in menuArr"
         :key="index"
         @click="openMenu(item, index)"
@@ -27,7 +28,15 @@
             @click="openAccount(item, index)"
           >
             <div class="touxiang">
-              <img :src="item.headpic" alt="" />
+              <img
+                v-if="item.headpic"
+                :src="
+                  item.headpic.indexOf('http') > -1
+                    ? item.headpic
+                    : 'http://' + item.headpic
+                "
+                alt=""
+              />
             </div>
             <span class="user-name">{{ item.username }}</span>
           </div>
@@ -51,13 +60,21 @@
 
         <div class="line">
           <div class="name">NTP鏍℃椂</div>
-          <el-switch v-model="isNtp" active-color="rgba(61, 104, 225, 1)">
+          <el-switch
+            v-model="isNtp"
+            @change="changeSwitch('isNtp')"
+            active-color="rgba(61, 104, 225, 1)"
+          >
           </el-switch>
         </div>
 
         <div class="line">
           <div class="name">鎵嬪姩鏍″</div>
-          <el-switch v-model="isManual" active-color="rgba(61, 104, 225, 1)">
+          <el-switch
+            v-model="isManual"
+            @change="changeSwitch('isManual')"
+            active-color="rgba(61, 104, 225, 1)"
+          >
           </el-switch>
         </div>
       </div>
@@ -73,7 +90,15 @@
         >
           <div class="content-top">
             <div class="touxiang-big">
-              <img :src="activeAccountItem.headpic" alt="" />
+              <img
+                v-if="activeAccountItem.headpic"
+                :src="
+                  activeAccountItem.headpic.indexOf('http') > -1
+                    ? activeAccountItem.headpic
+                    : 'http://' + activeAccountItem.headpic
+                "
+                alt=""
+              />
             </div>
             <div class="user-desc">
               <div class="username">
@@ -99,6 +124,13 @@
                 <span class="icon iconfont" @click="editNickName"
                   >&#xe60c;</span
                 >
+              </div>
+              <div class="user-role">
+                {{
+                  activeAccountItem.sysRoles.length
+                    ? activeAccountItem.sysRoles[0].name
+                    : ""
+                }}
               </div>
             </div>
           </div>
@@ -146,7 +178,7 @@
           </el-form>
           <div class="btns">
             <div class="cancel" @click="cancelChangePassword">鍙栨秷</div>
-            <div class="ok">淇濆瓨</div>
+            <div class="ok" @click="SaveNewPassword('passwordForm')">淇濆瓨</div>
           </div>
         </div>
 
@@ -159,23 +191,30 @@
               <el-switch
                 v-model="item.selected"
                 active-color="rgba(61, 104, 225, 1)"
+                @change="fatherChange(item)"
               >
               </el-switch>
             </div>
             <div v-if="item.children">
-                <div class="line" style="margin-left:55px;" v-for="x in item.children" :key="x.id">
-                  <div class="name">{{ x.name }}</div>
-                  <el-switch
-                    v-model="x.selected"
-                    active-color="rgba(61, 104, 225, 1)"
-                  >
-                  </el-switch>
-                </div>
+              <div
+                class="line"
+                style="margin-left: 55px"
+                v-for="x in item.children"
+                :key="x.id"
+              >
+                <div class="name">{{ x.name }}</div>
+                <el-switch
+                  v-model="x.selected"
+                  active-color="rgba(61, 104, 225, 1)"
+                  @change="childrenChange(item)"
+                >
+                </el-switch>
               </div>
+            </div>
           </div>
           <div class="btns">
             <div class="cancel" @click="cancelSet">鍙栨秷</div>
-            <div class="ok">淇濆瓨</div>
+            <div class="ok" @click="saveAuth">淇濆瓨</div>
           </div>
         </div>
 
@@ -184,9 +223,15 @@
           <div class="upload-group">
             <div
               class="upload-jpg"
-              v-for="(item, index) in jpgArr"
+              :class="
+                selectedPic == index && url !== '' ? 'upload-jpg-mask' : ''
+              "
+              v-for="(url, index) in jpgArr"
               :key="index"
-            ></div>
+              @click="pickHeadDefPic(url, index)"
+            >
+              <img v-if="url !== ''" :src="url" alt="" srcset="" />
+            </div>
 
             <el-upload
               class="upload-demo"
@@ -448,10 +493,11 @@
   addUser,
   getUsers,
   updateUser,
+  updataUser,
   updatePassword,
   deleteUser,
   getUserMenus,
-  getSysMenus,
+  defHeadPics,
 } from "@/api/user";
 import switchBar from "../components/switchBar";
 import ipInput from "@/components/subComponents/IPInput";
@@ -470,16 +516,6 @@
     generalSettings,
   },
   data() {
-    var validatePass = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("璇疯緭鍏ュ瘑鐮�"));
-      } else {
-        if (this.addForm.checkPass !== "") {
-          this.$refs.addForm.validateField("checkPassword");
-        }
-        callback();
-      }
-    };
     var validatePass2 = (rule, value, callback) => {
       if (value === "") {
         callback(new Error("璇峰啀娆¤緭鍏ュ瘑鐮�"));
@@ -489,30 +525,10 @@
         callback();
       }
     };
-    var validatePass3 = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("璇疯緭鍏ュ瘑鐮�"));
-      } else {
-        if (this.passwordForm.password !== "") {
-          this.$refs.passwordForm.validateField("pw");
-        }
-        callback();
-      }
-    };
-    var validatePass5 = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error("璇疯緭鍏ュ瘑鐮�"));
-      } else {
-        if (this.passwordForm.newPassword !== "") {
-          this.$refs.passwordForm.validateField("newPw");
-        }
-        callback();
-      }
-    };
     var validatePass4 = (rule, value, callback) => {
       if (value === "") {
         callback(new Error("璇峰啀娆¤緭鍏ュ瘑鐮�"));
-      } else if (value !== this.passwordForm.confirmPassword) {
+      } else if (value !== this.passwordForm.newPassword) {
         callback(new Error("涓ゆ杈撳叆瀵嗙爜涓嶄竴鑷�!"));
       } else {
         callback();
@@ -541,6 +557,7 @@
       showSecInput: false,
       showYrsInput: false,
       showMonthInput: false,
+      selectedPic: null,
       showDayInput: false,
       cameraInfo: false,
       dependentScene: false,
@@ -565,7 +582,7 @@
         { name: "閫氱敤璁剧疆" },
       ],
       accountArr: [],
-      jpgArr: [{}, {}, {}, {}, {}, {}, {}, {}, {}],
+      jpgArr: ["", "", "", "", "", "", "", "", ""],
       isManual: false,
       isNtp: true,
       activePage: "璐︽埛",
@@ -602,13 +619,23 @@
             trigger: "blur",
           },
         ],
-        password: [{ validator: validatePass, trigger: "blur" }],
+        password: [
+            { required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' },
+            { min: 6, message: '闀垮害鑷冲皯涓� 6 浣�', trigger: 'blur' }
+          ],
         confirmPassword: [{ validator: validatePass2, trigger: "blur" }],
       },
       pwRules: {
-        pw: [{ validator: validatePass3, trigger: "blur" }],
-        newPw: [{ validator: validatePass5, trigger: "blur" }],
-        confirmNewPw: [{ validator: validatePass4, trigger: "blur" }],
+        // pw: [{ validator: validatePass3, trigger: "blur" }],
+         curPassword: [
+            { required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' },
+            { min: 6, message: '闀垮害鑷冲皯涓� 6 浣�', trigger: 'blur' }
+          ],
+        newPassword: [
+            { required: true, message: '璇疯緭鍏ュ瘑鐮�', trigger: 'blur' },
+            { min: 6, message: '闀垮害鑷冲皯涓� 6 浣�', trigger: 'blur' }
+          ],
+        confirmPassword: [{ validator: validatePass4, trigger: "blur" }],
       },
     };
   },
@@ -617,22 +644,28 @@
     clearInterval(this.browserTimer);
   },
   mounted() {
-    // const s = document.getElementsByClassName("left-card")[0];
-    // s.style.backgroundColor = "rgba(61, 104, 225, 1)";
-    // s.style.color = "#fff";
-    this.$nextTick(() => {
-      this.initClockConf();
-    });
-
     this.fetchUserList();
-    this.fetchSysMenus();
+    this.fetchDefHeadPic();
   },
   methods: {
-    fetchUserList() {
+    fetchDefHeadPic() {
+      defHeadPics().then((res) => {
+        res.data.slice(0, 5).forEach((x, i) => {
+          this.jpgArr[i] = x;
+        });
+      });
+    },
+    fetchUserList(showLast = false) {
       getUsers().then((res) => {
         this.accountArr = res.data;
         if (this.accountArr.length) {
           this.activeAccountItem = this.accountArr[0];
+        }
+        if (showLast) {
+          this.cancelAdd();
+          const lastIdx = this.accountArr.length - 1;
+          this.openAccount(this.accountArr[lastIdx], lastIdx);
+          
         }
       });
     },
@@ -651,12 +684,13 @@
         nickname: this.inputNickName,
       }).then((res) => {
         this.$message.success(res.msg);
-        this.fetchUserList();
+        this.fetchUserList(true);
       });
     },
     openAccount(item, i) {
       this.activeAccountItem = item;
       this.activeAccountIndex = i;
+      this.inAccountDetail = false;
     },
     minusOne(typ) {
       this.isSyncBrowser = false;
@@ -713,11 +747,20 @@
           break;
       }
     },
+    fatherChange(item) {
+      item.children.forEach((x) => {
+        x.selected = false;
+      });
+    },
+    childrenChange(item) {
+      let isAllSelected = item.children.every((x) => x.selected == true);
+      let isAllNotSelected = item.children.every((x) => x.selected == false);
+      if (isAllSelected) item.selected = true;
+      if (isAllNotSelected) item.selected = false;
+    },
     getMaxDay() {
       const maxDay = new Date(+this.syncYrs, +this.syncMonth, 0).getDate();
-      if (this.syncDay > maxDay) {
-        this.syncDay = maxDay;
-      }
+      if (this.syncDay > maxDay) this.syncDay = maxDay;
     },
     plusOne(typ) {
       this.isSyncBrowser = false;
@@ -762,7 +805,6 @@
           if (num > maxDay) {
             num = 1;
           }
-          //
           this.syncDay = this.padZero(num);
           break;
         default:
@@ -770,9 +812,8 @@
       }
     },
     submitClock() {
-      debugger;
       if (this.syncType === "1") {
-        if (this.ntpServer === "") {
+        if (this.ntpServer === "" || this.ntpServer === "...") {
           this.$notify({
             type: "error",
             message: "NTP 鏈嶅姟鍣ㄥ湴鍧�涓嶈兘涓虹┖",
@@ -792,14 +833,13 @@
       } else {
         this.settime = `${this.syncYrs}-${this.syncMonth}-${this.syncDay} ${this.syncHour}:${this.syncMin}:${this.syncSec}`;
       }
-      let requestBody = {
+      saveClockInfo({
         timeZone: this.timezone,
         ntp: this.syncType === "1",
         ntpServer: this.ntpServer,
         interval: this.timeInterval,
         newTime: this.settime,
-      };
-      saveClockInfo(requestBody).then((rsp) => {
+      }).then((rsp) => {
         if (rsp && rsp.success) {
           this.$notify({
             type: "success",
@@ -809,19 +849,32 @@
         this.initClockConf();
       });
     },
+    flatGetArr(arr, res) {
+      for (const item of arr) {
+        if (item.selected) res.push(item.id);
+        if (item.children) this.flatGetArr(item.children, res);
+      }
+    },
+    saveAuth() {
+      let arr = [];
+      this.flatGetArr(this.sysMenus, arr);
+      updataUser({
+        id: this.activeAccountItem.id,
+        menuIds: arr,
+      }).then((res) => {
+        res.data;
+      });
+    },
     formatTime(number, format) {
       var formateArr = ["Y", "M", "D", "h", "m", "s"];
       var returnArr = [];
-
       var date = new Date(number * 1000);
       returnArr.push(date.getFullYear());
       returnArr.push(this.formatNumber(date.getMonth() + 1));
       returnArr.push(this.formatNumber(date.getDate()));
-
       returnArr.push(this.formatNumber(date.getHours()));
       returnArr.push(this.formatNumber(date.getMinutes()));
       returnArr.push(this.formatNumber(date.getSeconds()));
-
       this.weekday = "鏄熸湡" + "鏃ヤ竴浜屼笁鍥涗簲鍏�".charAt(date.getDay());
       for (var i in returnArr) {
         format = format.replace(formateArr[i], returnArr[i]);
@@ -832,7 +885,6 @@
       n = +n;
       return n < 10 ? "0" + n : "" + n;
     },
-    //鏁版嵁杞寲
     formatNumber(n) {
       n = n.toString();
       return n[1] ? n : "0" + n;
@@ -841,7 +893,8 @@
       let param = new FormData();
       param.append("file", params.file);
       uploadHeadPic(param).then((res) => {
-        this.addForm.headpic = res.data;
+        let index = this.jpgArr.findIndex((x) => x == "");
+        this.$set(this.jpgArr, index, res.data);
       });
     },
     initClockConf(ntpTest = false) {
@@ -850,6 +903,8 @@
           this.timezone = rsp.data.time_zone;
           if (!ntpTest) {
             this.syncType = rsp.data.ntp ? "1" : "2";
+            this.isNtp = rsp.data.ntp;
+            this.isManual = !rsp.data.ntp;
           }
           if (rsp.data.ntp) {
             this.ntpServer = rsp.data.ntp_server;
@@ -858,22 +913,17 @@
           this.timestamp = rsp.data.local_time;
           if (this.clockTimer === null) {
             this.runClock();
+            if (this.isManual) this.parseTime();
           }
         }
       });
     },
     openMenu(item, i) {
-      const old = document.getElementsByClassName("left-card")[
-        this.activeIndex
-      ];
-      old.style.backgroundColor = "initial";
-      old.style.color = "rgba(81, 81, 81, 1)";
-
       this.activePage = item.name;
       this.activeIndex = i;
-      const s = document.getElementsByClassName("left-card")[i];
-      s.style.backgroundColor = "rgba(61, 104, 225, 1)";
-      s.style.color = "#fff";
+      if (this.activePage == "鏃ユ湡鏃堕棿") {
+        this.initClockConf();
+      }
     },
     showInput(typ) {
       this[`show${typ}Input`] = true;
@@ -888,9 +938,9 @@
       this[`show${typ}Input`] = false;
       this[`input${typ}`] = "";
     },
-    syncBrowser(val) {
+    syncBrowser(enable) {
       this.isSyncBrowser = val;
-      if (val == false) {
+      if (!enable) {
         clearInterval(this.browserTimer);
       } else {
         this.browserTimer = setInterval(() => {
@@ -913,12 +963,22 @@
     cancelChangePassword() {
       this.isChangePw = false;
       this.inAccountDetail = false;
+      this.$refs['passwordForm'].resetFields()
     },
-    fetchSysMenus() {
-      getSysMenus().then((rsp) => {
-        if (rsp && rsp.success) {
-          this.sysMenus = rsp.data;
-          console.log(this.sysMenus);
+    SaveNewPassword(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          updatePassword({
+            oldPwd: this.passwordForm.curPassword,
+            newPwd: this.passwordForm.newPassword,
+          }).then(
+            (res) => {
+              this.$message.success(res.data);
+            },
+            (err) => {
+              this.$message.warning("淇濆瓨澶辫触锛�" + err.msg);
+            }
+          );
         }
       });
     },
@@ -934,6 +994,7 @@
           addUser(data).then(
             (res) => {
               this.$message.success(res.data);
+              this.fetchUserList(true);
             },
             (err) => {
               this.$message.warning("淇濆瓨澶辫触锛�" + err.msg);
@@ -944,6 +1005,10 @@
           return false;
         }
       });
+    },
+    pickHeadDefPic(url, i) {
+      this.addForm.headpic = url;
+      this.selectedPic = i;
     },
     testNTP() {
       this.ntpTestLoading = true;
@@ -992,10 +1057,10 @@
         cancelButtonText: "鍙栨秷",
       })
         .then(() => {
-          debugger;
-          deleteUser({
+          let obj = {
             ids: [this.activeAccountItem.id],
-          }).then((res) => {
+          };
+          deleteUser(obj).then((res) => {
             if (res.success) {
               this.fetchUserList();
               this.$message({
@@ -1009,44 +1074,43 @@
         })
         .catch(() => {});
     },
-    openPermission() {
-      this.inAccountDetail = true;
-      this.isSetPermission = true;
+    fetchMenu() {
       getUserMenus({
         userId: this.activeAccountItem.id,
       }).then((res) => {
         if (res && res.success) {
-          res.data.menus.forEach(e => {
-            
-          });
+          this.sysMenus = res.data;
         }
       });
-
-      //  getUserMenus({ userId: row.id }).then(rsp => {
-      //   if (rsp && rsp.success) {
-      //     this.userMenus = rsp.data.menus.map(menu => {
-      //       return menu.id
-      //     })
-      //   }
-      // })
+    },
+    openPermission() {
+      this.inAccountDetail = true;
+      this.isSetPermission = true;
+      this.fetchMenu();
+    },
+    parseTime() {
+      debugger;
+      [this.syncYrs, this.syncMonth, this.syncDay] = this.equipmentDate.split(
+        "-"
+      );
+      [this.syncHour, this.syncMin, this.syncSec] = this.equipmentTime.split(
+        ":"
+      );
+    },
+    changeSwitch(str) {
+      if (str == "isNtp") {
+        this.isManual = !this[str];
+      } else {
+        this.isNtp = !this[str];
+      }
+      this.syncType = this.isNtp ? "1" : "2";
+      if (this.isManual) this.parseTime();
     },
   },
-  watch: {
-    isManual(v) {
-      this.isNtp = !v;
-      v && (this.syncType = "2");
-      if (v) {
-        [this.syncYrs, this.syncMonth, this.syncDay] = this.equipmentDate.split(
-          "-"
-        );
-        [this.syncHour, this.syncMin, this.syncSec] = this.equipmentTime.split(
-          ":"
-        );
-      }
-    },
-    isNtp(v) {
-      this.isManual = !v;
-      v && (this.syncType = "1");
+  computed: {
+    isShowAddAccount() {
+      const info = JSON.parse(sessionStorage.getItem("userInfo"));
+      return true;
     },
   },
 };
@@ -1083,6 +1147,10 @@
       .card-text {
         font-size: 16px;
       }
+    }
+    .left-card-active {
+      background-color: rgba(61, 104, 225, 1);
+      color: #fff;
     }
     .left-card:hover {
       background-color: rgba(61, 104, 225, 1);
@@ -1249,6 +1317,10 @@
                 cursor: pointer;
               }
             }
+            .user-role {
+              margin: 5px 0 0 15px;
+              font-size: 14px;
+            }
           }
         }
         .list-btn {
@@ -1328,22 +1400,31 @@
 
       .add-account-page {
         .upload-group {
-          height: 120px;
-          width: 350px;
+          height: 130px;
+          width: 360px;
           margin: 0 auto;
           overflow: hidden;
           .upload-jpg {
-            height: 50px;
-            width: 50px;
+            height: 46px;
+            width: 46px;
             float: left;
             margin: 0 10px;
-            background-color: antiquewhite;
             margin-bottom: 20px;
-            border-radius: 25px;
+            background-color: rgba(242, 242, 242, 1);
+            border: 3px solid transparent;
+            border-radius: 50%;
+            cursor: pointer;
+            img {
+              height: 46px;
+              width: 46px;
+            }
+          }
+          .upload-jpg-mask {
+            border: 3px solid blue;
           }
           .upload-jpg-up {
-            height: 50px;
-            width: 50px;
+            height: 52px;
+            width: 52px;
             float: left;
             display: flex;
             background-color: rgba(242, 242, 242, 1);
@@ -1355,6 +1436,8 @@
             font-size: 12px;
             cursor: pointer;
           }
+          .loaded-Pic {
+          }
         }
         .fill-group {
           .p-title {

--
Gitblit v1.8.0