xiongyuxing/gongxue-base
1
0
Fork 0
forked from wangziqi/gongxue-base
Code Pull Requests Activity

chore: commit oxfmt formatting changes and verify artifacts

Browse Source
This commit is contained in:
wangziqi
2026-07-02 15:55:09 +08:00
parent 34726cc46d
commit 4f4cee157a
77 changed files with 5576 additions and 1400 deletions
Download Patch File Download Diff File Expand all files Collapse all files

161
apps/admin/src/pages/Roles/index.tsx
View File

@@ -1,5 +1,17 @@
import React, { useEffect, useState } from 'react';
import { Table, Button, Modal, Form, Input, Space, Tag, Popconfirm, message, Card, Checkbox } from 'antd';
import {
Table,
Button,
Modal,
Form,
Input,
Space,
Tag,
Popconfirm,
message,
Card,
Checkbox,
} from 'antd';
import { PlusOutlined, EditOutlined, DeleteOutlined } from '@ant-design/icons';
import api from '../../api';
import PermissionButton from '../../components/PermissionButton';
@@ -34,15 +46,21 @@ const RolesPage: React.FC = () => {
try {
const [roles, permTree] = await Promise.all([
api.get('/rbac/roles') as Promise<RoleItem[]>,
api.get('/rbac/permissions/tree') as Promise<{ group: string; permissions: PermissionItem[] }[]>,
api.get('/rbac/permissions/tree') as Promise<
{ group: string; permissions: PermissionItem[] }[]
>,
]);
setData(roles);
setAllPerms(permTree);
} catch (e) { console.error(e); }
} catch (e) {
console.error(e);
}
setLoading(false);
};
useEffect(() => { fetchData(); }, []);
useEffect(() => {
fetchData();
}, []);
const handleAdd = () => {
setEditing(null);
@@ -54,7 +72,7 @@ const RolesPage: React.FC = () => {
const handleEdit = (record: RoleItem) => {
setEditing(record);
form.setFieldsValue({ name: record.name, description: record.description });
setSelectedPermIds(record.permissions.map(p => p.id));
setSelectedPermIds(record.permissions.map((p) => p.id));
setModalOpen(true);
};
@@ -62,15 +80,25 @@ const RolesPage: React.FC = () => {
const values = await form.validateFields();
try {
if (editing) {
await api.put(`/rbac/roles/${editing.id}`, { name: values.name, description: values.description, permissionIds: selectedPermIds });
await api.put(`/rbac/roles/${editing.id}`, {
name: values.name,
description: values.description,
permissionIds: selectedPermIds,
});
message.success('角色更新成功');
} else {
await api.post('/rbac/roles', { name: values.name, description: values.description, permissionIds: selectedPermIds });
await api.post('/rbac/roles', {
name: values.name,
description: values.description,
permissionIds: selectedPermIds,
});
message.success('角色创建成功');
}
setModalOpen(false);
fetchData();
} catch (e: any) { message.error(e.message || '操作失败'); }
} catch (e: any) {
message.error(e.message || '操作失败');
}
};
const handleDelete = async (id: number) => {
@@ -78,14 +106,25 @@ const RolesPage: React.FC = () => {
await api.delete(`/rbac/roles/${id}`);
message.success('角色已删除');
fetchData();
} catch (e: any) { message.error(e.message || '删除失败'); }
} catch (e: any) {
message.error(e.message || '删除失败');
}
};
const groupNames: Record<string, string> = {
dashboard: '数据面板', student: '学生管理', room: '宿舍管理', occupancy: '入住管理',
expense: '费用管理', bill: '账单管理', deposit: '押金管理',
classroom: '教室管理', tenant: '租赁方', rental: '租赁订单',
log: '操作日志', user: '用户管理', role: '角色管理',
dashboard: '数据面板',
student: '学生管理',
room: '宿舍管理',
occupancy: '入住管理',
expense: '费用管理',
bill: '账单管理',
deposit: '押金管理',
classroom: '教室管理',
tenant: '租赁方',
rental: '租赁订单',
log: '操作日志',
user: '用户管理',
role: '角色管理',
};
const columns = [
@@ -93,26 +132,44 @@ const RolesPage: React.FC = () => {
{ title: '名称', dataIndex: 'name', width: 120 },
{ title: '描述', dataIndex: 'description', width: 200, ellipsis: true },
{
title: '权限标签', dataIndex: 'permissions', width: 150, ellipsis: true,
render: (perms: PermissionItem[]) => perms?.length > 0
? <Tag color="blue">{perms.length} 个权限</Tag>
: <Tag color="default">无权限</Tag>,
title: '权限标签',
dataIndex: 'permissions',
width: 150,
ellipsis: true,
render: (perms: PermissionItem[]) =>
perms?.length > 0 ? (
<Tag color="blue">{perms.length} 个权限</Tag>
) : (
<Tag color="default">无权限</Tag>
),
},
{
title: '系统', dataIndex: 'isSystem', width: 70,
render: (v: boolean) => v ? <Tag color="orange">系统</Tag> : null,
title: '系统',
dataIndex: 'isSystem',
width: 70,
render: (v: boolean) => (v ? <Tag color="orange">系统</Tag> : null),
},
{
title: '操作', width: 160, fixed: 'right' as const,
title: '操作',
width: 160,
fixed: 'right' as const,
render: (_: any, record: RoleItem) => (
<Space>
<PermissionButton permission="role:edit" type="link" size="small" icon={<EditOutlined />} onClick={() => handleEdit(record)}>
<PermissionButton
permission="role:edit"
type="link"
size="small"
icon={<EditOutlined />}
onClick={() => handleEdit(record)}
>
编辑
</PermissionButton>
{!record.isSystem && (
<PermissionButton permission="role:delete">
<Popconfirm title="确认删除该角色？" onConfirm={() => handleDelete(record.id)}>
<Button type="link" size="small" danger icon={<DeleteOutlined />}>删除</Button>
<Button type="link" size="small" danger icon={<DeleteOutlined />}>
删除
</Button>
</Popconfirm>
</PermissionButton>
)}
@@ -122,34 +179,56 @@ const RolesPage: React.FC = () => {
];
const handleGroupCheckAll = (group: string, checked: boolean) => {
const groupPermIds = allPerms.find(g => g.group === group)?.permissions.map(p => p.id) || [];
const groupPermIds =
allPerms.find((g) => g.group === group)?.permissions.map((p) => p.id) || [];
if (checked) {
setSelectedPermIds(prev => [...new Set([...prev, ...groupPermIds])]);
setSelectedPermIds((prev) => [...new Set([...prev, ...groupPermIds])]);
} else {
setSelectedPermIds(prev => prev.filter(id => !groupPermIds.includes(id)));
setSelectedPermIds((prev) => prev.filter((id) => !groupPermIds.includes(id)));
}
};
const isGroupAllChecked = (group: string) => {
const groupPermIds = allPerms.find(g => g.group === group)?.permissions.map(p => p.id) || [];
return groupPermIds.length > 0 && groupPermIds.every(id => selectedPermIds.includes(id));
const groupPermIds =
allPerms.find((g) => g.group === group)?.permissions.map((p) => p.id) || [];
return groupPermIds.length > 0 && groupPermIds.every((id) => selectedPermIds.includes(id));
};
const isGroupIndeterminate = (group: string) => {
const groupPermIds = allPerms.find(g => g.group === group)?.permissions.map(p => p.id) || [];
const checkedCount = groupPermIds.filter(id => selectedPermIds.includes(id)).length;
const groupPermIds =
allPerms.find((g) => g.group === group)?.permissions.map((p) => p.id) || [];
const checkedCount = groupPermIds.filter((id) => selectedPermIds.includes(id)).length;
return checkedCount > 0 && checkedCount < groupPermIds.length;
};
return (
<div>
<div style={{ marginBottom: 16, display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div
style={{
marginBottom: 16,
display: 'flex',
justifyContent: 'space-between',
alignItems: 'center',
}}
>
<h2 style={{ margin: 0 }}>角色管理</h2>
<PermissionButton permission="role:create" type="primary" icon={<PlusOutlined />} onClick={handleAdd}>
<PermissionButton
permission="role:create"
type="primary"
icon={<PlusOutlined />}
onClick={handleAdd}
>
新增角色
</PermissionButton>
</div>
<Table columns={columns} dataSource={data} rowKey="id" loading={loading} scroll={{ x: 800 }} pagination={false} />
<Table
columns={columns}
dataSource={data}
rowKey="id"
loading={loading}
scroll={{ x: 800 }}
pagination={false}
/>
<Modal
title={editing ? '编辑角色' : '新增角色'}
@@ -160,7 +239,11 @@ const RolesPage: React.FC = () => {
destroyOnClose
>
<Form form={form} layout="vertical">
<Form.Item name="name" label="角色名称" rules={[{ required: true, message: '请输入角色名称' }]}>
<Form.Item
name="name"
label="角色名称"
rules={[{ required: true, message: '请输入角色名称' }]}
>
<Input disabled={editing?.isSystem} />
</Form.Item>
<Form.Item name="description" label="角色描述">
@@ -168,7 +251,7 @@ const RolesPage: React.FC = () => {
</Form.Item>
<Form.Item label="权限分配">
<div style={{ maxHeight: 400, overflow: 'auto' }}>
{allPerms.map(group => (
{allPerms.map((group) => (
<Card
key={group.group}
size="small"
@@ -176,7 +259,7 @@ const RolesPage: React.FC = () => {
<Checkbox
checked={isGroupAllChecked(group.group)}
indeterminate={isGroupIndeterminate(group.group)}
onChange={e => handleGroupCheckAll(group.group, e.target.checked)}
onChange={(e) => handleGroupCheckAll(group.group, e.target.checked)}
>
{groupNames[group.group] || group.group}
</Checkbox>
@@ -185,11 +268,13 @@ const RolesPage: React.FC = () => {
>
<Checkbox.Group
value={selectedPermIds}
onChange={vals => setSelectedPermIds(vals as number[])}
onChange={(vals) => setSelectedPermIds(vals as number[])}
>
<Space wrap>
{group.permissions.map(p => (
<Checkbox key={p.id} value={p.id}>{p.name}</Checkbox>
{group.permissions.map((p) => (
<Checkbox key={p.id} value={p.id}>
{p.name}
</Checkbox>
))}
</Space>
</Checkbox.Group>