Danovin
/
application_17
5
0
Fork 0
Code Issues 3 Pull Requests Projects Releases Wiki Activity

update 8 files

Browse Source
master
Reza_ashrafi 2 years ago
parent 624fb8aaa9
commit 30cc3dfa9b
10 changed files with 338 additions and 247 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 8
      src/assets/icons/bookmark-active-dark.svg
  2. 8
      src/assets/icons/bookmark-active-light.svg
  3. 362
      src/components/Drawer/index.js
  4. 79
      src/components/Navbar/index.js
  5. 30
      src/router.js
  6. 13
      src/views/Blogs/index.js
  7. 17
      src/views/Product/index.js
  8. 1
      src/views/Products/index.js
  9. 2
      src/views/Products/layouts/Mobile/Main.js
  10. 65
      src/views/ShoppingCart/Product/index.js

8
src/assets/icons/bookmark-active-dark.svg
Unescape View File

@ -0,0 +1,8 @@
<svg id="vuesax_linear_archive-add" data-name="vuesax/linear/archive-add" xmlns="http://www.w3.org/2000/svg" width="29.778" height="29.778" viewBox="0 0 29.778 29.778">
<g id="archive-add" transform="translate(0)">
<path id="Vector" d="M6.2,0H0" transform="translate(11.787 13.214)" fill="#fff" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0V6.2" transform="translate(14.889 10.187)" fill="none" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M16.75,0H4.789A4.8,4.8,0,0,0,0,4.789V22.272c0,2.233,1.6,3.176,3.561,2.1l6.055-3.362a2.628,2.628,0,0,1,2.32,0l6.055,3.362c1.96,1.092,3.561.149,3.561-2.1V4.789A4.819,4.819,0,0,0,16.75,0Z" transform="translate(4.119 2.482)" fill="#fff" stroke="#fff" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M0,0H29.778V29.778H0Z" fill="none" opacity="0"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

8
src/assets/icons/bookmark-active-light.svg
Unescape View File

@ -0,0 +1,8 @@
<svg id="vuesax_linear_archive-add" data-name="vuesax/linear/archive-add" xmlns="http://www.w3.org/2000/svg" width="29.778" height="29.778" viewBox="0 0 29.778 29.778">
<g id="archive-add" transform="translate(0)">
<path id="Vector" d="M6.2,0H0" transform="translate(11.787 13.214)" fill="rgb(19, 123, 79)" stroke="rgb(19, 123, 79)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-2" data-name="Vector" d="M0,0V6.2" transform="translate(14.889 10.187)" fill="rgb(19, 123, 79)" stroke="rgb(19, 123, 79)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-3" data-name="Vector" d="M16.75,0H4.789A4.8,4.8,0,0,0,0,4.789V22.272c0,2.233,1.6,3.176,3.561,2.1l6.055-3.362a2.628,2.628,0,0,1,2.32,0l6.055,3.362c1.96,1.092,3.561.149,3.561-2.1V4.789A4.819,4.819,0,0,0,16.75,0Z" transform="translate(4.119 2.482)" fill="rgb(19, 123, 79)" stroke="rgb(19, 123, 79)" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5"/>
<path id="Vector-4" data-name="Vector" d="M0,0H29.778V29.778H0Z" fill="rgb(19, 123, 79)" opacity="0"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

362
src/components/Drawer/index.js
Unescape View File

