U 登录添加用户名 用户模块只对superuser开放

whychw

2021-04-17 308336582cec4a2ed610eec5b9799f2497a4e4af

U 登录添加用户名 用户模块只对superuser开放

 src/api/services/user/index.js

@@ -64,6 +64,7 @@

  /**
   * 编辑用户
   * 修改密码 USnId Upassword  UId
   */
  ,update(data) {
    return self.$axios({
@@ -73,6 +74,7 @@
    });
  }


  /**
   * 删除用户
   */
@@ -84,6 +86,19 @@
    });
  }


  /**
   * 查询用户密码
   * User_infAction!serchByInfo 传参UId
   */
  ,getUserPWD (id) {
    return self.$axios({
      method: 'post',
      url: 'User_infAction!serchByInfo',
      data: 'json='+JSON.stringify({UId: id})
    });
  }

  /**
   * 用户登录
   */

 src/components/PageHeader.vue

@@ -1,15 +1,69 @@
<template>
    <div class="page-header clearfix">
    <div class="page-header clearfix no_select">
        <div class="page-left">
            <div class="title">综合电力监控管理系统</div>
        </div>
        <div class="page-right">
            <span><i class="icon user"></i>{{$store.state.login.username}}</span>

        <div class="page-right posR">
            <span class="cursor_pointer" ref="username" @click="userMenuShow = true"><i class="icon user"></i>{{$store.state.login.username}}</span>
            <!-- <template v-if="'superuser' == $store.state.login.username"> -->
                <div class="user-menu" :class="{show: userMenuShow}" :style="{left: userMenuWidth}" @click="editPassWord">修改密码</div>
                <div class="mask" v-show="userMenuShow" @click="userMenuShow = false"></div>
            <!-- </template> -->
            <span class="cursor_pointer" @click="logout"><i class="icon logout"></i>退出登录</span>

        </div>
        <div class="info">温度: <span>{{temp}}℃</span>  湿度: <span>{{hum}}%</span></div>

        <!-- 改密码弹窗 -->
          <!-- modal -->
        <el-dialog
          title="修改密码"
          :modal-append-to-body="false"
          :visible.sync="editPWShow"
          width="400px" >
          <el-form class="" ref="editForm" label-position="right" label-width="120px" size="small" :rules="rules" :model="user">
              <el-form-item
                label="原密码"
                prop="oldPassWord"
              >
                    <!-- :rule="rules.oldPassWord" -->
                  <el-input
                    v-model="user.oldPassWord"
                    type="password"
                    size="small"
                    placeholder="请输入原密码" >
                  </el-input>
              </el-form-item>
              <el-form-item
                label="新密码"
                prop="newPassWord"
                  >
                  <el-input
                    v-model="user.newPassWord"
                    type="password"
                    :rule="rules.newPassWord"
                    size="small"
                    placeholder="请输入原密码" >
                  </el-input>
              </el-form-item>
              <el-form-item
                label="确认新密码"
                prop="newPassWord2"
                  >
                  <el-input
                    v-model="user.newPassWord2"
                    :rule="rules.newPassWord2"
                    type="password"
                    size="small"
                    placeholder="请输入原密码" >
                  </el-input>
              </el-form-item>
          </el-form>
          <span slot="footer" class="dialog-footer">
            <el-button @click="editPWShow = false">关 闭</el-button>
            <el-button type="primary" @click="ok">确 定</el-button>
          </span>
        </el-dialog>
    </div>
</template>

