style: 統一全系統按鈕樣式、新增表格序號欄位、移除裝飾性圖示並同步頁面邊距
This commit is contained in:
@@ -54,8 +54,8 @@ export default function RoleIndex({ roles }: Props) {
|
||||
>
|
||||
<Head title="角色管理" />
|
||||
|
||||
<div className="p-8 max-w-7xl mx-auto space-y-6">
|
||||
<div className="flex items-center justify-between">
|
||||
<div className="container mx-auto p-6 max-w-7xl">
|
||||
<div className="flex items-center justify-between mb-6">
|
||||
<div>
|
||||
<h1 className="text-2xl font-bold text-grey-0 flex items-center gap-2">
|
||||
<Shield className="h-6 w-6 text-[#01ab83]" />
|
||||
@@ -66,7 +66,7 @@ export default function RoleIndex({ roles }: Props) {
|
||||
</p>
|
||||
</div>
|
||||
<Link href={route('roles.create')}>
|
||||
<Button className="bg-[#01ab83] hover:bg-[#019a76]">
|
||||
<Button className="button-filled-primary">
|
||||
<Plus className="h-4 w-4 mr-2" />
|
||||
新增角色
|
||||
</Button>
|
||||
@@ -77,7 +77,8 @@ export default function RoleIndex({ roles }: Props) {
|
||||
<Table>
|
||||
<TableHeader className="bg-gray-50">
|
||||
<TableRow>
|
||||
<TableHead className="w-[200px]">角色名稱</TableHead>
|
||||
<TableHead className="w-[50px] text-center">#</TableHead>
|
||||
<TableHead>名稱</TableHead>
|
||||
<TableHead>代號</TableHead>
|
||||
<TableHead className="text-center">權限數量</TableHead>
|
||||
<TableHead className="text-center">使用者人數</TableHead>
|
||||
@@ -86,13 +87,13 @@ export default function RoleIndex({ roles }: Props) {
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{roles.map((role) => (
|
||||
{roles.map((role, index) => (
|
||||
<TableRow key={role.id}>
|
||||
<TableCell className="text-gray-500 font-medium text-center">
|
||||
{index + 1}
|
||||
</TableCell>
|
||||
<TableCell className="font-medium">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="p-2 bg-gray-100 rounded-lg">
|
||||
<Shield className="h-4 w-4 text-gray-500" />
|
||||
</div>
|
||||
{translateRoleName(role.name)}
|
||||
</div>
|
||||
</TableCell>
|
||||
@@ -120,7 +121,7 @@ export default function RoleIndex({ roles }: Props) {
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="button-outlined-primary h-8 w-8 p-0"
|
||||
className="button-outlined-primary"
|
||||
title="編輯"
|
||||
>
|
||||
<Pencil className="h-4 w-4" />
|
||||
@@ -129,7 +130,7 @@ export default function RoleIndex({ roles }: Props) {
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="button-outlined-error h-8 w-8 p-0"
|
||||
className="button-outlined-error"
|
||||
title="刪除"
|
||||
disabled={role.users_count > 0}
|
||||
onClick={() => handleDelete(role.id, translateRoleName(role.name))}
|
||||
|
||||
Reference in New Issue
Block a user