系统设置修改

heyujie

2021-07-10 c83e653ebaef064b0741c1f35cf6576762ccbc68

 src/pages/settings/index/App.vue

@@ -8,7 +8,7 @@
        :key="index"
        @click="openMenu(item.name, index)"
      >
        <span class="icon iconfont">&#xe646;</span>
        <span class="icon iconfont">{{ item.icon }}</span>
        <span class="card-text">{{ item.name }}</span>
      </div>
    </div>
@@ -35,10 +35,18 @@
              />
            </div>
            <span class="user-name">{{ item.username }}</span>
            <el-tag
              style="margin-left: 100px"
              size="mini"
              v-if="item.id == curUserID"
              >我的</el-tag
            >
          </div>
        </div>
        <div class="add-account">
          <span class="icon iconfont" @click="showAddAccount">&#xe646;</span>
          <!-- <span class="icon iconfont" @click="openAdd">&#xe646;</span> -->
          <i class="el-icon-circle-plus" style="font-size: 38px;
" @click="openAdd"></i>
        </div>
      </div>
      <div class="datetime-left" v-if="activePage == '日期时间'">
@@ -114,8 +122,10 @@
            </div>
            <div class="user-desc">
              <div class="username">
                <span class="icon iconfont" style="margin-right: 5px"
                  >&#xe690;</span
                <span
                  class="icon iconfont"
                  style="font-size: 18px; margin-right: 3px"
                  >&#xe6de;</span
                >
                <span>{{ activeAccountItem.username }}</span>
              </div>
@@ -124,32 +134,33 @@
                <span v-show="!showInputNickName">{{
                  activeAccountItem.nickname
                }}</span>
                <!-- <input
                  type="text"
                  class="input-nick"
                  ref="input-nick"
                  v-show="showInputNickName"
                  v-model="inputNickName"
                  @blur="hideInputNick"
                  @keydown.enter="blurInputNick"
                /> -->
                <el-input
                  size="mini"
                  v-model="inputNickName"
                  v-if="showInputNickName"
                ></el-input>
                <span v-show="!showInputNickName" class="icon iconfont" @click="editNickName"
                <span
                  v-show="!showInputNickName"
                  class="icon iconfont"
                  @click="editNickName"
                  >&#xe6f0;</span
                >
                 <span v-show="showInputNickName" class="icon iconfont" @click="showInputNickName=false"
                <span
                  v-show="showInputNickName"
                  class="icon iconfont"
                  @click="showInputNickName = false"
                  >&#xe61b;</span
                >
                 <span v-show="showInputNickName" class="icon iconfont" style="font-size:21px;font-weight:600;color:green;" @click="hideInputNick"
                <span
                  v-show="showInputNickName"
                  class="icon iconfont"
                  style="font-size: 21px; font-weight: 600; color: green"
                  @click="hideInputNick"
                  >&#xe62a;</span
                >
              </div>
              <div class="user-role">
                {{ activeUserRole }}
                <el-tag type="info" size="mini">{{ activeUserRole }}</el-tag>
              </div>
            </div>
          </div>
@@ -198,7 +209,10 @@
            ref="passwordForm"
            class="password-form"
          >
            <el-form-item prop="curPassword">
            <el-form-item
              prop="curPassword"
              v-if="activeAccountItem.id == curUserID"
            >
              <div class="p-title">当前密码：</div>

              <el-input
@@ -286,14 +300,6 @@
                <span class="icon iconfont enable">&#xe62a;</span>
              </div>
            </div>
            <!-- <el-upload
              class="upload-demo"
              action="https://jsonplaceholder.typicode.com/posts/"
              :show-file-list="false"
              :http-request="uploadUserPic"
            >
              <div v-if="loadedPic == ''" class="upload-jpg-up">上传</div>
            </el-upload> -->
          </div>
          <div class="fill-group">
            <el-form
@@ -549,42 +555,13 @@
    ></generalSettings>
  </div>
  <div class="welcome-page" v-else>
    <div class="child" @click="openWelcome('账户', 0)">
    <div class="child" @click="openWelcome(item, i)" v-for="(item,i) in menuArr" :key="i">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6de;</span>
        <span class="welcome-title">账户</span>
        <span class="icon iconfont welcome-icon">{{ item.icon }}</span>
        <span class="welcome-title">{{item.name}}</span>
      </div>
    </div>
    <div class="child" @click="openWelcome('日期时间', 1)">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6ff;</span>
        <span class="welcome-title">日期时间</span>
      </div>
    </div>
    <div class="child" @click="openWelcome('集群管理', 2)">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6df;</span>
        <span class="welcome-title">集群管理</span>
      </div>
    </div>
    <div class="child" @click="openWelcome('网络设置', 3)">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6dd;</span>
        <span class="welcome-title">网络设置</span>
      </div>
    </div>
    <div class="child" @click="openWelcome('键盘和语言', 4)">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6dc;</span>
        <span class="welcome-title">键盘和语言</span>
      </div>
    </div>
    <div class="child" @click="openWelcome('通用设置', 5)">
      <div class="child-info">
        <span class="icon iconfont welcome-icon">&#xe6db;</span>
        <span class="welcome-title">通用设置</span>
      </div>
    </div>

  </div>
