|
|
|
@ -1,48 +1,20 @@ |
|
|
|
<template> |
|
|
|
<template> |
|
|
|
<div class="app-container"> |
|
|
|
<div class="app-container app-container-bg"> |
|
|
|
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" label-width="68px"> |
|
|
|
<el-card class="first-card" ref='firstCard' shadow="always"> |
|
|
|
|
|
|
|
<el-form :model="queryParams" ref="queryRef" v-show="showSearch" :inline="true" @submit.native.prevent> |
|
|
|
<el-form-item label="角色名称" prop="roleName"> |
|
|
|
<el-form-item label="角色名称" prop="roleName"> |
|
|
|
<el-input |
|
|
|
<el-input v-model="queryParams.roleName" placeholder="请输入角色名称" clearable style="width: 240px" @keyup.enter="handleQuery" /> |
|
|
|
v-model="queryParams.roleName" |
|
|
|
|
|
|
|
placeholder="请输入角色名称" |
|
|
|
|
|
|
|
clearable |
|
|
|
|
|
|
|
style="width: 240px" |
|
|
|
|
|
|
|
@keyup.enter="handleQuery" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="权限字符" prop="roleKey"> |
|
|
|
<el-form-item label="权限字符" prop="roleKey"> |
|
|
|
<el-input |
|
|
|
<el-input v-model="queryParams.roleKey" placeholder="请输入权限字符" clearable style="width: 240px" @keyup.enter="handleQuery" /> |
|
|
|
v-model="queryParams.roleKey" |
|
|
|
|
|
|
|
placeholder="请输入权限字符" |
|
|
|
|
|
|
|
clearable |
|
|
|
|
|
|
|
style="width: 240px" |
|
|
|
|
|
|
|
@keyup.enter="handleQuery" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="状态" prop="status"> |
|
|
|
<el-form-item label="状态" prop="status"> |
|
|
|
<el-select |
|
|
|
<el-select v-model="queryParams.status" placeholder="角色状态" clearable style="width: 240px"> |
|
|
|
v-model="queryParams.status" |
|
|
|
<el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" /> |
|
|
|
placeholder="角色状态" |
|
|
|
|
|
|
|
clearable |
|
|
|
|
|
|
|
style="width: 240px" |
|
|
|
|
|
|
|
> |
|
|
|
|
|
|
|
<el-option |
|
|
|
|
|
|
|
v-for="dict in sys_normal_disable" |
|
|
|
|
|
|
|
:key="dict.value" |
|
|
|
|
|
|
|
:label="dict.label" |
|
|
|
|
|
|
|
:value="dict.value" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
</el-select> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="创建时间" style="width: 308px"> |
|
|
|
<el-form-item label="创建时间" style="width: 308px"> |
|
|
|
<el-date-picker |
|
|
|
<el-date-picker v-model="dateRange" value-format="YYYY-MM-DD" type="daterange" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期"></el-date-picker> |
|
|
|
v-model="dateRange" |
|
|
|
|
|
|
|
value-format="YYYY-MM-DD" |
|
|
|
|
|
|
|
type="daterange" |
|
|
|
|
|
|
|
range-separator="-" |
|
|
|
|
|
|
|
start-placeholder="开始日期" |
|
|
|
|
|
|
|
end-placeholder="结束日期" |
|
|
|
|
|
|
|
></el-date-picker> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-form-item> |
|
|
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> |
|
|
|
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> |
|
|
|
@ -51,48 +23,24 @@ |
|
|
|
</el-form> |
|
|
|
</el-form> |
|
|
|
<el-row :gutter="10" class="mb8"> |
|
|
|
<el-row :gutter="10" class="mb8"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['system:role:add']">新增</el-button> |
|
|
|
type="primary" |
|
|
|
|
|
|
|
plain |
|
|
|
|
|
|
|
icon="Plus" |
|
|
|
|
|
|
|
@click="handleAdd" |
|
|
|
|
|
|
|
v-hasPermi="['system:role:add']" |
|
|
|
|
|
|
|
>新增</el-button> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-col> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate" v-hasPermi="['system:role:edit']">修改</el-button> |
|
|
|
type="success" |
|
|
|
|
|
|
|
plain |
|
|
|
|
|
|
|
icon="Edit" |
|
|
|
|
|
|
|
:disabled="single" |
|
|
|
|
|
|
|
@click="handleUpdate" |
|
|
|
|
|
|
|
v-hasPermi="['system:role:edit']" |
|
|
|
|
|
|
|
>修改</el-button> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-col> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete" v-hasPermi="['system:role:remove']">删除</el-button> |
|
|
|
type="danger" |
|
|
|
|
|
|
|
plain |
|
|
|
|
|
|
|
icon="Delete" |
|
|
|
|
|
|
|
:disabled="multiple" |
|
|
|
|
|
|
|
@click="handleDelete" |
|
|
|
|
|
|
|
v-hasPermi="['system:role:remove']" |
|
|
|
|
|
|
|
>删除</el-button> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-col> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-col :span="1.5"> |
|
|
|
<el-button |
|
|
|
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['system:role:export']">导出</el-button> |
|
|
|
type="warning" |
|
|
|
|
|
|
|
plain |
|
|
|
|
|
|
|
icon="Download" |
|
|
|
|
|
|
|
@click="handleExport" |
|
|
|
|
|
|
|
v-hasPermi="['system:role:export']" |
|
|
|
|
|
|
|
>导出</el-button> |
|
|
|
|
|
|
|
</el-col> |
|
|
|
</el-col> |
|
|
|
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> |
|
|
|
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar> |
|
|
|
</el-row> |
|
|
|
</el-row> |
|
|
|
|
|
|
|
</el-card> |
|
|
|
|
|
|
|
|
|
|
|
<!-- 表格数据 --> |
|
|
|
<!-- 表格数据 --> |
|
|
|
<el-table v-loading="loading" :data="roleList" @selection-change="handleSelectionChange"> |
|
|
|
<div class="el-card-p card-shadow carder-border mt10 pad10 "> |
|
|
|
|
|
|
|
<el-table v-table-height v-loading="loading" :data="roleList" @selection-change="handleSelectionChange"> |
|
|
|
<el-table-column type="selection" width="55" align="center" /> |
|
|
|
<el-table-column type="selection" width="55" align="center" /> |
|
|
|
<el-table-column label="角色编号" prop="roleId" width="120" /> |
|
|
|
<el-table-column label="角色编号" prop="roleId" width="120" /> |
|
|
|
<el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" width="150" /> |
|
|
|
<el-table-column label="角色名称" prop="roleName" :show-overflow-tooltip="true" width="150" /> |
|
|
|
@ -100,12 +48,7 @@ |
|
|
|
<el-table-column label="显示顺序" prop="roleSort" width="100" /> |
|
|
|
<el-table-column label="显示顺序" prop="roleSort" width="100" /> |
|
|
|
<el-table-column label="状态" align="center" width="100"> |
|
|
|
<el-table-column label="状态" align="center" width="100"> |
|
|
|
<template #default="scope"> |
|
|
|
<template #default="scope"> |
|
|
|
<el-switch |
|
|
|
<el-switch v-model="scope.row.status" active-value="0" inactive-value="1" @change="handleStatusChange(scope.row)"></el-switch> |
|
|
|
v-model="scope.row.status" |
|
|
|
|
|
|
|
active-value="0" |
|
|
|
|
|
|
|
inactive-value="1" |
|
|
|
|
|
|
|
@change="handleStatusChange(scope.row)" |
|
|
|
|
|
|
|
></el-switch> |
|
|
|
|
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="创建时间" align="center" prop="createTime"> |
|
|
|
<el-table-column label="创建时间" align="center" prop="createTime"> |
|
|
|
@ -131,14 +74,9 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
|
|
|
|
<pagination |
|
|
|
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" /> |
|
|
|
v-show="total > 0" |
|
|
|
|
|
|
|
:total="total" |
|
|
|
|
|
|
|
v-model:page="queryParams.pageNum" |
|
|
|
|
|
|
|
v-model:limit="queryParams.pageSize" |
|
|
|
|
|
|
|
@pagination="getList" |
|
|
|
|
|
|
|
/> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
<!-- 添加或修改角色配置对话框 --> |
|
|
|
<!-- 添加或修改角色配置对话框 --> |
|
|
|
<el-dialog :title="title" v-model="open" width="500px" append-to-body> |
|
|
|
<el-dialog :title="title" v-model="open" width="500px" append-to-body> |
|
|
|
<el-form ref="roleRef" :model="form" :rules="rules" label-width="100px"> |
|
|
|
<el-form ref="roleRef" :model="form" :rules="rules" label-width="100px"> |
|
|
|
@ -161,27 +99,14 @@ |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="状态"> |
|
|
|
<el-form-item label="状态"> |
|
|
|
<el-radio-group v-model="form.status"> |
|
|
|
<el-radio-group v-model="form.status"> |
|
|
|
<el-radio |
|
|
|
<el-radio v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.value">{{ dict.label }}</el-radio> |
|
|
|
v-for="dict in sys_normal_disable" |
|
|
|
|
|
|
|
:key="dict.value" |
|
|
|
|
|
|
|
:label="dict.value" |
|
|
|
|
|
|
|
>{{ dict.label }}</el-radio> |
|
|
|
|
|
|
|
</el-radio-group> |
|
|
|
</el-radio-group> |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="菜单权限"> |
|
|
|
<el-form-item label="菜单权限"> |
|
|
|
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox> |
|
|
|
<el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event, 'menu')">展开/折叠</el-checkbox> |
|
|
|
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox> |
|
|
|
<el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event, 'menu')">全选/全不选</el-checkbox> |
|
|
|
<el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox> |
|
|
|
<el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event, 'menu')">父子联动</el-checkbox> |
|
|
|
<el-tree |
|
|
|
<el-tree class="tree-border" :data="menuOptions" show-checkbox ref="menuRef" node-key="id" :check-strictly="!form.menuCheckStrictly" empty-text="加载中，请稍候" :props="{ label: 'label', children: 'children' }"></el-tree> |
|
|
|
class="tree-border" |
|
|
|
|
|
|
|
:data="menuOptions" |
|
|
|
|
|
|
|
show-checkbox |
|
|
|
|
|
|
|
ref="menuRef" |
|
|
|
|
|
|
|
node-key="id" |
|
|
|
|
|
|
|
:check-strictly="!form.menuCheckStrictly" |
|
|
|
|
|
|
|
empty-text="加载中，请稍候" |
|
|
|
|
|
|
|
:props="{ label: 'label', children: 'children' }" |
|
|
|
|
|
|
|
></el-tree> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="备注"> |
|
|
|
<el-form-item label="备注"> |
|
|
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input> |
|
|
|
<el-input v-model="form.remark" type="textarea" placeholder="请输入内容"></el-input> |
|
|
|
@ -206,29 +131,14 @@ |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="权限范围"> |
|
|
|
<el-form-item label="权限范围"> |
|
|
|
<el-select v-model="form.dataScope" @change="dataScopeSelectChange"> |
|
|
|
<el-select v-model="form.dataScope" @change="dataScopeSelectChange"> |
|
|
|
<el-option |
|
|
|
<el-option v-for="item in dataScopeOptions" :key="item.value" :label="item.label" :value="item.value"></el-option> |
|
|
|
v-for="item in dataScopeOptions" |
|
|
|
|
|
|
|
:key="item.value" |
|
|
|
|
|
|
|
:label="item.label" |
|
|
|
|
|
|
|
:value="item.value" |
|
|
|
|
|
|
|
></el-option> |
|
|
|
|
|
|
|
</el-select> |
|
|
|
</el-select> |
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
<el-form-item label="数据权限" v-show="form.dataScope == 2"> |
|
|
|
<el-form-item label="数据权限" v-show="form.dataScope == 2"> |
|
|
|
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox> |
|
|
|
<el-checkbox v-model="deptExpand" @change="handleCheckedTreeExpand($event, 'dept')">展开/折叠</el-checkbox> |
|
|
|
<el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox> |
|
|
|
<el-checkbox v-model="deptNodeAll" @change="handleCheckedTreeNodeAll($event, 'dept')">全选/全不选</el-checkbox> |
|
|
|
<el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox> |
|
|
|
<el-checkbox v-model="form.deptCheckStrictly" @change="handleCheckedTreeConnect($event, 'dept')">父子联动</el-checkbox> |
|
|
|
<el-tree |
|
|
|
<el-tree class="tree-border" :data="deptOptions" show-checkbox default-expand-all ref="deptRef" node-key="id" :check-strictly="!form.deptCheckStrictly" empty-text="加载中，请稍候" :props="{ label: 'label', children: 'children' }"></el-tree> |
|
|
|
class="tree-border" |
|
|
|
|
|
|
|
:data="deptOptions" |
|
|
|
|
|
|
|
show-checkbox |
|
|
|
|
|
|
|
default-expand-all |
|
|
|
|
|
|
|
ref="deptRef" |
|
|
|
|
|
|
|
node-key="id" |
|
|
|
|
|
|
|
:check-strictly="!form.deptCheckStrictly" |
|
|
|
|
|
|
|
empty-text="加载中，请稍候" |
|
|
|
|
|
|
|
:props="{ label: 'label', children: 'children' }" |
|
|
|
|
|
|
|
></el-tree> |
|
|
|
|
|
|
|
</el-form-item> |
|
|
|
</el-form-item> |
|
|
|
</el-form> |
|
|
|
</el-form> |
|
|
|
<template #footer> |
|
|
|
<template #footer> |
|
|
|
|
waibao2
3 days ago