role
This commit is contained in:
parent
ef84a0b097
commit
5562ef1099
|
|
@ -12,7 +12,7 @@ import type {
|
|||
* 获取角色列表
|
||||
* @returns Promise<RoleListResponse> 角色列表数据
|
||||
*/
|
||||
export async function getRoleList(): Promise<RoleListResponse> {
|
||||
export async function getRoleApi(): Promise<RoleListResponse> {
|
||||
return request.get<RoleListResponse>('/roles/list');
|
||||
}
|
||||
|
||||
|
|
@ -21,7 +21,7 @@ export async function getRoleList(): Promise<RoleListResponse> {
|
|||
* @param params 角色名称、标题
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
export async function createRole(params: RoleFormParams): Promise<void> {
|
||||
export async function createRoleApi(params: RoleFormParams): Promise<void> {
|
||||
return request.post<void>('/roles/create', params);
|
||||
}
|
||||
|
||||
|
|
@ -30,7 +30,7 @@ export async function createRole(params: RoleFormParams): Promise<void> {
|
|||
* @param params 角色ID、名称、标题
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
export async function editRole(params: RoleFormParams): Promise<void> {
|
||||
export async function editRoleApi(params: RoleFormParams): Promise<void> {
|
||||
return request.post<void>('/roles/edit', params);
|
||||
}
|
||||
|
||||
|
|
@ -39,7 +39,7 @@ export async function editRole(params: RoleFormParams): Promise<void> {
|
|||
* @param params 角色ID
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
export async function deleteRole(params: DeleteRoleParams): Promise<void> {
|
||||
export async function deleteRoleApi(params: DeleteRoleParams): Promise<void> {
|
||||
return request.post<void>('/roles/del', params);
|
||||
}
|
||||
|
||||
|
|
@ -48,7 +48,7 @@ export async function deleteRole(params: DeleteRoleParams): Promise<void> {
|
|||
* @param params 角色ID + 权限ID列表(逗号分隔字符串)
|
||||
* @returns Promise<void>
|
||||
*/
|
||||
export async function setRolePermission(params: SetRolePermissionParams): Promise<void> {
|
||||
export async function setRolePermissionApi(params: SetRolePermissionParams): Promise<void> {
|
||||
return request.post<void>('/roles/setPermission', params);
|
||||
}
|
||||
|
||||
|
|
@ -57,6 +57,6 @@ export async function setRolePermission(params: SetRolePermissionParams): Promis
|
|||
* @param params 角色ID
|
||||
* @returns Promise<PermissionIdsResponse> 权限ID数组
|
||||
*/
|
||||
export async function getRolePermission(params: GetRolePermissionParams): Promise<PermissionIdsResponse> {
|
||||
export async function getRolePermissionApi(params: GetRolePermissionParams): Promise<PermissionIdsResponse> {
|
||||
return request.get<PermissionIdsResponse>('/roles/getPermission', { id: params.id });
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@use './user.scss';
|
||||
|
||||
@use './system.scss';
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,8 @@
|
|||
.system {
|
||||
.header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,8 +1,8 @@
|
|||
<template>
|
||||
<div class="menu-list">
|
||||
<div class="system">
|
||||
<!-- 缺少通配搜索组件 -->
|
||||
|
||||
<div class="menu-action">
|
||||
<div class="header">
|
||||
<h4>菜单列表</h4>
|
||||
<el-button type="primary" :icon="Plus" @click="handleAddMenu">新增菜单</el-button>
|
||||
</div>
|
||||
|
|
@ -254,14 +254,3 @@ const handleToggleStatus = async (row: any) => {
|
|||
ElMessage.success(`已${row.status === 1 ? '启用' : '禁用'}`)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.menu-list {
|
||||
.menu-action {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,92 @@
|
|||
<template>
|
||||
<div class="role-list">
|
||||
<h1>角色列表</h1>
|
||||
<div class="system">
|
||||
<!-- 缺少通配搜索组件 -->
|
||||
|
||||
<div class="header">
|
||||
<h4>菜单列表</h4>
|
||||
<el-button type="primary" :icon="Plus" @click="handleAddRole">新增角色</el-button>
|
||||
</div>
|
||||
<div class="table-container">
|
||||
<el-table :data="roleTree" row-key="id" border highlight-current-row>
|
||||
<el-table-column prop="name" label="角色名称" />
|
||||
<el-table-column prop="title" label="角色描述" />
|
||||
<el-table-column prop="status" label="角色状态">
|
||||
<template #default="{ row }">
|
||||
<el-tag size="small" :type="row.status === 1 ? 'success' : 'danger'">
|
||||
{{ row.status === 1 ? '启用' : '禁用' }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="created_at" label="创建时间" />
|
||||
<el-table-column label="操作">
|
||||
<template #default="{ row }">
|
||||
<el-button link type="primary" size="small" @click="handleEditMenu(row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button link type="danger" size="small" @click="handleDeleteMenu(row)">
|
||||
删除
|
||||
</el-button>
|
||||
<el-button link size="small" :type="row.status === 1 ? 'warning' : 'success'"
|
||||
@click="handleToggleStatus(row)">
|
||||
{{ row.status === 1 ? '禁用' : '启用' }}
|
||||
</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增角色' : '编辑角色'" width="600px"
|
||||
destroy-on-close>
|
||||
<el-form>
|
||||
<el-form-item label="角色名称" prop="name">
|
||||
<el-input placeholder="请输入角色名称" />
|
||||
</el-form-item>
|
||||
<el-form-item label="角色描述" prop="path">
|
||||
<el-input placeholder="请输入角色描述" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="() => { { dialogVisible = false, dialogType = 'add' } }">取消</el-button>
|
||||
<el-button type="primary" @click="handleSubmitRole">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { Plus } from '@element-plus/icons-vue'
|
||||
import { createRoleApi, deleteRoleApi, editRoleApi, getRoleApi } from '@/api/modules/role'
|
||||
const roleTree = ref<any[]>([
|
||||
{
|
||||
id: 1,
|
||||
name: "admin",
|
||||
title: "平台",
|
||||
status: 1,
|
||||
created_at: "2026-02-05 06:12:03"
|
||||
}
|
||||
])
|
||||
// 定义弹窗显示状态
|
||||
const dialogVisible = ref(true)
|
||||
// 新增:区分新增/编辑模式
|
||||
const dialogType = ref<'add' | 'edit'>('add')
|
||||
onMounted(async () => {
|
||||
const res = await getRoleApi()
|
||||
roleTree.value = res || []
|
||||
})
|
||||
const handleAddRole = () => {
|
||||
console.log('新增角色');
|
||||
}
|
||||
const handleSubmitRole = () => {
|
||||
console.log('提交角色');
|
||||
}
|
||||
const handleEditRole = (row: any) => {
|
||||
console.log('编辑角色', row);
|
||||
}
|
||||
const handleDeleteRole = (row: any) => {
|
||||
console.log('删除角色', row);
|
||||
}
|
||||
const handleToggleStatus = (row: any) => {
|
||||
console.log('切换状态状态', row);
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Reference in New Issue