From 9582d04d87b4ec3e34c4fed1bce3366d4cbda2c5 Mon Sep 17 00:00:00 2001 From: roshangarg Date: Fri, 12 Apr 2024 18:03:05 +0530 Subject: [PATCH 1/2] add user is done --- src/routes.js | 6 + src/views/customerDetails/addCustomer.js | 395 +++++++++++++++++++++ src/views/customerDetails/customerTable.js | 6 +- 3 files changed, 404 insertions(+), 3 deletions(-) create mode 100644 src/views/customerDetails/addCustomer.js diff --git a/src/routes.js b/src/routes.js index 5974e37..3722d78 100644 --- a/src/routes.js +++ b/src/routes.js @@ -131,6 +131,7 @@ import CityRevenueCharts from "./views/Charts/CityRevenue"; import { element } from "prop-types"; import OrderdayChart from "./views/Charts/OrderDaywise"; import RevenueCharts from "./views/Charts/RevenueCharts"; +import AddCustomer from "./views/customerDetails/addCustomer"; const routes = [ { path: "/", exact: true, name: "Home" }, { @@ -180,6 +181,11 @@ const routes = [ name: "User Table", element: SingleUserAllDetails, }, + { + path: "/add-customer", + name: "User Table", + element: AddCustomer, + }, // { // path: "/users-address/add", // name: "User Address", diff --git a/src/views/customerDetails/addCustomer.js b/src/views/customerDetails/addCustomer.js new file mode 100644 index 0000000..2f0dc20 --- /dev/null +++ b/src/views/customerDetails/addCustomer.js @@ -0,0 +1,395 @@ +import React, { useState } from "react"; +import { + TextField, + Button, + Card, + FormControl, + Grid, + FormHelperText, + OutlinedInput, + Box, +} from "@mui/material"; +import { useNavigate } from "react-router-dom"; +import toast from "react-hot-toast"; +import axios from "axios"; // Import axios for making HTTP requests +import { isAutheticated } from "src/auth"; +const styles = { + formStyle: { + fontWeight: "700", + fontSize: "12px", + fontFamily: "inter", + marginBottom: "3px", + marginLeft: "0", + }, +}; +const AddCustomer = () => { + const navigate = useNavigate(); + const [user, setUser] = useState({ + name: "", + email: "", + password: "", // No need to initialize password here + }); + const [id, setUserId] = useState(""); + const token = isAutheticated(); + + const [loading, setLoading] = useState(false); + const [data, setData] = useState({ + first_Name: "", + last_Name: "", + phone_Number: Number, + street: "", + city: "", + state: "", + postalCode: "", + country: "", + }); + + // console.log(data); + const handleChange = (e) => { + setData((prev) => ({ ...prev, [e.target.name]: e.target.value })); + }; + + const handerInputChanges = (e) => { + setUser({ ...user, [e.target.name]: e.target.value }); + }; + function handleAddressSubmit(e) { + e.preventDefault(); + if ( + data.first_Name === "" || + data.last_Name === "" || + data.phone_Number === null || + data.street === "" || + data.city === "" || + data.state === "" || + data.postalCode === "" || + data.country === "" + ) { + swal({ + title: "Warning", + text: "Please fill All mendetory fields ", + icon: "warning", + button: "ok", + dangerMode: true, + }); + return; + } + setLoading(true); + axios + .post( + `/api/shipping/address/admin/new/${id}`, + { + ...data, + }, + + { + headers: { + "Access-Control-Allow-Origin": "*", + Authorization: `Bearer ${token}`, + }, + } + ) + .then((res) => { + setLoading(false); + // setSuccess((prev) => !prev); + navigate("/customers-details"); + toast.success(res.data.message ? res.data.message : "Address Added!"); + }) + .catch((error) => { + setLoading(false); + toast.error( + error.response.data.message + ? error.response.data.message + : "Something went wrong!" + ); + }); + } + + // Generate password function + const generatePassword = (name, email) => { + const combinedStr = (name + email).toLowerCase(); // Convert to lowercase for consistency + const specialChars = "@#*"; // Define the set of special characters + const alphaChars = combinedStr.match(/[a-zA-Z]/g); // Filter out alphabetic characters + const filteredChars = combinedStr.match(/[^\W_]/g); // Filter out non-alphanumeric characters + let passwordChars = alphaChars.concat(filteredChars); // Combine alphabetic and filtered characters + + // Insert a random special character at a random position in the password characters array + const specialChar = specialChars.charAt( + Math.floor(Math.random() * specialChars.length) + ); // Pick a random special character + const randomIndex = Math.floor(Math.random() * (passwordChars.length + 1)); // Pick a random position to insert the special character + passwordChars.splice(randomIndex, 0, specialChar); // Insert the special character at the random position + + passwordChars = passwordChars.sort(() => Math.random() - 0.5); // Shuffle the characters + const password = passwordChars.join("").slice(0, 8); // Take the first 8 characters + return password; + }; + const handleFormSubmit = async (e) => { + e.preventDefault(); + try { + if (!user.name || !user.email) { + throw new Error("Fill all fields!"); + } + + // Generate password based on name and email + const generatedPassword = generatePassword(user.name, user.email); + console.log(generatedPassword); // Use generatedPassword instead of generatePassword + setUser({ ...user, password: generatedPassword }); // Set generated password to user state + + const response = await axios.post("/api/v1/user/register", { + ...user, // Send user details + password: generatedPassword, // Send generated password to the backend + }); + if (response.status === 201) { + toast.success("User Added Successful"); + setUserId(response.data.userId); + } + } catch (error) { + console.log(error.response.data.message); + toast.error(error.response.data.message); + } + }; + + console.log(user); + console.log("this is the id ", id); + + return ( +
+ +
+ +
+ +
+ + +
+ + +
+ + + + + + + FIRST NAME* + + handleChange(e)} + + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + LAST NAME* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + PHONE NUMBER* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + STREET ADDRESS* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + + + COUNTRY* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + TOWN CITY* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + + + STATE* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + + ZIP CODE* + + handleChange(e)} + // value={accountDetails.firstname} + // onChange={handerInputChanges} + /> + + + + + + + + +
+
+
+ ); +}; + +export default AddCustomer; diff --git a/src/views/customerDetails/customerTable.js b/src/views/customerDetails/customerTable.js index 448770e..ba6f0fb 100644 --- a/src/views/customerDetails/customerTable.js +++ b/src/views/customerDetails/customerTable.js @@ -131,7 +131,7 @@ const CustomerTable = () => { All Customers - {/*
+
-
*/} +
From 75b5bc7c0e75ce9ce6d4e2d15d0ebd7b80e5790c Mon Sep 17 00:00:00 2001 From: pawan-dot <71133473+pawan-dot@users.noreply.github.com> Date: Mon, 15 Apr 2024 14:55:54 +0530 Subject: [PATCH 2/2] product section change --- src/views/Products/AddProduct.js | 772 ++++----- src/views/Products/EditProduct.js | 1444 +++++++++++------ .../Productcomponents/ProductDetails.js | 244 +++ .../Productcomponents/ProductImages.js | 302 ++++ .../Productcomponents/ProductVarients.js | 249 +++ src/views/Products/Products.js | 14 +- src/views/Products/ViewProduct.js | 309 ++-- 7 files changed, 2183 insertions(+), 1151 deletions(-) create mode 100644 src/views/Products/Productcomponents/ProductDetails.js create mode 100644 src/views/Products/Productcomponents/ProductImages.js create mode 100644 src/views/Products/Productcomponents/ProductVarients.js diff --git a/src/views/Products/AddProduct.js b/src/views/Products/AddProduct.js index aac06b3..bb79edd 100644 --- a/src/views/Products/AddProduct.js +++ b/src/views/Products/AddProduct.js @@ -1,214 +1,182 @@ -import React, { useEffect, useState } from "react"; -import Button from "@material-ui/core/Button"; -import { Link, useNavigate } from "react-router-dom"; -import swal from "sweetalert"; +import React, { useState, useEffect } from "react"; +import { Button } from "@mui/material"; import axios from "axios"; -import { isAutheticated } from "src/auth"; -import CloudUploadIcon from "@mui/icons-material/CloudUpload"; -import DeleteSharpIcon from "@mui/icons-material/DeleteSharp"; +// import { API } from "src/API"; +// import { isAutheticated } from "../../components/auth/authhelper"; +import { Link, useNavigate } from "react-router-dom"; import { - Box, - FormControl, - IconButton, - MenuItem, - Select, - TextField, -} from "@mui/material"; -// import { WebsiteURL } from '../WebsiteURL' + CCard, + CCardBody, + CCardGroup, + CCol, + CContainer, + CRow, +} from "@coreui/react"; +import ProductDetails from "./Productcomponents/ProductDetails.js"; +import ProductVarients from "./Productcomponents/ProductVarients.js"; +import ProductsImages from "./Productcomponents/ProductImages.js"; +import { isAutheticated } from "src/auth.js"; +// import ReleventProduct from "./Productcomponents/ReleventProduct"; +// import ProductFabric from "./Productcomponents/ProductFabric.js"; const AddProduct = () => { const token = isAutheticated(); + const [productId, setProductId] = useState(""); + const [viewState, setViewState] = useState(1); + const [images, setImages] = useState([]); + const [categories, setCategories] = useState([]); + const [taxes, setTaxes] = useState([]); + const [sizes, setSizes] = useState([]); + const [relevantProduct, setRelevantProduct] = useState([]); + const [allreleventSelectedProduct, setallReleventSelectedProduct] = useState( + [] + ); + const navigate = useNavigate(); - const [loading, setLoading] = useState(false); - const [allTax, setAllTax] = useState([]); - const [categories, setCategoies] = useState([]); - const [imagesPreview, setImagesPreview] = useState([]); - // const [allimage, setAllImage] = useState([]); - const [name, setName] = useState(""); - const [description, setDescription] = useState(""); - const [productImages, setProductImages] = useState([]); - const [price, setPrice] = useState(0); - const [category, setCategoryName] = useState(""); - const [error, setError] = useState(""); - const [selectedTax, setselectedTax] = useState(); - const [product_Status, setproduct_Status] = useState(""); - const [totalAmt, setTotalAmt] = useState(0); - const [gst_amount, setGst_amount] = useState(0); + const [data, setData] = useState({ + name: "", + category: "", + // sku: "", + description: "", + master_price: "", + // discontinue_on: "", + // hsn_code: "", + product_Status: "", - const handleFileChange = (e) => { - const files = e.target.files; + special_instructions: "", + // productImages.length == 0 || + // gst_amount === "" || + // price === "" || + // totalAmt === "" || + // gst_amount === "" || + }); - // Check the total number of selected files - if (productImages.length + files.length > 4) { - setError("You can only upload up to 4 images."); - return; - } + const [varients, setVarients] = useState([ + { + variant_Name: "", + weight: "", + volume: "", + price: "", - // Check file types and append to selectedFiles - const allowedTypes = ["image/jpeg", "image/png", "image/jpg"]; - const selected = []; + gst_Id: "", + }, + { + variant_Name: "", + weight: "", + volume: "", + price: "", - for (let i = 0; i < files.length; i++) { - if (productImages.length + selected.length >= 4) { - break; // Don't allow more than 4 images - } + gst_Id: "", + }, - if (allowedTypes.includes(files[i].type)) { - selected.push(files[i]); - } - } + { + variant_Name: "", + weight: "", + volume: "", + price: "", - if (selected.length === 0) { - setError("Please upload only PNG, JPEG, or JPG files."); - } else { - setError(""); - setProductImages([...productImages, ...selected]); - } - }; - - const handelDelete = (image) => { - const filtered = productImages.filter((item) => item !== image); - setProductImages(filtered); - }; - // get All categories - const getCategories = async () => { - try { - const response = await axios.get("/api/category/getCategories", { - headers: { - Authorization: `Bearer ${token}`, - }, - }); - - if (response.status === 200) { - setCategoies(response?.data?.categories); - } - } catch (error) { - swal({ - title: error, - text: " please login to access the resource ", - icon: "error", - button: "Retry", - dangerMode: true, - }); - } - }; - // Get all tax - const getAllTax = async () => { - const res = await axios.get(`/api/tax/view_tax`, { - headers: { - "Access-Control-Allow-Origin": "*", - Authorization: `Bearer ${token}`, - }, - }); - if (res.data) { - setAllTax(res.data); - } - }; - useEffect(() => { - getAllTax(); - getCategories(); - }, [token]); - const TaxRatechange = async (e) => { - let m = JSON.parse(e.target.value); - if (m?.tax) { - let totalprice = Number(price) + Number((price * m?.tax) / 100); - setGst_amount(Number((price * m?.tax) / 100)?.toFixed(2)); - setTotalAmt(totalprice?.toFixed(2)); - setselectedTax(m?._id); - } - }; - - const handleSubmit = () => { - if ( - name === "" || - description === "" || - productImages.length == 0 || - category === "" || - selectedTax === "" || - gst_amount === "" || - product_Status === "" || - price === "" - ) { - swal({ - title: "Warning", - text: "Fill all mandatory fields", - icon: "error", - button: "Close", - dangerMode: true, - }); - return; - } - setLoading(true); - const formData = new FormData(); - formData.append("name", name); - - formData.append("description", description); - formData.append("price", price); - formData.append("category", category); - formData.append("total_amount", totalAmt); - formData.append("gst_amount", gst_amount); - formData.append("product_Status", product_Status); - - formData.append("gst", selectedTax); - - productImages.forEach((Singleimage) => { - // console.log(Singleimage) - formData.append("image", Singleimage); - }); + gst_Id: "", + }, + ]); + const [allFabrics, setAllFabrics] = useState([]); + const [fabrics, setFabrics] = useState([ + { _id: "", fabric_Name: "", for_Part: "" }, + { _id: "", fabric_Name: "", for_Part: "" }, + { _id: "", fabric_Name: "", for_Part: "" }, + ]); + const getCategories = () => { axios - .post(`/api/product/create/`, formData, { + .get(`/api/category/getCategories`, { headers: { - Authorization: `Bearer ${token}`, - "Content-Type": "multipart/formdata", "Access-Control-Allow-Origin": "*", + Authorization: `Bearer ${token}`, }, }) .then((res) => { - swal({ - title: "Added", - text: "Product added successfully!", - icon: "success", - button: "ok", - }); + setCategories(res?.data?.categories); setLoading(false); - navigate("/products", { replace: true }); }) .catch((err) => { setLoading(false); - const message = err.response?.data?.message - ? err.response?.data?.message - : "Something went wrong!"; - swal({ - title: "Warning", - text: message, - icon: "error", - button: "Retry", - dangerMode: true, - }); }); }; - const handlePriceChange = (e) => { - const newPrice = e.target.value; - setPrice(newPrice); - const selectedTaxObj = allTax.find((t) => t._id === selectedTax); - if (selectedTaxObj && !isNaN(newPrice)) { - const gstAmount = (newPrice * selectedTaxObj.tax) / 100; - const totalAmount = Number(newPrice) + gstAmount; - - setGst_amount(gstAmount.toFixed(2)); - setTotalAmt(totalAmount.toFixed(2)); - } + const getTaxes = () => { + axios + .get(`/api/tax/view_tax`, { + headers: { + "Access-Control-Allow-Origin": "*", + Authorization: `Bearer ${token}`, + }, + }) + .then((res) => { + setTaxes(res.data); + }); }; - // console.log(data); - // console.log(productImages); + + // const getSizes = () => { + // axios + // .get(`/api/erp/sizemaster/size`, { + // headers: { + // "Access-Control-Allow-Origin": "*", + // Authorization: `Bearer ${token}`, + // }, + // }) + // .then((res) => { + // setSizes(res.data?.data); + // }); + // }; + // const getItemWhichcontaiNameFabric = () => { + // axios + // .get(`/api/erp/item/name_contain_fabric`, { + // headers: { + // "Access-Control-Allow-Origin": "*", + // Authorization: `Bearer ${token}`, + // }, + // }) + // .then((res) => { + // console.log(res?.data); + // // setSizes(res.data?.data) + // setAllFabrics(res?.data?.data); + // }) + // .catch((err) => { + // console.log(err); + // }); + // }; + + // const getProductsData = async () => { + // axios + // .get(`/api/product`, { + // headers: { + // Authorization: `Bearer ${token}`, + // }, + // }) + // .then((res) => { + // setRelevantProduct(res.data?.data); + // }) + // .catch((err) => { + // console.log(err); + // }); + // }; + useEffect(() => { + getCategories(); + getTaxes(); + // getSizes(); + // getProductsData(); + // getItemWhichcontaiNameFabric(); + }, []); + const handleView = (n) => { + if (viewState === n) return; + setViewState(n); + }; + return ( -
-
-
+ + +
- Add Product + Add Product : {data?.name && data?.name}
-
-

-
-
-
-
-
-
-
-
-
-
- - setName(e.target.value)} - /> - {name ? ( - <> - - {35 - name.length} characters left - - - ) : ( - <> - )}{" "} -
- -
- -