sasp-admin 0.2.57

package/src/views/role/allowMenu.vue

@@ -0,0 +1,148 @@
+<template>
+    <el-container class="allow-menu-contain" style="height: 100%">
+        <el-header style="height: 45px" class="allow-menu-header">
+            <el-input v-model="filterText" style="width: 275px" size="small" placeholder="菜单名称"></el-input>
+            <el-button type="primary" @click="checkedAll()" size="small" icon="el-icon-check">全选</el-button>
+            <el-button type="info"  @click="noCheckedAll()" size="small" icon="el-icon-close">全部取消</el-button>
+        </el-header>
+        <el-main style="overflow-y: auto;">
+            <common-tree :request-url="api.menu.find" parent-id="menuSjbh" :request-param="requestParam"
+                         :defaultProps="defaultProps" :deal-tree-data="dealTreeData" :filter-text="filterText"
+                         :render-content-func="renderContentFunc" :refresh-proper="roleId" :init-check="initCheck"
+                         :init-call-back="initCallBack" ref="allowMenuTree"
+            >
+            </common-tree>
+        </el-main>
+        <el-footer style="text-align: center;line-height: 60px">
+            <el-button type="primary" @click="saveMenuSetting()" size="small" icon="el-icon-success">确 定</el-button>
+            <el-button @click="closeDialogFunc" size="small" icon="el-icon-error">取 消</el-button>
+        </el-footer>
+    </el-container>
+</template>
+
+<script>
+    export default {
+        name: "allow-menu",
+        props:{
+          roleId:{type:String,required:true}, // 当前角色id
+          nocdss:{type:String,required:false}, // 数据的过滤条件
+          closeDialog:{type:Function,default:null}, // 关闭对话框的办法
+        },
+        data(){
+          return {
+              defaultProps:{"label":"name","children":"children"},
+              requestParam:{'conditionMap.menuSfqy':"Y"},
+              filterText:"",
+              initCheck:{},
+          }
+        },
+        created(){
+            this.init();
+        },
+        watch:{
+            roleId(){
+                this.roleId && this.init();
+            }
+        },
+        methods:{
+            init(){
+                let vm = this;
+                vm.requestParam["nocdss"] = vm.nocdss;
+                vm.axios.post(vm.api.role.getById,{"id":vm.roleId}).then(function (res) {
+                    //allowAllotMenu
+                    vm.initCheck = {};
+                    if(res.data){
+                        let allowAllotMenu = JSON.parse(vm.platStringUtil.replaceAll(res.data.allowAllotMenu,"'","\"") || "{}");
+                        let checkedKeys = allowAllotMenu["xz"] || "";
+                        vm.initCheck["initCheck"] = checkedKeys.split(",");
+                    }
+                })
+            },
+            dealTreeData(data){
+                data.forEach(function (each) {
+                    each["name"] = each["menuName"] + "(" + each["cdss"] + "）";
+                })
+            },
+            renderContentFunc(h, { node, data, store }){
+                return (
+                    <span class="model-color">
+                        <i class={data.className}></i>
+                        <span>{node.label}</span>
+                    </span>
+                );
+            },
+            initCallBack(){
+                let vm = this;
+                let nodesMap = vm.$refs.allowMenuTree.getAllNode();
+                for(let [key,node] of Object.entries(nodesMap)){ // 展开已选择节点
+                    if(node.checked){
+                        node.expanded = true;
+                        let parentNode = nodesMap[node.data.menuSjbh] || {}; // 子类选中展开父级
+                        parentNode["expanded"] = true;
+                    }
+                }
+            },
+            checkedAll(){
+                let vm = this;
+                vm.$refs.allowMenuTree.setTreeCheckedAll();
+            },
+            noCheckedAll(){
+                let vm = this;
+                vm.$refs.allowMenuTree.setTreeCheckedKeys([],true);
+            },
+            saveMenuSetting(){
+                let vm = this;
+                let checkedNodes = vm.$refs.allowMenuTree.getTreeCheckedNodes();
+                let checkedSet = new Set(); // 已选择菜单数据
+                let effectSet = new Set(); // 有效的菜单数据，包括路径
+                checkedNodes.forEach(function (data) {
+                    checkedSet.add(data.id);
+                    effectSet.add(data.id);
+                    if(data.menuPath){
+                        data.menuPath.split(",").forEach(function (each) {
+                            effectSet.add(each);
+                        })
+                    }
+                });
+               let checkedArr = vm.setToArray(checkedSet);
+               let effectArr = vm.setToArray(effectSet);
+               let allowAllotMenu = {"xz":checkedArr.join(","),"sy":effectArr.join(",")};
+               vm.axios.post(vm.api.role.update,{"id":vm.roleId,"allowAllotMenu":JSON.stringify(allowAllotMenu)}).then(function (res) {
+                   if(res.data.operateSuccess){
+                       //主动刷新后台菜单缓存时间，重新抓取
+                       vm.axios.post(vm.api.menu.initMenu).then(function (menuRes) {
+                           vm.closeDialogFunc();
+                       })
+                   }
+                   vm.$message({
+                       duration:1200,
+                       type:"success",
+                       message:res.data.operateMessage
+                   })
+               })
+            },
+            setToArray(set){ // set转array
+                let arr = [];
+                for(let item of set.keys()){
+                    arr.push(item);
+                }
+                return arr;
+            },
+            closeDialogFunc(){
+                this.closeDialog && this.closeDialog();
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .allow-menu-contain /deep/ .el-main{
+        padding: 0;
+    }
+    .allow-menu-contain /deep/ .el-header{
+        padding-right: 0;
+    }
+    .allow-menu-header /deep/ .el-button{
+        margin-left: 10px;
+    }
+</style>

package/src/views/role/authRole/authRole.vue

@@ -0,0 +1,427 @@
+<template>
+    <el-container style="height: 100%">
+        <el-header style="height: auto;">
+            <div class="search-form-parent el-card">
+                <el-form :inline="true" :model="crud.searchForm" size="small" class="demo-form-inline"
+                         @keyup.enter.native="crud.doSearch()" onSubmit="return false;">
+                    <el-form-item label="角色名">
+                        <el-input v-model="crud.searchForm.roleName"></el-input>
+                    </el-form-item>
+                    <el-form-item label="菜单名">
+                        <el-input v-model="crud.searchForm.menuName"></el-input>
+                    </el-form-item>
+                    <el-form-item label="角色状态">
+                        <el-select v-model="crud.searchForm.roleStatus" placeholder="请选择">
+                            <el-option label="正常" value="10"></el-option>
+                            <el-option label="锁定" value="20"></el-option>
+                        </el-select>
+                    </el-form-item>
+                    <el-form-item>
+                        <el-button type="primary" icon="el-icon-search" @click="crud.doSearch()">查询</el-button>
+                        <el-button icon="el-icon-close" @click="crud.resetSearch()">清空</el-button>
+                    </el-form-item>
+                </el-form>
+            </div>
+        </el-header>
+
+        <el-main id="tableMain" style="height: 100%">
+            <el-container style="height:100%" class="table-list-container">
+                <el-header style="height: auto;" size="medium">
+                    <el-button type="primary" size="small" round icon="el-icon-circle-plus" @click="add()">新增
+                    </el-button>
+                    <el-button type="warning" size="small" round @click="toggleLockedUser('20')"><i class="saspiconfont pl-icon-pwd"></i> 设为锁定
+                    </el-button>
+                    <el-button type="success" size="small" round @click="toggleLockedUser('10')"><i class="saspiconfont pl-icon-08" style="position: relative;top:-1px"></i> 解锁
+                    </el-button>
+                    <el-button type="danger" size="small" round icon="el-icon-delete" @click="remove()">删除
+                    </el-button>
+                </el-header>
+                <el-main style="height: 100%;" ref="tableMain">
+                    <el-table :data="crud.dataStore.records" :ref="crud.tableRef" stripe border height="100%" header-row-class-name="list-default-row"
+                              style="width: 100%;">
+                        <el-table-column type="selection" :selectable="allowCheck" width="50" align="center"></el-table-column>
+                        <el-table-column label="角色编号" prop="roleNumber" width="150"></el-table-column>
+                        <el-table-column label="角色名" prop="roleName"></el-table-column>
+                        <el-table-column label="创建人" prop="roleCreater" width="150" :formatter="createFormatter"></el-table-column>
+                        <!--<el-table-column label="拥有的菜单" prop="remark">-->
+                            <!--<template slot-scope="scope" style="cursor: pointer">-->
+                                <!--<span style="cursor:pointer;overflow-y: hidden;white-space:nowrap; text-overflow:ellipsis;">-->
+                                        <!--{{scope.row.remark}}-->
+                                    <!--</span>-->
+                            <!--</template>-->
+                        <!--</el-table-column>-->
+                        <el-table-column label="角色状态" prop="roleStatus" width="150" align="center">
+                            <template slot-scope="scope">
+                                <el-tag :type="scope.row.roleStatus == '20'?'warning':'success'">
+                                    {{statusObj[(scope.row.roleStatus || "10")]}}
+                                </el-tag>
+                            </template>
+                        </el-table-column>
+                        <el-table-column label="操作" align="center" width="350">
+                            <template slot-scope="scope">
+                                <el-tooltip class="item" effect="dark" content="修改" placement="top-end">
+                                    <el-button type="primary" @click="roleUpdate(scope.row)" size="small"><i class="el-icon-edit"></i></el-button>
+                                </el-tooltip>
+                                <el-tooltip class="item" effect="dark" content="关联权限设置" placement="top-end">
+                                    <el-button type="primary" @click="roleSetting(scope.row)" size="small"><i class="saspiconfont pl-icon-quanxianshezhi"></i></el-button>
+                                </el-tooltip>
+                                <el-tooltip class="item" effect="dark" content="查看可分配菜单" placement="top-end">
+                                    <el-button type="primary" @click="viewRemark(scope.row)" icon="el-icon-zoom-in" size="small"></el-button>
+                                </el-tooltip>
+                            </template>
+                        </el-table-column>
+                    </el-table>
+                </el-main>
+            </el-container>
+        </el-main>
+        <el-footer>
+            <el-pagination
+                    :ref="crud.pageRef"
+                    :page-sizes="crud.pageSizes"
+                    :page-size="crud.pageSize"
+                    :current-page="crud.page"
+                    :total="crud.dataStore.total"
+                    @size-change="crud.sizeChange()"
+                    @current-change="crud.currentPage()"
+                    layout="total, sizes, prev, pager, next, jumper">
+            </el-pagination>
+        </el-footer>
+        <el-dialog :close-on-click-modal=false title="授权权限" width="60%" top="20vh" :visible.sync="crud.dialogVisible">
+            <el-form :model="crud.formData" :ref="crud.addFormRef">
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="角色编号" label-width="150px" prop="roleNumber" :rules="plValidate('number','required')">
+                            <el-input v-model="crud.formData.roleNumber"></el-input>
+                        </el-form-item>
+                    </el-col>
+                    <el-col :span="12">
+                        <el-form-item label="角色名" label-width="150px" prop="roleName" :rules="rules.roleName">
+                            <el-input v-model="crud.formData.roleName"></el-input>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+                <el-row>
+                    <el-col :span="12">
+                        <el-form-item label="角色状态" label-width="150px" prop="roleNumber" :rules="plValidate('required')">
+                            <el-select v-model="crud.formData.roleStatus" style="width: 100%">
+                                <el-option label="正常" value="10"></el-option>
+                                <el-option label="锁定" value="20"></el-option>
+                            </el-select>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="roleFormSubmit()" size="small" icon="el-icon-success">确 定</el-button>
+                <el-button @click="crud.dialogVisible = false" size="small" icon="el-icon-error">取 消</el-button>
+            </div>
+        </el-dialog>
+        <el-dialog :close-on-click-modal=false width="80%" height="90%" top="5vh" :visible.sync="roleSettingDialog" class="role-setting-class">
+            <auth-setting ref="authRef" :currentRowObj="currentRowObj" :roleSettingDialog="roleSettingDialog"
+                          v-if="roleSettingDialog"
+                          @closeSettingDialog="closeSettingDialog">
+            </auth-setting>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="saveSetting()" size="small" icon="el-icon-success">保 存</el-button>
+                <el-button @click="roleSettingDialog = false" size="small" icon="el-icon-error">取 消</el-button>
+            </div>
+        </el-dialog>
+        <el-dialog :close-on-click-modal=false title="查看当前角色菜单" width="400px" height="80%" top="10vh" :visible.sync="viewMenuDialog" class="view-menu-dialog">
+            <view-menu-opt-detail :role-id="viewMenuRoleId" :refresh-proper="viewMenuDialog"></view-menu-opt-detail>
+            <div slot="footer" class="dialog-footer">
+                <el-button type="primary" @click="viewMenuDialog = false" size="small" icon="el-icon-error">关闭</el-button>
+            </div>
+        </el-dialog>
+    </el-container>
+</template>
+
+<script>
+    import AuthSetting from "./component/authSetting";
+    import ViewMenuOptDetail from "../viewMenuOptDetail";
+    import CommonSettingNew from "../commonRole/compoment/commonSettingNew";
+    import AuthSettingNew from "../commonRole/compoment/authSettingNew";
+    export default {
+        name: "auth-role",
+        components: {AuthSettingNew, CommonSettingNew, ViewMenuOptDetail, AuthSetting},
+        data() {
+            //表单视图名称唯一性验证
+            let roleNameValidate =(rule,value,callback) => {
+                if(!value){
+                    callback();
+                }
+                this.axios.post(this.api.role.find,{roleType:'empower',roleNameEq:value,created:this.loginUser.id}).then(res =>{
+                    if((res.data ||[]).length == 0  || (this.operate == 'update' && this.oldRoleName == value)){
+                        callback();
+                    }else{
+                        return callback(new Error('该角色名称已经存在！'));
+                    }
+                });
+            };
+            return {
+                crud: new this.CrudUtil({
+                    vue: this,
+                    entityName: "role",
+                    url: this.api.role.url,
+                    searchUrl:this.api.role.findPage,
+                    addDefaultData:{"roleType":"empower"},
+                    searchForm:{"roleType":"empower","orderSql":"ROLE_NUMBER ASC"}, // 授权角色类型直接写死了，就不需要系统参数了
+                    noClearSearchColumns: ["orderSql","created","roleType"],
+                    initNoSearch:true
+                }),
+                currentRowObj:{},
+                statusObj:{"10":"正常","20":"锁定"},
+                roleSettingDialog:false, // 关联权限设置对话框
+                viewMenuDialog:false,
+                viewMenuRoleId:"",
+                entEmpowerUserRole:"",//企业授权用户默认授权角色权限
+
+                //唯一标识验证
+                rules:{
+                    //表单视图唯一性
+                    roleName:[
+                        {required: true, message: '该输入项为必输项'},
+                        {validator:roleNameValidate,trigger:'blur'}
+                    ],
+                },
+                operate:'add', //操作
+                oldRoleName:'',
+            }
+        },
+        created(){
+            this.init();
+        },
+        methods:{
+            init(){
+                let vm = this;
+                vm.axios.post(vm.api.param.getSysParams,{"key":"entEmpowerUserRole"}).then(result => {
+                    vm.entEmpowerUserRole = result.data || "";
+                    vm.loginUser = vm.USER_GLOBAL.getLoginUser() || {};
+                    vm.crud.searchForm["created"] = vm.loginUser.id;
+                    vm.crud.search();
+                });
+            },
+            allowCheck(row){ // 与系统参数配置的企业默认授权id相同的角色数据不可以被删除
+                return !(row.id == this.entEmpowerUserRole);
+            },
+            viewRemark(row){
+                let vm = this;
+                if(row.roleStatus == "20"){
+                    vm.$message({
+                        duration:1200,
+                        message:"该角色已被锁定，请解除锁定后继续操作！"
+                    });
+                    return;
+                }
+                this.viewMenuRoleId = row.id;
+                this.viewMenuDialog = true;
+            },
+            roleUpdate(row){
+                let vm = this;
+                if(row.roleStatus == "20"){
+                    vm.$message({
+                        duration:1200,
+                        message:"该角色已被锁定，请解除锁定后继续操作！"
+                    });
+                    return;
+                }
+                this.operate = "update";
+                this.oldRoleName = row.roleName;
+                vm.crud.update(row);
+            },
+            roleSetting(row){
+                let vm = this;
+                if(row.roleStatus == "20"){
+                    vm.$message({
+                       duration:1200,
+                       message:"该角色已被锁定，请解除锁定后继续操作！"
+                    });
+                    return;
+                }
+                vm.currentRowObj = row;
+                vm.roleSettingDialog = true;
+            },
+            roleFormSubmit(){
+                let vm = this;
+                vm.$refs[vm.crud.addFormRef].validate(valid => {
+                    if(!valid){
+                        return;
+                    }
+                    let formData = vm.crud.formData;
+                    if(formData.id){
+                        formData.updated = vm.loginUser.id;
+                        vm.crud.axios.post(vm.api.role.settingLockedRole, {"ids": formData.id,"roleStatus":formData.roleStatus});
+                    }
+                    if(!formData.created){
+                        formData.created = vm.loginUser.id;
+                    }
+                    formData.roleCreater =  vm.loginUser.userName;
+                    vm.crud.formSubmit();
+                });
+            },
+            toggleLockedUser(status){
+                let vm = this;
+                let selection = vm.$refs[vm.crud.setting.tableRef].selection;
+                if((selection || []).length == 0){
+                    vm.$message({
+                        message:"请选择要操作的角色！",
+                        duration:1500
+                    });
+                    return;
+                }
+                let message = '角色锁定时，该角色关联的所有权限都将锁定无法使用，确认锁定吗？';
+                if(status == '10'){
+                    message = '是否要将选中的角色设置为正常？';
+                }
+                vm.$confirm(message, '提示', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                    dangerouslyUseHTMLString: true
+                }).then(function () {
+                    let arrIds = [];
+                    selection.forEach(function (data) {
+                        arrIds.push(data.id);
+                    });
+                    vm.crud.axios.post(vm.api.role.settingLockedRole, {"ids": arrIds.join(","),"roleStatus":status}).then(function (response) {
+                        let obj = {"10":"解锁","20":"锁定"};
+                        let remindMessage = obj[status] + (response.data.operateSuccess ? "成功" : "失败");
+                        vm.$message({
+                            type: 'success',
+                            message: remindMessage
+                        });
+                        vm.crud.search();
+                    });
+                });
+            },
+            add(){
+                let vm = this;
+                vm.crud.addDefaultData["roleType"] = "empower";
+                vm.crud.addDefaultData["roleStatus"] = "10";
+                if(vm.loginUser.userType == "sup"){ // 用户是开发者，
+                    vm.crud.addDefaultData["parentRoleTree"] = "-1";
+                    vm.crud.add();
+                }else{
+                    if(!vm.loginUser.empowerId){
+                        vm.$message({
+                           duration:1200,
+                           message:"当前用户没有授权数据，无法新增！"
+                        });
+                        return;
+                    }
+                    vm.axios.post(vm.api.role.getById,{"id":vm.loginUser.empowerId}).then(res => {
+                        let data = res.data;
+                        if(!data.parentRoleTree){
+                            vm.$message({
+                                duration:1200,
+                                message:"当前用户数据异常，请联系管理员！"
+                            });
+                            return;
+                        }
+                        vm.crud.addDefaultData["parentRoleTree"] = data.parentRoleTree + "," + data.id;
+                        vm.crud.add();
+                    })
+                }
+            },
+            remove(){ // 将下级role_id数据一起移除,同时将role_user,role_menu_opt清空
+                let vm = this;
+
+                let selection = vm.$refs[vm.crud.setting.tableRef].selection;
+                if ((selection || []).length === 0) {
+                    vm.$message({
+                        duration: 1500,
+                        type: 'info',
+                        message: '请至少选择一条需要删除的数据！'
+                    });
+                    return;
+                }
+
+                vm.$confirm('是否确定删除？这将会清空所有下级关联数据包括权限数据！', '警告', {
+                    confirmButtonText: '确定',
+                    cancelButtonText: '取消',
+                }).then(function () {
+                    // 避免重复遮罩
+                    vm.crud.searchLoading && vm.crud.searchLoading.close();
+                    vm.crud.searchLoading = vm.$loading({
+                        target: vm.$refs[vm.crud.tableRef].$el,
+                        lock: true,
+                        text: '正在删除,请稍后...',
+                        spinner: 'el-icon-loading',
+                        background: 'rgba(0, 0, 0, 0.6)'
+                    });
+                    let arrIds = [];
+                    selection.forEach(function (data) {
+                        arrIds.push(data.id);
+                    });
+                    vm.axios.post(vm.api.role.linkRemove,{"ids":arrIds.join(",")}).then(res => {
+                        vm.crud.searchLoading && vm.crud.searchLoading.close();
+                        vm.$message({
+                            type: 'success',
+                            message: res.data.operateMessage
+                        });
+                        vm.crud.search();
+                    })
+                });
+            },
+            createFormatter(row){ // 格式化列数据
+                return row["roleCreater"] || row["createName"];
+            },
+            saveSetting(){
+                this.$refs.authRef.save();
+            },
+            closeSettingDialog(){
+                this.roleSettingDialog = false;
+                this.crud.search();
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .role-setting-class /deep/ .el-dialog__body{
+        padding: 0;
+    }
+    .role-setting-class /deep/ .el-tabs{
+        height: 100%;
+    }
+    .role-setting-class /deep/ .el-tabs__content{
+        height: calc(100% - 60px);
+    }
+    .role-setting-class /deep/ .el-tab-pane{
+        height: 100%;
+    }
+    /*.role-setting-class /deep/ .el-card__header{
+        background-color: white;
+        color:black;
+        height: 30px;
+        line-height: 30px;
+        font-size: 16px;
+        box-sizing: border-box;
+        border: 0;
+    }*/
+    .role-setting-class /deep/ .el-card__body{
+        min-height: 50px;
+    }
+    .role-setting-class /deep/ .el-card{
+        padding: 5px;
+        box-sizing: border-box;
+        min-height: 50px;
+    }
+    .role-setting-class /deep/ .role-menu-opt-card-card{
+        min-height: 50px;
+        text-align: center;
+        line-height: 50px;
+    }
+    .role-setting-class /deep/ .el-dialog__header{
+        border: 0;
+        padding: 10px;
+    }
+    .role-setting-class /deep/ .el-dialog__body{
+        height: calc(100% - 62px);
+    }
+    .role-setting-class /deep/ .el-dialog > .el-dialog__body{
+        top: 10px;
+    }
+    .role-setting-class /deep/ .el-dialog__headerbtn{
+        z-index: 99;
+    }
+
+</style>