|
|
import React, { useEffect } from "react"; |
|
|
import { connect } from "react-redux"; |
|
|
import { publicApi } from "../../redux/actions"; |
|
|
|
|
|
import Ticket from './layouts/Ticket'; |
|
|
import Header from "../Activation/components/Header"; |
|
|
import NotFound from "../Faq/components/NotFound"; |
|
|
import Info from "./layouts/Info"; |
|
|
import Map from "../../components/Map"; |
|
|
|
|
|
//assets |
|
|
import contactBgImage from "./contact-bg.svg"; |
|
|
import desktopContactBgImage from "./desktop-contact-bg.svg"; |
|
|
import onlineSupportIcon from "./online-support.svg"; |
|
|
import addressIcon from "./address.svg"; |
|
|
import callIcon from "./call.svg"; |
|
|
|
|
|
function Contact({ headerOptions, setHeaderOptions, info, isMobile, isDark }) { |
|
|
useEffect(() => { |
|
|
setHeaderOptions(headerOptions); |
|
|
}, []); |
|
|
|
|
|
return ( |
|
|
<div |
|
|
className="w-full flex h-auto flex-col bg-transparent lg:pt-36 lg:pb-24" |
|
|
// style={{ height: "calc(100vh - 140px)" }} |
|
|
> |
|
|
<Header |
|
|
bg={isMobile ? contactBgImage : desktopContactBgImage} |
|
|
title="تماس با ما" |
|
|
/> |
|
|
{isMobile ? ( |
|
|
<div className="w-full flex flex-col px-4 transform -translate-y-16"> |
|
|
{Object.keys(info).map((item, index) => ( |
|
|
<Info info={info[item]} key={index} /> |
|
|
))} |
|
|
<NotFound |
|
|
title={""} |
|
|
subTitle={ |
|
|
"شاید سوالی که بدنبال آن هستید را در قسمت پرسشهای متداول بتوانید پیدا کنید" |
|
|
} |
|
|
link="/faq" |
|
|
/> |
|
|
</div> |
|
|
) : ( |
|
|
<div className="flex flex-row gap-10 transform -translate-y-12 w-11/12 mx-auto"> |
|
|
<div className="w-1/3"> |
|
|
<Ticket /> |
|
|
</div> |
|
|
<div className="w-1/3 flex flex-col"> |
|
|
{Object.keys(info).map((item, index) => ( |
|
|
<Info info={info[item]} key={index} /> |
|
|
))} |
|
|
<NotFound |
|
|
title={""} |
|
|
subTitle={ |
|
|
"شاید سوالی که بدنبال آن هستید را در قسمت پرسشهای متداول بتوانید پیدا کنید" |
|
|
} |
|
|
link="/faq" |
|
|
/> |
|
|
</div> |
|
|
<div className="w-1/3 rounded-md overflow-hidden" style={{height:'400px'}}> |
|
|
<Map /> |
|
|
</div> |
|
|
</div> |
|
|
)} |
|
|
</div> |
|
|
); |
|
|
} |
|
|
|
|
|
const mapStateToProps = (state) => ({ |
|
|
isMobile: state.publicApi.isMobile, |
|
|
isDark: state.publicApi.isDark, |
|
|
}); |
|
|
|
|
|
const mapDispatchToProps = { |
|
|
setHeaderOptions: publicApi.setHeaderOptions, |
|
|
}; |
|
|
export default connect(mapStateToProps, mapDispatchToProps)(Contact); |
|
|
|
|
|
Contact.defaultProps = { |
|
|
info: { |
|
|
onlineSupport: { |
|
|
icon: onlineSupportIcon, |
|
|
title: { text: "پشتیبانی آنلاین", color: "#D3B702" }, |
|
|
description: { |
|
|
text: "همکاران ما در قسمت فروش و پشتیبانی، پاسخگوی شما هستند هر سوالی در مورد کتابهای ما داشتید بپرسید", |
|
|
color: "#766600", |
|
|
}, |
|
|
link: { |
|
|
title: "ارتباط با بخش پشتیبانی", |
|
|
link: "/support", |
|
|
color: "#766600", |
|
|
}, |
|
|
bg: "#D3B70222", |
|
|
borderColor: "#D3B70255", |
|
|
}, |
|
|
call: { |
|
|
icon: callIcon, |
|
|
title: { text: "شماره تماس", color: "#06A02A" }, |
|
|
description: { |
|
|
text: "در صورت هرگونه سوال شما میتوانید در ساعات اداری 9 الی 17 با شماره 021۸۸۸۱۴۶۳۷ تماس حاصل فرمایید", |
|
|
color: "#025816", |
|
|
}, |
|
|
link: null, |
|
|
bg: "#69FF5F22", |
|
|
borderColor: "#69FF5F55", |
|
|
}, |
|
|
address: { |
|
|
icon: addressIcon, |
|
|
title: { text: "نشانی", color: "#0EAD98" }, |
|
|
description: { |
|
|
text: "نشانی دفتر مرکزی: تهران میدان فردوسی خیابان عباس موسوی پلاک 30", |
|
|
color: "#066A5C", |
|
|
}, |
|
|
link: { |
|
|
title: "لیست نمایندگیهای فروش", |
|
|
link: "/sell", |
|
|
color: "#0A7769", |
|
|
}, |
|
|
bg: "#0A776922", |
|
|
borderColor: "#0A776955", |
|
|
}, |
|
|
}, |
|
|
};
|
|
|
|