From cbee407911123e616dc229e23e2117ac68521b78 Mon Sep 17 00:00:00 2001
From: ljpark <mind-one005@mind-one.co.kr>
Date: Fri, 27 Mar 2026 18:15:26 +0900
Subject: [PATCH] =?UTF-8?q?wr:=20=EC=88=98=EC=9A=94=EC=B2=98=20=EB=A7=A4?=
 =?UTF-8?q?=EC=B9=AD=20=EA=B2=80=ED=86=A0=20readOnly=20=EC=B2=98=EB=A6=AC?=
 =?UTF-8?q?=20=EC=99=B8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../matMng/coMat/coMatRvw/page.tsx            | 39 ++++++++++++-------
 apps/wr/app/store/matDmd/coSttn/excel.tsx     |  2 +-
 .../lib/func/{noUtil.ts => formatUtils.ts}    |  0
 .../ui/form/coMat/conCostForm/conCostForm.tsx | 39 +++++++++++--------
 .../ui/modal/coMat/constCostFeeTable.tsx      |  3 +-
 .../ui/modal/coMat/rateFeeModal.tsx           |  3 +-
 .../src/ui/table/index.tsx                    | 14 +++++--
 7 files changed, 64 insertions(+), 36 deletions(-)
 rename apps/wr/components/lib/func/{noUtil.ts => formatUtils.ts} (100%)

diff --git a/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx b/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
index 0840bba76..ae1e24175 100644
--- a/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
+++ b/apps/wr/app/(with-layout)/matMng/coMat/coMatRvw/page.tsx
@@ -49,6 +49,7 @@ import { z } from "zod";
 
 
 export default function CoMatRvw() {
+  const readOnlyInputClass = "bg-slate-50 text-gray-700";
   const { auth, code, coRvw, coMatRvwInit, coMatRvwSearch, coMatRvwInqua } =
     useWrStore((state) => state);
   const { coMatRvwRes, coMatRvwCount } = coRvw;
@@ -126,6 +127,9 @@ export default function CoMatRvw() {
     }
   };
   const useUsgCdWatch = useWatch({ control: form.control, name: "useUsgCd" });
