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

.gitignore

-node_modules
\ No newline at end of file

client/src/App.js

@@ -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 (
@@ -43,7 +39,6 @@ function App() {
         </Switch>
       </Router>
     </div>
-
   )
 
 

client/src/Pages/Product.js

@@ -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

@@ -5,8 +5,8 @@ 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,16 +95,20 @@ 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])
+            if (key === "main_image" ||key === "detail_image") {
+                console.log(product[key][0])
+                formData.append(key, product[key][0])
+            } else {
+                formData.append(key, product[key])
+            }
         }
-        console.log("formData=", formData)
-        console.log(product)
         try {
-            const response = axios.post('/api/product/regist', { data: formData })
-            setSuccess(true)
+            const response = axios.post('/api/product/regist', formData)
+            // setSuccess(true)
             console.log(response)
         } catch (error) {
             catchErrors(error, setError)
@@ -161,19 +164,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 +183,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

@@ -6,6 +6,20 @@ import { Container, Row, Col, Form, FormControl, Button, Card, Dropdown } from '
 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,11 +40,11 @@ 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>

server/.gitignore

 node_modules
-package-lock.json
\ No newline at end of file
+package-lock.json
+uploads/
\ No newline at end of file

server/controllers/product.controller.js

 import Product from "../schemas/Product.js";
+import multer from 'multer';
+
+
+const upload = multer({ dest: 'uploads/' });
+
+const fileUpload = upload.fields([
+    { name: 'main_image', maxCount: 1 },
+    { name: 'detail_image', maxCount: 1 }
+])
 
 const regist = async (req, res) => {
     console.log('req.body=', req.body)
-    const { pro_name, price, stock, main_category, sub_category, description, main_image, detail_image } = req.body
+    const { pro_name, price, stock, main_category, sub_category, colors, sizes, description } = req.body
+    console.log(req.files)
+    const main_image = req.files['main_image'][0].filename
+    console.log(main_image)
+    const detail_image = req.files['detail_image'][0].filename
     try {
-        const newProduct = await new Product ({
-            pro_name, price, stock, main_category, sub_category, description, main_image, detail_image
+        const newProduct = await new Product({
+            pro_name, price, stock, main_category, sub_category, colors, sizes, description, main_image, detail_image
         }).save()
         res.json(newProduct)
     } catch (error) {
@@ -14,4 +27,9 @@ const regist = async (req, res) => {
     }
 }
 
-export default { regist }
\ No newline at end of file
+
+const getProduct = (req, res) => {
+    res.json(req.body)
+}
+
+export default { regist, fileUpload, getProduct }
\ No newline at end of file

server/routes/product.routes.js

 import express from "express";
-import path from 'path';
-import multer from 'multer';
 import productCtrl from '../controllers/product.controller.js';
-import fs from 'fs'
 
-// process.cwd() + '/client/public/image'
 
 const router = express.Router()
 
-fs.readdir('uploads', (error, data) => {
-    if (error) {
-        fs.mkdirSync('uploads');
-        if (data == undefined) {
-          fs.mkdirSync('/main')
-          fs.mkdirSync('/detail')
-        }
-    } else console.log("else data",data)
-  })
-
-const upload = multer({
-    storage: multer.diskStorage({
-        destination(req, file, cb) {
-            cb(null, 'uploads/');
-        }, // 저장 경로 변경
-        filename(req, file, cb) {
-            cb(null, new Date().valueOf() + path.extname(file.originalname));
-        }, // 파일명 변경
-     }),
-});
-
 router.route('/regist')
-    .post(productCtrl.regist)
-// upload.array('main_image'), 
+    .post(productCtrl.fileUpload, productCtrl.regist)
+router.route('/productone')
+    .get(productCtrl.getProduct)
+    
 export default router
\ No newline at end of file

server/schemas/Product.js

@@ -20,11 +20,11 @@ const ProductSchema = new mongoose.Schema({
         required: true,
         default: 0
     },
-    size: {
+    sizes: {
         type: Array,
         required: true
     },
-    color: {
+    colors: {
         type: Array,
         required: true
     },
@@ -41,11 +41,11 @@ const ProductSchema = new mongoose.Schema({
         required: true,
     },
     main_image: {
-        type: String,
+        type: Array,
         required: true,
     },
     detail_image: {
-        type: String,
+        type: Array,
         required: true,
     }
 }, {