reza added some thing

master
RezaAshrafi77 3 years ago
parent 1bfe0c3272
commit 1ac115e6d6
  1. 88
      src/AppRouter.js
  2. 1
      src/Redux/actions/index.js
  3. 31
      src/Redux/actions/userProduct.js
  4. 3
      src/Redux/proxy.js
  5. 1
      src/Redux/reducers/index.js
  6. 2
      src/Redux/reducers/user.js
  7. 28
      src/Redux/reducers/userProduct.js
  8. BIN
      src/assets/images/book9.png
  9. BIN
      src/assets/images/olum6.jpg
  10. BIN
      src/assets/images/olum7.jpg
  11. BIN
      src/assets/images/olum8.jpg
  12. BIN
      src/assets/images/olum9.jpg
  13. BIN
      src/assets/images/shimi10.jpg
  14. BIN
      src/assets/images/zist10.jpg
  15. 2
      src/views/AR/Item/index.js
  16. 820
      src/views/About/mobin.js
  17. BIN
      src/views/About/mobin.rar
  18. 4
      src/views/About/reza.js
  19. 36
      src/views/Activation/index.js
  20. 52
      src/views/Activation/index.scss
  21. 27
      src/views/Auth/Profile/Birthdate/index.scss
  22. 92
      src/views/Auth/Profile/Document/index.js
  23. 28
      src/views/Auth/Profile/Document/index.scss
  24. 4
      src/views/Auth/Profile/GenderSwitch/index.js
  25. 6
      src/views/Auth/Profile/Input/index.js
  26. 2
      src/views/Auth/Profile/MultipleSelector/index.scss
  27. 24
      src/views/Auth/Profile/Select/index.js
  28. 15
      src/views/Auth/Profile/Upload/index.js
  29. 37
      src/views/Auth/Profile/index.js
  30. 49
      src/views/Auth/Profile/index.scss
  31. 91
      src/views/MyBooks/index.js
  32. 75
      src/views/MyBooks/index.scss
  33. 4
      src/views/Product/index.js

