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

client/src/App.js

@@ -16,7 +16,6 @@ import SubNav from './Components/SubNav';
 
 function App() {
 
-
   return (
     <Router>
       <MainNav />

client/src/Pages/Home.js

@@ -3,6 +3,9 @@ import { Card, Container, Row } from 'react-bootstrap';
 
 
 function Home() {
+    
+
+
     return (
         <div>
             <Container className="my-5">

client/src/Pages/ProductRegist.js

 import React, { useState, useEffect, useRef } from 'react';
-import { Row, Col, Button, Form, Container } from 'react-bootstrap';
-import axios from 'axios'
+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';
 
@@ -22,15 +23,7 @@ function ProductsRegist() {
         main_image: [],
         detail_image: []
     }
-    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 [categorys, setCategorys] = useState({ 0: [], 1: [[]] })
     const [product, setProduct] = useState(INIT_PRODUCT)
     const [categoryNum, setCategoryNum] = useState(0)
     const [tag, setTag] = useState(0)
@@ -38,8 +31,15 @@ function ProductsRegist() {
     const [success, setSuccess] = useState(false)
     const [checked, setChecked] = useState({ "Free": false, "XL": false, "L": false, "M": false, "S": false, "XS": false })
 
-    const mainCategorys = Object.keys(categorys)
-    const subCategorys = Object.values(categorys)
+    useEffect(async () => {
+        try {
+            const response = await axios.get('/api/categorys')
+            const data = response.data[0]
+            setCategorys([Object.keys(data), Object.values(data)])
+        } catch (error) {
+            catchErrors(error, setError)
+        }
+    }, [])
 
     function addCategory() {
         console.log(product)
@@ -50,12 +50,13 @@ function ProductsRegist() {
             </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)
+        product["sub_category"].splice(categ.firstElementChild.getAttribute("i"), 1)
     }
+
     function handleCheckBox(e) {
         setChecked({ ...checked, [e.target.value]: !checked[`${e.target.value}`] })
     }
@@ -65,17 +66,18 @@ function ProductsRegist() {
         colorHtml.push(
             <p>{color["colors"]}</p>
         )
-        setProduct({...product, "colors":preColors})
+        setProduct({ ...product, "colors": preColors })
     }
 
-    function colorChange(e){
-        color[e.target.name]= e.target.value
+    function colorChange(e) {
+        color[e.target.name] = e.target.value
     }
 
     function handleChange(event) {
         const { name, value, files } = event.target
-        if (event.target.name === "sub_category") {
-            product["sub_category"].push(event.target.value)
+        console.log("event.target.name=", name, "event.target.value=", value)
+        if (name === "sub_category") {
+            product[name].push(value)
         } else if (files) {
             setProduct({ ...product, [name]: files })
 
@@ -95,8 +97,7 @@ function ProductsRegist() {
                 sizes.push(key)
             }
         }
-        product["sizes"]=sizes
-        console.log(product)
+        product["sizes"] = sizes
         const formData = new FormData();
         for (let key in product) {
             if (key === "main_image" ||key === "detail_image") {
@@ -118,11 +119,12 @@ function ProductsRegist() {
     if (success) {
         return <Redirect to='/' />
     }
+
     return (
-        <div>
-            <Container>
+        <Container className="mt-5">
             <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">
@@ -143,7 +145,7 @@ function ProductsRegist() {
                                 <Col md={4}>
                                     <Form.Control as="select" name="main_category" onChange={handleChange}>
                                         <option value="" >상위분류</option>
-                                            {mainCategorys.map((main) => (
+                                        {categorys[0].map((main) => (
                                             <option value={main}>{main}</option>
                                         ))}
                                     </Form.Control>
@@ -151,7 +153,7 @@ function ProductsRegist() {
                                 <Col md={6}>
                                     <Form.Control as="select" name="sub_category" onChange={handleChange}>
                                         <option value="" >하위분류</option>
-                                            {subCategorys[categoryNum].map((sub) => (
+                                        {categorys[1][categoryNum].map((sub) => (
                                             <option value={sub}>{sub}</option>
                                         ))}
                                     </Form.Control>
@@ -203,7 +205,6 @@ function ProductsRegist() {
                 </Col>
             </Row>
         </Container>
-        </div>
     )
 }
 

client/src/Pages/ProductsList.js

@@ -52,6 +52,7 @@ function ProductsList(props) {
 
     return (
         <div>
+            {console.log("match.params=",props.match.params.product)}
             <style type="text/css">
                 {`
                 .btn {
@@ -97,7 +98,7 @@ function ProductsList(props) {
                     <ListCard productlist={productlist} />
                 </Row>
             </Container>
-            <Pagination />
+            {/* <Pagination postsPerPage={postsPerPage} totalPosts={posts.length} paginate={paginate} /> */}
         </div>
     )
 }

client/src/Pages/Signup.js

@@ -44,8 +44,6 @@ function Signup() {
         }
     }
 
-
-
     function checkPassword(event) {
         const p1 = user.password
         const p2 = user.password2

server/app.js

 import express from 'express';
 import fs from 'fs';
-import connectDb from './schemas/index.js'
+import connectDb from './schemas/index.js';
+import categoryRouter from "./routes/category.routes.js";
 import userRouter from "./routes/user.routes.js";
 import productRouter from './routes/product.routes.js';
 import cartRouter from './routes/cart.routes.js';
@@ -19,9 +20,7 @@ fs.readdir('uploads', (error) => {
 connectDb()
 
 const app = express();
-
-app.use(express.json());
-
+app.use(express.json())
 app.use(cors())
 app.use(express.static(path.join(process.cwd(), 'dist')))
 // app.use(bodyParser.urlencoded({ extended: true }))
@@ -29,6 +28,7 @@ app.use('/images', express.static('uploads/'))
 
 // app.use('/', indexRouter);
 app.use('/', kakaopayRoutes)
+app.use('/api/categorys',categoryRouter)
 app.use('/api/users',userRouter)
 app.use('/api/auth',authRouter)
 app.use('/api/product', productRouter)

server/controllers/category.controller.js

+import Category from "../schemas/Category.js";
+
+const getCategory = async (req, res) => {
+    try {
+        const category = await Category.find({}, {_id: 0})
+        res.json(category)
+    } catch (error) {
+        console.log(error)
+        res.status(500).send('카테고리 검색 실패')
+    }
+}
+
+export default { getCategory }
\ No newline at end of file

server/controllers/product.controller.js

@@ -9,8 +9,9 @@ const imageUpload = upload.fields([
   ])
 
 const regist = async (req, res) => {
+    console.log("req.body=",req.body)
     try {
-        const { pro_name, price, stock, main_category, sub_category, description } = req.body
+        const { pro_name, price, stock, main_category, sub_category, description, colors, sizes } = req.body
         const main_img = req.files['main_image'][0]
         const detail_img = req.files['detail_image']
         const main_imgUrl = main_img.filename
@@ -19,7 +20,7 @@ const regist = async (req, res) => {
             detail_imgUrls.push(file.filename)
         })
         const newProduct = await new Product({
-            pro_name, price, stock, main_category, sub_category, description, main_imgUrl, detail_imgUrls
+            pro_name, price, stock, main_category, sub_category, description, main_imgUrl, detail_imgUrls, colors, sizes
         }).save()
         res.json(newProduct)
     } catch (error) {

server/routes/category.routes.js

+import express from "express";
+import categoryCtrl from "../controllers/category.controller.js";
+
+const router = express.Router()
+
+router.route('/')
+    .get(categoryCtrl.getCategory)
+
+export default router
\ No newline at end of file

server/schemas/Category.js

+import mongoose from 'mongoose'
+
+const { Array } = mongoose.Schema.Types
+
+const CategorysSchema = new mongoose.Schema ({
+    "DRESS": {
+        type: Array,
+        required: true
+    },
+    "OUTER": {
+        type: Array,
+        required: true
+    },
+    "TOP": {
+        type: Array,
+        required: true
+    },
+    "PANTS": {
+        type: Array,
+        required: true
+    },
+    "SKIRT": {
+        type: Array,
+        required: true
+    },
+    "TRAINING": {
+        type: Array,
+        required: true
+    },
+    "SHOES": {
+        type: Array,
+        required: true
+    },
+})
+
+export default mongoose.models.Categorys || mongoose.model('Categorys', CategorysSchema)
\ No newline at end of file