Co-authored-by: truthplumage <truthplumage@users.noreply.github.com>

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

@@ -17,10 +17,10 @@ export const pubFacHeadListExport: TableUpperProps[] = [
 ];
 
 export const pbnstMngUpHeadListExport: TableUpperProps[] = [
-  { id: "operMthd", title: "운영방식" },
-  { id: "rprtvBzenty", title: "대행업체" },
-  { id: "bgngDt", title: "시작일", upName: "upChangeRe", upSequnce: 1 },
-  { id: "endDt", title: "종료일", upName: "upChangeRe", upSequnce: 2 },
+  { id: "operMthd", title: "운영방식", edit: true},
+  { id: "rprtvBzenty", title: "대행업체", edit: true},
+  { id: "bgngDt", title: "시작일", upName: "upChangeRe", upSequnce: 1, type: "date"},
+  { id: "endDt", title: "종료일", upName: "upChangeRe", upSequnce: 2, type: "date"},
 ];   
 
 

apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx

@@ -36,7 +36,7 @@ const formSchema = z.object({
 });
 
 export function PbnstMngForm({ data }: { data: customPbnst }) {
-  const { pbnst, pbnstUpdate } = useWrStore((state) => state);
+  const { pbnst ,pbnstUpdate} = useWrStore((state) => state);
   const { pbnstMngUpHeadList} = pbnst;
   const [ruseOperData, setRuseOperData] = useState<operType[]>();
   const [planFiles, setPlanFiles] = useState<File[] | null>(null);

apps/wr/components/ui/table/pbnstReg/ruseMngTable/ruseMngTable.tsx

@@ -1,7 +1,7 @@
 import { headMakeprfmnc } from "@/app/ruseFcltMng/prfmncReg/chkgdnReg/TableHead";
 import type { chHeadType } from "@/app/store/prfmncReg/chkgdnReg/rainChkgdn/headList";
 import { selectClass, type TableUpperProps } from "@/app/store/ruseFcltMng/fcltReg/rainReg";
-import { SelectBox, type SelectDataType } from "@common/business_components/ui";
+import { DatePicker, SelectBox, type SelectDataType } from "@common/business_components/ui";
 import {
   Input,
   Table,
@@ -11,6 +11,8 @@ import {
   TableHeader,
   TableRow,
 } from "@common/components/ui";
+import moment from "moment";
+import { useState } from "react";
 
 export default function RuseMngTable({
   tableData,
@@ -23,8 +25,7 @@ export default function RuseMngTable({
   upHeadList?: chHeadType[];
   code?:{name:string, val:SelectDataType[] }[]
 }) {
-
-
+const [tableState, setTableState] = useState([...tableData]);
 
   return (
     <>
@@ -44,11 +45,11 @@ export default function RuseMngTable({
         </TableHeader>
 
         <TableBody>
-          {tableData.map((item, index) => (
-            <TableRow key={index}>
-              {headList.map((head, index) => (
+          {tableState.map((item, i) => (
+            <TableRow key={i}>
+              {headList.map((head, j) => (
                 <TableCell
-                  key={`${head.id}-${index}`}
+                  key={`${head.id}-${j}`}
                   className="text-center whitespace-nowrap"
                   onClick={() => {}}
                 >
@@ -64,16 +65,32 @@ export default function RuseMngTable({
                     label=""
                     selectArray={code.find(item => item.name === head.selectData)?.val ?? []}
                     value={
-                      tableData[index][item[head.id]]
+                      item[head.id]
                     }
                     className={""}
                     selectClass={selectClass}
                     onSelectValue={(val) => {
-                      tableData[index][head.id] = val;
+                      setTableState((prev)=>{
+                        prev[i][head.id] = val
+                        return [...prev]
+                      })
                     }}
                   ></SelectBox>
-                  )
-                  : (
+                  ) : head.type === "date" ? (
+                    <DatePicker
+                      mode="single"
+                      field={{
+                        value:
+                          item.value && !isNaN(new Date(item.value).getTime())
+                            ? new Date(item.value)
+                            : new Date(), // Provide a default Date value
+                        onChange: (date) => {
+                          item[head.id] = moment(date).format('yyyyMMdd');
+                        }
+                      }}
+                      selectClass={"w-full"}
+                    />
+                  ) : (
                     `${item[head.id] || ""}`
                   )}
                 </TableCell>

apps/wr/package.json

@@ -17,6 +17,7 @@
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
     "lucide-react": "^0.474.0",
+    "moment": "^2.30.1",
     "next": "15.1.7",
     "react-hook-form": "^7.54.2",
     "react-hot-toast": "^2.5.2",