</template>

@@ -608,7 +585,6 @@
import netSettings from "../views/NetSettings";
import keyboardLanguage from "../views/keyboardLanguage";
import generalSettings from "../views/generalSettings";
import treeVue from "@/components/treeMenu/jsTree/tree.vue";
export default {
  name: "settings",
  components: {
@@ -683,12 +659,12 @@
      settime: "",
      weekday: "",
      menuArr: [
        { name: "账户" },
        { name: "日期时间" },
        { name: "集群管理" },
        { name: "网络设置" },
        { name: "键盘和语言" },
        { name: "通用设置" },
        { name: "账户", icon: "\ue6de" },
        { name: "日期时间", icon: "\ue6ff" },
        { name: "集群管理", icon: "\ue6df" },
        { name: "网络设置", icon: "\ue6dd" },
        { name: "键盘和语言", icon: "\ue6dc" },
        { name: "通用设置", icon: "\ue6db" },
      ],
      accountArr: [],
      jpgArr: [],
@@ -776,9 +752,7 @@
        }
      });
    },
    blurInputNick() {
      this.$refs["input-nick"].blur();
    },

    confirmChangePic() {
      updateUser({
        id: this.activeAccountItem.id,
@@ -794,7 +768,6 @@
    editNickName() {
      this.showInputNickName = true;
      this.inputNickName = this.activeAccountItem.nickname;
      this.$refs["input-nick"].focus();
    },
    hideInputNick() {
      if (this.inputNickName == this.activeAccountItem.nickname) {
@@ -805,7 +778,7 @@
        id: this.activeAccountItem.id,
        nickname: this.inputNickName,
      }).then((res) => {
        this.activeAccountItem.nickname = this.inputNickName
        this.activeAccountItem.nickname = this.inputNickName;
        this.$message.success(res.msg);
        this.fetchUserList(true);
        this.showInputNickName = false;
@@ -881,8 +854,8 @@
      });
    },
    childrenChange(item) {
      let isAllSelected = item.children.every((x) => x.selected == true);
      item.selected = isAllSelected;
      let SomeOneSelected = item.children.some((x) => x.selected == true);
      item.selected = SomeOneSelected;
    },
    plusOne(typ) {
      this.isSyncBrowser = false;
@@ -1014,14 +987,6 @@
      n = n.toString();
      return n[1] ? n : "0" + n;
    },
    // uploadUserPic(params) {
    //   let param = new FormData();
    //   param.append("file", params.file);
    //   uploadHeadPic(param).then((res) => {
    //     this.jpgArr.push(res.data);
    //     this.loadedPic = res.data;
    //   });
    // },
    initClockConf(ntpTest = false) {
      getClockInfo().then((rsp) => {
        if (rsp && rsp.success) {
@@ -1050,9 +1015,9 @@
        this.initClockConf();
      }
    },
    openWelcome(name, i) {
    openWelcome(item, i) {
      this.showWelcome = false;
      this.openMenu(name, i);
      this.openMenu(item.name, i);
    },
    showInput(typ) {
      this[`show${typ}Input`] = true;
@@ -1087,11 +1052,11 @@
        }, 1000);
      }
    },
    showAddAccount() {
    openAdd() {
      this.inAccountDetail = false;
      this.isAddAccount = true;
      this.selectedPic = 0;
      this.addForm.headpic = this.jpgArr[0];
      this.addForm.headpic = this.jpgArr[0].path;
      getRoles().then((res) => {
        if (res.success) {
          this.roleList = res.data.slice(0, 2);
@@ -1116,12 +1081,21 @@
      this.showJPGArr = false;
    },
    SaveNewPassword(formName) {
      let data;
      this.$refs[formName].validate((valid) => {
        if (valid) {
          updatePassword({
            oldPwd: this.passwordForm.curPassword,
            newPwd: this.passwordForm.newPassword,
          }).then(
          if (this.passwordForm.curPassword == "") {
            data = {
              userId: this.activeAccountItem.id,
              newPwd: this.passwordForm.newPassword,
            };
          } else {
            data = {
              oldPwd: this.passwordForm.curPassword,
              newPwd: this.passwordForm.newPassword,
            };
          }
          updatePassword(data).then(
            (res) => {
              if (res.success) {
                this.$message.success(res.msg);
@@ -1129,7 +1103,7 @@
              }
            },
            (err) => {
              this.$message.warning("保存失败，" + err.msg);
              this.$message.error("保存失败，" + err.msg);
            }
          );
        }
@@ -1143,6 +1117,7 @@
            password: this.addForm.password,
            nickname: this.addForm.nickName,
            headpic: this.addForm.headpic,
            roleId: this.addForm.roleId,
          };
          addUser(data).then(
            (res) => {
@@ -1150,7 +1125,7 @@
              this.fetchUserList(true);
            },
            (err) => {
              this.$message.warning("保存失败，" + err.msg);
              this.$message.error("保存失败，" + err.msg);
            }
          );
        } else {
@@ -1227,7 +1202,7 @@
                message: "删除成功!",
              });
            } else {
              this.$message.warning("删除失败");
              this.$message.error("删除失败");
            }
          });
        })
@@ -1275,6 +1250,10 @@
      const info = JSON.parse(sessionStorage.getItem("userInfo"));
      return info.roleName;
    },
    curUserID() {
      const info = JSON.parse(sessionStorage.getItem("userInfo"));
      return info.id;
    },
  },
};
</script>
@@ -1292,7 +1271,6 @@
    background-color: white;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 33.3%;
    /* flex: 0 0 16%; */
    float: left;
    width: 250px;
    height: 200px;
