Skip to content

GitLab

Commit c20e9d7b authored by Kim, Subin's avatar Kim, Subin
Browse files

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

parents 50c453cb 0a73fd43
Expand all Show whitespace changes
Inline Side-by-side
client/.eslintcache
View file @ c20e9d7b
This diff is collapsed.
client/src/Pages/Home.js
View file @ c20e9d7b
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 { Card, CardDeck, CardColumns, Container, Row } from 'react-bootstrap';
function Home() { function Home() {
...@@ -8,6 +10,102 @@ function Home() { ...@@ -8,6 +10,102 @@ function Home() {
<div> <div>
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<Container>
<div className="my-3">
<h3 ><u>Best</u></h3>
<Row className="justify-content-center">
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
</Row>
</div>
<div className="my-3">
<h3><u>New Arrival</u></h3>
<Row className="justify-content-center">
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
</Row>
</div>
</Container>
</div> </div>
) )
} }
......
client/src/Pages/Payment.js
View file @ c20e9d7b
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 { Container, Card, Row, Col, Button, Form } from 'react-bootstrap';
function Payment() { function Payment() {
const [paymentWay, setPaymentWay] = useState([])
function handleClick() {
if (paymentWay.length !== 0) {
setPaymentWay([])
}
else {
const a = (
<div>
<Form>
<Form.Group controlId="exampleForm.ControlSelect1">
<Form.Label>입금은행</Form.Label>
<Form.Control as="select" placeholder="입금은행을 선택하세요.">
<option>농협 / 352-0559-2528-83 / 김수빈</option>
<option>우리은행 / 0000-000-000000 / 이재연</option>
<option>국민은행 / 111111-11-111111 / 윤대기</option>
</Form.Control>
</Form.Group>
<Form.Group controlId="formName">
<Form.Label>입금자</Form.Label>
<Form.Control type="email" placeholder="윤지원" />
</Form.Group>
<Form.Group controlId="formDay">
<Form.Label>입금예정일</Form.Label>
<Form.Control type="date" />
</Form.Group>
</Form>
</div>)
setPaymentWay(a)
}
}
function handleClick2() {
if (paymentWay.length !== 0) {
setPaymentWay([])
// paymentWay=[]
}
}
return ( return (
<div> <div>
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<Container>
<h3 className="my-5 font-weight-bold text-center" style={{ color: '#F2A400' }}>주문/결제</h3>
<div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문자 정보</h5>
<Form>
<Form.Group controlId="formBasicName">
<Form.Label>이름</Form.Label>
<Form.Control type="text" placeholder="윤지원" />
</Form.Group>
<Form.Group controlId="formBasicEmail">
<Form.Label>이메일</Form.Label>
<Form.Control type="email" placeholder="jiwon5393@naver.com" />
</Form.Group>
<Form.Group controlId="formBasicTel">
<Form.Label>휴대전화</Form.Label>
<Form.Control type="tel" placeholder="010-0000-0000" />
</Form.Group>
</Form>
</div>
<div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">배송지 정보</h5>
</div>
<div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문상품정보</h5>
<Card >
<Row>
<Col className="text-center align-self-center">
<input className="" type="checkbox" id="exampleCheck1"></input>
</Col>
<Col>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" style={{ width: '20rem' }} />
</Col>
<Col>
<Card.Body>
<img 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.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text>
<div>
<Button variant="outline-dark" size="sm">-</Button>
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button>
</div>
</Card.Body>
</Col>
</Row>
</Card>
</div>
<div className="bg-light p-5 m-5">
<ul className="pl-0" style={{ listStyle: 'none' }}>
<li>
<span className="text-secondary">총 상품금액</span>
<span className="text-secondary float-right">12,000원</span>
</li>
<li>
<span className="text-secondary">배송비</span>
<span className="text-secondary float-right">2,500원</span>
</li>
</ul>
<div className="my-1 pt-2 border-top font-weight-bold">
결제금액<span className="float-right">14,500원</span>
</div>
</div>
<div>
<h5 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">결제수단</h5>
<div className="text-center">
<Button variant="success" onClick={handleClick} >무통장입금</Button>
<Button variant="warning" style={{ color: '#ffffff' }} onClick={handleClick2}>카카오페이</Button>
</div>
{paymentWay}
</div>
</Container>
</div> </div>
) )
} }
......
client/src/Pages/ShoppingCart.js
View file @ c20e9d7b
...@@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef } from 'react'; ...@@ -2,6 +2,7 @@ import React, { useState, useEffect, useRef } from 'react';
import { Redirect } from 'react-router-dom'; import { Redirect } from 'react-router-dom';
import MainNav from '../Components/MainNav'; import MainNav from '../Components/MainNav';
import SubNav from '../Components/SubNav'; import SubNav from '../Components/SubNav';
import { Card, Button, Container, Row, Col } from 'react-bootstrap';
function ShoppingCart() { function ShoppingCart() {
...@@ -9,6 +10,75 @@ function ShoppingCart() { ...@@ -9,6 +10,75 @@ function ShoppingCart() {
<div> <div>
<MainNav /> <MainNav />
<SubNav /> <SubNav />
<Container className="justify-content-center">
<h3 className="my-5 font-weight-bold text-center" style={{ color: '#F2A400' }}>장바구니</h3>
<div>
<h4 className="bg-light font-weight-bold py-3 border-top border-bottom text-center">주문상품정보</h4>
<Card >
<Row>
<Col>
<input className="mx-5" type="checkbox" id="exampleCheck1"></input>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" style={{ width: '20rem' }} />
</Col>
<Col md={6}>
<Card.Body>
<img 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.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text>
<Card.Text>수량</Card.Text>
<div>
<Button variant="outline-dark" size="sm">-</Button>
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button>
</div>
</Card.Body>
</Col>
</Row>
</Card>
<Card>
<Row>
<Col>
<input className="mx-5" type="checkbox" id="exampleCheck1"></input>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" style={{ width: '20rem' }} />
</Col>
<Col>
<Card.Body>
<img 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.Text>가격</Card.Text>
<Card.Text>옵션</Card.Text>
<Card.Text>수량</Card.Text>
<div>
<Button variant="outline-dark" size="sm">-</Button>
<input type="text" style={{ width: '30px' }} className="align-middle mx-1" readOnly></input>
<Button variant="outline-dark" size="sm">+</Button>
</div>
</Card.Body>
</Col>
</Row>
</Card>
</div>
<div className="bg-light p-5 m-5">
<ul className="pl-0" style={{ listStyle: 'none' }}>
<li>
<span className="text-secondary">총 상품금액</span>
<span className="text-secondary float-right">12,000원</span>
</li>
<li>
<span className="text-secondary">배송비</span>
<span className="text-secondary float-right">2,500원</span>
</li>
</ul>
<div className="my-1 pt-2 border-top font-weight-bold">
결제금액<span className="float-right">14,500원</span>
</div>
</div>
<div className="text-center">
<Button className="px-5">결제하기</Button>
</div>
</Container>
</div> </div>
) )
} }
......
client/src/index.js
View file @ c20e9d7b
...@@ -5,6 +5,7 @@ import Home from './Pages/Home'; ...@@ -5,6 +5,7 @@ import Home from './Pages/Home';
import Login from './Pages/Login'; import Login from './Pages/Login';
import Signup from './Pages/Signup'; import Signup from './Pages/Signup';
import Admin from './Pages/Admin'; import Admin from './Pages/Admin';
import ProductsRegist from './Pages/ProductsRegist';
import ShoppingCart from './Pages/ShoppingCart'; import ShoppingCart from './Pages/ShoppingCart';
import Payment from './Pages/Payment'; import Payment from './Pages/Payment';
import reportWebVitals from './reportWebVitals'; import reportWebVitals from './reportWebVitals';
...@@ -18,7 +19,9 @@ ReactDOM.render( ...@@ -18,7 +19,9 @@ ReactDOM.render(
<Route path="/login" component={Login} /> <Route path="/login" component={Login} />
<Route path="/signup" component={Signup} /> <Route path="/signup" component={Signup} />
<Route path="/admin" component={Admin} /> <Route path="/admin" component={Admin} />
<Route path="/regist" component={ProductsRegist} />
<Route path="/shoppingcart" component={ShoppingCart} /> <Route path="/shoppingcart" component={ShoppingCart} />
<Route path="/payment" component={Payment} />
<Redirect path="/" to="/" /> <Redirect path="/" to="/" />
</Switch> </Switch>
</Router> </Router>
......
client/yarn.lock 0 → 100644
View file @ c20e9d7b
This diff is collapsed.
server/app.js
View file @ c20e9d7b
// const createError = require('http-errors'); // const createError = require('http-errors');
const express = require('express'); const express = require('express');
const path = require('path'); const path = require('path');
// const cookieParser = require('cookie-parser'); // const cookieParser = require('cookie-parser');
const logger = require('morgan'); // const logger = require('morgan');
const port = 3030; const port = 3030;
// const indexRouter = require('./routes/index'); // const indexRouter = require('./routes/index');
...@@ -18,11 +19,12 @@ const app = express(); ...@@ -18,11 +19,12 @@ const app = express();
app.use(express.json()); app.use(express.json());
app.use(express.urlencoded({ extended: false })); app.use(express.urlencoded({ extended: false }));
// app.use(cookieParser(process.env.JWT_SECRET)); // app.use(cookieParser(process.env.JWT_SECRET));
app.use(express.static(path.join(__dirname, 'public'))); // app.use(express.static(path.join(__dirname, 'public')));
// app.use('/', indexRouter); // app.use('/', indexRouter);
app.listen(port, () => console.log(port)); app.listen(port, () => console.log(port));
// app.listen(3001, () => console.log(port));
// catch 404 and forward to error handler // catch 404 and forward to error handler
app.use(function(req, res, next) { app.use(function(req, res, next) {
......
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