@ -35,18 +35,18 @@ class AppRouter extends Component {
state = {}; state = {};
componentDidMount() { componentDidMount() {
if (this.props.profile) { // if (this.props.profile) {
return; // return;
} else { // } else {
this.props.getProfile(); // this.props.getProfile();
} // }
} }
render() { render() {
let home = ( let home = (
<Route exact path={"/"}> <Route exact path={"/"}>
{proxy.status() ? ( {proxy.status() ? (
this.props.profile ? ( this.props.profile.status ? (
<Home /> <Home />
) : ( ) : (
<Auth page={"profile"} /> <Auth page={"profile"} />
@ -84,48 +84,16 @@ class AppRouter extends Component {
)} )}
</Route> </Route>
<Route exact path={"/about"}> <Route exact path={"/about"}>
{proxy.status() ? (
<About /> <About />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/products"}> <Route exact path={"/products"}>
{proxy.status() ? (
<Products /> <Products />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/products/:id"}> <Route exact path={"/products/:id"}>
{proxy.status() ? (
<Product /> <Product />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/qr"}> <Route exact path={"/qr"}>
{proxy.status() ? (
<QR /> <QR />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/auth"}> <Route exact path={"/auth"}>
<Auth /> <Auth />
@ -134,60 +102,20 @@ class AppRouter extends Component {
<Auth page={"profile"} /> <Auth page={"profile"} />
</Route> </Route>
<Route exact path={"/qr-scan"}> <Route exact path={"/qr-scan"}>
{proxy.status() ? (
<QRScan /> <QRScan />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/activation"}> <Route exact path={"/activation"}>
{proxy.status() ? (
<Activation /> <Activation />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/chatroom"}> <Route exact path={"/chatroom"}>
{proxy.status() ? ( <ChatList />
<Chatroom />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/cart"}> <Route exact path={"/cart"}>
{proxy.status() ? (
<Cart /> <Cart />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/mybooks"}> <Route exact path={"/mybooks"}>
{proxy.status() ? (
<MyBooks /> <MyBooks />
) : (
<Redirect
to={{
pathname: "/auth",
}}
/>
)}
</Route> </Route>
<Route exact path={"/ar"}> <Route exact path={"/ar"}>
{proxy.status() ? ( {proxy.status() ? (
@ -214,7 +142,7 @@ class AppRouter extends Component {
</Route> </Route>
) : null} ) : null}
<Route path={""}> <Route path={""}>
{proxy.status() ? ( {proxy.status ? (
<Redirect <Redirect
to={{ to={{
pathname: "/qr", pathname: "/qr",

@ -6,3 +6,4 @@ export { default as chat } from "./chat.js";
export { default as user } from "./user.js"; export { default as user } from "./user.js";
export { default as qr } from "./qr.js"; export { default as qr } from "./qr.js";
export { default as book } from "./book.js"; export { default as book } from "./book.js";
export { default as userProduct } from "./userProduct.js";

@ -0,0 +1,31 @@
import proxy from "../proxy";
const userProduct = {
list:
(data = {}) =>
async (dispatch) =>
await proxy.get("userProduct/list", data, { dispatch }),
info:
(data = {}) =>
async (dispatch) =>
await proxy.get("userProduct/info", data, { dispatch }),
update:
(data = {}, data2 = {}) =>
async (dispatch) => {
await proxy.put("userProduct/update", data);
await proxy.get("userProduct/list", data2, { dispatch });
},
add:
(data = {}, data2 = {}) =>
async (dispatch) => {
await proxy.post("userProduct/add", data);
await proxy.get("userProduct/list", data2, { dispatch });
},
del:
(data = {}, data2 = {}) =>
async (dispatch) => {
await proxy.delete("userProduct/delete", data);
await proxy.get("userProduct/list", data2, { dispatch });
},
};
export default userProduct;

@ -93,7 +93,8 @@ class Proxy {
localStorage.removeItem("userData"); localStorage.removeItem("userData");
return false; return false;
} }
return JSON.parse(userData); let fakeUserData = JSON.parse(userData);
return fakeUserData.profile;
}; };
} }
const _proxy = new Proxy(); const _proxy = new Proxy();

@ -6,3 +6,4 @@ export { default as public } from "./public.js";
export { default as user } from "./user.js"; export { default as user } from "./user.js";
export { default as qr } from "./qr.js"; export { default as qr } from "./qr.js";
export { default as book } from "./book.js"; export { default as book } from "./book.js";
export { default as userProduct } from "./userProduct.js";

@ -1,7 +1,7 @@
import proxy from "../proxy"; import proxy from "../proxy";
import { ToastContainer, toast } from "react-toastify"; import { ToastContainer, toast } from "react-toastify";
const initialState = { const initialState = {
status: null, status: proxy.status(),
loading: false, loading: false,
error: null, error: null,
list: null, list: null,

@ -0,0 +1,28 @@
const initialState = {
loading: false,
error: null,
list: null,
info: null,
};
export default function userProduct(state = initialState, action) {
let { type, data } = action;
switch (type) {
case "userProduct/list":
return { ...state, loading: false, list: data, error: null };
case "userProduct/info":
return { ...state, loading: false, list: null, info: data, error: null };
case "userProduct/update":
return { ...state, loading: false, error: null };
case "userProduct/add":
return { ...state, loading: false, error: null };
case "userProduct/delete":
return { ...state, loading: false, error: null };
/////////////
case "loading":
return { ...state, loading: true };
case "error":
return { ...state, loading: false, error: data.message };
default:
return state;
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 102 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 106 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 90 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 69 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 82 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

@ -25,7 +25,7 @@ export default class Item extends Component {
<> <>
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<article className="mobile-ar-book d-flex flex-column"> <article className="mobile-ar-book d-flex flex-column">
<a href={`https://ar.dnvn.ir/lunch?id=${data.id}`}> <a href={`https://ar.dnvn.ir/lunch?id=${data.id}`} target="_blank">
<img src={data.imageUrl} alt={data.title} /> <img src={data.imageUrl} alt={data.title} />
<h1 style={{ fontSize: fontSize.mobile.h1 }}>{data.title}</h1> <h1 style={{ fontSize: fontSize.mobile.h1 }}>{data.title}</h1>
</a> </a>

@ -0,0 +1,820 @@
//about
let aboutData = {
fury: {
title: "ماموریت ما در دانوین",
text: "لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت",
},
keywords: {
title: "کلمات کلیدی ماموریت",
list: [
"کیفیت آموزش",
"جذابیت",
"سازگار با نظام آموزش و پرورش",
"در راستای نیل به سند تحول",
],
},
advantages: {
title: "مزیت رقابت اصلی",
list: [
"بکارگیری بروزترین تکنولوژی های تولید و مدیریت محتوای آموزشی-تربیتی (مانند واقعیت افزوده)",
"دارای رویکرد آموزش سرگرم کننده",
"بستر تعاملی و اشتراک گذاری فیلم و محتوای آموزشی",
"رویکرد معرفتی - ارزشی",
"ویدیوهای منحصر بفرد",
"متن گفتگو محور - روایی- قابل فهم - جذاب و سرگرم کننده",
],
},
};
//ar, images => http://localhost:3000/ar
arData = [
{
id: 222,
title: "دانوین زیست دهم",
imageUrl: zist_10,
},
{
id: 223,
title: "دانوین شیمی نهم",
imageUrl: chemistry_10,
},
{
id: 225,
title: "دانوین علوم نهم",
imageUrl: sciense_6,
},
{
id: 226,
title: "دانوین علوم هشتم",
imageUrl: sciense_8,
},
{
id: 227,
title: "دانوین علوم هفتم",
imageUrl: sciense_7,
},
{
id: 228,
title: "دانوین علوم ششم",
imageUrl: sciense_6,
},
];
//cart
deliveryMethods = [
{
name: "ارسال با پست پیشتاز",
price: 36.891,
},
{
name: "ارسال با پیک موتوری",
price: 36.891,
},
];
//contact
let contactData = {
address: "fdsfds",
cellphone: "32432",
email: "fsdafs",
};
//faq
let messages = [
{
id: 0,
title: "چگونه میتوانم در سایت ثبت نام کنم و کتاب سفارش دهم؟",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
active: false,
},
{
id: 1,
title: "نحوه سفارش برای خارج از کشور چگونه است؟",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
active: false,
},
{
id: 2,
title: "آیا داشتن رمز دوم برای خریدهای اینترنتی لازم است؟",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
active: false,
},
{
id: 3,
title: "در صورت فراموشی رمزعبور باید چکار کنیم؟",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
active: false,
},
{
id: 4,
title: "امکان بازگشت وجه تا چند روز ممکن است؟",
description:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
active: false,
},
];
//home
let mobileData = [
{
type: "slider",
title: "",
height: window.innerWidth > 1000 ? 370 : 203,
design: "header",
number: 1,
data: [
{
id: 0,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
{
id: 1,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
{
id: 2,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
],
},
{
type: "static",
title: "",
height: 160,
data: [
{
id: 0,
imageUrl: qr,
backgroundColor: {
first: "#2070CBED",
second: "#2070CBED",
angle: "180deg",
},
design: "flex",
title: "QR خوان",
subTitle: "در صفحات کتاب هوشمند",
link: "/qr-scan",
badge: "",
flex: 1,
fontSize: "large",
color: "white",
},
{
id: 1,
imageUrl: home_ar,
backgroundColor: {
first: "#09DA76",
second: "#056D3B",
angle: "230deg",
},
design: "flex",
title: "واقعیت افزوده",
subTitle: "توضیحات مختصر در این رابطه",
link: "/ar",
badge: "",
flex: 1,
fontSize: "large",
color: "white",
},
],
},
{
type: "static",
title: "",
height: 160,
data: [
{
id: 0,
imageUrl: home_chat,
backgroundColor: {
first: "#0AB81B",
second: "#6CFF61",
angle: "110deg",
},
design: "flex",
title: "دانوینی ها",
subTitle: "",
link: "/chatroom",
badge: "5 پیام جدید",
flex: 1.6,
fontSize: "normal",
color: "white",
},
{
id: 1,
imageUrl: myBook,
backgroundColor: {
first: "#9446FCaa",
second: "#9446FCaa",
angle: "180deg",
},
design: "simple",
title: "کتابهای من",
subTitle: "",
justifyContent: "flex-start",
alignItems: "center",
link: "/mybooks",
badge: "",
flex: 1,
fontSize: "large",
color: "white",
},
],
},
{
type: "static",
title: "",
height: 160,
data: [
{
id: 0,
imageUrl: homeBlog,
backgroundColor: {
first: "#39BF55",
second: "#39BF4B55",
angle: "110deg",
},
design: "simple",
title: "بلاگ",
subTitle: "",
justifyContent: "center",
alignItems: "center",
link: "/blog",
badge: "",
flex: 1.2,
fontSize: "normal",
color: "white",
},
{
id: 1,
backgroundColor: {
first: "#5DBEFF",
second: "#0483D9",
angle: "180deg",
},
design: "vitrin",
title: "فروشگاه",
subTitle: "",
justifyContent: "flex-start",
alignItems: "center",
books: [
{ id: 0, imageUrl: sciense_6 },
{ id: 1, imageUrl: chemistry_10 },
{ id: 2, imageUrl: sciense_8 },
],
link: "/products",
badge: "",
flex: 2,
fontSize: "large",
color: "white",
},
],
},
{
type: "static",
title: "",
data: [
{
id: 0,
design: "3d",
flex: 1,
subData: [
{
id: 0,
imageUrl: "",
backgroundColor: {
first: "#FC365F",
second: "#7E1B30",
angle: "254deg",
},
design: "simple",
title: "پیشتیبانی",
subTitle: "",
justifyContent: "center",
alignItems: "center",
link: "/contact",
badge: "",
flex: 1,
fontSize: "normal",
color: "white",
},
{
id: 1,
imageUrl: "",
backgroundColor: {
first: "#FFCC00",
second: "#FF9800",
angle: "105deg",
},
design: "simple",
title: "پروفایل",
subTitle: "",
justifyContent: "center",
alignItems: "center",
link: "/profile",
badge: "",
flex: 1,
fontSize: "normal",
color: "white",
},
],
},
{
id: 1,
imageUrl: bookActivation,
backgroundColor: {
first: "#03FCDA7F",
second: "#03FCDA7F",
angle: "180deg",
},
design: "simple",
title: "فعال سازی کتاب",
subTitle: "",
justifyContent: "center",
alignItems: "center",
link: "/activation",
badge: "",
flex: 1,
fontSize: "large",
color: "white",
},
],
},
];
let homeData = [
{
type: "slider",
title: "",
height: window.innerWidth > 1000 ? 370 : 233,
design: "header",
number: 1,
data: [
{
id: 0,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
{
id: 1,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
{
id: 2,
image: pic1,
width: "100%",
backgroundColor: "rgba(18, 159, 253,0.6)",
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "کاملا تضمینی با نمونه های موفق انفجاری",
link: "",
buttonText: "اطلاعات بیشتر",
},
],
},
{
type: window.innerWidth > 1000 ? "" : "static",
title: "",
height: 150,
data: [
{
image: qr,
width: 48,
link: "",
topText: "QR خوان",
bottomText: "توضیحات مختصر در این رابطه",
},
{
image: ar,
width: 48,
link: "",
topText: "واقعیت افزوده",
bottomText: "توضیحات مختصر در این رابطه",
},
],
},
{
type: window.innerWidth > 1000 ? "static" : "",
title: "",
height: 150,
data: [
{
image: online,
width: 24,
link: "",
topText: "دسترسی به محتوای آموزشی",
bottomText: "از تمامی دستگاهها",
},
{
image: chemistry,
width: 24,
link: "",
topText: " به صورت زنده و جالب انگیز",
bottomText: "آزمایش انجام دهید",
},
{
image: calculator,
width: 24,
link: "",
topText: "به صرفه تر هزینه کنید",
bottomText: "با خرید یکی دوتا ببرید",
},
{
image: homework,
width: 24,
link: "",
topText: "به صورت کاملا تعاملی",
bottomText: "درسهای خود را یاد بگیرید",
},
],
},
{
type: "search",
data: ["همه", "پرفروش"],
},
{
type: window.innerWidth > 1000 ? "slider" : "scroll",
title: "کتابهای من",
moreText: "لیست کتابها",
height: window.innerWidth > 1000 ? 340 : 270,
design: window.innerWidth > 1000 ? "simple" : "myProduct",
number: window.innerWidth > 1000 ? 4 : 2.8,
data: [
{
id: 0,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
},
{
id: 1,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
},
{
id: 2,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
},
{
id: 3,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
},
{
id: 4,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
},
{
id: 5,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
},
{
id: 6,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
},
{
id: 7,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
},
{
id: 8,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
},
{
id: 9,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
},
],
},
{
type: window.innerWidth < 1000 ? "scroll" : "",
title: "موضوعات",
moreText: "تمام موضوعات",
design: "subjects",
number: 4,
data: [
{ id: 0, name: "علوم طبیعی", backgroundColor: "yellow" },
{ id: 1, name: "شیمی الی", backgroundColor: "red" },
{ id: 2, name: "زمین شناسی", backgroundColor: "blue" },
{ id: 3, name: "ریاضیات", backgroundColor: "purple" },
],
},
{
type: window.innerWidth > 1000 ? "slider" : "scroll",
title: "پرفروشترین کتابهای دانوین",
moreText: "لیست کتابها",
height: window.innerWidth > 1000 ? 420 : 320,
design: window.innerWidth > 1000 ? "simple" : "product",
number: window.innerWidth > 1000 ? 4 : 2.8,
data: [
{
id: 0,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
date: new Date(),
},
{
id: 1,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
date: new Date(),
},
{
id: 2,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
},
{
id: 3,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
},
{
id: 4,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
},
{
id: 5,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
date: new Date(),
},
{
id: 6,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
date: new Date(),
},
{
id: 7,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
date: new Date(),
},
{
id: 8,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
date: new Date(),
},
{
id: 9,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
date: new Date(),
},
],
},
{
type: window.innerWidth > 1000 ? "slider" : "scroll",
title: "جدیدترین کتابهای دانوین",
height: window.innerWidth > 1000 ? 420 : 320,
design: window.innerWidth > 1000 ? "tab" : "product",
number: window.innerWidth > 1000 ? 4 : 3.5,
moreText: "لیست کتابها",
data: [
{
id: 0,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
date: new Date(),
},
{
id: 1,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
date: new Date(),
},
{
id: 2,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
},
{
id: 3,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
},
{
id: 4,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
},
{
id: 5,
image: sciense_6,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "78.000",
oldPrice: "",
date: new Date(),
},
{
id: 6,
image: chemistry_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "39.000",
oldPrice: "59.000",
date: new Date(),
},
{
id: 7,
image: sciense_8,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه ششم ابتدایی",
price: "21.000",
oldPrice: "",
date: new Date(),
},
{
id: 8,
image: sciense_9,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه دهم ابتدایی",
price: "",
oldPrice: "",
date: new Date(),
},
{
id: 9,
image: zist_10,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle: "پایه هفتم ابتدایی",
price: "59.000",
oldPrice: "",
date: new Date(),
},
],
},
{
type: "singleBlog",
height: 350,
direction: "rtl",
data: {
id: 0,
image: pic,
video: null,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است، و برای شرایط فعلی تکنولوژی مورد نیاز، و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد، کتابهای زیادی در شصت و سه درصد گذشته حال و آینده، شناخت فراوان جامعه و متخصصان را می طلبد، تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه ای علی الخصوص طراحان خلاقی، و فرهنگ پیشرو در زبان فارسی ایجاد کرد، در این صورت می توان امید داشت که تمام و دشواری موجود در ارائه راهکارها، و شرایط سخت تایپ به پایان رسد و زمان مورد نیاز شامل حروفچینی دستاوردهای اصلی، و جوابگوی سوالات پیوسته اهل دنیای موجود طراحی اساسا مورد استفاده قرار گیرد.",
link: "",
buttonText: "اطلاعات بیشتر",
},
},
{
type: "slider",
title: "بلاگ",
height: "",
design: "blog",
number: window.innerWidth > 1000 ? 3 : 2,
data: [
{
id: 0,
image: blog1,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه ",
date: new Date(),
link: "",
buttonText: "ادامه مطلب",
category: { name: "علمی تخیلی", color: "red" },
duration: "۲۰ دقیقه",
},
{
id: 1,
image: blog2,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه ",
date: new Date(),
link: "",
buttonText: "ادامه مطلب",
category: { name: "تاریخی", color: "blue" },
duration: "۲۰ دقیقه",
},
{
id: 2,
image: blog3,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه ",
link: "",
buttonText: "ادامه مطلب",
category: { name: "ورزشی", color: "green" },
duration: "۲۰ دقیقه",
},
{
id: 3,
image: pic,
title: "منفجر کردن مغز خود را به ما بسپارید",
subTitle:
"لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ، و با استفاده از طراحان گرافیک است، چاپگرها و متون بلکه روزنامه ",
link: "",
buttonText: "ادامه مطلب",
category: { name: "سیاسی", color: "purple" },
duration: "۲۰ دقیقه",
},
],
},
{
type: "membership",
},
];
//product

Binary file not shown.

@ -0,0 +1,4 @@
//comment modal
//comment for book or bookPage
//user can edit self comment
//trophy

@ -11,6 +11,7 @@ import danger from "../../assets/icons/danger.svg";
import "./index.scss"; import "./index.scss";
const maxDesktopSize = 1250; const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = { const fontSize = {
desktop: { desktop: {
@ -20,6 +21,12 @@ const fontSize = {
span: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 75, span: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 75,
form: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 70, form: window.innerWidth > maxDesktopSize ? 18 : window.innerWidth / 70,
}, },
mobile: {
h1: window.innerWidth > maxMobileSize ? 24 : window.innerWidth / 15,
p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28,
form: window.innerWidth > maxMobileSize ? 18 : window.innerWidth / 24,
span: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 25,
},
}; };
export default class Activation extends Component { export default class Activation extends Component {
@ -88,16 +95,23 @@ export default class Activation extends Component {
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<div className="mobile-activation d-flex flex-column align-items-center"> <div className="mobile-activation d-flex flex-column align-items-center">
<Navbar /> <Navbar />
<div className="mobile-activation__back d-flex"> <div
<Link to="/">بازگشت</Link> style={{ fontSize: fontSize.mobile.span }}
className="mobile-activation__back d-flex"
>
<Link to="/" style={{ fontSize: fontSize.mobile.span }}>
بازگشت
</Link>
</div> </div>
<header className="mobile-activation__header d-flex flex-column align-items-center"> <header className="mobile-activation__header d-flex flex-column align-items-center">
<img src={analytics} alt="فعال سازی کتاب" /> <img src={analytics} alt="فعال سازی کتاب" />
<h1>فعال سازی کتاب الکترونیک</h1> <h1 style={{ fontSize: fontSize.mobile.h1 }}>
فعال سازی کتاب الکترونیک
</h1>
</header> </header>
<div className="mobile-activation__description d-flex"> <div className="mobile-activation__description d-flex">
<span>.</span> <span>.</span>
<p> <p style={{ fontSize: fontSize.mobile.p }}>
کد فعال سازی در اختیار شما قرار گرفته است را در قسمت زیر وارد کد فعال سازی در اختیار شما قرار گرفته است را در قسمت زیر وارد
وارد تا کتاب الکترونیک آن فعالسازی شود وارد تا کتاب الکترونیک آن فعالسازی شود
</p> </p>
@ -112,10 +126,14 @@ export default class Activation extends Component {
maxLength={9} maxLength={9}
autoComplete="off" autoComplete="off"
onChange={(e) => this.setState({ code: e.target.value })} onChange={(e) => this.setState({ code: e.target.value })}
placeholder={"FC5DFD : مثال"}
style={{ fontSize: fontSize.mobile.form }}
/> />
<button type="submit">ثبت کد فعال سازی</button> <button style={{ fontSize: fontSize.mobile.form }} type="submit">
ثبت کد فعال سازی
</button>
</form> </form>
<div className="mobile-activation__support d-flex align-center"> {/* <div className="mobile-activation__support d-flex align-center">
<span> <span>
<img src={danger} /> <img src={danger} />
</span> </span>
@ -123,13 +141,13 @@ export default class Activation extends Component {
کد فعال سازی در اختیار شما قرار گرفته است را در قسمت زیر وارد کد فعال سازی در اختیار شما قرار گرفته است را در قسمت زیر وارد
وارد تا کتاب الکترونیک آن فعالسازی شود وارد تا کتاب الکترونیک آن فعالسازی شود
</p> </p>
</div> </div> */}
<div className="mobile-activation__history d-flex flex-column"> {/* <div className="mobile-activation__history d-flex flex-column">
<h2>آخرین مشاهدات</h2> <h2>آخرین مشاهدات</h2>
{data.map((item, i) => ( {data.map((item, i) => (
<History data={item} key={i} /> <History data={item} key={i} />
))} ))}
</div> </div> */}
</div> </div>
) : null} ) : null}
</> </>

@ -14,9 +14,8 @@
font-family: numeralLight; font-family: numeralLight;
text-decoration: none; text-decoration: none;
padding: 5px 20px 3px; padding: 5px 20px 3px;
background-color: #00CC69; background-color: #00cc69;
border-radius: 25px; border-radius: 25px;
font-size: calc(100vw / 26);
color: white; color: white;
&:focus:enabled { &:focus:enabled {
text-decoration: none; text-decoration: none;
@ -26,10 +25,9 @@
&__header { &__header {
margin-top: 30px; margin-top: 30px;
h1 { h1 {
font-size: calc(100vw / 16);
font-family: numeralBold; font-family: numeralBold;
margin-top: 15px; margin-top: 15px;
color: #00CC69; color: #00cc69;
letter-spacing: -2px; letter-spacing: -2px;
} }
} }
@ -38,62 +36,64 @@
margin-top: 30px; margin-top: 30px;
span { span {
font-size: 50px; font-size: 50px;
color: #00CC69; color: #00cc69;
margin-left: 10px; margin-left: 10px;
position: relative; position: relative;
bottom: 35px; bottom: 35px;
} }
p { p {
font-size: calc(100vw / 30); color: #6f7074;
color: #6F7074;
font-family: numeralMedium; font-family: numeralMedium;
} }
} }
&__form { &__form {
width: 100%; width: 100%;
padding: 0px 15px;
font-family: numeralMedium; font-family: numeralMedium;
position: fixed;
bottom: 20px;
input { input {
width: 100%; width: 100%;
background-color: #F6F6F6; background-color: #f6f6f6;
color: #4D4D4F; color: #4d4d4f;
text-align: center; text-align: center;
direction: ltr; direction: ltr;
font-size: calc(100vw / 18);
border: 0px; border: 0px;
padding: 15px 0px; padding: 15px 0px;
border-radius: 10px; border-radius: 10px;
&:focus { &:focus {
outline: 0px; outline: 0px;
} }
&::placeholder {
color: #afafaf;
}
} }
button { button {
display: inline; display: inline;
font-family: numeralLight; font-family: numeralLight;
text-decoration: none; text-decoration: none;
padding: 14px 20px 14px; padding: 14px 20px 14px;
background-color: #00CC69; background-color: #00cc69;
border-radius: 10px; border-radius: 10px;
font-size: calc(100vw / 18);
color: white; color: white;
border: 0px; border: 0px;
margin-top: 10px; margin-top: 20px;
letter-spacing: -1px; letter-spacing: -1px;
&:focus:enabled { &:focus:enabled {
text-decoration: none; text-decoration: none;
} }
} }
} }
&__support { &__support {
width: 80%; width: 80%;
margin-top: 30px; margin-top: 30px;
span { span {
color: #00CC69; color: #00cc69;
margin-left: 10px; margin-left: 10px;
} }
p { p {
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
color: #6F7074; color: #6f7074;
font-family: numeralMedium; font-family: numeralMedium;
text-align: center; text-align: center;
} }
@ -103,14 +103,13 @@
margin: 30px 0px; margin: 30px 0px;
h2 { h2 {
font-family: numeralBold; font-family: numeralBold;
color: #02A255; color: #02a255;
font-size: calc(100vw / 24); font-size: calc(100vw / 24);
margin-bottom: 20px; margin-bottom: 20px;
} }
} }
} }
.activation { .activation {
width: 100vw; width: 100vw;
max-width: 1250px; max-width: 1250px;
@ -128,7 +127,7 @@
h1 { h1 {
font-family: numeralBold; font-family: numeralBold;
margin-top: 15px; margin-top: 15px;
color: #00CC69; color: #00cc69;
letter-spacing: -2px; letter-spacing: -2px;
} }
} }
@ -138,14 +137,14 @@
max-width: 900px; max-width: 900px;
span { span {
font-size: 50px; font-size: 50px;
color: #00CC69; color: #00cc69;
margin-left: 10px; margin-left: 10px;
position: relative; position: relative;
bottom: 42px; bottom: 42px;
} }
p { p {
font-size: calc(100vw / 30); font-size: calc(100vw / 30);
color: #6F7074; color: #6f7074;
font-family: numeralMedium; font-family: numeralMedium;
} }
} }
@ -156,8 +155,8 @@
justify-content: space-between; justify-content: space-between;
input { input {
width: 70%; width: 70%;
background-color: #F6F6F6; background-color: #f6f6f6;
color: #4D4D4F; color: #4d4d4f;
text-align: center; text-align: center;
direction: ltr; direction: ltr;
border: 0px; border: 0px;
@ -174,7 +173,7 @@
font-family: numeralLight; font-family: numeralLight;
text-decoration: none; text-decoration: none;
padding: 16px 20px 16px; padding: 16px 20px 16px;
background-color: #00CC69; background-color: #00cc69;
border-radius: 10px; border-radius: 10px;
color: white; color: white;
border: 0px; border: 0px;
@ -183,7 +182,6 @@
text-decoration: none; text-decoration: none;
} }
} }
} }
&__support { &__support {
width: 100%; width: 100%;
@ -191,7 +189,7 @@
margin-top: 30px; margin-top: 30px;
align-items: center; align-items: center;
span { span {
color: #00CC69; color: #00cc69;
margin-left: 10px; margin-left: 10px;
} }
p { p {
@ -207,7 +205,7 @@
margin: 50px 0px; margin: 50px 0px;
h2 { h2 {
font-family: numeralBold; font-family: numeralBold;
color: #02A255; color: #02a255;
margin-bottom: 20px; margin-bottom: 20px;
} }
} }

@ -10,7 +10,6 @@
font-family: numeralLight; font-family: numeralLight;
} }
span { span {
font-size: calc(100vw / 30);
color: #bfbfbf; color: #bfbfbf;
} }
input { input {
@ -21,15 +20,37 @@
width: 42px; width: 42px;
text-align: center; text-align: center;
direction: ltr; direction: ltr;
font-size: calc(100vw / 26);
&:focus { &:focus {
outline: 0px; outline: 0px;
} }
&::placeholder { &::placeholder {
font-size: calc(100vw / 30);
color: #bfbfbf; color: #bfbfbf;
} }
} }
@media screen and (max-width: 1000px) {
span {
font-size: 14px;
}
input {
font-size: 14px;
&::placeholder {
font-size: 15px;
}
}
}
@media screen and (max-width: 550px) {
span {
font-size: calc(100vw / 30);
}
input {
font-size: calc(100vw / 26);
&::placeholder {
font-size: calc(100vw / 30);
}
}
}
} }
.birthdate { .birthdate {

@ -0,0 +1,92 @@
import React from "react";
import AddAPhotoIcon from "@material-ui/icons/AddAPhoto";
import "./index.scss";
const maxDesktopSize = 1250;
const maxMobileSize = 550;
const fontSize = {
desktop: {
span: window.innerWidth > maxDesktopSize ? 14 : window.innerWidth / 80,
},
mobile: {
span: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 30,
},
};
export default function Document(props) {
const { parent, name } = props;
return (
<>
{window.innerWidth < 1000 ? (
<div className="mobile-auth-profile__document d-flex justify-content-center align-items-center mb-3">
{parent.state.docFileIds === "" ? (
<>
<input
type="file"
// parent.onChange(e.target.name, e.target.value)
name={name}
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/>
<span style={{ fontSize: fontSize.mobile.span }}>
گواهی تدریس خود را آپلود کنید.
</span>
</>
) : (
<>
<input
type="file"
name="file"
onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/>
<span style={{ color: "rgb(18,140,126)" }}>
{parent.state.docFileIds.name}
</span>
{/* <img src={parent.state.file} alt={"کاربر"} /> */}
</>
)}
</div>
) : null}
{window.innerWidth > 1000 ? (
<div className="auth-profile__upload d-flex justify-content-center-align-items-center">
{parent.state.file === null ? (
<>
<input
label={props.label}
onChange={(e) => parent.onChange(e.target.name, e.target.value)}
name={props.name}
defaultValue=""
type="file"
/>
<AddAPhotoIcon
style={{
width: 40,
height: 40,
color: "grey",
position: "absolute",
left: "calc(50% - 20px)",
top: "calc(50% - 20px)",
}}
/>
</>
) : (
<>
<input
label={props.label}
onChange={(e) => parent.onChange(e.target.name, e.target.value)}
name={props.name}
defaultValue=""
type="file"
/>
</>
)}
</div>
) : null}
</>
);
}

@ -0,0 +1,28 @@
.mobile-auth-profile {
&__document {
margin: 10px auto;
width: 100%;
height: 50px;
border-radius: 10px;
border: 2px dashed rgb(209, 209, 209);
position: relative;
input {
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
opacity: 0;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 50%;
}
span {
color: #afafaf;
font-family: numeralLight;
}
}
}

@ -15,7 +15,7 @@ export default function GenderSwitch(props) {
girl: { girl: {
fontSize: window.innerWidth > 1000 ? fontSize.desktop : fontSize.mobile, fontSize: window.innerWidth > 1000 ? fontSize.desktop : fontSize.mobile,
color: selectedOption === options[1] ? "white" : "grey", color: selectedOption === options[1] ? "white" : "grey",
backgroundColor: selectedOption === options[1] ? "green" : "white", backgroundColor: selectedOption === options[1] ? "#128c7e" : "white",
border: selectedOption === options[1] ? "0px" : "1px solid #ccc", border: selectedOption === options[1] ? "0px" : "1px solid #ccc",
borderTopLeftRadius: 10, borderTopLeftRadius: 10,
borderBottomLeftRadius: 10, borderBottomLeftRadius: 10,
@ -23,7 +23,7 @@ export default function GenderSwitch(props) {
boy: { boy: {
fontSize: window.innerWidth > 1000 ? fontSize.desktop : fontSize.mobile, fontSize: window.innerWidth > 1000 ? fontSize.desktop : fontSize.mobile,
color: selectedOption === options[0] ? "white" : "grey", color: selectedOption === options[0] ? "white" : "grey",
backgroundColor: selectedOption === options[0] ? "green" : "white", backgroundColor: selectedOption === options[0] ? "#128c7e" : "white",
border: selectedOption === options[0] ? "0px" : "1px solid #ccc", border: selectedOption === options[0] ? "0px" : "1px solid #ccc",
borderTopRightRadius: 10, borderTopRightRadius: 10,
borderBottomRightRadius: 10, borderBottomRightRadius: 10,

@ -18,7 +18,7 @@ export default function FormPropsTextFields(props) {
})); }));
const classes = useStyles(); const classes = useStyles();
const { parent, defaultValue } = props; const { parent, defaultValue, maxLength, inputMode } = props;
return ( return (
<form className={classes.root} noValidate autoComplete="off"> <form className={classes.root} noValidate autoComplete="off">
<div> <div>
@ -29,6 +29,8 @@ export default function FormPropsTextFields(props) {
variant="outlined" variant="outlined"
onChange={(e) => parent.onChange(e.target.name, e.target.value)} onChange={(e) => parent.onChange(e.target.name, e.target.value)}
defaultValue={defaultValue[props.name]} defaultValue={defaultValue[props.name]}
maxLength={maxLength}
inputMode={inputMode}
/> />
</div> </div>
</form> </form>
@ -37,4 +39,6 @@ export default function FormPropsTextFields(props) {
FormPropsTextFields.defaultProps = { FormPropsTextFields.defaultProps = {
align: "right", align: "right",
maxLength: "",
inputMode: "numeric",
}; };

@ -5,6 +5,6 @@
border: 1px solid #ccc !important; border: 1px solid #ccc !important;
margin: 0px !important; margin: 0px !important;
.MuiInput-formControl { .MuiInput-formControl {
margin: 9px 0px 15px !important; margin: 9px 0px 8px !important;
} }
} }

@ -6,29 +6,7 @@ import InputBase from "@material-ui/core/InputBase";
import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown"; import KeyboardArrowDownIcon from "@material-ui/icons/KeyboardArrowDown";
import InputLabel from "@material-ui/core/InputLabel"; import InputLabel from "@material-ui/core/InputLabel";
const BootstrapInput = withStyles((theme) => ({ const BootstrapInput = withStyles((theme) => ({}))(InputBase);
root: {
"label + &": {
marginTop: theme.spacing(3),
},
input: {
borderRadius: 4,
position: "relative",
// backgroundColor: theme.palette.background.paper,
border: "1px solid #a5a5a5",
fontSize: window.innerWidth > 1000 ? 16 : "calc(100vw / 30)",
color: "#a5a5a5",
// maxWidth : 70,
minWidth: "100%",
padding: "0px",
// Use the system font instead of the default Roboto font.
fontFamily: "numeralLight",
"&:focus": {
borderRadius: 4,
},
},
},
}))(InputBase);
const useStyles = makeStyles((theme) => ({ const useStyles = makeStyles((theme) => ({
marginLeft: { marginLeft: {

@ -21,7 +21,9 @@ export default function Upload(props) {
<input <input
type="file" type="file"
name="file" name="file"
onChange={(e) => parent.onChange(e.target.name, e.target.value)} onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/> />
<AddAPhotoIcon <AddAPhotoIcon
style={{ width: 40, height: 40, color: "white" }} style={{ width: 40, height: 40, color: "white" }}
@ -32,16 +34,18 @@ export default function Upload(props) {
<input <input
type="file" type="file"
name="file" name="file"
onChange={(e) => parent.onChange(e.target.name, e.target.value)} onChange={(e) =>
parent.onChange(e.target.name, e.target.files[0])
}
/> />
<img src={this.props.user.icon} alt={"کاربر"} /> {/* <img src={parent.state.file} alt={"کاربر"} /> */}
</> </>
)} )}
</div> </div>
) : null} ) : null}
{window.innerWidth > 1000 ? ( {window.innerWidth > 1000 ? (
<div className="auth-profile__upload d-flex justify-content-center-align-items-center"> <div className="auth-profile__upload d-flex justify-content-center-align-items-center">
{parent.state.file === null ? ( {parent.state.file === "" ? (
<> <>
<input <input
label={props.label} label={props.label}
@ -70,6 +74,9 @@ export default function Upload(props) {
defaultValue="" defaultValue=""
type="file" type="file"
/> />
<span style={{ color: "rgb(18,140,126)" }}>
{parent.state.file.name}
</span>
</> </>
)} )}
</div> </div>

@ -10,7 +10,7 @@ import Gender from "./GenderSwitch/index";
import Birthdate from "./Birthdate/index"; import Birthdate from "./Birthdate/index";
import MultipleSelector from "./MultipleSelector/index"; import MultipleSelector from "./MultipleSelector/index";
import Loader from "~/components/Loader/index"; import Loader from "~/components/Loader/index";
import Document from "./Document/index";
import logo from "../../../assets/icons/logo.png"; import logo from "../../../assets/icons/logo.png";
import pic from "../../../assets/images/pic.png"; import pic from "../../../assets/images/pic.png";
@ -29,18 +29,26 @@ const fontSize = {
p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28, p: window.innerWidth > maxMobileSize ? 14 : window.innerWidth / 28,
}, },
}; };
const toastMessages = {
firstName: "نام وارد شده صحیح نیست!",
lastName: "نام خانوادگی وارد شده صحیح نیست!",
username: "نام کاربری صحیح نیست.",
};
class Profile extends Component { class Profile extends Component {
state = { state = {
render: false, render: false,
file: null, file: null,
docFileIds: "",
firstName: "", firstName: "",
lastName: "", lastName: "",
password: "", password: "",
username: "", username: "",
address: "", address: "",
email: "", email: "",
gender: "", gender: "دختر",
userRoleId: "معلم", userRoleId: "دانش آموز",
nationalId: "", nationalId: "",
provinceId: "", provinceId: "",
phone: "", phone: "",
@ -50,9 +58,13 @@ class Profile extends Component {
postalCode: "", postalCode: "",
gradeId: [], gradeId: [],
validation: { validation: {
firstName: { name: "نام", status: "" }, firstName: "",
lastName: { name: "نام خانوادگی", status: "" }, lastName: "",
username: { name: "نام کاربری", status: "" }, username: "",
email: "",
postalCode: "",
nationalId: "",
schoolId: "",
}, },
}; };
@ -65,6 +77,12 @@ class Profile extends Component {
this.setState((prevState) => ({ this.setState((prevState) => ({
gradeId: [...prevState.gradeId, value], gradeId: [...prevState.gradeId, value],
})); }));
}
if (name === "userRoleId") {
this.setState({
gradeId: [],
[name]: value,
});
} else { } else {
this.setState({ this.setState({
[name]: value, [name]: value,
@ -350,6 +368,8 @@ class Profile extends Component {
parent={this} parent={this}
align="left" align="left"
defaultValue={profile} defaultValue={profile}
maxLength={10}
inputMode="numeric"
/> />
<Birthdate /> <Birthdate />
<Gender <Gender
@ -402,7 +422,7 @@ class Profile extends Component {
/> />
) : null} ) : null}
{this.state.userRoleId === "دانش آموز" && {this.state.userRoleId === "دانش آموز" &&
this.state.gradeId.length > 0 ? ( Number(this.state.gradeId) > 9 ? (
<Select <Select
parent={this} parent={this}
options={[ options={[
@ -453,6 +473,9 @@ class Profile extends Component {
defaultValue={profile} defaultValue={profile}
/> />
) : null} ) : null}
{this.state.userRoleId === "معلم" ? (
<Document parent={this} name="docFileIds" />
) : null}
<Input <Input
parent={this} parent={this}
name="postalCode" name="postalCode"

@ -4,27 +4,29 @@
overflow-y: scroll; overflow-y: scroll;
position: relative; position: relative;
padding: 15px; padding: 15px;
max-width: 550px;
margin: 0px auto;
img { img {
width: calc(100% / 2.5); // width: calc(100% / 2.5);
max-width: 200px;
transform: translateX(15px);
} }
h1 { h1 {
margin-top: 15px; margin-top: 15px;
font-family: numeralBold; font-family: numeralBold;
font-size: calc(100vw / 15);
color: #6f7074; color: #6f7074;
letter-spacing: -1px; letter-spacing: -1px;
} }
p { p {
font-family: numeralLight; font-family: numeralLight;
font-size: calc(100vw / 22);
color: #6f7074; color: #6f7074;
letter-spacing: -1px; letter-spacing: -1px;
text-align: justify; text-align: justify;
} }
&__upload { &__upload {
margin: 10px auto; margin: 10px auto;
min-width: 120px; min-width: 130px;
min-height: 120px; min-height: 130px;
border-radius: 50%; border-radius: 50%;
background-color: rgb(209, 209, 209); background-color: rgb(209, 209, 209);
position: relative; position: relative;
@ -43,24 +45,6 @@
border-radius: 50%; border-radius: 50%;
} }
} }
// .MuiFormControl-root {
// min-width: 310px;
// width: 80%;
// max-width: 400px;
// margin-top: 20px;
// border: 1px solid #eee;
// border-radius: 5px;
// padding : 10px 8px;
// .MuiInputBase-input{
// color: #00cba2 !important;
// font-size: 18px;
// &::placeholder{
// font-size: 14px;
// color: black;
// letter-spacing: -1px;
// }
// }
// }
.MuiFormControl-root { .MuiFormControl-root {
width: 100%; width: 100%;
@ -80,13 +64,11 @@
border-color: #cecece !important; border-color: #cecece !important;
border-width: 1px !important; border-width: 1px !important;
color: green !important; color: green !important;
font-size: calc(100vw / 22) !important;
border-radius: 10px !important; border-radius: 10px !important;
} }
.MuiOutlinedInput-input { .MuiOutlinedInput-input {
padding: 15px 14px !important; padding: 15px 14px !important;
font-size: calc(100vw / 28) !important;
} }
.MuiInputLabel-outlined { .MuiInputLabel-outlined {
font-family: numeralLight !important; font-family: numeralLight !important;
@ -112,7 +94,6 @@
background-color: white; background-color: white;
width: fit-content; width: fit-content;
text-align: center; text-align: center;
font-size: calc(100vw / 27) !important;
color: #797979 !important; color: #797979 !important;
letter-spacing: -1px; letter-spacing: -1px;
} }
@ -142,6 +123,22 @@
padding: 12px 0px; padding: 12px 0px;
} }
} }
@media screen and (max-width: 1000px) {
.MuiOutlinedInput-input {
font-size: 15px !important;
}
label {
font-size: 14px !important;
}
}
@media screen and (max-width: 550px) {
.MuiOutlinedInput-input {
font-size: calc(100vw / 28) !important;
}
label {
font-size: calc(100vw / 27) !important;
}
}
} }
.auth-profile { .auth-profile {

@ -1,28 +1,33 @@
import React from "react"; import React from "react";
import { connect } from "react-redux";
import { userProduct } from "~/Redux/actions";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
import Navbar from "../Home/Navbar/index"; import Navbar from "../Home/Navbar/index";
import Footer from "../Home/Footer/index"; import Footer from "../Home/Footer/index";
import sciense_6 from "../../assets/images/sciense-6.png"; import sciense_6 from "~/assets/images/olum6.jpg";
import sciense_8 from "../../assets/images/sciense-8.png"; import sciense_8 from "~/assets/images/olum8.jpg";
import sciense_9 from "../../assets/images/sciense-9.png"; import sciense_9 from "~/assets/images/olum9.jpg";
import sciense_7 from "../../assets/images/sciense-7.png"; import sciense_7 from "~/assets/images/olum7.jpg";
import basket from "../../assets/icons/basket.png"; import shimi_10 from "~/assets/images/shimi10.jpg";
import zist_10 from "~/assets/images/zist10.jpg";
import "./index.scss";
const maxDesktopSize = 1250; const maxDesktopSize = 1250;
const maxMobileSize = 550; const maxMobileSize = 550;
const fontSize = { const fontSize = {
mobile: { mobile: {
h1: window.innerWidth > maxMobileSize ? 24 : window.innerWidth / 15, h1: window.innerWidth > maxMobileSize ? 24 : window.innerWidth / 17,
a: window.innerHeight > maxMobileSize ? 15 : window.innerWidth / 30, a: window.innerHeight > maxMobileSize ? 15 : window.innerWidth / 30,
}, },
}; };
export default class MyBooks extends React.Component { class MyBooks extends React.Component {
componentDidMount() {
this.props.getList();
}
render() { render() {
const { books } = this.props; const { books } = this.props;
return ( return (
@ -37,9 +42,9 @@ export default class MyBooks extends React.Component {
) : null} ) : null}
{window.innerWidth < 1000 ? ( {window.innerWidth < 1000 ? (
<> <>
<div className="mobile-mybooks d-flex flex-column"> <div className="mobile-products d-flex flex-column">
<Navbar /> <Navbar />
<h1 style={{ fontSize: fontSize.mobile.h1 }}>کتابهای من</h1> {/* <h1 style={{ fontSize: fontSize.mobile.h1 }}>کتابهای من</h1> */}
<div className="d-flex flex-wrap p-1"> <div className="d-flex flex-wrap p-1">
{books.map((item, i) => ( {books.map((item, i) => (
<Item data={item} key={i} id={i} /> <Item data={item} key={i} id={i} />
@ -53,41 +58,45 @@ export default class MyBooks extends React.Component {
} }
} }
export default connect(
(state) => ({
list: state.userProduct.list,
// status: state.user.status,
}),
{ getList: userProduct.list }
)(MyBooks);
const Item = (props) => { const Item = (props) => {
const { data, id } = props; const { data, id } = props;
return ( return (
<div <div className="mobile-products-product d-flex flex-column">
className="mobile-mybooks__item d-flex flex-column"
style={{
borderBottomLeftRadius: Number(id) % 2 === 1 ? 30 : 0,
borderBottomRightRadius: Number(id) % 2 === 0 ? 30 : 0,
}}
>
<img src={data.imageUrl} alt={"عکس مجصول"} /> <img src={data.imageUrl} alt={"عکس مجصول"} />
<div className="mobile-mybooks__item--buttons d-flex flex-column"> <div className="mobile-products-product__info d-flex flex-column">
<h1 style={{ fontSize: fontSize.mobile.h1 }}>{data.title}</h1>
</div>
<div className="mobile-products-product__links d-flex">
<Link <Link
// to={}
style={{ style={{
background: data.status.digital ? "#FFEE00" : "#FFFFFF",
fontSize: fontSize.mobile.a, fontSize: fontSize.mobile.a,
color: data.status.ar ? "#4D4D4F" : "#4D4D4F",
}} }}
className="mobile-products-product__links--physical"
> >
کتاب دیجیتال کتاب دیجیتال
{!data.status.digital ? ( {/* {!data.status.digital ? (
<img src={basket} alt="افزودن به سبد خرید" /> <img src={basket} alt="افزودن به سبد خرید" />
) : null} ) : null} */}
</Link> </Link>
<Link <Link
style={{ style={{
background: data.status.ar ? "#00CC69" : "#FFFFFF",
color: data.status.ar ? "#FFFFFF" : "#4D4D4F",
fontSize: fontSize.mobile.a, fontSize: fontSize.mobile.a,
}} }}
className="mobile-products-product__links--ar"
> >
واقعیت افزوده واقعیت افزوده
{!data.status.ar ? ( {/* {!data.status.ar ? (
<img src={basket} alt="افزودن به سبد خرید" /> <img src={basket} alt="افزودن به سبد خرید" />
) : null} ) : null} */}
</Link> </Link>
</div> </div>
</div> </div>
@ -98,6 +107,7 @@ MyBooks.defaultProps = {
books: [ books: [
{ {
id: 0, id: 0,
title: "علوم ششم",
link: "", link: "",
imageUrl: sciense_6, imageUrl: sciense_6,
status: { status: {
@ -108,6 +118,7 @@ MyBooks.defaultProps = {
{ {
id: 1, id: 1,
link: "", link: "",
title: "علوم هشتم",
imageUrl: sciense_8, imageUrl: sciense_8,
status: { status: {
digital: false, digital: false,
@ -117,6 +128,7 @@ MyBooks.defaultProps = {
{ {
id: 2, id: 2,
link: "", link: "",
title: "علوم نهم",
imageUrl: sciense_9, imageUrl: sciense_9,
status: { status: {
digital: true, digital: true,
@ -126,34 +138,18 @@ MyBooks.defaultProps = {
{ {
id: 3, id: 3,
link: "", link: "",
title: "علوم هفتم",
imageUrl: sciense_7, imageUrl: sciense_7,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
}, },
}, },
{
id: 4,
link: "",
imageUrl: sciense_6,
status: {
digital: true,
ar: true,
},
},
{
id: 5,
link: "",
imageUrl: sciense_8,
status: {
digital: true,
ar: true,
},
},
{ {
id: 6, id: 6,
link: "", link: "",
imageUrl: sciense_9, title: "شیمی دهم",
imageUrl: shimi_10,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,
@ -162,7 +158,8 @@ MyBooks.defaultProps = {
{ {
id: 7, id: 7,
link: "", link: "",
imageUrl: sciense_7, title: "زیست دهم",
imageUrl: zist_10,
status: { status: {
digital: true, digital: true,
ar: true, ar: true,

@ -1,75 +0,0 @@
.mybooks {
width: 100vw;
max-width: 1250px;
margin: 0px auto;
padding: 0px 10px;
direction: rtl;
min-height: calc(100vh - 288px);
padding-top: 100px;
}
.mobile-mybooks {
width: 100vw;
max-width: 600px;
margin: 0px auto;
padding: 0px;
direction: rtl;
overflow-x: hidden;
padding-top: 70px;
h1 {
padding: 0px 10px;
font-family: numeralBold;
color: #6f7074;
margin-bottom: 10px;
}
&__item {
margin: 10px auto;
height: calc(100vh - 200px);
max-height: 470px;
background-color: #fafafa;
border-radius: 0.5rem;
box-shadow: 0 3px 8px 0 rgb(0 0 0 / 16%);
margin-bottom: 20px;
h1 {
font-family: numeralMedium;
color: #6f7074;
margin-bottom: 10px;
}
& img {
height: 60%;
width: 80%;
min-height: 250px;
max-height: 290px;
border-radius: 10px;
margin: 20px auto;
// max-height: 320px;
// margin: 20px 40px;
}
&--buttons {
// padding: 5px 9px;
width: 80%;
margin: 0px auto;
a {
text-decoration: none;
width: 100%;
padding: 8px;
font-family: numeralMedium;
margin-bottom: 10px;
border-radius: 10px;
text-align: center;
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
margin: 10px 5px;
img {
position: absolute;
top: calc(50% - 8px);
left: 5px;
width: 20px;
height: 20px;
}
}
}
}
}

@ -121,14 +121,14 @@ class Product extends Component {
<div className="d-flex flex-column mt-3"> <div className="d-flex flex-column mt-3">
<div className="d-flex"> <div className="d-flex">
<Link <Link
to={`/products/${product.id}/sample`} to={`/cart`}
className="mobile-product__header--digitalButton" className="mobile-product__header--digitalButton"
style={{ fontSize: fontSize.mobile.a }} style={{ fontSize: fontSize.mobile.a }}
> >
خرید نسخه دیجیتال خرید نسخه دیجیتال
</Link> </Link>
<Link <Link
to={`/products/${product.id}/sample`} to={`/cart`}
className="mobile-product__header--purchase" className="mobile-product__header--purchase"
style={{ fontSize: fontSize.mobile.a }} style={{ fontSize: fontSize.mobile.a }}
> >

Loading…
Cancel
Save