+  const useUsgCdText =
+    code.sewageOutFclttUse?.find((item) => item.val === useUsgCdWatch)?.text ??
+    String(useUsgCdWatch ?? "");
   useEffect(() => {
     if (useUsgCdWatch) {
       console.log("useUsgCdWatch:" , useUsgCdWatch);
@@ -343,6 +347,7 @@ export default function CoMatRvw() {
                               moment(field.value).format("YYYY-MM-DD") ?? ""
                             }
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -363,6 +368,7 @@ export default function CoMatRvw() {
                             }}
                             value={field.value ?? 0}
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -381,8 +387,9 @@ export default function CoMatRvw() {
                             onChange={(e) => {
                               field.onChange(e.target.value);
                             }}
-                            value={field.value ?? ""}
+                            value={useUsgCdText}
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -403,6 +410,7 @@ export default function CoMatRvw() {
                             }}
                             value={field.value ?? 0}
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -421,7 +429,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 type="text"
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 placeholder=""
                                 value={
                                   field.value != -1 ||field.value != undefined
@@ -454,7 +462,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 type="text"
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 placeholder=""
                                 value={field.value ?? ""}
                                 readOnly
@@ -478,7 +486,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 value={field.value ?? 0}
                                 readOnly
@@ -503,7 +511,7 @@ export default function CoMatRvw() {
                               <Input
                                 placeholder=""
                                 type="text"
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 step="0.1"
                                 onChange={(e) => {
                                   field.onChange(Number(e.target.value));
@@ -531,6 +539,7 @@ export default function CoMatRvw() {
                             type="text"
                             value={field.value ?? ""}
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -546,7 +555,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 step="0.1"
                                 value={field.value ?? ""}
@@ -571,7 +580,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 onChange={(e) => {
                                   field.onChange(Number(e.target.value));
@@ -598,7 +607,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 onChange={(e) => {
                                   field.onChange(Number(e.target.value));
@@ -625,7 +634,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 onChange={(e) => {
                                   field.onChange(Number(e.target.value));
@@ -649,7 +658,7 @@ export default function CoMatRvw() {
                             <div className="relative flex-1 min-w-0">
                               <Input
                                 placeholder=""
-                                className="w-full pr-16 border py-2 text-right rounded-md"
+                                className={`w-full pr-16 border py-2 text-right rounded-md ${readOnlyInputClass}`}
                                 type="text"
                                 onChange={(e) => {
                                   field.onChange(Number(e.target.value));
@@ -707,6 +716,7 @@ export default function CoMatRvw() {
                             }}
                             value={field.value ?? ""}
                             readOnly
+                            className={readOnlyInputClass}
                           />
                         </FormUi>
                       )}
@@ -731,10 +741,11 @@ export default function CoMatRvw() {
                                   ruseUtztnFcltNm: e.target.value,
                                 };
                                 field.onChange(newValue);
-                              }}
-                              value={field.value?.ruseUtztnFcltNm ?? ""}
-                              readOnly
-                            />
+                            }}
+                            value={field.value?.ruseUtztnFcltNm ?? ""}
+                            readOnly
+                            className={readOnlyInputClass}
+                          />
                           </FormUi>
                         )}
                       />
diff --git a/apps/wr/app/store/matDmd/coSttn/excel.tsx b/apps/wr/app/store/matDmd/coSttn/excel.tsx
index 0bdf7ef6e..38becb2d6 100644
--- a/apps/wr/app/store/matDmd/coSttn/excel.tsx
+++ b/apps/wr/app/store/matDmd/coSttn/excel.tsx
@@ -3,7 +3,7 @@ import moment from "moment";
 import {
   formatKoreanPhoneNumber,
   formatValueByPattern,
-} from "@/components/lib/func/noUtil";
+} from "@/components/lib/func/formatUtils";
 
 export const excelCoSttnParsing = (data: any[],sidoCode:SelectDataType[] , sggCode:SelectDataType[]): string[][] => {
     const excelExportData: string[][] = [];
diff --git a/apps/wr/components/lib/func/noUtil.ts b/apps/wr/components/lib/func/formatUtils.ts
similarity index 100%
rename from apps/wr/components/lib/func/noUtil.ts
rename to apps/wr/components/lib/func/formatUtils.ts
diff --git a/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx b/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
index ca75016cf..38f3ecd8c 100644
--- a/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
+++ b/apps/wr/components/ui/form/coMat/conCostForm/conCostForm.tsx
@@ -20,7 +20,6 @@ import {
   Form,
   FormField,
   FormUi,
-  SelectBox,
   UiTable,
 } from "@common/business_components/ui";
 import PopoverUi from "@common/business_components/ui/popover_ui";
@@ -47,6 +46,7 @@ export default function ConCostForm({
   selectionVersion: number;
   readonly: boolean;
 }) {
+  const readOnlyInputClass = "bg-slate-50 text-gray-700";
   const {
     constCostRes, // 표준사업비
     rateFeeRes,   // 부대경비요율
@@ -109,6 +109,10 @@ export default function ConCostForm({
   const totalConstCost = form.watch("totalConstCost");
   const cstrnCst = form.watch("demandCst.cstrnCst");
   const splyList = form.watch("splyCndtList");
+  const useUsgCdWatch = form.watch("useUsgCd");
+  const useUsgCdLabel =
+    code.sewageOutFclttUse?.find((item) => item.val === useUsgCdWatch)?.text ??
+    String(useUsgCdWatch ?? "");
 
   /**
    * 표준공산비 산정 : "계산"버튼 click시
@@ -396,17 +400,13 @@ export default function ConCostForm({
               name="useUsgCd"
               render={({ field }) => (
                 <FormUi label="용도">
-                  <SelectBox
-                    className="w-full"
-                    label=""
-                    selectClass={""}
-                    selectArray={code.sewageOutFclttUse || []}
-                    onSelectValue={(val: string | number) => {
-                      if (readonly) return;
-                      field.onChange(String(val));
-                    }}
-                    value={field.value ?? ""}
-                    readOnly={readonly}
+                  <Input
+                    placeholder=""
+                    type="text"
+                    onChange={field.onChange}
+                    value={useUsgCdLabel}
+                    readOnly
+                    className={readOnlyInputClass}
                   />
                 </FormUi>
               )}
@@ -427,6 +427,7 @@ export default function ConCostForm({
                     }}
                     value={field.value ?? 0}
                     readOnly={true}
+                    className={readOnlyInputClass}
                   />
                 </FormUi>
               )}
@@ -454,12 +455,13 @@ export default function ConCostForm({
                     ]}
                     pageSize={0}
                     total={0}
+                    isHideCount={true}
                     cellClick={undefined}
                     onPageChange={() => {}}
                   />
                 </>
               }
-              bodyClassName={"w-[25vw] max-w-none h-[54vh]"}
+              bodyClassName={"w-[25vw] max-w-none"}
             ></PopoverUi>
             <FormField
               control={form.control}
@@ -471,7 +473,7 @@ export default function ConCostForm({
                     type="text"
                     onChange={field.onChange}
                     value={field.value ?? ""}
-                    className="mt-2"
+                    className={`mt-2 ${readOnlyInputClass}`}
                     readOnly={true}
                   />
                 </FormUi>
@@ -495,6 +497,7 @@ export default function ConCostForm({
                     // value={Number(field.value) * 365 || 0}
                     value={Number(field.value) || 0}
                     readOnly
+                    className={readOnlyInputClass}
                   />
                 </FormUi>
               )}
@@ -520,7 +523,7 @@ export default function ConCostForm({
                     <ConstCostFeeTable />
                   </>
                 }
-                bodyClassName={"w-[40vw] h-full"}
+                bodyClassName={"w-[400px] max-w-[400px] h-full"}
               ></PopoverUi>
             </div>
             <FormField
@@ -537,6 +540,7 @@ export default function ConCostForm({
                     }}
                     value={field.value ?? 0}
                     readOnly
+                    className={readOnlyInputClass}
                   />
                 </FormUi>
               )}
@@ -574,6 +578,7 @@ export default function ConCostForm({
                     }}
                     value={field.value ?? 0}
                     readOnly
+                    className={readOnlyInputClass}
                   />
                 </FormUi>
               )}
@@ -611,7 +616,7 @@ export default function ConCostForm({
                 <FormUi label="">
                   <Input
                     placeholder=""
-                    className="mt-2"
+                    className={`mt-2 ${readOnlyInputClass}`}
                     type="number"
                     step="0.01"
                     onChange={(e) => {
@@ -646,6 +651,7 @@ export default function ConCostForm({
                 type="text"
                 value={lastSub?.ruseUtztnFcltNm || ""}
                 readOnly
+                className={readOnlyInputClass}
               />
             </FormUi>
           </div>
@@ -680,6 +686,7 @@ export default function ConCostForm({
               step="0.001"
               readOnly={true}
               value={(totalConstCost ?? 0) + (cstrnCst ?? 0)}
+              className={readOnlyInputClass}
             />
           </div>
         </div>
diff --git a/apps/wr/components/ui/modal/coMat/constCostFeeTable.tsx b/apps/wr/components/ui/modal/coMat/constCostFeeTable.tsx
index 94f088d0e..6be066931 100644
--- a/apps/wr/components/ui/modal/coMat/constCostFeeTable.tsx
+++ b/apps/wr/components/ui/modal/coMat/constCostFeeTable.tsx
@@ -13,6 +13,7 @@ export function ConstCostFeeTable() {
   const { coRvw, constCostRes } = useWrStore((state) => state);
 
   const [constCostData, setConstCostData] = useState<ContCostMap[]>([]);
+  const 기준년도 = constCostRes?.[0]?.yr ?? "";
 
 
   const getFctDescription = (fctCd: string) => {
@@ -71,7 +72,7 @@ export function ConstCostFeeTable() {
         <hr />
         <div className="col-span-5 flex items-center">
           <Label className="ml-2 mr-1 text-xl text-gray-600">기준년도</Label>
-          <span>{new Date().getFullYear() || ""}</span>
+          <span>{기준년도}</span>
         </div>
         <UiTable
           headName={""}
diff --git a/apps/wr/components/ui/modal/coMat/rateFeeModal.tsx b/apps/wr/components/ui/modal/coMat/rateFeeModal.tsx
index f67a70b1a..9118f8127 100644
--- a/apps/wr/components/ui/modal/coMat/rateFeeModal.tsx
+++ b/apps/wr/components/ui/modal/coMat/rateFeeModal.tsx
@@ -10,6 +10,7 @@ import { useEffect, useState } from "react";
 export function RateFeeTableModal() {
   const { coRvw, rateFeeRes } = useWrStore((state) => state);
   const [reateFeeTable, setRateFeeTable] = useState<rateFeeType[]>([]);
+  const 기준년도 = rateFeeRes?.[0]?.yr ?? "";
 
   const gubunLabelMap: Record<number, string> = {
     50: "5천만원까지",
@@ -81,7 +82,7 @@ export function RateFeeTableModal() {
 
           <div className="col-span-5 flex items-center">
             <Label className="mr-1 text-xl text-gray-600">기준년도</Label>
-            <span>{new Date().getFullYear() || ""}</span>
+            <span>{기준년도}</span>
           </div>
           <div className="col-span-6 pr-6">
             <UiTable
diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx
index e5fc933ae..ed05a7f19 100644
--- a/packages/common/business_components/src/ui/table/index.tsx
+++ b/packages/common/business_components/src/ui/table/index.tsx
@@ -36,6 +36,7 @@ type UiTableProps<T extends object> = {
   curPage?: number;
   headButton?: React.ReactNode | undefined;
   widthFixed?: boolean;
+  isHideCount?: boolean; // 총 건수 default false
 };
 
 type UiHeadProps = {
@@ -67,7 +68,8 @@ export function UiTable<T extends object = Record<string, unknown>>({
   index = -1,
   curPage = 1,
   headButton = undefined,
-  widthFixed = false
+  widthFixed = false,
+  isHideCount = false, // 총 건수
 }: UiTableProps<T>) {
   const [cur, setCur] = useState<number>(curPage);
   const [idx, setIdx] = useState<number>(index);
@@ -132,12 +134,18 @@ export function UiTable<T extends object = Record<string, unknown>>({
       {headName ? (
         headButton ? (
           <div className="card-header flex items-center justify-between">
-            <h3 className="text-2xl font-medium text-label">{headName}  총 {totalLabel}건</h3>
+            <h3 className="text-2xl font-medium text-label">
+              {headName}
+              {isHideCount ? "" : `  총 ${totalLabel}건`}
+            </h3>
             <>{headButton}</>
           </div>
         ) : (
           <div className="card-header">
-            <h3 className="text-2xl font-medium text-label">{headName}  총 {totalLabel}건</h3>
+            <h3 className="text-2xl font-medium text-label">
+              {headName}
+              {isHideCount ? "" : `  총 ${totalLabel}건`}
+            </h3>
           </div>
         )
       ) : (