@@ -22,7 +76,65 @@
            timer: new this.$common.Timeout(),
            temp: 34.5,
            hum: 80
            ,userMenuShow: false
            ,editPWShow: false
            ,user: {
                oldPassWord: ''
                ,newPassWord: ''
                ,newPassWord2: ''
            }
            // 当前用户的密码MD5后的字符串
            ,pwd: ''
            ,rules: {
              oldPassWord: [
                { required: true, message: '原密码不能为空'}
                // getUserPWD
                ,{
                  validator: (rule, value, callback) => {
                    // console.log(value);
                    let pwd = this.$common.hex_md5(('' + value).trim());
                    // console.log(pwd, 'pwd', value);
                    if (pwd != this.pwd) {
                      callback(new Error('原密码不正确'));
                    } else {
                      callback();
                    }
                  },
                  trigger: 'blur'
                }
              ]
              ,newPassWord: [
                { required: true, message: '新密码不能为空'}
              ]
              ,newPassWord2: [
                { required: true, message: '确认密码不能为空'}
                ,{
                  validator: (rule, value, callback) => {
                    // console.log(value);
                    if (('' + value).trim() != this.user.newPassWord) {
                      callback(new Error('两次输入的新密码不同'));
                    } else {
                      callback();
                    }
                  },
                  trigger: 'blur'
                }
              ]
            }
            // 是否已挂载
            ,isMounted: false
        }
    },
    computed: {
      userMenuWidth () {
        if (this.isMounted) {
          let $username = this.$refs.username;
          let rect = $username.getBoundingClientRect();
          return rect.width / 2 + 25 + 'px';
        } else {
          return 0;
        }
      }
    },
    methods: {
        logout () {
@@ -38,13 +150,62 @@
                    this.hum = data.tmphum_hum;
                }
            });
        },
        }
        ,getUserPWD () {
          this.$api.user.getUserPWD(this.$common.getSession('uid')).then((res) => {
            res = JSON.parse(res.data.result);
            // console.log(res);
            if (res.code) {
              this.pwd = res.data[0].Upassword;
            }
          });
        }
        // 换肤
        selectTheme () {
            this.$router.replace({path: '/selectTheme'});
        // selectTheme () {
        //     this.$router.replace({path: '/selectTheme'});
        // }
        ,editPassWord () {
            this.userMenuShow = false;
            this.editPWShow = true;
        }
        ,ok () {
            let form = this.$refs.editForm;
            form.validate((valid) => {
              // console.log(valid);
              if (valid) {

                this.$api.user.update({
                  UId: this.$common.getSession('uid')
                  ,USnId: this.user.newPassWord
                  ,Upassword: this.user.newPassWord
                }).then((res) => {
                  res = JSON.parse(res.data.result);
                  // console.log(res);
                  if (res.code) {
                    this.$message({
                      type: 'success'
                      ,message: res.msg
                    });
                    this.editPWShow = false;
                  } else {
                    this.$message({
                      type: 'warnning'
                      ,message: res.msg
                    });
                  }
                }).catch((err) => {
                  this.$message({
                    type: 'error'
                    ,message: err
                  });
                });
              }
            });
        }
    },
    mounted () {
      this.isMounted = true;
      this.getUserPWD();
        this.timer.start(() => {
            this.getTmpHum();
            this.timer.open();
@@ -62,6 +223,8 @@
    font-size: 0.14rem;
    background: #041b3f;
    margin-bottom: 4px;
    position: relative;
    z-index: 99;
}
.title {
  min-width: 366px;
@@ -131,6 +294,52 @@
    margin-left: 4em;
    background: #08f7e7 url(../assets/imgs/logout.svg) 56% 50% / 94% auto no-repeat;
}
.user-menu {
    /*display: none;*/
    position: absolute;
    top: 100%;
    background: #00f7f9;
    color: #041b3f;
    padding-left: 2em;
    padding-right: 2em;
    -webkit-border-radius: 6px;
    border-radius: 6px;
    z-index: 10000;
    -webkit-transform-origin: -5% -60%;
    transform-origin: -5% -60%;
    -webkit-transform: translateX(-50%) scale(0) rotate(-90deg);
    transform: translateX(-50%) scale(0) rotate(-90deg);
    -webkit-transition: -webkit-transform 0.3s;
    transition: transform 0.3s;
    cursor: pointer;
}
.user-menu.show {
    /*display: block;*/
    -webkit-transform: translateX(-50%) scale(1) rotate(0);
    transform: translateX(-50%) scale(1) rotate(0);
}
.user-menu::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    width: 8px;
    height: 8px;
    -webkit-transform: translate(-50%, -100%);
    transform: translate(-50%, -100%);
    background: linear-gradient(-45deg, #00f7f9 50%, transparent 50%) 0 0 / 50% 100%
                ,linear-gradient(45deg, #00f7f9 50%, transparent 50%) 50% 0 / 50% 100%;
    background-repeat: no-repeat;
}
.mask {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    /*background: #000;*/
    z-index: 9999;
}
</style>



 src/components/PageNav.vue

@@ -163,7 +163,8 @@
        // 更新权限属性
        this.$root.upDateAuth();
        // 如果用户没有权限 则去掉用户管理菜单
        if (!this.$root.authorization) {
        // 改为只有superuser才有用户管理菜单
        if ('superuser' != this.$store.state.login.username) {
            let navs = this.navs.filter((v) => {
                return v.txt != '用户管理';
            });

 src/store/moudles/login/index.js

@@ -4,6 +4,7 @@
            username: sessionStorage.getItem("username") || "",
            login: sessionStorage.getItem("login") || false,
            unote: sessionStorage.getItem("unote") || 0,
            uid: ''
        }
    },
    mutations:{
@@ -13,18 +14,22 @@
                sessionStorage.setItem("username", user.name);
                sessionStorage.setItem("login", true);
                sessionStorage.setItem('unote', user.unote);
                sessionStorage.setItem('uid', user.uid);

                state.username = user.name;
                state.unote = user.unote;
                state.uid = user.uid;
                state.login = true;
            }else {
                // 设置session
                sessionStorage.setItem("username", "");
                sessionStorage.setItem("login", false);
                sessionStorage.setItem('unote', 0);
                sessionStorage.setItem('uid', '');
                
                state.username = "";
                state.unote = 0;
                state.uid = '';
                state.login = false;
            }
        }

 src/views/user/info.vue

@@ -37,12 +37,14 @@
                        fixed="right"
                        label="操作"
                        align="center"
                        width="160">
                        width="240">
                            <template slot-scope="scope">
                                <div class="btn btn-del"
                                @click="confirmDelUser(scope.row)">删除</div>
                                <!-- <div class="btn btn-edit"
                                    @click="showEditDialog(scope.row)">编辑</div> -->
                                <div class="btn btn-edit"
                                    @click="showEditDialog(scope.row)">编辑</div>
                                    @click="resetPassWord(scope.row)">重置密码</div>
                            </template>
                        </el-table-column>
                    </el-table>
@@ -88,7 +90,7 @@
            </flex-layout>
        </el-dialog>
        <!-- 编辑用户 -->
        <el-dialog class="el-dialog-center" top="0vh" v-cloak title='编辑用户'
        <!-- <el-dialog class="el-dialog-center" top="0vh" v-cloak title='编辑用户'
        :visible.sync="editUser.show" width="5.2rem"
        :close-on-click-modal=false
        @closed="editUserClosed">
@@ -125,7 +127,7 @@
                    @click="editUser.show=false">取消</el-button>
                </div>
            </flex-layout>
        </el-dialog>
        </el-dialog> -->
    </div>
    
</template>
@@ -201,7 +203,7 @@
                var data = [];
                if(res.code == 1) {
                    data = res.data.filter((v) => {
                        return v.UName != 'superuser';
                        return v.UName != 'superuser' && v.UName != 'sys';
                    });
                }
                // 设置用户名
@@ -257,14 +259,14 @@
                }
            });
        },
        showEditDialog: function(userInfo) {
            // 显示弹出框
            this.editUser.show = true;
            // 遍历userInfo属性修改编辑用户的值
            Object.keys(userInfo).forEach(function(key) {
                // console.log(key);
            });
        },
        // showEditDialog: function(userInfo) {
        //     // 显示弹出框
        //     this.editUser.show = true;
        //     // 遍历userInfo属性修改编辑用户的值
        //     Object.keys(userInfo).forEach(function(key) {
        //         // console.log(key);
        //     });
        // },
        editUserClosed: function() {

        },
