tao.chen/model-platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updata:admin.css替用

Browse Source
This commit is contained in:
xiaozhu
2026-08-27 15:07:25 +08:00
parent 213490f8ac
commit 433c68998e
9 changed files with 226 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/app/features/admin/RoleManagementPage.tsx
+31 -18
View File
@@ -22,8 +22,21 @@ import {
TableRow,
} from "~/components/ui/table";
import { AdminColgroup, ROLE_COL_WIDTHS } from "./AdminTable";
import "../../styles/admin.css";
import {
adminEmptyClass,
adminPageClass,
adminReadonlyClass,
adminToolbarClass,
adminToolbarInputClass,
adminToolbarSearchClass,
builtinBadgeClass,
permissionCountClass,
roleActionsClass,
roleCodeClass,
roleNameClass,
rowButtonClass,
rowDangerButtonClass,
} from "./adminUi";
const PRIMARY_BUTTON_CLASS =
"h-[37px] gap-[7px] rounded-md border border-[#126ac3] bg-gradient-to-br from-[#1881e7] to-[#1268c9] px-[15px] text-xs font-[650] text-white shadow-[0_6px_15px_rgb(20_111_202/18%)] enabled:hover:from-[#1175d8] enabled:hover:to-[#0e5bad]";
@@ -177,14 +190,14 @@ export function RoleManagementPage({
});
return (
<section className="admin-page">
<div className="admin-toolbar">
<div className="admin-toolbar__search">
<section className={adminPageClass}>
<div className={adminToolbarClass}>
<div className={adminToolbarSearchClass}>
<Search size={14} />
<input
type="text"
placeholder="搜索角色编码 / 名称"
className="admin-toolbar__input"
className={adminToolbarInputClass}
value={searchTerm}
onChange={(event) => setSearchTerm(event.target.value)}
/>
@@ -203,9 +216,9 @@ export function RoleManagementPage({
</div>
{!canManage && (
<div className="admin-readonly">当前为开发人员，只能查看角色列表。</div>
<div className={adminReadonlyClass}>当前为开发人员，只能查看角色列表。</div>
)}
{loadError && <div className="admin-readonly">{loadError}</div>}
{loadError && <div className={adminReadonlyClass}>{loadError}</div>}
<Table className="rounded-[9px] border border-[#dfe7ef] overflow-hidden text-[11px] text-[#44576a] [--border-color:#dfe7ef] table-fixed bg-white">
<AdminColgroup widths={ROLE_COL_WIDTHS} />
@@ -222,13 +235,13 @@ export function RoleManagementPage({
{loading ? (
<TableRow className="min-h-[60px] border-t border-[#edf1f5] hover:bg-[#f7fafc] data-[state=selected]:bg-transparent">
<TableCell colSpan={5} className="p-0">
<p className="admin-empty">正在加载角色…</p>
<p className={adminEmptyClass}>正在加载角色…</p>
</TableCell>
</TableRow>
) : filteredRoles.length === 0 ? (
<TableRow className="min-h-[60px] border-t border-[#edf1f5] hover:bg-[#f7fafc] data-[state=selected]:bg-transparent">
<TableCell colSpan={5} className="p-0">
<p className="admin-empty">
<p className={adminEmptyClass}>
{roles.length === 0 ? "暂无角色" : "没有匹配的角色"}
</p>
</TableCell>
@@ -236,22 +249,22 @@ export function RoleManagementPage({
) : (
filteredRoles.map((role) => (
<TableRow key={role.role_id} className="min-h-[60px] border-t border-[#edf1f5] hover:bg-[#f7fafc] data-[state=selected]:bg-transparent">
<TableCell className="p-3 px-4 align-middle"><code className="role-code">{role.role_code}</code></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className="role-name">{role.role_name}</span></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className={`builtin-badge${role.is_builtin ? "" : " is-custom"}`}>
<TableCell className="p-3 px-4 align-middle"><code className={roleCodeClass}>{role.role_code}</code></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className={roleNameClass}>{role.role_name}</span></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className={builtinBadgeClass(role.is_builtin)}>
{role.is_builtin ? "内置" : "自定义"}
</span></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className="permission-count">
<TableCell className="p-3 px-4 align-middle"><span className={permissionCountClass}>
{role.permission_codes.length} 项权限
</span></TableCell>
<TableCell className="p-3 px-4 align-middle"><span className="role-actions">
<TableCell className="p-3 px-4 align-middle"><span className={roleActionsClass}>
<Button
variant="outline"
size="xs"
type="button"
disabled={!canManage}
onClick={() => openEdit(role)}
className="h-6 gap-1 rounded-[4px] border-[#d9e3ec] bg-white px-[9px] text-[11px] text-[#4c6c88] hover:bg-[#f7fafc] disabled:cursor-not-allowed disabled:opacity-[0.45]"
className={rowButtonClass}
>
编辑
</Button>
@@ -261,7 +274,7 @@ export function RoleManagementPage({
type="button"
disabled={!canManage}
onClick={() => openPermissions(role)}
className="h-6 gap-1 rounded-[4px] border-[#d9e3ec] bg-white px-[9px] text-[11px] text-[#4c6c88] hover:bg-[#f7fafc] disabled:cursor-not-allowed disabled:opacity-[0.45]"
className={rowButtonClass}
>
权限
</Button>
@@ -272,7 +285,7 @@ export function RoleManagementPage({
disabled={!canManage || role.is_builtin}
title={role.is_builtin ? "内置角色不可删除" : "删除角色"}
onClick={() => setDeleteTarget(role)}
className="h-6 gap-1 rounded-[4px] border-red-200 bg-white px-[9px] text-[11px] text-red-700 hover:bg-red-50 disabled:cursor-not-allowed disabled:opacity-[0.45]"
className={rowDangerButtonClass}
>
删除
</Button>