Skip to content

GitLab

Commit df51efcd authored by 이재연's avatar 이재연
Browse files

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

parents 98bc3e3a e7e1d3d1
Hide whitespace changes
Inline Side-by-side
.gitignore deleted 100644 → 0
View file @ 98bc3e3a
node_modules
\ No newline at end of file
client/src/App.js
View file @ df51efcd
......@@ -15,10 +15,6 @@ import SubNav from './Components/SubNav';
function App() {
// const [user,setUser]=useState(null);
// const authenticated =user !=null;
// const login =({id, password}) => setUser(signIn({id,password}));
// const logout=()=>setUser(null);
return (
......@@ -42,7 +38,6 @@ function App() {
</Switch>
</Router>
</div>
)
......
client/src/Components/Card.js
View file @ df51efcd
import React, { useState, useEffect, useRef } from 'react';
function Card() {
function card(props) {
const [card, setCard] = useState([...props])
return (
<div></div>
<Card className="mt-5">
<Card.Img varient="top" src={} style={{ objectFit: "contain", height: "22rem" }}></Card.Img>
<Card.Body>
<Card.Title></Card.Title>
<Card.Text></Card.Text>
<Card.Text></Card.Text>
</Card.Body>
</Card>
)
}
export default Card
\ No newline at end of file
export default card
\ No newline at end of file
client/src/Components/MainNav.js
View file @ df51efcd
import React from 'react';
import { Navbar, Nav } from 'react-bootstrap';
import logo from '../footprint.svg';
import cart from '../cart.svg';
import option from '../option.svg';
import { handleLogout, isAuthenticated } from '../utils/auth'
function MainNav() {
......@@ -11,7 +8,7 @@ function MainNav() {
return (
<Navbar sticky="top" style={{ background: "#CDC5C2" }}>
<Navbar.Brand href="/home" className="text-light">
<img alt="로고" src={logo} width="24" height="24" />
<img alt="로고" src="icon/footprint.svg" width="24" height="24" />
{' '}KU#
</Navbar.Brand>
<Nav>
......@@ -23,10 +20,10 @@ function MainNav() {
</>
)}
<Nav.Link href="/shoppingcart">
<img alt="카트" src={cart} width="30" height="30" />
<img alt="카트" src="icon/cart.svg" width="30" height="30" />
</Nav.Link>
<Nav.Link href="/admin">
<img alt="관리자" src={option} width="30" height="30" />
<img alt="관리자" src="icon/option.svg" width="30" height="30" />
</Nav.Link>
</Nav>
</Navbar>
......
client/src/Pages/Admin.js
View file @ df51efcd
import React, { useState, useEffect, useRef } from 'react';
import Pagination from '../Components/Pagination';
import search from '../search.svg';
import { Row, Form, FormControl, Button, Card, Container } from 'react-bootstrap';
function Admin() {
......@@ -33,7 +32,7 @@ function Admin() {
<Row as={Form} onSubmit={handleSubmit} className="justify-content-end mx-0 my-5">
<FormControl type="text" placeholder="Search" style={{ width: "13rem" }} />
<Button type="submit" className="px-2">
<img src={search} width="20" height="20" />
<img src="icon/search.svg" width="20" height="20" />
</Button>
<Button sm={2} xs={6} type="button" href="/regist" className="ml-1">상품 등록</Button>
</Row>
......
client/src/Pages/Home.js
View file @ df51efcd
......@@ -10,42 +10,42 @@ function Home() {
<h2 style={{ marginRight: "5rem", marginLeft: "3rem", marginBottom: "2rem" }}><u>Best</u></h2>
<Row className="justify-content-center mx-0">
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
......@@ -57,42 +57,42 @@ function Home() {
<h2 style={{ marginRight: "5rem", marginLeft: "3rem", marginBottom: "2rem", marginTop: "2rem" }}><u>New Arrival</u></h2>
<Row className="justify-content-center mx-0">
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
</Card.Body>
</Card>
<Card className="mx-1 my-2" style={{ width: '18rem' }}>
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" />
<Card.Body>
<Card.Title className="font-weight-bold">제품명</Card.Title>
<Card.Text>가격</Card.Text>
......
client/src/Pages/Payment.js
View file @ df51efcd
......@@ -254,7 +254,7 @@ function Payment() {
<h5 className="font-weight-bold py-3 border-top border-bottom text-center" style={{ background: '#F7F3F3' }}>결제수단</h5>
<div className="text-center mt-5">
<Button variant="success" className="align-top" onClick={handleClick} >무통장입금</Button>
<input type="image" alt="카카오페이결제" src="img/payment_icon_yellow_small.png" onClick={kakaopay} />
<input type="image" alt="카카오페이결제" src="icon/payment_icon_yellow_small.png" onClick={kakaopay} />
</div>
{paymentWay}
</div>
......
client/src/Pages/Product.js
View file @ df51efcd
......@@ -4,10 +4,23 @@ import { Row, Col, Form, Card, Button } from 'react-bootstrap';
import catchErrors from '../utils/catchErrors';
function Product() {
const [product, setProduct] = useState()
const [select, setSelect] = useState({ color: "", size: "" })
const [cart, setCart] = useState()
const [error, setError] = useState('')
async function getProduct(user){
console.log(user)
try {
const response = await axios.get('/api/product/productone')
setProduct(response.data)
console.log(response.data)
} catch (error) {
catchErrors(error, setError)
}
}
function handleClick(e) {
const box = e.target.parentNode.parentNode
box.style.display = "none"
......@@ -73,10 +86,12 @@ function Product() {
useEffect(() => {
handleCreate()
getProduct()
}, [cart])
return (
<div>
{/* {getProduct} */}
<style type="text/css">
{`
.btn {
......
client/src/Pages/ProductRegist.js
View file @ df51efcd
import React, { useState, useEffect, useRef } from 'react';
import { Row, Col, Button, Form, Container } from 'react-bootstrap';
import { Redirect } from 'react-router-dom';
import { Row, Col, Button, Form, Container, Alert } from 'react-bootstrap';
import axios from 'axios'
import catchErrors from '../utils/catchErrors';
import { Redirect } from 'react-router-dom';
let color = {}
let colors = []
let addedcolors = []
let preColors = []
let colorHtml = []
let list = []
function ProductsRegist() {
......@@ -16,8 +16,8 @@ function ProductsRegist() {
stock: 0,
main_category: '',
sub_category: [],
size: [],
color: [],
sizes: [],
colors: [],
description: '',
main_image: [],
detail_image: []
......@@ -61,25 +61,24 @@ function ProductsRegist() {
}
function addColor() {
addedcolors.push(
<div>{color["color"]}</div>
preColors.push(color["colors"])
colorHtml.push(
<p>{color["colors"]}</p>
)
if (product.color) {
setProduct({ ...product, [color]: colors })
} else {
setProduct({ ...product, "color": colors })
}
setProduct({...product, "colors":preColors})
}
function colorChange(e){
color[e.target.name]= e.target.value
}
function handleChange(event) {
const { name, value } = event.target
const { name, value, files } = event.target
if (event.target.name === "sub_category") {
product["sub_category"].push(event.target.value)
} else if (event.target.name === "color") {
color[event.target.name] = event.target.value
// console.log(color)
} else if (files) {
setProduct({ ...product, [name]: files })
} else {
setProduct({ ...product, [name]: value })
}
......@@ -96,17 +95,33 @@ function ProductsRegist() {
sizes.push(key)
}
}
product["size"].push(sizes)
product["sizes"]=sizes
console.log(product)
const formData = new FormData();
for (let key in product) {
formData.append(key, product[key])
for (const key in product) {
console.log("product[key]=", product[key])
if (key == "main_image" || key == "detail_image") {
for (const file of product[key]) {
formData.append(key, file)
}
} else {
formData.append(key, product[key])
}
}
console.log("formData=", formData)
console.log(product)
// formData 값 확인용
// for (const key of formData.keys()) {
// console.log("key=",key);
// }
// for (const value of formData.values()) {
// console.log(value);
// }
try {
const response = axios.post('/api/product/regist', { data: formData })
setSuccess(true)
console.log(response)
const response = await axios.post('/api/product/regist', formData)
} catch (error) {
catchErrors(error, setError)
}
......@@ -120,6 +135,7 @@ function ProductsRegist() {
<Container>
<Row className="justify-content-md-center">
<Col md={8} className="border p-1" style={{ background: '#F7F3F3' }}>
{error && <Alert variant="danger" className="text-center">{error}</Alert>}
<h2 className="text-center mt-5 font-weight-bold">상품등록</h2>
<Form className="p-5" onSubmit={handleSubmit}>
<Form.Group controlId="productNameform">
......@@ -161,19 +177,18 @@ function ProductsRegist() {
</Form.Group>
<Form.Group>
<Form.Label>사이즈</Form.Label>
{/* {console.log(checked)} */}
<Form.Check type="checkbox" name="size" label="Free" value="Free" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="size" label="XL" value="XL" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="size" label="L" value="L" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="size" label="M" value="M" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="size" label="S" value="S" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="size" label="XS" value="XS" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="Free" value="Free" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="XL" value="XL" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="L" value="L" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="M" value="M" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="S" value="S" onChange={handleCheckBox} />
<Form.Check type="checkbox" name="sizes" label="XS" value="XS" onChange={handleCheckBox} />
</Form.Group>
<Form.Group>
<Form.Label>색상</Form.Label>
<Row>
<Col md={10}>
<Form.Control as="textarea" rows={1} name="color" placeholder="색상" onChange={handleChange} />
<Form.Control as="textarea" rows={1} name="colors" placeholder="색상" onChange={colorChange} />
</Col>
<Col>
......@@ -181,7 +196,7 @@ function ProductsRegist() {
<Button className="float-right" style={{ background: '#91877F', borderColor: '#91877F' }} onClick={addColor}>추가</Button>
</Col>
</Row>
{addedcolors.map((element) => element)}
{colorHtml.map((element) => element)}
</Form.Group>
<Form.Group controlId="productDescriptionform">
......
client/src/Pages/ProductsList.js
View file @ df51efcd
import React, { useState, useEffect, useRef } from 'react';
import Pagination from '../Components/Pagination';
import search from '../search.svg';
import { Container, Row, Col, Form, FormControl, Button, Card, Dropdown } from 'react-bootstrap';
function ProductsList() {
const [sub, setSub] = useState(['PADDED JACKET', 'JACKET', 'JUMPER', 'COAT', 'FLEECE', 'CARDIGAN / VEST'])
// useEffect(() => {
// getProfile(user)
// }, [user])
// async function getProfile(user){
// console.log(user)
// try {
// const response = await axios.get(`/api/users/profile/${user}`)
// setProfile(response.data)
// } catch (error) {
// catchErrors(error, setError)
// }
// }
function handleSubmit(e) {
e.preventDefault()
}
......@@ -26,29 +39,31 @@ function ProductsList() {
`}
</style>
<Container>
<Row >
<Col sm={10} xs={12}>
<Row className="justify-content-center" >
<Col sm={10} xs={12} >
<h1 style={{ fontSize: "3rem" }} className="text-center">OUTER</h1>
<div>{sub.map((ele) => (
<Button className="justify-content-center m-1">{ele}</Button>
<div className="text-center">{sub.map((ele) => (
<Button className="m-1">{ele}</Button>
))}</div>
</Col>
</Row>
<Row className="justify-content-between mx-0 my-5">
<Form as={Row} onSubmit={handleSubmit} className="justify-content-end mx-0">
<Dropdown>
<Dropdown.Toggle className="mx-2">정렬</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Item>인기상품</Dropdown.Item>
<Dropdown.Item>신상품</Dropdown.Item>
<Dropdown.Item>낮은가격</Dropdown.Item>
<Dropdown.Item>높은가격</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<FormControl type="text" placeholder="Search" style={{ width: "13rem" }} />
<Button type="submit" className="search px-2 mb-1 ">
<img src={search} width="20" height="20" />
</Button>
<Dropdown.Toggle className="mx-2">정렬</Dropdown.Toggle>
<Dropdown.Menu>
<Dropdown.Item>인기상품</Dropdown.Item>
<Dropdown.Item>신상품</Dropdown.Item>
<Dropdown.Item>낮은가격</Dropdown.Item>
<Dropdown.Item>높은가격</Dropdown.Item>
</Dropdown.Menu>
</Dropdown>
<Form as={Row} onSubmit={handleSubmit} className="justify-content-end mx-0">
<FormControl type="text" placeholder="Search" style={{ width: "13rem" }} />
<Button type="submit" className="search px-2">
<img src="icon/search.svg" width="20" height="20" />
</Button>
</Form>
</Form>
</Row>
<Row md={8} sm={12} className="justify-content-start m-2">
......
client/src/Pages/ShoppingCart.js
View file @ df51efcd
......@@ -4,7 +4,6 @@ import { Card, Button, Container, Row, Col } from 'react-bootstrap';
import axios from 'axios';
function ShoppingCart() {
const [num, setNum] = useState(0)
function plusNum() {
......@@ -41,7 +40,7 @@ function ShoppingCart() {
<input className="" type="checkbox" id="exampleCheck1" />
</Col>
<Col className="text-center">
<Card.Img className="img-fluid" variant="top" src="img/asd.jpg" style={{ width: '20rem' }} />
<Card.Img className="img-fluid" variant="top" src="icon/asd.jpg" style={{ width: '20rem' }} />
</Col>
<Col md={6} className="p-2">
<Card.Body>
......
client/src/Pages/Signup.js
View file @ df51efcd
......@@ -14,7 +14,7 @@ const INIT_USER = {
}
function Signup() {
const [user, setUser] = useState(true)
const [user, setUser] = useState(INIT_USER)
const [error, setError] = useState('')
const [success, setSuccess] = useState(false)
const [validated, setValidated] = useState(false);
......@@ -24,11 +24,9 @@ function Signup() {
setUser({ ...user, [name]: value })
}
async function handleSubmit(event) {
event.preventDefault()
const form = event.currentTarget;
console.log(form)
if (form.checkValidity() === false) {
event.preventDefault();
event.stopPropagation();
......
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