From 49c8dd8a95c84e3eb68a71518d0e8d14a0c587d7 Mon Sep 17 00:00:00 2001
From: Gaeon Kim <rkdjs1104@ajou.ac.kr>
Date: Sat, 25 Nov 2023 16:16:26 +0900
Subject: [PATCH] =?UTF-8?q?feat:=20create=20=EC=9D=BC=EC=A0=95=EC=B6=94?=
=?UTF-8?q?=EA=B0=80=EB=AA=A8=EB=8B=AC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/pages/addModal.js | 100 ++++++++++++++++++++++++++++++++++++++++++
1 file changed, 100 insertions(+)
create mode 100644 src/pages/addModal.js
diff --git a/src/pages/addModal.js b/src/pages/addModal.js
new file mode 100644
index 0000000..16ddc44
--- /dev/null
+++ b/src/pages/addModal.js
@@ -0,0 +1,100 @@
+// ScheduleModal.js
+import React, { useState } from 'react';
+import schedule_add from './addModal.module.css';
+const ScheduleAddModal = ({ isOpen, onClose, onSave }) => {
+ const [formData, setFormData] = useState({
+ startDate: '',
+ endDate: '',
+ startTime: '',
+ endTime: '',
+ repeatPeriod: 7,
+ title: '',
+ color: '#FFFFFF', // 기본 값 설정 (흰색)
+ });
+
+ const handleInputChange = (e) => {
+ const { name, value } = e.target;
+ setFormData((prevData) => ({
+ ...prevData,
+ [name]: value,
+ }));
+ };
+
+ const handleColorChange = (color) => {
+ setFormData((prevData) => ({
+ ...prevData,
+ color,
+ }));
+ };
+
+ const handleSave = () => {
+ onSave(formData);
+ onClose();
+ };
+
+ return (
+
+ <div className={`${schedule_add.modal} ${isOpen ? schedule_add.open : ''}`}>
+ <div className={schedule_add.modal_content}>
+ <label>시작 날짜:</label>
+ <input
+ type="date"
+ name="startDate"
+ value={formData.startDate}
+ onChange={handleInputChange}
+ />
+
+ <label>종료 날짜:</label>
+ <input
+ type="date"
+ name="endDate"
+ value={formData.endDate}
+ onChange={handleInputChange}
+ />
+ <label>시작 시간:</label>
+ <input
+ type="time"
+ name="startTime"
+ value={formData.startTime}
+ onChange={handleInputChange}
+ />
+ <label>종료 시간:</label>
+ <input
+ type="time"
+ name="endTime"
+ value={formData.endTime}
+ onChange={handleInputChange}
+ />
+ <label>반복 주기 (일):</label>
+ <input
+ type="number"
+ name="repeatPeriod"
+ value={formData.repeatPeriod}
+ onChange={handleInputChange}
+ />
+ <label>일정 제목:</label>
+ <input
+ type="text"
+ name="title"
+ value={formData.title}
+ onChange={handleInputChange}
+ />
+ <label>색상 선택:</label>
+ <input
+ type="color"
+ name="color"
+ value={formData.color}
+ onChange={(e) => handleColorChange(e.target.value)}
+ />
+
+ <button className={schedule_add.save} onClick={handleSave}>저장</button>
+ <button className={schedule_add.cancel} onClick={onClose}>취소</button>
+ </div>
+ </div>
+ );
+};
+
+
+
+
+export default ScheduleAddModal;
--
GitLab