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

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);