107 lines
4.8 KiB
JavaScript
107 lines
4.8 KiB
JavaScript
import React from 'react';
|
||
import AppContainer from "../appContainer";
|
||
import Image from "next/image";
|
||
import {FiUsers, FiArrowLeft} from 'react-icons/fi'
|
||
import Link from "next/link";
|
||
import {
|
||
MDBBtn,
|
||
MDBCard,
|
||
MDBCardBody,
|
||
MDBCardText,
|
||
MDBCardTitle,
|
||
MDBContainer,
|
||
MDBIcon,
|
||
MDBTypography
|
||
} from "mdb-react-ui-kit";
|
||
import {Box, Divider, ScaleFade, SimpleGrid} from "@chakra-ui/react";
|
||
import {VueApi} from "../../lib/api";
|
||
import axios from "axios";
|
||
import {data} from "autoprefixer";
|
||
|
||
const Recruitment = (dataoccupational) => {
|
||
const Parallax = ({ quality }) => {
|
||
return `../resource/parallax/Directors.jpg`;
|
||
}
|
||
return (
|
||
<div>
|
||
<AppContainer title={'فرصت های شغلی بیمارستان مهر ایرانیان پرند'}>
|
||
<div className="parallax-container">
|
||
<div className={'flex flex-column'}>
|
||
<div className={'mb-5'}>
|
||
<h2 className={'center-align bk-med text-white header_back service-text dana font-weight-bold'}> فرصت های شغلی بیمارستان مهر ایرانیان پرند </h2>
|
||
</div>
|
||
<br />
|
||
<br />
|
||
<div className={'mt-2'}>
|
||
<br />
|
||
<br />
|
||
<p className={'center-align bk-light RTL text-white mt-5 header_back service-text dana font-weight-bold'}>فرصت‌هایی برای اینکه رویاهای خودتان را در کنار ما بسازید.</p>
|
||
</div>
|
||
</div>
|
||
<Image
|
||
loader={Parallax}
|
||
src="Parallax.png"
|
||
className={'responsive-img shadow-5'}
|
||
alt="فرصت های شغلی بیمارستان مهر ایرانیان پرند"
|
||
width={3000}
|
||
height={1300}
|
||
/>
|
||
</div>
|
||
<MDBContainer className={'mt-5'}>
|
||
<div className={'bk-med flex justify-content-center align-items-center flex-col'}>
|
||
<MDBTypography className={'bk-md text-primary-teal font-weight-bold'} variant={'h3'}>فرصت های همکاری</MDBTypography>
|
||
<MDBTypography className={'bk-light text-primary-teal mt-2'}>ردیف شغلی مورد علاقه خود را انتخاب کنید </MDBTypography>
|
||
</div>
|
||
<Divider />
|
||
<SimpleGrid dir={'rtl'} columns={[1, 2, 4]} spacing={5}>
|
||
{dataoccupational.data.data.map((item) => (
|
||
<ScaleFade initialScale={0.9} in={() => setTimeout(() => true, 3000) }>
|
||
<Box key={item.id}>
|
||
<MDBCard className={'jobs-item-card rounded-6'}>
|
||
<MDBCardBody className={'flex flex-col align-items-center justify-content-between'}>
|
||
<div>
|
||
<FiUsers size={35} />
|
||
</div>
|
||
<MDBCardTitle className={'bk-med mt-2 right'}>{item.title} </MDBCardTitle>
|
||
<Link href={`recruitment/item/${item.id}`}>
|
||
<MDBBtn rounded size={'sm'} className={'mt-2 flex align-items-center bk-light bg-primary-teal'}>
|
||
مشاهده
|
||
<FiArrowLeft className={'mr-2'} />
|
||
</MDBBtn>
|
||
</Link>
|
||
</MDBCardBody>
|
||
</MDBCard>
|
||
</Box>
|
||
</ScaleFade>
|
||
))}
|
||
</SimpleGrid>
|
||
</MDBContainer>
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
</AppContainer>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
|
||
export default Recruitment;
|
||
|
||
export async function getServerSideProps() {
|
||
// Fetch data from external API
|
||
const res = await axios.get('https://mehriranianco.ir/api/public/job/occupational/').then((res) => {
|
||
return res.data
|
||
}).catch((err) => {
|
||
console.log(err)
|
||
});
|
||
const data = await res
|
||
|
||
// Pass data to the page via props
|
||
return { props: { data } }
|
||
}
|