@@ -307,6 +309,40 @@
                }
            });
        }
        // 重置用户密码
        ,resetPassWord (userInfo) {
            this.$layer.confirm('是否将用户' + userInfo.UName + '的密码重置为：123456'
                ,{icon: 3}
                ,(index) => {
                  console.log(userInfo);
                    this.$api.user.update({
                        UId: userInfo.UId
                        ,USnId: '123456'
                        ,Upassword: '123456'
                    }).then((res) => {
                        console.log(res);
                        res = JSON.parse(res.data.result);
                        if (res.code) {
                          this.$message({
                            type: 'success'
                            ,message: res.msg
                          });
                        } else {
                          this.$message({
                            type: 'warning'
                            ,message: this.msg
                          });
                        }
                    }).catch((err) => {
                        this.$message({
                            type: 'error'
                            ,message: err
                        });
                    });

                    this.$layer.close(index);
                });
        }
    },
    mounted() {
        this.searchUserListAll();
@@ -335,7 +371,7 @@
  display: inline-block;
  background: #00f7f9;
  color: #041b3f;
  width: 4em;
  width: 5.6em;
  height: 30px;
  line-height: 30px;
  -webkit-border-radius: 4px;

 src/views/user/login.vue

@@ -14,17 +14,17 @@
                        @focus="focus">
                        </el-input>
                    </div>
                    <!-- <div class="input-item">
                    <div class="input-item">
                        <el-input
                        v-model="user.password"
                        type="password"
                        placeholder="请输入密码"
                        prefix-icon="el-icon-lock"
                        clearable
                        :disabled="true"
                        @keyup.enter.native="login"
                        @focus="focus">
                        </el-input>
                    </div> -->
                    </div>
                    <!-- <div class="flex-row">
                        <div class="input-item">
                            <el-input
@@ -71,7 +71,7 @@
           loading: false,
           user: {
               name: ''
               // password: '123456',
               ,password: ''
               // identify: ''
           },
           msg: '',
@@ -89,7 +89,8 @@
            var self = this;
            var userInfo = {
                UName: this.user.name
                // Upassword: this.$common.hex_md5(this.user.password),
                // ,Upassword: this.user.password
                ,Upassword: this.$common.hex_md5(this.user.password),
                // UId: 1,
            };
            this.loading = true;
@@ -97,11 +98,13 @@
            this.$api.user.login(userInfo)
            .then(function(res) {
                var rs = JSON.parse(res.data.result);
                console.log(rs, '===rs', res);
                if(rs.code == 1) {
                    self.msg = '登录成功';
                    let user = {
                      name: userInfo.UName
                      ,unote: rs.data
                      ,unote: rs.data.UNote
                      ,uid: rs.data.UId
                    }
                    self.$store.dispatch('setLogin', user);
                    self.$nextTick(function() {
@@ -198,6 +201,9 @@
.login-header {
  margin-bottom: .4rem;
}
.input-item + .input-item {
  margin-top: 1em;
}
>>> .el-input {
  font-size: .22rem;
  height: .6rem;

 src/views/user/power.vue

@@ -76,15 +76,14 @@
              self.userQuery[v.UId] = v.UName;

              // 当前用户不能操作自己
              v.disabled = v.UName == self.$store.state.login.username;
              // v.disabled = v.UName == self.$store.state.login.username;

              v.disabled = v.UName == 'superuser' || v.UName == 'sys';

              if (v.UName != 'superuser') {
                _data.push(v);
              _data.push(v);

                if (v.UNote > 0) {
                  value.push(v.UId);
                }
              if (v.UNote > 0) {
                value.push(v.UId);
              }
            });
          }