color picker added and some bugs are fixed

Repo/Components/adminPanel/productPanel/productAddForm/addProduct.js

@@ -14,8 +14,10 @@ const addProduct = async (
 
     form.append('Name', Name);
     form.append('Description', Description);
-    form.append('Types', Types);
-    form.append('Categorys', Categorys);
+
+    form.append("Types", JSON.stringify(Types))
+    form.append("Categorys", JSON.stringify(Categorys))
+
     form.append("MainImage", MainImage);
     form.append("Gallery", Gallery);
     axios({

Repo/Components/adminPanel/productPanel/productAddForm/addType.jsx

@@ -1,4 +1,5 @@
 import React, { useState } from "react";
+import { HexColorPicker } from "react-colorful";
 
 export default function AddType({ add }) {
   const [Name, setName] = useState();
@@ -7,7 +8,8 @@ export default function AddType({ add }) {
   const [Inventory, setInventory] = useState();
 
   return (
-    <div className="typeForm">
+    <div style={{ borderColor: Color }} className="typeForm">
+      <HexColorPicker color={Color} onChange={setColor} />
       <input
         defaultValue={Name}
         onChange={(e) => setName(e.target.value)}
@@ -20,19 +22,58 @@ export default function AddType({ add }) {
         placeholder="قیمت"
         type="text"
       />
-      <input
+      {/* <input
         defaultValue={Color}
         onChange={(e) => setColor(e.target.value)}
         placeholder="رنگ"
         type="text"
-      />
+      /> */}
       <input
         defaultValue={Inventory}
         onChange={(e) => setInventory(parseInt(e.target.value))}
         placeholder="تعداد در انبار"
         type="number"
       />
       <span onClick={() => add(Name, Price, Color, Inventory)}>ADD</span>
+      <style jsx>{`
+        .typeForm {
+          width: 14vw;
+          height: 55vh;
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: space-between;
+          padding: 1rem;
+          border: 3px solid;
+          border-radius: 1rem;
+        }
+        .typeForm input {
+          width: 100%;
+          font-size: 1.3rem;
+          padding: 0.5rem;
+          border: 1px solid gray;
+          border-radius: 1rem;
+          text-align: right;
+        }
+        .typeForm input:focus {
+          outline: rgb(7, 255, 139) 2px solid;
+          border: none;
+        }
+        .typeForm span {
+          font-size: 1.5rem;
+          cursor: pointer;
+          padding: 0.4rem 1.5rem;
+          border-radius: 10px;
+          transition: all 0.2s linear;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+        }
+        .typeForm span:hover {
+          color: white;
+          background-color: black;
+        }
+      `}</style>
     </div>
   );
 }

Repo/Services/ProductService.js

@@ -1,38 +1,51 @@
-import { PrismaClient, Prisma } from '@prisma/client'
+import { PrismaClient } from '@prisma/client'
 import { AddTypeAsync } from '../methode/TypeMethodes'
 import { AddCategoryAsync } from '../methode/CategoryMethodes'
-import { ProductImageUpload } from './UploadImage'
-
+import { IncomingForm } from 'formidable'
+import fs from 'fs'
 
 const prisma = new PrismaClient()
 
 export const AddProductAsync = async (req, res, next) => {
-    // const { Name, Description, MainImage, Types, Categorys, Gallery } = req.body
-
-    let exist = await prisma.Product.findMany({
-        where: {
-            Name,
-        }
-    })
+    const form = new IncomingForm();
+    form.parse(req, async function (err, fields, files) {
+        let { Name, Description, Types, Categorys } = fields
+        Types = JSON.parse(Types)
+        Categorys = JSON.parse(Categorys)
 
-    if (!exist[0]) {
-        let product = await prisma.Product.create({
-            data: {
+        let exist = await prisma.Product.findMany({
+            where: {
                 Name,
-                Description,
-                MainImage,
             }
         })
 
-        ProductImageUpload(req)
+        if (!exist[0]) {
+            let MainImage = await saveFile(files.MainImage);
+            let product = await prisma.Product.create({
+                data: {
+                    Name,
+                    Description,
+                    MainImage,
+                }
+            })
+            Types.map(async T => await AddTypeAsync(T, product.Product_Id))
+            Categorys.map(async C => await AddCategoryAsync(C, product.Product_Id))
 
-        Types.map(async T => await AddTypeAsync(T, product.Product_Id))
-        Categorys.map(async C => await AddCategoryAsync(C, product.Product_Id))
+            return product;
+        }
+    })
 
-        return product;
-    }
     return "there is another product with this name";
 }
+
+const saveFile = async (file) => {
+    const oldPath = file.filepath;
+    let newPath = `./public/${file.originalFilename}`
+    fs.rename(oldPath, newPath, function (err) { })
+    return newPath;
+};
+
+
 export const UpdateProductAsync = async (req, res, next) => {
     const { Product_Id, Name, Description, MainImage } = req.body
 
@@ -59,4 +72,4 @@ export const DeletProductAsync = async (req, res, next) => {
     })
 
     return product;
-}
+}