수요정보 등록 기능 추가

2026-03-25 11:44:18 +09:00
parent 645a7db2e5
commit a57c1a4a5c
131 changed files with 771 additions and 88 deletions
@@ -71,11 +71,13 @@ export default function SimilarCaseModal({
  onClose,
  rows,
  detailsByCaseId,
+  onSearch
 }: {
  open: boolean;
  onClose: () => void;
  rows: SimilarCaseRow[];
  detailsByCaseId: Record<string, SimilarCaseDetail | undefined>;
+  onSearch :(criterion: Criterion) => void;
 }) {
  const titleId = useId();

@@ -192,12 +194,15 @@ export default function SimilarCaseModal({
                  const v = e.target.value as Criterion;
                  setCriterion(v);
                  setSelectedCaseId("");
+
+                  if(v){
+                    onSearch(v);
+                  }
                }}
                className="h-10 w-[180px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
              >
                <option value="">유사기준선택</option>
                <option value="supplyAmt">공급량</option>
-                <option value="treatment">처리공법</option>
                <option value="usePurpose">이용용도</option>
              </select>
            </div>
@@ -0,0 +1,11 @@
+"use client";
+import "../globals.css";
+import { StoreProvider } from "../store";
+
+export default function PopupLayout({
+  children,
+}: Readonly<{
+  children: React.ReactNode;
+}>) {
+  return <StoreProvider>{children}</StoreProvider>;
+}
@@ -0,0 +1,274 @@
+"use client";
+
+import Gis from "@common/business_components/ui/map/Gis";
+import { useEffect, useRef, useState } from "react";
+import { mapService } from "../service";
+import GisApp from "@common/business_components/ui/map/lib/gis.core";
+import { SearchBar } from "@/components/ui/map/searchBar/searchBar";
+import SelectedFcltList from "./selectedFcltList";
+import type { SubsInfo } from "@/app/store/map/type";
+
+const Map = () => {
+  const [treeData, setTreeData] = useState([]); // 초기값을 객체 또는 null로 설정
+  const gisMaps = useRef<any | null>(null);
+  const [isOpen, setIsOpen] = useState(false); // 팝업 열기/닫기 상태
+  const [isSearchModalOpen, setIsSearchModalOpen] = useState(true); // SearchModal 열림 상태
+  const [featureData, setFeatureData] = useState(null); // 선택된 피쳐 데이터
+  const [selectDataPk, setSelectDataPk] = useState<Record<string, any>>({});
+  const [selectedFclts, setSelectedFclts] = useState<any[]>([]);
+
+  //적용 버튼 클릭 이벤트
+  const onApply = () => {
+    if (selectedFclts.length > 3) {
+      alert("재이용시설 후보지는 최대 3개까지만 선택할 수 있습니다.");
+      return;
+    }
+
+    const subsInfoList: SubsInfo[] = selectedFclts.map((fclt) => ({
+      ruseUtztnFcltNm: fclt.ruseUtztnFcltNm,
+      ruseUtztnFcltCd: fclt.pbnstRuseFcltId,
+    }));
+
+    window.opener.postMessage(
+      {
+        type: "SET_SUBS_INFO",
+        payload: subsInfoList, // 또는 필요한 데이터
+      },
+      "*"
+    );
+
+    window.close();
+  };
+
+  //트리 레이어 데이터 조회
+  const fetchData = async () => {
+    try {
+      const response = await mapService.getLyrStngs();
+      setTreeData(response); // API 응답 저장
+    } catch (error) {
+      console.error("데이터 불러오기 실패:", error);
+    }
+  };
+
+  //하수처리시설코드로 재이용시설 목록 조회
+  const reuseData = async (ruseFcltPk: any) => {
+    try {
+      const response = await mapService.getPbnstRuseFclts(ruseFcltPk);
+      const data = response.data || [];
+      setSelectedFclts((prev) => {
+        const newItems = data.filter(
+          (item: any) =>
+            item &&
+            Object.keys(item).length > 0 &&
+            !prev.some((f) => f.pbnstRuseFcltId === item.pbnstRuseFcltId)
+        );
+        console.log(newItems);
+        return [...prev, ...newItems];
+      });
+    } catch (error) {
+      console.error("데이터 불러오기 실패:", error);
+    }
+  };
+
+  // 컴포넌트 마운트 시 1회 실행
+  useEffect(() => {
+    fetchData();
+  }, []);
+
+  // 레이어 생성 후 초기화 처리
+  const onCheckedLayersChange = () => {
+    //수요처 ID
+    const urlParams = new URLSearchParams(window.location.search);
+    const dmdInfoId = urlParams.get("dmdInfoId");
+
+    //수요처 위치로 화면 이동
+    const maps = gisMaps.current;
+    const layer = GisApp.Module.layer as any;
+    const layerNm = "tb_wr_ruse_fclt_dmd_co";
+    const featureId = `${layerNm}.${dmdInfoId}`;
+    let foundFeature: any = null;
+
+    maps
+      .getLayers()
+      .getArray()
+      .forEach((layer: any) => {
+        if (layer.get("lyrTyNm") == layerNm) {
+          const source = layer.getSource?.();
+          if (source?.getFeatureById) {
+            const feature = source.getFeatureById(String(featureId).trim());
+            if (feature) {
+              foundFeature = feature;
+              return;
+            } 
+          }
+        }
+      });
+
+    if (foundFeature) {
+      const geometry = foundFeature.getGeometry();
+
+      if (geometry) {
+        const extent = geometry.getExtent();
+
+        if (geometry.getType() === "Point") {
+          maps.getView().setCenter(geometry.getCoordinates());
+          maps.getView().setZoom(11);
+        } else {
+          maps.getView().fit(extent, {
+            duration: 300,
+            padding: [30, 30, 30, 30],
+            maxZoom: 16,
+          });
+        }
+      }
+
+      layer.highLightFeature(
+        [foundFeature],
+        {
+          id: GisApp.hlLayerId,
+          zIndex: 10,
+          opacity: 1,
+          selectable: true,
+        },
+        { width: 30 }
+      );
+    } else {
+      alert("수요처의 좌표정보를 찾을수 없으므로, 상단 조회조건의 시설명을 입력하여 위치를 조회하시기 바랍니다.");
+    }
+
+    const formatNumber = (val: any) => {
+      const num = Number(val);
+      return isNaN(num) ? "-" : num.toLocaleString();
+    };
+
+    // 재이용시설 오버레이
+    maps
+      .getLayers()
+      .getArray()
+      .forEach((layer: any) => {
+        if (layer.get("lyrTyNm") === "tb_wr_bdst_ruse_fclt") {
+          const source = layer.getSource?.();
+          if (source?.getFeatures) {
+            const features = source.getFeatures();
+
+            features.forEach((feature: any) => {
+              // 필요한 고유 ID 또는 속성 가져오기 (예: ftrIdn 또는 feature.getId())
+              const featureId =
+                feature.getId() || feature.get("ftrIdn") || Math.random();
+
+              // HTML 또는 React 오버레이 컴포넌트 구성
+              const overlayContent = `
+              <div class="rounded-md border border-gray-300 bg-white shadow-md text-sm w-[120px]">
+                <!-- 헤더 -->
+                <div class="bg-cyan-700 text-white px-3 py-2 text-[11px] font-semibold text-center rounded-t-md">
+                  ${feature.get("swtrmt_fclt_nm") || "-"} 
+                </div>
+            
+                <!-- 테이블 -->
+                <table class="w-full text-sm text-gray-800 border-t border-gray-200">
+                  <tbody>
+                    <tr class="border-b border-gray-200">
+                      <th class="bg-gray-100 text-gray-600 font-semibold text-[10px] text-left">용량(m³/일)</th>
+                      <td class="text-right text-[10px] font-bold">${formatNumber(feature.get("fclt_cpct"))}</td>
+                    </tr>
+                  </tbody>
+                </table>
+              </div>
+            `;
+              feature.set("html", overlayContent);
+              feature.set("overLayId", `overLay.${featureId}`);
+            });
+          }
+        }
+      });
+  };
+
+  // 검색해서 재이용시설 선택하면 해당 시설로 화면 이동 처리
+  useEffect(() => {
+    if (!selectDataPk || Object.keys(selectDataPk).length === 0) return;
+    const maps = gisMaps.current;
+    let foundFeature: any = null;
+    const layerNm = "tb_wr_bdst_ruse_fclt";
+    const featureId = `${layerNm}.${selectDataPk.bscFctCd}`;
+    maps
+      .getLayers()
+      .getArray()
+      .forEach((layer: any) => {
+        if (layer.get("lyrTyNm") == layerNm) {
+          const source = layer.getSource?.();
+          if (source?.getFeatureById) {
+            const feature = source.getFeatureById(String(featureId).trim());
+            if (feature) {
+              foundFeature = feature;
+              return;
+            }
+          }
+        }
+      });
+
+    if (foundFeature) {
+      const geometry = foundFeature.getGeometry();
+      if (geometry) {
+        const extent = geometry.getExtent();
+
+        maps.getView().fit(extent, {
+          duration: 300,
+          padding: [50, 50, 50, 50],
+          maxZoom: 16,
+          constrainResolution: true,
+          nearest: true,
+        });
+      }
+    } else {
+      console.warn("OpenLayers Feature를 찾을 수 없습니다:", selectDataPk);
+    }
+  }, [selectDataPk]);
+
+  // 재이용시설 클릭 시 선택 시설목록에 추가
+  const onFeatureSelect = (data: any) => {
+    // 처리시설코드
+    const swtrmtFcltCd = data.get("swtrmt_fclt_cd");
+    reuseData(swtrmtFcltCd);
+  };
+
+  return (
+    <>
+      <div className="bg-container">
+        <Gis
+          showZoomLevel={true}
+          height='h-screen'
+          treeData={treeData}
+          isSearch={false}
+          gisMaps={gisMaps}
+          isMiniMap={false}
+          searchView={undefined}
+          detailView={undefined}
+          onFeatureSelect={onFeatureSelect}
+          setIsOpen={setIsOpen}
+          setFeatureData={setFeatureData}
+          featureData={featureData}
+          setIsSearchModalOpen={setIsSearchModalOpen}
+          isOpen={isOpen}
+          isSearchModalOpen={isSearchModalOpen}
+          onCheckedLayersChange={onCheckedLayersChange}
+          imgVisble={false}
+          searchBar={
+            <SearchBar
+              setHasuPk={(hasuPk: any) => {
+                if (hasuPk) setSelectDataPk(hasuPk);
+              }}
+              onApply={onApply}
+            />
+          }
+          waterDepth={undefined}
+        />
+      </div>
+      <SelectedFcltList
+        data={selectedFclts}
+        onRemove={(updatedList) => setSelectedFclts(updatedList)}
+      />
+    </>
+  );
+};
+
+export default Map;
@@ -0,0 +1,81 @@
+import React from "react";
+
+type FcltItem = {
+  pbnstRuseFcltId: string;
+  ruseUtztnFcltNm: string;
+  splyExtraCpct?: number;
+  ruseCpct?: number;
+  [key: string]: any;
+};
+
+export default function SelectedFcltList({
+  data = [],
+  onRemove,
+}: {
+  data: FcltItem[];
+  onRemove: (updatedList: FcltItem[]) => void;
+}) {
+  const handleDelete = (code: string) => {
+    const updatedList = data.filter((item) => item.pbnstRuseFcltId !== code);
+    onRemove(updatedList);
+  };
+
+  const TableContent = (
+    <>
+      <thead className="bg-gray-100 text-gray-700 text-[13px]">
+        <tr>
+          <th className="px-3 py-2 text-left border-b">시설명</th>
+          <th className="px-3 py-2 text-right border-b">
+            하수처리량
+            <br />
+            (㎥/일)
+          </th>
+          <th className="px-3 py-2 text-right border-b">
+            재이용량
+            <br />
+            (㎥/일)
+          </th>
+          <th className="px-3 py-2 border-b">삭제</th>
+        </tr>
+      </thead>
+      <tbody>
+        {data.map((item) => (
+          <tr key={item.pbnstRuseFcltId} className="border-b last:border-none">
+            <td className="px-3 py-2 text-[12px]">{item.ruseUtztnFcltNm}</td>
+            <td className="px-3 py-2 text-right text-[12px]">
+              {Number(item.splyExtraCpct || 0).toLocaleString()}
+            </td>
+            <td className="px-3 py-2 text-right text-[12px]">
+              {Number(item.ruseCpct || 0).toLocaleString()}
+            </td>
+            <td className="px-3 py-2 text-center">
+              <button
+                onClick={() => handleDelete(item.pbnstRuseFcltId)}
+                className="text-red-500 hover:text-red-700 text-sm font-bold"
+                aria-label="삭제"
+                title="삭제"
+              >
+                ✕
+              </button>
+            </td>
+          </tr>
+        ))}
+      </tbody>
+    </>
+  );
+
+  if (data.length === 0) return null;
+
+  return (
+    <div className="fixed right-40 top-[8rem] w-[40rem] max-h-[130rem] overflow-auto bg-white shadow-lg rounded p-4 border border-gray-300 z-50">
+      <h3 className="bg-cyan-700 text-white text-xl font-bold mb-2 p-2">
+        선택된 시설
+      </h3>
+      <div className="overflow-x-auto">
+        <table className="w-full text-sm text-gray-800 border border-gray-200">
+          {TableContent}
+        </table>
+      </div>
+    </div>
+  );
+}
@@ -0,0 +1 @@
+export * from './map'
@@ -0,0 +1,59 @@
+/**
+ * 관망도 API
+ */
+import { DEV_URL_WR, DEV_URL_SN } from "@/components/ui/config";
+
+export type LyrStngProps = {
+  lyr_sn: string
+  lyr_nm: string
+  upper_lyr_sn: string  
+  drawOrdr: string
+  flterSql: string
+  gobjTy: string
+  lyrTpNm: string
+  useYn: string
+  minViewSize: string
+  iconNm: string
+  lblAtrbNm: string
+  fontNm: string
+  fontIntnColor: string
+  fontExtnColor: string
+  fontExtnWdth: string
+  lnWdth: string
+  lnColor: string
+  polgnColor: string
+  initEprssYn: string
+  clickPsblYn: string
+}
+
+export const mapService = {
+  //레이어 설정 조회
+  getLyrStngs: async () => {
+    const response = await fetch(`${DEV_URL_SN}/api/v1/map/lyrStngs/DM_NETWORK`, {
+      method: 'GET',
+      headers: {
+        'Accept': 'application/json',
+      },
+    });
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+
+    return response.json();
+  },
+  getPbnstRuseFclts: async (ruseFcltPk:any) => {
+    const response = await fetch(`${DEV_URL_WR}/reuseFc/pubFc/${ruseFcltPk}`, {
+      method: 'GET',
+      headers: {
+        'Accept': 'application/json',
+      },
+    });
+
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+
+    return response.json();
+  }
+}
@@ -8,10 +8,13 @@
 */
 "use client";

-import { useMemo, useState, useRef } from "react";
+import { useMemo, useState, useRef, useEffect } from "react";
 import SubPageHeader from "@/components/SubPageHeader";
 import WaterQualityRefModal from "../modal/WaterQualityRefModal";
 import CandidateSiteModal, { type CandidateSite } from "@/components/CandidateSiteModal";
+import { useDmStore}  from "@/app/store";
+import type { SdmInfoFormData } from "@/app/store/sdmMng";
+import SimilarCaseModal, { type SimilarCaseDetail, type SimilarCaseRow } from "@/app/(landing)/reuse/apply/modal/SimilarCaseModal";

 type PHRange = { min: string; max: string };

@@ -36,7 +39,7 @@ export default function DemandRegisterPage() {
  const [hopePrice, setHopePrice] = useState<string>("");

  // 요구수질
-  const [coliform, setColiform] = useState<string>("");
+  const [coliform, setColiform] = useState<string>(""); // 총대장균군수
  const [noDetect, setNoDetect] = useState<boolean>(false);

  const [tn, setTn] = useState<string>("");
@@ -56,6 +59,214 @@ export default function DemandRegisterPage() {
  const [cand2, setCand2] = useState("");
  const [cand3, setCand3] = useState("");

+  const useTypesData = useDmStore((state) => state.Sdm.useTypesData);
+  const getUseTypesData = useDmStore((state) => state.getUseTypesData);
+  const [openSimilar, setOpenSimilar] = useState(false);
+
+  // 유사사례
+  const similarCaseList = useDmStore((state) => state.Sdm.similarCaseList);
+  const getSimilarCaseList = useDmStore((state) => state.getSimilarCaseList);
+
+
+  const insertSdmInfoData = useDmStore(
+    (state) => state.insertSdmInfoData
+  );
+
+  useEffect(() => {
+    getUseTypesData();
+  }, [getUseTypesData]);
+
+  // option
+  // 'req':필수 / 'num' : 숫자 / 'num+[숫자] : 자릿수 
+  const validation = (val, text, option :string[]=[] ) => {
+    if(option.includes('req')){
+      if(val.trim() === "" || val ===undefined) {
+        alert(`${text} 항목은 필수 입력값입니다.`); 
+        return false;
+      }
+    }else{
+      if(val.trim()===""){
+        return true;
+      }
+    }
+
+    const numOption = option.find((opt) => opt.startsWith("num"));
+    if (numOption) {
+      const isDot = numOption.includes("Dot");
+
+      // 3. 숫자 체크
+      const regex = isDot ? /^\d+(\.\d+)?$/ : /^\d+$/;
+
+      if (!regex.test(val)) {
+        alert(
+          `${text}은(는) ${
+            isDot ? "숫자 또는 소수" : "숫자"
+          }만 입력 가능합니다.`
+        );
+        return false;
+      }
+
+      // 4. 자리수 체크
+      const lengthStr = numOption.replace("numDot", "").replace("num", "");
+
+      if (lengthStr) {
+        const length = Number(lengthStr);
+
+        if (isDot) {
+          // 🔥 소수 자리수 체크 (소수점 기준)
+          const decimalPart = val.split(".")[1];
+
+          if (decimalPart && decimalPart.length > length) {
+            alert(`${text}은(는) 소수점 ${length}자리까지 가능합니다.`);
+            return false;
+          }
+        } else {
+          // 정수 자리수 체크
+          if (val.length !== length) {
+            alert(`${text}은(는) ${length}자리여야 합니다.`);
+            return false;
+          }
+        }
+      }
+    }
+    return true;
+  }
+
+  const rows: SimilarCaseRow[] = similarCaseList.map((el, idx) => ({
+    caseId: String(idx),
+    projectName: el.ruseBizNm,
+    period: `${el.bizBgngDate} ~ ${el.bizEndDate}`,
+
+    supplyFacilityType: el.splyFcltKnd,
+    supplyName: el.splyFcltNm,
+    supplyCapacity: Number(el.splyFcltCpct),
+
+    demandName: el.dmdFcltNm,
+    demandAddress: el.dmdFcltAddr,
+
+    facilityCapacity: Number(el.ruseFcltCpct),
+    pipeKm: Number(el.ruseFcltPplLen),
+    purpose: el.ruseFcltUsg,
+
+    supplyAmt: Number(el.ruseFcltSplyCpct),
+    treatment: el.ruseFcltPrcsMsrc,
+    usePurpose: el.ruseFcltUsg,
+  }));
+
+  const detailsByCaseId: Record<string, SimilarCaseDetail> = {};
+  similarCaseList.forEach((el, idx) => {
+    detailsByCaseId[String(idx)] = {
+      coliform: el.grnteWqGrssClfg,
+      residualCl: el.grnteWqCombResdch,
+      turbidity: el.grnteWqTrbt,
+      bod: el.grnteWqBod,
+      odor: el.grnteWqSmll,
+      color: el.grnteWqCrmty,
+      tn: el.grnteWqTn,
+      tp: el.grnteWqTp,
+      ph: el.grnteWqPh,
+      chloride: el.grnteWqClIonQnt,
+      ec: el.grnteWqCndctStat,
+      note: el.grnteWqRmrk,
+
+      costTotal: Number(el.reqBizGrssCst),
+      costFacility: Number(el.reqBizReuseFcltCst),
+      costPipe: Number(el.reqBizPplCst),
+      costDesign: Number(el.reqBizDesignCst),
+      costSupervision: Number(el.reqBizSpvsCst),
+      costOther: Number(el.reqBizEtc),
+
+      fundingTotal: Number(el.prcmPlanGrssCst),
+      fundingNational: Number(el.prcmPlanNlep),
+      fundingLocal: Number(el.prcmPlanLcep),
+      fundingSelf: Number(el.prcmPlanBrdnCst),
+      fundingRate: Number(el.prcmPlanEcqrRt),
+    };
+  });
+
+  // 데이터 저장
+  const saveInfo = async() => {
+    if(!validation(reqQty, '요구수량', ['req', 'numDot'])) return false;
+    if(!validation(usePurpose, '사용용도', ['req'])) return false;
+    if(!validation(hopePrice, '희망단가', ['req', 'numDot'])) return false;
+    if(!noDetect && !validation(coliform, '총대장균군수', ['req','numDot'])) return false;
+    if(!validation(residualCl, ['req', '결합잔류염소', 'numDot'])) return false;
+    if(!validation(turbidity, '탁도', ['req', 'numDot'])) return false;
+    if(!validation(bod, '생물화학적산소요구량', ['req', 'numDot'])) return false;
+    if(!validation(odor, '냄새', ['req'])) return false;
+    
+    // 필수는 아니지만 숫자로는 들어와야함.
+    if(!validation(tn, '총질소', ['numDot'])) return false;
+    if(!validation(residualCl, '결합잔류염소', ['numDot'])) return false;
+    if(!validation(tp, '총인', ['numDot'])) return false;
+    if(!validation(ph.min, 'ph', ['numDot'])) return false;
+    if(!validation(ph.max, 'ph', ['numDot'])) return false;
+    if(!validation(chloride, '염화물', ['numDot'])) return false;
+    if(!validation(ec, '전기전도도', ['numDot'])) return false;
+    
+    const userStr = sessionStorage.getItem("user");
+    const user = userStr ? JSON.parse(userStr) : null;
+
+    if(user){
+      const payload : SdmInfoFormData = {
+        dmndTmng : new Date(reqDate),
+        dmdInfoId : user.dmdInfoId,
+        dmndQty : Number(reqQty),
+        wntUntprc : Number(hopePrice),
+        useUsgCd : usePurpose,
+        // 수질
+        grssClfg : Number(coliform),
+        tn : Number(tn)||null,
+        combResdch: Number(residualCl)||null,
+        tph : Number(tp)||null,
+        trbt : Number(turbidity),
+        ph : ph.min||''+((ph.min||ph.max)?'~':'')+ph.max||'',
+        blgcOxygDmndQnt : Number(bod),
+        clIonQnt : Number(chloride)||null,
+        smll : odor,
+        cdtnv : Number(ec)||null, 
+        crmty : Number(color)||null,
+        rmrk : remark
+      }
+      insertSdmInfoData(payload);
+    }
+  }
+
+  const searchCandidate = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    const dmdInfoId = JSON.parse(
+      sessionStorage.getItem("user") || "{}"
+    )?.dmdInfoId?.toString();
+
+    const url = `/map/popup?dmdInfoId=${encodeURIComponent(dmdInfoId)}`;
+    const width = window.screen.availWidth;
+    const height = window.screen.availHeight;
+    const left = 0;
+    const top = 0;
+    const popupOptions = `width=${width},height=${height},left=${left},top=${top},resizable=yes,scrollbars=yes`;
+    window.open(url, "candidatePopup", popupOptions);
+  };
+
+  const getCriterionCode = (criterion: string) => {
+    switch (criterion) {
+      case "supplyAmt":
+        return "S";
+      case "money":
+        return "M";
+      case "usePurpose":
+        return "U";
+      default:
+        return "";
+    }
+  };
+
+  const searchSimilarCase = async (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    setOpenSimilar(true);
+  };
+
  return (
    <>
    
@@ -89,7 +300,18 @@ export default function DemandRegisterPage() {
                    <Divider />

                    <FormRow label="사용용도" required>
-                        <TextInput value={usePurpose} onChange={setUsePurpose} />
+                      <select
+                        value={usePurpose}
+                        onChange={(e) => setUsePurpose(e.target.value)}
+                        className="h-11 w-full max-w-[200px] rounded-md border border-neutral-300 bg-white px-3 text-sm outline-none focus:border-neutral-500"
+                      >
+                        <option value="">선택하세요</option>
+                        {useTypesData.map((item) => (
+                          <option key={item.val} value={item.val}>
+                            {item.text}
+                          </option>
+                        ))}
+                      </select>
                    </FormRow>

                    <Divider />
@@ -262,16 +484,21 @@ export default function DemandRegisterPage() {
                                <button
                                    type="button"
                                    className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-700"
-                                    onClick={() => setOpenCand(true)}
-                                >
+                                    onClick={(e) => {
+                                      searchCandidate(e);
+                    
+                                      //splyList => 해당객체가 대민에서 선택한 후보처 리스트
+                                      //setLastSub => 해당 스테이트가 선택한 마지막 후보처를 넣어야하는 스테이트
+                                    }}>
                                    후보지 조회
                                </button>
+                                    
                                <button
                                    type="button"
                                    className="h-11 rounded-md bg-[#888] px-5 text-base text-white hover:bg-neutral-600"
-                                    onClick={() => {
+                                    onClick={(e) => {
                                    // TODO: 유사사례 연결
-                                    console.log("유사사례");
+                                      searchSimilarCase(e);
                                    }}
                                >
                                    유사사례
@@ -289,16 +516,28 @@ export default function DemandRegisterPage() {
                        className="h-11 rounded-md bg-[#0B4EA2] px-10 text-lg text-white hover:opacity-90"
                        onClick={() => {
                        // TODO: 저장 처리
-                        console.log("수요정보 등록");
+                          saveInfo();
                        }}
                    >
                        수요정보 등록
                    </button>
                </div>
-
            </div>
        </main>

+        <SimilarCaseModal
+          open={openSimilar}
+          onClose={() => setOpenSimilar(false)}
+          rows={rows} // 실제 데이터
+          detailsByCaseId={detailsByCaseId}
+          onSearch={async (criterion) => {
+            const code = getCriterionCode(criterion);
+            if (!code) return;
+            // 값은 상황에 맞게 (예시: usePurpose)
+            await getSimilarCaseList(code, code=='S'?reqQty:code=='U'?usePurpose:'');
+          }}
+        />
+
        <CandidateSiteModal
            open={openCand}
            onClose={() => setOpenCand(false)}
@@ -1,4 +1,4 @@
-import { fetchType, getFetch, postFetch } from "@/components/ui/api";
+import { fetchType, getFetch, postFetch, getFetchWithCount } from "@/components/ui/api";
 import type { SelectDataType } from "@common/business_components/ui";
 import type { TableUpperProps } from "../common";
 import toast from "react-hot-toast";
@@ -10,34 +10,27 @@ import { z } from "zod";
 =====================================*/

 export const sdmInfoFormSchema = z.object({
-  sdmNm: z.string().min(1, "수요처를 선택해주세요"),
-  demandYmd: z.date().optional(),
-  demandQnty: z
-    .string()
-    .min(1, "요구수량을 입력해주세요")
-    .regex(/^[0-9]+$/, "요구수량은 숫자만 입력 가능합니다"),
-  usePurpose: z.string().optional(),
-  money: z.string().regex(/^[0-9]+$/, "희망단가는 숫자만 입력 가능합니다"),
-  /**요구수질 */
-  reqWaterQlty: z.string().optional(),
+  dmdInfoId: z.string().optional(),
+  dmndTmng: z.date().optional(),
+  dmndQty: z.number().min(1, "요구수량을 입력해주세요"),
+  wntUntprc: z.number().min(1, "희망단가를 입력해주세요"),
+  useUsgCd: z.string().min(1, "사용용도를 선택해주세요"),
+  /** 수질 */
  grssClfg: z.number().nullish(),
  tn: z.number().nullish(),
  combResdch: z.number().nullish(),
  tph: z.number().nullish(),
  trbt: z.number().nullish(),
  ph: z.string().nullish(),
-  bod: z.number().nullish(),
-  /**컬럼확인필요 */
+  blgcOxygDmndQnt: z.number().nullish(),
  clIonQnt: z.number().nullish(),
  smll: z.string(),
  cdtnv: z.number().nullish(),
  crmty: z.number().nullish(),
+
  rmrk: z.string().optional(),
-  /* telno: z.string()
-    .min(8, "전화번호는 8자 이상 입력해주세요")
-    .max(12, "전화번호는 12자 이내로 입력해주세요")
-    .regex(/^[0-9-]+$/, "전화번호는 숫자와 하이픈(-)만 입력 가능합니다"), */
-  candidateTitle: z
+
+  splyCndtList: z
    .array(
      z.object({
        ruseUtztnFcltNm: z.string(),
@@ -45,58 +38,6 @@ export const sdmInfoFormSchema = z.object({
      })
    )
    .optional(),
-}).superRefine((data, ctx) => {
-  const disabledFields = disableRules[data.usePurpose ?? ""] || [];
-  // 모든 수질 관련 필드
-  // 총대장균군수는 null 값을 불검출로 표시하기때문에 해당 검사에서 제외함.
-  const allFields: (keyof typeof data)[] = [
-    "tn", "combResdch", "tph",
-    "trbt", "ph", "bod", "clIonQnt",
-    "smll", "cdtnv", "crmty",
-  ];
-
-  const allFieldsName: Record<string, string> = {
-    tn: "총질소(T-N)(mg/L)",
-    combResdch: "결합잔류염소(mg/L)",
-    tph: "총인(T-P)(mg/L)",
-    trbt: "탁도(NTU)",
-    ph: "수소이온농도(pH)",
-    bod: "생물학적 산소요구량(BOD)(mg/L)",
-    clIonQnt: "염화물(mgCL/L)",
-    smll: "냄새",
-    cdtnv: "전기전도도(㎲/cm)",
-    crmty: "색도(도)",
-  };
-  allFields.forEach((field) => {
-    const isDisabled = disabledFields.includes(field);
-    if (!isDisabled) {
-      // disabled가 아닌 필드는 반드시 값이 있어야 함
-      const value = data[field];
-      if (typeof value === "string") {
-        if (value.trim().length === 0) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (typeof value === "number") {
-        if (value <= 0 || Number.isNaN(value)) {
-          ctx.addIssue({
-            code: z.ZodIssueCode.custom,
-            path: [field],
-            message: `${allFieldsName[field]} 을 입력해주세요.`,
-          });
-        }
-      } else if (value == null) {
-        ctx.addIssue({
-          code: z.ZodIssueCode.custom,
-          path: [field],
-          message: `${allFieldsName[field]}  을 입력해주세요.`,
-        });
-      }
-    }
-  });
 });

 export type SdmInfoFormData = z.infer<typeof sdmInfoFormSchema>;
@@ -394,7 +335,7 @@ const defaultRules: Record<string, object> = {

 // 사용용도
 const useTypesData: SelectDataType[] = [
-  { text: '청소', val: "청소" },
+/*   { text: '청소', val: "청소" },
  { text: "화장실용수", val: "화장실용수" },
  { text: "세척", val: "세척" },
  { text: "살수", val: "살수" },
@@ -402,7 +343,7 @@ const useTypesData: SelectDataType[] = [
  { text: "농업_간접용수", val: "농업_간접용수" },
  { text: "농업_직접용수", val: "농업_직접용수" },
  { text: "하천", val: "하천" },
-  { text: "공업", val: "공업" },
+  { text: "공업", val: "공업" }, */
 ];

 // 유사사례 모달 헤더
@@ -513,13 +454,13 @@ const postSdmData = async (data: DemandCompType) => {
 }

 // 수요정보 등록
-const postSdmInfoData = async (data: DemandCompBizType) => {
+const postSdmInfoData = async (data: SdmInfoFormData) => {
  try {
    await postFetch("/reuseFc/request/demandInfo", data);
-    toast.success('수요 정보 등록에 성공하였습니다.');
+    alert('수요 정보 등록에 성공하였습니다.');
  } catch (error) {
    console.log(error);
-    toast.error('수요 정보 등록에 실패하였습니다.');
+    alert('수요 정보 등록에 실패하였습니다.');
  }
 }

@@ -595,12 +536,14 @@ const fetchGetSimilarCaseList = async (part: string, value: number | string) =>
 export type SdmActions = {
  initializeSdmData: () => void;
  insertSdmData: (data: DemandCompType) => Promise<void>;
-  insertSdmInfoData: (data: DemandCompBizType) => Promise<void>;
+  insertSdmInfoData: (data: SdmInfoFormData) => Promise<void>;
  getDemandCompList: (searchText: string, pageCnt: number) => Promise<void>;
  actionLogin: (data: DemandCompType) => Promise<void>;
  getSdmInfoStatusList: (dmdInfoId: string) => Promise<void>;
  getSimilarCaseList: (part: string, value: number | string) => Promise<void>;
  actionLogout: () => Promise<void>;
+
+  getUseTypesData: () => Promise<void>;
 }

 export type SdmType = {
@@ -668,7 +611,7 @@ export const SdmReducer = (set: any): SdmActions => {
      }
    },

-    insertSdmInfoData: async (data: DemandCompBizType) => {
+    insertSdmInfoData: async (data: SdmInfoFormData) => {
      postSdmInfoData(data);
    },

@@ -795,6 +738,24 @@ export const SdmReducer = (set: any): SdmActions => {
          successLogin: false,
        }
      }))
+    },
+
+    getUseTypesData: async () => {
+      //http://dev.onasys.co.kr:3000/server/cms-service/api/v1/lwpo-cds?lwpoCdNm=&sort=regDt,desc&upCd=WR018&page=0&size=10
+
+      const upCd = await getFetchWithCount(
+        fetchType.CS,
+        "/cms-service/api/v1/lwpo-cds/?lwpoCdNm=&sort=regDt,desc&upCd=WR018&page=0&size=100"
+      );
+
+      const comUseTypes = upCd.content.filter(el=>el.lwpoCdNm != '친수용수').map((el: any) => ({ text: el.lwpoCdNm, val: el.lwpoCd }));
+
+      set((state: SdmType) => ({
+        Sdm: {
+          ...state.Sdm,
+          useTypesData: comUseTypes,
+        }
+      }));
    }
  }
 }
@@ -1,6 +1,7 @@
 //8880
 import { AUTH_USER_ID, CLAIM_NAME } from "@/src/shared/config";
 import { getCookie } from "@common/components/lib/cookie";
+import { DEV_URL_FO, DEV_URL_WR, LOCAL_URL } from "../config/";


 const tokenId = getCookie(AUTH_USER_ID);
@@ -10,7 +11,9 @@ export const fetchType = {
  COMMON: "common",
  WR: "wr",
  FO: "fo",
-  SN: "sn"
+  SN: "sn",
+  LOCAL: "LOCAL",
+  CS: "CS",
 };

 const API_VERSION = "/api/v1"
@@ -44,6 +47,55 @@ export const getFetch = async (type: string, url: string) => {
  return res;
 };

+export const getFetchWithCount = async (type: string, url: string) => {
+  const div =
+    type === fetchType.COMMON
+      ? DEV_URL_FO
+      : type === fetchType.LOCAL
+        ? LOCAL_URL
+        : type === fetchType.CS
+          ? ""
+          : DEV_URL_WR;
+  const apiUrl = div + url;
+
+  const response = await fetch(apiUrl, {
+    method: "GET",
+    headers: {
+      accept: "application/json",
+    },
+  });
+
+  if (!response.ok) {
+    console.log(`오류 발생: ${response.status}`);
+  }
+
+  const contentType = response.headers.get("content-type") ?? "";
+
+  if (contentType.includes("application/json")) {
+    // JSON 응답 처리
+    const res = await response.json();
+
+    return res;
+  } else if(contentType.includes('application/octet-stream')) {
+    // 파일 응답 처리 (ex. PDF, Excel 등)
+
+    console.log('contentType ' ,contentType)
+    const blob = await response.blob();
+    const blobUrl = window.URL.createObjectURL(blob);
+    const a = document.createElement("a");
+    const filename = "downloaded_file.PDF";
+
+    a.href = blobUrl;
+    a.download = filename;
+    a.click();
+    window.URL.revokeObjectURL(blobUrl);
+
+    return null; // 다운로드이므로 반환값 없음
+  }else{
+    throw Error('오류 발생')
+  } 
+};
+
 export const postFetch = async (url: string, params: RequestParams) => {
  const baseUrl = servers[fetchType.WR];
  const response = await fetch(baseUrl + url, {
--- a/Show More
+++ b/Show More