heyujie
2021-07-30 4b43bfb3f6f499f480712dd29bef52275466afd6
src/pages/settings/index/index.vue
@@ -3,20 +3,17 @@
    <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.name, index)"
        :class="activeIndex == i ? 'left-card-active' : ''"
        v-for="(item, i) in menuArr"
        :key="i"
        @click="openMenu(item.name, i)"
      >
        <span class="icon iconfont">{{ item.icon }}</span>
        <span class="card-text">{{ item.name }}</span>
      </div>
    </div>
    <div
      class="container-center"
      v-if="activeIndex == 0 || activeIndex == 1"
    >
    <div class="container-center" v-if="activeIndex == 0 || activeIndex == 1">
      <div class="account-left" v-if="activeIndex == 0">
        <div class="account-list">
          <div
@@ -35,7 +32,7 @@
              />
              <span class="user-name">{{ item.username }}</span>
            </div>
            <el-tag size="mini" v-if="item.id == curUserID">我的</el-tag>
            <el-tag size="mini" v-if="item.id == curUserID">当前登录</el-tag>
          </div>
        </div>
        <div class="add-account" v-if="curUserRole != '普通用户'">
@@ -80,10 +77,7 @@
        </div>
      </div>
    </div>
    <div
      class="container-right"
      v-if="activeIndex == 0 || activeIndex == 1"
    >
    <div class="container-right" v-if="activeIndex == 0 || activeIndex == 1">
      <div class="account-right" v-if="activeIndex == 0">
        <div
          class="account-content"
@@ -363,11 +357,10 @@
        <div class="ntp-time" v-if="isNtp">
          <el-form label-width="160px">
            <el-form-item label="服务器地址">
              <!-- :disabled="syncType === '2'" -->
              <ip-input
              <ipInput
                :ip="ntpServer"
                @on-blur="ntpServer = arguments[0]"
              ></ip-input>
              ></ipInput>
            </el-form-item>
            <el-form-item label="校时时间间隔(分钟)">
@@ -500,7 +493,7 @@
                class="input-box"
                v-show="showMonthInput"
                ref="iptMonth"
                oninput="value=value.replace(/[^\d]/g,'');if(value.length>2)value=value.slice(0,2);if(+value>12)value='12'"
                @input="checkMonthInput"
                type="text"
                v-model="inputMonth"
                @blur="hideInput('Month')"
@@ -519,7 +512,7 @@
                class="input-box"
                v-show="showDayInput"
                ref="iptDay"
                oninput="value=value.replace(/[^\d]/g,'');if(value.length>2)value=value.slice(0,2);if(+value>31)value='31'"
                @input="checkDayInput"
                type="text"
                v-model="inputDay"
                @blur="hideInput('Day')"
@@ -532,7 +525,7 @@
        </div>
        <div class="btns">
          <div class="cancel" @click="cancelPassword">取消</div>
          <div class="cancel" @click="cancelSetTime">取消</div>
          <div class="ok" @click="submitClock">保存</div>
        </div>
      </div>
@@ -543,6 +536,7 @@
      style="width: 100%"
    ></clusterManagement>
    <netSettings
      ref="netSettings"
      v-if="activeIndex == 3"
      style="width: 100%"
    ></netSettings>
