From d7dcbb3c43b566f6b8375109966d55b25e9b1333 Mon Sep 17 00:00:00 2001 From: print-signs Date: Fri, 1 Dec 2023 18:50:02 +0530 Subject: [PATCH 1/6] updated the add address code --- src/views/configuration/Address.js | 9 +- src/views/configuration/Logo.js | 430 +++++++++++++++-------------- 2 files changed, 234 insertions(+), 205 deletions(-) diff --git a/src/views/configuration/Address.js b/src/views/configuration/Address.js index ab02706..e639604 100644 --- a/src/views/configuration/Address.js +++ b/src/views/configuration/Address.js @@ -76,16 +76,21 @@ function Address() { contact, email, }; + let res = await axios.post(`/api/config/address`, data, { headers: { Authorization: `Bearer ${token}`, }, }); + console.log(res); if (res) { setLoading(false); - console.log(res); - swal("Success!", res.data.message, res.data.status); + + swal("Success!", res.data.message); + } else { + setLoading(false); + swal("something went wrong!", res.data.message); } } diff --git a/src/views/configuration/Logo.js b/src/views/configuration/Logo.js index 362cc1a..2bd89d9 100644 --- a/src/views/configuration/Logo.js +++ b/src/views/configuration/Logo.js @@ -1,222 +1,246 @@ -import React, { useEffect, useState } from 'react' +import React, { useEffect, useState } from "react"; -import swal from 'sweetalert' -import ClipLoader from 'react-spinners/ClipLoader' -import { Link } from 'react-router-dom' -import axios from 'axios' -import { isAutheticated } from 'src/auth' +import swal from "sweetalert"; +import ClipLoader from "react-spinners/ClipLoader"; +import { Link } from "react-router-dom"; +import axios from "axios"; +import { isAutheticated } from "src/auth"; function Logo() { - const [loading, setLoading] = useState(false) - const [Headerlogo, setHeaderlogo] = useState('') - const [Footerlogo, setFooterlogo] = useState('') - const [Adminlogo, setAdminlogo] = useState('') - const [display, setDisplay] = useState(true) - const token = isAutheticated() + const [loading, setLoading] = useState(false); + const [Headerlogo, setHeaderlogo] = useState(""); + const [Footerlogo, setFooterlogo] = useState(""); + const [Adminlogo, setAdminlogo] = useState(""); + const [display, setDisplay] = useState(true); + const token = isAutheticated(); - // urlcreated images + // urlcreated images - const [HeaderlogoUrl, setHeaderlogoUrl] = useState('') - const [FooterlogoUrl, setFooterlogoUrl] = useState('') - const [AdminlogoUrl, setAdminlogoUrl] = useState('') + const [HeaderlogoUrl, setHeaderlogoUrl] = useState(""); + const [FooterlogoUrl, setFooterlogoUrl] = useState(""); + const [AdminlogoUrl, setAdminlogoUrl] = useState(""); - useEffect(() => { - async function getConfiguration() { - const configDetails = await axios.get(`/api/config`, { - headers: { - Authorization: `Bearer ${token}`, - }, - }) + useEffect(() => { + async function getConfiguration() { + const configDetails = await axios.get(`/api/config`, { + headers: { + Authorization: `Bearer ${token}`, + }, + }); - configDetails.data.result.map((item) => { - setHeaderlogo(item?.logo[0]?.Headerlogo) - setFooterlogo(item?.logo[0]?.Footerlogo) - setAdminlogo(item?.logo[0]?.Adminlogo) - }) - } - getConfiguration() - }, []) - - // async function handelChange(e) { - // setDisplay(false); - // console.log(e.target.name === "Logo htmlFor Website Header(148 x 48 px)"); - // if (e.target.name === "Logo htmlFor Website Header(148 x 48 px)") { - // console.log(e.target.files[0]); - // setHeaderlogo(e.target.files[0]); - // } else if (e.target.name === "Logo htmlFor Website Footer(148 x 48 px)") { - // setFooterlogo(e.target.files[0]); - // } else if (e.target.name === "Logo htmlFor Admin Header(148 x 48 px)") { - // setAdminlogo(e.target.files[0]); - // } - // } - - async function handelSubmit() { - setLoading(true) - - const formdata = new FormData() - formdata.append('Headerlogo', Headerlogo) - formdata.append('Footerlogo', Footerlogo) - formdata.append('Adminlogo', Adminlogo) - - await axios.post(`/api/config/logo`, formdata, { - headers: { - Authorization: `Bearer ${token}`, - 'Content-Type': 'multipart/formdata', - 'Access-Control-Allow-Origin': '*', - }, - }).then((res) => { - setLoading(false) - swal('Success!', res.data.message, res.data.status) - } - ).catch(error => { - console.log(error) - }) + configDetails.data.result.map((item) => { + setHeaderlogo(item?.logo[0]?.Headerlogo); + setFooterlogo(item?.logo[0]?.Footerlogo); + setAdminlogo(item?.logo[0]?.Adminlogo); + }); } + getConfiguration(); + }, []); - return ( -
-
-
-
-
+ // async function handelChange(e) { + // setDisplay(false); + // console.log(e.target.name === "Logo htmlFor Website Header(148 x 48 px)"); + // if (e.target.name === "Logo htmlFor Website Header(148 x 48 px)") { + // console.log(e.target.files[0]); + // setHeaderlogo(e.target.files[0]); + // } else if (e.target.name === "Logo htmlFor Website Footer(148 x 48 px)") { + // setFooterlogo(e.target.files[0]); + // } else if (e.target.name === "Logo htmlFor Admin Header(148 x 48 px)") { + // setAdminlogo(e.target.files[0]); + // } + // } + + async function handelSubmit() { + setLoading(true); + + const formdata = new FormData(); + formdata.append("Headerlogo", Headerlogo); + formdata.append("Footerlogo", Footerlogo); + formdata.append("Adminlogo", Adminlogo); + + await axios + .post(`/api/config/logo`, formdata, { + headers: { + Authorization: `Bearer ${token}`, + "Content-Type": "multipart/formdata", + "Access-Control-Allow-Origin": "*", + }, + }) + .then((res) => { + setLoading(false); + swal("Success!", res.data.message, res.data.status); + }) + .catch((error) => { + console.log(error); + }); + } + + return ( +
+
+
+
+
+
+
+
+
+
+

Logo

+ +
+
-
-
-
-
-

Logo

+
+ <> + +
+ { + setHeaderlogo(e.target.files[0]); + if ( + e.target.files && + e.target.files[0] + ) { + setHeaderlogoUrl({ + image: URL.createObjectURL( + e.target.files[0] + ), + }); + console.log(setHeaderlogoUrl); + } + }} + className="form-control input-field mb-3 col-md-6 d-inline-block" + id="basicpill-phoneno-input" + /> + {display ? ( + header logo + ) : ( + "" + )} +
+ + { + setFooterlogo(e.target.files[0]); - -
-
-
- <> - -
- { - setHeaderlogo(e.target.files[0]) - if (e.target.files && e.target.files[0]) { - setHeaderlogoUrl({ - image: URL.createObjectURL(e.target.files[0]), - }) - console.log(setHeaderlogoUrl) - } - }} - className="form-control input-field mb-3 col-md-6 d-inline-block" - id="basicpill-phoneno-input" - /> - {display ? ( - header logo - ) : ( - '' - )} -
- - { - setFooterlogo(e.target.files[0]) + if (e.target.files && e.target.files[0]) { + setFooterlogoUrl({ + image: URL.createObjectURL( + e.target.files[0] + ), + }); + } + }} + className="form-control input-field mt-1 col-md-6 d-inline-block" + id="basicpill-phoneno-input" + />{" "} + {display ? ( + Footer logo + ) : ( + "" + )} + + { + setAdminlogo(e.target.files[0]); - if (e.target.files && e.target.files[0]) { - setFooterlogoUrl({ - image: URL.createObjectURL(e.target.files[0]), - }) - } - }} - className="form-control input-field mt-1 col-md-6 d-inline-block" - id="basicpill-phoneno-input" - />{' '} - {display ? ( - Footer logo - ) : ( - '' - )} - - { - setAdminlogo(e.target.files[0]) - - if (e.target.files && e.target.files[0]) { - setAdminlogoUrl({ - image: URL.createObjectURL(e.target.files[0]), - }) - } - }} - className="form-control input-field col-md-6 d-inline-block" - id="basicpill-phoneno-input" - />{' '} - {display ? ( - Admin logo - ) : ( - '' - )} - -
-
-
-
-
-
- -
-
-
- -
-
- - {/* */} -
-
+ if (e.target.files && e.target.files[0]) { + setAdminlogoUrl({ + image: URL.createObjectURL( + e.target.files[0] + ), + }); + } + }} + className="form-control input-field col-md-6 d-inline-block" + id="basicpill-phoneno-input" + />{" "} + {display ? ( + Admin logo + ) : ( + "" + )} + +
-
+
+
+
+
+ +
+
+
+ +
- {/* */} + + {/* */} +
- {/* */} +
+
+ {/* */}
- ) + {/* */} +
+
+ ); } -export default Logo +export default Logo; From 3eb24add8b0f28d446c6bd51a2b1958d8f113760 Mon Sep 17 00:00:00 2001 From: print-signs Date: Tue, 5 Dec 2023 13:37:44 +0530 Subject: [PATCH 2/6] updated address section --- package.json | 2 +- src/views/configuration/Address.js | 56 +++++++++++++++++++++++++++++- 2 files changed, 56 insertions(+), 2 deletions(-) diff --git a/package.json b/package.json index 434b89e..7491c06 100644 --- a/package.json +++ b/package.json @@ -13,7 +13,7 @@ "license": "MIT", "author": "The CoreUI Team (https://github.com/orgs/coreui/people)", "scripts": { - "dev": "react-scripts start", + "dev": "SET NODE_OPTIONS=--openssl-legacy-provider && react-scripts start", "build": "react-scripts build", "build:n17": "react-scripts --openssl-legacy-provider build", "changelog": "auto-changelog --starting-version 4.1.0 --commit-limit false --hide-credit", diff --git a/src/views/configuration/Address.js b/src/views/configuration/Address.js index e639604..d82590c 100644 --- a/src/views/configuration/Address.js +++ b/src/views/configuration/Address.js @@ -18,6 +18,8 @@ function Address() { const [website, setWebsite] = useState(""); const [contact, setContact] = useState(""); const [email, setEmail] = useState(""); + const [latitude, setLatitude] = useState(""); + const [longitude, setLongitude] = useState(""); useEffect(() => { async function getConfiguration() { @@ -37,6 +39,8 @@ function Address() { setWebsite(el.website); setContact(el.contact); setEmail(el.email); + setLatitude(el.latitude); + setLongitude(el.longitude); }); }); } @@ -61,10 +65,30 @@ function Address() { setContact(e.target.value); } else if (e.target.name.toLowerCase() === "email") { setEmail(e.target.value); + } else if (e.target.name.toLowerCase() === "latitude") { + setLatitude(e.target.value); + } else if (e.target.name.toLowerCase() === "longitude") { + setLongitude(e.target.value); } } async function handelSubmit() { setLoading(true); + if ( + !company || + !address || + !city || + !state || + !country || + !pincode || + !website || + !contact || + !email || + !longitude || + !latitude + ) { + setLoading(false); + return swal("Fill all the required filed!"); + } let data = { company, address, @@ -75,6 +99,8 @@ function Address() { website, contact, email, + longitude, + latitude, }; let res = await axios.post(`/api/config/address`, data, { @@ -82,10 +108,10 @@ function Address() { Authorization: `Bearer ${token}`, }, }); - console.log(res); if (res) { setLoading(false); + console.log(res); swal("Success!", res.data.message); } else { @@ -238,6 +264,34 @@ function Address() { className="form-control input-field " id="basicpill-phoneno-input" /> + + handelChange(e)} + className="form-control input-field " + id="basicpill-phoneno-input" + /> + + handelChange(e)} + className="form-control input-field " + id="basicpill-phoneno-input" + />
From c90bb84024c861b802010403c72c2edf86822398 Mon Sep 17 00:00:00 2001 From: parwez-zafar Date: Tue, 5 Dec 2023 18:28:04 +0530 Subject: [PATCH 3/6] login, register and shop page image feature implemented --- src/_nav.js | 18 + src/index.js | 4 +- src/routes.js | 19 + src/views/Banner/banner.js | 13 +- src/views/Images/LoginImage.js | 709 ++++++++++++++++++++++++++++++ src/views/Images/RegisterImage.js | 709 ++++++++++++++++++++++++++++++ src/views/Images/ShopImage.js | 709 ++++++++++++++++++++++++++++++ 7 files changed, 2173 insertions(+), 8 deletions(-) create mode 100644 src/views/Images/LoginImage.js create mode 100644 src/views/Images/RegisterImage.js create mode 100644 src/views/Images/ShopImage.js diff --git a/src/_nav.js b/src/_nav.js index be65ba6..af52b8d 100644 --- a/src/_nav.js +++ b/src/_nav.js @@ -109,6 +109,24 @@ const _nav = [ icon: , to: "/banner", }, + { + component: CNavItem, + name: "Register Image", + icon: , + to: "/registerImage", + }, + { + component: CNavItem, + name: "Login Image", + icon: , + to: "/loginImage", + }, + { + component: CNavItem, + name: "Shop Page Image", + icon: , + to: "/shopImage", + }, { component: CNavItem, name: "Testimonials", diff --git a/src/index.js b/src/index.js index e480d1a..1352647 100644 --- a/src/index.js +++ b/src/index.js @@ -14,9 +14,9 @@ import { createRoot } from "react-dom/client"; const setupAxios = () => { //axios.defaults.baseURL = 'https://bolo-api.checkapp.one/' - // axios.defaults.baseURL = "http://localhost:8000"; + axios.defaults.baseURL = "http://localhost:8000"; // axios.defaults.baseURL = "https://happy-sombrero-ray.cyclic.app/"; //->latest deployed - axios.defaults.baseURL = "https://printsigns.onrender.com/"; //->latest deployed + // axios.defaults.baseURL = "https://printsigns.onrender.com/"; //->latest deployed axios.defaults.headers = { "Cache-Control": "no-cache,no-store", diff --git a/src/routes.js b/src/routes.js index a8d14f6..61d84dc 100644 --- a/src/routes.js +++ b/src/routes.js @@ -93,6 +93,10 @@ import AddUserAddress from "./views/UserAddress/addUserAddress"; import ViewAddress from "./views/UserAddress/viewAddress"; import Design from "./views/Design/design"; import Banners from "./views/Banner/banner"; +import RegisterImage from './views/Images/RegisterImage' +import LoginImage from './views/Images/LoginImage' +import ShopImage from './views/Images/ShopImage' + const routes = [ { path: "/", exact: true, name: "Home" }, { @@ -253,6 +257,21 @@ const routes = [ name: "Banners", element: Banners, }, + { + path: "/registerImage", + name: "RegisterImage", + element: RegisterImage, + }, + { + path: "/loginImage", + name: "LoginImage", + element: LoginImage, + }, + { + path: "/shopImage", + name: "ShopImage", + element: ShopImage, + }, { path: "/testimonial/view/:id", name: "ViewTestimonial", diff --git a/src/views/Banner/banner.js b/src/views/Banner/banner.js index c97491a..e437d30 100644 --- a/src/views/Banner/banner.js +++ b/src/views/Banner/banner.js @@ -83,7 +83,8 @@ const Banners = () => { useEffect(() => { getBanner(); - }, [token, banner]); + }, []); + // }, [token, banner]); const handleEditClick = (_id, bannerName, bannerImage) => { setOpen(true); @@ -310,7 +311,7 @@ const Banners = () => {
- + */} { onChange={(e) => setBannerName( e.target.value.charAt(0).toUpperCase() + - e.target.value.slice(1) + e.target.value.slice(1) ) } /> @@ -482,7 +483,7 @@ const Banners = () => { p={2} display={"flex"} justifyContent={"right"} - // width={"500px"} + // width={"500px"} > {!edit && ( */} + + + {/* + + Banner Name + + handleClose()}> + + + */} + {/*
*/} + {/* + setBannerName( + e.target.value.charAt(0).toUpperCase() + + e.target.value.slice(1) + ) + } + /> */} + {/* {bannerName ? ( + <> + + {25 - bannerName.length} characters left + + + ) : ( + <> + )} */} + + + + {bannerImage && ( + + bannerImage + handeldeleteImage()} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + {olderImage && ( + + bannerImage + setOlderImage("")} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + + + {error &&

{error}

} +

+ Upload jpg, jpeg and png only* +

+ + + {!edit && ( + + )} + {edit && ( + + )} + + +
+
+
+
+ + + +
+
+
+
+
+
+ {/*
+ +
*/} +
+
+ +
+ + + + + + + + + + + {!loading && banner?.length === 0 && ( + + + + )} + {loading ? ( + + + + ) : ( + banner && + banner + .map((item, i) => ( + + + {/* */} + + + )) + )} + +
ImageAction
+ +
+ Loading... +
+ + {/* {item?.image} */} +
{ }
+
+
{item.bannerName}
+
+ + {/* */} +
+
+ + {/*
+ setPage(value)} + /> +
*/} +
+
+
+
+ + + + ); +}; + +export default Banners; diff --git a/src/views/Images/RegisterImage.js b/src/views/Images/RegisterImage.js new file mode 100644 index 0000000..1e46397 --- /dev/null +++ b/src/views/Images/RegisterImage.js @@ -0,0 +1,709 @@ +import React, { useState, useEffect } from "react"; +import axios from "axios"; +import { isAutheticated } from "src/auth"; +import { + Button, + Box, + IconButton, + Modal, + Pagination, + TextField, + Typography, +} from "@mui/material"; +import CloseIcon from "@mui/icons-material/Close"; +import { ClipLoader } from "react-spinners"; +import swal from "sweetalert"; +import CloudUploadIcon from "@mui/icons-material/CloudUpload"; +import DeleteSharpIcon from "@mui/icons-material/DeleteSharp"; + +const style = { + position: "absolute", + top: "50%", + left: "50%", + transform: "translate(-50%, -50%)", + width: 400, + bgcolor: "background.paper", + borderRadius: "0.5rem", + boxShadow: 24, + width: "500px", +}; + +const Banners = () => { + const token = isAutheticated(); + const [loading, setLoading] = useState(true); + const [updating, setUpdating] = useState(true); // for loading state + // const [isUpdate, setIsUpdate] = useState(false); // for edit state + const [saveLoding, setSaveLoading] = useState(true); + const [edit, setEdit] = useState(false); + const [bannerName, setBannerName] = useState(""); + const [bannerImage, setBannerImage] = useState(""); + const [error, setError] = useState(""); + const [bannerId, setBannerId] = useState(""); + const [banner, setBanner] = useState([]); + const [itemPerPage, setItemPerPage] = useState(10); + const [page, setPage] = useState(1); + const [open, setOpen] = useState(false); + const [olderBannerName, setOlderBaannerName] = useState(""); + const [olderImage, setOlderImage] = useState(""); + + const handleOpen = () => setOpen(true); + const handleClose = () => { + setOpen(false); + // setUpdating(false); + setEdit(false); + + setBannerName(""); + setBannerId(""); + setOlderImage(""); + setBannerImage(""); + }; + + const getBanner = async () => { + try { + const response = await axios.get("/api/registerImage/getImage", { + // headers: { + // Authorization: `Bearer ${token}`, + // }, + }); + + if (response.status === 200) { + // console.log(response); + setBanner(response?.data?.image); + setLoading(false); + } + } catch (error) { + swal({ + title: error, + text: " please login to access the resource ", + icon: "error", + button: "Retry", + dangerMode: true, + }); + } + }; + + useEffect(() => { + getBanner(); + }, []); + // }, [token, banner]); + + const handleEditClick = (_id, bannerImage) => { + setOpen(true); + console.log("bannerImage", bannerImage); + setOlderImage(bannerImage); + + setBannerId(_id); + setOlderBaannerName(bannerName); + setEdit(true); + // setUpdating(false); + }; + // const bannerNamesArray = []; + // const setBannerNamesArray = () => { + // banner && + // banner.map((banner) => { + // bannerNamesArray.push(banner.bannerName.toLowerCase()); + // }); + // }; + // setBannerNamesArray(); + + const handleUpdate = () => { + // const filteredArrayNames = bannerNamesArray.filter( + // (item) => item !== olderBannerName.toLowerCase() + // ); + // console.log(filteredArrayNames, "filter"); + // const bannerExits = filteredArrayNames.includes(bannerName.toLowerCase()); + // if (bannerExits) { + // swal({ + // title: "Warning", + // text: "Banner already exists ", + // icon: "error", + // button: "Retry", + // dangerMode: true, + // }); + // return; + // } + + if ((!bannerImage && !olderImage)) { + swal({ + title: "Warning", + text: "Please fill all the required fields!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + return; + } + setUpdating(false); + const formData = new FormData(); + + formData.append("bannerImage", bannerImage); + + formData.append("olderImage", JSON.stringify(olderImage)); + + axios + .patch(`/api/registerImage/update/${bannerId}`, formData, { + headers: { + Authorization: `Bearer ${token}`, + }, + }) + .then((res) => { + // setUpdating(true); + // setIsUpdate(false); + handleClose(); + setBannerId(""); + setBannerName(""); + setBannerImage(""); + setOlderImage(""); + setUpdating(true); + setEdit(false); + swal({ + title: "Congratulations!!", + text: "The banner was updated successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after updating + }) + .catch((err) => { + // console.log(err); + swal({ + title: "Sorry, please try again", + text: err, + icon: "error", + button: "Retry", + dangerMode: true, + }); + setUpdating(true); + }); + }; + + const handleDelete = (_id) => { + swal({ + title: "Are you sure?", + icon: "error", + buttons: { + Yes: { text: "Yes", value: true }, + Cancel: { text: "Cancel", value: "cancel" }, + }, + }).then((value) => { + if (value === true) { + axios + .delete(`/api/registerImage/delete/${_id}`, { + headers: { + Authorization: `Bearer ${token}`, + }, + }) + .then((res) => { + swal({ + title: "Congratulations!!", + text: "The banner was deleted successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after deleting + }) + .catch((err) => { + swal({ + title: "", + text: "Something went wrong!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + }); + } + }); + }; + + const handleSaveBanner = async () => { + const bannerExits = bannerNamesArray.includes(bannerName.toLowerCase()); + if (bannerExits) { + swal({ + title: "Warning", + text: "Banner Already exits.", + icon: "error", + button: "Retry", + dangerMode: true, + }); + return; + } + if (!bannerImage) { + swal({ + title: "Warning", + text: "Please fill all the required fields!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + return; + } + setSaveLoading(false); + setLoading(true); + const formData = new FormData(); + formData.append("bannerName", bannerName); + formData.append("bannerImage", bannerImage); + + axios + .post("/api/registerImage/add", formData, { + headers: { + Authorization: `Bearer ${token}`, + "Content-Type": "multipart/formdata", + }, + }) + .then((response) => { + if (response.status === 201) { + setOpen(false); + setLoading(false); + setSaveLoading(true); + setBannerName(""); + setBannerImage(""); + setOlderImage(""); + swal({ + title: "Added", + text: "New Banner added successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after adding + } + }) + .catch((error) => { + setSaveLoading(true); + swal({ + title: error, + text: "something went wrong", + icon: "error", + button: "Retry", + dangerMode: true, + }); + }); + }; + // const getPageCount = () => { + // return Math.max(1, Math.ceil(banner?.length / itemPerPage)); + // }; + + const handleFileChange = (e) => { + const files = e.target.files[0]; + + // Check file types and append to selectedFiles + const allowedTypes = ["image/jpeg", "image/png", "image/jpg"]; + if (allowedTypes.includes(files.type)) { + setBannerImage(files); + } + }; + const handeldeleteImage = () => { + setBannerImage(""); + }; + return ( +
+
+
+
+
+
+
+ Register Image +
+ +
+ {/* */} + + + {/* + + Banner Name + + handleClose()}> + + + */} + {/*
*/} + {/* + setBannerName( + e.target.value.charAt(0).toUpperCase() + + e.target.value.slice(1) + ) + } + /> */} + {/* {bannerName ? ( + <> + + {25 - bannerName.length} characters left + + + ) : ( + <> + )} */} + + + + {bannerImage && ( + + bannerImage + handeldeleteImage()} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + {olderImage && ( + + bannerImage + setOlderImage("")} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + + + {error &&

{error}

} +

+ Upload jpg, jpeg and png only* +

+ + + {!edit && ( + + )} + {edit && ( + + )} + + +
+
+
+
+
+
+ +
+
+
+
+
+
+ {/*
+ +
*/} +
+
+ +
+ + + + + + + + + + + {!loading && banner?.length === 0 && ( + + + + )} + {loading ? ( + + + + ) : ( + banner && + banner + .map((item, i) => ( + + + {/* */} + + + )) + )} + +
ImageAction
+ +
+ Loading... +
+ + {/* {item?.image} */} +
{ }
+
+
{item.bannerName}
+
+ + {/* */} +
+
+ + {/*
+ setPage(value)} + /> +
*/} +
+
+
+
+
+
+
+ ); +}; + +export default Banners; diff --git a/src/views/Images/ShopImage.js b/src/views/Images/ShopImage.js new file mode 100644 index 0000000..6795464 --- /dev/null +++ b/src/views/Images/ShopImage.js @@ -0,0 +1,709 @@ +import React, { useState, useEffect } from "react"; +import axios from "axios"; +import { isAutheticated } from "src/auth"; +import { + Button, + Box, + IconButton, + Modal, + Pagination, + TextField, + Typography, +} from "@mui/material"; +import CloseIcon from "@mui/icons-material/Close"; +import { ClipLoader } from "react-spinners"; +import swal from "sweetalert"; +import CloudUploadIcon from "@mui/icons-material/CloudUpload"; +import DeleteSharpIcon from "@mui/icons-material/DeleteSharp"; + +const style = { + position: "absolute", + top: "50%", + left: "50%", + transform: "translate(-50%, -50%)", + width: 400, + bgcolor: "background.paper", + borderRadius: "0.5rem", + boxShadow: 24, + width: "500px", +}; + +const Banners = () => { + const token = isAutheticated(); + const [loading, setLoading] = useState(true); + const [updating, setUpdating] = useState(true); // for loading state + // const [isUpdate, setIsUpdate] = useState(false); // for edit state + const [saveLoding, setSaveLoading] = useState(true); + const [edit, setEdit] = useState(false); + const [bannerName, setBannerName] = useState(""); + const [bannerImage, setBannerImage] = useState(""); + const [error, setError] = useState(""); + const [bannerId, setBannerId] = useState(""); + const [banner, setBanner] = useState([]); + const [itemPerPage, setItemPerPage] = useState(10); + const [page, setPage] = useState(1); + const [open, setOpen] = useState(false); + const [olderBannerName, setOlderBaannerName] = useState(""); + const [olderImage, setOlderImage] = useState(""); + + const handleOpen = () => setOpen(true); + const handleClose = () => { + setOpen(false); + // setUpdating(false); + setEdit(false); + + setBannerName(""); + setBannerId(""); + setOlderImage(""); + setBannerImage(""); + }; + + const getBanner = async () => { + try { + const response = await axios.get("/api/shopImage/getImage", { + // headers: { + // Authorization: `Bearer ${token}`, + // }, + }); + + if (response.status === 200) { + // console.log(response); + setBanner(response?.data?.image); + setLoading(false); + } + } catch (error) { + swal({ + title: error, + text: " please login to access the resource ", + icon: "error", + button: "Retry", + dangerMode: true, + }); + } + }; + + useEffect(() => { + getBanner(); + }, []); + // }, [token, banner]); + + const handleEditClick = (_id, bannerImage) => { + setOpen(true); + console.log("bannerImage", bannerImage); + setOlderImage(bannerImage); + + setBannerId(_id); + setOlderBaannerName(bannerName); + setEdit(true); + // setUpdating(false); + }; + // const bannerNamesArray = []; + // const setBannerNamesArray = () => { + // banner && + // banner.map((banner) => { + // bannerNamesArray.push(banner.bannerName.toLowerCase()); + // }); + // }; + // setBannerNamesArray(); + + const handleUpdate = () => { + // const filteredArrayNames = bannerNamesArray.filter( + // (item) => item !== olderBannerName.toLowerCase() + // ); + // console.log(filteredArrayNames, "filter"); + // const bannerExits = filteredArrayNames.includes(bannerName.toLowerCase()); + // if (bannerExits) { + // swal({ + // title: "Warning", + // text: "Banner already exists ", + // icon: "error", + // button: "Retry", + // dangerMode: true, + // }); + // return; + // } + + if ((!bannerImage && !olderImage)) { + swal({ + title: "Warning", + text: "Please fill all the required fields!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + return; + } + setUpdating(false); + const formData = new FormData(); + + formData.append("bannerImage", bannerImage); + + formData.append("olderImage", JSON.stringify(olderImage)); + + axios + .patch(`/api/shopImage/update/${bannerId}`, formData, { + headers: { + Authorization: `Bearer ${token}`, + }, + }) + .then((res) => { + // setUpdating(true); + // setIsUpdate(false); + handleClose(); + setBannerId(""); + setBannerName(""); + setBannerImage(""); + setOlderImage(""); + setUpdating(true); + setEdit(false); + swal({ + title: "Congratulations!!", + text: "The banner was updated successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after updating + }) + .catch((err) => { + // console.log(err); + swal({ + title: "Sorry, please try again", + text: err, + icon: "error", + button: "Retry", + dangerMode: true, + }); + setUpdating(true); + }); + }; + + const handleDelete = (_id) => { + swal({ + title: "Are you sure?", + icon: "error", + buttons: { + Yes: { text: "Yes", value: true }, + Cancel: { text: "Cancel", value: "cancel" }, + }, + }).then((value) => { + if (value === true) { + axios + .delete(`/api/shopImage/delete/${_id}`, { + headers: { + Authorization: `Bearer ${token}`, + }, + }) + .then((res) => { + swal({ + title: "Congratulations!!", + text: "The banner was deleted successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after deleting + }) + .catch((err) => { + swal({ + title: "", + text: "Something went wrong!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + }); + } + }); + }; + + const handleSaveBanner = async () => { + // const bannerExits = bannerNamesArray.includes(bannerName.toLowerCase()); + // if (bannerExits) { + // swal({ + // title: "Warning", + // text: "Banner Already exits.", + // icon: "error", + // button: "Retry", + // dangerMode: true, + // }); + // return; + // } + if (!bannerImage) { + swal({ + title: "Warning", + text: "Please fill all the required fields!", + icon: "error", + button: "Retry", + dangerMode: true, + }); + return; + } + setSaveLoading(false); + setLoading(true); + const formData = new FormData(); + formData.append("bannerName", bannerName); + formData.append("bannerImage", bannerImage); + + axios + .post("/api/shopImage/add", formData, { + headers: { + Authorization: `Bearer ${token}`, + "Content-Type": "multipart/formdata", + }, + }) + .then((response) => { + if (response.status === 201) { + setOpen(false); + setLoading(false); + setSaveLoading(true); + setBannerName(""); + setBannerImage(""); + setOlderImage(""); + swal({ + title: "Added", + text: "New Banner added successfully!", + icon: "success", + button: "OK", + }); + // getCategories(); // Refresh the category list after adding + } + }) + .catch((error) => { + setSaveLoading(true); + swal({ + title: error, + text: "something went wrong", + icon: "error", + button: "Retry", + dangerMode: true, + }); + }); + }; + // const getPageCount = () => { + // return Math.max(1, Math.ceil(banner?.length / itemPerPage)); + // }; + + const handleFileChange = (e) => { + const files = e.target.files[0]; + + // Check file types and append to selectedFiles + const allowedTypes = ["image/jpeg", "image/png", "image/jpg"]; + if (allowedTypes.includes(files.type)) { + setBannerImage(files); + } + }; + const handeldeleteImage = () => { + setBannerImage(""); + }; + return ( +
+
+
+
+
+
+
+ Shop Page Image +
+ +
+ {/* */} + + + {/* + + Banner Name + + handleClose()}> + + + */} + {/*
*/} + {/* + setBannerName( + e.target.value.charAt(0).toUpperCase() + + e.target.value.slice(1) + ) + } + /> */} + {/* {bannerName ? ( + <> + + {25 - bannerName.length} characters left + + + ) : ( + <> + )} */} + + + + {bannerImage && ( + + bannerImage + handeldeleteImage()} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + {olderImage && ( + + bannerImage + setOlderImage("")} + fontSize="small" + sx={{ + color: "white", + position: "absolute", + cursor: "pointer", + padding: "0.2rem", + background: "black", + borderRadius: "50%", + }} + /> + + )} + + + {error &&

{error}

} +

+ Upload jpg, jpeg and png only* +

+ + + {!edit && ( + + )} + {edit && ( + + )} + + +
+
+
+
+
+
+ +
+
+
+
+
+
+ {/*
+ +
*/} +
+
+ +
+ + + + + + + + + + + {!loading && banner?.length === 0 && ( + + + + )} + {loading ? ( + + + + ) : ( + banner && + banner + .map((item, i) => ( + + + {/* */} + + + )) + )} + +
ImageAction
+ +
+ Loading... +
+ + {/* {item?.image} */} +
{ }
+
+
{item.bannerName}
+
+ + {/* */} +
+
+ + {/*
+ setPage(value)} + /> +
*/} +
+
+
+
+
+
+
+ ); +}; + +export default Banners; From cd6eea6d41d9e76986ab37105912b7595102baec Mon Sep 17 00:00:00 2001 From: parwez-zafar Date: Tue, 5 Dec 2023 19:36:36 +0530 Subject: [PATCH 4/6] smtp email updated --- src/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/index.js b/src/index.js index 1352647..c43c6f3 100644 --- a/src/index.js +++ b/src/index.js @@ -14,9 +14,9 @@ import { createRoot } from "react-dom/client"; const setupAxios = () => { //axios.defaults.baseURL = 'https://bolo-api.checkapp.one/' - axios.defaults.baseURL = "http://localhost:8000"; // axios.defaults.baseURL = "https://happy-sombrero-ray.cyclic.app/"; //->latest deployed - // axios.defaults.baseURL = "https://printsigns.onrender.com/"; //->latest deployed + // axios.defaults.baseURL = "http://localhost:8000"; + axios.defaults.baseURL = "https://printsigns.onrender.com/"; //->latest deployed axios.defaults.headers = { "Cache-Control": "no-cache,no-store", From ae714ac48565b3ef31b5a9c94d0522201e872492 Mon Sep 17 00:00:00 2001 From: print-signs Date: Wed, 6 Dec 2023 12:58:25 +0530 Subject: [PATCH 5/6] updated logo section --- src/components/AppSidebar.js | 4 ++-- src/views/configuration/Logo.js | 21 ++++++++++++++++----- 2 files changed, 18 insertions(+), 7 deletions(-) diff --git a/src/components/AppSidebar.js b/src/components/AppSidebar.js index 5391b3b..78404e9 100644 --- a/src/components/AppSidebar.js +++ b/src/components/AppSidebar.js @@ -73,9 +73,9 @@ const AppSidebar = () => { > {/* */} - {HeaderlogoUrl ? ( + {AdminlogoUrl ? ( - + ) : { AppName } ? (

The Solar Sign

diff --git a/src/views/configuration/Logo.js b/src/views/configuration/Logo.js index 2bd89d9..16dac52 100644 --- a/src/views/configuration/Logo.js +++ b/src/views/configuration/Logo.js @@ -71,7 +71,7 @@ function Logo() { swal("Success!", res.data.message, res.data.status); }) .catch((error) => { - console.log(error); + setLoading(false); }); } @@ -96,8 +96,9 @@ function Logo() {
) : ( "" @@ -138,9 +139,12 @@ function Logo() { +
) : ( "" @@ -174,8 +178,10 @@ function Logo() { ) : ( "" @@ -216,6 +222,11 @@ function Logo() {