From 939919be8ad3b74a4e19b7c7aac2c3059c81acff Mon Sep 17 00:00:00 2001
From: mindongmindong <dcmin123@ajou.ac.kr>
Date: Mon, 13 Nov 2023 00:34:26 +0900
Subject: [PATCH] make MeetingInfo page
---
react-whenMeet/package-lock.json | 219 ++++++++++++++++++++++
react-whenMeet/package.json | 2 +
react-whenMeet/src/components/Calendar.js | 16 ++
react-whenMeet/src/routes/MeetingInfo.js | 69 ++++++-
react-whenMeet/src/styles/HomeMake.css | 2 +-
5 files changed, 304 insertions(+), 4 deletions(-)
create mode 100644 react-whenMeet/src/components/Calendar.js
diff --git a/react-whenMeet/package-lock.json b/react-whenMeet/package-lock.json
index aae9676..11a4fcd 100644
--- a/react-whenMeet/package-lock.json
+++ b/react-whenMeet/package-lock.json
@@ -11,8 +11,10 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
+ "gh-pages": "^6.0.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
+ "react-calendar": "^4.6.1",
"react-dom": "^18.2.0",
"react-router-dom": "^6.18.0",
"react-scripts": "^5.0.1",
@@ -4321,6 +4323,19 @@
"resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
"integrity": "sha512-dRLjCWHYg4oaA77cxO64oO+7JwCwnIzkZPdrrC71jQmQtlhM556pwKo5bUzqvZndkVbeFLIIi+9TC40JNF5hNQ=="
},
+ "node_modules/@types/lodash": {
+ "version": "4.14.201",
+ "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.201.tgz",
+ "integrity": "sha512-y9euML0cim1JrykNxADLfaG0FgD1g/yTHwUs/Jg9ZIU7WKj2/4IW9Lbb1WZbvck78W/lfGXFfe+u2EGfIJXdLQ=="
+ },
+ "node_modules/@types/lodash.memoize": {
+ "version": "4.1.9",
+ "resolved": "https://registry.npmjs.org/@types/lodash.memoize/-/lodash.memoize-4.1.9.tgz",
+ "integrity": "sha512-glY1nQuoqX4Ft8Uk+KfJudOD7DQbbEDF6k9XpGncaohW3RW4eSWBlx6AA0fZCrh40tZcQNH4jS/Oc59J6Eq+aw==",
+ "dependencies": {
+ "@types/lodash": "*"
+ }
+ },
"node_modules/@types/mime": {
"version": "1.3.5",
"resolved": "https://registry.npmjs.org/@types/mime/-/mime-1.3.5.tgz",
@@ -4841,6 +4856,14 @@
"@xtuc/long": "4.2.2"
}
},
+ "node_modules/@wojtekmaj/date-utils": {
+ "version": "1.5.1",
+ "resolved": "https://registry.npmjs.org/@wojtekmaj/date-utils/-/date-utils-1.5.1.tgz",
+ "integrity": "sha512-+i7+JmNiE/3c9FKxzWFi2IjRJ+KzZl1QPu6QNrsgaa2MuBgXvUy4gA1TVzf/JMdIIloB76xSKikTWuyYAIVLww==",
+ "funding": {
+ "url": "https://github.com/wojtekmaj/date-utils?sponsor=1"
+ }
+ },
"node_modules/@xtuc/ieee754": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/@xtuc/ieee754/-/ieee754-1.2.0.tgz",
@@ -5138,6 +5161,14 @@
"node": ">=8"
}
},
+ "node_modules/array-uniq": {
+ "version": "1.0.3",
+ "resolved": "https://registry.npmjs.org/array-uniq/-/array-uniq-1.0.3.tgz",
+ "integrity": "sha512-MNha4BWQ6JbwhFhj03YK552f7cb3AzoE8SzeljgChvL1dl3IcvggXVz1DilzySZkCja+CXuZbdW7yATchWn8/Q==",
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/array.prototype.findlastindex": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/array.prototype.findlastindex/-/array.prototype.findlastindex-1.2.3.tgz",
@@ -6030,6 +6061,14 @@
"wrap-ansi": "^7.0.0"
}
},
+ "node_modules/clsx": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.0.0.tgz",
+ "integrity": "sha512-rQ1+kcj+ttHG0MKVGBUXwayCCF1oh39BF5COIpRzuCEv8Mwjv0XucrI2ExNTOn9IlLifGClWQcU9BrZORvtw6Q==",
+ "engines": {
+ "node": ">=6"
+ }
+ },
"node_modules/co": {
"version": "4.6.0",
"resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz",
@@ -7087,6 +7126,11 @@
"resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.580.tgz",
"integrity": "sha512-T5q3pjQon853xxxHUq3ZP68ZpvJHuSMY2+BZaW3QzjS4HvNuvsMmZ/+lU+nCrftre1jFZ+OSlExynXWBihnXzw=="
},
+ "node_modules/email-addresses": {
+ "version": "5.0.0",
+ "resolved": "https://registry.npmjs.org/email-addresses/-/email-addresses-5.0.0.tgz",
+ "integrity": "sha512-4OIPYlA6JXqtVn8zpHpGiI7vE6EQOAg16aGnDMIAlZVinnoZ8208tW1hAbjWydgN/4PLTT9q+O1K6AH/vALJGw=="
+ },
"node_modules/emittery": {
"version": "0.8.1",
"resolved": "https://registry.npmjs.org/emittery/-/emittery-0.8.1.tgz",
@@ -8252,6 +8296,30 @@
"node": ">=10"
}
},
+ "node_modules/filename-reserved-regex": {
+ "version": "2.0.0",
+ "resolved": "https://registry.npmjs.org/filename-reserved-regex/-/filename-reserved-regex-2.0.0.tgz",
+ "integrity": "sha512-lc1bnsSr4L4Bdif8Xb/qrtokGbq5zlsms/CYH8PP+WtCkGNF65DPiQY8vG3SakEdRn8Dlnm+gW/qWKKjS5sZzQ==",
+ "engines": {
+ "node": ">=4"
+ }
+ },
+ "node_modules/filenamify": {
+ "version": "4.3.0",
+ "resolved": "https://registry.npmjs.org/filenamify/-/filenamify-4.3.0.tgz",
+ "integrity": "sha512-hcFKyUG57yWGAzu1CMt/dPzYZuv+jAJUT85bL8mrXvNe6hWj6yEHEc4EdcgiA6Z3oi1/9wXJdZPXF2dZNgwgOg==",
+ "dependencies": {
+ "filename-reserved-regex": "^2.0.0",
+ "strip-outer": "^1.0.1",
+ "trim-repeated": "^1.0.0"
+ },
+ "engines": {
+ "node": ">=8"
+ },
+ "funding": {
+ "url": "https://github.com/sponsors/sindresorhus"
+ }
+ },
"node_modules/filesize": {
"version": "8.0.7",
"resolved": "https://registry.npmjs.org/filesize/-/filesize-8.0.7.tgz",
@@ -8712,6 +8780,86 @@
"url": "https://github.com/sponsors/ljharb"
}
},
+ "node_modules/get-user-locale": {
+ "version": "2.3.1",
+ "resolved": "https://registry.npmjs.org/get-user-locale/-/get-user-locale-2.3.1.tgz",
+ "integrity": "sha512-VEvcsqKYx7zhZYC1CjecrDC5ziPSpl1gSm0qFFJhHSGDrSC+x4+p1KojWC/83QX//j476gFhkVXP/kNUc9q+bQ==",
+ "dependencies": {
+ "@types/lodash.memoize": "^4.1.7",
+ "lodash.memoize": "^4.1.1"
+ },
+ "funding": {
+ "url": "https://github.com/wojtekmaj/get-user-locale?sponsor=1"
+ }
+ },
+ "node_modules/gh-pages": {
+ "version": "6.0.0",
+ "resolved": "https://registry.npmjs.org/gh-pages/-/gh-pages-6.0.0.tgz",
+ "integrity": "sha512-FXZWJRsvP/fK2HJGY+Di6FRNHvqFF6gOIELaopDjXXgjeOYSNURcuYwEO/6bwuq6koP5Lnkvnr5GViXzuOB89g==",
+ "dependencies": {
+ "async": "^3.2.4",
+ "commander": "^11.0.0",
+ "email-addresses": "^5.0.0",
+ "filenamify": "^4.3.0",
+ "find-cache-dir": "^3.3.1",
+ "fs-extra": "^11.1.1",
+ "globby": "^6.1.0"
+ },
+ "bin": {
+ "gh-pages": "bin/gh-pages.js",
+ "gh-pages-clean": "bin/gh-pages-clean.js"
+ },
+ "engines": {
+ "node": ">=10"
+ }
+ },
+ "node_modules/gh-pages/node_modules/array-union": {
+ "version": "1.0.2",
+ "resolved": "https://registry.npmjs.org/array-union/-/array-union-1.0.2.tgz",
+ "integrity": "sha512-Dxr6QJj/RdU/hCaBjOfxW+q6lyuVE6JFWIrAUpuOOhoJJoQ99cUn3igRaHVB5P9WrgFVN0FfArM3x0cueOU8ng==",
+ "dependencies": {
+ "array-uniq": "^1.0.1"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
+ "node_modules/gh-pages/node_modules/commander": {
+ "version": "11.1.0",
+ "resolved": "https://registry.npmjs.org/commander/-/commander-11.1.0.tgz",
+ "integrity": "sha512-yPVavfyCcRhmorC7rWlkHn15b4wDVgVmBA7kV4QVBsF7kv/9TKJAbAXVTxvTnwP8HHKjRCJDClKbciiYS7p0DQ==",
+ "engines": {
+ "node": ">=16"
+ }
+ },
+ "node_modules/gh-pages/node_modules/fs-extra": {
+ "version": "11.1.1",
+ "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.1.1.tgz",
+ "integrity": "sha512-MGIE4HOvQCeUCzmlHs0vXpih4ysz4wg9qiSAu6cd42lVwPbTM1TjV7RusoyQqMmk/95gdQZX72u+YW+c3eEpFQ==",
+ "dependencies": {
+ "graceful-fs": "^4.2.0",
+ "jsonfile": "^6.0.1",
+ "universalify": "^2.0.0"
+ },
+ "engines": {
+ "node": ">=14.14"
+ }
+ },
+ "node_modules/gh-pages/node_modules/globby": {
+ "version": "6.1.0",
+ "resolved": "https://registry.npmjs.org/globby/-/globby-6.1.0.tgz",
+ "integrity": "sha512-KVbFv2TQtbzCoxAnfD6JcHZTYCzyliEaaeM/gH8qQdkKr5s0OP9scEgvdcngyk7AVdY6YVW/TJHd+lQ/Df3Daw==",
+ "dependencies": {
+ "array-union": "^1.0.1",
+ "glob": "^7.0.3",
+ "object-assign": "^4.0.1",
+ "pify": "^2.0.0",
+ "pinkie-promise": "^2.0.0"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/glob": {
"version": "7.2.3",
"resolved": "https://registry.npmjs.org/glob/-/glob-7.2.3.tgz",
@@ -13014,6 +13162,25 @@
"node": ">=0.10.0"
}
},
+ "node_modules/pinkie": {
+ "version": "2.0.4",
+ "resolved": "https://registry.npmjs.org/pinkie/-/pinkie-2.0.4.tgz",
+ "integrity": "sha512-MnUuEycAemtSaeFSjXKW/aroV7akBbY+Sv+RkyqFjgAe73F+MR0TBWKBRDkmfWq/HiFmdavfZ1G7h4SPZXaCSg==",
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
+ "node_modules/pinkie-promise": {
+ "version": "2.0.1",
+ "resolved": "https://registry.npmjs.org/pinkie-promise/-/pinkie-promise-2.0.1.tgz",
+ "integrity": "sha512-0Gni6D4UcLTbv9c57DfxDGdr41XfgUjqWZu492f0cIGr16zDU06BWP/RAEvOuo7CQ0CNjHaLlM59YJJFm3NWlw==",
+ "dependencies": {
+ "pinkie": "^2.0.0"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/pirates": {
"version": "4.0.6",
"resolved": "https://registry.npmjs.org/pirates/-/pirates-4.0.6.tgz",
@@ -14588,6 +14755,31 @@
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz",
"integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg=="
},
+ "node_modules/react-calendar": {
+ "version": "4.6.1",
+ "resolved": "https://registry.npmjs.org/react-calendar/-/react-calendar-4.6.1.tgz",
+ "integrity": "sha512-MvCPdvxEvq7wICBhFxlYwxS2+IsVvSjTcmlr0Kl3yDRVhoX7btNg0ySJx5hy9rb1eaM4nDpzQcW5c87nfQ8n8w==",
+ "dependencies": {
+ "@wojtekmaj/date-utils": "^1.1.3",
+ "clsx": "^2.0.0",
+ "get-user-locale": "^2.2.1",
+ "prop-types": "^15.6.0",
+ "tiny-warning": "^1.0.0"
+ },
+ "funding": {
+ "url": "https://github.com/wojtekmaj/react-calendar?sponsor=1"
+ },
+ "peerDependencies": {
+ "@types/react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+ "react": "^16.8.0 || ^17.0.0 || ^18.0.0",
+ "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0"
+ },
+ "peerDependenciesMeta": {
+ "@types/react": {
+ "optional": true
+ }
+ }
+ },
"node_modules/react-dev-utils": {
"version": "12.0.1",
"resolved": "https://registry.npmjs.org/react-dev-utils/-/react-dev-utils-12.0.1.tgz",
@@ -16093,6 +16285,17 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
+ "node_modules/strip-outer": {
+ "version": "1.0.1",
+ "resolved": "https://registry.npmjs.org/strip-outer/-/strip-outer-1.0.1.tgz",
+ "integrity": "sha512-k55yxKHwaXnpYGsOzg4Vl8+tDrWylxDEpknGjhTiZB8dFRU5rTo9CAzeycivxV3s+zlTKwrs6WxMxR95n26kwg==",
+ "dependencies": {
+ "escape-string-regexp": "^1.0.2"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/style-loader": {
"version": "3.3.3",
"resolved": "https://registry.npmjs.org/style-loader/-/style-loader-3.3.3.tgz",
@@ -16511,6 +16714,11 @@
"resolved": "https://registry.npmjs.org/thunky/-/thunky-1.1.0.tgz",
"integrity": "sha512-eHY7nBftgThBqOyHGVN+l8gF0BucP09fMo0oO/Lb0w1OF80dJv+lDVpXG60WMQvkcxAkNybKsrEIE3ZtKGmPrA=="
},
+ "node_modules/tiny-warning": {
+ "version": "1.0.3",
+ "resolved": "https://registry.npmjs.org/tiny-warning/-/tiny-warning-1.0.3.tgz",
+ "integrity": "sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA=="
+ },
"node_modules/tmpl": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/tmpl/-/tmpl-1.0.5.tgz",
@@ -16576,6 +16784,17 @@
"node": ">=8"
}
},
+ "node_modules/trim-repeated": {
+ "version": "1.0.0",
+ "resolved": "https://registry.npmjs.org/trim-repeated/-/trim-repeated-1.0.0.tgz",
+ "integrity": "sha512-pkonvlKk8/ZuR0D5tLW8ljt5I8kmxp2XKymhepUeOdCEfKpZaktSArkLHZt76OB1ZvO9bssUsDty4SWhLvZpLg==",
+ "dependencies": {
+ "escape-string-regexp": "^1.0.2"
+ },
+ "engines": {
+ "node": ">=0.10.0"
+ }
+ },
"node_modules/tryer": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/tryer/-/tryer-1.0.1.tgz",
diff --git a/react-whenMeet/package.json b/react-whenMeet/package.json
index 83a435d..7ed2481 100644
--- a/react-whenMeet/package.json
+++ b/react-whenMeet/package.json
@@ -6,8 +6,10 @@
"@testing-library/jest-dom": "^5.17.0",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
+ "gh-pages": "^6.0.0",
"prop-types": "^15.8.1",
"react": "^18.2.0",
+ "react-calendar": "^4.6.1",
"react-dom": "^18.2.0",
"react-router-dom": "^6.18.0",
"react-scripts": "^5.0.1",
diff --git a/react-whenMeet/src/components/Calendar.js b/react-whenMeet/src/components/Calendar.js
new file mode 100644
index 0000000..f1ef3ff
--- /dev/null
+++ b/react-whenMeet/src/components/Calendar.js
@@ -0,0 +1,16 @@
+import React from 'react';
+import { useState } from 'react';
+import ReactCalendar from 'react-calendar';
+import 'react-calendar/dist/Calendar.css';
+import Input from './Input';
+
+function Calendar({onChange}){
+ return(
+ <div>
+ <h2>�щ젰</h2>
+ <ReactCalendar onChange={onChange} />
+ </div>
+ );
+}
+
+export default Calendar;
\ No newline at end of file
diff --git a/react-whenMeet/src/routes/MeetingInfo.js b/react-whenMeet/src/routes/MeetingInfo.js
index ca84bf6..f5d9c9f 100644
--- a/react-whenMeet/src/routes/MeetingInfo.js
+++ b/react-whenMeet/src/routes/MeetingInfo.js
@@ -1,6 +1,69 @@
-function MeetingInfo(){
- return(
- <h1>MeetingInfo</h1>
+import { useState } from "react";
+import Input from "../components/Input";
+import Button from "../components/Button";
+import Calendar from "../components/Calendar";
+import { useNavigate } from "react-router-dom";
+import "../styles/HomeMake.css"
+
+function MeetingInfo() {
+ const [meetingPurpose, setMeetingPurpose] = useState("");
+ const [number, setNumber] = useState();
+ const [endTime, setEndTime] = useState("");
+ const navigate = useNavigate();
+
+ const handleOnClick = (event) => {
+ setMeetingPurpose(event.target.value);
+ }
+ const handleCalendar = (value) => {
+ console.log('Selected Date:', value);
+ };
+ const handleNumber = (event) => {
+ setNumber(event.target.value);
+ }
+ const handleEnd = (event) => {
+ setEndTime(event.target.value);
+ }
+ const handleSubmit = (event) => {
+ event.preventDefault();
+ if (meetingPurpose === "") {
+ return alert("紐⑹쟻�� �좏깮�섏꽭��");;
+ }
+ else {
+ navigate("LinkPage");
+ }
+ }
+ return (
+ <div className="center-container">
+ <form onSubmit={handleSubmit}>
+ <h1>�쎌냽 �쇱젙 留뚮뱾湲�</h1>
+ <label>
+ 紐⑹쟻:
+ <select value={meetingPurpose} onClick={handleOnClick}>
+ <option>�앹궗</option>
+ <option>怨듬�</option>
+ <option>��湲�</option>
+ <option>湲고�</option>
+ </select>
+ </label>
+ <Calendar onChange={handleCalendar} />
+ <Input
+ type="number"
+ value={number}
+ onChange={handleNumber}
+ placeholder="�덉긽 �ы몴 �몄썝"
+ />
+ <Input
+ type="datetime-local"
+ value={endTime}
+ onChange={handleEnd}
+ placeholder="�ы몴 醫낅즺 �쒓컙"
+ />
+ <Button
+ type="submit"
+ text="�쒖옉�섍린"
+ />
+ </form>
+ </div>
);
}
diff --git a/react-whenMeet/src/styles/HomeMake.css b/react-whenMeet/src/styles/HomeMake.css
index afa0773..1ad938c 100644
--- a/react-whenMeet/src/styles/HomeMake.css
+++ b/react-whenMeet/src/styles/HomeMake.css
@@ -24,7 +24,7 @@ h1 {
margin-bottom: 20px;
color: #333333;
font-size: 24px;
- font-family: 'Abril Fatface', cursive;
+ font-family: 'Lato';
}
input {
--
GitLab