price update
This commit is contained in:
@@ -0,0 +1,57 @@
|
||||
import React, {useContext} from 'react';
|
||||
import {
|
||||
MDBCardImage,
|
||||
MDBContainer,
|
||||
MDBIcon,
|
||||
MDBInputGroup,
|
||||
MDBInputGroupElement, MDBInputGroupText,
|
||||
MDBTypography
|
||||
} from "mdb-react-ui-kit";
|
||||
import {ListItem, SlideFade, UnorderedList} from "@chakra-ui/react";
|
||||
import Love from '../../../public/resource/Smart/love-heart-outline.webp'
|
||||
import {HandlePage} from "../../../lib/HnadelPagge";
|
||||
const StepFive = () => {
|
||||
const {setPhoneNumber} = useContext(HandlePage)
|
||||
return (
|
||||
<SlideFade in={true} offsetY='20px'>
|
||||
<div className={'flex flex-column'}>
|
||||
<div className={'mt-4'}>
|
||||
<MDBTypography style={{ lineHeight: 1.7 }} className={'text-center mr-4 text-primary-teal font-weight-bold bk-med'} variant={'h3'}>
|
||||
سپاس از همراهی شما
|
||||
</MDBTypography>
|
||||
</div>
|
||||
<div className={'flex justify-content-center mt-2'}>
|
||||
<MDBCardImage className={'ml-2'} src={Love} width={150} height={150} />
|
||||
</div>
|
||||
<div className={'flex justify-content-center flex-column mt-2'}>
|
||||
<div className={'flex justify-content-center'}>
|
||||
<strong className={'bk-med text-center text-md'}>
|
||||
در صورت تمایل به خرید سهام
|
||||
<br />
|
||||
شماره تلفن خود را وارد کنید
|
||||
</strong>
|
||||
</div>
|
||||
<div className={'flex justify-content-center mt-2'}>
|
||||
<MDBContainer>
|
||||
<MDBInputGroup>
|
||||
<MDBInputGroupElement
|
||||
name="PhoneNumber"
|
||||
dir={'rtl'}
|
||||
onChange={(e) => setPhoneNumber(e.target.value)}
|
||||
id="PhoneNumber"
|
||||
placeholder=' شماره موبایل خود را وارد کنید '
|
||||
type='text' />
|
||||
<MDBInputGroupText>
|
||||
<MDBIcon fas icon="phone" />
|
||||
</MDBInputGroupText>
|
||||
</MDBInputGroup>
|
||||
</MDBContainer>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</SlideFade>
|
||||
);
|
||||
};
|
||||
|
||||
export default StepFive;
|
||||
@@ -0,0 +1,82 @@
|
||||
import React, { useContext } from 'react'
|
||||
import { MDBCardImage, MDBIcon, MDBTypography } from 'mdb-react-ui-kit'
|
||||
import { ListItem, SlideFade, UnorderedList } from '@chakra-ui/react'
|
||||
import Grow from '../../../public/resource/Smart/growing-plant-outline.webp'
|
||||
import { HandlePage } from '../../../lib/HnadelPagge'
|
||||
const StepFour = () => {
|
||||
const { investment } = useContext(HandlePage)
|
||||
return (
|
||||
<SlideFade in={true} offsetY='20px'>
|
||||
<div className={'flex flex-column'}>
|
||||
<div className={'mt-4'}>
|
||||
<MDBTypography
|
||||
style={{ lineHeight: 1.7 }}
|
||||
className={'text-right mr-4 text-primary-teal font-weight-bold bk-med'}
|
||||
variant={'h3'}
|
||||
>
|
||||
{' '}
|
||||
بازدهی سرمایه گذاری شما
|
||||
<MDBIcon className={'ml-2'} fas icon='chevron-up' />
|
||||
</MDBTypography>
|
||||
</div>
|
||||
<div className={'flex justify-content-center mt-2'}>
|
||||
<MDBCardImage className={'ml-2'} src={Grow} width={150} height={150} />
|
||||
</div>
|
||||
<div className={'flex justify-content-center flex-column mt-2'}>
|
||||
<div className={'flex justify-content-center'}>
|
||||
<strong className={'bg-primary-teal p-2 rounded text-white'}>
|
||||
{investment.length >= 6 ? ` ${investment} :مبلغ سرمایه شما ` : 'مبلغ وارد شده معتر نمی باشد'}
|
||||
</strong>
|
||||
</div>
|
||||
{investment.length >= 6 ? (
|
||||
<div>
|
||||
<div className={'flex justify-content-center mt-2'}>
|
||||
{investment / 75000000 >= 1 ? (
|
||||
<div dir={'rtl'} className={'bk-light mt-2'}>
|
||||
<div className={'text-center'}>
|
||||
تعداد سهام قابل خرید شما:{' '}
|
||||
<strong className={'mr-2'}>{Math.ceil(investment / 75000000)} سهم </strong>{' '}
|
||||
</div>
|
||||
{Math.ceil(investment / 75000000) * 75000000 - investment ===
|
||||
Math.ceil(investment / 75000000) * 75000000 ? (
|
||||
<div>{Math.ceil(investment / 75000000)}</div>
|
||||
) : (
|
||||
<div>
|
||||
{Math.ceil(investment / 75000000) * 75000000 - investment === 0 ? (
|
||||
''
|
||||
) : (
|
||||
<div className={'flex bg-gray-200 p-2 rounded-5 justify-content-center align-items-center'}>
|
||||
با پرداخت {Math.ceil(investment / 75000000) * 75000000 - investment} تومان بیشتر می توانید{' '}
|
||||
{Math.ceil(investment / 75000000)} سهم خریدار کنید
|
||||
</div>
|
||||
)}
|
||||
<div className={'flex justify-content-center mt-3'}>
|
||||
<span className={'bk-light text-sm animate-bounce'}>
|
||||
پیش بینی ارزش افزوده هر سهم سه ماه آینده: {investment * 1 + 5000000 - investment * 1}{' '}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className={'flex flex-col align-items-center justify-content-center mt-2'}>
|
||||
<p dir={'rtl'} className={'bk-light mt-2'}>
|
||||
قیمت هر سهم در حال حاضر 50,000,000 تومان است ، پیشنهاد ما به شما خرید اقساطی سهام است
|
||||
</p>
|
||||
<span className={'bk-med animate-bounce'}>
|
||||
سود شما بعد از بهره برداری از فاز 1 : {investment * 1 + 5000000 - investment * 1}{' '}
|
||||
</span>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
''
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</SlideFade>
|
||||
)
|
||||
}
|
||||
|
||||
export default StepFour
|
||||
@@ -0,0 +1,34 @@
|
||||
import React, {useContext} from 'react';
|
||||
import {MDBBtn, MDBCardImage, MDBContainer, MDBIcon, MDBTypography} from "mdb-react-ui-kit";
|
||||
import Image from 'next/image'
|
||||
import IMGAE from '../../../public/resource/Smart/coins-outline.webp'
|
||||
import {HandlePage} from "../../../lib/HnadelPagge";
|
||||
const StepOne = () => {
|
||||
const {setPage} = useContext(HandlePage)
|
||||
return (
|
||||
<div className={'flex flex-column'}>
|
||||
<div className={'mt-4'}>
|
||||
<MDBTypography style={{ lineHeight: 1.7 }} className={'text-right mr-4 text-primary-teal font-weight-bold bk-med'} variant={'h3'}>روش سرمایه گذاری خود
|
||||
<br />
|
||||
... را هوشمندانه انتخاب کنید
|
||||
</MDBTypography>
|
||||
</div>
|
||||
|
||||
<div dir={'rtl'} className={'text-right mr-4'}>
|
||||
<p className={'bk-light text-sm'}>با پاسخ به سوالات مشاوره هوشمند با هر بودجه ای قادر به سرمایه گذاری خواهید بود. </p>
|
||||
<span className={'text-sm bk-med flex align-items-center'}>
|
||||
<MDBCardImage className={'ml-2'} src={IMGAE} width={30} height={30} />
|
||||
آینده ای پرسود برای خود و خانواده خود بسازید</span>
|
||||
</div>
|
||||
<div className="d-grid gap-5 mt-5 col-6 mx-auto">
|
||||
<MDBBtn onClick={() => setPage(2)} className={'bg-primary-teal text-md text-center bk-med'}>
|
||||
<MDBIcon icon='chevron-left' className={'mr-5'} />
|
||||
شروع کنید
|
||||
</MDBBtn>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default StepOne;
|
||||
@@ -0,0 +1,83 @@
|
||||
import React, {useContext, useState} from 'react';
|
||||
import {
|
||||
MDBCardImage, MDBContainer,
|
||||
MDBIcon,
|
||||
MDBInput,
|
||||
MDBInputGroup,
|
||||
MDBInputGroupElement,
|
||||
MDBInputGroupText, MDBRow,
|
||||
MDBTypography
|
||||
} from "mdb-react-ui-kit";
|
||||
import {ListItem, Radio, RadioGroup, SlideFade, Stack, UnorderedList} from "@chakra-ui/react";
|
||||
import * as PropTypes from "prop-types";
|
||||
import {AiOutlinePhone} from "react-icons/ai";
|
||||
import {HandlePage} from "../../../lib/HnadelPagge";
|
||||
import NumberFormat from "react-number-format";
|
||||
import IMGAE from '../../../public/resource/Smart/coins-outline.gif'
|
||||
|
||||
function MDBRadio(props) {
|
||||
return null;
|
||||
}
|
||||
|
||||
const StepThree = () => {
|
||||
const [type,setType] = useState(0)
|
||||
const {setInvestment} = useContext(HandlePage)
|
||||
return (
|
||||
<SlideFade in={true} offsetY='20px'>
|
||||
<div className={'flex flex-column'}>
|
||||
<div className={'mt-4'}>
|
||||
<MDBTypography style={{ lineHeight: 1.7 }} className={'text-right mr-4 text-primary-teal font-weight-bold bk-med'} variant={'h3'}> سرمایه گذاری آسوده
|
||||
<MDBIcon className={'ml-2'} fas icon="dollar-sign" />
|
||||
</MDBTypography>
|
||||
</div>
|
||||
<div dir={'rtl'} className={'text-right mr-4'}>
|
||||
<p className={'bk-med text-sm'}>
|
||||
در حال حاضر ب چه صورتی می توانید سرمایه گذاری کنید ؟
|
||||
</p>
|
||||
<div className={'dana flex align-items-center text-sm'}>
|
||||
<MDBCardImage className={'ml-2'} src={IMGAE} width={50} height={50} />
|
||||
قیمت پایه هر سهم : 65.000.000
|
||||
تومان
|
||||
</div>
|
||||
</div>
|
||||
<div className={'mt-4 mb-4 flex flex-col justify-content-center'}>
|
||||
<div className={'flex justify-content-center'}>
|
||||
<RadioGroup onChange={setType} defaultValue={type}>
|
||||
<Stack className={'bk-med'} direction='row'>
|
||||
<Radio colorScheme='teal' className={'m-2'} value='1'>
|
||||
نقدی
|
||||
</Radio>
|
||||
<Radio colorScheme='teal' className={'m-2'} value='2'>
|
||||
اقساطی
|
||||
</Radio>
|
||||
</Stack>
|
||||
</RadioGroup>
|
||||
</div>
|
||||
<br />
|
||||
<br />
|
||||
<MDBContainer>
|
||||
<MDBInputGroup>
|
||||
<NumberFormat
|
||||
onValueChange={(values) => {
|
||||
const { formattedValue, value } = values;
|
||||
setInvestment(value);
|
||||
}}
|
||||
className={'form-control'}
|
||||
type={'text'}
|
||||
prefix={'تومان'}
|
||||
thousandSeparator={true}
|
||||
placeholder=' مبلغ سرمایه گذاری خود را به تومان وارد کنید '
|
||||
dir={'ltr'}
|
||||
/>
|
||||
<MDBInputGroupText>
|
||||
<MDBIcon fas icon="dollar-sign" />
|
||||
</MDBInputGroupText>
|
||||
</MDBInputGroup>
|
||||
</MDBContainer>
|
||||
</div>
|
||||
</div>
|
||||
</SlideFade>
|
||||
);
|
||||
};
|
||||
|
||||
export default StepThree;
|
||||
@@ -0,0 +1,35 @@
|
||||
import React from 'react';
|
||||
import {MDBCardImage, MDBIcon, MDBTypography} from "mdb-react-ui-kit";
|
||||
import {ListItem, SlideFade, UnorderedList} from "@chakra-ui/react";
|
||||
import IMGAE from "../../../public/resource/Smart/coins-outline.webp";
|
||||
|
||||
const StepTwo = () => {
|
||||
return (
|
||||
<SlideFade in={true} offsetY='20px'>
|
||||
<div className={'flex flex-column'}>
|
||||
<div className={'mt-4'}>
|
||||
<MDBTypography style={{ lineHeight: 1.7 }} className={'text-right mr-4 text-primary-teal font-weight-bold bk-med'} variant={'h3'}> سرمایه گذاری امن
|
||||
<MDBIcon className={'ml-2'} fas icon="chart-line" />
|
||||
</MDBTypography>
|
||||
</div>
|
||||
<div dir={'rtl'} className={'text-right mr-4'}>
|
||||
<p className={'bk-light text-sm'}>
|
||||
با سطح معقولی از سرمایه و بدون نیاز
|
||||
به دانش تخصصی در بازار های مالی
|
||||
به آسانی سرمایه گذاری کنید </p>
|
||||
</div>
|
||||
|
||||
<div className={'mt-4 mb-4'}>
|
||||
<UnorderedList spacing={2} className={'bk-light'} dir={'rtl'}>
|
||||
<ListItem> بدون ریسک و بازدهی بالا</ListItem>
|
||||
<ListItem> بیمه تکمیلی برای سهامدار و خانواده </ListItem>
|
||||
<ListItem> حق استخدام </ListItem>
|
||||
<ListItem> درمان رایگان و با سود سالانه</ListItem>
|
||||
</UnorderedList>
|
||||
</div>
|
||||
</div>
|
||||
</SlideFade>
|
||||
);
|
||||
};
|
||||
|
||||
export default StepTwo;
|
||||
Reference in New Issue
Block a user