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

style(production): 統一生產模組操作圖示 UI、權限控制與 AlertDialog

Browse Source
This commit is contained in:
sky121113
2026-01-27 10:09:43 +08:00
parent ce0a7b3409
commit 046e0a028b
1 changed files with 56 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

75
resources/js/Pages/Production/Recipe/Index.tsx
View File

@@ -14,6 +14,18 @@ import { Input } from "@/Components/ui/input";
import { Label } from "@/Components/ui/label"; import { Label } from "@/Components/ui/label";
import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/Components/ui/table"; import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/Components/ui/table";
import { Badge } from "@/Components/ui/badge"; import { Badge } from "@/Components/ui/badge";
import { Can } from "@/Components/Permission/Can";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
AlertDialogTrigger,
} from "@/Components/ui/alert-dialog";
interface Recipe { interface Recipe {
id: number; id: number;
@@ -207,25 +219,50 @@ export default function RecipeIndex({ recipes, filters }: Props) {
</TableCell> </TableCell>
<TableCell className="text-center"> <TableCell className="text-center">
<div className="flex items-center justify-center gap-2"> <div className="flex items-center justify-center gap-2">
<Link href={route('recipes.edit', recipe.id)}> <Can permission="recipes.edit">
<Button <Link href={route('recipes.edit', recipe.id)}>
variant="outline" <Button
size="sm" variant="outline"
className="button-outlined-primary" size="sm"
title="編輯" className="button-outlined-primary"
> title="編輯"
<Pencil className="h-4 w-4" /> >
</Button> <Pencil className="h-4 w-4" />
</Link> </Button>
<Button </Link>
variant="ghost" </Can>
size="sm"
onClick={() => handleDelete(recipe.id)} <Can permission="recipes.delete">
className="text-red-500 hover:text-red-700 hover:bg-red-50" <AlertDialog>
title="刪除" <AlertDialogTrigger asChild>
> <Button
<Trash2 className="h-4 w-4" /> variant="outline"
</Button> size="sm"
className="button-outlined-error"
title="刪除"
>
<Trash2 className="h-4 w-4" />
</Button>
</AlertDialogTrigger>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>確認刪除</AlertDialogTitle>
<AlertDialogDescription>
確定要刪除配方「{recipe.name}」嗎？此操作無法復原。
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel>取消</AlertDialogCancel>
<AlertDialogAction
onClick={() => handleDelete(recipe.id)}
className="bg-red-600 hover:bg-red-700"
>
刪除
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</Can>
</div> </div>
</TableCell> </TableCell>
</TableRow> </TableRow>