@@ -573,7 +567,6 @@
<script>
import { getClockInfo, saveClockInfo, testNTPserver } from "@/api/system";
import {
  uploadHeadPic,
  addUser,
  getUsers,
  updateUser,
@@ -590,7 +583,7 @@
import netSettings from "../views/NetSettings";
import keyboardLanguage from "../views/keyboardLanguage";
import generalSettings from "../views/generalSettings";
import { pad0 } from "@/api/utils";
import { pad0,getUrlKey } from "@/api/utils";
export default {
  name: "settings",
@@ -604,7 +597,6 @@
  },
  data() {
    var v2 = (rule, value, callback) => {
      console.log("rule", rule);
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.addForm.password) {
@@ -614,7 +606,6 @@
      }
    };
    var v4 = (rule, value, callback) => {
      console.log("rule", rule);
      if (value === "") {
        callback(new Error("请再次输入密码"));
      } else if (value !== this.passwordForm.newPassword) {
@@ -638,7 +629,6 @@
      }
    };
    return {
      showAccount: true,
      showChangePic: false,
      syncYrs: "",
      activeAccountItem: {},
@@ -651,11 +641,8 @@
      isSyncBrowser: false,
      showDateTime: false,
      isAddAccount: false,
      isCount: false,
      isCalculate: false,
      browserTimer: null,
      timezone: "",
      isRealtime: false,
      inputNickName: "",
      showHourInput: false,
      showMinInput: false,
@@ -664,9 +651,6 @@
      showMonthInput: false,
      selectedPic: null,
      showDayInput: false,
      loadedPic: "",
      cameraInfo: false,
      dependentScene: false,
      timestamp: 0,
      inAccountDetail: false,
      isChangePw: false,
@@ -693,7 +677,6 @@
      jpgArr: [],
      isManual: false,
      isNtp: true,
      // activePage: "账户",
      activeIndex: 0,
      clockTimer: null,
      inputHour: "",
@@ -747,6 +730,14 @@
    clearInterval(this.browserTimer);
  },
  mounted() {
    const menu = getUrlKey("menu");
    if (menu) {
      this.showWelcome = false;
      this.activeIndex = this.menuArr.findIndex((x) => x.name == menu);
      this.$nextTick(() => {
        this.$refs.netSettings.openRight(2);
      });
    }
    this.fetchUserList();
    this.fetchDefHeadPic();
  },
@@ -781,6 +772,24 @@
        }
      });
    },
    checkMonthInput() {
      this.inputMonth = this.inputMonth.replace(/[^\d]/g, "");
      if (this.inputMonth.length > 2)
        this.inputMonth = this.inputMonth.slice(0, 2);
      if (+this.inputMonth > 12) {
        this.inputMonth = "12";
      }
    },
    checkDayInput() {
      this.inputDay = this.inputDay.replace(/[^\d]/g, "");
      if (this.inputDay.length > 2) {
        this.inputDay = this.inputDay.slice(0, 2);
      }
      const max = this.getMaxDayOfMonth();
      if (+this.inputDay > max) {
        this.inputDay = max + "";
      }
    },
    editNickName() {
      this.showInputNickName = true;
      this.inputNickName = this.activeAccountItem.nickname;
@@ -801,15 +810,17 @@
      });
    },
    openAccount(item, i) {
      this.showInputNickName = false;
      this.activeAccountItem = item;
      this.activeAccountIndex = i;
      this.isChangePw = false;
      this.inAccountDetail = false;
      this.cancelSet();
      this.cancelAdd();
      this.inAccountDetail = false;
      this.isAddAccount = false;
      this.selectedPic = null;
      this.cacelChoosePic();
      this.fetchMenu();
      this.cancelPassword();
      this.showInputNickName = false;
    },
    minusOne(typ) {
      this.isSyncBrowser = false;
@@ -819,6 +830,7 @@
        case "hrs":
          num = +this.syncHour - 1;
          if (num == -1) {
            有线网络有线网络;
            num = 23;
          }
          this.syncHour = pad0(+num);
@@ -848,23 +860,23 @@
            this.minusOne("yrs");
          }
          this.syncMonth = pad0(+num);
          if (+this.syncDay > this.getMaxDayOfMonth()) {
            this.minusOne("day");
          }
          break;
        case "day":
          num = +this.syncDay - 1;
          if (num == 0) {
            this.minusOne("mth");
            const maxDay = new Date(
              +this.syncYrs,
              +this.syncMonth,
              0
            ).getDate();
            num = maxDay;
            num = this.getMaxDayOfMonth();
          }
          this.syncDay = pad0(+num);
          break;
        default:
          break;
      }
    },
    getMaxDayOfMonth() {
      return new Date(+this.syncYrs, +this.syncMonth, 0).getDate();
    },
    fatherChange(item) {
      item.children.forEach((x) => {
@@ -911,11 +923,13 @@
            num = 1;
          }
          this.syncMonth = pad0(+num);
          if (+this.syncDay > this.getMaxDayOfMonth()) {
            this.minusOne("day");
          }
          break;
        case "day":
          num = +this.syncDay + 1;
          const maxDay = new Date(+this.syncYrs, +this.syncMonth, 0).getDate();
          if (num > maxDay) {
          if (num > this.getMaxDayOfMonth()) {
            num = 1;
          }
          this.syncDay = pad0(+num);
@@ -927,24 +941,26 @@
    submitClock() {
      if (this.syncType === "1") {
        if (this.ntpServer === "" || this.ntpServer === "...") {
          this.$notify({
            type: "error",
            message: "NTP 服务器地址不能为空",
          });
          this.$notify.error("NTP 服务器地址不能为空");
          return false;
        } else if (this.timeInterval === "") {
          this.timeInterval = 1;
        }
      } else if (this.isSyncBrowser) {
        if (this.settime === "") {
          this.$notify({
            type: "error",
            message: "设置时间不能为空",
          });
          this.$notify.error("设置时间不能为空");
          return false;
        }
      } else {
        this.settime = `${this.syncYrs}-${this.syncMonth}-${this.syncDay} ${this.syncHour}:${this.syncMin}:${this.syncSec}`;
      }
      const now = new Date().getTime();
      if (new Date(this.settime).getTime() > now) {
        this.$message.warning(
          "设置的时间不能晚于当前时间: " + this.formatTime(now, "Y-M-D h:m:s")
        );
        return;
      }
      saveClockInfo({
        timeZone: this.timezone,
@@ -952,15 +968,17 @@
        ntpServer: this.ntpServer,
        interval: this.timeInterval,
        newTime: this.settime,
      }).then((rsp) => {
        if (rsp && rsp.success) {
          this.$notify({
            type: "success",
            message: "设置成功",
          });
      }).then(
        (rsp) => {
          if (rsp && rsp.success) {
            this.$notify.success("设置成功");
          }
          this.initClockConf();
        },
        (err) => {
          this.$notify.error("设置失败 " + err.msg);
        }
        this.initClockConf();
      });
      );
    },
    flatGetArr(arr, res) {
      for (const item of arr) {
@@ -981,26 +999,26 @@
        }
      });
    },
    formatTime(number, format) {
    formatTime(timestamp, format) {
      const formatNumber = (n) => {
        n = n + "";
        return n[1] ? n : "0" + n;
      };
      var formateArr = ["Y", "M", "D", "h", "m", "s"];
      var returnArr = [];
      var date = new Date(number * 1000);
      var date = new Date(timestamp);
      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());
      returnArr.push(formatNumber(date.getMonth() + 1));
      returnArr.push(formatNumber(date.getDate()));
      returnArr.push(formatNumber(date.getHours()));
      returnArr.push(formatNumber(date.getMinutes()));
      returnArr.push(formatNumber(date.getSeconds()));
      for (var i in returnArr) {
        format = format.replace(formateArr[i], returnArr[i]);
      }
      return format;
    },
    formatNumber(n) {
      n = n.toString();
      return n[1] ? n : "0" + n;
    },
    initClockConf(ntpTest = false) {
      getClockInfo().then((rsp) => {
        if (rsp && rsp.success) {
@@ -1015,6 +1033,9 @@
            this.timeInterval = rsp.data.interval;
          }
          this.timestamp = rsp.data.local_time;
          this.weekday =
            "星期" +
            "日一二三四五六".charAt(new Date(+this.timestamp * 1000).getDay());
          if (this.clockTimer === null) {
            this.runClock();
            if (this.isManual) this.parseTime();
@@ -1044,6 +1065,12 @@
      }
      this[`show${typ}Input`] = false;
      this[`input${typ}`] = "";
      if (typ == "Month") {
        const max = this.getMaxDayOfMonth();
        if (+this.syncDay > max) {
          this.syncDay = max + "";
        }
      }
    },
    onLeave() {
      if (this.showJPGArr) {
@@ -1051,14 +1078,18 @@
      }
      this.showChangePic = false;
    },
    cancelSetTime() {
      this.parseTime();
      this.ntpServer = "...";
      this.timeInterval = 10;
    },
    syncBrowser(enable) {
      this.isSyncBrowser = enable;
      if (!enable) {
        clearInterval(this.browserTimer);
      } else {
        this.browserTimer = setInterval(() => {
          let timestamp = new Date().getTime() / 1000;
          this.settime = this.formatTime(timestamp, "Y-M-D h:m:s");
          this.settime = this.formatTime(new Date().getTime(), "Y-M-D h:m:s");
          let [arr1, arr2] = this.settime.split(" ");
          [this.syncYrs, this.syncMonth, this.syncDay] = arr1.split("-");
          [this.syncHour, this.syncMin, this.syncSec] = arr2.split(":");
@@ -1195,7 +1226,7 @@
      this.inAccountDetail = true;
    },
    runClock() {
      const str = this.formatTime(++this.timestamp, "Y-M-D h:m:s");
      const str = this.formatTime(++this.timestamp * 1000, "Y-M-D h:m:s");
      [this.equipmentDate, this.equipmentTime] = str.split(" ");
      this.clockTimer = setTimeout(() => {
        this.runClock();
@@ -1284,16 +1315,16 @@
      }
      return false;
    },
    isShowPermitBtn(){
    isShowPermitBtn() {
      if (this.curUserRole == "管理员") {
        if (this.activeUserRole == "普通用户") {
          return true
          return true;
        }
        return false
      }else if (this.curUserRole == "普通用户"){
        return false
        return false;
      } else if (this.curUserRole == "普通用户") {
        return false;
      }
      return true
      return true;
    },
  },
};
@@ -1318,7 +1349,7 @@
    justify-content: center;
    align-items: center;
    cursor: pointer;
        -moz-box-shadow: 2px 2px 4px rgb(226, 226, 226);
    -moz-box-shadow: 2px 2px 4px rgb(226, 226, 226);
    -webkit-box-shadow: 2px 2px 4px rgb(226, 226, 226);
    box-shadow: 2px 2px 4px rgb(226, 226, 226);
    .child-info {