wr: 재이용시설등록 10건 , Uitable 수정

apps/dm/app/(with-layout)/intro/_components/LawIntroSection copy.tsx

@@ -0,0 +1,123 @@
+"use client";
+
+import React from "react";
+import Image, { type StaticImageData } from "next/image";
+
+import lawPlan from "@/public/images/landing/intro/law_timeline.png";
+import planPerformance from "@/public/images/landing/intro/performance_left.png";
+import domesticChange from "@/public/images/landing/intro/domestic_textbox.png";
+import policyHistory from "@/public/images/landing/intro/policy_timeline.png";
+import lawRelation from "@/public/images/landing/intro/rel_note.png";
+import domesticLinkage from "@/public/images/landing/intro/linkage.png";
+
+function SectionTitle({ children }: { children: React.ReactNode }) {
+  return (
+    <div className="flex items-center gap-3">
+      <span className="h-5 w-[3px] bg-sky-500" />
+      <h3 className="text-[24px] font-bold text-neutral-900">{children}</h3>
+    </div>
+  );
+}
+
+function Hr({ className = "" }: { className?: string }) {
+  return <div className={`h-[2px] w-full bg-black/10 ${className}`} />;
+}
+
+function ImgCard({ src, alt }: { src: StaticImageData; alt: string }) {
+  return (
+    <div className="w-full overflow-x-auto">
+      <Image
+        src={src}
+        alt={alt}
+        className="mx-auto block max-w-none"
+        style={{ width: "auto", height: "auto" }}
+      />
+    </div>
+  );
+}
+
+function SectionShell({
+  id,
+  title,
+  children,
+  className = "",
+}: {
+  id: string;
+  title: string;
+  children: React.ReactNode;
+  className?: string;
+}) {
+  return (
+    <section id={id} className={`scroll-mt-[120px] ${className}`}>
+      <SectionTitle>{title}</SectionTitle>
+      <div className="mt-8">{children}</div>
+    </section>
+  );
+}
+
+export default function LawIntroSection() {
+  const title = "물재이용법";
+
+  return (
+    <div className="bg-white">
+      <div className="inline-block">
+        <h2 className="relative inline-block px-2 text-[28px] font-extrabold leading-none tracking-tight text-slate-900">
+          <span className="relative z-10">{title}</span>
+          <span className="absolute bottom-[-4px] left-0 z-0 h-3 w-full bg-gradient-to-r from-sky-300 to-green-300" />
+        </h2>
+      </div>
+
+      <div className="mt-10">
+        <SectionShell
+          id="law-plan"
+          title="법률 제·개정 및 기본계획 수립"
+          className="mt-10"
+        >
+          <ImgCard src={lawPlan} alt="법률 제·개정 및 기본계획 수립" />
+        </SectionShell>
+
+        <Hr className="my-11" />
+
+        <SectionShell
+          id="plan-performance"
+          title="제2차 계획 대비 실적 현황"
+        >
+          <ImgCard src={planPerformance} alt="제2차 계획 대비 실적 현황" />
+        </SectionShell>
+
+        <Hr className="my-11" />
+
+        <SectionShell id="domestic-change" title="우리나라의 수자원 현황 및 물이용 여건">
+          <ImgCard src={domesticChange} alt="우리나라의 수자원 현황 및 물이용 여건" />
+        </SectionShell>
+
+        <Hr className="my-11" />
+
+        <SectionShell
+          id="policy-history"
+          title="물 재이용 정책 변화 추이"
+        >
+          <ImgCard src={policyHistory} alt="물 재이용 정책 변화 추이" />
+        </SectionShell>
+
+        <Hr className="my-11" />
+
+        <SectionShell
+          id="law-relation"
+          title="타법령과의 관계 검토"
+        >
+          <ImgCard src={lawRelation} alt="타법령과의 관계 검토" />
+        </SectionShell>
+
+        <Hr className="my-11" />
+
+        <SectionShell
+          id="domestic-linkage"
+          title="주요 국가계획의 정책방향과 연계한 물 재이용 정책 필요"
+        >
+          <ImgCard src={domesticLinkage} alt="주요 국가계획의 정책방향과 연계한 물 재이용 정책 필요" />
+        </SectionShell>
+      </div>
+    </div>
+  );
+}

apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/htdflReg/page.tsx

@@ -6,6 +6,7 @@ import type { customHtdflBdst } from "@/app/store/ruseFcltMng/fcltReg/htdflReg";
 import { formatArchArea, tableData } from "@/components/lib/func/common";
 import HtdflRegForm from "@/components/ui/form/fcltReg/htdflReg/htdflRegForm";
 import { BdstReg } from "@/components/ui/modal/fcltReg/bdstRegModal/bdstRegModal";
