You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
79 lines
2.2 KiB
79 lines
2.2 KiB
import React, { useEffect } from "react"; |
|
import Navbar from "../../components/Navbar"; |
|
import Footer from "../Home/Footer"; |
|
import SubscribeRadio from "./SubscribeRadio"; |
|
import DiscountCode from "./DiscountCode"; |
|
import { connect } from "react-redux"; |
|
import { product, userFactor } from "../../redux/actions"; |
|
import scroll from "../../util/scroll"; |
|
import Loader from "../../components/Loader"; |
|
import _ from "lodash"; |
|
|
|
function Subscription({ |
|
listVOD, |
|
getList, |
|
loading, |
|
selectedVOD, |
|
payment, |
|
verify, |
|
theme, |
|
}: any) { |
|
useEffect(() => { |
|
getList(); |
|
scroll.goToTop(); |
|
}, []); |
|
const light = theme === "light"; |
|
return ( |
|
<div |
|
className={_.join( |
|
[ |
|
"subscription main d-flex flex-column", |
|
light ? 'subscription-light bg-white' : 'subscription-dark bg-black' |
|
], |
|
" " |
|
)} |
|
> |
|
<Navbar /> |
|
<main className={"d-flex flex-column" + " " + (loading && "blur")}> |
|
<h1>خرید اشتراک دانوین</h1> |
|
<p> |
|
اینجا هم برای هر کتاب امکان خرید اشتراک جداگانه هست و هم اشتراک های |
|
مدت دار. با خرید اشتراک های مدت دار دانوین می تونید در هزینه هاتون |
|
صرفه جویی کنید. |
|
</p> |
|
{listVOD?.map((subscribe: any, i: any) => ( |
|
<SubscribeRadio theme={theme} data={subscribe} key={i} /> |
|
))} |
|
<DiscountCode /> |
|
<div className="d-flex justify-content-end py-4"> |
|
<button |
|
className="submit submit-large" |
|
onClick={() => payment({ productId: selectedVOD.id })} |
|
> |
|
تایید و پرداخت |
|
</button> |
|
</div> |
|
</main> |
|
<Footer /> |
|
{loading ? ( |
|
<div className="full-loader"> |
|
<Loader size={50} /> |
|
</div> |
|
) : null} |
|
</div> |
|
); |
|
} |
|
|
|
export default connect( |
|
(state: any) => ({ |
|
listVOD: state.product.listVOD, |
|
loading: state.product.loading, |
|
selectedVOD: state.product.selectedVOD, |
|
theme: state.publicApi.theme, |
|
}), |
|
{ |
|
getList: product.listVOD, |
|
payment: userFactor.payment, |
|
verify: userFactor.verify, |
|
} |
|
)(Subscription);
|
|
|