diff --git a/src/api/season-ticket-contract.ts b/src/api/season-ticket-contract.ts index 314b011..32d6ad5 100644 --- a/src/api/season-ticket-contract.ts +++ b/src/api/season-ticket-contract.ts @@ -63,6 +63,9 @@ export const getPaymentPlans = async (data: PaymentPlansRequest) => { // -------シール再発行依頼------------------ type StickerReOrderRequest = { season_ticket_contract_record_no: string; + parking_name: string; + reason: string; + memo?: string; }; export const reOrderSticker = async (data: StickerReOrderRequest) => { const res = await request({ diff --git a/src/pages/dashboard/contract/sticker-re-order.tsx b/src/pages/dashboard/contract/sticker-re-order.tsx index 3ebe194..0909383 100644 --- a/src/pages/dashboard/contract/sticker-re-order.tsx +++ b/src/pages/dashboard/contract/sticker-re-order.tsx @@ -1,7 +1,20 @@ -import { Box, Button, Stack, Typography } from "@mui/material"; +import { yupResolver } from "@hookform/resolvers/yup"; +import { + Box, + Button, + Stack, + Table, + TableBody, + TableCell, + TableRow, + Typography, +} from "@mui/material"; import { HasChildren } from "@types"; import { reOrderSticker } from "api/season-ticket-contract"; +import InputAlert from "components/form/InputAlert"; +import TextFieldEx from "components/form/TextFieldEx"; import { FormProvider, RHFTextField } from "components/hook-form"; +import StackRow from "components/stack/StackRow"; import { useSeasonTicketContractContext } from "contexts/dashboard/SeasonTicketContractContext"; import useAPICall from "hooks/useAPICall"; import useDashboard from "hooks/useDashBoard"; @@ -11,6 +24,7 @@ import { PageID, TabID } from "pages"; import { useEffect, useState } from "react"; import { useForm } from "react-hook-form"; import { getPath } from "routes/path"; +import { object, string } from "yup"; type AreaBoxProps = { label: string; @@ -25,7 +39,8 @@ function AreaBox({ label, children }: AreaBoxProps) { } type FormProps = { - upload1: File[]; + reason: string; + memo: string; }; export default function StickerReOrder() { @@ -36,38 +51,50 @@ export default function StickerReOrder() { const form = useForm({ defaultValues: { - upload1: [], + reason: "", + memo: "", }, + resolver: yupResolver( + object().shape({ + reason: string().required("入力してください"), + }) + ), }); - const { navigateWhenChanged, navigate } = useNavigateCustom(); + const { navigateWhenChanged } = useNavigateCustom(); const { error } = useSnackbarCustom(); const { selectedseasonTicketContract, backToDetailHome } = useSeasonTicketContractContext(); - const [done, setDone] = useState(false); + const [mode, setMode] = useState<"input" | "confirm" | "done">("input"); - const { callAPI: callReOrderSticker } = useAPICall({ + const { callAPI: callReOrderSticker, errorMode } = useAPICall({ apiMethod: reOrderSticker, backDrop: true, + form, onSuccess: () => { - setDone(true); + setMode("done"); }, onFailed: () => { error("依頼失敗しました"); + setMode("input"); }, }); - const handleSubmit = (data: FormProps) => { - console.log(data); - return; - // if (selectedseasonTicketContract === null) return; - // callReOrderSticker({ - // season_ticket_contract_record_no: - // selectedseasonTicketContract.season_ticekt_contract_record_no ?? "", - // }); + const handleSubmit = () => { + setMode("confirm"); + }; + + const send = () => { + if (selectedseasonTicketContract === null) return; + callReOrderSticker({ + season_ticket_contract_record_no: + selectedseasonTicketContract.season_ticekt_contract_record_no ?? "", + parking_name: selectedseasonTicketContract.parking_name ?? "", + ...form.getValues(), + }); }; useEffect(() => { @@ -86,7 +113,7 @@ export default function StickerReOrder() { if (selectedseasonTicketContract === null) { return null; } - if (done) { + if (mode === "done") { return ( @@ -99,6 +126,58 @@ export default function StickerReOrder() { ); } + if (mode === "confirm") { + return ( + + + + 下記内容で申請を行います。 + + + + + + 理由 + + + + + + 備考 + + + + + +
+
+ + + + +
+
+ ); + } + return ( @@ -107,6 +186,8 @@ export default function StickerReOrder() { + + + + +