查看用户信息,修改用户部门

ColorWhiteDeveloper

2022-09-20 f7feef4a4ecedbb9885a3403150f438965accb4f

查看用户信息,修改用户部门

 src/views/layout/components/Main/index.vue

@@ -25,7 +25,6 @@
  min-width: 1024px;
  padding: 0;
  .content {
    background-color: #070f22;
    padding: 11px;
  }
}

 src/views/layout/components/Menu/index.vue

@@ -21,33 +21,37 @@
                <span class="secondSpan">基本设置</span>
              </template>
              <!-- 用户管理 -->
              <el-submenu index="/home/system/base/user" class="thirdMenu">
              <el-menu-item index="/home/system/user">用户管理</el-menu-item>
              <!-- <el-submenu index="/home/system/base/user" class="thirdMenu">
                <template slot="title">
                  <span class="thirdSpan">用户管理</span>
                </template>
                <el-menu-item index="/home/system/user">用户列表</el-menu-item>
              </el-submenu>
              </el-submenu> -->
              <!-- 角色管理 -->
              <el-submenu index="/home/system/base/role" class="thirdMenu">
              <el-menu-item index="/home/system/role">角色管理</el-menu-item>
              <!-- <el-submenu index="/home/system/base/role" class="thirdMenu">
                <template slot="title">
                  <span class="thirdSpan">角色管理</span>
                </template>
                <el-menu-item index="/home/system/role">角色管理列表</el-menu-item>
              </el-submenu>
              </el-submenu> -->
              <!-- 权限管理 -->
              <el-submenu index="/home/system/base/authority" class="thirdMenu">
              <el-menu-item index="/home/system/authority">权限管理</el-menu-item>
              <!-- <el-submenu index="/home/system/base/authority" class="thirdMenu">
                <template slot="title">
                  <span class="thirdSpan">权限管理</span>
                </template>
                <el-menu-item index="/home/system/authority">设置权限</el-menu-item>
              </el-submenu>
              </el-submenu> -->
              <!-- 部门管理 -->
              <el-submenu index="/home/system/base/department" class="thirdMenu">
              <el-menu-item index="/home/system/department">部门管理</el-menu-item>
              <!-- <el-submenu index="/home/system/base/department" class="thirdMenu">
                <template slot="title">
                  <span class="thirdSpan">部门管理</span>
                </template>
                <el-menu-item index="/home/system/department">部门管理</el-menu-item>
              </el-submenu>
              </el-submenu> -->
            </el-submenu>
            <!-- 平台设置 -->
            <el-submenu index="/home/article/add" class="secondMenu">

 src/views/layout/index.vue

@@ -41,7 +41,7 @@
}

.el-main {
  background-color: #f0f2f5;
  background-color: #070f22;
  color: #333;
  text-align: center;
  line-height: 160px;

 src/views/systemSetting/baseSetting/user/createUser/index.vue

@@ -302,13 +302,10 @@
    props:['refresh']
}
</script>
<style lang="scss" scpoed>
<style lang="scss">
.createUser {
    border-radius: 1px;
    // min-width: 1024px;
    // min-height: 1450px;
    background-color: #09152f;

    header {
        display: flex;
        justify-content: space-between;
@@ -331,13 +328,11 @@
    }

    main {
        // border-top: 1px solid #f0f2f5;
        border: 1px solid #fff;
        text-align: left;
        padding: 0 55px;
        background-color: #09152f;
        .mainTitle {
            // margin-left: 60px;
            color: #666;
            font-weight: 600;
            line-height: 100px;

 src/views/systemSetting/baseSetting/user/index.vue

@@ -52,16 +52,17 @@
                        <template slot-scope="scope">
                            <div class="operation">
                                <!-- <span @click="handleChangeRole(scope.row)">修改角色</span> -->
                                <span>查看</span>
                                <span @click="handleFind(scope.row)">查看</span>
                                <span class="line">|</span>
                                <!-- <span>修改密码</span> -->
                                <!-- <span>删除</span> -->
                                <span>修改部门</span>
                                <span @click="handleUpdate(scope.row)">修改部门</span>
                            </div>
                        </template>
                    </el-table-column>
                </el-table>
                <el-dialog :visible.sync="dialogUpdate" width="45%">
                    <updateUser />
                    <updateUser :updateFlag="updateFlag" :userInfo=userInfo />
                </el-dialog>
            </div>
        </main>
@@ -80,7 +81,8 @@
            tableData: [],
            dialogCreate: false,
            dialogUpdate: false,
            user: '',
            updateFlag: false,
            userInfo:'',
        }
    },
    created() {
@@ -125,6 +127,18 @@
                return 'success-row';
            }
            return '';
        },
        // 查看用户信息(不可修改)
        handleFind(rowData){
            this.dialogUpdate = true;
            this.updateFlag = false;
            this.userInfo = rowData;
        },
        // 修改用户部门信息
        handleUpdate(rowData){
            this.dialogUpdate = true;
            this.updateFlag = true;
            this.userInfo = rowData
        }
    }
}
@@ -138,6 +152,7 @@
    header {
        background-color: #09152f;
        border: 1pox solid #fff;

        .headerContent {
            padding: 0 40px;
            display: flex;
@@ -155,6 +170,12 @@

                .el-input {
                    flex: 2;
                    color: #1d3f57;

                    .el-input__inner {
                        background-color: #09152f;
                        border: 1px solid #17324c;
                    }
                }

            }
@@ -183,64 +204,71 @@

    main {
        background-color: #09152f;
        padding-top: 20px;
        // padding: 0 40px;
        margin-top: 20px;
        padding-bottom: 50px;
        border: 1pox solid #fff;

        .mainTitle {
            line-height: 60px;
        }

        .el-table {
            color: #4b9bb7;
            font-size: 10px;

            .operation {
                display: flex;
                color: #0079fe;
                .line{
                    padding: 0 2px;
                }
                span:hover {
                    cursor: pointer;
                }
            }
        }

        .el-table .warning-row {
            background: #06122c;
        }

        .el-table .success-row {
            background: #071f39;
        }

        .switchStyle .el-switch__label {
            position: absolute;
            display: none;
            color: #fff;
        }

        .el-switch__core {
            background-color: rgba(166, 166, 166, 1);
        }

        .switchStyle .el-switch__label--left {
            z-index: 9;
            left: 20px;
        }

        .switchStyle .el-switch__label--right {
            z-index: 9;
            left: 4px;
        }

        .switchStyle .el-switch__label.is-active {
            display: block;
        }

        .switchStyle.el-switch .el-switch__core,
        .el-switch .el-switch__label {
            width: 50px !important;
        }
    }
}

