feat: 統一庫存管理分頁 UI 與寬度規範，並更新 SKILL 規範文件
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
|
||||
import { Head, Link, useForm, router } from '@inertiajs/react';
|
||||
import { usePermission } from '@/hooks/usePermission';
|
||||
import {
|
||||
Table,
|
||||
TableBody,
|
||||
@@ -65,7 +66,10 @@ interface AdjDoc {
|
||||
}
|
||||
|
||||
export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
const { can } = usePermission();
|
||||
const isDraft = doc.status === 'draft';
|
||||
const canEdit = can('inventory_adjust.edit');
|
||||
const isReadOnly = !isDraft || !canEdit;
|
||||
|
||||
// Main Form using Inertia useForm
|
||||
const { data, setData, put, delete: destroy, processing } = useForm({
|
||||
@@ -183,7 +187,6 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
setData('action', 'save');
|
||||
put(route('inventory.adjust.update', [doc.id]), {
|
||||
preserveScroll: true,
|
||||
onSuccess: () => toast.success("草稿儲存成功"),
|
||||
});
|
||||
};
|
||||
|
||||
@@ -199,15 +202,12 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
} as any, {
|
||||
onSuccess: () => {
|
||||
setIsPostDialogOpen(false);
|
||||
toast.success("盤調單過帳成功");
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleDelete = () => {
|
||||
destroy(route('inventory.adjust.destroy', [doc.id]), {
|
||||
onSuccess: () => toast.success("盤調單已刪除"),
|
||||
});
|
||||
destroy(route('inventory.adjust.destroy', [doc.id]));
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -263,65 +263,69 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
</p>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
{isDraft && (
|
||||
<Can permission="inventory.adjust">
|
||||
<AlertDialog open={isDeleteDialogOpen} onOpenChange={setIsDeleteDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button variant="outline" size="sm" disabled={processing} className="button-outlined-error">
|
||||
<Trash2 className="w-4 h-4 mr-2" />
|
||||
刪除
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>確定要刪除此盤調單嗎？</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
此動作將會永久移除本張草稿，且無法復原。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handleDelete} className="button-filled-error">確認刪除</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
{!isReadOnly && (
|
||||
<>
|
||||
<Can permission="inventory_adjust.delete">
|
||||
<AlertDialog open={isDeleteDialogOpen} onOpenChange={setIsDeleteDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button variant="outline" size="sm" disabled={processing} className="button-outlined-error">
|
||||
<Trash2 className="w-4 h-4 mr-2" />
|
||||
刪除
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>確定要刪除此盤調單嗎？</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
此動作將會永久移除本張草稿，且無法復原。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handleDelete} className="button-filled-error">確認刪除</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</Can>
|
||||
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="button-outlined-primary"
|
||||
onClick={handleSave}
|
||||
disabled={processing}
|
||||
>
|
||||
<Save className="w-4 h-4 mr-2" />
|
||||
儲存
|
||||
</Button>
|
||||
<Can permission="inventory_adjust.edit">
|
||||
<Button
|
||||
variant="outline"
|
||||
size="sm"
|
||||
className="button-outlined-primary"
|
||||
onClick={handleSave}
|
||||
disabled={processing}
|
||||
>
|
||||
<Save className="w-4 h-4 mr-2" />
|
||||
儲存
|
||||
</Button>
|
||||
|
||||
<AlertDialog open={isPostDialogOpen} onOpenChange={setIsPostDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button
|
||||
size="sm"
|
||||
className="button-filled-primary"
|
||||
disabled={processing || data.items.length === 0}
|
||||
>
|
||||
<CheckCircle className="w-4 h-4 mr-2" />
|
||||
確認過帳
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>確定要過帳嗎？</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
過帳後庫存將立即根據調整數量進行增減，且無法再修改此盤調單。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handlePost} className="button-filled-primary">確認過帳</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</Can>
|
||||
<AlertDialog open={isPostDialogOpen} onOpenChange={setIsPostDialogOpen}>
|
||||
<AlertDialogTrigger asChild>
|
||||
<Button
|
||||
size="sm"
|
||||
className="button-filled-primary"
|
||||
disabled={processing || data.items.length === 0}
|
||||
>
|
||||
<CheckCircle className="w-4 h-4 mr-2" />
|
||||
確認過帳
|
||||
</Button>
|
||||
</AlertDialogTrigger>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>確定要過帳嗎？</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
過帳後庫存將立即根據調整數量進行增減，且無法再修改此盤調單。
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<AlertDialogFooter>
|
||||
<AlertDialogCancel>取消</AlertDialogCancel>
|
||||
<AlertDialogAction onClick={handlePost} className="button-filled-primary">確認過帳</AlertDialogAction>
|
||||
</AlertDialogFooter>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</Can>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
@@ -332,7 +336,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 pb-2">
|
||||
<div className="space-y-1">
|
||||
<Label className="text-xs font-bold text-grey-500 uppercase tracking-wider font-semibold">調整原因</Label>
|
||||
{isDraft ? (
|
||||
{!isReadOnly ? (
|
||||
<Input
|
||||
value={data.reason}
|
||||
onChange={e => setData('reason', e.target.value)}
|
||||
@@ -345,7 +349,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
</div>
|
||||
<div className="space-y-1">
|
||||
<Label className="text-xs font-bold text-grey-500 uppercase tracking-wider font-semibold">備註說明</Label>
|
||||
{isDraft ? (
|
||||
{!isReadOnly ? (
|
||||
<Input
|
||||
value={data.remarks}
|
||||
onChange={e => setData('remarks', e.target.value)}
|
||||
@@ -367,7 +371,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
請輸入各項商品的實盤與帳面之差異數量。正數為增加，負數為減少。
|
||||
</p>
|
||||
</div>
|
||||
{isDraft && !doc.count_doc_id && (
|
||||
{!isReadOnly && !doc.count_doc_id && (
|
||||
<Dialog open={isProductDialogOpen} onOpenChange={setIsProductDialogOpen}>
|
||||
<DialogTrigger asChild>
|
||||
<Button variant="outline" className="button-outlined-primary">
|
||||
@@ -505,13 +509,13 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
<TableHead className="w-32 text-right font-medium text-grey-600">調整前庫存</TableHead>
|
||||
<TableHead className="w-40 text-right font-medium text-grey-600">調整數量 (+/-)</TableHead>
|
||||
<TableHead className="font-medium text-grey-600">備註</TableHead>
|
||||
{isDraft && <TableHead className="w-[50px]"></TableHead>}
|
||||
{!isReadOnly && <TableHead className="w-[50px]"></TableHead>}
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
<TableBody>
|
||||
{data.items.length === 0 ? (
|
||||
<TableRow>
|
||||
<TableCell colSpan={isDraft ? 8 : 7} className="h-32 text-center text-grey-400">
|
||||
<TableCell colSpan={!isReadOnly ? 8 : 7} className="h-32 text-center text-grey-400">
|
||||
尚未加入任何項目
|
||||
</TableCell>
|
||||
</TableRow>
|
||||
@@ -534,7 +538,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
{item.qty_before}
|
||||
</TableCell>
|
||||
<TableCell className="text-right">
|
||||
{isDraft ? (
|
||||
{!isReadOnly ? (
|
||||
<div className="flex justify-end pr-2">
|
||||
<Input
|
||||
type="number"
|
||||
@@ -550,7 +554,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
)}
|
||||
</TableCell>
|
||||
<TableCell>
|
||||
{isDraft ? (
|
||||
{!isReadOnly ? (
|
||||
<Input
|
||||
className="h-9 text-sm"
|
||||
value={item.notes || ''}
|
||||
@@ -561,7 +565,7 @@ export default function Show({ doc }: { auth: any, doc: AdjDoc }) {
|
||||
<span className="text-grey-600 text-sm">{item.notes || '-'}</span>
|
||||
)}
|
||||
</TableCell>
|
||||
{isDraft && !doc.count_doc_id && (
|
||||
{!isReadOnly && !doc.count_doc_id && (
|
||||
<TableCell className="text-center">
|
||||
<Button
|
||||
variant="ghost"
|
||||
|
||||
Reference in New Issue
Block a user