UI優化: 全系統狀態標籤 (StatusBadge) 統一化重構完成 (Phase 3 & 4)
This commit is contained in:
@@ -1,7 +1,9 @@
|
||||
|
||||
import AuthenticatedLayout from '@/Layouts/AuthenticatedLayout';
|
||||
import { Head, Link, useForm, router } from '@inertiajs/react';
|
||||
import { Head, Link, router, useForm } from '@inertiajs/react';
|
||||
import { useState, useCallback, useEffect } from 'react';
|
||||
import { usePermission } from '@/hooks/usePermission';
|
||||
import { StatusBadge } from "@/Components/shared/StatusBadge";
|
||||
import { debounce } from "lodash";
|
||||
import { SearchableSelect } from "@/Components/ui/searchable-select";
|
||||
import {
|
||||
@@ -14,7 +16,6 @@ import {
|
||||
} from '@/Components/ui/table';
|
||||
import { Button } from '@/Components/ui/button';
|
||||
import { Input } from '@/Components/ui/input';
|
||||
import { Badge } from '@/Components/ui/badge';
|
||||
import {
|
||||
Dialog,
|
||||
DialogContent,
|
||||
@@ -138,19 +139,19 @@ export default function Index({ docs, warehouses, filters }: any) {
|
||||
const getStatusBadge = (status: string) => {
|
||||
switch (status) {
|
||||
case 'draft':
|
||||
return <Badge variant="secondary">草稿</Badge>;
|
||||
return <StatusBadge variant="neutral">草稿</StatusBadge>;
|
||||
case 'counting':
|
||||
return <Badge className="bg-blue-500 hover:bg-blue-600">盤點中</Badge>;
|
||||
return <StatusBadge variant="info">盤點中</StatusBadge>;
|
||||
case 'completed':
|
||||
return <Badge className="bg-green-500 hover:bg-green-600">盤點完成</Badge>;
|
||||
return <StatusBadge variant="success">盤點完成</StatusBadge>;
|
||||
case 'no_adjust':
|
||||
return <Badge className="bg-green-600 hover:bg-green-700">盤點完成 (無需盤調)</Badge>;
|
||||
return <StatusBadge variant="success">盤點完成 (無需盤調)</StatusBadge>;
|
||||
case 'adjusted':
|
||||
return <Badge className="bg-purple-500 hover:bg-purple-600">已盤調庫存</Badge>;
|
||||
return <StatusBadge variant="info">已盤調庫存</StatusBadge>; // Decided on info/blue for adjusted to match "active/done" but distinctive from pure success if needed, or stick to success? Plan said Info/Blue.
|
||||
case 'cancelled':
|
||||
return <Badge variant="destructive">已取消</Badge>;
|
||||
return <StatusBadge variant="destructive">已取消</StatusBadge>;
|
||||
default:
|
||||
return <Badge variant="outline">{status}</Badge>;
|
||||
return <StatusBadge variant="neutral">{status}</StatusBadge>;
|
||||
}
|
||||
};
|
||||
|
||||
@@ -273,11 +274,11 @@ export default function Index({ docs, warehouses, filters }: any) {
|
||||
<TableHead className="w-[50px] text-center">#</TableHead>
|
||||
<TableHead>單號</TableHead>
|
||||
<TableHead>倉庫</TableHead>
|
||||
<TableHead>狀態</TableHead>
|
||||
<TableHead>快照時間</TableHead>
|
||||
<TableHead>盤點進度</TableHead>
|
||||
<TableHead>完成時間</TableHead>
|
||||
<TableHead>建立人員</TableHead>
|
||||
<TableHead>狀態</TableHead>
|
||||
<TableHead className="text-center">操作</TableHead>
|
||||
</TableRow>
|
||||
</TableHeader>
|
||||
@@ -296,7 +297,6 @@ export default function Index({ docs, warehouses, filters }: any) {
|
||||
</TableCell>
|
||||
<TableCell className="font-medium text-primary-main">{doc.doc_no}</TableCell>
|
||||
<TableCell>{doc.warehouse_name}</TableCell>
|
||||
<TableCell>{getStatusBadge(doc.status)}</TableCell>
|
||||
<TableCell className="text-gray-500 text-sm">{doc.snapshot_date}</TableCell>
|
||||
<TableCell>
|
||||
<span className="font-medium text-gray-700">{doc.counted_items}</span>
|
||||
@@ -305,6 +305,7 @@ export default function Index({ docs, warehouses, filters }: any) {
|
||||
</TableCell>
|
||||
<TableCell className="text-gray-500 text-sm">{doc.completed_at || '-'}</TableCell>
|
||||
<TableCell className="text-sm">{doc.created_by}</TableCell>
|
||||
<TableCell>{getStatusBadge(doc.status)}</TableCell>
|
||||
<TableCell className="text-center">
|
||||
<div className="flex items-center justify-center gap-2">
|
||||
{/* Action Button Logic: Prefer Edit if allowed and status is active, otherwise fallback to View if allowed */}
|
||||
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
} from '@/Components/ui/table';
|
||||
import { Button } from '@/Components/ui/button';
|
||||
import { Input } from '@/Components/ui/input';
|
||||
import { Badge } from '@/Components/ui/badge';
|
||||
import { StatusBadge } from "@/Components/shared/StatusBadge";
|
||||
import { Save, Printer, Trash2, ClipboardCheck, ArrowLeft, RotateCcw } from 'lucide-react'; // Added ArrowLeft
|
||||
import {
|
||||
AlertDialog,
|
||||
@@ -121,16 +121,16 @@ export default function Show({ doc }: any) {
|
||||
盤點單: {doc.doc_no}
|
||||
</h1>
|
||||
{doc.status === 'completed' && (
|
||||
<Badge className="bg-green-500 hover:bg-green-600">盤點完成</Badge>
|
||||
<StatusBadge variant="success">盤點完成</StatusBadge>
|
||||
)}
|
||||
{doc.status === 'no_adjust' && (
|
||||
<Badge className="bg-green-600 hover:bg-green-700">盤點完成 (無需盤調)</Badge>
|
||||
<StatusBadge variant="success">盤點完成 (無需盤調)</StatusBadge>
|
||||
)}
|
||||
{doc.status === 'adjusted' && (
|
||||
<Badge className="bg-purple-500 hover:bg-purple-600">已盤調庫存</Badge>
|
||||
<StatusBadge variant="warning">已盤調庫存</StatusBadge>
|
||||
)}
|
||||
{doc.status === 'draft' && (
|
||||
<Badge className="bg-blue-500 hover:bg-blue-600">盤點中</Badge>
|
||||
<StatusBadge variant="info">盤點中</StatusBadge>
|
||||
)}
|
||||
</div>
|
||||
<p className="text-sm text-gray-500 mt-1 font-medium">
|
||||
|
||||
Reference in New Issue
Block a user