134 lines
4.5 KiB
JavaScript
134 lines
4.5 KiB
JavaScript
import React from 'react'
|
||
import Image from 'next/image'
|
||
import Link from 'next/link'
|
||
import { FiUsers, FiArrowLeft } from 'react-icons/fi'
|
||
import {
|
||
MDBBtn,
|
||
MDBCard,
|
||
MDBCardBody,
|
||
MDBCardText,
|
||
MDBCardTitle,
|
||
MDBContainer,
|
||
MDBIcon,
|
||
MDBTypography
|
||
} from 'mdb-react-ui-kit'
|
||
import { Box, Divider, SimpleGrid } from '@chakra-ui/react'
|
||
import AppContainer from '../../appContainer'
|
||
import { useRouter } from 'next/router'
|
||
import axios from 'axios'
|
||
import { AppProduction } from '../../../lib/api'
|
||
|
||
const Recruitment = jobs => {
|
||
console.log(jobs)
|
||
const Parallax = ({ quality }) => {
|
||
return `../../resource/parallax/33012321.jpg`
|
||
}
|
||
const router = useRouter()
|
||
const { category_id } = router.query
|
||
|
||
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={category_id}
|
||
width={3000}
|
||
height={1300}
|
||
/>
|
||
</div>
|
||
<div className='lg:mx-20 sm:mx-5 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'}>
|
||
{jobs.jobs.name.title}{' '}
|
||
</MDBTypography>
|
||
<MDBTypography className={'bk-light text-primary-teal mt-2'}>
|
||
شغل مورد علاقه خود را انتخاب کنید{' '}
|
||
</MDBTypography>
|
||
</div>
|
||
<Divider />
|
||
<SimpleGrid dir={'rtl'} columns={[1, 1, 3]} spacing={3}>
|
||
{jobs.jobs.data &&
|
||
jobs.jobs.data.map(item => (
|
||
<Box key={item.id}>
|
||
<Link href={`/recruitment/item/request/${item.id}`}>
|
||
<MDBCard className={'jobs-item-card rounded-6'}>
|
||
<MDBCardBody
|
||
className={
|
||
'flex align-items-center lg:flex-row md:flex-col sm:flex-col justify-content-between'
|
||
}
|
||
>
|
||
<div>
|
||
<MDBCardTitle title={item.title} className={'bk-med text-summery-2 mt-2 right'}>
|
||
{item.title}{' '}
|
||
</MDBCardTitle>
|
||
</div>
|
||
<div>
|
||
<Link href={`/recruitment/item/request/${item.id}`}>
|
||
<MDBBtn
|
||
rounded
|
||
size={'sm'}
|
||
className={'mt-2 flex align-items-center bk-light bg-primary-teal'}
|
||
>
|
||
درخواست همکاری
|
||
<FiArrowLeft className={'ml-2'} />
|
||
</MDBBtn>
|
||
</Link>
|
||
</div>
|
||
</MDBCardBody>
|
||
</MDBCard>
|
||
</Link>
|
||
</Box>
|
||
))}
|
||
</SimpleGrid>
|
||
</div>
|
||
<br />
|
||
<br />
|
||
<br />
|
||
<br />
|
||
</AppContainer>
|
||
</div>
|
||
)
|
||
}
|
||
|
||
export async function getServerSideProps(ctx) {
|
||
// Fetch data from external API
|
||
const { query } = ctx
|
||
|
||
const res = await axios
|
||
.get(`${AppProduction}public/job/${query.category_id}`)
|
||
.then(res => {
|
||
return res.data
|
||
})
|
||
.catch(err => {
|
||
console.log(err)
|
||
})
|
||
const jobs = await res
|
||
|
||
// Pass data to the page via props
|
||
return { props: { jobs } }
|
||
}
|
||
|
||
export default Recruitment
|