add gallery

.idea/.name

@@ -0,0 +1 @@
+pjson.js

lib/api.js

@@ -20,3 +20,4 @@ export const AppFile = addr => {
   return `${serve}/${addr}`
 }
 export const AppProduction = 'https://mehriranianco.ir/api/'
+// export const AppProduction = 'http://127.0.0.1:8000/api/'

package.json

@@ -3,9 +3,9 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev -p 7000",
+    "dev": "next dev -p 2000",
     "build": "next build",
-    "start": "next start -p 7000"
+    "start": "next start -p 2000"
   },
   "dependencies": {
     "@chakra-ui/icons": "^1.1.1",

pages/Gallery.js

@@ -1,176 +1,356 @@
-import React, { useEffect, useState} from 'react';
-import axios from "axios";
-import AppContainer from "./appContainer";
-import {AppFile, AppUrl} from "../lib/api";
-import Image from "next/image";
-import dynamic from "next/dynamic";
-import { Suspense } from 'react'
+import fs from 'fs'
+import path from 'path'
+import React, { useEffect, useState } from 'react'
+import Image from 'next/image'
+import AppContainer from './appContainer'
 
-import {
-    MDBBtn,
-    MDBCol,
-    MDBContainer,
-    MDBRow,
-} from "mdb-react-ui-kit";
-import  {LightBox} from "react-lightbox-pack";
-import {Button, Divider, Tab, TabList, TabPanel, TabPanels, Tabs} from "@chakra-ui/react";
-
-const APV = dynamic(() => import('./components/Videos'), {
-    ssr: false,
-})
-const shimmer = (w, h) => `
-<svg width="${w}" height="${h}" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+const shimmer = (width, height) => `
+  <svg width="${width}" height="${height}" viewBox="0 0 ${width} ${height}" xmlns="http://www.w3.org/2000/svg">
     <defs>
-    <linearGradient id="g">
-      <stop stop-color="#333" offset="20%" />
-      <stop stop-color="#222" offset="50%" />
-      <stop stop-color="#333" offset="70%" />
+      <linearGradient id="gradient">
+        <stop stop-color="#e5e7eb" offset="20%" />
+        <stop stop-color="#f9fafb" offset="50%" />
+        <stop stop-color="#e5e7eb" offset="70%" />
       </linearGradient>
     </defs>
-  <rect width="${w}" height="${h}" fill="#333" />
-  <rect id="r" width="${w}" height="${h}" fill="url(#g)" />
-  <animate xlink:href="#r" attributeName="x" from="-${w}" to="${w}" dur="1s" repeatCount="indefinite"  />
-</svg>`
+    <rect width="${width}" height="${height}" fill="#e5e7eb" />
+    <rect width="${width}" height="${height}" fill="url(#gradient)" />
+  </svg>
+`
 
-const toBase64 = (str) =>
-    typeof window === 'undefined'
-        ? Buffer.from(str).toString('base64')
-        : window.btoa(str)
+const toBase64 = value =>
+  typeof window === 'undefined' ? Buffer.from(value).toString('base64') : window.btoa(value)
 
-const Gallery = (dataImage) => {
-    const [Images, SetImages] = useState(dataImage)
-    const [justifyActive, setJustifyActive] = React.useState('tab1');
-    const [toggle, setToggle] =  React.useState(false);
-    const [sIndex, setSIndex] =  React.useState(0);
-    const [filterId, setFilterId] =  React.useState(1);
-    const Parallax = ({  quality }) => {
-        return `../resource/parallax/Gallery.jpg`;
-    }
-    const Filter = async (filter) => {
-        const res = await axios.get(AppUrl(`FilterGalleyImages/${filter}`));
-        SetImages({dataImage : res.data})
-        setFilterId(filter)
+const galleryBannerLoader = () => '/resource/parallax/Gallery.jpg'
+
+const Gallery = ({ images }) => {
+  const [selectedImage, setSelectedImage] = useState(null)
+
+  const closeLightbox = () => setSelectedImage(null)
+
+  const showPreviousImage = () => {
+    setSelectedImage(current => (current === 0 ? images.length - 1 : current - 1))
   }
 
-    const AllImage = async () => {
-        const res = await axios.get(AppUrl(`GetGalleyImages`));
-        SetImages({dataImage: res.data})
+  const showNextImage = () => {
+    setSelectedImage(current => (current === images.length - 1 ? 0 : current + 1))
   }
 
-    // Handler
-    const  lightBoxHandler  = (state, sIndex) => {
-        setToggle(state);
-        setSIndex(sIndex);
-    };
+  useEffect(() => {
+    if (selectedImage === null) return undefined
 
-    const handleJustifyClick = (value) => {
-        if (value === justifyActive) {
-            return;
+    const handleKeyDown = event => {
+      if (event.key === 'Escape') setSelectedImage(null)
+      if (event.key === 'ArrowRight') {
+        setSelectedImage(current => (current === images.length - 1 ? 0 : current + 1))
+      }
+      if (event.key === 'ArrowLeft') {
+        setSelectedImage(current => (current === 0 ? images.length - 1 : current - 1))
+      }
     }
 
-        setJustifyActive(value);
-    };
+    const previousOverflow = document.body.style.overflow
+    document.body.style.overflow = 'hidden'
+    window.addEventListener('keydown', handleKeyDown)
+
+    return () => {
+      document.body.style.overflow = previousOverflow
+      window.removeEventListener('keydown', handleKeyDown)
+    }
+  }, [selectedImage, images.length])
+
   return (
-        <div>
-            <style jsx>
-                {`
-                  .cardImage {
-                    background-color: #F3F4F6;
-                    padding: 5px;
-                    border-radius: 1rem;
-                    display: flex;
-                    flex-direction: column;
-                    justify-content: center;
-                    align-items: center;
-                    margin: 2px;
+    <AppContainer title='گالری بیمارستان مهر ایرانیان پرند'>
+      <style jsx>{`
+        .gallery-page {
+          direction: rtl;
+          padding: 3rem 1rem 5rem;
+          background: #fff;
         }
-                `}
-            </style>
-            <AppContainer>
-                <div className="parallax-container">
-                    <h1  className={'center-align text-white header_back service-text dana font-weight-bold'}> گالری بیمارستان  </h1>
+
+        .gallery-header {
+          max-width: 1200px;
+          margin: 0 auto 2rem;
+          text-align: right;
+        }
+
+        .gallery-header h2 {
+          margin: 0 0 0.5rem;
+          color: #263238;
+          font-size: 1.75rem;
+          font-weight: 700;
+        }
+
+        .gallery-header p {
+          margin: 0;
+          color: #6b7280;
+          font-size: 0.95rem;
+        }
+
+        .gallery-header::after {
+          content: '';
+          display: block;
+          width: 54px;
+          height: 3px;
+          margin-top: 0.9rem;
+          border-radius: 999px;
+          background: #009688;
+        }
+
+        .gallery-grid {
+          display: grid;
+          grid-template-columns: repeat(4, minmax(0, 1fr));
+          gap: 1rem;
+          max-width: 1200px;
+          margin: 0 auto;
+        }
+
+        .gallery-card {
+          position: relative;
+          aspect-ratio: 16 / 9;
+          padding: 0;
+          overflow: hidden;
+          border: 1px solid #e5e7eb;
+          border-radius: 0.85rem;
+          background: #f3f4f6;
+          cursor: zoom-in;
+          box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07);
+          transition: transform 180ms ease, box-shadow 180ms ease;
+        }
+
+        .gallery-card:hover,
+        .gallery-card:focus-visible {
+          transform: translateY(-3px);
+          box-shadow: 0 10px 24px rgba(15, 23, 42, 0.15);
+          outline: none;
+        }
+
+        .gallery-card :global(img) {
+          transition: transform 250ms ease;
+        }
+
+        .gallery-card:hover :global(img) {
+          transform: scale(1.035);
+        }
+
+        .lightbox {
+          position: fixed;
+          z-index: 1500;
+          inset: 0;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          padding: 4.5rem 5rem 3rem;
+          background: rgba(0, 0, 0, 0.92);
+        }
+
+        .lightbox-image {
+          max-width: 100%;
+          max-height: calc(100vh - 7.5rem);
+          object-fit: contain;
+          border-radius: 0.4rem;
+        }
+
+        .lightbox-close,
+        .lightbox-navigation {
+          position: absolute;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          border: 0;
+          color: #fff;
+          background: rgba(255, 255, 255, 0.13);
+          cursor: pointer;
+          transition: background 150ms ease;
+        }
+
+        .lightbox-close:hover,
+        .lightbox-navigation:hover {
+          background: rgba(255, 255, 255, 0.25);
+        }
+
+        .lightbox-close {
+          top: 1.25rem;
+          right: 1.25rem;
+          width: 44px;
+          height: 44px;
+          border-radius: 50%;
+          font-size: 1.9rem;
+          line-height: 1;
+        }
+
+        .lightbox-navigation {
+          top: 50%;
+          width: 46px;
+          height: 58px;
+          border-radius: 0.5rem;
+          font-size: 2rem;
+          transform: translateY(-50%);
+        }
+
+        .lightbox-previous {
+          left: 1.25rem;
+        }
+
+        .lightbox-next {
+          right: 1.25rem;
+        }
+
+        .lightbox-counter {
+          position: absolute;
+          bottom: 1rem;
+          left: 50%;
+          margin: 0;
+          color: #fff;
+          font-size: 0.9rem;
+          transform: translateX(-50%);
+        }
+
+        @media (max-width: 992px) {
+          .gallery-grid {
+            grid-template-columns: repeat(3, minmax(0, 1fr));
+          }
+        }
+
+        @media (max-width: 768px) {
+          .gallery-page {
+            padding: 2rem 1rem 4rem;
+          }
+
+          .gallery-grid {
+            grid-template-columns: repeat(2, minmax(0, 1fr));
+            gap: 0.75rem;
+          }
+
+          .lightbox {
+            padding: 4rem 1rem;
+          }
+
+          .lightbox-navigation {
+            top: auto;
+            bottom: 0.8rem;
+            transform: none;
+          }
+
+          .lightbox-previous {
+            left: 1rem;
+          }
+
+          .lightbox-next {
+            right: 1rem;
+          }
+        }
+
+        @media (max-width: 480px) {
+          .gallery-header h2 {
+            font-size: 1.4rem;
+          }
+
+          .gallery-grid {
+            grid-template-columns: 1fr;
+          }
+        }
+      `}</style>
+
+      <div className='parallax-container'>
+        <h1 className='center-align text-white header_back service-text dana font-weight-bold'>گالری بیمارستان</h1>
         <Image
-                        loader={Parallax}
-                        src="Parallax.png"
-                        className={'responsive-img shadow-5'}
-                        placeholder="blur"
-                        blurDataURL={`data:image/svg+xml;base64,${toBase64(shimmer(3000, 1300))}`}
-                        alt="درباره بیارستان مهر ایرانیان پرند "
+          loader={galleryBannerLoader}
+          src='gallery-banner.jpg'
+          className='responsive-img shadow-5'
+          alt='گالری بیمارستان مهر ایرانیان پرند'
           width={3000}
           height={1300}
+          priority
         />
       </div>
-                <div className='lg:mx-20 sm:mx-5'>          
-                             <Tabs defaultIndex={1} className={'mt-5'} isFitted variant='enclosed'>
-                       <TabList mb='1em'>
-                           <Tab on className={'bk font-weight-bold'} _selected={{ color: 'white', bg: 'teal.500' }}>ویدئو ها</Tab>
-                           <Tab  className={'bk font-weight-bold'}  _selected={{ color: 'white', bg: 'teal.500' }}>تصاویر</Tab>
-                       </TabList>
-                       <TabPanels>
-                           <TabPanel>
-                               <APV />
-                           </TabPanel>
-                           <TabPanel>
-                               <div style={{ flexDirection: 'column' }} className={'flex justify-content-end flex-xl-row flex-lg-row flex-md-column flex-sm-column'}>
-                                   <MDBBtn onClick={() => Filter(2)} color={filterId === 2 ? 'light' : 'light'} className={filterId === 2 ? 'm-2' : 'm-2 text-dark'}>تصاویر در حال ساخت</MDBBtn>
-                                   <MDBBtn onClick={() => Filter(1)} color={filterId === 1 ? 'light' : 'light'} className={'m-2'}>تصاویر معماری</MDBBtn>
-                                   <MDBBtn onClick={() => AllImage()} color={filterId !== 1 && 2 ? 'light' : 'light'} className={'m-2'}>همه تصاویر </MDBBtn>
-                               </div>
-                               <Divider colorScheme={'gray'} />
-                               <MDBRow style={{ marginTop: 10 }}>
-                                   {Images && Images.dataImage.map((image ,index)=> {
-                                       return (
-                                           <MDBCol xs={12} sm={12} md={6} lg={3}>
-                                               <div className={'cardImage'} key={image.id}>
-                                                   <img
+
+      <main className='gallery-page'>
+        <header className='gallery-header'>
+          <h2>گالری تصاویر</h2>
+          <p>تصاویر بیمارستان مهر ایرانیان پرند</p>
+        </header>
+
+        <section className='gallery-grid' aria-label='تصاویر گالری بیمارستان'>
+          {images.map((image, index) => (
+            <button
+              type='button'
+              className='gallery-card'
               key={image.id}
+              aria-label={`نمایش تصویر ${index + 1} از گالری`}
+              onClick={() => setSelectedImage(index)}
+            >
+              <Image
+                src={image.image}
                 alt={image.title}
-                                                       width={350}
-                                                       style={{ cursor: 'zoom-in' }}
-                                                       className={'responsive-img'}
-                                                       src={AppFile(`panel-public/uploads/HospitalGallery/${image.imageAddr}`)}
-                                                       onClick={() => {
-                                                           lightBoxHandler(true, index);
+                layout='fill'
+                objectFit='cover'
+                placeholder='blur'
+                blurDataURL={`data:image/svg+xml;base64,${toBase64(shimmer(640, 360))}`}
+              />
+            </button>
+          ))}
+        </section>
+      </main>
+
+      {selectedImage !== null && (
+        <div className='lightbox' role='dialog' aria-modal='true' aria-label='نمایش تصویر گالری' onClick={closeLightbox}>
+          <button type='button' className='lightbox-close' aria-label='بستن تصویر' onClick={closeLightbox}>
+            &times;
+          </button>
+          <button
+            type='button'
+            className='lightbox-navigation lightbox-previous'
+            aria-label='تصویر قبلی'
+            onClick={event => {
+              event.stopPropagation()
+              showPreviousImage()
             }}
+          >
+            &#8249;
+          </button>
+          <img
+            className='lightbox-image'
+            src={images[selectedImage].image}
+            alt={images[selectedImage].title}
+            onClick={event => event.stopPropagation()}
           />
-                                                   <br />
-                                                   <span>{ image.title }</span>
-                                               </div>
-                                           </MDBCol>
-                                       )
-                                   })}
-                               </MDBRow>
-                           </TabPanel>
-                       </TabPanels>
-                   </Tabs>
-
-                   <LightBox
-                       state={toggle}
-                       event={lightBoxHandler}
-                       data={Images.dataImage}
-                       imageWidth="60vw"
-                       imageHeight="70vh"
-                       thumbnailHeight={50}
-                       thumbnailWidth={50}
-                       setImageIndex={setSIndex}
-                       imageIndex={sIndex}
-                   />
-                   <br />
-                   <br />
-                   <br />
-                   <br />
+          <button
+            type='button'
+            className='lightbox-navigation lightbox-next'
+            aria-label='تصویر بعدی'
+            onClick={event => {
+              event.stopPropagation()
+              showNextImage()
+            }}
+          >
+            &#8250;
+          </button>
+          <p className='lightbox-counter'>
+            {selectedImage + 1} از {images.length}
+          </p>
         </div>
+      )}
     </AppContainer>
+  )
+}
+
+export async function getStaticProps() {
+  const galleryDirectory = path.join(process.cwd(), 'public', 'resource', 'images', 'gallery')
+  const fileNames = fs
+    .readdirSync(galleryDirectory)
+    .filter(fileName => /\.(jpe?g|png|webp)$/i.test(fileName))
+    .sort((first, second) => first.localeCompare(second, undefined, { numeric: true }))
+
+  const images = fileNames.map((fileName, index) => ({
+    id: fileName,
+    image: `/resource/images/gallery/${encodeURIComponent(fileName)}`,
+    title: `تصویر ${index + 1} از بیمارستان مهر ایرانیان پرند`
+  }))
 
-        </div>
-    );
-};
-export async function getServerSideProps(context) {
-    const res = await axios.get(AppUrl('GetGalleyImages'));
   return {
-        props: {
-            dataImage : res.data
-        }, // will be passed to the page component as props
+    props: { images }
   }
 }
-export default Gallery;
+
+export default Gallery

pages/News.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import React from 'react'
 import {
   MDBCard,
   MDBCardImage,
@@ -7,35 +7,64 @@ import {
   MDBCardText,
   MDBRow,
   MDBCol,
-    MDBContainer, MDBCardHeader, MDBBtn, MDBIcon, MDBInputGroupText, MDBTypography
-} from 'mdb-react-ui-kit';
-import axios from "axios";
-import Link from "next/link";
-import AppContainer from "./appContainer";
+  MDBContainer,
+  MDBCardHeader,
+  MDBBtn,
+  MDBIcon,
+  MDBInputGroupText,
+  MDBTypography
+} from 'mdb-react-ui-kit'
+import axios from 'axios'
+import Link from 'next/link'
+import AppContainer from './appContainer'
 import { useRouter } from 'next/router'
-import {AppUrl} from "../lib/api";
-import {DownloadIcon} from "@chakra-ui/icons";
+import { AppUrl } from '../lib/api'
+import { DownloadIcon } from '@chakra-ui/icons'
 
-const News = ({data, children}) => {
-    const router = useRouter();
-    const query = router.query.list;
+const News = ({ data, children }) => {
+  const router = useRouter()
+  const query = router.query.list
 
   const dataPage = (
     <div className='lg:mx-20 sm:mx-5'>
-            <h5 style={{ marginTop: '2rem' }} className={'right-align font-weight-bold'}>اطلاعیه  ها </h5>
+      <h5 style={{ marginTop: '2rem' }} className={'right-align font-weight-bold'}>
+        اطلاعیه ها{' '}
+      </h5>
       <hr />
       <div>
-                <MDBTypography style={{direction: 'rtl',borderRadius: '6px solid',borderRight: '6px  solid #1266f1',borderLeft: 'none'}} note noteColor='primary'>
+        <MDBTypography
+          style={{ direction: 'rtl', borderRadius: '6px solid', borderRight: '6px  solid #1266f1', borderLeft: 'none' }}
+          note
+          noteColor='primary'
+        >
           <DownloadIcon className={'ml-2'} />
-                    <a title={'دانلود دفترچه معرفی و فروش سهام عمومی بیمارستان تخصصی مهر ایرانیان پرند'} download href={'./take-stock.pdf'}>                    دانلود دفترچه معرفی و فروش سهام عمومی بیمارستان تخصصی مهر پرند</a>
+          <a
+            title={'دانلود دفترچه معرفی و فروش سهام عمومی بیمارستان تخصصی مهر ایرانیان پرند'}
+            download
+            href={'./take-stock.pdf'}
+          >
+            {' '}
+            دانلود دفترچه معرفی و فروش سهام عمومی بیمارستان تخصصی مهر پرند
+          </a>
         </MDBTypography>
-                <MDBTypography style={{direction: 'rtl',borderRadius: '6px solid',borderRight: '6px  solid #1266f1',borderLeft: 'none'}} note noteColor='primary'>
+        <MDBTypography
+          style={{ direction: 'rtl', borderRadius: '6px solid', borderRight: '6px  solid #1266f1', borderLeft: 'none' }}
+          note
+          noteColor='primary'
+        >
           <DownloadIcon className={'ml-2'} />
-                    <a title={'دانلود طرح توجیهی  بیمارستان تخصصی مهر ایرانیان پرند'} download href={'./Explanatory_plan_of_Mehr_ranian_Parand_Hospital.pdf'}>                   دانلود طرح توجیهی  بیمارستان تخصصی مهر ایرانیان پرند</a>
+          <a
+            title={'دانلود طرح توجیهی  بیمارستان تخصصی مهر ایرانیان پرند'}
+            download
+            href={'./Explanatory_plan_of_Mehr_ranian_Parand_Hospital.pdf'}
+          >
+            {' '}
+            دانلود طرح توجیهی بیمارستان تخصصی مهر ایرانیان پرند
+          </a>
         </MDBTypography>
       </div>
       <br />
-            <MDBRow dir={'rtl'} className='row-cols-1 row-cols-md-3 g-4'>
+      {/* <MDBRow dir={'rtl'} className='row-cols-1 row-cols-md-3 g-4'>
                 {data && data.map(({ id, slug, title }) => (
                     <MDBCol key={id}>
                         <Link href={`page/news/${id}`} >
@@ -55,27 +84,22 @@ const News = ({data, children}) => {
                         </Link>
                     </MDBCol>
                 ))}
-            </MDBRow>
+            </MDBRow> */}
       {children}
     </div>
   )
-    return (
-        <div>
-            {query ? <AppContainer children={dataPage} title={'اطلاعیه ها '} /> : dataPage}
-        </div>
-    );
-};
+  return <div>{/* {query ? <AppContainer children={dataPage} title={'اطلاعیه ها '} /> : dataPage} */}</div>
+}
 
-export default News;
+export default News
 
-
-export const getServerSideProps =  async (context) => {
-        const allPostsData = await axios.get(AppUrl('news'));
-        const data = await allPostsData.data;
+export const getServerSideProps = async context => {
+//   const allPostsData = await axios.get(AppUrl('news'))
+//   const data = await allPostsData.data
   return {
     props: {
-            data,
-            fallback:false
-        }, // will be passed to the page component as props
+      data: null,
+      fallback: false
+    } // will be passed to the page component as props
   }
 }

pages/_app.js

@@ -37,7 +37,7 @@ export default function App({ Component, pageProps   }) {
     <Provider store={CoreStore}>
         {Loading && <Loader />}
         <ChakraProvider resetCSS={false} theme={theme}>
-            <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" />
+            {/* <link href="https://use.fontawesome.com/releases/v5.15.1/css/all.css" rel="stylesheet" /> */}
             <Component {...pageProps  } />
         </ChakraProvider>
     </Provider>

pages/appContainer.js

@@ -16,7 +16,7 @@ const AppContainer = ({ children, title }) => {
           name='keywords'
           content=' درمانگاه مهرپرند,بیمارستان مهرایرانیان پرند ,بیمارستان, بیمارستان مهر, سهام,پرند'
         />
-        <meta name='google-site-verification' content='1mcxI6a_QSwpZ-0W65WqgKOzenynNF4PXE8IBq1vEmc' />
+        <meta name="google-site-verification" content="hygRCp6fRa9qi8RXCaAosXK4mBcnCJVRH1ayHtAQy8o" />
         <link rel='icon' href='../public/resource/logo/favlogo.png' />
         <script
           type='text/javascript'

pages/components/Brands.js

@@ -180,7 +180,7 @@ function brands() {
   return (
     <div className='lg:mx-20 sm:mx-5 mt-5'>          
       <div className="flex justify-center">
-        <h3 className="bk-med font-bold">سهامداران پروژه</h3>
+        <h3 className="bk-med font-bold">همکاران پروژه</h3>
       </div>
       <div className="">
         <Swiper

pages/components/Layout/footer.js

@@ -31,13 +31,13 @@ const Footer = () => {
               <li>
                   <a href='https://club.mehriranianco.ir/' target='_blank' style={{ color: 'white' }}>  باشگاه سهامداران </a>
                 </li>
-                <li>
+                {/* <li>
                   <Link href={{ pathname: '/News', query: { list: 'list' } }}>
                     <a href='#!' className='text-white'>
                       اطلاعیه ها
                     </a>
                   </Link>
-                </li>
+                </li> */}
                 <li>
                   <Link href='/page/about' className='text-white'>
                     <a style={{ color: 'white' }}> درباره </a>

pages/components/Layout/header.js

@@ -74,7 +74,7 @@ export default function App() {
                 <FaInstagram />
               </a>
             </div>
-            <div className=' w-10 h-10 md:w-12 md:h-12 flex items-center justify-center'>
+            {/* <div className=' w-10 h-10 md:w-12 md:h-12 flex items-center justify-center'>
               <a
                 href={'https://www.aparat.com/miphospital'}
                 target={'_blank'}
@@ -82,7 +82,7 @@ export default function App() {
               >
                 <SiAparat />
               </a>
-            </div>
+            </div> */}
             <div className='flex items-center justify-center'>
               <a
                 href={'tel:02153457000'}
@@ -145,14 +145,14 @@ export default function App() {
                       درباره ما
                     </MDBDropdownLink>
                   </Link>
-                  <MDBDropdownItem></MDBDropdownItem>
-                  <MDBDropdownItem>
+                  {/* <MDBDropdownItem></MDBDropdownItem> */}
+                  {/* <MDBDropdownItem>
                     <Link href={'/page/docs'}>
                       <MDBDropdownLink style={{ cursor: 'pointer' }} className={'d-flex  justify-content-end'}>
                         اسناد رسمی شرکت{' '}
                       </MDBDropdownLink>
                     </Link>
-                  </MDBDropdownItem>
+                  </MDBDropdownItem> */}
                   <MDBDropdownItem>
                     <MDBDropdownLink
                       target={'__blanck'}
@@ -206,7 +206,7 @@ export default function App() {
                   </div>
                 </Link>
               </MDBNavbarLink>
-              <MDBNavbarLink
+              {/* <MDBNavbarLink
                 className={router.pathname === '/page/news/34' ? 'active-item text-white' : '' + 'text-white nav_item '}
               >
                 <Link prefetch={false} className={'text-white nav_item d-flex flex-row-reverse '} href='/page/news/34'>
@@ -214,8 +214,8 @@ export default function App() {
                     <span style={{ cursor: 'pointer', fontSize: '15px' }}> شرایط انتقال سهام</span>
                   </div>
                 </Link>
-              </MDBNavbarLink>
-              <MDBNavbarLink
+              </MDBNavbarLink> */}
+              {/* <MDBNavbarLink
                 className={
                   router.pathname === '/medical-equipment' ? 'active-item text-white' : '' + 'text-white nav_item '
                 }
@@ -225,8 +225,8 @@ export default function App() {
                     <span style={{ cursor: 'pointer', fontSize: '15px' }}>واحد تجهیزات پزشکی </span>
                   </div>
                 </Link>
-              </MDBNavbarLink>
-              <MDBNavbarLink
+              </MDBNavbarLink> */}
+              {/* <MDBNavbarLink
                 className={router.pathname === '/stock-unit' ? 'active-item text-white' : '' + 'text-white nav_item '}
               >
                 <Link className={'text-white nav_item d-flex flex-row-reverse '} href='/stock-unit'>
@@ -234,7 +234,7 @@ export default function App() {
                     <span style={{ cursor: 'pointer', fontSize: '15px' }}>امور سهام </span>
                   </div>
                 </Link>
-              </MDBNavbarLink>
+              </MDBNavbarLink> */}
 
               {/* <MDBNavbarLink
                 className={router.pathname === '/page/news/52' ? 'active-item text-white' : '' + 'text-white nav_item '}

pages/components/Paralax.js

@@ -19,7 +19,7 @@ const Paralax = () => {
 
     return (
         <div className='bg-image mt-5 d-flex flex-md-column flex-sm-column ' style={{ maxWidth: '1080rem' }}>
-            <img  style={{ width: '100%' }}  src={'https://mehrara-api.iran.liara.run/panel-public/uploads/1653317481HLqP4.jpg'} alt="Picture of the author" />
+            <img  style={{ width: '100%' }}  src={''} alt="Picture of the author" />
             <div className='mask' style={{ backgroundColor: 'rgba(0, 0, 0, 0.6)' }}>
                 <div className='d-flex flex-md-column flex-sm-column justify-content-center align-items-center h-100 dana'>
                     <h2 className='text-white p-5 mb-0'>

pages/components/connect.js

@@ -1,6 +1,6 @@
 import React from 'react';
-import {useState} from "react";
-import {useFormik ,Form} from "formik";
+import { useState } from "react";
+import { useFormik, Form } from "formik";
 import { Formik } from "formik";
 
 import * as Yup from 'yup'
@@ -10,21 +10,21 @@ import {
     MDBInputGroupElement, MDBContainer, MDBRow, MDBIcon, MDBInput, MDBBtn, MDBSpinner, MDBTypography
 } from 'mdb-react-ui-kit'
 import axios from "axios";
-import {AppUrl} from "../../lib/api";
-import {AiOutlinePhone, AiOutlineUser} from "react-icons/ai";
+import { AppUrl } from "../../lib/api";
+import { AiOutlinePhone, AiOutlineUser } from "react-icons/ai";
 
 const Connect = () => {
-    const [Loading,setLoading] = useState(false);
-    const [Success,setSuccess] = useState(false);
+    const [Loading, setLoading] = useState(false);
+    const [Success, setSuccess] = useState(false);
 
     return (
         <>
             <Formik
-                initialValues={{ name: "" ,PhoneNumber: "",text: ""}}
-                onSubmit={async (values,{resetForm}) => {
+                initialValues={{ name: "", PhoneNumber: "", text: "" }}
+                onSubmit={async (values, { resetForm }) => {
                     setLoading(true);
                     const dataForm = values;
-                    const SubmitForm = axios.post(AppUrl('contact-us'),dataForm).then((res) => {
+                    const SubmitForm = axios.post(AppUrl('contact-us'), dataForm).then((res) => {
                         if (res.status === 200) {
                             setLoading(false);
                             setSuccess(true);
@@ -39,8 +39,8 @@ const Connect = () => {
                 validateOnBlur={false}
                 validationSchema={Yup.object().shape({
                     name: Yup.string().required("وارد کردن نام الزامی است."),
-                    PhoneNumber : Yup.string().required('شماره تلفن الزامی است .'),
-                    text : Yup.string().required('متن پیام وارد نشده  است. '),
+                    PhoneNumber: Yup.string().required('شماره تلفن الزامی است .'),
+                    text: Yup.string().required('متن پیام وارد نشده  است. '),
                 })}
             >
                 {props => {
@@ -55,12 +55,12 @@ const Connect = () => {
                         handleReset
                     } = props;
                     return (
-                        <form id={'contactUsform'} style={{marginTop: '25px'}} onSubmit={handleSubmit}>
+                        <form id={'contactUsform'} style={{ marginTop: '25px' }} onSubmit={handleSubmit}>
                             <div className='lg:mx-20 sm:mx-5'>
-                <h5 className={'right-align font-weight-bold'}>  تماس با ما و مشاوره خرید سهام  </h5>
+                                <h5 className={'right-align font-weight-bold'}>  تماس با ما    </h5>
                                 <br />
                                 <MDBRow>
-                                    <MDBInputGroup className='mb-3' style={{width: '50%'}}>
+                                    <MDBInputGroup className='mb-3' style={{ width: '50%' }}>
                                         <MDBInputGroupElement
                                             onChange={handleChange}
                                             onBlur={handleBlur}
@@ -77,7 +77,7 @@ const Connect = () => {
 
                                     </MDBInputGroup>
 
-                                    <MDBInputGroup className='mb-3' style={{width: '50%'}}>
+                                    <MDBInputGroup className='mb-3' style={{ width: '50%' }}>
                                         <MDBInputGroupElement
                                             value={values.name}
                                             onChange={handleChange}
@@ -90,7 +90,7 @@ const Connect = () => {
                                             <AiOutlineUser />
                                         </MDBInputGroupText>
                                     </MDBInputGroup>
-                                    <MDBInputGroup className='mb-3' style={{width: '100%'}}>
+                                    <MDBInputGroup className='mb-3' style={{ width: '100%' }}>
                                         <MDBInputGroupElement
                                             name={'text'}
                                             id={'text'}
@@ -98,7 +98,7 @@ const Connect = () => {
                                             onChange={handleChange}
                                             dir={'rtl'}
                                             className={'right-align RTL'}
-                                            style={{height: '100%'}}
+                                            style={{ height: '100%' }}
                                             placeholder='متن پیام  خود را وارد کنید'
                                             textarea
                                             type='text' />
@@ -110,7 +110,7 @@ const Connect = () => {
                                             <MDBSpinner grow size='sm' role='status' tag='span' />
                                             <span className='visually-hidden'>Loading...</span>
                                         </>
-                                        ):
+                                    ) :
                                         <>
                                             ارسال
                                         </>
@@ -120,23 +120,23 @@ const Connect = () => {
                                     <div className={'d-flex justify-content-end text-danger '}>
                                         {errors.PhoneNumber}
                                     </div>
-                                ): null}
+                                ) : null}
                                 {touched.name && errors.name ? (
                                     <div className={'d-flex justify-content-end text-danger '}>
                                         {errors.name}
                                     </div>
-                                ): null}
+                                ) : null}
                                 {touched.text && errors.text ? (
                                     <div className={'d-flex justify-content-end text-danger '}>
                                         {errors.text}
                                     </div>
-                                ): null}
-                                <br/>
+                                ) : null}
+                                <br />
                                 {Success ? (
-                                    <MDBTypography style={{direction: 'rtl',borderRadius: '6px solid',borderRight: '6px  solid #00B74A',borderLeft: 'none'}} note noteColor='success'>
+                                    <MDBTypography style={{ direction: 'rtl', borderRadius: '6px solid', borderRight: '6px  solid #00B74A', borderLeft: 'none' }} note noteColor='success'>
                                         اطلاعات شما ارسال شد ، بعد از بررسی با شما تماس گرفته می شود .
                                     </MDBTypography>
-                                ): null}
+                                ) : null}
                             </div>
 
 

pages/components/slider.js

@@ -27,11 +27,11 @@ const Slider = () => {
             <img src={SliderOne} />
           </Link>
         </SwiperSlide> */}
-        <SwiperSlide key={2} style={{ cursor: 'pointer' }} className='pointer'>
+        {/* <SwiperSlide key={2} style={{ cursor: 'pointer' }} className='pointer'>
           <Link href='/page/news/89'>
             <img src={TransferStockBanner} />
           </Link>
-        </SwiperSlide>
+        </SwiperSlide> */}
         {/* <SwiperSlide key={2} style={{ cursor: 'pointer' }} className='pointer'>
           <Link href='/page/news/82'>
             <img src={LimitSlider} />

pages/index.js

@@ -2,13 +2,7 @@ import AppContainer from './appContainer'
 import Slider from './components/slider'
 import News from './News'
 import axios from 'axios'
-import {
-  MDBBtn,
-  MDBCard,
-  MDBCardBody,
-  MDBContainer,
-  MDBIcon,
-} from 'mdb-react-ui-kit'
+import { MDBBtn, MDBCard, MDBCardBody, MDBContainer, MDBIcon } from 'mdb-react-ui-kit'
 import Link from 'next/link'
 import Paralax from './components/Paralax'
 import Service from './components/service'
@@ -40,7 +34,7 @@ export default function Home({ data_NEWS }) {
         <Slider />
         <br />
         <div className='lg:mx-20 sm:mx-5'>
-          <SimpleGrid spacing={15} columns={[1, 2, 3]}>
+          <SimpleGrid spacing={15} columns={[1, 2, 2]}>
             <Link href={'/page/contact-us'}>
               <MDBCard className={'bg-neutral-100 fst-box hover:bg-neutral-200  cursor-pointer hover:shadow-2xl'}>
                 <MDBCardBody className={'flex justify-content-center'}>ارتباط با ما</MDBCardBody>
@@ -56,11 +50,11 @@ export default function Home({ data_NEWS }) {
                 <MDBCardBody className={'flex justify-content-center'}>سوالات متداول</MDBCardBody>
               </MDBCard>
             </Link>
-            <Link href={'/stock-unit'}>
+            {/* <Link href={'/stock-unit'}>
               <MDBCard className={'bg-neutral-100 fst-box hover:bg-neutral-200  cursor-pointer hover:shadow-2xl'}>
                 <MDBCardBody className={'flex justify-content-center'}> واحد امور سهام</MDBCardBody>
               </MDBCard>
-            </Link>
+            </Link> */}
           </SimpleGrid>
           {/* <div className={'mt-5'}>
             <OnlineSales />
@@ -114,10 +108,10 @@ export default function Home({ data_NEWS }) {
 }
 
 export const getServerSideProps = async context => {
-  const allPostsData = await axios.get(AppUrl('news'))
-  const data_NEWS = await allPostsData.data.slice(0, 6)
+  // const allPostsData = await axios.get(AppUrl('news'))
+  // const data_NEWS = await allPostsData.data.slice(0, 6)
 
   return {
-    props: { data_NEWS, fallback: false } // will be passed to the page component as props
+    props: { data_NEWS: null, fallback: false } // will be passed to the page component as props
   }
 }

pages/medical-equipment/index.js

@@ -16,32 +16,6 @@ const MedicalEquipment = () => {
           height={2000}
         />
       </div>
-      <div className='lg:mx-20 sm:mx-5 my-25'> 
-      <div className={'bk-med flex justify-content-center align-items-center flex-col'}>
-          <div>
-            <MDBTypography
-              style={{ borderLeft: 'none', borderRight: '6px solid ', backgroundColor: '#F0F0F0' }}
-              note
-              noteColor='dark'
-              className='mb-0'
-            >
-              <MDBRow>
-                <MDBTypography className={'dana right-align'}>
-                  اگر به دنبال همکاری با بخش تجهیزات بیمارستان هستید، لطفا با یکی از شماره‌های زیر تماس حاصل نمایید تا
-                  اطلاعات بیشتری در این خصوص از ما دریافت کنید
-                </MDBTypography>
-              </MDBRow>
-            </MDBTypography>
-          </div>
-          <div className='flex lg:flex-row md:flex-col justify-center items-center sm:flex-col gap-x-5 mt-4'>
-            <a className='dana' href='tel:021-53457999'>021-53457999</a>
-            <br />
-            <a className='dana' href='tel:09194199420'>09194199420</a>
-            <br />
-              <a>خانم زارعی</a>
-          </div>
-        </div>
-      </div>
     </AppContainer>
   )
 }

pages/page/about.js

@@ -29,8 +29,8 @@ const About = (props) => {
 
                    </h5>
                    <p className={'right-align RTL'}>
-                       بیمارستان تخصصی مهرایرانیان واقع در  اتوبان چهاربانده اصلی داخلی شهر پرند در بهترین موقعیت مکانی و در دل مسکن مهر،  با فضای درمانی به متراژ تقریبی 500/14 متر مربع همراه با 4000 متر پارکینگ طبقاتی، با هدف تبدیل شدن به یکی از قطب های درمانی منطقه در حال احداث می باشد. این بیمارستان که تنها بیمارستان تخصصی در کنار بزرگترین فرودگاه کشور است در فاز اولیه احداث دارای 96 تختخواب و دارای بخش های ICU،CCU،NICU،زایشگاه، اتاق های عمل، مرکز تصویربرداری،آزمایشگاه،داروخانه، اورژانس، بخش اسکوپی و گوارش، و دندانپزشکی عمومی و تخصصی می باشد. این بیمارستان در آینده نه چندان دور سهم بسزایی در بهداشت و درمان منطقه جنوب غرب تهران که شامل شهرهای پرند،رباط کریم،نسیم شهر و شهرک های تابعه است، خواهد داشت.
-                       در حال حاضر این پروژه 30% پیشرفت فیزیکی داشته و طبقه همکف آن که شامل اورژانس و کلینیک های تخصصی است تا پایان آبان 1400 تکمیل خواهد شد.
+                       بیمارستان تخصصی مهرایرانیان واقع در  اتوبان چهاربانده اصلی داخلی شهر پرند در بهترین موقعیت مکانی و در دل مسکن مهر،  با فضای درمانی به متراژ تقریبی 21.000 متر مربع همراه با 4000 متر پارکینگ طبقاتی، با هدف تبدیل شدن به یکی از قطب های درمانی منطقه در حال احداث می باشد. این بیمارستان که تنها بیمارستان تخصصی در کنار بزرگترین فرودگاه کشور است در فاز اولیه احداث دارای 96 تختخواب و دارای بخش های ICU،CCU،NICU،زایشگاه، اتاق های عمل، مرکز تصویربرداری،آزمایشگاه،داروخانه، اورژانس، بخش اسکوپی و گوارش، و دندانپزشکی عمومی و تخصصی می باشد. این بیمارستان در آینده نه چندان دور سهم بسزایی در بهداشت و درمان منطقه جنوب غرب تهران که شامل شهرهای پرند،رباط کریم،نسیم شهر و شهرک های تابعه است، خواهد داشت.
+                       در حال حاضر این پروژه 80% پیشرفت فیزیکی داشته و طبقه همکف آن که شامل اورژانس و کلینیک های تخصصی است تا پایان آبان 1400 تکمیل خواهد شد.
                        مرحله راه اندازی بیمارستان با حداقل ظرفیت تا پایان سال 1402 و مرحله تکمیل و راه اندازی کامل بیمارستان با ظرفیت 200 تخت در سال 1403 انجام خواهد شد.
 
                    </p>
@@ -40,8 +40,8 @@ const About = (props) => {
                    <br/>
                   <div>
                       <MDBProgress height='30'>
-                          <MDBProgressBar className={'dana'} width='45' valuemin={0} valuemax={100}>
-                              45% پیشرفت فیزیکی پروژه
+                          <MDBProgressBar className={'dana'} width='80' valuemin={0} valuemax={100}>
+                              80% پیشرفت فیزیکی پروژه
                           </MDBProgressBar>
                       </MDBProgress>
                   </div>

pages/questions/index.js

@@ -15,21 +15,21 @@ const QuestionAndAnswer = () => {
     //   title: '  قیمت سهام ',
     //   text: ` (بروزرسانی : خرداد 1401   ) فروش سهام با تعداد محدود و مدت محدود با ${Stock_price} قيمت  تومان`
     // },
-    {
-      id: 2,
-      title: 'چگونه سهام خریداری کنیم ؟ ',
-      text: 'برای خرید سهام می توانید با شماره 53547000-021 تماس حاصل فرمایید یا از طریق مراجعه به دفتر خرید سهام (واقع در شهر پرند ، بلوار شهید فاسم سلیمانی ( چهار بانده) فاز 5 ، بیمارستان مهر ایرانیان پرند) اقدام به خرید سهام فرمایید .'
-    },
-    {
-      id: 3,
-      title: 'سود سالیانه هر سهامدار چگونه انجام می شود ؟ ',
-      text: 'سود سالیانه بر اساس درآمد یک ساله بیمارستان بعد از برآورد هزینه ها و خرج های بیمارستان و تصمیم هیئت مدیره شرکت سهامی بر اساس مقدار سهم  سهامدار سود پرداخت می شود'
-    },
-    {
-      id: 7,
-      title: 'آیا امکان انتقال سهام وجود دارد ؟ ',
-      text: 'بله امكان فروش مجدد سهام وجود دارد , نقل و انتقال مورد قبول شركت فقط از طريق طي مراحل قانوني كه در دفتر امور سهام شركت و مبايعه نامه نقل و انتقال في مابين خريدار و فروشنده ميبايست به تاييد شركت و هر نوع معامله اي ميبايست به نرخ اعلامي روز از جانب شركت انجام گرفته شده باشد.'
-    },
+    // {
+    //   id: 2,
+    //   title: 'چگونه سهام خریداری کنیم ؟ ',
+    //   text: 'برای خرید سهام می توانید با شماره 53547000-021 تماس حاصل فرمایید یا از طریق مراجعه به دفتر خرید سهام (واقع در شهر پرند ، بلوار شهید فاسم سلیمانی ( چهار بانده) فاز 5 ، بیمارستان مهر ایرانیان پرند) اقدام به خرید سهام فرمایید .'
+    // },
+    // {
+    //   id: 3,
+    //   title: 'سود سالیانه هر سهامدار چگونه انجام می شود ؟ ',
+    //   text: 'سود سالیانه بر اساس درآمد یک ساله بیمارستان بعد از برآورد هزینه ها و خرج های بیمارستان و تصمیم هیئت مدیره شرکت سهامی بر اساس مقدار سهم  سهامدار سود پرداخت می شود'
+    // },
+    // {
+    //   id: 7,
+    //   title: 'آیا امکان انتقال سهام وجود دارد ؟ ',
+    //   text: 'بله امكان فروش مجدد سهام وجود دارد , نقل و انتقال مورد قبول شركت فقط از طريق طي مراحل قانوني كه در دفتر امور سهام شركت و مبايعه نامه نقل و انتقال في مابين خريدار و فروشنده ميبايست به تاييد شركت و هر نوع معامله اي ميبايست به نرخ اعلامي روز از جانب شركت انجام گرفته شده باشد.'
+    // },
     {
       id: 5,
       title: 'امکانات باشگاه VIP سهامداران',

pages/smartadvice/index.js

@@ -112,7 +112,7 @@ const SmartAdvice = () => {
                               </div>
                                 <div className={'flex justify-content-center m-2'}>
                                     {page === 5 ? (
-                                        <MDBBtn onClick={SubmitForm} size={'lg'}  className={'mt-2 bk-med text-center bg-primary-teal'}>ثبت در خواست مشاوره خرید سهام  </MDBBtn>
+                                        <MDBBtn onClick={SubmitForm} size={'lg'}  className={'mt-2 bk-med text-center bg-primary-teal'}>  درخواست مشاوره    </MDBBtn>
                                     ): ''}
                                 </div>
                             </div>

pages/stock-unit/index.jsx

@@ -23,12 +23,12 @@ const StockUnit = () => {
   return (
     <AppContainer title={' امور سهام'}>
       <div className='parallax-container'>
-        <div
+        {/* <div
           style={{ fontSize: 30 }}
           className={'center-align text-white header_back service-text dana font-weight-bold'}
         >
           امور سهام
-        </div>
+        </div> */}
         <Image
           loader={Parallax}
           src='Parallax.png'
@@ -67,8 +67,8 @@ const StockUnit = () => {
           </SimpleGrid>
         </div>
         <div className='text-center w-full'>
-          <a className='' href='tel:02153757999'>
-            امور سهامداران: 02153757999
+          <a className='' href='tel:02153457999'>
+            امور سهامداران: 53457999 - 021
           </a>
         </div>
       </div>

pages/stock-unit/stock-sales/index.jsx

@@ -94,7 +94,7 @@ const StockSalesContainer = () => {
                 <div className='addressAbout pr-8 pl-8 pt-[1.8rem]'>
                   <h4 className='text-white font-bold md:text-xl	'>ارتباط با واحد سهام</h4>
                   <p className='text-white font-light md:text-lg pt-[0.5rem]'>
-                    بعد از ارسال درخواست کارشناسان طی 24 ساعت با شما تماس خواهند گرفت
+                    {/* بعد از ارسال درخواست کارشناسان طی 24 ساعت با شما تماس خواهند گرفت */}
                   </p>
 
                   <div className='address'>