Skip to content

GitLab

Commit 40d20e11 authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

Merge branch 'ourMaster' into jiwon

parents 6cde4f49 8f4248c2
Show whitespace changes
Inline Side-by-side
client/src/Pages/Login.js
View file @ 40d20e11
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { Link, Redirect } from 'react-router-dom';
import Nav1 from '../Components/MainNav'; import Nav1 from '../Components/MainNav';
import Nav2 from '../Components/SubNav'; import Nav2 from '../Components/SubNav';
import { Form, Col, Container, Button, Row } from 'react-bootstrap' import { Form, Col, Container, Button, Row } from 'react-bootstrap';
import { Link, Redirect } from 'react-router-dom'
function Login(){ function Login(){
const [validated,setValidated]=useState(false);
const handleSubmit=(e)=>{
const form =e.currentTarget;
console.log(form)
if(form.checkValidity() === false){
e.preventDefault();
e.stopPropagation();
}
setValidated(true);
}
return ( return (
<div> <div>
<Nav1 /> <Nav1 />
<Nav2 /> <Nav2 />
<Container className="my-5"> <Container className="my-5">
<Row className="justify-content-center"> <Row className="justify-content-center">
<Col md={5} xs={10} className="border" style={{ background: '#F7F3F3' }}> <Col md={5} xs={10} className="border" style={{ background: '#F7F3F3' }}>
<h3 className="text-center mt-5">Login</h3> <h3 className="text-center mt-5">Login</h3>
<Form className="p-5"> <Form noValidate validated={validated} onSubmit={handleSubmit} className="p-5">
<Form.Group controlId="formBasicId"> <Form.Group controlId="formBasicId">
<Form.Row> <Form.Row>
<Form.Label for="id">아이디</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="id"> 아이디</Col>
<Col> <Col sm={8} xs={12} as={Form.Control}
<Form.Control required
// type="text" type="text"
// id="id" id="id"
// value={id} placeholder="ID"
// onChange={({ target: { value } }) => user.d(value)} style={{ width: '160px' }}>
className="mx-sm-3" size="sm" placeholder="ID">
</Form.Control>
</Col> </Col>
<Form.Control.Feedback className="text-center" type="invalid"> 아이디를 입력하세요.</Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicPassword"> <Form.Group controlId="formBasicPassword">
<Form.Row> <Form.Row>
<Form.Label for="password">비밀번호</Form.Label> <Col sm={4} xs={6} as={Form.Label} for="password">비밀번호</Col>
<Col> <Col sm={8} xs={12} as={Form.Control}
<Form.Control type="password"
// type="password" id="password"
// id="password" placeholder="Password"
// value={password} style={{ width: '160px' }}
// onChange={({ target: { value } }) => user.password(value)} required />
className="mx-sm-3" size="sm" placeholder="Password"></Form.Control> <Form.Control.Feedback className="text-center" type="invalid">
</Col> 비밀번호를 입력하세요.
</Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Button style={{ background: '#91877F', borderColor: '#91877F' }} type="submit" block>Login</Button> <Button style={{ background: '#91877F', borderColor: '#91877F' }} type="submit" block>Login</Button>
<div className="loginLine"> <div className="loginLine">
<Link to="/signup" style={{ color: '#91877F' }} >회원이 아니십니까?</Link> <Link to="/signup" style={{ color: '#91877F' }}>회원이 아니십니까?</Link>
</div> </div>
</Form> </Form>
</Col> </Col>
</Row> </Row>
</Container> </Container>
</div> </div>
) )
} }
......
client/src/Pages/Products.js
View file @ 40d20e11
...@@ -4,9 +4,20 @@ import SubNav from '../Components/SubNav'; ...@@ -4,9 +4,20 @@ import SubNav from '../Components/SubNav';
import { Row, Col, Form, Card } from 'react-bootstrap'; import { Row, Col, Form, Card } from 'react-bootstrap';
function Products() { function Products() {
function handleClick(e) {
const box = e.target.parentNode.parentNode
box.style.display = "none"
}
return ( return (
<div> <div>
{/* <style type="text/css">
{`
.close {
color:
}
`}
</style> */}
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<Row className="justify-content-center mt-5"> <Row className="justify-content-center mt-5">
...@@ -33,32 +44,34 @@ function Products() { ...@@ -33,32 +44,34 @@ function Products() {
<div></div> <div></div>
</Col> </Col>
</Row> </Row>
<div className="m-5"> <div className="mx-5 pt-3" style={{ position: "fixed", bottom: "0", backgroundColor: "#fff" }}>
<h6 style={{ borderBottom: "1px solid", paddingBottom: "5px", marginBottom: "1em" }}>회원님이 선호할만한 상품 추천</h6> <h6 style={{ borderBottom: "1px solid", paddingBottom: "5px", marginBottom: "1em" }}>회원님이 선호할만한 상품 추천
<a className="close float-right" onClick={(e) => handleClick(e)} style={{ fontSize: "1rem" }}>X</a>
</h6>
<Row className="justify-content-space" style={{ objectFit: "contain", width: "100%" }}> <Row className="justify-content-space" style={{ objectFit: "contain", width: "100%" }}>
<Col as={Card} style={{ width: "16rem" }}> <Col as={Card} style={{ width: "16rem" }}>
<Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" /> <Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" style={{ objectFit: "contain", width: "10rem", height: "10rem" }} />
<Card.Body> <Card.Body>
<Card.Title>클로타탄원피스</Card.Title> <Card.Title>클로타탄원피스</Card.Title>
<Card.Text>구매자 수: 30</Card.Text> <Card.Text>구매자 수: 30</Card.Text>
</Card.Body> </Card.Body>
</Col> </Col>
<Col as={Card} style={{ width: "16rem" }}> <Col as={Card} style={{ width: "16rem" }}>
<Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" /> <Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" style={{ objectFit: "contain", width: "10rem", height: "10rem" }} />
<Card.Body> <Card.Body>
<Card.Title>클로타탄원피스</Card.Title> <Card.Title>클로타탄원피스</Card.Title>
<Card.Text>구매자 수: 30</Card.Text> <Card.Text>구매자 수: 30</Card.Text>
</Card.Body> </Card.Body>
</Col> </Col>
<Col as={Card} style={{ width: "16rem" }}> <Col as={Card} style={{ width: "16rem" }}>
<Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" /> <Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" style={{ objectFit: "contain", width: "10rem", height: "10rem" }} />
<Card.Body> <Card.Body>
<Card.Title>클로타탄원피스</Card.Title> <Card.Title>클로타탄원피스</Card.Title>
<Card.Text>구매자 수: 30</Card.Text> <Card.Text>구매자 수: 30</Card.Text>
</Card.Body> </Card.Body>
</Col> </Col>
<Col as={Card} style={{ width: "16rem" }}> <Col as={Card} style={{ width: "16rem" }}>
<Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" /> <Card.Img variant="top" src="https://img.sonyunara.com/files/goods/67504/1607328307_0.jpg" style={{ objectFit: "contain", width: "10rem", height: "10rem" }} />
<Card.Body> <Card.Body>
<Card.Title>클로타탄원피스</Card.Title> <Card.Title>클로타탄원피스</Card.Title>
<Card.Text>구매자 수: 30</Card.Text> <Card.Text>구매자 수: 30</Card.Text>
......
client/src/Pages/Signup.js
View file @ 40d20e11
...@@ -2,27 +2,99 @@ import React, { useState, useEffect, useRef } from 'react'; ...@@ -2,27 +2,99 @@ import React, { useState, useEffect, useRef } from 'react';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import Nav1 from '../Components/MainNav'; import Nav1 from '../Components/MainNav';
import Nav2 from '../Components/SubNav'; import Nav2 from '../Components/SubNav';
import { Form, Col, Container, Button, Row } from 'react-bootstrap' import { Form, Col, Container, Button, Row } from 'react-bootstrap';
import FormCheckInput from 'react-bootstrap/esm/FormCheckInput'; import DaumPostcode from "react-daum-postcode";
function Signup() { function Signup() {
const [address,setAddress] =useState("")
const handleComplete = (data) => {
let fullAddress = data.address;
let extraAddress = "";
console.log(data)
if (data.addressType === "R") {
if (data.bname !== "") {
extraAddress += data.bname;
console.log(extraAddress)
}
if (data.buildingName !== "") {
extraAddress +=
extraAddress !== "" ? `, ${data.buildingName}` : data.buildingName;
}
fullAddress += extraAddress !== "" ? ` (${extraAddress})` : "";
}
setAddress({full: fullAddress, zone: data.zonecode});
console.log(fullAddress);
}
const Postcode = () => {
return ( return (
<DaumPostcode
onComplete={handleComplete}
/>
);
}
const [post, setPost] = useState([]);
function postClick() {
if (post.length !== 0) {
setPost([])
} else {
setPost(
<div> <div>
<DaumPostcode style={postCodeStyle} onComplete={handleComplete} />
</div>
)
}
}
const postCodeStyle = {
position: "absolute",
width: "400px",
height: "500px",
padding: "7px",
};
const [validated, setValidated] = useState(false);
const handleSubmit = (e) => {
const form = e.currentTarget;
console.log(form)
if (form.checkValidity() === false) {
e.preventDefault();
e.stopPropagation();
}
setValidated(true);
}
return (
<div>
<Nav1 /> <Nav1 />
<Nav2 /> <Nav2 />
<Container className="my-5"> <Container className="my-5">
<Row className="justify-content-center"> <Row className="justify-content-center">
<Col md={6} xs={10} className="border" style={{background:'#F7F3F3'}}> <Col md={6} xs={10} className="border" style={{ background: '#F7F3F3' }}>
<h2 className="text-center mt-5">Sign Up</h2> <h2 className="text-center mt-5">Sign Up</h2>
<Form className="p-5"> <Form noValidate validated={validated} onSubmit={handleSubmit} className="p-5">
<Form.Group controlId="formBasicName"> <Form.Group controlId="formBasicName">
<Form.Row> <Form.Row>
<Form.Label for="name">이 름</Form.Label> <Form.Label for="name">이 름</Form.Label>
<Col> <Col>
<Form.Control type="text" id="name" size="sm" placeholder="" className="mx-sm-3"></Form.Control> <Form.Control
required
type="text" id="name"
size="sm" placeholder="" className="mx-sm-3">
</Form.Control>
<Form.Control.Feedback type="invalid">이름을 입력하세요. </Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
...@@ -32,10 +104,11 @@ function Signup() { ...@@ -32,10 +104,11 @@ function Signup() {
<Form.Label for="number">주민등록번호</Form.Label> <Form.Label for="number">주민등록번호</Form.Label>
<Col as={Row}> <Col as={Row}>
<Form.Control type="text" id="number1" size="sm" maxlength="6" className="mx-sm-3" style={{ width: '120px' }}></Form.Control> <Form.Control required type="text" id="number1" size="sm" maxlength="6" className="mx-sm-3" style={{ width: '120px' }}></Form.Control>
- -
<Form.Control type="text" id="number2" size="sm" maxlength="1" className="mx-sm-3" style={{ width: '25px' }}></Form.Control> <Form.Control required type="text" id="number2" size="sm" maxlength="1" className="mx-sm-3" style={{ width: '25px' }}></Form.Control>
****** ******
<Form.Control.Feedback type="invalid">주민등록번호를 입력하세요.</Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
...@@ -44,7 +117,8 @@ function Signup() { ...@@ -44,7 +117,8 @@ function Signup() {
<Form.Label for="id">아이디</Form.Label> <Form.Label for="id">아이디</Form.Label>
<Col> <Col>
<Form.Control type="text" id="id" size="sm" placeholder="ID" className="mx-sm-3"></Form.Control> <Form.Control required type="text" id="id" size="sm" placeholder="ID" className="mx-sm-3"></Form.Control>
<Form.Control.Feedback type="invalid"> 아이디를 입력하세요.</Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
...@@ -54,8 +128,10 @@ function Signup() { ...@@ -54,8 +128,10 @@ function Signup() {
<Form.Label for="password">비밀번호</Form.Label> <Form.Label for="password">비밀번호</Form.Label>
<Col> <Col>
<Form.Control type="password" id="password" size="sm" placeholder="Password"aria-describedby="passwordHelpBlock" className="mx-sm-3"></Form.Control> <Form.Control required type="password" id="password" size="sm" placeholder="Password" aria-describedby="passwordHelpBlock" className="mx-sm-3"></Form.Control>
<Form.Text id="password" muted> 8-15자로 입력해주세요.</Form.Text> <Form.Text id="password" muted> 8-15자로 입력해주세요.</Form.Text>
<Form.Control.Feedback type="invalid"> 비밀번호를 입력하세요.
</Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
...@@ -65,7 +141,9 @@ function Signup() { ...@@ -65,7 +141,9 @@ function Signup() {
<Form.Label for="password2">비밀번호 확인</Form.Label> <Form.Label for="password2">비밀번호 확인</Form.Label>
<Col> <Col>
<Form.Control type="password" id="password2" size="sm" placeholder="" className="mx-sm-3"></Form.Control> <Form.Control required type="password" id="password2" size="sm" placeholder="" className="mx-sm-3"></Form.Control>
<Form.Control.Feedback type="invalid"> 비밀번호를 한번 더 입력하세요.
</Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
...@@ -75,30 +153,30 @@ function Signup() { ...@@ -75,30 +153,30 @@ function Signup() {
<Form.Label for="tel">휴대전화</Form.Label> <Form.Label for="tel">휴대전화</Form.Label>
<Col> <Col>
<Form.Control type="text" id="tel" size="sm" placeholder="" className="mx-sm-3"></Form.Control> <Form.Control required type="text" id="tel" size="sm" placeholder="" className="mx-sm-3"></Form.Control>
<Form.Control.Feedback type="invalid"> 휴대전화를 입력하세요. </Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicAdd"> <Form.Group controlId="formBasicAdd">
<Form.Row> <Form.Row>
<Form.Label>주 소</Form.Label> {console.log("address=", address)}
<Form.Label className="mx-3">주 소</Form.Label>
<Col> <Form.Control required type="text" id="add" size="sm " style={{ width: '120px' }} value={address.zone} disabled={(address.zone == null) ? false : true} ></Form.Control>
<Form.Control type="text" id="add" size="sm" placeholder="상세주소" className="mx-sm-3"></Form.Control> <Button size="sm" style={{ background: '#91877F', borderColor: '#91877F' }} className="mx-3" type="button" onClick={postClick}>주소 찾기</Button>
</Col> {post}
<Form.Control required type="text" id="add" size="sm " value={address.full} disabled={(address.zone == null) ? false : true} className="mx-3"style={{width:'330px'}}></Form.Control>
<Form.Control required type="text" id="add2" size="sm" placeholder="상세주소" className="mx-sm-3"></Form.Control>
<Form.Control.Feedback type="invalid" > 상세 주소를 입력하세요. </Form.Control.Feedback>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Button style={{ background: '#91877F', borderColor: '#91877F' }} type="submit" block>Sign Up</Button>
<Button style={{background:'#91877F', borderColor:'#91877F'}} type="submit" block>Sign Up</Button>
</Form> </Form>
</Col> </Col>
</Row> </Row>
</Container> </Container>
</div> </div>
) )
} }
......
server/package.json
View file @ 40d20e11
...@@ -11,6 +11,9 @@ ...@@ -11,6 +11,9 @@
"author": "", "author": "",
"license": "ISC", "license": "ISC",
"dependencies": { "dependencies": {
"express": "^4.17.1" "express": "^4.17.1",
"mongoose": "^5.11.9",
"nodemon": "^2.0.6",
"validator": "^13.5.2"
} }
} }
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment