+
+
+
);
};
const DropdownField = (props) => {
- const { dropdownCaret, dropdownHeader, action, pick } = props;
- const [dropdownOpen, setDropdownOpen] = useState(false);
+ const { dropdownCaret, action, pick } = props;
+ const [dropdownOpen, setDropdownOpen] = useState(null);
const [caret, setCaret] = useState(dropdownCaret);
+ const handleClick = (event) => {
+ setDropdownOpen(event.currentTarget);
+ };
+ const handleClose = () => {
+ setDropdownOpen(null);
+ };
+ const handleClickItem = (menu) => {
+ action(menu);
+ setDropdownOpen(null);
+ };
useEffect(() => {
if (pick !== "") setCaret(pick);
}, [pick]);
- const toggle = () => setDropdownOpen((prevState) => !prevState);
return (
-
+
+
+
);
};
export { DropdownRole, DropdownField };
diff --git a/src/components/Image/inputImage.jsx b/src/components/Image/inputImage.jsx
index a91718d36..15dfe398b 100644
--- a/src/components/Image/inputImage.jsx
+++ b/src/components/Image/inputImage.jsx
@@ -1,20 +1,6 @@
-/* eslint-disable react/jsx-props-no-spreading */
-import React, { useEffect, useRef, useCallback } from "react";
+import React from "react";
import { useDropzone } from "react-dropzone";
-const params = {
- pagination: {
- el: ".swiper-pagination",
- type: "bullets",
- clickable: true,
- },
- observer: true,
- spaceBetween: 30,
- lazy: {
- loadPrevNext: true,
- },
-};
-
function ImgInput({ img, saveImg }) {
const { getRootProps, getInputProps } = useDropzone({
accept: [".png", ".jpeg", ".jpg"],
diff --git a/src/components/Input/Input.jsx b/src/components/Input/Input.jsx
index aba42244e..025f0af2b 100644
--- a/src/components/Input/Input.jsx
+++ b/src/components/Input/Input.jsx
@@ -1,11 +1,8 @@
-import React, { useState, useEffect } from "react";
+import React from "react";
import InputBase from "@material-ui/core/InputBase";
import {
fade,
- ThemeProvider,
withStyles,
- makeStyles,
- createMuiTheme,
} from "@material-ui/core/styles";
const BootstrapInputUI = withStyles((theme) => ({
diff --git a/src/components/Layout.js b/src/components/Layout.js
index ce60d8526..a2117da41 100644
--- a/src/components/Layout.js
+++ b/src/components/Layout.js
@@ -1,9 +1,7 @@
import React, { useState } from "react";
import { Link, useHistory } from "react-router-dom";
import { useSelector, useDispatch } from "react-redux";
-import { useLogoutAuth } from "../hook/auth/useLogin";
import { setToken } from "../reducers/login";
-
import {
Collapse,
Navbar,
@@ -12,7 +10,6 @@ import {
Nav,
NavItem,
NavLink,
- NavbarText,
Button,
} from "reactstrap";
import "./Layout.css";
diff --git a/src/components/List/Sort.js b/src/components/List/Sort.jsx
similarity index 100%
rename from src/components/List/Sort.js
rename to src/components/List/Sort.jsx
diff --git a/src/components/Main/Jumbotron.js b/src/components/Main/Jumbotron.js
deleted file mode 100644
index c352aecf0..000000000
--- a/src/components/Main/Jumbotron.js
+++ /dev/null
@@ -1,30 +0,0 @@
-import React from "react";
-import { UncontrolledCarousel } from "reactstrap";
-const items = [
- {
- src:
- "data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa1d%20text%20%7B%20fill%3A%23555%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa1d%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23777%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22285.921875%22%20y%3D%22218.3%22%3EFirst%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E",
- altText: "Slide 1",
- caption: "Slide 1",
- header: "Slide 1 Header",
- key: "1"
- },
- {
- src:
- "data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa20%20text%20%7B%20fill%3A%23444%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa20%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23666%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22247.3203125%22%20y%3D%22218.3%22%3ESecond%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E",
- altText: "Slide 2",
- caption: "Slide 2",
- header: "Slide 2 Header",
- key: "2"
- },
- {
- src:
- "data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%22800%22%20height%3D%22400%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20800%20400%22%20preserveAspectRatio%3D%22none%22%3E%3Cdefs%3E%3Cstyle%20type%3D%22text%2Fcss%22%3E%23holder_15ba800aa21%20text%20%7B%20fill%3A%23333%3Bfont-weight%3Anormal%3Bfont-family%3AHelvetica%2C%20monospace%3Bfont-size%3A40pt%20%7D%20%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cg%20id%3D%22holder_15ba800aa21%22%3E%3Crect%20width%3D%22800%22%20height%3D%22400%22%20fill%3D%22%23555%22%3E%3C%2Frect%3E%3Cg%3E%3Ctext%20x%3D%22277%22%20y%3D%22218.3%22%3EThird%20slide%3C%2Ftext%3E%3C%2Fg%3E%3C%2Fg%3E%3C%2Fsvg%3E",
- altText: "Slide 3",
- caption: "Slide 3",
- header: "Slide 3 Header",
- key: "3"
- }
-];
-const Jumbotron = () =>
-
-
-
- {props.children}
- {props.footer}
-
-
- );
-};
-
-const AlertModal = (props) => {
- const { alertState, alertAction } = useAlert();
-
- return (
-
-
- {props.header}
-
-
-
-
-
-
-
-
- {alertState.sentence}
-
-
- );
-};
-
-export { CenterModal, AlertModal };
diff --git a/src/components/Modal/Modal.jsx b/src/components/Modal/Modal.jsx
new file mode 100644
index 000000000..87269fb74
--- /dev/null
+++ b/src/components/Modal/Modal.jsx
@@ -0,0 +1,93 @@
+import React from "react";
+import IconButton from "@material-ui/core/IconButton";
+import CloseIcon from "@material-ui/icons/Close";
+import Modal from "@material-ui/core/Modal";
+import { makeStyles } from "@material-ui/core/styles";
+import { useAlert } from "../../hook";
+
+const useStyles = makeStyles((theme) => ({
+ modal: {
+ display: "flex",
+ alignItems: "center",
+ justifyContent: "center",
+ },
+ paper: {
+ backgroundColor: theme.palette.background.paper,
+ border: "2px solid #000",
+ boxShadow: theme.shadows[5],
+ padding: theme.spacing(2, 4, 3),
+ },
+ header: {
+ "&::after": {
+ display: "block",
+ clear: "both",
+ content: '""',
+ },
+ },
+ headerText: { float: "left", lineHeight: "30px" },
+ headerBtn: { float: "right" },
+ closeBtn: {
+ width: "30px",
+ height: "30px",
+ },
+}));
+
+const CenterModal = (props) => {
+ const { modalFlag, close } = props;
+ const classes = useStyles();
+
+ return (
+
-
- 알림
-
-
-
-
-
+
+
+
+ {props.header}
+
+
+
+
+ {props.children}
+ {props.footer}
+
+
+
+
+ 알림
+
+
+
+
+ {alertState.sentence}
+
diff --git a/src/components/People/Profile/Invitation/DetailModal.js b/src/components/People/Profile/Invitation/DetailModal.js
index 4cb2301da..2db1f6e43 100644
--- a/src/components/People/Profile/Invitation/DetailModal.js
+++ b/src/components/People/Profile/Invitation/DetailModal.js
@@ -9,7 +9,7 @@ import {
Col,
Badge,
Card,
- CardText
+ CardText,
} from "reactstrap";
import { useInvitationDetailEffect } from "../../../../hook/profile/useInvitation";
@@ -28,7 +28,7 @@ const DetailModal = ({ pid, userId, modal, toggle }) => {
const [
{ invitaionDetail, activityName },
- { handleAccept, handleReject }
+ { handleAccept, handleReject },
] = useInvitationDetailEffect(userId, pid, toggleNested);
return (
diff --git a/src/components/People/Profile/Invitation/InvitationBox.js b/src/components/People/Profile/Invitation/InvitationBox.js
index 77bf1960b..42af14d2d 100644
--- a/src/components/People/Profile/Invitation/InvitationBox.js
+++ b/src/components/People/Profile/Invitation/InvitationBox.js
@@ -1,5 +1,5 @@
import React, { useState } from "react";
-import { Card, Button, CardTitle, CardText, Row, Col, Badge } from "reactstrap";
+import { Card, CardTitle, CardText, Row, Col, Badge } from "reactstrap";
import DetailModal from "./DetailModal";
const InvitationBox = ({ data, userId }) => {
const [detailModal, setDetailModal] = useState(false);
diff --git a/src/components/People/Profile/ProfileImage/Image.js b/src/components/People/Profile/ProfileImage/Image.js
deleted file mode 100644
index 9f5e7d892..000000000
--- a/src/components/People/Profile/ProfileImage/Image.js
+++ /dev/null
@@ -1,32 +0,0 @@
-// import React from "react";
-// import ImageApi from "../../hook/api/imgApi";
-// import useRequest from "../../../../hook/useRequest";
-
-// const Image = ({ purpose, userId }) => {
-// const { getImage } = ImageApi();
-// const [
-// {
-// data: resImage,
-// fulfilled: getImageFulfilled,
-// pending: getImagePending,
-// rejected: getImageRejected,
-// error: getImageError
-// },
-// { run: getImageApi }
-// ] = useRequest(getImage);
-
-// const [imageState] = useImage(
-// resImage,
-// getImageFulfilled,
-// getImagePending,
-// getImageRejected,
-// getImageError,
-// getImageApi,
-// purpose,
-// userId
-// );
-
-// return ;
-// };
-
-// export default Image;
diff --git a/src/components/People/Profile/ProfileImage/ImageModify.js b/src/components/People/Profile/ProfileImage/ImageModify.js
index b4498ab82..9ad7da367 100644
--- a/src/components/People/Profile/ProfileImage/ImageModify.js
+++ b/src/components/People/Profile/ProfileImage/ImageModify.js
@@ -1,27 +1,27 @@
import React from "react";
-import { Button, Form, FormGroup, Label, Input, FormText } from "reactstrap";
+import { Form, FormGroup, Label, Input, FormText } from "reactstrap";
import { useDropzone } from "react-dropzone";
const ImageModify = ({ state, setState }) => {
const { getRootProps, getInputProps } = useDropzone({
accept: "image/*",
- onDrop: acceptedFiles => {
- const imgFile = acceptedFiles.map(file =>
+ onDrop: (acceptedFiles) => {
+ const imgFile = acceptedFiles.map((file) =>
Object.assign(file, {
- url: URL.createObjectURL(file)
- })
+ url: URL.createObjectURL(file),
+ }),
);
setState({ imgUrl: imgFile[0], isImgChange: true });
- }
+ },
});
const params = {
pagination: {
el: ".swiper-pagination",
type: "bullets",
- clickable: true
+ clickable: true,
},
observer: true,
- spaceBetween: 30
+ spaceBetween: 30,
};
return (
diff --git a/src/components/People/Profile/ProfileInfo/ProfileInfoModify.js b/src/components/People/Profile/ProfileInfo/ProfileInfoModify.js
index 4e18fa959..b0ce5952d 100644
--- a/src/components/People/Profile/ProfileInfo/ProfileInfoModify.js
+++ b/src/components/People/Profile/ProfileInfo/ProfileInfoModify.js
@@ -1,8 +1,6 @@
-import React, { useState } from "react";
-import { Button, Form, FormGroup, Label, Input, FormText } from "reactstrap";
+import React from "react";
+import { Button, Form, FormGroup, Label, Input } from "reactstrap";
import ImageModify from "../ProfileImage/ImageModify";
-import { infoApi, imgApi } from "../../../../hook/api";
-import { useRequest } from "../../../../hook/useRequest";
import useProfileInfoModify from "../../../../hook/profile/useProfileInfoModify";
const ProfileInfoModify = ({
diff --git a/src/components/People/Profile/RecruitModal.js b/src/components/People/Profile/RecruitModal.js
index 9ee306fa0..5866fcf0f 100644
--- a/src/components/People/Profile/RecruitModal.js
+++ b/src/components/People/Profile/RecruitModal.js
@@ -3,7 +3,6 @@ import { Button, Modal, ModalHeader, ModalBody, ModalFooter } from "reactstrap";
import { planProjectApi, sendRecruitPeopleApi } from "../../../hook/api";
import InputLabel from "@material-ui/core/InputLabel";
import MenuItem from "@material-ui/core/MenuItem";
-import FormHelperText from "@material-ui/core/FormHelperText";
import FormControl from "@material-ui/core/FormControl";
import Select from "@material-ui/core/Select";
import TextField from "@material-ui/core/TextField";
diff --git a/src/components/Project/ProjectBox.js b/src/components/Project/ProjectBox.js
index 78000975f..0c4db408a 100644
--- a/src/components/Project/ProjectBox.js
+++ b/src/components/Project/ProjectBox.js
@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React from "react";
import { Link } from "react-router-dom";
import {
Card,
diff --git a/src/components/Switch/switch.js b/src/components/Switch/switch.js
index 5e2b3751e..604f8a11c 100644
--- a/src/components/Switch/switch.js
+++ b/src/components/Switch/switch.js
@@ -1,90 +1,90 @@
-import React from 'react';
-import { withStyles } from '@material-ui/core/styles';
-import Switch from '@material-ui/core/Switch';
+import React from "react";
+import { withStyles } from "@material-ui/core/styles";
+import Switch from "@material-ui/core/Switch";
-export const IOSSwitch = withStyles(theme => ({
- root: {
- width: 42,
- height: 26,
- padding: 0,
- margin: theme.spacing(1),
- },
- switchBase: {
- padding: 1,
- '&$checked': {
- transform: 'translateX(16px)',
- color: theme.palette.common.white,
- '& + $track': {
- backgroundColor: '#52d869',
- opacity: 1,
- border: 'none',
- },
- },
- '&$focusVisible $thumb': {
- color: '#52d869',
- border: '6px solid #fff',
- },
- },
- thumb: {
- width: 24,
- height: 24,
- },
- track: {
- borderRadius: 26 / 2,
- border: `1px solid ${theme.palette.grey[400]}`,
- backgroundColor: theme.palette.grey[50],
+export const IOSSwitch = withStyles((theme) => ({
+ root: {
+ width: 42,
+ height: 26,
+ padding: 0,
+ margin: theme.spacing(1),
+ },
+ switchBase: {
+ padding: 1,
+ "&$checked": {
+ transform: "translateX(16px)",
+ color: theme.palette.common.white,
+ "& + $track": {
+ backgroundColor: "#52d869",
opacity: 1,
- transition: theme.transitions.create(['background-color', 'border']),
+ border: "none",
+ },
+ },
+ "&$focusVisible $thumb": {
+ color: "#52d869",
+ border: "6px solid #fff",
},
- checked: {},
- focusVisible: {},
+ },
+ thumb: {
+ width: 24,
+ height: 24,
+ },
+ track: {
+ borderRadius: 26 / 2,
+ border: `1px solid ${theme.palette.grey[400]}`,
+ backgroundColor: theme.palette.grey[50],
+ opacity: 1,
+ transition: theme.transitions.create(["background-color", "border"]),
+ },
+ checked: {},
+ focusVisible: {},
}))(({ classes, ...props }) => {
- return (
- ) => void;
};
+
export function useLoginEffect(): LoginType {
const dispatch = useDispatch();
const isToken = useSelector((state: any) => state.login.isToken);
-
- const userId = useRef("");
const { alertAction } = useAlert();
const [login, { run: postLoginApi }] = useRequest(loginApi().postLogin);
+ const [user, setUser] = useState({
+ userId: "",
+ password: "",
+ });
useMove(isToken && login.fulfilled, "");
- const onFinish = (values: any) => {
- console.log("Success:", values);
- userId.current = values.userId;
- postLoginApi(values);
+ const onFinish = (e: React.ChangeEvent) => {
+ e.preventDefault();
+ console.log("Success:", user);
+ postLoginApi(user);
+ return false;
};
const onFinishFailed = (errorInfo: any) => {
console.log("Failed:", errorInfo);
};
+ const handleInput = (e: React.ChangeEvent) => {
+ e.persist();
+ setUser((value) => {
+ return {
+ ...value,
+ [e.target.name]: e.target.value,
+ };
+ });
+ };
+
// 로그인 성공 시 useEffect
useEffect(() => {
if (login.fulfilled) {
@@ -37,7 +58,7 @@ export function useLoginEffect(): LoginType {
const accessToken = login.data.accessToken;
const refreshToken = login.data.refreshToken;
// 세션스토리지에 아이디와 토큰 저장
- window.sessionStorage.setItem("id", userId.current);
+ window.sessionStorage.setItem("id", user.userId);
window.sessionStorage.setItem("accessToken", accessToken);
window.sessionStorage.setItem("refreshToken", refreshToken);
alertAction.open("로그인 성공");
@@ -45,7 +66,7 @@ export function useLoginEffect(): LoginType {
// 리덕스에 디스패치
const reduxData = {
isToken: true,
- userId: userId.current,
+ userId: user.userId,
};
dispatch(setToken(reduxData));
}
@@ -61,7 +82,13 @@ export function useLoginEffect(): LoginType {
}
}, [login.rejected]);
- return { loading: login.pending, onFinish, onFinishFailed };
+ return {
+ loading: login.pending,
+ user,
+ onFinish,
+ onFinishFailed,
+ handleInput,
+ };
}
// 세션 스토리지에 아이디와 토큰이 있을 때, 리덕스에 토큰유무와 아이디를 저장
diff --git a/src/hook/auth/useRegister.ts b/src/hook/auth/useRegister.ts
index a9a27949a..20cc5a47b 100644
--- a/src/hook/auth/useRegister.ts
+++ b/src/hook/auth/useRegister.ts
@@ -1,12 +1,21 @@
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
import { useAlert, useMove } from "..";
import { useRequest } from "../";
import { registerApi } from "../api";
+type registerType = {
+ userId: string;
+ userEmail: string;
+ name: string;
+ password: string;
+};
+
type RegisterType = {
loading: boolean;
+ register: registerType;
onFinish: (values: any) => void;
onFinishFailed: (errorInfo: any) => void;
+ handleInput: (e: React.ChangeEvent) => void;
};
export function useRegisterEffect(): RegisterType {
@@ -14,16 +23,33 @@ export function useRegisterEffect(): RegisterType {
const [registerPromiseState, { run: postRegisterFetch }] = useRequest(
registerApi().postRegister,
);
+ const [register, setRegister] = useState({
+ userId: "",
+ userEmail: '',
+ name: '',
+ password: ''
+ });
- const onFinish = (values: any) => {
- console.log("Success:", values);
- postRegisterFetch(values);
+ const onFinish = (e: React.ChangeEvent) => {
+ e.preventDefault();
+ console.log("Success:", register);
+ postRegisterFetch(register);
};
const onFinishFailed = (errorInfo: any) => {
console.log("Failed:", errorInfo);
};
+ const handleInput = (e: React.ChangeEvent) => {
+ e.persist();
+ setRegister((value) => {
+ return {
+ ...value,
+ [e.target.name]: e.target.value,
+ };
+ });
+ };
+
useMove(registerPromiseState.fulfilled, "login");
useEffect(() => {
@@ -40,5 +66,11 @@ export function useRegisterEffect(): RegisterType {
}
}, [registerPromiseState.rejected]);
- return { loading: registerPromiseState.pending, onFinish, onFinishFailed };
+ return {
+ loading: registerPromiseState.pending,
+ register,
+ onFinish,
+ onFinishFailed,
+ handleInput,
+ };
}
diff --git a/src/hook/profile/useProfileProject.js b/src/hook/profile/useProfileProject.js
index 28b701f04..96e8e56c8 100644
--- a/src/hook/profile/useProfileProject.js
+++ b/src/hook/profile/useProfileProject.js
@@ -11,9 +11,9 @@ const useProfileProject = (
setList,
hiding,
- userId
+ userId,
) => {
- const check = useSelector(state => state.profile.isHideChange);
+ const check = useSelector((state) => state.profile.isHideChange);
// hide 변경사항이 있으면 다시 get요청
useEffect(() => {
diff --git a/src/hook/profile/useProfileProjectModify.js b/src/hook/profile/useProfileProjectModify.js
index 6c0892984..97967ae4b 100644
--- a/src/hook/profile/useProfileProjectModify.js
+++ b/src/hook/profile/useProfileProjectModify.js
@@ -23,7 +23,7 @@ const useProfileProjectModify = (
setList,
hideList,
- setHideList
+ setHideList,
) => {
// 처음 로딩 시 숨겨진 프로젝트 목록 불러오기
useEffect(() => {
@@ -45,17 +45,17 @@ const useProfileProjectModify = (
let moveData = {};
// 일반 state list에서 선택한 project 제거
setList(
- list.filter(a => {
+ list.filter((a) => {
if (a.projectId === resHideProject.projectId) {
moveData = a;
return false;
}
return true;
- })
+ }),
);
// 숨김 state list에서 위에서 선택된 project 추가
- setHideList(hideList => {
+ setHideList((hideList) => {
const newList = hideList.concat(moveData);
return newList;
});
@@ -68,16 +68,16 @@ const useProfileProjectModify = (
let moveData = {};
// 숨김 state list에서 선택한 project 제거
setHideList(
- hideList.filter(a => {
+ hideList.filter((a) => {
if (a.projectId === resDisplayProject.projectId) {
moveData = a;
return false;
}
return true;
- })
+ }),
);
// 일반 state list에 선택된 프로젝트 추가
- setList(list => {
+ setList((list) => {
const newList = list.concat(moveData);
return newList;
});
diff --git a/src/hook/projectTs/useProjectApplyTs.ts b/src/hook/projectTs/useProjectApplyTs.ts
index 27f849c89..32cd03028 100644
--- a/src/hook/projectTs/useProjectApplyTs.ts
+++ b/src/hook/projectTs/useProjectApplyTs.ts
@@ -1,5 +1,4 @@
import { Dispatch, SetStateAction, useEffect, useState } from "react";
-import { useSelector, useDispatch } from "react-redux";
import { useHistory } from "react-router-dom";
import { useRequest } from "../";
import { loginApi } from "../api";
diff --git a/src/hook/projectTs/useProjectCreateTs.ts b/src/hook/projectTs/useProjectCreateTs.ts
index 0e810ff29..b5b5d2403 100644
--- a/src/hook/projectTs/useProjectCreateTs.ts
+++ b/src/hook/projectTs/useProjectCreateTs.ts
@@ -206,15 +206,17 @@ const useProjectCreateStateTS = (): CreateType => {
};
const inputProjectMember = (name: string, memberValue: string): void => {
- setProject((value) => {
- return {
- ...value,
- needMember: {
- ...value.needMember,
- [name]: memberValue,
- },
- };
- });
+ if(parseInt(memberValue) >= 0){
+ setProject((value) => {
+ return {
+ ...value,
+ needMember: {
+ ...value.needMember,
+ [name]: memberValue,
+ },
+ };
+ });
+ }
};
const createState: CreateStateType = {
diff --git a/src/hook/projectTs/useProjectDetailTs.ts b/src/hook/projectTs/useProjectDetailTs.ts
index 3c428caed..28697b3d4 100644
--- a/src/hook/projectTs/useProjectDetailTs.ts
+++ b/src/hook/projectTs/useProjectDetailTs.ts
@@ -1,5 +1,4 @@
import { Dispatch, SetStateAction, useEffect, useState } from "react";
-import { useSelector, useDispatch } from "react-redux";
import { useAlert, useRequest } from "../";
import { useHistory } from "react-router-dom";
import { loginApi } from "../api";
@@ -400,30 +399,6 @@ const useProjectDetailEffectTs = (
}, [project.getProject.rejected]);
};
-// const useProjectRecruitEffect = (
-// data,
-// fulfilled,
-// rejected,
-// error,
-// inputState,
-// ) => {
-// // const [alertData, alertAction] = useAlert();
-
-// useEffect(() => {
-// if (fulfilled) {
-// // inputDetail(data);
-// inputState(recruitDtoList);
-// }
-// }, [fulfilled]);
-
-// useEffect(() => {
-// if (rejected) {
-// // alertAction.open(error.response.data.message);
-// console.log(error);
-// }
-// }, [rejected]);
-// };
-
export {
useProjectDetailStateTs,
useProjectDetailEffectTs,
diff --git a/src/hook/projectTs/useProjectUpdateTs.ts b/src/hook/projectTs/useProjectUpdateTs.ts
index 55cbdf5d8..029bef157 100644
--- a/src/hook/projectTs/useProjectUpdateTs.ts
+++ b/src/hook/projectTs/useProjectUpdateTs.ts
@@ -3,7 +3,6 @@ import { useSelector, useDispatch } from "react-redux";
import { useHistory } from "react-router-dom";
import { loginApi } from "../api";
import { useAlert, useRequest } from "../";
-import { AxiosError } from "axios";
import { RequestState } from "../useRequest";
const axios = require("axios");
diff --git a/src/hook/useAlert.ts b/src/hook/useAlert.ts
index bf8c0d587..45a1640b5 100644
--- a/src/hook/useAlert.ts
+++ b/src/hook/useAlert.ts
@@ -1,4 +1,3 @@
-import { useEffect, useState } from "react";
import { useSelector, useDispatch } from "react-redux";
import { openAlert, closeAlert } from "../reducers/alert";
import { RootState } from '../reducers';
diff --git a/src/hook/useHook.js b/src/hook/useHook.js
index e598f075b..496c9ee2e 100644
--- a/src/hook/useHook.js
+++ b/src/hook/useHook.js
@@ -1,9 +1,8 @@
-import { useEffect, useState } from "react";
import { useSelector, useDispatch } from "react-redux";
const axios = require("axios");
export function useTemporaryApi() {
- const { temporary } = useSelector(state => state.temproray);
+ const { temporary } = useSelector((state) => state.temproray);
const getProjectList = async () => {
const res = await axios.get(`https://apis.tracker.delivery/carriers`);
return res.data;
@@ -12,10 +11,10 @@ export function useTemporaryApi() {
const res = await axios.get(`https://apis.tracker.delivery/carriers`);
return res.data;
};
- const postProjectList = async data => {
+ const postProjectList = async (data) => {
await axios.post(`https://apis.tracker.delivery/carriers`, { data: data });
};
- const postPeopletList = async data => {
+ const postPeopletList = async (data) => {
await axios.post(`https://apis.tracker.delivery/carriers`, { data: data });
};
@@ -25,7 +24,7 @@ export function useTemporaryApi() {
getProjectList,
getPeopleList,
postProjectList,
- postPeopletList
- }
+ postPeopletList,
+ },
];
}
diff --git a/src/hook/usePageMove.js b/src/hook/usePageMove.js
index ecde77b59..921c068c2 100644
--- a/src/hook/usePageMove.js
+++ b/src/hook/usePageMove.js
@@ -1,5 +1,5 @@
-import { useEffect } from 'react';
-import { useHistory } from 'react-router-dom';
+import { useEffect } from "react";
+import { useHistory } from "react-router-dom";
export default function useMove(condition, destination) {
const history = useHistory();
@@ -12,5 +12,5 @@ export default function useMove(condition, destination) {
if (condition) {
history.push(`./${destination}`);
}
- }, [condition])
+ }, [condition]);
}
diff --git a/src/pages/auth/Login.css b/src/pages/auth/Login.css
deleted file mode 100644
index e472b0206..000000000
--- a/src/pages/auth/Login.css
+++ /dev/null
@@ -1,17 +0,0 @@
-.login_title {
- text-align: center;
-}
-
-.login_box {
- max-width: 380px;
- margin: auto;
- margin-top: 50px;
-}
-
-.login_input {
- width: 100%;
-}
-
-.login_submit {
- margin-top: 10px;
-}
\ No newline at end of file
diff --git a/src/pages/auth/LoginTs.tsx b/src/pages/auth/LoginTs.tsx
index 74b6f60cf..199c11e53 100644
--- a/src/pages/auth/LoginTs.tsx
+++ b/src/pages/auth/LoginTs.tsx
@@ -1,54 +1,78 @@
-import { Button, Form, Input, Typography } from "antd";
import React from "react";
+import Typography from "@material-ui/core/Typography";
+import Button from "@material-ui/core/Button";
+import { makeStyles } from "@material-ui/core/styles";
+import InputLabel from "@material-ui/core/InputLabel";
+import Input from "@material-ui/core/Input";
+import FormControl from "@material-ui/core/FormControl";
import { Layout } from "../../components";
-import "./Login.css";
import { useLoginEffect } from "../../hook/auth";
-const { Title } = Typography;
-
-const layout = {
- labelCol: { span: 8 },
- wrapperCol: { span: 16 },
-};
-const tailLayout = {
- wrapperCol: { offset: 8, span: 16 },
-};
+const useStyles = makeStyles((theme) => ({
+ root: {
+ "& > *": {
+ margin: theme.spacing(1),
+ },
+ },
+ title: {
+ textAlign: "center",
+ },
+ formWrap: {
+ maxWidth: "280px",
+ margin: "auto",
+ marginTop: "50px",
+ },
+ registInput: {
+ width: "100%",
+ },
+}));
function LoginPage() {
- const {loading, onFinish, onFinishFailed} = useLoginEffect();
+ const classes = useStyles();
+ const {loading, user, onFinish, onFinishFailed, handleInput} = useLoginEffect();
+
return (
-
+ <Typography variant="h5" className={classes.title}>
Login
-
-
-