diff --git a/src/api/index.ts b/src/api/index.ts index b4cfcb5..d9e6d1b 100644 --- a/src/api/index.ts +++ b/src/api/index.ts @@ -36,6 +36,7 @@ export const ApiId = { CONTRACT_CREATE: id++, USE_SUMMARY_YYYYMM: id++, + USE_SUMMARIES_BY_CONTRACT: id++, LOGIN_USERS: id++, LOGIN_USER_CREATE: id++, diff --git a/src/api/url.ts b/src/api/url.ts index 0a31d33..1c3f793 100644 --- a/src/api/url.ts +++ b/src/api/url.ts @@ -1,6 +1,5 @@ -import { env } from "process"; -import { ApiId as A } from "."; import { HOST_API } from "config"; +import { ApiId as A } from "."; const urls = { [A.CSRF_TOKEN]: "sanctum/csrf-cookie", @@ -27,6 +26,7 @@ const urls = { [A.CONTRACT_CREATE]: "contract/create", [A.USE_SUMMARY_YYYYMM]: "use-summary/yyyymm", + [A.USE_SUMMARIES_BY_CONTRACT]: "use-summary/list/by-contract", [A.LOGIN_USERS]: "users", [A.LOGIN_USER_CREATE]: "user/create", diff --git a/src/api/use-summary.ts b/src/api/use-summary.ts new file mode 100644 index 0000000..399ffb5 --- /dev/null +++ b/src/api/use-summary.ts @@ -0,0 +1,38 @@ +import { APICommonResponse, ApiId, HttpMethod, ListRequest, request } from "."; +import { getUrl } from "./url"; + +export type UseSummaryByContract = { + date_from: string; + date_to: string; + + contract_id: string; + contract_name: string; + + receipt_order_count: string; + mail_order_count: string; + sms_send_count: string; +}; + +// 利用実績一覧取得 ----------------------- +export type UseSummariesByContradctRequest = { + date_from: string; + date_to: string; + contract_name?: string; +} & ListRequest; + +export type UseSummariesByContractResponse = { + data: { + records: UseSummaryByContract[]; + }; +} & APICommonResponse; + +export const getUseSummariesByContract = async ( + data: UseSummariesByContradctRequest +) => { + const res = await request({ + url: getUrl(ApiId.USE_SUMMARIES_BY_CONTRACT), + method: HttpMethod.GET, + data: new URLSearchParams(data), + }); + return res; +}; diff --git a/src/codes/page.ts b/src/codes/page.ts index 96d26ef..83f352f 100644 --- a/src/codes/page.ts +++ b/src/codes/page.ts @@ -16,6 +16,8 @@ export const PageID = { DASHBOARD_CONTRACT_DETAIL: id++, DASHBOARD_CONTRACT_CREATE: id++, + DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT: id++, + DASHBOARD_RECEIPT_ISSUING_ORDER_CREATE_CUSTOM_HELLO_TECHNO: id++, DASHBOARD_RECEIPT_ISSUING_ORDER_LIST_CUSTOM_HELLO_TECHNO: id++, DASHBOARD_RECEIPT_ISSUING_ORDER_DETAIL_CUSTOM_HELLO_TECHNO: id++, diff --git a/src/layouts/dashbord/navigator.tsx b/src/layouts/dashbord/navigator.tsx index a54c2cc..74c0291 100644 --- a/src/layouts/dashbord/navigator.tsx +++ b/src/layouts/dashbord/navigator.tsx @@ -109,6 +109,10 @@ export default function Navigator(props: DrawerProps) { id: PageID.DASHBOARD_USE_SUMMARY_LIST_CUSTOM_HELLO_TECHNO, label: "一覧", }, + { + id: PageID.DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT, + label: "一覧", + }, ], }, { diff --git a/src/pages/dashboard/use-summary/list.tsx b/src/pages/dashboard/use-summary/list.tsx new file mode 100644 index 0000000..3939caa --- /dev/null +++ b/src/pages/dashboard/use-summary/list.tsx @@ -0,0 +1,269 @@ +import { + Box, + Button, + Grid, + Stack, + Table, + TableBody, + TableCell, + TableContainer, + TablePagination, + TableRow, + Typography, +} from "@mui/material"; +import { ApiId } from "api"; +import { + UseSummary, + getUseSummaries, + getUseSummaryYYYYMMs, +} from "api/custom/hello-techno/use-summary"; +import { getFullUrl } from "api/url"; +import { + UseSummaryByContract, + getUseSummariesByContract, +} from "api/use-summary"; +import { PageID, TabID } from "codes/page"; +import { FormProvider, RHFTextField } from "components/hook-form"; +import RHFDatePicker from "components/hook-form/RHFDatePicker"; +import RHFSelect, { SelectOptionProps } from "components/hook-form/RHFSelect"; +import { TableHeadCustom } from "components/table"; +import { HeadLabelProps } from "components/table/TableHeadCustom"; +import { SearchConditionContextProvider } from "contexts/SearchConditionContext"; +import useAPICall from "hooks/useAPICall"; +import useDashboard from "hooks/useDashBoard"; +import useNavigateCustom from "hooks/useNavigateCustom"; +import useSearchConditionContext from "hooks/useSearchConditionContext"; +import useTable, { UseTableReturn } from "hooks/useTable"; +import { SearchParam } from "pages/dashboard/receipt-issuing-order/custom/hello-techno/list"; +import { useEffect, useMemo, useState } from "react"; +import { useForm } from "react-hook-form"; +import { getPath } from "routes/path"; +import { sprintf } from "sprintf-js"; +import { dateParse, formatDateStr } from "utils/datetime"; + +export default function UseSummaryList() { + const { setHeaderTitle, setTabs } = useDashboard( + PageID.DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT, + TabID.NONE + ); + + const { navigateWhenChanged } = useNavigateCustom(); + + useEffect(() => { + setHeaderTitle("利用実績一覧"); + setTabs(null); + }, []); + + return ( + + + + ); +} + +function Page() { + const table = useTable(); + return ( + + + + + ); +} + +type FormProps = { + date_from: Date | null; + date_to: Date | null; + contract_name: string; +}; + +type CommonProps = { + table: UseTableReturn; +}; +function SearchBox({ table }: CommonProps) { + const { + condition, + initialized, + get, + addCondition: add, + } = useSearchConditionContext(); + + const form = useForm({ + defaultValues: { + date_from: null, + date_to: null, + contract_name: "", + }, + }); + + const dateFrom = form.watch("date_from"); + const dateTo = form.watch("date_to"); + + const { callAPI: callGetContracts } = useAPICall({ + apiMethod: getUseSummariesByContract, + backDrop: true, + onSuccess: ({ data }) => { + table.setRowData(data.records); + }, + }); + + const handleSubmit = async (data: FormProps) => { + addCondition(data); + }; + + const handleBlur = () => { + addCondition(form.getValues()); + }; + + const addCondition = (data: FormProps) => { + add({ + ...data, + date_from: formatDateStr(data.date_from), + date_to: formatDateStr(data.date_to), + }); + }; + + const fetch = async () => { + const dateFrom = form.getValues("date_from"); + const dateTo = form.getValues("date_to"); + if (!dateFrom || !dateTo) return; + const sendData = { + ...form.getValues(), + date_from: formatDateStr(dateFrom), + date_to: formatDateStr(dateTo), + }; + callGetContracts(sendData); + }; + + // 初期値設定 + useEffect(() => { + if (initialized) { + form.setValue("date_from", dateParse(get("date_from"))); + form.setValue("date_to", dateParse(get("date_to"))); + form.setValue("contract_name", get("contract_name")); + } + }, [initialized]); + + // Fetchアクション + useEffect(() => { + if (initialized) { + fetch(); + } + }, [condition, initialized]); + + useEffect(() => { + addCondition(form.getValues()); + }, [dateFrom, dateTo]); + + return ( + + + + + 開始年月日 + + + + 終了年月日 + + + + 契約者名 + + + + + + ); +} + +function TableBox({ table }: CommonProps) { + const TABLE_HEAD: HeadLabelProps[] = [ + { id: "customer_name", label: "契約者名", align: "left" }, + { id: "receipt_order_count", label: "領収証発行件数", align: "left" }, + { id: "mail_order_count", label: "郵送依頼件数", align: "left" }, + { id: "sms_send_count", label: "SMS送信件数", align: "left" }, + { id: "actions", label: "アクション", align: "left", needSort: false }, + ]; + const { + order, + page, + sort, + rowsPerPage, + fetched, + fillteredRow, + isNotFound, + dataLength, + // + onSort, + onChangePage, + onChangeRowsPerPage, + // + setRowData, + // + ROWS_PER_PAGES, + } = table; + + return ( + <> + + + + + + {fillteredRow.map((row, index) => ( + + ))} + +
+
+ + + + + + ); +} + +type RowProps = { + data: UseSummaryByContract; +}; +function Row({ data }: RowProps) { + return ( + + {data.contract_name} + {data.receipt_order_count}件 + {data.mail_order_count}件 + {data.sms_send_count}件 + + + - + + + + ); +} diff --git a/src/routes/auth.ts b/src/routes/auth.ts index 419469f..cb7943d 100644 --- a/src/routes/auth.ts +++ b/src/routes/auth.ts @@ -28,6 +28,10 @@ export const AUTH = { allowChangedContract: false, }), + [P.DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT]: setAuth("eq", R.SUPER_ADMIN, { + allowChangedContract: false, + }), + [P.DASHBOARD_RECEIPT_ISSUING_ORDER_CREATE_CUSTOM_HELLO_TECHNO]: setAuth( "ge", R.NORMAL_ADMIN, diff --git a/src/routes/index.tsx b/src/routes/index.tsx index 30567fc..bbbf911 100644 --- a/src/routes/index.tsx +++ b/src/routes/index.tsx @@ -77,6 +77,10 @@ const DashboardRoutes = (): RouteObject => { pageId: PageID.DASHBOARD_CONTRACT_CREATE, element: , }, + { + pageId: PageID.DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT, + element: , + }, { pageId: PageID.DASHBOARD_RECEIPT_ISSUING_ORDER_CREATE_CUSTOM_HELLO_TECHNO, element: , @@ -188,6 +192,9 @@ const ReceiptIssuingOrderDetailHelloTechno = Loadable( ); // 利用実績関連 +const UseSummaryByContractList = Loadable( + lazy(() => import("pages/dashboard/use-summary/list")) +); const UseSummaryListHelloTechno = Loadable( lazy(() => import("pages/dashboard/use-summary/custom/hello-techno/list")) ); diff --git a/src/routes/path.ts b/src/routes/path.ts index 9ac9a0f..52185b3 100644 --- a/src/routes/path.ts +++ b/src/routes/path.ts @@ -53,6 +53,10 @@ const PATHS = { "/dashboard/contract/detail/:id", [makePathKey(PageID.DASHBOARD_CONTRACT_CREATE)]: "/dashboard/contract/create", + // 利用実績関連 + [makePathKey(PageID.DASHBOARD_USE_SUMMARY_LIST_BY_CONTRACT)]: + "/dashboard/use-summary/list", + // 領収証発行依頼関連 [makePathKey( PageID.DASHBOARD_RECEIPT_ISSUING_ORDER_CREATE_CUSTOM_HELLO_TECHNO