1

lzhe

2024-04-03 73236ec895d503f3507a56152c1a1ba50e588c7f

1

 src/utils/request.js

@@ -1,5 +1,5 @@
import axios from 'axios';
import { ElNotification, ElMessageBox } from 'element-plus';
import { ElNotification, ElMessageBox, ElMessage } from 'element-plus';
import sysConfig from "@/config";
import tool from '@/utils/tool';
import router from '@/router';
@@ -130,7 +130,14 @@
            }).then((response) => {
                resolve(response.data);
            }).catch((error) => {
                reject(error);
                if(error.status == 400) {
                    ElMessage({
                        message: error.data.msg,
                        type: 'warning',
                     })
                }else {
                    reject(error);
                }
            })
        })
    },

 src/views/console/authority/role/index.vue

@@ -1,73 +1,95 @@
<template>
    <el-container>
        <el-header>
    <div class="rolePage">
        <div class="roleContainer">
            <div class="roleContainer-title">角色</div>
            <ul>
                <li v-for="(item,index) in tableData" @click="changeLi(index)">
                    <span :class="{active: item.active}">{{item.roleName}}</span>
                    <div class="scopeBtn">
                        <span style="margin-right: 12px;cursor: pointer;">重命名</span>
                        <span>删除</span>
                    </div>
                </li>
            </ul>
            <div class="left-panel">
                <el-button type="primary" icon="el-icon-plus" @click="add"></el-button>
                <el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length==0" @click="batch_del"></el-button>
                <el-button type="primary" plain :disabled="selection.length!=1" @click="permission">权限设置</el-button>
                <el-button type="primary" icon="el-icon-plus" @click="add">添加角色</el-button>
            </div>
            <div class="right-panel">
                <div class="right-panel-search">
                    <el-input v-model="search.keyword" placeholder="角色名称" clearable></el-input>
                    <el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
        </div>
        <el-tabs tab-position="top" class="roleTabs">
            <el-tab-pane label="菜单">
                <div class="treeMain">
                    <el-tree ref="menu" node-key="name" :data="menu.list" :props="menu.props" show-checkbox></el-tree>
                </div>
            </div>
        </el-header>
        <el-main class="nopadding">
            <scTable ref="table" :apiObj="apiObj" row-key="id" @selection-change="selectionChange" stripe>
                <el-table-column type="selection" width="50"></el-table-column>
                <el-table-column label="#" type="index" width="50"></el-table-column>
                <el-table-column label="角色名称" prop="label" width="150"></el-table-column>
                <el-table-column label="排序" prop="sort" width="80"></el-table-column>
                <el-table-column label="操作" fixed="right" align="right" width="170">
                    <template #default="scope">
                        <el-button-group>
                            <el-button text type="primary" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
                            <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)">编辑</el-button>
                            <el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
                                <template #reference>
                                    <el-button text type="primary" size="small">删除</el-button>
                                </template>
                            </el-popconfirm>
                        </el-button-group>
                    </template>
                </el-table-column>
            </el-tab-pane>
            <el-tab-pane label="卡片">
                <div class="treeMain">
                    <el-tree ref="grid" node-key="key" :data="grid.list" :props="grid.props" :default-checked-keys="grid.checked" show-checkbox></el-tree>
                </div>
            </el-tab-pane>
        </el-tabs>

            </scTable>
        </el-main>
    </el-container>

    <save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSaveSuccess" @closed="dialog.save=false"></save-dialog>

    <permission-dialog v-if="dialog.permission" ref="permissionDialog" @closed="dialog.permission=false"></permission-dialog>

        <save-dialog v-if="dialog.save" ref="saveDialog" @success="handleSaveSuccess" @closed="dialog.save=false"></save-dialog>
    </div>
</template>