@ -10,7 +10,7 @@ import homeDarkIcon from "./home-dark.svg";
import logoutIcon from "./logout.svg";
import logoutDarkIcon from "./logout-dark.svg";
import dangerIcon from "./mobile-danger.svg";
import dangerDarkIcon from "./mobile-danger-dark.svg";
// import dangerDarkIcon from "./mobile-danger-dark.svg";
import activationIcon from "./activation.svg";
import activationDarkIcon from "./activation-dark.svg";
import contactIcon from "./contact.svg";
@ -24,7 +24,7 @@ import cartDarkIcon from "./mobile-basket-dark.svg";
import faqIcon from "./faq.svg";
import faqDarkIcon from "./faq-dark.svg";
import arrowLeftVideo from "../../assets/icons/dropdown-white.svg";
// import arrowLeftVideo from "../../assets/icons/dropdown-white.svg";
import sunIcon from "./sun.svg";
import moonIcon from "./moon.svg";
@ -40,186 +40,192 @@ const MyDrawer = ({
setDialog,
logout,
}) => {
const [addUserDropdown, setAddUserDropdown] = useState(false);
const publicLink = [
{
name: window.t("صفحه اصلی"),
link: "/",
icon: (
<img
src={homeIcon}
className="opacity-50 dark:bg-white"
alt={window.t("صفحه اصلی")}
/>
),
toast: "",
message: "",
},
{
name: window.t("ورود یا ثبت نام"),
link: "/signup",
icon: (
<img
src={logoutIcon}
className="opacity-50 dark:bg-white"
alt={window.t("کتاب‌های من")}
/>
),
toast: "",
message: "",
},
{
name: window.t("پشتیبانی"),
link: "/contact-us",
icon: (
<img
src={dangerIcon}
className="opacity-50 dark:bg-white"
alt={window.t("پشتیبانی")}
/>
),
toast: "",
message: "",
},
];
const privateLink = [
{
name: window.t("صفحه اصلی"),
link: "/",
icon: (
<img
src={isDark ? homeDarkIcon : homeIcon}
className="opacity-50"
alt={window.t("صفحه اصلی")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
// const [addUserDropdown, setAddUserDropdown] = useState(false);
const privateLink = React.useMemo(() => {
return [
{
name: window.t("صفحه اصلی"),
link: "/",
icon: (
<img
src={isDark ? homeDarkIcon : homeIcon}
className="opacity-50"
alt={window.t("صفحه اصلی")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("سبد خرید"),
link: "/cart",
icon: (
<img
src={isDark ? cartDarkIcon : cartIcon}
className="opacity-50"
alt={window.t("سبد خرید")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("سبد خرید"),
link: "/cart",
icon: (
<img
src={isDark ? cartDarkIcon : cartIcon}
className="opacity-50"
alt={window.t("سبد خرید")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("فعال سازی کتاب"),
link: "/activation",
icon: (
<img
src={isDark ? activationDarkIcon : activationIcon}
className="opacity-50"
alt={window.t("فعال سازی کتاب")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("فعال سازی کتاب"),
link: "/activation",
icon: (
<img
src={isDark ? activationDarkIcon : activationIcon}
className="opacity-50"
alt={window.t("فعال سازی کتاب")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("واقعیت افزوده"),
link: "/ar",
icon: (
<img
src={isDark ? arDarkIcon : arIcon}
className="opacity-50"
alt={window.t("واقعیت افزوده")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("واقعیت افزوده"),
link: "/ar",
icon: (
<img
src={isDark ? arDarkIcon : arIcon}
className="opacity-50"
alt={window.t("واقعیت افزوده")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("سفارشات"),
link: "/orders",
icon: (
<img
src={isDark ? ordersDarkIcon : ordersIcon}
className="opacity-50"
alt={window.t("سفارشات")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("سفارشات"),
link: "/orders",
icon: (
<img
src={isDark ? ordersDarkIcon : ordersIcon}
className="opacity-50"
alt={window.t("سفارشات")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("سوالات متداول"),
link: "/faq",
icon: (
<img
src={isDark ? faqDarkIcon : faqIcon}
className="opacity-50"
alt={window.t("سوالات متداول")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("سوالات متداول"),
link: "/faq",
icon: (
<img
src={isDark ? faqDarkIcon : faqIcon}
className="opacity-50"
alt={window.t("سوالات متداول")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("پشتیبانی"),
link: "/contact",
icon: (
<img
src={isDark ? contactDarkIcon : contactIcon}
className="opacity-50"
alt={window.t("پشتیبانی")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
{
name: window.t("پشتیبانی"),
link: "/contact",
icon: (
<img
src={isDark ? contactDarkIcon : contactIcon}
className="opacity-50"
alt={window.t("پشتیبانی")}
/>
),
toast: "",
message: "",
onClick: () => {
setDrawerOpen(false);
},
},
},
{
name: window.t("خروج از حساب کاربری"),
link: "/",
icon: (
<img
src={isDark ? logoutDarkIcon : logoutIcon}
className="opacity-50"
alt={window.t("خروج از حساب کاربری")}
/>
),
toast: "",
message: "",
onClick: () => {
setDialog({
open: true,
type: "confirm",
accept: () => {
logout();
},
text: window.t("قصد خروج از حساب کاربری رو داری؟"),
});
setDrawerOpen(false);
{
name: window.t("خروج از حساب کاربری"),
link: "/",
icon: (
<img
src={isDark ? logoutDarkIcon : logoutIcon}
className="opacity-50"
alt={window.t("خروج از حساب کاربری")}
/>
),
toast: "",
message: "",
onClick: () => {
setDialog({
open: true,
type: "confirm",
accept: () => {
logout();
},
text: window.t("قصد خروج از حساب کاربری رو داری؟"),
});
setDrawerOpen(false);
},
},
},
];
];
},[isDark, user]);
const publicLink = React.useMemo(() => {
return [
{
name: window.t("صفحه اصلی"),
link: "/",
icon: (
<img
src={homeIcon}
className="opacity-50 dark:bg-white"
alt={window.t("صفحه اصلی")}
/>
),
toast: "",
message: "",
},
{
name: window.t("ورود یا ثبت نام"),
link: "/signup",
icon: (
<img
src={logoutIcon}
className="opacity-50 dark:bg-white"
alt={window.t("کتاب‌های من")}
/>
),
toast: "",
message: "",
},
{
name: window.t("پشتیبانی"),
link: "/contact-us",
icon: (
<img
src={dangerIcon}
className="opacity-50 dark:bg-white"
alt={window.t("پشتیبانی")}
/>
),
toast: "",
message: "",
},
];
},[isDark, user]);
return (
<Drawer
@ -256,21 +262,21 @@ const MyDrawer = ({
{user?.cellphone}
</span>
</div>
<img
{/* <img
src={arrowLeftVideo}
alt=""
className={`transform ${
addUserDropdown ? "rotate-90" : "-rotate-90"
} cursor-pointer`}
onClick={() => setAddUserDropdown(() => !addUserDropdown)}
/>
/> */}
</div>
</header>
<ul
{/* <ul
className={`flex flex-col ${
addUserDropdown ? "h-20" : "h-0"
} transition-all duration-500`}
></ul>
></ul> */}
<ul className="h-full flex flex-col py-6 px-4 gap-6">
{(!user ? publicLink : privateLink).map((item, key) => (
<Link to={item.link} key={key} onClick={() => item.onClick()}>

79
src/components/Navbar/index.js
Unescape View File

@ -9,6 +9,7 @@ import _ from "lodash";
import Drawer from "../Drawer";
import Search from "../Search";
import SearchResult from "./SearchResult";
import Loading from "../Loading";
//assets
import cartIcon from "./cart-blue.svg";
@ -24,18 +25,24 @@ import arrowBlueIcon from "../../assets/icons/arrow-right-blue.svg";
import arrowWhiteIcon from "../../assets/icons/arrow-left-white.svg";
import dotsMenuDarkIcon from "../../assets/icons/dots-menu-dark.svg";
import bookmarkDeactiveDarkIcon from "../../assets/icons/bookmark-deactive-dark.svg";
import bookmarkActiveDarkIcon from "../../assets/icons/bookmark-active-dark.svg";
import dotsMenuLightIcon from "../../assets/icons/dots-menu-light.svg";
import bookmarkDeactiveLightIcon from "../../assets/icons/bookmark-deactive-light.svg";
import bookmarkActiveLightIcon from "../../assets/icons/bookmark-active-light.svg";
function Navbar({
getCartProducts,
getUserFavorite,
cartProductsLength,
pages,
isDark,
isMobile,
isLogin,
user,
headerOptions,
addToFavorite,
deleteBookmark,
bookmarkLoading,
userFavoriteList,
language,
}) {
const navigation = useNavigate();
@ -46,11 +53,22 @@ function Navbar({
const [search, setSearch] = useState(null);
const [drawerOpen, setDrawerOpen] = useState(false);
const isActiveBookmark = React.useMemo(() => {
return userFavoriteList?.find((object) =>
headerOptions?.productId
? object?.productId === headerOptions?.productId
: object?.contentId === headerOptions?.contentId
);
}, [headerOptions, userFavoriteList]);
console.log(Boolean(isActiveBookmark));
useEffect(() => {
if (window.scrollY === 0) {
setTop(() => true);
}
if (isMobile) {
// getUserFavorite();
window.addEventListener("scroll", () => {
if (window.scrollY === 0) {
setTop(() => true);
@ -62,13 +80,11 @@ function Navbar({
}, []);
useEffect(() => {
if (!isMobile && isLogin) {
console.log(111);
// console.log/("gl3");
if (!isMobile && user) {
getCartProducts();
}
}, [isLogin]);
}, [user]);
return (
<div
@ -77,7 +93,9 @@ function Navbar({
backgroundColor: !top ? (isDark ? "#061B30" : "white") : "",
}}
>
<div className="w-full lg:w-11/12 lg:mx-auto relative flex items-center justify-between py-3 px-4 bg-white">
<div className="w-full lg:w-11/12 lg:mx-auto relative flex items-center justify-between py-3 px-4" style={{
backgroundColor: isDark ? "#061B30" : "white"
}}>
{/* desktop */}
<div className=" items-center hidden lg:flex">
<Link
@ -193,16 +211,35 @@ function Navbar({
</Link>
</>
)}
{bookmark && (
<img
src={
isDark ? bookmarkDeactiveDarkIcon : bookmarkDeactiveLightIcon
}
alt="bookmark"
className="w-7 flex lg:hidden"
onClick={() => addToFavorite({ [bookmark]: location.getId() })}
/>
)}
{bookmark ? (
bookmarkLoading ? (
<Loading size={2} color="bg-green-500" />
) : isActiveBookmark ? (
<img
src={
isDark ? bookmarkActiveDarkIcon : bookmarkActiveLightIcon
}
alt="bookmark"
className="w-7 flex lg:hidden"
onClick={() =>
deleteBookmark({
id: userFavoriteList?.find(
(object) => object?.productId === headerOptions?.productId
)?.id,
})
}
/>
) : (
<img
src={
isDark ? bookmarkDeactiveDarkIcon : bookmarkDeactiveLightIcon
}
alt="bookmark"
className="w-7 flex lg:hidden"
onClick={() => addToFavorite({ [bookmark]: location.getId() })}
/>
)
) : null}
{menu && (
<img
src={isDark ? dotsMenuDarkIcon : dotsMenuLightIcon}
@ -242,7 +279,7 @@ function Navbar({
onClick={() => setOverLayer(true)}
/>
{isLogin && (
{user && (
<div className="hidden lg:flex justify-end items-center gap-4">
<Link to="/cart" className="relative">
<img src={cartIcon} alt="" className="w-8" />
@ -256,7 +293,7 @@ function Navbar({
</div>
)}
{!isLogin ? (
{!user ? (
<Link
to="/signup"
className="bg-blueC0 font-semibold text-white rounded-md px-4 py-3 text-sm mr-7 hover:bg-opacity-90 shadow-sm"
@ -284,15 +321,19 @@ const mapStateToProps = (state) => ({
isDark: state.publicApi.isDark,
isMobile: state.publicApi.isMobile,
headerOptions: state.publicApi.headerOptions,
isLogin: state.user.status,
user: state.user.status,
cartProductsLength: state.userProduct.list?.filter(
(product) => product.condition < 2
)?.length,
bookmarkLoading: state.userFavorite.loading,
userFavoriteList: state.userFavorite.list,
});
const mapDispatchToProps = {
getCartProducts: userProduct.list,
addToFavorite: userFavorite.add,
deleteBookmark: userFavorite.del,
getUserFavorite: userFavorite.list
};
export default connect(mapStateToProps, mapDispatchToProps)(Navbar);

30
src/router.js
Unescape View File

@ -161,7 +161,17 @@ function Router({
path="/products"
exact
element={
<Products headerOptions={{ shown: isMobile ? false : true }} />
<Products
headerOptions={{
logo: true,
hamburgerMenu: true,
qr: true,
title: false,
back: false,
shown: true,
menu: false,
}}
/>
}
/>
<Route
@ -523,15 +533,15 @@ function Router({
exact
element={
<Blogs
// headerOptions={{
// logo: true,
// hamburgerMenu: true,
// qr: true,
// title: false,
// back: false,
// shown: true,
// menu: false,
// }}
headerOptions={{
logo: true,
hamburgerMenu: true,
qr: true,
title: false,
back: false,
shown: true,
menu: false,
}}
/>
}
/>

13
src/views/Blogs/index.js
Unescape View File

@ -20,23 +20,16 @@ export const Blogs = ({
getList,
blogs,
setHeaderOptions,
headerOptions,
activeHashtag,
}) => {
useEffect(() => {
if (isMobile) {
setHeaderOptions({
shown: true,
hamburgerMenu: true,
qr: true,
});
} else {
setHeaderOptions({ shown: true });
}
setHeaderOptions(headerOptions);
getList();
}, []);
useEffect(() => {
window.scrollTo(0, 0);
window.scroll({ top: 0, behavior: "smooth" });
}, []);
return (

17
src/views/Product/index.js
Unescape View File

@ -29,6 +29,7 @@ export const Product = ({
userId,
pushToCart,
headerOptions,
bookmarkLoading,
setHeaderOptions,
}) => {
const [type, setType] = useState("physical");
@ -37,7 +38,6 @@ export const Product = ({
useEffect(() => {
getInfo({ id: location.getId(), vod: true });
setHeaderOptions(headerOptions);
if (!isMobile) {
window.addEventListener("scroll", () => {
if (window.scrollY >= 64) {
@ -49,6 +49,12 @@ export const Product = ({
}
}, []);
useEffect(() => {
if (book) {
setHeaderOptions({ ...headerOptions, productId: book?.id });
window.scroll({ top: 0, behavior: "smooth" });
}
}, [book]);
return (
<>
{/* Portrait */}
@ -88,9 +94,11 @@ export const Product = ({
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-tiny leading-5 font-medium text-green7B dark:text-white">
{"فیزیکی - دیجیتالی"} <br /> در دسترس
</li>
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-tiny leading-5 font-medium text-green7B dark:text-white">
{book?.rate} <br /> امتیاز
</li>
{book?.rate ? (
<li className="border-solid border-blueFE flex-1 flex-shrink-0 text-center text-tiny leading-5 font-medium text-green7B dark:text-white">
{book?.rate} <br /> امتیاز
</li>
) : null}
</ul>
<h2 className="text-green7B text-base font-semibold mt-10 dark:text-greenBA">
نسخه محصول را انتخاب کنید
@ -196,6 +204,7 @@ const mapStateToProps = (state) => ({
isMobile: state.publicApi.isMobile,
isDark: state.publicApi.isDark,
userId: state.user.status?.id,
bookmarkLoading: state.userFavorite.loading,
});
const mapDispatchToProps = {

1
src/views/Products/index.js
Unescape View File

@ -23,6 +23,7 @@ export const Products = ({
useEffect(() => {
getList({ vod: true });
setHeaderOptions(headerOptions);
window.scroll({top: 0, behavior : 'smooth'});
}, []);
return (

2
src/views/Products/layouts/Mobile/Main.js
Unescape View File

@ -137,7 +137,7 @@ export const Main = ({ books, filterOptions, grades }) => {
};
return (
<div className="h-full overflow-y-scroll w-full flex flex-wrap py-32">
<div className="h-full overflow-y-scroll w-full flex flex-wrap pt-20 pb-32">
{filterOptions?.productType === "دوره ویدئویی" && Items(2)}
{filterOptions?.productType === "کتاب دیجیتال" && Items(0)}
{filterOptions?.productType === "کتاب فیزیکی" && Items(1)}

65
src/views/ShoppingCart/Product/index.js
Unescape View File

@ -10,6 +10,14 @@ import exitIcon from "../../../assets/icons/exit.svg";
import deleteIcon from "../../../assets/icons/delete.svg";
function Product({ product, grades, pushToCart, isMobile, loading }) {
const [selectedItem, setSelectedItem] = React.useState(null);
React.useEffect(() => {
if (!loading) {
setSelectedItem(null);
}
}, [loading]);
return isMobile ? (
<div className="flex justify-between py-5 border-b border-solid border-grayDB dark:border-gray45">
<div className="flex ">
@ -34,7 +42,8 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
src={exitIcon}
className="w-4"
alt=""
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart(
{
productId: product?.productId,
@ -43,26 +52,27 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
},
{},
{ id: product?.factorId }
)
}
);
}}
/>
<div className="flex flex-col items-center">
{product.productType === 2 && (
{product.productType === 2 ? (
<div className="flex items-center mb-3">
<button
className="rounded-md pt-2 pb-1.5 px-3 border border-solid border-blueC0 text-blueC0"
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart({
productId: product?.productId,
userId: product?.userId,
count: 1,
})
}
});
}}
>
+
</button>
<span className="mx-2.5 font-semibold text-4xl text-blueC0">
{loading ? (
{loading && selectedItem === product?.productId ? (
<Loading size={2} color="bg-green-500" />
) : (
product.count
@ -72,7 +82,8 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
<>
{product.count === 1 ? (
<img
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart(
{
productId: product?.productId,
@ -82,22 +93,23 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
},
{},
{ id: product?.factorId }
)
}
);
}}
src={deleteIcon}
alt="delete"
className="border border-blue-800 border-solid p-1 w-8 bg-red-100 rounded-md cursor-pointer"
className="border border-red-800 border-solid p-1 w-8 bg-red-100 rounded-md cursor-pointer"
/>
) : (
<button
className="rounded-md pt-2 pb-1.5 px-3 font-bold border border-solid border-blueC0 text-blueC0 dark:border-blueC0 dark:text-blueC0"
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart({
productId: product?.productId,
userId: product?.userId,
count: -1,
})
}
});
}}
>
-
</button>
@ -105,7 +117,7 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
</>
}
</div>
)}
) : null}
<strong className="font-bold text-md text-blue5F dark:text-white">
{separate(product.product.price * product.count)}&nbsp;تومان
</strong>
@ -147,13 +159,14 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
<div className="w-1/4 flex items-center">
<button
className="rounded-md pt-1 px-1.5 border border-solid border-blueC0 text-blueC0 text-lg font-bold"
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart({
productId: product?.productId,
userId: product?.userId,
count: 1,
})
}
});
}}
>
+
</button>
@ -164,7 +177,8 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
<>
{product.count === 1 ? (
<img
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart(
{
productId: product?.productId,
@ -173,8 +187,8 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
},
{},
{ id: product?.factorId }
)
}
);
}}
src={deleteIcon}
alt="delete"
className="border border-red-300 border-solid p-1 w-7 bg-red-100 rounded-md cursor-pointer"
@ -182,13 +196,14 @@ function Product({ product, grades, pushToCart, isMobile, loading }) {
) : (
<button
className="rounded-md px-2 font-bold border border-solid border-blueC0 text-blueC0 dark:border-blueC0 dark:text-blueC0 text-2xl"
onClick={() =>
onClick={() => {
setSelectedItem(product?.productId);
pushToCart({
productId: product?.productId,
userId: product?.userId,
count: -1,
})
}
});
}}
>
-
</button>

Write Preview
Loading…
Cancel
Save