From c88eb1fb60f77deae4fd73f59b370ef6b8e13e3c Mon Sep 17 00:00:00 2001
From: caadiq <caadiq@gmail.com>
Date: Sat, 4 Apr 2026 18:45:28 +0900
Subject: [PATCH] =?UTF-8?q?fix(variety):=20=EB=82=A0=EC=A7=9C/=EC=8B=9C?=
 =?UTF-8?q?=EA=B0=84=20=EC=9E=85=EB=A0=A5=EC=9D=84=20=EC=BB=A4=EC=8A=A4?=
 =?UTF-8?q?=ED=85=80=20DatePicker/TimePicker=EB=A1=9C=20=EB=B3=80=EA=B2=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 .../admin/schedules/edit/VarietyEditForm.jsx  | 12 ++++----
 .../pc/admin/schedules/form/VarietyForm.jsx   | 28 +++++--------------
 2 files changed, 14 insertions(+), 26 deletions(-)

diff --git a/frontend/src/pages/pc/admin/schedules/edit/VarietyEditForm.jsx b/frontend/src/pages/pc/admin/schedules/edit/VarietyEditForm.jsx
index fd26390..ddf0d31 100644
--- a/frontend/src/pages/pc/admin/schedules/edit/VarietyEditForm.jsx
+++ b/frontend/src/pages/pc/admin/schedules/edit/VarietyEditForm.jsx
@@ -2,7 +2,9 @@ import { useState, useEffect } from "react";
 import { useNavigate, useParams } from "react-router-dom";
 import { useQuery } from "@tanstack/react-query";
 import { motion } from "framer-motion";
-import { Save, Loader2, Tv, Link2, Image, Calendar, Clock, Users } from "lucide-react";
+import { Save, Loader2, Tv, Link2, Image, Users } from "lucide-react";
+import DatePicker from "@/components/pc/admin/common/DatePicker";
+import TimePicker from "@/components/pc/admin/common/TimePicker";
 
 import AdminLayout from "@/components/pc/admin/layout/Layout";
 import Toast from "@/components/common/Toast";
@@ -140,12 +142,12 @@ function VarietyEditForm() {
             </div>
             <div className="grid grid-cols-2 gap-4">
               <div>
-                <label className="flex items-center gap-2 text-sm font-medium text-gray-700 mb-1.5"><Calendar size={14} />날짜 *</label>
-                <input type="date" value={date} onChange={(e) => setDate(e.target.value)} className="w-full px-3 py-2.5 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent" />
+                <label className="text-sm font-medium text-gray-700 mb-1.5 block">날짜 *</label>
+                <DatePicker value={date} onChange={setDate} />
               </div>
               <div>
-                <label className="flex items-center gap-2 text-sm font-medium text-gray-700 mb-1.5"><Clock size={14} />시간 (선택)</label>
-                <input type="time" value={time} onChange={(e) => setTime(e.target.value)} className="w-full px-3 py-2.5 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent" />
+                <label className="text-sm font-medium text-gray-700 mb-1.5 block">시간 (선택)</label>
+                <TimePicker value={time} onChange={setTime} />
               </div>
             </div>
           </div>
diff --git a/frontend/src/pages/pc/admin/schedules/form/VarietyForm.jsx b/frontend/src/pages/pc/admin/schedules/form/VarietyForm.jsx
index 01a5c7e..aabfcce 100644
--- a/frontend/src/pages/pc/admin/schedules/form/VarietyForm.jsx
+++ b/frontend/src/pages/pc/admin/schedules/form/VarietyForm.jsx
@@ -2,9 +2,11 @@ import { useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { useQuery } from "@tanstack/react-query";
 import { motion } from "framer-motion";
-import { Save, Tv, Link2, Image, Calendar, Clock, Users } from "lucide-react";
+import { Save, Tv, Link2, Image, Users } from "lucide-react";
 
 import Toast from "@/components/common/Toast";
+import DatePicker from "@/components/pc/admin/common/DatePicker";
+import TimePicker from "@/components/pc/admin/common/TimePicker";
 import { useToast } from "@/hooks/common";
 import { useAdminAuth } from "@/hooks/pc/admin";
 import { getMembers } from "@/api/public/members";
@@ -167,28 +169,12 @@ function VarietyForm() {
             {/* 날짜/시간 */}
             <div className="grid grid-cols-2 gap-4">
               <div>
-                <label className="flex items-center gap-2 text-sm font-medium text-gray-700 mb-1.5">
-                  <Calendar size={14} />
-                  날짜 *
-                </label>
-                <input
-                  type="date"
-                  value={date}
-                  onChange={(e) => setDate(e.target.value)}
-                  className="w-full px-3 py-2.5 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"
-                />
+                <label className="text-sm font-medium text-gray-700 mb-1.5 block">날짜 *</label>
+                <DatePicker value={date} onChange={setDate} />
               </div>
               <div>
-                <label className="flex items-center gap-2 text-sm font-medium text-gray-700 mb-1.5">
-                  <Clock size={14} />
-                  시간 (선택)
-                </label>
-                <input
-                  type="time"
-                  value={time}
-                  onChange={(e) => setTime(e.target.value)}
-                  className="w-full px-3 py-2.5 border border-gray-200 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary focus:border-transparent"
-                />
+                <label className="text-sm font-medium text-gray-700 mb-1.5 block">시간 (선택)</label>
+                <TimePicker value={time} onChange={setTime} />
               </div>
             </div>
           </div>