| @@ -0,0 +1,30 @@ | |||||
| import { PreloadPickOrder } from "@/app/api/pickOrder"; | |||||
| import { SearchParams } from "@/app/utils/fetchUtil"; | |||||
| import PickOrderDetail from "@/components/PickOrderDetail"; | |||||
| import { getServerI18n, I18nProvider } from "@/i18n"; | |||||
| import { Stack, Typography } from "@mui/material"; | |||||
| import { Metadata } from "next"; | |||||
| import { Suspense } from "react"; | |||||
| export const metadata: Metadata = { | |||||
| title: "Consolidated Pick Order Flow", | |||||
| }; | |||||
| type Props = {} & SearchParams; | |||||
| const PickOrder: React.FC<Props> = async ({ searchParams }) => { | |||||
| const { t } = await getServerI18n("pickOrder"); | |||||
| PreloadPickOrder(); | |||||
| return ( | |||||
| <> | |||||
| <I18nProvider namespaces={["pickOrder"]}> | |||||
| <Suspense fallback={<PickOrderDetail.Loading />}> | |||||
| <PickOrderDetail consoCode={`${searchParams["consoCode"]}`} /> | |||||
| </Suspense> | |||||
| </I18nProvider> | |||||
| </> | |||||
| ); | |||||
| }; | |||||
| export default PickOrder; | |||||
| @@ -0,0 +1,29 @@ | |||||
| import { PreloadPickOrder } from "@/app/api/pickOrder"; | |||||
| import PickOrderSearch from "@/components/PickOrderSearch"; | |||||
| import { getServerI18n } from "@/i18n"; | |||||
| import { I18nProvider } from "@/i18n"; | |||||
| import { Stack, Typography } from "@mui/material"; | |||||
| import { Metadata } from "next"; | |||||
| import { Suspense } from "react"; | |||||
| export const metadata: Metadata = { | |||||
| title: "Pick Order", | |||||
| }; | |||||
| const PickOrder: React.FC = async () => { | |||||
| const { t } = await getServerI18n("pickOrder"); | |||||
| PreloadPickOrder(); | |||||
| return ( | |||||
| <> | |||||
| <I18nProvider namespaces={["pickOrder", "common"]}> | |||||
| <Suspense fallback={<PickOrderSearch.Loading />}> | |||||
| <PickOrderSearch /> | |||||
| </Suspense> | |||||
| </I18nProvider> | |||||
| </> | |||||
| ); | |||||
| }; | |||||
| export default PickOrder; | |||||
| @@ -0,0 +1,57 @@ | |||||
| "use client"; | |||||
| import SearchBox, { Criterion } from "../SearchBox"; | |||||
| import { useCallback, useMemo, useState } from "react"; | |||||
| import { useTranslation } from "react-i18next"; | |||||
| import SearchResults, { Column } from "../SearchResults/index"; | |||||
| import { StockIssueResult } from "./action"; | |||||
| interface Props { | |||||
| dataList: StockIssueResult[]; | |||||
| }; | |||||
| type SearchQuery = Partial<Omit<StockIssueResult, "id">>; | |||||
| type SearchParamNames = keyof SearchQuery; | |||||
| const SearchPage: React.FC<Props> = ({dataList}) => { | |||||
| const { t } = useTranslation("user"); | |||||
| const [filteredList, setFilteredList] = useState(dataList); | |||||
| const searchCriteria: Criterion<SearchParamNames>[] = useMemo( | |||||
| () => [ | |||||
| { | |||||
| label: t("Lot No."), | |||||
| paramName: "lot_no", | |||||
| type: "text", | |||||
| }, | |||||
| ], | |||||
| [t], | |||||
| ); | |||||
| const columns = useMemo<Column<StockIssueResult>[]>( | |||||
| () => [ | |||||
| { name: "item_code", label: t("Item Code") }, | |||||
| { name: "item_description", label: t("Item") }, | |||||
| { name: "lot_no", label: t("Lot No.") }, | |||||
| { name: "store_location", label: t("Location") }, | |||||
| { name: "bad_item_qty", label: t("Defective Qty") } | |||||
| ], | |||||
| [t], | |||||
| ); | |||||
| return ( | |||||
| <> | |||||
| <SearchBox | |||||
| criteria={searchCriteria} | |||||
| onSearch={(query) => { | |||||
| }} | |||||
| /> | |||||
| <SearchResults<StockIssueResult> | |||||
| items={filteredList} | |||||
| columns={columns} | |||||
| pagingController={{ pageNum: 1, pageSize: 10 }} | |||||
| /> | |||||
| </> | |||||
| ); | |||||
| }; | |||||
| export default SearchPage; | |||||
| @@ -0,0 +1,29 @@ | |||||
| import "server-only"; | |||||
| import { BASE_API_URL } from "@/config/api"; | |||||
| import { serverFetchJson } from "@/app/utils/fetchUtil"; | |||||
| import { cache } from "react"; | |||||
| export interface StockIssueResult { | |||||
| action: any; | |||||
| id: number; | |||||
| item_id: number; | |||||
| item_code: string; | |||||
| item_description: string; | |||||
| lot_id: number; | |||||
| lot_no: string; | |||||
| store_location: string; | |||||
| required_qty: number; | |||||
| bad_item_qty: number; | |||||
| issue_remark: string; | |||||
| picker_name: string; | |||||
| handle_status: string; | |||||
| handle_date: string; | |||||
| handled_by: number; | |||||
| } | |||||
| export const fetchList = cache(async () => { | |||||
| return serverFetchJson<StockIssueResult[]>(`${BASE_API_URL}/stock-issue-list`, { | |||||
| next: { tags: ["stock issue"] }, | |||||
| }); | |||||
| }); | |||||
| @@ -0,0 +1,19 @@ | |||||
| import GeneralLoading from "../General/GeneralLoading"; | |||||
| import SearchPage from "./SearchPage"; | |||||
| import { fetchList } from "./action"; | |||||
| interface SubComponents { | |||||
| Loading: typeof GeneralLoading; | |||||
| } | |||||
| const Wrapper: React.FC & SubComponents = async () => { | |||||
| const dataList = await fetchList(); | |||||
| console.log(dataList); | |||||
| return <SearchPage dataList={dataList} />; | |||||
| }; | |||||
| Wrapper.Loading = GeneralLoading; | |||||
| export default Wrapper; | |||||