Skip to content

GitLab

Commit 6c4d3ee8 authored by Jiwon Yoon's avatar Jiwon Yoon
Browse files

product DB연결 및 상품등록페이지 수정

parent 3ba7cf83
Hide whitespace changes
Inline Side-by-side
client/src/Components/MainNav.js
View file @ 6c4d3ee8
......@@ -16,7 +16,7 @@ function MainNav() {
<img src={logo} width="24" height="24" />
{' '}KU#
</Navbar.Brand>
<Nav className="justify-content-end">
<Nav className="float-right">
<Nav.Link className="text-light" href="/login">Login</Nav.Link>
<Nav.Link className="text-light" href="/signup">Signup</Nav.Link>
<Nav.Link href="/shoppingcart">
......
client/src/Components/SubNav.js
View file @ 6c4d3ee8
......@@ -22,7 +22,7 @@ function SubNav() {
}
return (
<Navbar sticky="top" className="flex-nowrap" style={{ top: "62px", paddingTop: "0", paddingBottom: "0", backgroundColor: "#fff", overflowX: "auto"}}>
<Navbar sticky="top" className="flex-nowrap" style={{ top: "62px", paddingTop: "0", paddingBottom: "0", backgroundColor: "#fff", overflowX: "auto" }}>
<style type="text/css">
{`
.nav-link, .nav-link:hover, .nav-link:active {
......@@ -50,6 +50,7 @@ function SubNav() {
}
`}
</style>
<Nav>
<NavDropdown title="DRESS" onMouseEnter={() => handleMouseEnter("dress")} onMouseLeave={() => handleMouseLeave("dress")} show={toggle.dress} toggle={() => handleToggle("dress")} onClick={() => handleClick("/dress")}>
<NavDropdown.Item href="/dress/long">LONG DRESS</NavDropdown.Item>
......
client/src/Pages/Payment.js
View file @ 6c4d3ee8
......@@ -112,9 +112,9 @@ function Payment() {
total_amount: 22000,
vat_amount: 200,
tax_free_amount: 0,
approval_url: 'http://localhost:3000/kakaopay/success',
fail_url: 'http://localhost:3000/kakaopay/fail',
cancel_url: 'http://localhost:3000/kakaopay/cancel',
approval_url: 'http://localhost:3000/account',
fail_url: 'http://localhost:3000/shoppingcart',
cancel_url: 'http://localhost:3000/kakaopay/payment',
})
})
const data = await response.json()
......
client/src/Pages/ProductsRegist.js
View file @ 6c4d3ee8
......@@ -4,33 +4,95 @@ import Nav2 from '../Components/SubNav';
import { Row, Col, Button, Form, Container } from 'react-bootstrap';
import axios from 'axios'
let list = []
function ProductsRegist() {
const [product, setProduct] = useState()
const INIT_PRODUCT = {
pro_name: '',
price: 0,
stock: 0,
main_category: '',
sub_category: [],
description: '',
main_image: [],
detail_image: []
}
const [product, setProduct] = useState(INIT_PRODUCT)
const [categoryNum, setCategoryNum] = useState(0)
const [tag, setTag] = useState(0)
const categorys = {
"DRESS": ["LONG DRESS", "SHORT DRESS", "KNIT DRESS", "SHIRT DRESS", "PATTERN DRESS", "BUSTIER DRESS", "TWO-PIECE DRESS"],
"OUTER": ["PADDED JACKET", "JACKET", "JUMPER", "COAT", "FLEECE", "CARDIGAN / VEST"],
"TOP": ["KNIT", "HOODY", "BLOUSE", "SHIRT", "SWEATSHIRT", "LONG SLEEVE SHIRT", "SHORT SLEEVE / SLEEVELESS SHIRT"],
"PANTS": ["JEANS", "SKINNY JEANS", "BANDING PANTS", "WIDE-FIT PANTS", "BOOT-CUT PANTS", "STRAIGHT-FIT PANTS", "SHORTS", "TROUSERS", "LEGGINGS", "JUMPSUIT / OVERALLS"],
"SKIRT": ["LONG SKIRT", "MIDI SKIRT", "MINI SKIRT"],
"TRAINING": [],
"SHOES": ["SNEAKERS / SLIP-ON", "FLAT / LOAFER", "HEEL / PUMP", "BOOTS", "SANDAL / SLIPPER"]
}
const mainCategorys = Object.keys(categorys)
const subCategorys = Object.values(categorys)
const
function addCategory() {
console.log(product)
list.push(
<div>
<span i={tag}>{product["main_category"]} / {product["sub_category"][tag]}</span>
<input type="image" src="https://img.icons8.com/fluent-systems-regular/24/000000/close-window.png" className="float-right align-middle" onClick={deleteCategory} />
</div>)
setTag(tag + 1)
}
function deleteCategory(e) {
const categ = e.target.parentNode
categ.remove()
product["sub_category"].splice(e.target.parentNode.firstElementChild.getAttribute("i"),1)
console.log(product)
}
function handleChange(event) {
const { name, value } = event.target
setProduct({ ...product, [name]: value })
if (event.target.name === "sub_category") {
product["sub_category"].push(event.target.value)
} else {
setProduct({ ...product, [name]: value })
}
if (event.target.name === "main_category") {
setCategoryNum(event.target.selectedIndex)
}
}
function handleSubmit(e) {
async function handleSubmit(e) {
e.preventDefault()
axios.post('/api/products/regist', {
product
}).then(function(res) {
console.log("client의 res=", res)
})
}
try{
setError('')
await axios.post('/api/products/regist', {
product
}).then(function (res) {
console.log("client의 res=", res)
})
alert("상품등록이 완료되었습니다.")
setSuccess(true)
}catch(error) {
catchErrors(error, setError)
}
}
if (success) {
return <Redirect to='/' />
}
return (
<div>
{console.log(product)}
<Nav1 />
<Nav2 />
<Container>
<Container className="vh-100">
<Row className="justify-content-md-center">
<Col md={6} className="border m-5 p-3" style={{ background: '#F7F3F3' }}>
<Col md={8} className="border p-1" style={{ background: '#F7F3F3' }}>
<h2 className="text-center mt-5 font-weight-bold">상품등록</h2>
<Form className="p-5" onSubmit={handleSubmit}>
<Form.Group controlId="productNameform">
......@@ -48,21 +110,25 @@ function ProductsRegist() {
<Form.Group>
<Form.Label>분류</Form.Label>
<Row>
<Col md={6}>
<Col md={4}>
<Form.Control as="select" name="main_category" placeholder="상위분류" onChange={handleChange}>
<option>Pants</option>
<option>Skirt</option>
<option>Outer</option>
{mainCategorys.map((main) => (
<option value={main}>{main}</option>
))}
</Form.Control>
</Col>
<Col md={6}>
<Form.Control as="select" name="sub_category" placeholder="하위분류" onChange={handleChange}>
<option>JEANS</option>
<option>SKINNY JEANS</option>
<option>BANDING PANTS</option>
{subCategorys[categoryNum].map((sub) => (
<option value={sub}>{sub}</option>
))}
</Form.Control>
</Col>
<Col md={2}>
<Button style={{ background: '#91877F', borderColor: '#91877F' }} onClick={addCategory}>추가</Button>
</Col>
</Row>
{list.map((element) => element)}
</Form.Group>
<Form.Group controlId="productDescriptionform">
<Form.Label>상품설명</Form.Label>
......@@ -76,7 +142,7 @@ function ProductsRegist() {
<Form.Label>상세이미지</Form.Label>
<Form.File id="productImageform" name="detail_image" onChange={handleChange} />
</Form.Group>
<Button className="float-right" variant="primary" type="submit" style={{ background: '#91877F', borderColor: '#91877F' }}>등록</Button>
<Button className="float-right" type="submit" style={{ background: '#91877F', borderColor: '#91877F' }}>등록</Button>
</Form>
</Col>
</Row>
......
server/schemas/Product.js
View file @ 6c4d3ee8
......@@ -25,7 +25,7 @@ const ProductSchema = new mongoose.Schema({
required: true,
},
sub_category: {
type: String,
type: Array,
required: true,
},
description: {
......
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