@@ -1373,12 +1351,16 @@
    border-right: 5px solid rgba(248, 248, 248, 1);
    box-sizing: border-box;
    .account-left {
      .account-list{
        height: 530px;
        overflow: auto;
      }
      .add-account {
        color: rgba(61, 104, 225, 1);
        margin-top: 30px;
        .iconfont {
        margin-top: 15px;
        .el-icon-circle-plus {
          cursor: pointer;
          font-size: 32px;
          font-size: 38px;
        }
      }
      .account-card {
@@ -1469,7 +1451,6 @@
    overflow: auto;
    box-sizing: border-box;
    position: relative;

    padding: 20px 40px;
    .account-right {
      .account-content {
@@ -1533,11 +1514,11 @@
            align-items: baseline;
            min-width: 200px;
            .username {
                margin: 0 15px;
    height: 28px;
    line-height: 28px;
    text-align: left;
    font-size: 16px;
              margin: 0 15px;
              height: 28px;
              line-height: 28px;
              text-align: left;
              font-size: 16px;
              display: flex;
              align-items: center;
            }
@@ -1551,10 +1532,7 @@
                width: fit-content;
                text-align: left;
              }
              .input-nick {
                width: 80px;
                margin-right: 5px;
              }

              .iconfont {
                font-size: 14px;
                margin-left: 5px;
@@ -1571,7 +1549,7 @@
            .user-role {
              margin: 5px 0 0 15px;
              font-size: 14px;
              color: darkseagreen;
              color: skyblue;
            }
          }
        }
@@ -1598,7 +1576,6 @@
      .title {
        height: 30px;
        line-height: 30px;
        /* background-color: aliceblue; */
        margin-bottom: 10px;
        font-size: 16px;
        font-weight: 600;
@@ -1629,8 +1606,6 @@
          right: 1px;
          top: -0.5px;
          width: 45px;
          // background-color: rgba(61, 104, 225, 1);
          /* color: white; */
          border-radius: 12px;
        }
      }
@@ -1690,20 +1665,6 @@
        }
        .upload-jpg-border {
          border: 2px solid cornflowerblue;
        }
        .upload-jpg-up {
          height: 48px;
          width: 48px;
          float: left;
          display: flex;
          background-color: rgba(242, 242, 242, 1);
          border: 2px solid transparent;
          border-radius: 50%;

          justify-content: center;
          align-items: center;
          font-size: 12px;
          cursor: pointer;
        }
      }
      .add-account-page {
@@ -1770,59 +1731,7 @@
            text-decoration: underline;
          }
        }
        .ntp-bar {
          height: 40px;
          background-color: rgba(248, 248, 248, 1);
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding: 0 10px;
          border-radius: 10px;
          margin-bottom: 10px;
          .title {
            min-width: 70px;
          }
          .input-area {
            width: 450px;
            height: 30px;
            background-color: rgba(240, 240, 240, 1);
            border-radius: 10px;
            line-height: 30px;
            font-size: 14px;
          }
        }
        .int-bar {
          height: 40px;
          background-color: rgba(248, 248, 248, 1);
          display: flex;
          align-items: center;
          justify-content: space-between;
          padding: 0 10px;
          border-radius: 10px;
          margin-bottom: 10px;
          .title {
            min-width: 130px;
          }
          .right {
            width: 450px;
            display: flex;
            align-items: center;
            height: 30px;

            .input-area {
              // width: 410px;
              background-color: rgba(240, 240, 240, 1);
              border-radius: 10px;
              line-height: 30px;
              width: -webkit-fill-available;

              font-size: 14px;
            }
            .test {
              width: 40px;
            }
          }
        }
      }
      .manual-time {
        .clock-wrap {