Skip to content

GitLab

Commit 8f4248c2 authored by Kim, Subin's avatar Kim, Subin
Browse files

Merge remote-tracking branch 'origin/jiwon' into ourMaster

parents 44ca0ecc 46a0dc89
Show whitespace changes
Inline Side-by-side
client/.gitignore
View file @ 8f4248c2
...@@ -22,4 +22,7 @@ npm-debug.log* ...@@ -22,4 +22,7 @@ npm-debug.log*
yarn-debug.log* yarn-debug.log*
yarn-error.log* yarn-error.log*
package-lock.json package-lock.json
.eslintcache .eslintcache
.yarn.lock
client/src/Pages/Login.js
View file @ 8f4248c2
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(){
...@@ -22,14 +22,10 @@ function Login(){ ...@@ -22,14 +22,10 @@ function Login(){
<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 noValidate validated={validated} onSubmit={handleSubmit} className="p-5"> <Form noValidate validated={validated} onSubmit={handleSubmit} className="p-5">
<Form.Group controlId="formBasicId"> <Form.Group controlId="formBasicId">
<Form.Row> <Form.Row>
<Col sm={4} xs={6} as={Form.Label} for="id"> 아이디</Col> <Col sm={4} xs={6} as={Form.Label} for="id"> 아이디</Col>
...@@ -65,14 +61,8 @@ function Login(){ ...@@ -65,14 +61,8 @@ function Login(){
</Form> </Form>
</Col> </Col>
</Row> </Row>
</Container> </Container>
</div> </div>
) )
} }
......
client/src/Pages/Payment.js
View file @ 8f4248c2
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import MainNav from '../Components/MainNav'; import MainNav from '../Components/MainNav';
import SubNav from '../Components/SubNav'; import SubNav from '../Components/SubNav';
import DaumPostcode from "react-daum-postcode";
import { Container, Card, Row, Col, Button, Form } from 'react-bootstrap'; import { Container, Card, Row, Col, Button, Form } from 'react-bootstrap';
function Payment() { function Payment() {
const [paymentWay, setPaymentWay] = useState([]) const [paymentWay, setPaymentWay] = useState([])
const [isAddress, setIsAddress] = useState("");
const [isZoneCode, setIsZoneCode] = useState();
const [isPostOpen, setIsPostOpen] = useState();
const [post, setPost] = useState([])
function postClick() {
if (post.length !== 0) {
setPost([])
}
else {
setPost(
<div>
<DaumPostcode style={postCodeStyle} onComplete={handleComplete} />
</div>
)
}
}
const handleComplete = (data) => {
let fullAddress = data.address;
let extraAddress = "";
if (data.addressType === "R") {
if (data.bname !== "") {
extraAddress += data.bname;
}
if (data.buildingName !== "") {
extraAddress +=
extraAddress !== "" ? `, ${data.buildingName}` : data.buildingName;
}
fullAddress += extraAddress !== "" ? ` (${extraAddress})` : "";
}
setIsZoneCode(data.zonecode);
setIsAddress(fullAddress);
setIsPostOpen(false);
};
const postCodeStyle = {
display: "block",
position: "absolute",
// top: "50%",
width: "400px",
height: "500px",
padding: "7px",
};
function handleClick() { function handleClick() {
if (paymentWay.length !== 0) { if (paymentWay.length !== 0) {
setPaymentWay([]) setPaymentWay([])
} }
...@@ -48,9 +95,9 @@ function Payment() { ...@@ -48,9 +95,9 @@ function Payment() {
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<Container> <Container>
<h3 className="my-5 font-weight-bold text-center" style={{ color: '#F2A400' }}>주문/결제</h3> <h3 className="my-5 font-weight-bold text-center">주문/결제</h3>
<div> <div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문자 정보</h5> <h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문자 정보</h5>
<Form> <Form>
<Form.Group controlId="formBasicName"> <Form.Group controlId="formBasicName">
<Form.Label>이름</Form.Label> <Form.Label>이름</Form.Label>
...@@ -69,11 +116,18 @@ function Payment() { ...@@ -69,11 +116,18 @@ function Payment() {
</div> </div>
<div> <div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">배송지 정보</h5> <h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>배송지 정보</h5>
<Row>
<Col>
<Button className="my-3" style={{ background: "#91877F", borderColor: '#91877F' }} onClick={postClick}>우편번호</Button>
</Col>
</Row>
{post}
</div> </div>
<div> <div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문상품정보</h5> <h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문상품정보</h5>
<Card > <Card >
<Row> <Row>
<Col className="text-center align-self-center"> <Col className="text-center align-self-center">
...@@ -89,10 +143,10 @@ function Payment() { ...@@ -89,10 +143,10 @@ function Payment() {
<Card.Title className="font-weight-bold mt-3">제품명</Card.Title> <Card.Title className="font-weight-bold mt-3">제품명</Card.Title>
<Card.Text>가격</Card.Text> <Card.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text> <Card.Text>옵션</Card.Text>
<div> <div className="align-items-center" >
<Button variant="outline-dark" size="sm">-</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/minus-math.png" />
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input> <input type="text" placeholder="1" style={{ width: '30px' }} className="text-center align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/plus-math.png" />
</div> </div>
</Card.Body> </Card.Body>
</Col> </Col>
...@@ -100,7 +154,7 @@ function Payment() { ...@@ -100,7 +154,7 @@ function Payment() {
</Card> </Card>
</div> </div>
<div className="bg-light p-5 m-5"> <div className="p-5 m-5" style={{ background: '#F7F3F3' }}>
<ul className="pl-0" style={{ listStyle: 'none' }}> <ul className="pl-0" style={{ listStyle: 'none' }}>
<li> <li>
<span className="text-secondary">총 상품금액</span> <span className="text-secondary">총 상품금액</span>
...@@ -117,7 +171,7 @@ function Payment() { ...@@ -117,7 +171,7 @@ function Payment() {
</div> </div>
<div> <div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">결제수단</h5> <h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>결제수단</h5>
<div className="text-center"> <div className="text-center">
<Button variant="success" onClick={handleClick} >무통장입금</Button> <Button variant="success" onClick={handleClick} >무통장입금</Button>
<Button variant="warning" style={{ color: '#ffffff' }} onClick={handleClick2}>카카오페이</Button> <Button variant="warning" style={{ color: '#ffffff' }} onClick={handleClick2}>카카오페이</Button>
......
client/src/Pages/ProductsRegist.js
View file @ 8f4248c2
...@@ -5,15 +5,15 @@ import { Row, Col, Button, Form, Container } from 'react-bootstrap'; ...@@ -5,15 +5,15 @@ import { Row, Col, Button, Form, Container } from 'react-bootstrap';
function ProductsRegist() { function ProductsRegist() {
return ( return (
<div> <div>
<Nav1 /> <Nav1 />
<Nav2 /> <Nav2 />
<Container> <Container>
<Row className="justify-content-md-center"> <Row className="justify-content-md-center">
<Col md={6} className="border m-5 p-3"> <Col md={6} className="border m-5 p-3" style={{background:'#F7F3F3'}}>
<Form > <h2 className="text-center mt-5 font-weight-bold">상품등록</h2>
<Form className="p-5">
<Form.Group controlId="productNameform"> <Form.Group controlId="productNameform">
<Form.Label>상품명</Form.Label> <Form.Label>상품명</Form.Label>
<Form.Control type="text" placeholder="상품명" /> <Form.Control type="text" placeholder="상품명" />
...@@ -53,7 +53,7 @@ function ProductsRegist() { ...@@ -53,7 +53,7 @@ function ProductsRegist() {
<Form.Label>대표이미지</Form.Label> <Form.Label>대표이미지</Form.Label>
<Form.File id="productImageform" /> <Form.File id="productImageform" />
</Form.Group> </Form.Group>
<Button className="float-right" variant="primary" type="submit">등록</Button> <Button className="float-right" variant="primary" type="submit" style={{background:'#91877F', borderColor:'#91877F'}}>등록</Button>
</Form> </Form>
</Col> </Col>
</Row> </Row>
......
client/src/Pages/ShoppingCart.js
View file @ 8f4248c2
...@@ -10,10 +10,10 @@ function ShoppingCart() { ...@@ -10,10 +10,10 @@ function ShoppingCart() {
<div> <div>
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<div className="justify-content-center"> <Container className="justify-content-center">
<h3 className="my-5 font-weight-bold text-center" style={{ color: '#F2A400' }}>장바구니</h3> <h3 className="my-5 font-weight-bold text-center">장바구니</h3>
<div> <div>
<h4 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문상품정보</h4> <h4 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>주문상품정보</h4>
<Card > <Card >
<Row> <Row>
<Col> <Col>
...@@ -22,15 +22,15 @@ function ShoppingCart() { ...@@ -22,15 +22,15 @@ function ShoppingCart() {
</Col> </Col>
<Col md={6}> <Col md={6}>
<Card.Body> <Card.Body>
<img src="https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png" className="float-right" /> <input type="image" src="https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png" className="float-right" />
<Card.Title className="font-weight-bold mt-3">제품명</Card.Title> <Card.Title className="font-weight-bold mt-3">제품명</Card.Title>
<Card.Text>가격</Card.Text> <Card.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text> <Card.Text>옵션</Card.Text>
<Card.Text>수량</Card.Text> <Card.Text>수량</Card.Text>
<div> <div>
<Button variant="outline-dark" size="sm">-</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/minus-math.png" />
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input> <input type="text" placeholder="1" style={{ width: '30px' }} className="text-center align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/plus-math.png" />
</div> </div>
</Card.Body> </Card.Body>
</Col> </Col>
...@@ -44,22 +44,22 @@ function ShoppingCart() { ...@@ -44,22 +44,22 @@ function ShoppingCart() {
</Col> </Col>
<Col> <Col>
<Card.Body> <Card.Body>
<img src="https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png" className="float-right" /> <input type="image" src="https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png" className="float-right" />
<Card.Title className="font-weight-bold mt-3">제품명</Card.Title> <Card.Title className="font-weight-bold mt-3">제품명</Card.Title>
<Card.Text>가격</Card.Text> <Card.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text> <Card.Text>옵션</Card.Text>
<Card.Text>수량</Card.Text> <Card.Text>수량</Card.Text>
<div> <div className="align-items-center" >
<Button variant="outline-dark" size="sm">-</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/minus-math.png" />
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input> <input type="text" placeholder="1" style={{ width: '30px' }} className="text-center align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button> <input type="image" src="https://img.icons8.com/ios-glyphs/20/000000/plus-math.png" />
</div> </div>
</Card.Body> </Card.Body>
</Col> </Col>
</Row> </Row>
</Card> </Card>
</div> </div>
<div className="bg-light p-5 m-5"> <div className="p-5 m-5" style={{background:'#F7F3F3'}}>
<ul className="pl-0" style={{ listStyle: 'none' }}> <ul className="pl-0" style={{ listStyle: 'none' }}>
<li> <li>
<span className="text-secondary">총 상품금액</span> <span className="text-secondary">총 상품금액</span>
...@@ -75,9 +75,9 @@ function ShoppingCart() { ...@@ -75,9 +75,9 @@ function ShoppingCart() {
</div> </div>
</div> </div>
<div className="text-center"> <div className="text-center">
<Button className="px-5">결제하기</Button> <Button className="px-5" style={{ background: "#91877F", borderColor: '#91877F' }} href="/payment">결제하기</Button>
</div>
</div> </div>
</Container>
</div> </div>
) )
......
client/src/Pages/Signup.js
View file @ 8f4248c2
...@@ -78,22 +78,16 @@ function Signup() { ...@@ -78,22 +78,16 @@ function Signup() {
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={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 noValidate validated={validated} onSubmit={handleSubmit} 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 <Form.Control
required required
...@@ -116,7 +110,6 @@ function Signup() { ...@@ -116,7 +110,6 @@ function Signup() {
****** ******
<Form.Control.Feedback type="invalid">주민등록번호를 입력하세요.</Form.Control.Feedback> <Form.Control.Feedback type="invalid">주민등록번호를 입력하세요.</Form.Control.Feedback>
</Col> </Col>
</Form.Row> </Form.Row>
</Form.Group> </Form.Group>
<Form.Group controlId="formBasicId"> <Form.Group controlId="formBasicId">
...@@ -178,16 +171,12 @@ function Signup() { ...@@ -178,16 +171,12 @@ function Signup() {
<Form.Control.Feedback type="invalid" > 상세 주소를 입력하세요. </Form.Control.Feedback> <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>
) )
} }
......
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