119 lines
3.4 KiB
TypeScript
119 lines
3.4 KiB
TypeScript
"use client";
|
|
import {
|
|
pbnstRegZod,
|
|
type customPbnst,
|
|
type PbnstRegArrrayType,
|
|
} from "@/app/store/ruseFcltMng/fcltReg/pbnstReg/type";
|
|
import { PbnstMngForm } from "@/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm";
|
|
import { ScrollArea } from "@common/business_components";
|
|
import {
|
|
Button,
|
|
Tabs,
|
|
TabsContent,
|
|
TabsList,
|
|
TabsTrigger,
|
|
} from "@common/components/ui";
|
|
import { useEffect, useState } from "react";
|
|
import { PbnstBuseForm } from "@/components/ui/form/fcltReg/pbnstReg/buseReg/bugRegForm";
|
|
import { type FieldErrors, type UseFormReturn } from "react-hook-form";
|
|
import { writeRgtrAndMdfr } from "@/app/store/ruseFcltMng/fcltReg/pbnstReg";
|
|
import type { z } from "zod";
|
|
import { confirmToast } from "@/components/lib/func/commom";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
export function PbnstRegModal({
|
|
form,
|
|
setPbnstInsert,
|
|
onInvalid,
|
|
}: {
|
|
form: UseFormReturn<{ items: PbnstRegArrrayType }>;
|
|
setPbnstInsert: (data: customPbnst) => void;
|
|
onInvalid: (
|
|
errors: FieldErrors<{ items: z.infer<typeof pbnstRegZod>[] }>
|
|
) => void;
|
|
}) {
|
|
const { t } = useTranslation("base");
|
|
|
|
//TODO: 유즈 스테이트에 set만해도 되나?
|
|
const [, setCurrentTab] = useState<string>("mng");
|
|
const [indexMng, setIndexMng] = useState<number>(0);
|
|
const [indexBiz, setIndexBiz] = useState<number>(0);
|
|
|
|
const onSubmit = async (valuse: { items: PbnstRegArrrayType }) => {
|
|
const item = valuse.items[indexMng];
|
|
const data = item ? writeRgtrAndMdfr([item]) : [];
|
|
//
|
|
const handleConfirm = () => {
|
|
if (data && data[0]) {
|
|
setPbnstInsert(data[0]);
|
|
}
|
|
};
|
|
confirmToast(t("isInsertMsg"), handleConfirm);
|
|
};
|
|
|
|
const handleTabChange = (value: string) => {
|
|
setCurrentTab(value);
|
|
};
|
|
|
|
useEffect(() => {
|
|
console.log("form errors:", form.formState.errors);
|
|
}, [form.formState.errors]);
|
|
|
|
useEffect(() => {
|
|
const firstForm = form.getValues("items");
|
|
if (firstForm) {
|
|
setIndexMng(firstForm.length - 1);
|
|
}
|
|
}, [form]);
|
|
return (
|
|
<>
|
|
<h1 className="text-2xl font-medium text-label pl-8">
|
|
하수재이용 시설 신규등록
|
|
</h1>
|
|
|
|
<div className="border-t border-gray-300 my-4"></div>
|
|
|
|
<Tabs defaultValue="mng" onValueChange={handleTabChange}>
|
|
<div className="flex justify-between items-center">
|
|
<TabsList className="">
|
|
<TabsTrigger className="!text-xl" value="mng">
|
|
시설정보
|
|
</TabsTrigger>
|
|
<TabsTrigger className="!text-xl" value="buse">
|
|
차수별정보
|
|
</TabsTrigger>
|
|
|
|
</TabsList>
|
|
<Button
|
|
onClick={form.handleSubmit(onSubmit, onInvalid)}
|
|
size={"sm"}
|
|
className="mr-5 mt-2"
|
|
>
|
|
저장
|
|
</Button>
|
|
</div>
|
|
<ScrollArea className="h-[75vh]">
|
|
<TabsContent className="max-h-full" value="mng">
|
|
<PbnstMngForm
|
|
form={form}
|
|
formType={"reg"}
|
|
indexMng={indexMng}
|
|
setIndexMng={setIndexMng}
|
|
readonly={false}
|
|
/>
|
|
</TabsContent>
|
|
<TabsContent className="max-h-full" value="buse">
|
|
<PbnstBuseForm
|
|
form={form}
|
|
indexMng={indexMng}
|
|
indexBiz={indexBiz}
|
|
setIndexBiz={setIndexBiz}
|
|
formType={"reg"}
|
|
/>
|
|
</TabsContent>
|
|
</ScrollArea>
|
|
</Tabs>
|
|
</>
|
|
);
|
|
}
|