.el-table {
    color: #4b9bb7;
    font-size: 10px;
    .operation {
        display: flex;
        // justify-content: space-around;
        color: #0079fe;
        span{
            margin-left: 10px;
        }
        span:hover {
            cursor: pointer;
        }
    }
}
.el-dialog__header,.el-dialog__body{
.el-dialog__header,
.el-dialog__body {
    background-color: #06122c;
}
.el-table .warning-row {
    background: #06122c;
}
.el-input__inner{
    background-color: #09152f;
}
.el-table .success-row {
    background: #071f39;
}
.switchStyle .el-switch__label {
    position: absolute;
    display: none;
    color: #fff;
  }
 .el-switch__core{
    background-color: rgba(166, 166, 166, 1) ;
  }
  .switchStyle .el-switch__label--left {
    z-index: 9;
    left: 20px;
  }
  .switchStyle .el-switch__label--right {
    z-index: 9;
    left: 4px;
  }
  .switchStyle .el-switch__label.is-active {
    display: block;
  }
  .switchStyle.el-switch .el-switch__core,
  .el-switch .el-switch__label {
    width: 50px !important;
  }
</style>

 src/views/systemSetting/baseSetting/user/updateUser/index.vue

@@ -1,11 +1,7 @@
<template>
    <div class="createUser">
    <div class="updateUser">
        <header>
            <div class="headerTitle">新增账户</div>
            <div class="headerTip">
                <span>*</span>
                <label>为必填项</label>
            </div>
            <div class="headerTitle">{{updateFlag ? '修改用户部门信息' :'查看用户信息'}}</div>
        </header>
        <main>
            <div class="mainTitle">基础信息</div>
@@ -13,12 +9,12 @@
                <el-form ref="user" label-width="140px" autoComplete="on" :model="user" :rules="createUserRules"
                    label-position="right">
                    <!-- 用户名称 -->
                    <el-form-item class="optionItem" label="用户名称:" prop="nickName">
                        <el-input v-model="user.nick_name" placeholder="填写用户名称"></el-input>
                    <el-form-item class="optionItem" label="用户名称:" prop="username">
                        <el-input v-model="user.username" placeholder="填写用户名称" :disabled="true"></el-input>
                    </el-form-item>
                    <!-- 用户密码 -->
                    <el-form-item class="optionItems" label="用户密码:" prop="password">
                        <el-input v-model="user.password" type="password" placeholder="请输入用户密码"></el-input>
                        <el-input v-model="user.password" type="password" placeholder="请输入用户密码" :disabled="true"></el-input>
                    </el-form-item>
                    <!-- 所属用户姓名 -->
                    <!-- <el-form-item class="optionItem" label="所属用户姓名:" prop="true_name">
@@ -33,18 +29,18 @@
                    </el-form-item> -->
                    <!-- 是否党员 -->
                    <el-form-item class="optionItem" label="是否党员:" prop="isDy">
                        <el-radio-group v-model="user.member">
                        <el-radio-group v-model="user.isDy" disabled>
                            <el-radio :label="1">是</el-radio>
                            <el-radio :label="0">否</el-radio>
                        </el-radio-group>
                    </el-form-item>
                    <!-- 所属手机号码 -->
                    <el-form-item class="optionItem" label="所属手机号码:" prop="mobile">
                        <el-input v-model="user.phone" placeholder="请填写手机号码"></el-input>
                        <el-input v-model="user.mobile" placeholder="请填写手机号码" :disabled="true"></el-input>
                    </el-form-item>
                    <!-- 邮箱地址 -->
                    <el-form-item class="optionItem" label="邮箱地址:" prop="email">
                        <el-input v-model="user.mail" placeholder="请填写邮箱地址"></el-input>
                        <el-input v-model="user.email" placeholder="请填写邮箱地址" :disabled="true"></el-input>
                    </el-form-item>
                    <!-- 选择角色 -->
                    <!-- <el-form-item class="optionItem" label="选择角色:" prop="role">
@@ -56,14 +52,13 @@
                    </el-form-item> -->
                    <!-- 用户类型 -->
                    <el-form-item class="optionItem" label="用户类型:" prop="userType">
                        <el-select v-model="user.type" placeholder="请选择用户类型">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                        <el-select v-model="user.userType" placeholder="请选择用户类型" disabled>
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 座机/分机 -->
                    <el-form-item class="optionItem" label="座机/分机:" prop="zj">
                    <!-- <el-form-item class="optionItem" label="座机/分机:" prop="zj">
                        <div class="optionHandleSp">
                            <el-input class="areaNumber" v-model="user.zj.areaNumber" placeholder="电话区号">
                            </el-input>
@@ -72,19 +67,18 @@
                            <el-input class="moreNumber" v-model="user.zj.moreNumber" placeholder="分机号码">
                            </el-input>
                        </div>
                    </el-form-item>
                    </el-form-item> -->
                    <!-- 所属部门 -->
                    <el-form-item class="optionItem" label="所属部门:" prop="departmentId">
                        <el-select v-model="user.department" placeholder="请选择所属部门">
                        <el-select v-model="user.department" placeholder="请选择所属部门" :disabled="!updateFlag">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.departName" :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <!-- 当前职务 -->
                    <el-form-item class="optionItem" label="当前职务:" prop="jobTitle">
                        <el-select v-model="user.work" placeholder="请选择当前职务">
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                :disabled="item.disabled">
                        <el-select v-model="user.work" placeholder="请选择当前职务" disabled>
                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
@@ -96,9 +90,8 @@
                    <!-- <el-form-item class="optionItem" label="填写所属ip地址:" prop="ip">
                        <el-input v-model="user.ip" placeholder="请填写所属ip地址"></el-input>
                    </el-form-item> -->
                    <el-form-item class="optionBtn">
                        <el-button type="primary" class="btn submit" @click.native.prevent="handleUser">提交</el-button>
                        <el-button class="btn reset">重置</el-button>
                    <el-form-item  v-if="updateFlag">
                        <div class="optionBtn"><el-button type="primary" class="btn submit" @click.native.prevent="handleUser">提交</el-button></div>
                    </el-form-item>
                </el-form>

@@ -267,6 +260,7 @@
    },
    created() { 
        const that = this ;
        this.user = JSON.parse(JSON.stringify(that.userInfo));
        // 获取角色列表
        // this.$axios.get('')
        // 获取用户类型列表
@@ -280,26 +274,28 @@
    },
    methods: {
        handleUser() {
            const that = this;
            console.log(this.user);
            // this.$axios.post('sccg/admin/register',that.user).then(res=>{
            //     console.log(res);
            // })
            const {user} = this;
            this.$axios.post('sccg/depart/status',{
                id:user.departmentId,
                status:user.status?1:0,
            }).then(res=>{
                console.log(res);
            })
        }
    },
    props:[]
    props:['userInfo','updateFlag']
}
</script>
<style lang="scss" scpoed>
.createUser {
.updateUser {
    border-radius: 1px;
    // min-width: 1024px;
    // min-height: 1450px;
    background-color: #fff;
    background-color: #06122c;

    header {
        display: flex;
        justify-content: space-between;
        justify-content: center;
        height: 60px;
        line-height: 60px;
        padding: 0 20px;
@@ -318,7 +314,6 @@
    }

    main {
        border-top: 1px solid #f0f2f5;
        text-align: left;
        padding: 0 55px;
        .mainTitle {