【sysUser】分配角色，职务选择功能完善

src/main/java/cn/stylefeng/guns/modular/user/UserViewController.java

@@ -50,4 +50,15 @@ public class UserViewController {
     public String editView() {
         return PREFIX + "/user_edit.html";
     }
+
+    /**
+     * 用户管理-角色-视图
+     *
+     * @author chenjinlong
+     * @date 2021/1/7 19:09
+     */
+    @GetResource(name = "用户管理-角色-视图", path = "roleView")
+    public String roleView() {
+        return PREFIX + "/user_role.html";
+    }
 }

src/main/webapp/assets/modular/system/user/user.js

@@ -109,17 +109,11 @@ layui.use(['layer', 'form', 'table', 'ztree', 'laydate', 'admin', 'HttpRequest',
 
     // 分配角色
     MgrUser.roleAssign = function (data) {
-        //获取多语言
+        func.open({
-        var langs = layui.data('system').lang;
+            title: '授权角色',
-
+            height: 470,
-        layer.open({
+            content: Feng.ctxPath + '/view/user/roleView?userId=' + data.userId,
-            type: 2,
+            tableId: MgrUser.tableId
-            title: langs.TITLE_ROLE_ASSIGN,
-            area: ['300px', '400px'],
-            content: Feng.ctxPath + '/mgr/role_assign?userId=' + data.userId,
-            end: function () {
-                table.reload(MgrUser.tableId);
-            }
         });
     };
 

src/main/webapp/assets/modular/system/user/user_add.js

@@ -1,63 +1,65 @@
-/**
+layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'xmSelect'], function () {
- * 用户详情对话框
- */
-var UserInfoDlg = {
-    data: {
-        deptId: "",
-        deptName: ""
-    }
-};
-
-layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'formSelects', 'xmSelect'], function () {
     var $ = layui.jquery;
     var HttpRequest = layui.HttpRequest;
     var form = layui.form;
     var admin = layui.admin;
     var laydate = layui.laydate;
-    var layer = layui.layer;
-    var formSelects = layui.formSelects;
     var xmSelect = layui.xmSelect;
-    var insXmSel;
+    var organizationXmSel;
+    var positionXmSel;
     // 点击部门时
-    $('#deptName').click(function () {
+    // $('#deptName').click(function () {
-        var formName = encodeURIComponent("parent.UserInfoDlg.data.deptName");
+    //     var formName = encodeURIComponent("parent.UserInfoDlg.data.deptName");
-        var formId = encodeURIComponent("parent.UserInfoDlg.data.deptId");
+    //     var formId = encodeURIComponent("parent.UserInfoDlg.data.deptId");
-        var treeUrl = encodeURIComponent("/dept/tree");
+    //     var treeUrl = encodeURIComponent("/dept/tree");
+    //
+    //     layer.open({
+    //         type: 2,
+    //         title: '部门选择',
+    //         area: ['300px', '400px'],
+    //         content: Feng.ctxPath + '/system/commonTree?formName=' + formName + "&formId=" + formId + "&treeUrl=" + treeUrl,
+    //         end: function () {
+    //             $("#deptId").val(UserInfoDlg.data.deptId);
+    //             $("#deptName").val(UserInfoDlg.data.deptName);
+    //         }
+    //     });
+    // });
 
-        layer.open({
+    // 初始化组织树
-            type: 2,
+    new HttpRequest(Feng.ctxPath + "/hrOrganization/treeLayui", 'get', function (data) {
-            title: '部门选择',
+        organizationXmSel = xmSelect.render({
-            area: ['300px', '400px'],
+            el: '#organization',
-            content: Feng.ctxPath + '/system/commonTree?formName=' + formName + "&formId=" + formId + "&treeUrl=" + treeUrl,
+            data: data.data,
-            end: function () {
+            model: {label: {type: 'text'}},
-                $("#deptId").val(UserInfoDlg.data.deptId);
+            prop: {name: 'title', value: 'id'},
-                $("#deptName").val(UserInfoDlg.data.deptName);
+            radio: true,
+            layVerify: 'required',
+            clickClose: true,
+            tree: {
+                show: true,
+                indent: 15,
+                strict: false,
+                expandedKeys: true
             }
         });
-    });
+    }).start();
 
-    /* 渲染树形 */
+    // 初始化职位
-    function renderTree() {
+    new HttpRequest(Feng.ctxPath + "/hrPosition/list", 'get', function (data) {
-        $.get(Feng.ctxPath + '/hrOrganization/treeLayui', function (data) {
+        positionXmSel = xmSelect.render({
-            insXmSel = xmSelect.render({
+            el: '#position',
-                el: '#organizationEditParentSel',
+            radio: true,
-                height: '250px',
+            layVerify: 'required',
-                data: data.data,
+            clickClose: true,
-                model: {label: {type: 'text'}},
+            data: data.data,
-                prop: {name: 'title', value: 'id'},
+            prop: {name: 'positionName', value: 'positionId'},
-                radio: true,
-                clickClose: true,
-                tree: {
-                    show: true,
-                    indent: 15,
-                    strict: false,
-                    expandedKeys: true
-                }
-            });
         });
-    }
+    }).start();
 
-    renderTree();
+    // 渲染时间选择框
+    laydate.render({
+        elem: '#birthday'
+    });
 
     // 添加表单验证方法
     form.verify({
@@ -69,16 +71,13 @@ layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'formSelects', 'x
         }
     });
 
-    // 渲染时间选择框
-    laydate.render({
-        elem: '#birthday'
-    });
-
     // 表单提交事件
     form.on('submit(btnSubmit)', function (data) {
 
-        //获取机构id
+        // 获取机构id
-        data.field.orgId = insXmSel.getValue('valueStr');
+        data.field.orgId = organizationXmSel.getValue('valueStr');
+        // 职位id
+        data.field.positionId = positionXmSel.getValue('valueStr');
 
         var request = new HttpRequest(Feng.ctxPath + "/sysUser/add", 'post', function (data) {
             admin.closeThisDialog();
@@ -91,11 +90,4 @@ layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'formSelects', 'x
         request.set(data.field);
         request.start(true);
     });
-
-    //初始化所有的职位列表
-    formSelects.config('selPosition', {
-        searchUrl: Feng.ctxPath + "/hrPosition/list",
-        keyName: 'positionName',
-        keyVal: 'positionId'
-    });
 });

src/main/webapp/assets/modular/system/user/user_edit.js

@@ -1,70 +1,51 @@
-/**
+layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'xmSelect'], function () {
- * 用户详情对话框
- */
-var UserInfoDlg = {
-    data: {
-        deptId: "",
-        deptName: ""
-    }
-};
-
-layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'formSelects', 'xmSelect'], function () {
     var $ = layui.jquery;
     var HttpRequest = layui.HttpRequest;
     var form = layui.form;
     var admin = layui.admin;
     var laydate = layui.laydate;
-    var layer = layui.layer;
-    var formSelects = layui.formSelects;
     var xmSelect = layui.xmSelect;
-    var insXmSel;
+    var organizationXmSel;
+    var positionXmSel;
 
     //获取信息详情填充表单
     var request = new HttpRequest(Feng.ctxPath + "/sysUser/detail?userId=" + Feng.getUrlParam("userId"), 'get');
     var result = request.start();
     form.val('userForm', result.data);
-    renderTree(result.data.orgId);
 
-    // 点击部门时
+    // 初始化职位
-    // $('#deptName').click(function () {
+    new HttpRequest(Feng.ctxPath + "/hrPosition/list", 'get', function (data) {
-    //     var formName = encodeURIComponent("parent.UserInfoDlg.data.deptName");
+        positionXmSel = xmSelect.render({
-    //     var formId = encodeURIComponent("parent.UserInfoDlg.data.deptId");
+            el: '#position',
-    //     var treeUrl = encodeURIComponent("/dept/tree");
+            radio: true,
-    //
+            clickClose: true,
-    //     layer.open({
+            layVerify: 'required',
-    //         type: 2,
+            data: data.data,
-    //         title: '部门选择',
+            initValue: [result.data.positionId],
-    //         area: ['300px', '400px'],
+            prop: {name: 'positionName', value: 'positionId'},
-    //         content: Feng.ctxPath + '/system/commonTree?formName=' + formName + "&formId=" + formId + "&treeUrl=" + treeUrl,
-    //         end: function () {
-    //             console.log(UserInfoDlg.data);
-    //             $("#deptId").val(UserInfoDlg.data.deptId);
-    //             $("#deptName").val(UserInfoDlg.data.deptName);
-    //         }
-    //     });
-    // });
-
-    /* 渲染树形 */
-    function renderTree(orgParentId) {
-        $.get(Feng.ctxPath + '/hrOrganization/treeLayui', function (data) {
-            insXmSel = xmSelect.render({
-                el: '#organizationEditParentSel',
-                height: '250px',
-                data: data.data,
-                initValue: [orgParentId],
-                model: {label: {type: 'text'}},
-                prop: {name: 'title', value: 'id'},
-                radio: true,
-                clickClose: true,
-                tree: {
-                    show: true,
-                    indent: 15,
-                    strict: false,
-                    expandedKeys: true
-                }
-            });
         });
-    }
+    }).start();
+
+
+    // 初始化组织树
+    new HttpRequest(Feng.ctxPath + "/hrOrganization/treeLayui", 'get', function (data) {
+        organizationXmSel = xmSelect.render({
+            el: '#organization',
+            data: data.data,
+            initValue: [result.data.orgId],
+            layVerify: 'required',
+            model: {label: {type: 'text'}},
+            prop: {name: 'title', value: 'id'},
+            radio: true,
+            clickClose: true,
+            tree: {
+                show: true,
+                indent: 15,
+                strict: false,
+                expandedKeys: true
+            }
+        });
+    }).start();
 
 
     // 添加表单验证方法
@@ -84,28 +65,22 @@ layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'formSelects', 'x
 
     // 表单提交事件
     form.on('submit(btnSubmit)', function (data) {
-        var ajax = new $ax(Feng.ctxPath + "/mgr/edit", function (data) {
+        // 获取机构id
-            Feng.success("修改成功！");
+        data.field.orgId = organizationXmSel.getValue('valueStr');
+        // 职位id
+        data.field.positionId = positionXmSel.getValue('valueStr');
 
-            //传给上个页面，刷新table用
+        var request = new HttpRequest(Feng.ctxPath + "/sysUser/edit", 'post', function (data) {
-            admin.putTempData('formOk', true);
-
-            //关掉对话框
             admin.closeThisDialog();
-
+            Feng.success("修改成功！");
+            admin.putTempData('formOk', true);
         }, function (data) {
-            Feng.error("修改失败！" + data.responseJSON.message)
+            admin.closeThisDialog();
+            Feng.error("修改失败！" + data.message);
         });
-        ajax.set(data.field);
+        request.set(data.field);
-        ajax.start();
+        request.start(true);
-        //添加 return false 可成功跳转页面
-        return false;
     });
 
-    //初始化所有的职位列表
+
-    formSelects.config('selPosition', {
-        searchUrl: Feng.ctxPath + "/hrPosition/list",
-        keyName: 'positionName',
-        keyVal: 'positionId'
-    });
 });

src/main/webapp/assets/modular/system/user/user_role.js

@@ -0,0 +1,45 @@
+layui.use(['layer', 'form', 'admin', 'laydate', 'HttpRequest', 'xmSelect'], function () {
+    var $ = layui.jquery;
+    var HttpRequest = layui.HttpRequest;
+    var form = layui.form;
+    var admin = layui.admin;
+    var xmSelect = layui.xmSelect;
+    var roleXmSel;
+
+    //获取信息详情填充表单
+    var request = new HttpRequest(Feng.ctxPath + "/sysUser/detail?userId=" + Feng.getUrlParam("userId"), 'get');
+    var result = request.start();
+    form.val('userForm', result.data);
+
+    console.log(result.data.grantRoleIdList);
+    // 初始化角色
+    new HttpRequest(Feng.ctxPath + "/sysRole/dropDown", 'get', function (data) {
+        roleXmSel = xmSelect.render({
+            el: '#role',
+            toolbar: {show: true},
+            layVerify: 'required',
+            initValue: result.data.grantRoleIdList,
+            data: data.data,
+            prop: {name: 'name', value: 'id'},
+        });
+    }).start();
+
+    // 表单提交事件
+    form.on('submit(btnSubmit)', function (data) {
+        // 角色ids
+        console.log(Feng.getUrlParam("userId"));
+        data.field.grantRoleIdList = roleXmSel.getValue('value');
+        data.field.userId = Feng.getUrlParam("userId");
+
+        var request = new HttpRequest(Feng.ctxPath + "/sysUser/grantRole", 'post', function (data) {
+            admin.closeThisDialog();
+            Feng.success("授权成功！");
+            admin.putTempData('formOk', true);
+        }, function (data) {
+            admin.closeThisDialog();
+            Feng.error("授权失败！" + data.message);
+        });
+        request.set(data.field);
+        request.start(true);
+    });
+});

src/main/webapp/pages/modular/system/user/user_add.html

@@ -8,23 +8,11 @@
                 <div class="layui-form-item layui-row">
                     <input name="userId" type="hidden"/>
                     <div class="layui-inline layui-col-md12">
-                        <label class="layui-form-label">基本信息<span style="color: red;">*</span></label>
+                        <label class="layui-form-label">账号<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
                             <input name="account" placeholder="请输入账号" type="text" class="layui-input" lay-verify="required" required/>
                         </div>
                     </div>
-                    <div class="layui-inline layui-col-md12">
-                        <label class="layui-form-label">姓名<span style="color: red;">*</span></label>
-                        <div class="layui-input-block">
-                            <input name="realName" placeholder="请输入姓名" type="text" class="layui-input" lay-verify="required" required/>
-                        </div>
-                    </div>
-                    <div class="layui-inline layui-col-md12">
-                        <label class="layui-form-label">生日<span style="color: red;">*</span></label>
-                        <div class="layui-input-block">
-                            <input id="birthday" name="birthday" placeholder="请输入生日" type="text" class="layui-input date-icon" autocomplete="off" lay-verify="required" required/>
-                        </div>
-                    </div>
                     <div class="layui-inline layui-col-md6">
                         <label class="layui-form-label">密码<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
@@ -37,12 +25,6 @@
                             <input name="rePassword" placeholder="请输入重复密码" type="password" class="layui-input" autocomplete="new-password" lay-verify="required|repsw" required/>
                         </div>
                     </div>
-                    <div class="layui-inline layui-col-md12">
-                        <label class="layui-form-label">邮件<span style="color: red;">*</span></label>
-                        <div class="layui-input-block">
-                            <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" lay-verify="required|email" autocomplete="off" required/>
-                        </div>
-                    </div>
                     <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">性别</label>
                         <div class="layui-input-block">
@@ -50,7 +32,33 @@
                             <input type="radio" name="sex" value="F" title="女"/>
                         </div>
                     </div>
+                    <div class="layui-inline layui-col-md6">
+                        <label class="layui-form-label">名称<span style="color: red;">*</span></label>
+                        <div class="layui-input-block">
+                            <input name="realName" placeholder="请输入姓名" type="text" class="layui-input" lay-verify="required" required/>
+                        </div>
+                    </div>
+                    <div class="layui-inline layui-col-md6">
+                        <label class="layui-form-label">昵称</label>
+                        <div class="layui-input-block">
+                            <input name="nickName" placeholder="请输入昵称" type="text" class="layui-input" lay-verify="required" required/>
+                        </div>
+                    </div>
                     <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">生日<span style="color: red;">*</span></label>
+                        <div class="layui-input-block">
+                            <input id="birthday" name="birthday" placeholder="请输入生日" type="text" class="layui-input date-icon" autocomplete="off" lay-verify="required" required/>
+                        </div>
+                    </div>
+
+                    <div class="layui-inline layui-col-md6">
+                        <label class="layui-form-label">邮件<span style="color: red;">*</span></label>
+                        <div class="layui-input-block">
+                            <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" lay-verify="required|email" autocomplete="off" required/>
+                        </div>
+                    </div>
+
+                    <div class="layui-inline layui-col-md6">
                         <label class="layui-form-label">电话<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
                             <input name="phone" placeholder="请输入电话" type="text" class="layui-input" lay-verify="required" required/>
@@ -66,7 +74,7 @@
                     <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">机构<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
-                            <div id="organizationEditParentSel" class="ew-xmselect-tree"></div>
+                            <div id="organization" class="ew-xmselect-tree"></div>
                         </div>
                     </div>
                     <!--                    <div class="layui-inline layui-col-md12">-->
@@ -79,9 +87,7 @@
                     <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">职位<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
-                            <select name="positionId" xm-select="selPosition">
+                            <div id="position" class="xm-select-demo"></div>
-                                <option value="">请选择职位</option>
-                            </select>
                         </div>
                     </div>
                 </div>

src/main/webapp/pages/modular/system/user/user_edit.html

@@ -7,6 +7,15 @@
             <div class="layui-card-body">
                 <div class="layui-form-item layui-row">
                     <input name="userId" id="userId" type="hidden"/>
+
+                    <input name="account" id="account" type="hidden"/>
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">性别</label>
+                        <div class="layui-input-block">
+                            <input type="radio" name="sex" value="M" title="男" checked/>
+                            <input type="radio" name="sex" value="F" title="女"/>
+                        </div>
+                    </div>
                     <div class="layui-inline layui-col-md6">
                         <label class="layui-form-label">名称<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
@@ -20,25 +29,19 @@
                         </div>
                     </div>
                     <div class="layui-inline layui-col-md12">
-                        <label class="layui-form-label">出生日期<span style="color: red;">*</span></label>
+                        <label class="layui-form-label">生日<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
-                            <input id="birthday" name="birthday" placeholder="请输入生日" type="text" class="layui-input date-icon" autocomplete="off"/>
+                            <input id="birthday" name="birthday" placeholder="请输入生日" type="text" class="layui-input date-icon" autocomplete="off" lay-verify="required" required/>
                         </div>
                     </div>
-                    <div class="layui-inline layui-col-md12">
+
-                        <label class="layui-form-label">邮箱<span style="color: red;">*</span></label>
+                    <div class="layui-inline layui-col-md6">
+                        <label class="layui-form-label">邮件<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
-                            <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" lay-verify="required|email" required/>
+                            <input name="email" placeholder="请输入邮箱" type="text" class="layui-input" lay-verify="required|email" autocomplete="off" required/>
                         </div>
                     </div>
-                    <div class="layui-inline layui-col-md12">
+                    <div class="layui-inline layui-col-md6">
-                        <label class="layui-form-label">性别</label>
-                        <div class="layui-input-block">
-                            <input type="radio" name="sex" value="M" title="男" checked/>
-                            <input type="radio" name="sex" value="F" title="女"/>
-                        </div>
-                    </div>
-                    <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">电话<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
                             <input name="phone" placeholder="请输入电话" type="text" class="layui-input" lay-verify="required" required/>
@@ -54,7 +57,7 @@
                     <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">机构<span style="color: red;">*</span></label>
                         <div class="layui-input-block">
-                            <div id="organizationEditParentSel" class="ew-xmselect-tree"></div>
+                            <div id="organization" class="ew-xmselect-tree"></div>
                         </div>
                     </div>
                     <!--                    <div class="layui-inline layui-col-md12">-->
@@ -66,10 +69,9 @@
                     <!--                    </div>-->
                     <div class="layui-inline layui-col-md12">
                         <label class="layui-form-label">职位<span style="color: red;">*</span></label>
+                        <div id="demo1" class="xm-select-demo"></div>
                         <div class="layui-input-block">
-                            <select name="positionId" xm-select="selPosition">
+                            <div id="position" class="xm-select-demo"></div>
-                                <option value="">请选择职位</option>
-                            </select>
                         </div>
                     </div>
                 </div>

src/main/webapp/pages/modular/system/user/user_role.html

@@ -0,0 +1,26 @@
+@layout("/layout/_form.html",{js:["/assets/modular/system/user/user_role.js"]}){
+
+<form class="layui-form" id="userForm" lay-filter="userForm">
+    <div class="layui-fluid" style="padding-bottom: 75px;">
+        <div class="layui-card">
+            <div class="layui-card-body">
+                <div class="layui-form-item layui-row">
+                    <div class="layui-inline layui-col-md12">
+                        <label class="layui-form-label">选择角色<span style="color: red;">*</span></label>
+                        <div id="demo1" class="xm-select-demo"></div>
+                        <div class="layui-input-block">
+                            <div id="role" class="xm-select-demo"></div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="form-group-bottom text-center">
+        <button class="layui-btn" lay-filter="btnSubmit" lay-submit>&emsp;提交&emsp;</button>
+        <button type="reset" class="layui-btn layui-btn-primary" ew-event="closeDialog">&emsp;取消&emsp;</button>
+    </div>
+
+</form>
+
+@}