+import { DEFAULT_LIST_SIZE } from "@/src/shared/config";
 import {
   ContentsDiv,
   ScrollArea,
@@ -141,7 +142,7 @@ export default function Home() {
               <UiTable
                 tableData={bdstTable || []}
                 headlist={htdfl.upHeadList}
-                pageSize={20}
+                pageSize={DEFAULT_LIST_SIZE}
                 total={htdflResCount}
                 headName={"시설물 목록"}
                 cellClick={(val) => {

apps/wr/app/(with-layout)/ruseFcltMng/fcltReg/pbnstReg/page.tsx

@@ -15,6 +15,7 @@
  *  */
 
 "use client";
+import { DEFAULT_LIST_SIZE } from "@/src/shared/config";
 import {
   ContentsDiv,
   ScrollArea,
@@ -353,7 +354,7 @@ export default function PublicReuseFaciltyInsert() {
               <UiTable
                 tableData={bdstTable || []}
                 headlist={pubFacHeadList}
-                pageSize={10}
+                pageSize={DEFAULT_LIST_SIZE}
                 total={pbnstHasuResCount || 20}
                 headName={"공공 하수처리시설 목록"}
                 cellClick={cellClick}

apps/wr/app/store/ruseFcltMng/fcltReg/htdflReg/index.tsx

@@ -1,5 +1,6 @@
 import { getFetchWithCount, postFectch, putFectch, deleteFectch } from "@/components/lib/api";
 
+import { DEFAULT_LIST_SIZE } from "@/src/shared/config";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
@@ -121,7 +122,7 @@ export const htdflFacStateExport: htdflFacState = {
 
 const initFetch = async (code: string) => {
 
-  let url = `/drain/facilityList/1/11` 
+    let url = `/drain/facilityList/1/${DEFAULT_LIST_SIZE}`
     
     url+=`/${code}`
 
@@ -137,7 +138,7 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
       try {
         const htdflRes = await getFetchWithCount(
           "wr",
-          `/drain/facilityList/${pageNation}/11/${code}`
+          `/drain/facilityList/${pageNation}/${DEFAULT_LIST_SIZE}/${code}`
         );
         return set((state: htdflFacState) => ({
           ...state,
@@ -181,7 +182,7 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
         }
         const htdflRes = await getFetchWithCount(
           "wr",
-          `/drain/facilityList/1/11/${code}`
+          `/drain/facilityList/1/${DEFAULT_LIST_SIZE}/${code}`
         );
         set((state: htdflFacState) => ({
           ...state,
@@ -251,7 +252,7 @@ export const htdflFacActionsExport: (set: any) => htdflFacSActions = (
     },
     htdflNmSearch :async(code:string | number, fcltNm:string) =>{
       try {
-        const htdflRes = await getFetchWithCount("wr", `/drain/facilityList/1/11/${code}/${fcltNm}`);
+        const htdflRes = await getFetchWithCount("wr", `/drain/facilityList/1/${DEFAULT_LIST_SIZE}/${code}/${fcltNm}`);
         set((state: htdflFacState) => {
           return {
             ...state,

apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx

@@ -6,7 +6,7 @@ import {
   postFectch,
   putFectch,
 } from "@/components/lib/api";
-import { SITE_ID } from "@/src/shared/config";
+import { DEFAULT_LIST_SIZE, SITE_ID } from "@/src/shared/config";
 import type { chHeadType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList";
 import {
   type customPbnst,
@@ -113,7 +113,7 @@ const hasuListFetch = async (
 ) => {
   const checkWrRegListRes = await checkWrRegList(); // 재사용시설에 대한 정보 조회
 
-  let url = `/prcsFclt/ruseInfo/${page ? page : 1}/11/A/${sggOrCity ? sggOrCity : "11"}/0/1/SW`;
+  let url = `/prcsFclt/ruseInfo/${page ? page : 1}/${DEFAULT_LIST_SIZE}/A/${sggOrCity ? sggOrCity : "11"}/0/1/SW`;
 
   const data = checkWrRegListRes.filter((item: string) => item !== "");
   if (searchTxt) {

apps/wr/app/store/ruseFcltMng/fcltReg/rainReg/index.tsx

@@ -6,6 +6,7 @@ import {
   postFectch,
   putFectch,
 } from "@/components/lib/api";
+import { DEFAULT_LIST_SIZE } from "@/src/shared/config";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
 import {
@@ -14,7 +15,7 @@ import {
   validationMessages,
 } from "./type";
 export const TEST_UUID = "2d4b151d-1828-41e0-91d9-4cd28ea1cc7e";
-export const rainRegSize = 15;
+export const rainRegSize = DEFAULT_LIST_SIZE;
 
 /**
  *   밧물이용시설 등록 (스토어)

apps/wr/app/store/ruseFcltMng/fcltReg/rswtReg/index.tsx

@@ -1,6 +1,7 @@
 import { deleteFectch, getFetchWithCount, postFectch, putFectch } from "@/components/lib/api";
 import { upHeadList, type chgBuilding } from "../rainReg";
 
+import { DEFAULT_LIST_SIZE } from "@/src/shared/config";
 import type { TableUpperProps } from "@/app/store/common/type/header";
 import { z } from "zod";
 import { makeMdfr, makeRstr } from "../bdstReg";
@@ -14,7 +15,7 @@ import { baseReuseBuildingSchema, chgBuildingSchema, validationMessages } from "
  * 재이용시설 등록 - 중수도시설 등록
  *  중수도시설에서 사용하는 api 및 타입 등을 관리한다.
  *  */
-export const rswtRegSize =15;
+export const rswtRegSize = DEFAULT_LIST_SIZE;
 const rswtrObjSchema = z.object({
   bdstRuseFcltSn: z.number().nullish(),
   orgwtKndCd: z.string({ required_error: validationMessages.requiredSelect("원수 종류") }).min(1, { message: validationMessages.requiredSelect("원수 종류") }),

apps/wr/src/shared/config/index.ts

@@ -1,2 +1,4 @@
 export * from "./api";
 export * from "./env";
+
+export const DEFAULT_LIST_SIZE = 10;

packages/common/business_components/src/ui/table/index.tsx

@@ -152,7 +152,7 @@ export function UiTable<T extends object = Record<string, unknown>>({
         <></>
       )}
       <div className={`card !p-0r !m-[1.2rem] ${className}`}>
-        <Table variant="secondary" className={widthFixed ? "table-fixed" : "w-max min-w-max"}>
+        <Table variant="secondary" className={widthFixed ? "table-fixed" : ""}>
           {widthFixed ?
             <colgroup>
               {leafCols.map(col => (