mip-website/pages/stock-unit/index.js

import React from 'react'
import AppContainer from '../appContainer'
import Image from 'next/image'
import { MDBContainer, MDBIcon } from 'mdb-react-ui-kit'
import { Table, TableCaption, TableContainer, Tbody, Td, Th, Thead, Tr } from '@chakra-ui/react'

const StockUnit = () => {
  const Parallax = ({ quality }) => {
    return `../resource/images/call-center.jpg`
  }
  return (
    <AppContainer title={' واحد فروش سهام'}>
      <div className='parallax-container'>
        <div
          style={{ fontSize: 30 }}
          className={'center-align text-white header_back service-text dana font-weight-bold'}
        >
          واحد فروش سهام
        </div>
        <Image
          loader={Parallax}
          src='Parallax.png'
          className={'responsive-img shadow-5'}
          alt='واحد فروش سهام بیمارستان مهر ایرانیان'
          width={3000}
          height={1300}
        />
      </div>
      <MDBContainer className={'mb-5 mt-5'}>
        <TableContainer alignContent='center' alignItems='center'>
          <Table align='center' variant='striped'>
            <TableCaption className='bk-med'>پاسخگویی و مشاوره خرید سهام </TableCaption>
            <Thead alignContent='center'>
              <Tr alignContent='center' alignItems='center' className='text-center bg-gray-200'>
                <Th className='text-center bk-med'>شماره تماس</Th>
                <Th className='text-center bk-med'>کارشناس فروش </Th>
              </Tr>
            </Thead>
            <Tbody>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810805'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810805
                  </a>
                </Td>
                <Td className='text-center'> آقای شمشیری </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810736'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810736
                  </a>
                </Td>
                <Td className='text-center'> محمد سهرابی </Td>
              </Tr>

              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:09384085068'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    09384085068
                  </a>
                </Td>
                <Td className='text-center'> علی سهرابی </Td>
              </Tr>

              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:09100700881'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    09100700881
                  </a>
                </Td>
                <Td className='text-center'> رستا رجبی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810804'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810804
                  </a>
                </Td>
                <Td className='text-center'> رها رجبی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810890'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810890
                  </a>
                </Td>
                <Td className='text-center'> خانم قاسمی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810801'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810801
                  </a>
                </Td>
                <Td className='text-center'> خانم کلهر </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810802'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810802
                  </a>
                </Td>
                <Td className='text-center'> خانم اکبری </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:021-48810803'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-48810803
                  </a>
                </Td>
                <Td className='text-center'> خانم شیخی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:02153457000'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-53457000 - 1023
                  </a>
                </Td>
                <Td className='text-center'> خانم باباگلی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:02153457000'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-53457000 - 1024
                  </a>
                </Td>
                <Td className='text-center'> خانم طالبی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:02153457000'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-53457000 - 1018
                  </a>
                </Td>
                <Td className='text-center'> خانم کهریزی </Td>
              </Tr>
              <Tr>
                <Td className='text-center'>
                  <a className='text-black' href='tel:02153457000'>
                    <MDBIcon className='mr-3' fas style={{ fontSize: '10px' }} icon='phone-alt' />
                    021-53457000 - 1025
                  </a>
                </Td>
                <Td className='text-center'> خانم کاظمیان </Td>
              </Tr>
            </Tbody>
          </Table>
        </TableContainer>
      </MDBContainer>
    </AppContainer>
  )
}

export default StockUnit