feat: 統一各模組分頁組件佈局並新增系統設定功能相關檔案
All checks were successful
ERP-Deploy-Demo / deploy-demo (push) Successful in 1m5s

This commit is contained in:
2026-02-25 16:16:49 +08:00
parent 878b90e2ad
commit e3df090afd
59 changed files with 889 additions and 299 deletions

View File

@@ -51,6 +51,9 @@ interface PageProps {
data: Product[];
links: any[]; // Todo: pagination types
from: number;
per_page: number;
current_page: number;
total: number;
};
categories: Category[];
units: Unit[];
@@ -67,7 +70,7 @@ export default function ProductManagement({ products, categories, units, filters
const { branding } = usePage<GlobalPageProps>().props;
const [searchTerm, setSearchTerm] = useState(filters.search || "");
const [typeFilter, setTypeFilter] = useState<string>(filters.category_id || "all");
const [perPage, setPerPage] = useState<string>(filters.per_page || "10");
const [perPage, setPerPage] = useState<string>(filters.per_page || products.per_page?.toString() || "10");
const [sortField, setSortField] = useState<string | null>(filters.sort_field || null);
const [sortDirection, setSortDirection] = useState<"asc" | "desc" | null>(filters.sort_direction as "asc" | "desc" || null);
const [isCategoryDialogOpen, setIsCategoryDialogOpen] = useState(false);
@@ -78,12 +81,10 @@ export default function ProductManagement({ products, categories, units, filters
useEffect(() => {
setSearchTerm(filters.search || "");
setTypeFilter(filters.category_id || "all");
setSearchTerm(filters.search || "");
setTypeFilter(filters.category_id || "all");
setPerPage(filters.per_page || "10");
setPerPage(filters.per_page || products.per_page?.toString() || "10");
setSortField(filters.sort_field || null);
setSortDirection(filters.sort_direction as "asc" | "desc" || null);
}, [filters]);
}, [filters, products.per_page]);
const handleSort = (field: string) => {
let newField: string | null = field;
@@ -270,22 +271,25 @@ export default function ProductManagement({ products, categories, units, filters
/>
{/* 分頁元件 */}
<div className="mt-4 flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
<div className="flex items-center gap-2 text-sm text-gray-500">
<span></span>
<SearchableSelect
value={perPage}
onValueChange={handlePerPageChange}
options={[
{ label: "10", value: "10" },
{ label: "20", value: "20" },
{ label: "50", value: "50" },
{ label: "100", value: "100" }
]}
className="w-[90px] h-8"
showSearch={false}
/>
<span></span>
<div className="mt-6 flex flex-col sm:flex-row items-start sm:items-center justify-between gap-4">
<div className="flex items-center gap-4">
<div className="flex items-center gap-2 text-sm text-gray-500">
<span></span>
<SearchableSelect
value={perPage}
onValueChange={handlePerPageChange}
options={[
{ label: "10", value: "10" },
{ label: "20", value: "20" },
{ label: "50", value: "50" },
{ label: "100", value: "100" }
]}
className="w-[90px] h-8"
showSearch={false}
/>
<span></span>
</div>
<span className="text-sm text-gray-500"> {products.total} </span>
</div>
<div className="w-full sm:w-auto flex justify-center sm:justify-end">
<Pagination links={products.links} />