<script>
    import saveDialog from './save'
    import permissionDialog from './permission'

    export default {
        name: 'role',
        components: {
            saveDialog,
            permissionDialog
            saveDialog
        },
        data() {
            return {
                menu: {
                    list: [],
                    checked: [],
                    props: {
                        label: (data)=>{
                            return data.meta.title
                        }
                    }
                },
                grid: {
                    list: [],
                    checked: ["welcome", "ver", "time", "progress", "echarts", "about"],
                    props: {
                        label: (data)=>{
                            return data.title
                        },
                        disabled: (data)=>{
                            return data.isFixed
                        }
                    }
                },
                dialog: {
                    save: false,
                    permission: false
                },
                //apiObj: this.$API.system.role.list,
                apiObj: "",
                selection: [],
                search: {
                    keyword: null
                }
                tableData: "",
                selection: []
            }
        },
        mounted(){
            this.getRoleList();  //角色列表
        },
        methods: {
            changeLi(index) {
                this.tableData.forEach(item=> {
                    item.active = false;
                })
                this.tableData[index].active = true;
            },
            getRoleList() {
                this.$HTTP.get("/api/blade-system/role/list?current=1&size=1000").then(res=> {
                    if(res.code == 200) {
                        res.data[0].active = true;
                        this.tableData = res.data;
                    }
                })
            },
            //添加
            add(){
                this.dialog.save = true
@@ -89,13 +111,6 @@
                    this.$refs.saveDialog.open('show').setData(row)
                })
            },
            //权限设置
            permission(){
                this.dialog.permission = true
                this.$nextTick(() => {
                    this.$refs.permissionDialog.open()
                })
            },
            //删除
            async table_del(row){
                var reqData = {id: row.id}
@@ -106,19 +121,6 @@
                }else{
                    this.$alert(res.message, "提示", {type: 'error'})
                }
            },
            //批量删除
            async batch_del(){
                this.$confirm(`确定删除选中的 ${this.selection.length} 项吗？如果删除项中含有子集将会被一并删除`, '提示', {
                    type: 'warning'
                }).then(() => {
                    const loading = this.$loading();
                    this.$refs.table.refresh()
                    loading.close();
                    this.$message.success("操作成功")
                }).catch(() => {

                })
            },
            //表格选择后回调事件
            selectionChange(selection){
@@ -133,10 +135,6 @@
                    row.status = val;
                    this.$message.success("操作成功")
                }, 500)
            },
            //搜索
            upsearch(){

            },
            //根据ID获取树结构
            filterTree(id){
@@ -166,5 +164,62 @@
    }
</script>

<style>
<style scoped>
.rolePage {
    display: flex;
}
.rolePage .roleContainer {
    max-width:300px;
    width:300px;
    margin-right: 8px;
    height: 100%;
    margin-top:8px;
    margin-left:8px;
    background-color: #fff;
    padding-bottom:8px;
}
.roleContainer-title {
    height: 41px;
    line-height: 41px;
    font-size: 14px;
    text-align: center;
    background-color: #3b8e8e;
    color: #fff;
}
.rolePage .roleContainer ul {
	
}
.rolePage .roleContainer ul li{
    height:42px;
    line-height: 42px;
    list-style-type: none;
    color: #606266;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #ebeef5;
    padding-left: 8px;
    padding-right: 8px;
    cursor: pointer;
}
.rolePage .roleContainer ul li .active {
    font-weight: bold;
    color: #3b8e8e;
}
.rolePage .roleContainer ul li:hover {
    background-color: #f5f7fa;
}
.rolePage .roleContainer ul li .scopeBtn {
    color: #409eff;
}
.rolePage .roleContainer .left-panel {
    text-align: center;
    margin-top:8px;
}
.rolePage .roleTabs {
    flex: 1;
    background-color: #fff;
    padding: 8px;
    margin-top:8px;
    margin-right:8px;
}
</style>

 src/views/console/system/addUser.vue

@@ -182,17 +182,24 @@
                    }
                })
            },
            //表单注入数据
            showDetail(data) {
                this.$HTTP.get("/api/blade-user/detail?id="+data.id).then(res=> {
                    if(res.code == 200) {
                        res.data.employeeIdStr = res.data.employeeId;
                        res.data.deptIdStr = res.data.deptId;
                        res.data.roleIdStr = res.data.roleId;
                        res.data.roleId = res.data.roleId.split(",");
                        res.data.deptId = [res.data.deptId];
                        Object.assign(this.form, res.data);
                        console.log(this.form);
                    }
                })
            },
             //表单注入数据
            setData(data){
                this.form.id = data.id
                this.form.userName = data.userName
                this.form.avatar = data.avatar
                this.form.name = data.name
                this.form.group = data.group
                this.form.dept = data.dept

                //可以和上面一样单个注入，也可以像下面一样直接合并进去
                //Object.assign(this.form, data)
                this.showDetail(data);
            }
        }
    }

 src/views/console/system/user.vue

