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.
 
 
 

125 lines
4.0 KiB

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",
},
},
};