대민 데이트 피커를 input date로 변경(향후 날짜로 인해)

2025-08-27 13:45:13 +09:00
parent ff6634b250
commit 2611f304d9
2 changed files with 61 additions and 15 deletions
@@ -15,4 +15,40 @@ export const sanitizeInput = (val: string, allowDecimal = false) => {

  // 정수만 허용
  return val.replace(/[^0-9]/g, "");
-};
+};
+
+
+
+// utils: format Date <-> "YYYY-MM-DD" without moment
+export const  formatDateToYMD=(value: Date): string => {
+  if (!value) return "";
+  // value can be Date | string ("YYYY-MM-DD")
+  if (typeof value === "string") {
+    // assume already in yyyy-mm-dd
+    if (/^\d{4}-\d{2}-\d{2}$/.test(value)) return value;
+    const d = new Date(value);
+    if (isNaN(d.getTime())) return "";
+    return toYMD(d);
+  }
+  if (value instanceof Date) {
+    if (isNaN(value.getTime())) return "";
+    return toYMD(value);
+  }
+  return "";
+}
+
+const  toYMD=(date: Date): string => {
+  // avoid timezone shift by normalizing to local date parts
+  const y = date.getFullYear();
+  const m = String(date.getMonth() + 1).padStart(2, "0");
+  const day = String(date.getDate()).padStart(2, "0");
+  return `${y}-${m}-${day}`;
+}
+
+// const  parseYMDToDate=(ymd: string): Date | null => {
+//   if (!/^\d{4}-\d{2}-\d{2}$/.test(ymd)) return null;
+//   const [y, m, d] = ymd.split("-").map(Number);
+//   const date = new Date(y, (m - 1), d);
+//   // validate round-trip
+//   return (date.getFullYear() === y && date.getMonth() === m - 1 && date.getDate() === d) ? date : null;
+// }
@@ -2,7 +2,7 @@ import ModalSimilarPage from "@/app/(base-layout)/pages/sdmMng/sdmInfoInsert/mod
 import { useDmStore } from "@/app/store";
 import {
  CANDIDATE,
-  DatePicker,
+ // DatePicker,
  FormField,
  FormLabel,
  FormUi,
@@ -10,7 +10,7 @@ import {
  UiModal,
 } from "@common/business_components";
 import { Input } from "@common/components";
-import { Button,  Label } from "@common/components/ui";
+import { Button, Label } from "@common/components/ui";
 import { useSearchParams } from "next/navigation";
 import { useCallback, useEffect, useState } from "react";
 import { AccessibleFormField } from "./AccessibleFormField";
@@ -22,7 +22,7 @@ import {
 } from "react-hook-form";
 import SearchInputText from "../common/searhDemandInput/component";
 import React from "react";
-import { sanitizeInput } from "../common/utils/utils";
+import { formatDateToYMD, sanitizeInput } from "../common/utils/utils";
 import type { DemandCompType } from "@common/business_components/ui/sdmInsertForm/form";
 import type { SdmInfoFormData } from "@/app/store/sdmMng";

@@ -161,7 +161,9 @@ export function SdmInfoRegForm({

    if (defaults) {
      Object.entries(defaults).forEach(([field, value]) => {
-        form.setValue(field as keyof SdmInfoFormData, value, { shouldDirty: true });
+        form.setValue(field as keyof SdmInfoFormData, value, {
+          shouldDirty: true,
+        });
      });
    }
  }, [form.getValues("usePurpose")]);
@@ -208,8 +210,8 @@ export function SdmInfoRegForm({
      formIndex: 0,
      required: true,
      component: (field) => (
-        <div className="">
-          <DatePicker
+        <div className="relative w-64">
+          {/* <DatePicker
            mode="single"
            selected={field.value as Date}
            onSelect={(date) => {
@@ -224,8 +226,18 @@ export function SdmInfoRegForm({
              },
            }}
            showOutsideDays={true}
-           selectClass={undefined}
-          />
+            selectClass={undefined}
+          /> */}
+            {/* 네이티브 input */}
+            <Input
+              className="w-full !text-xl text-right"
+              type="date"
+              onChange= {(e) => {
+                const selectedDate = e.target.value ? new Date(e.target.value) : null;
+                field.onChange(selectedDate);
+              }}
+              value={ formatDateToYMD(field.value as Date) }
+            />
        </div>
      ),
    },
@@ -363,13 +375,11 @@ export function SdmInfoRegForm({
            render={({ field }) =>
              name === "money" ? (
                <div>
-                  <Label className="text-black"  >
-                    희망단가(원)*
-                  </Label>
-                     { component(field)}
+                  <Label className="text-black">희망단가(원)*</Label>
+                  {component(field)}
                </div>
-                // <FormUi label={label + "*"}>{component(field)}</FormUi>
              ) : (
+                // <FormUi label={label + "*"}>{component(field)}</FormUi>
                <AccessibleFormField
                  field={field}
                  label={label}
@@ -773,7 +783,7 @@ export function SdmInfoRegForm({
                    onSelectValue={(val: string | number) => {
                      field.onChange(val.toString());
                    }}
-                    value={field.value }
+                    value={field.value}
                    readOnly={isDisabled}
                    onBlur={field.onBlur}
                    ref={field.ref}