frontend/apps/wr/components/ui/modal/coMat/ruseCaseMng/ruseCaseMngExcelModal.tsx

import { useWrStore } from "@/app/store";
import { coRegExcel } from "@/app/store/matDmd/coSttn/headList";
import { reUseCaseNames } from "@/app/store/matDmd/ruseCaseMng/excel";
import type { ruseCaseMngExcelProps } from "@/app/store/matDmd/ruseCaseMng/index";
import { filePicked, Title } from "@common/business_components/ui";
import { Form } from "@common/business_components/ui/form";
import { Button, Input } from "@common/components/ui";
import { zodResolver } from "@hookform/resolvers/zod";
import { useState } from "react";
import { useForm } from "react-hook-form";
import type { z } from "zod";

export default function RuseCaseMngExcel() {
  const { insertRuseCaseMng } = useWrStore((state) => state);
  const form = useForm<z.infer<typeof coRegExcel>>({
    resolver: zodResolver(coRegExcel),
  });

  const [file, setFiles] = useState<File | undefined>();

  const onSubmit = () => {
    if (file) {
      filePicked(file, 0).then((res: unknown) => {
        try {
          const newArray: ruseCaseMngExcelProps[] = []
          const dataArray = Array.isArray(res) ? res : [];
          dataArray.forEach((item: Record<string, unknown>) => {
            const object: ruseCaseMngExcelProps = {
              ruseBizNm: '',
              bizBgngDate: '',
              bizEndDate: '',
              splyFcltKnd: '',
              splyFcltNm: '',
              splyFcltCpct: 0,
              dmdFcltNm: '',
              dmdFcltAddr: '',
              ruseFcltCpct: 0,
              ruseFcltPplLen: '',
              ruseFcltUsg: '',
              ruseFcltSplyCpct: 0,
              ruseFcltPrcsMsrc: '',
              grnteWqUsg: '',
              grnteWqGrssClfg: 0,
              grnteWqCombResdch: 0,
              grnteWqTrbt: '',
              grnteWqBod: '',
              grnteWqSmll: '',
              grnteWqCrmty: '',
              grnteWqTn: '',
              grnteWqTp: '',
              grnteWqPh: '',
              grnteWqClIonQnt: '',
              grnteWqCndctStat: '',
              grnteWqRmrk: '',
              reqBizReuseFcltCst: 0,
              reqBizPplCst: 0,
              reqBizArchCst: 0,
              reqBizMchnCst: 0,
              reqBizMtrngCst: 0,
              reqBizGisCst: 0,
              reqBizCctvCst: 0,
              reqBizCmcnCst: 0,
              reqBizWstCst: 0,
              reqBizDesignCst: 0,
              reqBizSpvsCst: 0,
              reqBizSbsdCst: 0,
              reqBizEtc: '',
              reqBizGrssCst: 0,
              prcmPlanNlep: 0,
              prcmPlanLcep: 0,
              prcmPlanBrdnCst: 0,
              prcmPlanEcqrRt: 0,
              prcmPlanGrssCst: 0,
              clclnNlep: 0,
              clclnLcep: 0,
              clclnBrdnCst: 0,
              clclnEcqrRt: 0,
              clclnGrssCst: 0,
            };

            Object.keys(reUseCaseNames).forEach((key: string) => {
              console.log("reUseCaseNames", reUseCaseNames)
              if (item && reUseCaseNames[key] !== undefined) {
                const mappedKey = reUseCaseNames[key];
                if (mappedKey && object.hasOwnProperty(mappedKey)) {
                  let value;

                  if(value === "-"){
                    value = '';
                  }
                  if(key === "사업시작일" || key === "사업종료일"){
                    if(item[key]?.toString().split(".")[1]?.length === 1){
                      value = `${item[key]?.toString().split(".")[0] || ""}${item[key]?.toString().split(".")[1]?.length === 1 ? "0" : ""}${item[key]?.toString().split(".")[1] || ""}`
                    }else{
                      value = `${item[key]?.toString().split(".")[0] || ""}${item[key]?.toString().split(".")[1] || ""}`
                    }
                  }else if(key === "재이용시설_관로(km)" || key?.toString().includes("보증수질_")){
                    value = item[key]?.toString().trim() || '';
                  }else{
                    if(item[key]?.toString().includes("%") && Number(item[key]?.toString().replaceAll("%", ""))){
                      value = item[key]?.toString().replaceAll("%", "");
                    }else{
                      value = item[key];
                    }
                  }

                  if(value === null || value?.toString().trim() === "-" || value?.toString().trim() === ""){
                    if (typeof object[mappedKey as keyof ruseCaseMngExcelProps] === 'number') {
                      (object as unknown as Record<string, unknown>)[mappedKey] = '';
                    } else {
                      (object as unknown as Record<string, unknown>)[mappedKey] = '';
                    }
                  }else if (typeof object[mappedKey as keyof ruseCaseMngExcelProps] === 'number' && Number(value?.toString().replaceAll("%", "").replaceAll(",", ""))) {
                    (object as unknown as Record<string, unknown>)[mappedKey] = Number(value?.toString().replaceAll("%", "").replaceAll(",", ""));
                  }else{
                    (object as unknown as Record<string, unknown>)[mappedKey] = value?.toString().trim() || '';
                  }
                }
              }
            });
            newArray.push(object);
          });
          console.log("newArray : ", newArray);
          insertRuseCaseMng(newArray);
        } catch (e) {
          console.log(e)
        }
      });
    };
  }

  return (
    <>
      <div>
        <Form {...form}>
          <form onSubmit={form.handleSubmit(onSubmit)}>
            <div>
              <Title title={"물재이용 사례 등록"}></Title>
            </div>
            <div className="flex justify-between">
              <h3 className="text-2xl font-bold text-gray-900 mt-1 ml-7">
                {"물재이용 사례 파일"}
              </h3>
              <Button className="" type="submit" size={"sm"}>
                저장
              </Button>
            </div>

            <div>
              <div className="space-y-4 p-4">
                <Input
                  type="file"
                  onChange={(e) => {
                    const selectedFile = e.target.files?.[0];
                    if (selectedFile) setFiles(selectedFile);
                  }}
                  accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
                />
              </div>
            </div>
          </form>
        </Form>
      </div>
    </>
  );
}