| | |
| | | <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)" |
| | |
| | | <span class="user-name">{{ item.username }}</span> |
| | | </div> |
| | | </div> |
| | | <div class="add-account"> |
| | | <div class="add-account" > |
| | | <span class="icon iconfont" @click="showAddAccount"></span> |
| | | </div> |
| | | </div> |
| | |
| | | |
| | | <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> |
| | |
| | | ></span |
| | | > |
| | | </div> |
| | | <div class="user-role">{{activeAccountItem.sysRoles.length?activeAccountItem.sysRoles[0].name:""}}</div> |
| | | </div> |
| | | </div> |
| | | <div class="list-btn"> |
| | |
| | | <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> |
| | | |
| | |
| | | addUser, |
| | | getUsers, |
| | | updateUser, |
| | | updataUser, |
| | | updatePassword, |
| | | deleteUser, |
| | | getUserMenus, |
| | |
| | | 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(); |
| | | }, |
| | | methods: { |
| | | fetchUserList() { |
| | |
| | | openAccount(item, i) { |
| | | this.activeAccountItem = item; |
| | | this.activeAccountIndex = i; |
| | | this.inAccountDetail = false; |
| | | }, |
| | | minusOne(typ) { |
| | | this.isSyncBrowser = false; |
| | |
| | | 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; |
| | |
| | | if (num > maxDay) { |
| | | num = 1; |
| | | } |
| | | // |
| | | this.syncDay = this.padZero(num); |
| | | break; |
| | | default: |
| | |
| | | } |
| | | }, |
| | | submitClock() { |
| | | debugger; |
| | | if (this.syncType === "1") { |
| | | if (this.ntpServer === "") { |
| | | if (this.ntpServer === ""||this.ntpServer === "...") { |
| | | this.$notify({ |
| | | type: "error", |
| | | message: "NTP 服务器地址不能为空", |
| | |
| | | } 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", |
| | |
| | | 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]); |
| | |
| | | n = +n; |
| | | return n < 10 ? "0" + n : "" + n; |
| | | }, |
| | | //数据转化 |
| | | formatNumber(n) { |
| | | n = n.toString(); |
| | | return n[1] ? n : "0" + n; |
| | |
| | | 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; |
| | |
| | | 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; |
| | |
| | | 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(() => { |
| | |
| | | this.isChangePw = false; |
| | | this.inAccountDetail = false; |
| | | }, |
| | | fetchSysMenus() { |
| | | getSysMenus().then((rsp) => { |
| | | if (rsp && rsp.success) { |
| | | this.sysMenus = rsp.data; |
| | | console.log(this.sysMenus); |
| | | } |
| | | }); |
| | | }, |
| | | |
| | | saveAddAccount(formName) { |
| | | this.$refs[formName].validate((valid) => { |
| | | if (valid) { |
| | |
| | | cancelButtonText: "取消", |
| | | }) |
| | | .then(() => { |
| | | debugger; |
| | | deleteUser({ |
| | | ids: [this.activeAccountItem.id], |
| | | }).then((res) => { |
| | |
| | | }) |
| | | .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 |
| | | // }) |
| | | // } |
| | | // }) |
| | | }, |
| | | }, |
| | | 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( |
| | | ":" |
| | | ); |
| | | 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]; |
| | | } |
| | | }, |
| | | isNtp(v) { |
| | | this.isManual = !v; |
| | | v && (this.syncType = "1"); |
| | | this.syncType = this.isNtp ? "1" : "2"; |
| | | if (this.isManual) this.parseTime() |
| | | }, |
| | | }, |
| | | computed: { |
| | | isShowAddAccount(){ |
| | | const info = JSON.parse(sessionStorage.getItem('userInfo')) |
| | | return true |
| | | } |
| | | }, |
| | | // watch: { |
| | | // isManual(v) { |
| | | // this.isNtp = !v; |
| | | // v && (this.syncType = "2"); |
| | | // if (v) { |
| | | |
| | | // } |
| | | // }, |
| | | // isNtp(v) { |
| | | // this.isManual = !v; |
| | | // v && (this.syncType = "1"); |
| | | // }, |
| | | // }, |
| | | }; |
| | | </script> |
| | | <style lang="scss"> |
| | |
| | | .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); |
| | |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .user-role{ |
| | | margin: 5px 0 0 15px; |
| | | font-size: 14px; |
| | | } |
| | | } |
| | | } |
| | | .list-btn { |