@@ -11,8 +11,8 @@
        <div class="user-top">
            <div class="right-bottom"> 
                <el-button type="primary" @click="addPerson">新建</el-button>
                <el-button type="primary" @click="addPerson">密码重置</el-button>
                <el-button type="danger" plain @click="delPerson">删除</el-button>
                <el-button type="primary" @click="resetPerson">密码重置</el-button>
                <el-button type="danger" plain @click="delData">删除</el-button>
            </div>
            <div>
                <el-input v-model="searchData.account" placeholder="账号" style="width: 180px;margin-right: 8px;" clearable></el-input>
@@ -70,15 +70,6 @@
        </template>
    </el-dialog>

    <el-dialog v-model="dialogVisible" width="500" :before-close="handleClose">
        <span>确定将选择账号解锁?</span>
        <template #footer>
        <div class="dialog-footer">
            <el-button @click="dialogVisible = false">取消</el-button>
            <el-button type="primary" @click="dialogVisible = false">确定</el-button>
        </div>
        </template>
    </el-dialog>
    <save-dialog v-if="dialog.save" ref="saveDialog" @success="addUserSuccess" @closed="dialog.save=false"></save-dialog>
</template>
<script>
@@ -87,6 +78,7 @@
        name: "bakalaka",
        data(){
            return {
                selection: [],
                searchData: {
                    account: "",
                    realName: "",
@@ -94,7 +86,6 @@
                    size: "15"
                },
                total: 0,
                dialogVisible: false,
                isSaveing: false,
                groups: [],
                departmentFrom: {
@@ -164,8 +155,21 @@
                    //取消
                })
            },
            table_unlock() {
                this.dialogVisible = true;
            table_unlock(row) {
                this.$confirm('确定将选择账号解锁?？','提示', {
                    type: 'warning',
                }).then(() => {
                    this.$HTTP.post("/api/blade-user/unlock?userId="+row.id).then(res=> {
                        if(res.code == 200) {
                            this.searchclick();
                            this.$message.success("操作成功");
                        }else {
                            this.$alert(res.message, "提示", {type: 'error'});
                        }
                    })
                }).catch(() => {
                    //取消
                })
            },
            searchclick() {
                this.searchData.current = "1";
@@ -211,8 +215,67 @@
                    this.$refs.saveDialog.open('show').setData(row)
                })
            },
            handleSelectionChange() {},
            delPerson() {},
            handleSelectionChange(selection) {
                this.selection = selection;
            },
            resetPerson() {
                if(this.selection.length == 0) {
                    this.$message({
                      message: '请选择至少一条数据',
                      type: 'warning'
                    });
                    return;
                }
                var selStr = "";
                this.selection.map(item=> {
                    selStr += item.id + ","
                })
                selStr = selStr.replace(/,$/, '');
                var that = this;
                this.$confirm('是否确认删除选中账号？','提示', {
                    type: 'warning',
                }).then(() => {
                    that.$HTTP.post("/api/blade-user/reset-password?userIds="+selStr).then(res=> {
                        if(res.code == 200) {
                            that.$message.success("操作成功");
                            that.searchUser();
                        }
                    })
                }).catch(() => {
                    //取消
                })
            },
            delData() {
                if(this.selection.length == 0) {
                    this.$message({
                      message: '请选择至少一条数据',
                      type: 'warning'
                    });
                    return;
                }
                var selStr = "";
                this.selection.map(item=> {
                    selStr += item.id + ","
                })
                selStr = selStr.replace(/,$/, '');
                var that = this;
                this.$HTTP.get("/api/blade-user/check-user-is-bind-employee?userIds="+selStr).then(res=> {
                    if(res.code == 200) {
                        this.$confirm('是否确认删除选中账号？','提示', {
                            type: 'warning',
                        }).then(() => {
                            that.$HTTP.post("/api/blade-user/remove?ids="+selStr).then(res=> {
                                if(res.code == 200) {
                                    that.$message.success("操作成功");
                                    that.searchUser();
                                }
                            })
                        }).catch(() => {
                            //取消
                        })
                    }
                })
            },
            changeDepartment() {
                this.departmentVisible = true;
            },