mama/star-erp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: 統一全系統按鈕樣式、新增表格序號欄位、移除裝飾性圖示並同步頁面邊距

Browse Source
This commit is contained in:
sky121113
2026-01-13 14:23:45 +08:00
parent f0e6c6e4d1
commit 6600cde3bc
4 changed files with 30 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
resources/js/Components/PurchaseOrder/PurchaseOrderActions.tsx
View File

@@ -25,8 +25,8 @@ export function PurchaseOrderActions({
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-primary h-8 w-8 p-0" className="button-outlined-primary"
title="查看採購單" title="查看詳情"
> >
<Eye className="h-4 w-4" /> <Eye className="h-4 w-4" />
</Button> </Button>
@@ -35,8 +35,8 @@ export function PurchaseOrderActions({
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-primary h-8 w-8 p-0" className="button-outlined-primary"
title="編輯採購單" title="編輯"
> >
<Pencil className="h-4 w-4" /> <Pencil className="h-4 w-4" />
</Button> </Button>
@@ -44,9 +44,9 @@ export function PurchaseOrderActions({
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-error h-8 w-8 p-0" className="button-outlined-error"
title="刪除採購單" title="刪除"
onClick={handleDelete} onClick={() => onDelete?.(order.id)}
disabled={processing} disabled={processing}
> >
<Trash2 className="h-4 w-4" /> <Trash2 className="h-4 w-4" />

2
resources/js/Components/PurchaseOrder/PurchaseOrderTable.tsx
View File

@@ -119,7 +119,7 @@ export default function PurchaseOrderTable({
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow className="bg-gray-50/50"> <TableRow className="bg-gray-50/50">
<TableHead className="w-[50px]">#</TableHead> <TableHead className="w-[50px] text-center">#</TableHead>
<TableHead className="w-[180px]"> <TableHead className="w-[180px]">
<button <button
onClick={() => handleSort("poNumber")} onClick={() => handleSort("poNumber")}

21
resources/js/Pages/Admin/Role/Index.tsx
View File

@@ -54,8 +54,8 @@ export default function RoleIndex({ roles }: Props) {
> >
<Head title="角色管理" /> <Head title="角色管理" />
<div className="p-8 max-w-7xl mx-auto space-y-6"> <div className="container mx-auto p-6 max-w-7xl">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between mb-6">
<div> <div>
<h1 className="text-2xl font-bold text-grey-0 flex items-center gap-2"> <h1 className="text-2xl font-bold text-grey-0 flex items-center gap-2">
<Shield className="h-6 w-6 text-[#01ab83]" /> <Shield className="h-6 w-6 text-[#01ab83]" />
@@ -66,7 +66,7 @@ export default function RoleIndex({ roles }: Props) {
</p> </p>
</div> </div>
<Link href={route('roles.create')}> <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" /> <Plus className="h-4 w-4 mr-2" />
新增角色 新增角色
</Button> </Button>
@@ -77,7 +77,8 @@ export default function RoleIndex({ roles }: Props) {
<Table> <Table>
<TableHeader className="bg-gray-50"> <TableHeader className="bg-gray-50">
<TableRow> <TableRow>
<TableHead className="w-[200px]">角色名稱</TableHead> <TableHead className="w-[50px] text-center">#</TableHead>
<TableHead>名稱</TableHead>
<TableHead>代號</TableHead> <TableHead>代號</TableHead>
<TableHead className="text-center">權限數量</TableHead> <TableHead className="text-center">權限數量</TableHead>
<TableHead className="text-center">使用者人數</TableHead> <TableHead className="text-center">使用者人數</TableHead>
@@ -86,13 +87,13 @@ export default function RoleIndex({ roles }: Props) {
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
{roles.map((role) => ( {roles.map((role, index) => (
<TableRow key={role.id}> <TableRow key={role.id}>
<TableCell className="text-gray-500 font-medium text-center">
{index + 1}
</TableCell>
<TableCell className="font-medium"> <TableCell className="font-medium">
<div className="flex items-center gap-2"> <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)} {translateRoleName(role.name)}
</div> </div>
</TableCell> </TableCell>
@@ -120,7 +121,7 @@ export default function RoleIndex({ roles }: Props) {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-primary h-8 w-8 p-0" className="button-outlined-primary"
title="編輯" title="編輯"
> >
<Pencil className="h-4 w-4" /> <Pencil className="h-4 w-4" />
@@ -129,7 +130,7 @@ export default function RoleIndex({ roles }: Props) {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-error h-8 w-8 p-0" className="button-outlined-error"
title="刪除" title="刪除"
disabled={role.users_count > 0} disabled={role.users_count > 0}
onClick={() => handleDelete(role.id, translateRoleName(role.name))} onClick={() => handleDelete(role.id, translateRoleName(role.name))}

20
resources/js/Pages/Admin/User/Index.tsx
View File

@@ -32,6 +32,7 @@ interface Pagination {
last_page: number; last_page: number;
per_page: number; per_page: number;
total: number; total: number;
from: number;
links: { links: {
url: string | null; url: string | null;
label: string; label: string;
@@ -76,8 +77,8 @@ export default function UserIndex({ users }: Props) {
> >
<Head title="使用者管理" /> <Head title="使用者管理" />
<div className="p-8 max-w-7xl mx-auto space-y-6"> <div className="container mx-auto p-6 max-w-7xl">
<div className="flex items-center justify-between"> <div className="flex items-center justify-between mb-6">
<div> <div>
<h1 className="text-2xl font-bold text-grey-0 flex items-center gap-2"> <h1 className="text-2xl font-bold text-grey-0 flex items-center gap-2">
<Users className="h-6 w-6 text-[#01ab83]" /> <Users className="h-6 w-6 text-[#01ab83]" />
@@ -88,7 +89,7 @@ export default function UserIndex({ users }: Props) {
</p> </p>
</div> </div>
<Link href={route('users.create')}> <Link href={route('users.create')}>
<Button className="bg-[#01ab83] hover:bg-[#019a76]"> <Button className="button-filled-primary">
<Plus className="h-4 w-4 mr-2" /> <Plus className="h-4 w-4 mr-2" />
新增使用者 新增使用者
</Button> </Button>
@@ -99,6 +100,7 @@ export default function UserIndex({ users }: Props) {
<Table> <Table>
<TableHeader className="bg-gray-50"> <TableHeader className="bg-gray-50">
<TableRow> <TableRow>
<TableHead className="w-[50px] text-center">#</TableHead>
<TableHead className="w-[250px]">使用者</TableHead> <TableHead className="w-[250px]">使用者</TableHead>
<TableHead>角色</TableHead> <TableHead>角色</TableHead>
<TableHead className="w-[200px]">加入時間</TableHead> <TableHead className="w-[200px]">加入時間</TableHead>
@@ -106,13 +108,13 @@ export default function UserIndex({ users }: Props) {
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
{users.data.map((user) => ( {users.data.map((user, index) => (
<TableRow key={user.id}> <TableRow key={user.id}>
<TableCell className="text-gray-500 font-medium text-center">
{users.from + index}
</TableCell>
<TableCell> <TableCell>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<div className="h-10 w-10 rounded-full bg-[#01ab83]/10 flex items-center justify-center text-[#01ab83] font-bold">
{user.name.charAt(0).toUpperCase()}
</div>
<div> <div>
<p className="font-medium text-gray-900">{user.name}</p> <p className="font-medium text-gray-900">{user.name}</p>
<div className="flex items-center text-xs text-gray-500"> <div className="flex items-center text-xs text-gray-500">
@@ -153,7 +155,7 @@ export default function UserIndex({ users }: Props) {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-primary h-8 w-8 p-0" className="button-outlined-primary"
title="編輯" title="編輯"
> >
<Pencil className="h-4 w-4" /> <Pencil className="h-4 w-4" />
@@ -162,7 +164,7 @@ export default function UserIndex({ users }: Props) {
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
className="button-outlined-error h-8 w-8 p-0" className="button-outlined-error"
title="刪除" title="刪除"
onClick={() => handleDelete(user.id, user.name)} onClick={() => handleDelete(user.id, user.name)}
> >