admin + loader fix
|
@ -4,7 +4,7 @@
|
|||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "set NODE_OPTIONS=--max-old-space-size=4096 && next build",
|
||||
"build": "next build",
|
||||
"start": "next start -p 8080 -H 0.0.0.0",
|
||||
"lint": "next lint"
|
||||
},
|
||||
|
|
Before Width: | Height: | Size: 119 KiB |
Before Width: | Height: | Size: 46 KiB |
Before Width: | Height: | Size: 490 KiB After Width: | Height: | Size: 490 KiB |
Before Width: | Height: | Size: 216 KiB After Width: | Height: | Size: 216 KiB |
Before Width: | Height: | Size: 7.2 KiB After Width: | Height: | Size: 7.2 KiB |
Before Width: | Height: | Size: 6.6 KiB After Width: | Height: | Size: 6.6 KiB |
Before Width: | Height: | Size: 1.3 KiB After Width: | Height: | Size: 1.3 KiB |
Before Width: | Height: | Size: 707 B After Width: | Height: | Size: 707 B |
Before Width: | Height: | Size: 7.9 KiB After Width: | Height: | Size: 7.9 KiB |
Before Width: | Height: | Size: 686 B After Width: | Height: | Size: 686 B |
Before Width: | Height: | Size: 674 B After Width: | Height: | Size: 674 B |
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 643 B After Width: | Height: | Size: 643 B |
Before Width: | Height: | Size: 2.7 KiB After Width: | Height: | Size: 2.7 KiB |
Before Width: | Height: | Size: 663 B After Width: | Height: | Size: 663 B |
Before Width: | Height: | Size: 783 B After Width: | Height: | Size: 783 B |
Before Width: | Height: | Size: 708 B After Width: | Height: | Size: 708 B |
Before Width: | Height: | Size: 442 B After Width: | Height: | Size: 442 B |
Before Width: | Height: | Size: 732 B After Width: | Height: | Size: 732 B |
Before Width: | Height: | Size: 24 KiB After Width: | Height: | Size: 24 KiB |
Before Width: | Height: | Size: 1.0 KiB After Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 461 B After Width: | Height: | Size: 461 B |
Before Width: | Height: | Size: 9.2 KiB After Width: | Height: | Size: 9.2 KiB |
Before Width: | Height: | Size: 1.1 KiB After Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 422 B After Width: | Height: | Size: 422 B |
Before Width: | Height: | Size: 446 B After Width: | Height: | Size: 446 B |
Before Width: | Height: | Size: 10 KiB After Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 881 B After Width: | Height: | Size: 881 B |
Before Width: | Height: | Size: 678 B After Width: | Height: | Size: 678 B |
Before Width: | Height: | Size: 132 KiB |
Before Width: | Height: | Size: 457 KiB After Width: | Height: | Size: 327 KiB |
Before Width: | Height: | Size: 373 KiB After Width: | Height: | Size: 612 KiB |
Before Width: | Height: | Size: 801 KiB After Width: | Height: | Size: 612 KiB |
|
@ -1,10 +1,8 @@
|
|||
import Auth from '@/components/screens/admin/auth/Auth'
|
||||
import React from 'react'
|
||||
import Auth from "@/components/screens/admin/auth/Auth";
|
||||
import React from "react";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function page({}: Props) {
|
||||
return (
|
||||
<Auth />
|
||||
)
|
||||
return <Auth />;
|
||||
}
|
|
@ -1,23 +1,24 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import { useRouter } from 'next/navigation'
|
||||
import { useEffect } from 'react'
|
||||
import Auth from "@/components/screens/admin/auth/Auth";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useEffect } from "react";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function page({}: Props) {
|
||||
const router = useRouter()
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
const hasCookie = document.cookie.includes('_identid')
|
||||
if (!hasCookie) {
|
||||
router.push('/admin/auth')
|
||||
return
|
||||
}
|
||||
else {
|
||||
router.push('/admin/applications')
|
||||
}
|
||||
}, [])
|
||||
// useEffect(() => {
|
||||
// const hasCookie = document.cookie.includes('_identid')
|
||||
// if (!hasCookie) {
|
||||
// router.push('/admin/auth')
|
||||
// return
|
||||
// }
|
||||
// else {
|
||||
// router.push('/admin/applications')
|
||||
// }
|
||||
// }, [])
|
||||
|
||||
return <></>
|
||||
return <Auth />;
|
||||
}
|
||||
|
|
|
@ -32,8 +32,8 @@ export const LoadingSpinner = styled.div`
|
|||
export default function Loader({}: Props) {
|
||||
return (
|
||||
<LoadingSpinner>
|
||||
<img src='/loader_1.svg' alt='loader' />
|
||||
<img src='/loader_2.svg' alt='loader' />
|
||||
<img src="/image/loader_1.svg" alt="loader" />
|
||||
<img src="/image/loader_2.svg" alt="loader" />
|
||||
</LoadingSpinner>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,11 +1,11 @@
|
|||
import MainButton from '@/components/UI/button/MainButton'
|
||||
import FormInput from '@/components/UI/input/FormInput'
|
||||
import OrdersService from '@/services/order/ordersServices'
|
||||
import { T_Product } from '@/services/product/type'
|
||||
import { ChangeEvent, FormEvent, useEffect, useState } from 'react'
|
||||
import styled from 'styled-components'
|
||||
import PhoneInput from '../UI/input/PhoneInput'
|
||||
import Loader from '../UI/loader/Loader'
|
||||
import MainButton from "@/components/UI/button/MainButton";
|
||||
import FormInput from "@/components/UI/input/FormInput";
|
||||
import OrdersService from "@/services/order/ordersServices";
|
||||
import { T_Product } from "@/services/product/type";
|
||||
import { ChangeEvent, FormEvent, useEffect, useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import PhoneInput from "../UI/input/PhoneInput";
|
||||
import Loader from "../UI/loader/Loader";
|
||||
|
||||
const Container = styled.form`
|
||||
display: flex;
|
||||
|
@ -16,7 +16,7 @@ const Container = styled.form`
|
|||
${(props) => props.theme.mediaQueries.mobile} {
|
||||
width: 100%;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const Notification = styled.div`
|
||||
z-index: 5;
|
||||
|
@ -43,98 +43,102 @@ const Notification = styled.div`
|
|||
border-radius: 12px;
|
||||
background: ${(props) => props.theme.colors.white};
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {
|
||||
setModal: (param: boolean) => void
|
||||
item?: T_Product
|
||||
modal?: boolean
|
||||
}
|
||||
setModal: (param: boolean) => void;
|
||||
item?: T_Product;
|
||||
modal?: boolean;
|
||||
};
|
||||
|
||||
export default function AddApplicationForm({ setModal, item, modal }: Props) {
|
||||
const [errorMessage, setErrorMessage] = useState('')
|
||||
const [errorState, setErrorState] = useState(false)
|
||||
const [notificationModalState, setNotificationModalState] = useState(false)
|
||||
const [loadingState, setLoadingState] = useState(false)
|
||||
const [errorMessage, setErrorMessage] = useState("");
|
||||
const [errorState, setErrorState] = useState(false);
|
||||
const [notificationModalState, setNotificationModalState] = useState(false);
|
||||
const [loadingState, setLoadingState] = useState(false);
|
||||
|
||||
const [buttonDisabledState, setButtonDisabledState] = useState(true)
|
||||
const [buttonDisabledState, setButtonDisabledState] = useState(true);
|
||||
|
||||
const [newApp, setNewApp] = useState({
|
||||
email: '',
|
||||
phone: ''
|
||||
})
|
||||
email: "",
|
||||
phone: "",
|
||||
});
|
||||
|
||||
useEffect(() => {
|
||||
setNewApp({
|
||||
email: '',
|
||||
phone: ''
|
||||
})
|
||||
}, [modal])
|
||||
email: "",
|
||||
phone: "",
|
||||
});
|
||||
}, [modal]);
|
||||
|
||||
useEffect(() => {
|
||||
if (newApp.email === '' || newApp.phone === '') {
|
||||
setButtonDisabledState(true)
|
||||
if (newApp.email === "" || newApp.phone === "") {
|
||||
setButtonDisabledState(true);
|
||||
} else {
|
||||
setButtonDisabledState(false)
|
||||
setButtonDisabledState(false);
|
||||
}
|
||||
}, [newApp])
|
||||
}, [newApp]);
|
||||
|
||||
const createCallApp = async (e: FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault()
|
||||
if (errorState) return
|
||||
try {
|
||||
const newAppData = {
|
||||
Phone: newApp.phone,
|
||||
Email: newApp.email
|
||||
}
|
||||
const response = await OrdersService.createCall(newAppData)
|
||||
|
||||
if (response.status === 200) {
|
||||
setNotificationModalState(true)
|
||||
} else {
|
||||
setErrorMessage(response.data)
|
||||
setErrorState(true)
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
|
||||
const createApp = async (e: FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault()
|
||||
if (errorState) return
|
||||
setLoadingState(true)
|
||||
e.preventDefault();
|
||||
if (errorState) return;
|
||||
try {
|
||||
const newAppData = {
|
||||
Phone: newApp.phone,
|
||||
Email: newApp.email,
|
||||
Positions: item ? [{ Id: item.Id, Count: 1 }] : []
|
||||
};
|
||||
const response = await OrdersService.createCall(newAppData);
|
||||
|
||||
if (response.status === 200) {
|
||||
setNotificationModalState(true);
|
||||
} else {
|
||||
setErrorMessage(response.data);
|
||||
setErrorState(true);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
const createApp = async (e: FormEvent<HTMLFormElement>) => {
|
||||
e.preventDefault();
|
||||
if (errorState) return;
|
||||
setLoadingState(true);
|
||||
try {
|
||||
const newAppData = {
|
||||
Phone: newApp.phone,
|
||||
Email: newApp.email,
|
||||
Positions: item ? [{ Id: item.Id, Count: 1 }] : [],
|
||||
};
|
||||
|
||||
const response = await (item
|
||||
? OrdersService.create(newAppData)
|
||||
: OrdersService.createCall(newAppData))
|
||||
: OrdersService.createCall(newAppData));
|
||||
|
||||
if (response.status === 200) {
|
||||
setNotificationModalState(true)
|
||||
setNotificationModalState(true);
|
||||
} else if (response.status === 404) {
|
||||
setErrorMessage("Сервер не доступен, повторите попытку позже.");
|
||||
setErrorState(true);
|
||||
} else {
|
||||
setErrorMessage(response.data)
|
||||
setErrorState(true)
|
||||
setErrorMessage(response.data);
|
||||
setErrorState(true);
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
setLoadingState(false)
|
||||
setErrorMessage("Сервер не доступен, повторите попытку позже.");
|
||||
setErrorState(true);
|
||||
}
|
||||
setLoadingState(false);
|
||||
};
|
||||
|
||||
const handlePhoneChange = (value: string) => {
|
||||
setNewApp({ ...newApp, phone: value })
|
||||
}
|
||||
setNewApp({ ...newApp, phone: value });
|
||||
};
|
||||
|
||||
const closeModal = () => {
|
||||
setModal(false)
|
||||
setNotificationModalState(false)
|
||||
}
|
||||
setModal(false);
|
||||
setNotificationModalState(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
|
@ -145,7 +149,7 @@ export default function AddApplicationForm({ setModal, item, modal }: Props) {
|
|||
onChange={(e: ChangeEvent<HTMLInputElement>) =>
|
||||
setNewApp({ ...newApp, email: e.target.value })
|
||||
}
|
||||
placeholder='Ваш email'
|
||||
placeholder="Ваш email"
|
||||
/>
|
||||
<PhoneInput value={newApp.phone} onChange={handlePhoneChange} />
|
||||
{item && <h3>Услуга: {item.Name}</h3>}
|
||||
|
@ -155,14 +159,14 @@ export default function AddApplicationForm({ setModal, item, modal }: Props) {
|
|||
</Container>
|
||||
{loadingState && (
|
||||
<Notification>
|
||||
<div className='container'>
|
||||
<div className="container">
|
||||
<Loader />
|
||||
</div>
|
||||
</Notification>
|
||||
)}
|
||||
{errorState && (
|
||||
<Notification>
|
||||
<div className='container'>
|
||||
<div className="container">
|
||||
<h4>{errorMessage}</h4>
|
||||
<MainButton fullWidth={true} onClick={() => setErrorState(false)}>
|
||||
Закрыть
|
||||
|
@ -172,7 +176,7 @@ export default function AddApplicationForm({ setModal, item, modal }: Props) {
|
|||
)}
|
||||
{notificationModalState && (
|
||||
<Notification>
|
||||
<div className='container'>
|
||||
<div className="container">
|
||||
<h4>Заявка успешно отправлена</h4>
|
||||
<MainButton fullWidth={true} onClick={closeModal}>
|
||||
Закрыть
|
||||
|
@ -181,5 +185,5 @@ export default function AddApplicationForm({ setModal, item, modal }: Props) {
|
|||
</Notification>
|
||||
)}
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,12 +1,12 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import UserService from '@/services/user/userServices'
|
||||
import Link from 'next/link'
|
||||
import { usePathname, useRouter } from 'next/navigation'
|
||||
import { useEffect } from 'react'
|
||||
import styled from 'styled-components'
|
||||
import UserService from "@/services/user/userServices";
|
||||
import Link from "next/link";
|
||||
import { usePathname, useRouter } from "next/navigation";
|
||||
import { useEffect } from "react";
|
||||
import styled from "styled-components";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
const Container = styled.div`
|
||||
background: ${(props) => props.theme.colors.green};
|
||||
|
@ -34,62 +34,56 @@ const Container = styled.div`
|
|||
color: ${(props) => props.theme.colors.white};
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
export default function AdminSideBar({}: Props) {
|
||||
const pathname = usePathname()
|
||||
const router = useRouter()
|
||||
const pathname = usePathname();
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
const hasCookie = document.cookie.includes('_identid')
|
||||
if (!hasCookie && pathname.startsWith('/admin')) {
|
||||
router.push('/admin/auth')
|
||||
return
|
||||
}
|
||||
}, [])
|
||||
// useEffect(() => {
|
||||
// const hasCookie = document.cookie.includes("_identid");
|
||||
// if (!hasCookie && pathname.startsWith("/admin")) {
|
||||
// router.push("/admin/auth");
|
||||
// return;
|
||||
// }
|
||||
// }, []);
|
||||
|
||||
const logout = async () => {
|
||||
try {
|
||||
const response = await UserService.exit()
|
||||
const response = await UserService.exit();
|
||||
if (response.status === 200) {
|
||||
router.push('/admin/auth')
|
||||
router.push("/admin");
|
||||
document.cookie =
|
||||
'_identid=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;'
|
||||
"_identid=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
return pathname.startsWith('/admin') &&
|
||||
pathname !== '/admin/auth' &&
|
||||
pathname !== '/admin' ? (
|
||||
return pathname.startsWith("/admin") &&
|
||||
pathname !== "/admin/auth" &&
|
||||
pathname !== "/admin" ? (
|
||||
<Container>
|
||||
<img src='/logo.svg' alt='' />
|
||||
<div className='menu'>
|
||||
<Link href='/admin/applications'>
|
||||
<div className='item'>
|
||||
<img src='/applications.svg' alt='' />
|
||||
<img src="/image/logo.svg" alt="" />
|
||||
<div className="menu">
|
||||
<Link href="/admin/applications">
|
||||
<div className="item">
|
||||
<img src="/image/applications.svg" alt="" />
|
||||
<p>Заявки</p>
|
||||
</div>
|
||||
</Link>
|
||||
<Link href='/admin/services'>
|
||||
<div className='item'>
|
||||
<img src='/services.svg' alt='' />
|
||||
<Link href="/admin/services">
|
||||
<div className="item">
|
||||
<img src="/image/services.svg" alt="" />
|
||||
<p>Услуги</p>
|
||||
</div>
|
||||
</Link>
|
||||
{/* <Link href='/admin/virtualCemetery'>
|
||||
<div className='item'>
|
||||
<img src='/grave.svg' alt='' />
|
||||
<p>Вечная память</p>
|
||||
</div>
|
||||
</Link> */}
|
||||
<div className='item' onClick={logout}>
|
||||
<img src='/log-out.svg' alt='' />
|
||||
<div className="item" onClick={logout}>
|
||||
<img src="/image/log-out.svg" alt="" />
|
||||
<p>Выйти</p>
|
||||
</div>
|
||||
</div>
|
||||
</Container>
|
||||
) : null
|
||||
) : null;
|
||||
}
|
||||
|
|
|
@ -1,57 +1,74 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import { Container } from '@/app/GlobalStyles'
|
||||
import Image from 'next/image'
|
||||
import Link from 'next/link'
|
||||
import { usePathname } from 'next/navigation'
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Container } from "@/app/GlobalStyles";
|
||||
import Image from "next/image";
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { useEffect, useState } from "react";
|
||||
|
||||
import LandingButton from '../../UI/button/LandingButton'
|
||||
import Modal from '../../UI/modal/Modal'
|
||||
import { BurgerMenu, HeaderContainer } from './styles'
|
||||
import AddApplicationForm from '@/components/blocks/AddApplicationForm'
|
||||
import LandingButton from "../../UI/button/LandingButton";
|
||||
import Modal from "../../UI/modal/Modal";
|
||||
import { BurgerMenu, HeaderContainer } from "./styles";
|
||||
import AddApplicationForm from "@/components/blocks/AddApplicationForm";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function Header({}: Props) {
|
||||
const [modal, setModal] = useState(false)
|
||||
const [modal, setModal] = useState(false);
|
||||
|
||||
const [menuState, setMenuState] = useState(false)
|
||||
const [menuState, setMenuState] = useState(false);
|
||||
|
||||
const pathname = usePathname()
|
||||
const pathname = usePathname();
|
||||
|
||||
useEffect(() => {
|
||||
setMenuState(false)
|
||||
}, [pathname])
|
||||
setMenuState(false);
|
||||
}, [pathname]);
|
||||
|
||||
return !pathname.startsWith('/admin') ? (
|
||||
return !pathname.startsWith("/admin") ? (
|
||||
<>
|
||||
<HeaderContainer>
|
||||
<Container>
|
||||
<div className='content'>
|
||||
<div className='logo'>
|
||||
<img src='/logo.svg' alt='phone' />
|
||||
<div className="content">
|
||||
<div className="logo">
|
||||
<img src="/image/logo.svg" alt="phone" />
|
||||
<span>Городская похоронная служба</span>
|
||||
</div>
|
||||
<div className='contact-block'>
|
||||
<div className='addresses'>
|
||||
<span>ул. Курчатова, д. 4</span>
|
||||
<span>ул. Героев Танкограда, д.61а</span>
|
||||
<div className="contact-block">
|
||||
<div className="addresses">
|
||||
<span>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_kurchatova_4/YkgYdQ5mTUYBQFtvfX11dntgYw==/?ll=61.396436%2C55.147737&z=17.08">
|
||||
ул. Курчатова, д. 4
|
||||
</a>
|
||||
</span>
|
||||
<span>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_geroyev_tankograda_61a/YkgYcgJhT0IEQFtvfX12d31lZg==/?ll=61.451673%2C55.176162&z=17.08">
|
||||
ул. Героев Танкограда, д.61а
|
||||
</a>
|
||||
</span>
|
||||
</div>
|
||||
<div className='phones'>
|
||||
<div className='phone'>
|
||||
<Image src='/phone.svg' width={20} height={20} alt='phone' />
|
||||
<p>+7 (951) 773-34-53</p>
|
||||
</div>
|
||||
<div className='phone-all-time'>
|
||||
<div className='top'>
|
||||
<div className="phones">
|
||||
<div className="phone">
|
||||
<Image
|
||||
src='/phone.svg'
|
||||
src="/image/phone.svg"
|
||||
width={20}
|
||||
height={20}
|
||||
alt='phone'
|
||||
alt="phone"
|
||||
/>
|
||||
<a href="tel:+79517733453">
|
||||
<p>+7 (951) 773-34-53</p>
|
||||
</a>
|
||||
</div>
|
||||
<div className="phone-all-time">
|
||||
<div className="top">
|
||||
<Image
|
||||
src="/image/phone.svg"
|
||||
width={20}
|
||||
height={20}
|
||||
alt="phone"
|
||||
/>
|
||||
<a href="tel:+79323079454">
|
||||
<p>+7 (932) 307-94-54</p>
|
||||
</a>
|
||||
</div>
|
||||
<span>Круглосуточно</span>
|
||||
</div>
|
||||
|
@ -61,57 +78,57 @@ export default function Header({}: Props) {
|
|||
Заказать звонок
|
||||
</LandingButton>
|
||||
</div>
|
||||
<div className='navbar'>
|
||||
<Link href='/'>Главная</Link>
|
||||
<Link href='/services'>Услуги</Link>
|
||||
<Link href='/aboutUs'>О нас</Link>
|
||||
<Link href='/ourCemeteries'>Наши кладбища</Link>
|
||||
<div className="navbar">
|
||||
<Link href="/">Главная</Link>
|
||||
<Link href="/services">Услуги</Link>
|
||||
<Link href="/aboutUs">О нас</Link>
|
||||
<Link href="/ourCemeteries">Наши кладбища</Link>
|
||||
{/* <Link href='/everlastingMemory'>Вечная память</Link> */}
|
||||
</div>
|
||||
</Container>
|
||||
<BurgerMenu state={menuState}>
|
||||
<div className='title'>
|
||||
<div className='logo-container'>
|
||||
<img src='/logo.svg' alt='' className='logo-image' />
|
||||
<div className="title">
|
||||
<div className="logo-container">
|
||||
<img src="/image/logo.svg" alt="" className="logo-image" />
|
||||
</div>
|
||||
<div className='menu-icon-container'>
|
||||
<div className="menu-icon-container">
|
||||
<img
|
||||
src='/burger-menu.svg'
|
||||
alt=''
|
||||
src="/image/burger-menu.svg"
|
||||
alt=""
|
||||
onClick={() => setMenuState(true)}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className='menu-container'>
|
||||
<div className='title-active'>
|
||||
<div className='contact'>
|
||||
<div className='addresses'>
|
||||
<div className="menu-container">
|
||||
<div className="title-active">
|
||||
<div className="contact">
|
||||
<div className="addresses">
|
||||
<p>ул. Курчатова, д. 4</p>
|
||||
<p>ул. Героев Танкограда, д.61а</p>
|
||||
</div>
|
||||
<div className='number'>
|
||||
<div className="number">
|
||||
<p>+7 (951) 773-34-53</p>
|
||||
<p>+7 (932) 307-94-54</p>
|
||||
</div>
|
||||
</div>
|
||||
<img
|
||||
src='/close-menu.svg'
|
||||
alt=''
|
||||
src="/image/close-menu.svg"
|
||||
alt=""
|
||||
onClick={() => setMenuState(false)}
|
||||
/>
|
||||
</div>
|
||||
<div className='menu'>
|
||||
<div className="menu">
|
||||
<LandingButton
|
||||
onClick={() => {
|
||||
setModal(true), setMenuState(false)
|
||||
setModal(true), setMenuState(false);
|
||||
}}
|
||||
>
|
||||
Заказать звонок
|
||||
</LandingButton>
|
||||
<Link href='/'>Главная</Link>
|
||||
<Link href='/services'>Услуги</Link>
|
||||
<Link href='/aboutUs'>О нас</Link>
|
||||
<Link href='/ourCemeteries'>Наши кладбища</Link>
|
||||
<Link href="/">Главная</Link>
|
||||
<Link href="/services">Услуги</Link>
|
||||
<Link href="/aboutUs">О нас</Link>
|
||||
<Link href="/ourCemeteries">Наши кладбища</Link>
|
||||
{/* <Link href='/everlastingMemory'>Вечная память</Link> */}
|
||||
</div>
|
||||
</div>
|
||||
|
@ -122,5 +139,5 @@ export default function Header({}: Props) {
|
|||
<AddApplicationForm setModal={setModal} />
|
||||
</Modal>
|
||||
</>
|
||||
) : null
|
||||
) : null;
|
||||
}
|
||||
|
|
|
@ -15,6 +15,10 @@ export const HeaderContainer = styled.div`
|
|||
display: flex;
|
||||
align-items: start;
|
||||
gap: 30px;
|
||||
|
||||
a {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
|
@ -201,7 +205,7 @@ export const HeaderContainer = styled.div`
|
|||
display: none;
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
interface I_Menu {
|
||||
state: boolean
|
||||
|
|
|
@ -1,35 +1,35 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import { Container } from '@/app/GlobalStyles'
|
||||
import AddApplicationForm from '@/components/blocks/AddApplicationForm'
|
||||
import Link from 'next/link'
|
||||
import { usePathname } from 'next/navigation'
|
||||
import { useState } from 'react'
|
||||
import LandingButton from '../../UI/button/LandingButton'
|
||||
import Modal from '../../UI/modal/Modal'
|
||||
import { Container } from "@/app/GlobalStyles";
|
||||
import AddApplicationForm from "@/components/blocks/AddApplicationForm";
|
||||
import Link from "next/link";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { useState } from "react";
|
||||
import LandingButton from "../../UI/button/LandingButton";
|
||||
import Modal from "../../UI/modal/Modal";
|
||||
import {
|
||||
ContentContainer,
|
||||
ContentSection,
|
||||
FooterContainer,
|
||||
FooterContent,
|
||||
LogoSection
|
||||
} from './styels'
|
||||
LogoSection,
|
||||
} from "./styels";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function Footer({}: Props) {
|
||||
const [modal, setModal] = useState(false)
|
||||
const [modal, setModal] = useState(false);
|
||||
|
||||
const pathname = usePathname()
|
||||
const pathname = usePathname();
|
||||
|
||||
return !pathname.startsWith('/admin') ? (
|
||||
return !pathname.startsWith("/admin") ? (
|
||||
<>
|
||||
<FooterContainer>
|
||||
<Container>
|
||||
<FooterContent>
|
||||
<ContentContainer>
|
||||
<LogoSection>
|
||||
<img src='/logo.svg' alt='phone' />
|
||||
<img src="/image/logo.svg" alt="phone" />
|
||||
<span>Городская похоронная служба</span>
|
||||
<LandingButton onClick={() => setModal(true)}>
|
||||
Заказать звонок
|
||||
|
@ -37,23 +37,31 @@ export default function Footer({}: Props) {
|
|||
</LogoSection>
|
||||
<ContentSection>
|
||||
<h3>Наши контакты</h3>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_kurchatova_4/YkgYdQ5mTUYBQFtvfX11dntgYw==/?ll=61.396436%2C55.147737&z=17.08">
|
||||
<p>ул. Курчатова, д. 4</p>
|
||||
</a>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_geroyev_tankograda_61a/YkgYcgJhT0IEQFtvfX12d31lZg==/?ll=61.451673%2C55.176162&z=17.08">
|
||||
<p>ул. Героев Танкограда, д.61а</p>
|
||||
</a>
|
||||
<a href="tel:+79517733453">
|
||||
<p>+7 (951) 773-34-53</p>
|
||||
</a>
|
||||
<a href="tel:+79323079454">
|
||||
<p>+7 (932) 307-94-54</p>
|
||||
</a>
|
||||
</ContentSection>
|
||||
<ContentSection>
|
||||
<h3>Навигация</h3>
|
||||
<Link href='/'>
|
||||
<Link href="/">
|
||||
<p>На главную</p>
|
||||
</Link>
|
||||
<Link href='/aboutUs'>
|
||||
<Link href="/aboutUs">
|
||||
<p>О нас</p>
|
||||
</Link>
|
||||
<Link href='/services'>
|
||||
<Link href="/services">
|
||||
<p>Услуги</p>
|
||||
</Link>
|
||||
<Link href='/ourCemeteries'>
|
||||
<Link href="/ourCemeteries">
|
||||
<p>Наши кладбища</p>
|
||||
</Link>
|
||||
</ContentSection>
|
||||
|
@ -65,5 +73,5 @@ export default function Footer({}: Props) {
|
|||
<AddApplicationForm setModal={setModal} />
|
||||
</Modal>
|
||||
</>
|
||||
) : null
|
||||
) : null;
|
||||
}
|
||||
|
|
|
@ -105,7 +105,7 @@ export default function AboutUs({}: Props) {
|
|||
потребностям и возможностям клиента.
|
||||
</p>
|
||||
</div>
|
||||
<img src='/image 6.png' alt='' className='item' />
|
||||
<img src='/image/about_us_image.png' alt='' className='item' />
|
||||
</div>
|
||||
<div className='bottom'>
|
||||
<h3>Принципы прозрачности и заботы о клиентах</h3>
|
||||
|
|
|
@ -13,7 +13,7 @@ type Props = {}
|
|||
const Container = styled.div`
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
background-image: url('/image 12.jpg');
|
||||
background-image: url("/image/admin_login_bg.jpg");
|
||||
background-position: center;
|
||||
background-size: cover;
|
||||
|
||||
|
@ -37,7 +37,7 @@ const Container = styled.div`
|
|||
color: ${(props) => props.theme.colors.white};
|
||||
border-radius: 12px;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const NotificationContainer = styled.div`
|
||||
position: absolute;
|
||||
|
|
|
@ -115,19 +115,19 @@ export default function Services({}: Props) {
|
|||
<>
|
||||
<AdminContainer>
|
||||
<Container>
|
||||
{!(services.length === 0 && searchQuery === '') ? (
|
||||
{!(services.length === 0 && searchQuery === "") ? (
|
||||
<>
|
||||
<h1>Услуги</h1>
|
||||
<div className='search-block'>
|
||||
<div className='input-block'>
|
||||
<div className="search-block">
|
||||
<div className="input-block">
|
||||
<FormInput
|
||||
value={searchQuery}
|
||||
onChange={(e: ChangeEvent<HTMLInputElement>) =>
|
||||
setSearchQuery(e.target.value)
|
||||
}
|
||||
placeholder='Введите название услуги'
|
||||
placeholder="Введите название услуги"
|
||||
/>
|
||||
<img src='/search.svg' alt='' />
|
||||
<img src="/image/search.svg" alt="" />
|
||||
</div>
|
||||
<MainButton
|
||||
fullWidth={true}
|
||||
|
@ -141,7 +141,7 @@ export default function Services({}: Props) {
|
|||
<Loader />
|
||||
</NotificationContainer>
|
||||
) : services.length !== 0 ? (
|
||||
<div className='list'>
|
||||
<div className="list">
|
||||
{services.map((item: T_Product, index) => (
|
||||
<ServiceItem
|
||||
item={item}
|
||||
|
@ -183,5 +183,5 @@ export default function Services({}: Props) {
|
|||
<MainButton>Закрыть</MainButton>
|
||||
</Modal>
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,10 +1,9 @@
|
|||
import MainButton from '@/components/UI/button/MainButton'
|
||||
import ProductService from '@/services/product/productServeces'
|
||||
import { useState } from 'react'
|
||||
import styled from 'styled-components'
|
||||
import { T_Product } from '../../../../../services/product/type'
|
||||
import UpdateServiceForm from './UpdateServiceForm'
|
||||
import { hostName } from '../../../../../../config'
|
||||
import MainButton from "@/components/UI/button/MainButton";
|
||||
import ProductService from "@/services/product/productServeces";
|
||||
import { useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import { T_Product } from "../../../../../services/product/type";
|
||||
import UpdateServiceForm from "./UpdateServiceForm";
|
||||
|
||||
const Cart = styled.div`
|
||||
display: flex;
|
||||
|
@ -46,35 +45,35 @@ const Cart = styled.div`
|
|||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {
|
||||
item: T_Product
|
||||
getServices: () => void
|
||||
}
|
||||
item: T_Product;
|
||||
getServices: () => void;
|
||||
};
|
||||
|
||||
export default function ServiceItem({ item, getServices }: Props) {
|
||||
const [modal, setModal] = useState(false)
|
||||
const [modal, setModal] = useState(false);
|
||||
|
||||
const deleteService = async () => {
|
||||
await ProductService.delete(item.Id)
|
||||
getServices()
|
||||
}
|
||||
await ProductService.delete(item.Id);
|
||||
getServices();
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Cart>
|
||||
<div className='block'>
|
||||
<img src={'/'+item.ImageUrls[0]} alt='' />
|
||||
<div className="block">
|
||||
<img src={"/" + item.ImageUrls[0]} alt="" />
|
||||
<h3>{item.Name}</h3>
|
||||
<p>{item.FullDesc}</p>
|
||||
</div>
|
||||
<div className='block'>
|
||||
<div className="block">
|
||||
<h2>От {item.OldPrice} руб.</h2>
|
||||
<MainButton onClick={() => setModal(true)}>Редактировать</MainButton>
|
||||
</div>
|
||||
<div className='delete-button' onClick={deleteService}>
|
||||
<img src='/trash.svg' alt='' />
|
||||
<div className="delete-button" onClick={deleteService}>
|
||||
<img src="/image/trash.svg" alt="" />
|
||||
</div>
|
||||
</Cart>
|
||||
<UpdateServiceForm
|
||||
|
@ -84,5 +83,5 @@ export default function ServiceItem({ item, getServices }: Props) {
|
|||
item={item}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -36,23 +36,23 @@ export default function AboutUs({}: Props) {
|
|||
return (
|
||||
<Container>
|
||||
<IconContainer>
|
||||
<div className='item'>
|
||||
<img src='/cemetery.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/cemetery.svg" alt="" />
|
||||
<p>Разнообразные похоронные услуги для всех</p>
|
||||
</div>
|
||||
<div className='item'>
|
||||
<img src='/agreement.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/agreement.svg" alt="" />
|
||||
<p>Четкие цены на все услуги</p>
|
||||
</div>
|
||||
<div className='item'>
|
||||
<img src='/operator.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/operator.svg" alt="" />
|
||||
<p>Круглосуточная поддержка специалистов</p>
|
||||
</div>
|
||||
<div className='item'>
|
||||
<img src='/deal.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/deal.svg" alt="" />
|
||||
<p>Договор без скрытых платежей</p>
|
||||
</div>
|
||||
</IconContainer>
|
||||
</Container>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,6 +1,8 @@
|
|||
import { Container } from '@/app/GlobalStyles'
|
||||
import React from 'react'
|
||||
import styled from 'styled-components'
|
||||
import { Container } from "@/app/GlobalStyles";
|
||||
import Modal from "@/components/UI/modal/Modal";
|
||||
import AddApplicationForm from "@/components/blocks/AddApplicationForm";
|
||||
import React, { useState } from "react";
|
||||
import styled from "styled-components";
|
||||
|
||||
const OrderContainer = styled.div`
|
||||
display: flex;
|
||||
|
@ -20,28 +22,36 @@ const OrderContainer = styled.div`
|
|||
padding: 30px 70px;
|
||||
border-radius: 12px;
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
h3 {
|
||||
text-align: center;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function CreateOrder({}: Props) {
|
||||
const [modal, setModal] = useState(false);
|
||||
|
||||
return (
|
||||
<>
|
||||
<Container>
|
||||
<OrderContainer>
|
||||
<h1>Закажи обратный звонок</h1>
|
||||
<h3>Круглосуточно принимаем заказы любой сложности</h3>
|
||||
<div className='button'>
|
||||
<button>
|
||||
<div className="button">
|
||||
<button onClick={() => setModal(true)}>
|
||||
<h2>Оставить заявку</h2>
|
||||
</button>
|
||||
</div>
|
||||
</OrderContainer>
|
||||
</Container>
|
||||
)
|
||||
<Modal modal={modal} setModal={setModal}>
|
||||
<AddApplicationForm setModal={setModal} />
|
||||
</Modal>
|
||||
</>
|
||||
);
|
||||
}
|
|
@ -48,21 +48,21 @@ export default function Instructions({}: Props) {
|
|||
<Container>
|
||||
<InstructionsContainer>
|
||||
<h2>Порядок действий в случае смерти человека</h2>
|
||||
<div className='list'>
|
||||
<div className='item'>
|
||||
<img src='/telephone.svg' alt='' />
|
||||
<div className="list">
|
||||
<div className="item">
|
||||
<img src="/image/telephone.svg" alt="" />
|
||||
<h3>Шаг 1: Обратитесь в нашу службу</h3>
|
||||
<p>
|
||||
Позвоните по номеру <span>+7 (932) 307-94-54</span>.
|
||||
</p>
|
||||
</div>
|
||||
<div className='item'>
|
||||
<img src='/ambulance.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/ambulance.svg" alt="" />
|
||||
<h3>Шаг 2: Дождитесь полицию и скорую помощь</h3>
|
||||
<p>Дождитесь получения необходимого направления от полиции.</p>
|
||||
</div>
|
||||
<div className='item'>
|
||||
<img src='/hospital.svg' alt='' />
|
||||
<div className="item">
|
||||
<img src="/image/hospital.svg" alt="" />
|
||||
<h3>Шаг 3: Дождитесь эвакуацию</h3>
|
||||
<p>
|
||||
Дождитесь прибытия службы эвакуации для транспортировки тела в
|
||||
|
@ -72,5 +72,5 @@ export default function Instructions({}: Props) {
|
|||
</div>
|
||||
</InstructionsContainer>
|
||||
</Container>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react'
|
||||
import { Map, Placemark, YMaps } from '@pbe/react-yandex-maps'
|
||||
import styled from 'styled-components'
|
||||
import React from "react";
|
||||
import { Map, Placemark, YMaps } from "@pbe/react-yandex-maps";
|
||||
import styled from "styled-components";
|
||||
|
||||
const MapContainer = styled.div`
|
||||
margin: 50px 0;
|
||||
|
@ -54,44 +54,52 @@ const MapContainer = styled.div`
|
|||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
||||
p{
|
||||
p {
|
||||
max-width: 200px;
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function MapSection({}: Props) {
|
||||
return (
|
||||
<MapContainer>
|
||||
<YMaps>
|
||||
<Map
|
||||
className='map'
|
||||
className="map"
|
||||
defaultState={{
|
||||
center: [55.159902, 61.402554],
|
||||
zoom: 12
|
||||
zoom: 12,
|
||||
}}
|
||||
options={{
|
||||
yandexMapDisablePoiInteractivity: true,
|
||||
copyrightLogoVisible: true,
|
||||
copyrightProvidersVisible: true,
|
||||
copyrightUaVisible: true
|
||||
copyrightUaVisible: true,
|
||||
}}
|
||||
>
|
||||
<Placemark geometry={[55.147737, 61.396436]} />
|
||||
<Placemark geometry={[55.176162, 61.451673]} />
|
||||
</Map>
|
||||
</YMaps>
|
||||
<div className='content'>
|
||||
<div className="content">
|
||||
<h3>Наши контакты</h3>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_kurchatova_4/YkgYdQ5mTUYBQFtvfX11dntgYw==/?ll=61.396436%2C55.147737&z=17.08">
|
||||
<p>ул. Курчатова, д. 4</p>
|
||||
</a>
|
||||
<a href="https://yandex.ru/maps/56/chelyabinsk/house/ulitsa_geroyev_tankograda_61a/YkgYcgJhT0IEQFtvfX12d31lZg==/?ll=61.451673%2C55.176162&z=17.08">
|
||||
<p>ул. Героев Танкограда, д.61а</p>
|
||||
</a>
|
||||
<a href="tel:+79517733453">
|
||||
<p>+7 (951) 773-34-53</p>
|
||||
</a>
|
||||
<a href="tel:+79323079454">
|
||||
<p>+7 (932) 307-94-54 (Круглосуточно)</p>
|
||||
</a>
|
||||
</div>
|
||||
</MapContainer>
|
||||
)
|
||||
);
|
||||
}
|
|
@ -1,6 +1,6 @@
|
|||
import { useState } from 'react'
|
||||
import Slider from 'react-slick'
|
||||
import styled from 'styled-components'
|
||||
import { useState } from "react";
|
||||
import Slider from "react-slick";
|
||||
import styled from "styled-components";
|
||||
|
||||
export const ReviewsContainer = styled.div`
|
||||
gap: 50px;
|
||||
|
@ -55,7 +55,7 @@ export const ReviewsContainer = styled.div`
|
|||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
export const MobileReviewsContainer = styled.div`
|
||||
display: none;
|
||||
|
@ -165,9 +165,9 @@ export const MobileReviewsContainer = styled.div`
|
|||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function Review({}: Props) {
|
||||
const settings = {
|
||||
|
@ -179,7 +179,7 @@ export default function Review({}: Props) {
|
|||
speed: 500,
|
||||
arrows: false,
|
||||
centerMode: true,
|
||||
centerPadding: '60px',
|
||||
centerPadding: "60px",
|
||||
responsive: [
|
||||
{
|
||||
breakpoint: 1024,
|
||||
|
@ -188,8 +188,8 @@ export default function Review({}: Props) {
|
|||
slidesToScroll: 1,
|
||||
infinite: true,
|
||||
dots: true,
|
||||
centerMode: true
|
||||
}
|
||||
centerMode: true,
|
||||
},
|
||||
},
|
||||
{
|
||||
breakpoint: 1550,
|
||||
|
@ -198,50 +198,50 @@ export default function Review({}: Props) {
|
|||
slidesToScroll: 1,
|
||||
infinite: true,
|
||||
dots: true,
|
||||
centerMode: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
centerMode: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const [users, setUsers] = useState([
|
||||
{
|
||||
name: 'Анна Иванова',
|
||||
image: '/review/person_1.jpg',
|
||||
name: "Анна Иванова",
|
||||
image: "/review/person_2.jpg",
|
||||
review:
|
||||
'Профессиональное и сочувственное обслуживание. Помогли организовать похороны без лишних хлопот. Благодарна за их поддержку в трудный момент.'
|
||||
"Профессиональное и сочувственное обслуживание. Помогли организовать похороны без лишних хлопот. Благодарна за их поддержку в трудный момент.",
|
||||
},
|
||||
{
|
||||
name: 'Сергей Петров',
|
||||
image: '/review/person_2.jpg',
|
||||
name: "Сергей Петров",
|
||||
image: "/review/person_1.jpg",
|
||||
review:
|
||||
'Отличное соотношение цены и качества услуг. Все выполнено аккуратно и в срок. Рекомендую это агентство в сложные времена.'
|
||||
"Отличное соотношение цены и качества услуг. Все выполнено аккуратно и в срок. Рекомендую это агентство в сложные времена.",
|
||||
},
|
||||
{
|
||||
name: 'Елена Козлова',
|
||||
image: '/review/person_3.jpg',
|
||||
name: "Елена Козлова",
|
||||
image: "/review/person_3.jpg",
|
||||
review:
|
||||
'Искренне признательна за заботу и профессионализм. Организация похорон прошла гладко, учли все наши пожелания. Спасибо за поддержку.'
|
||||
"Искренне признательна за заботу и профессионализм. Организация похорон прошла гладко, учли все наши пожелания. Спасибо за поддержку.",
|
||||
},
|
||||
{
|
||||
name: 'Александр Смирнов',
|
||||
image: '/review/person_4.jpg',
|
||||
name: "Александр Смирнов",
|
||||
image: "/review/person_4.jpg",
|
||||
review:
|
||||
'Эмпатичные сотрудники, готовые помочь в любое время суток. Сделали все возможное, чтобы облегчить бремя нашей утраты. Благодарим за помощь.'
|
||||
}
|
||||
])
|
||||
"Эмпатичные сотрудники, готовые помочь в любое время суток. Сделали все возможное, чтобы облегчить бремя нашей утраты. Благодарим за помощь.",
|
||||
},
|
||||
]);
|
||||
|
||||
return (
|
||||
<>
|
||||
<ReviewsContainer>
|
||||
<h2>Отзывы о проведенных церемониях</h2>
|
||||
<div className='slider-container'>
|
||||
<div className="slider-container">
|
||||
<Slider {...settings}>
|
||||
{users.map((user, index) => (
|
||||
<div key={index}>
|
||||
<div className='item'>
|
||||
<img src={user.image} alt='' />
|
||||
<div className='content'>
|
||||
<div className="item">
|
||||
<img src={user.image} alt="" />
|
||||
<div className="content">
|
||||
<h3>{user.name}</h3>
|
||||
<p>{user.review}</p>
|
||||
</div>
|
||||
|
@ -253,37 +253,22 @@ export default function Review({}: Props) {
|
|||
</ReviewsContainer>
|
||||
<MobileReviewsContainer>
|
||||
<h2>Отзывы о проведенных церемониях</h2>
|
||||
<div className='slider-container'>
|
||||
<div className="slider-container">
|
||||
<Slider {...settings}>
|
||||
{[...Array(4)].map((_, index) => (
|
||||
<div>
|
||||
<div className='item'>
|
||||
<img src='/image 4.png' alt='' />
|
||||
<div className='content'>
|
||||
<h3>Виктор Иванов</h3>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit,
|
||||
sed do eiusmod tempor incididunt ut labore et dolore magna
|
||||
aliqua.
|
||||
</p>
|
||||
{users.map((user, index) => (
|
||||
<div key={index}>
|
||||
<div className="item">
|
||||
<img src={user.image} alt="" />
|
||||
<div className="content">
|
||||
<h3>{user.name}</h3>
|
||||
<p>{user.review}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className='mobile-item'>
|
||||
<div className='content'>
|
||||
<img src='/image 4.png' alt='' />
|
||||
<h3>Виктор Иванов</h3>
|
||||
</div>
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
|
||||
do eiusmod tempor incididunt ut labore et dolore magna
|
||||
aliqua.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</Slider>
|
||||
</div>
|
||||
</MobileReviewsContainer>
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,12 +1,15 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import { Container } from '@/app/GlobalStyles'
|
||||
import LandingButton from '@/components/UI/button/LandingButton'
|
||||
import { useState } from 'react'
|
||||
import Slider from 'react-slick'
|
||||
import 'slick-carousel/slick/slick-theme.css'
|
||||
import 'slick-carousel/slick/slick.css'
|
||||
import styled from 'styled-components'
|
||||
import { Container } from "@/app/GlobalStyles";
|
||||
import LandingButton from "@/components/UI/button/LandingButton";
|
||||
import Modal from "@/components/UI/modal/Modal";
|
||||
import AddApplicationForm from "@/components/blocks/AddApplicationForm";
|
||||
import Link from "next/link";
|
||||
import { useState } from "react";
|
||||
import Slider from "react-slick";
|
||||
import "slick-carousel/slick/slick-theme.css";
|
||||
import "slick-carousel/slick/slick.css";
|
||||
import styled from "styled-components";
|
||||
|
||||
const Item = styled.div`
|
||||
position: relative;
|
||||
|
@ -94,7 +97,7 @@ const Item = styled.div`
|
|||
}
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const RightArrow = styled.img`
|
||||
position: absolute;
|
||||
|
@ -111,7 +114,7 @@ const RightArrow = styled.img`
|
|||
&:hover {
|
||||
background: ${(props) => props.theme.colors.black};
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const LeftArrow = styled.img`
|
||||
position: absolute;
|
||||
|
@ -132,7 +135,7 @@ const LeftArrow = styled.img`
|
|||
${(props) => props.theme.mediaQueries.mobile} {
|
||||
display: none;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const SliderContainer = styled.div`
|
||||
margin-top: 50px;
|
||||
|
@ -147,7 +150,7 @@ const SliderContainer = styled.div`
|
|||
${(props) => props.theme.mediaQueries.mobile} {
|
||||
display: none;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const MobileSliderContainer = styled.div`
|
||||
display: none;
|
||||
|
@ -163,17 +166,17 @@ const MobileSliderContainer = styled.div`
|
|||
display: none !important;
|
||||
}
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
export default function SliderSection({}: Props) {
|
||||
const settings = {
|
||||
infinite: true,
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
nextArrow: <RightArrow src='/left arrow.svg' alt='' />,
|
||||
prevArrow: <LeftArrow src='/left arrow.svg' alt='' />,
|
||||
nextArrow: <RightArrow src="/image/left arrow.svg" alt="" />,
|
||||
prevArrow: <LeftArrow src="/image/left arrow.svg" alt="" />,
|
||||
autoplay: true,
|
||||
speed: 2000,
|
||||
autoplaySpeed: 4000,
|
||||
|
@ -181,46 +184,48 @@ export default function SliderSection({}: Props) {
|
|||
{
|
||||
breakpoint: 640,
|
||||
settings: {
|
||||
dots: true
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
dots: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const [slides, setSlides] = useState([
|
||||
{
|
||||
title: 'Мы принимаем заявки прямо сейчас',
|
||||
title: "Мы принимаем заявки прямо сейчас",
|
||||
content:
|
||||
'Просто оставьте заявку, и мы свяжемся с вами для уточнения деталей и предоставления всей необходимой информации.',
|
||||
image: '/home_slider/slide_4.jpg',
|
||||
link: '',
|
||||
button: 'Оставить заявку'
|
||||
"Просто оставьте заявку, и мы свяжемся с вами для уточнения деталей и предоставления всей необходимой информации.",
|
||||
image: "/home_slider/slide_4.jpg",
|
||||
link: "",
|
||||
button: "Заказать звонок",
|
||||
},
|
||||
{
|
||||
title: 'Мы предлагаем разнообразные услуги',
|
||||
title: "Мы предлагаем разнообразные услуги",
|
||||
content:
|
||||
'Широкий спектр услуг для достойного прощания и помощи в трудный момент. У нас вы найдете все необходимое для организации похоронных церемоний.',
|
||||
image: '/home_slider/slide_1.jpg',
|
||||
link: '',
|
||||
button: 'Узнать больше'
|
||||
"Широкий спектр услуг для достойного прощания и помощи в трудный момент. У нас вы найдете все необходимое для организации похоронных церемоний.",
|
||||
image: "/home_slider/slide_1.jpg",
|
||||
link: "/services",
|
||||
button: "Узнать больше",
|
||||
},
|
||||
{
|
||||
title: 'Мы работаем со всеми кладбищами в области',
|
||||
title: "Мы работаем со всеми кладбищами в области",
|
||||
content:
|
||||
'Наши услуги доступны на всех кладбищах в этой области для вашего удобства. Мы готовы помочь вам в любом месте и в любое время.',
|
||||
image: '/home_slider/slide_2.png',
|
||||
link: '',
|
||||
button: 'Смотреть кладбища'
|
||||
"Наши услуги доступны на всех кладбищах в этой области для вашего удобства. Мы готовы помочь вам в любом месте и в любое время.",
|
||||
image: "/home_slider/slide_2.png",
|
||||
link: "/ourCemeteries",
|
||||
button: "Смотреть кладбища",
|
||||
},
|
||||
{
|
||||
title: 'Мы работаем давно и многое можем предложить',
|
||||
title: "Мы работаем давно и многое можем предложить",
|
||||
content:
|
||||
'Наша команда специалистов - залог профессионализма и заботы. Мы основываемся на принципах честности, сочувствия и уважения.',
|
||||
image: '/home_slider/slide_3.jpg',
|
||||
link: '',
|
||||
button: 'Подробнее о нас'
|
||||
}
|
||||
])
|
||||
"Наша команда специалистов - залог профессионализма и заботы. Мы основываемся на принципах честности, сочувствия и уважения.",
|
||||
image: "/home_slider/slide_3.jpg",
|
||||
link: "/aboutUs",
|
||||
button: "Подробнее о нас",
|
||||
},
|
||||
]);
|
||||
|
||||
const [modal, setModal] = useState(false)
|
||||
|
||||
return (
|
||||
<>
|
||||
|
@ -229,12 +234,20 @@ export default function SliderSection({}: Props) {
|
|||
<Slider {...settings}>
|
||||
{slides.map((item, index) => (
|
||||
<Item key={index}>
|
||||
<img src={item.image} alt='' />
|
||||
<div className='content'>
|
||||
<img src={item.image} alt="" />
|
||||
<div className="content">
|
||||
<h2>{item.title}</h2>
|
||||
<h3>{item.title}</h3>
|
||||
<h4>{item.content}</h4>
|
||||
{item.link !== "" ? (
|
||||
<Link href={item.link}>
|
||||
<LandingButton>{item.button}</LandingButton>
|
||||
</Link>
|
||||
) : (
|
||||
<LandingButton onClick={() => setModal(true)}>
|
||||
{item.button}
|
||||
</LandingButton>
|
||||
)}
|
||||
</div>
|
||||
</Item>
|
||||
))}
|
||||
|
@ -243,22 +256,30 @@ export default function SliderSection({}: Props) {
|
|||
</Container>
|
||||
<MobileSliderContainer>
|
||||
<Slider {...settings}>
|
||||
{[...Array(2)].map((_, index) => (
|
||||
<Item>
|
||||
<img src='/image 1.png' alt='' />
|
||||
<div className='content'>
|
||||
<h2>Предоставление похоронных услуг в Челябинске.</h2>
|
||||
<h3>Предоставление похоронных услуг в Челябинске.</h3>
|
||||
<h4>
|
||||
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed
|
||||
do eiusmod tempor incididunt ut labore et dolore magna aliqua.
|
||||
</h4>
|
||||
<LandingButton>Подробнее о нас</LandingButton>
|
||||
{slides.map((item, index) => (
|
||||
<Item key={index}>
|
||||
<img src={item.image} alt="" />
|
||||
<div className="content">
|
||||
<h2>{item.title}</h2>
|
||||
<h3>{item.title}</h3>
|
||||
<h4>{item.content}</h4>
|
||||
{item.link !== "" ? (
|
||||
<Link href={item.link}>
|
||||
<LandingButton>{item.button}</LandingButton>
|
||||
</Link>
|
||||
) : (
|
||||
<LandingButton onClick={() => setModal(true)}>
|
||||
{item.button}
|
||||
</LandingButton>
|
||||
)}
|
||||
</div>
|
||||
</Item>
|
||||
))}
|
||||
</Slider>
|
||||
</MobileSliderContainer>
|
||||
<Modal modal={modal} setModal={setModal}>
|
||||
<AddApplicationForm setModal={setModal} />
|
||||
</Modal>
|
||||
</>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -72,35 +72,15 @@ export default function OurCemetery({}: Props) {
|
|||
return (
|
||||
<MapContainer>
|
||||
<h1>Наши кладбища</h1>
|
||||
{/* <YMaps>
|
||||
<Map
|
||||
className='map'
|
||||
defaultState={{
|
||||
center: [55.159897, 61.402554],
|
||||
zoom: 6
|
||||
}}
|
||||
>
|
||||
<Circle
|
||||
geometry={[[55.159897, 61.402554], 10000]}
|
||||
options={{
|
||||
draggable: true,
|
||||
fillColor: '#DB709377',
|
||||
strokeColor: '#990066',
|
||||
strokeOpacity: 0.8,
|
||||
strokeWidth: 5
|
||||
}}
|
||||
/>
|
||||
</Map>
|
||||
</YMaps> */}
|
||||
<iframe
|
||||
src='https://yandex.ru/map-widget/v1/?um=constructor%3Aa53366eeae5cb98c21ef9f499da6647e293da5152591b651ff9474f6215833a0&source=constructor'
|
||||
width='100%'
|
||||
height='450'
|
||||
src="https://yandex.ru/map-widget/v1/?um=constructor%3Aa53366eeae5cb98c21ef9f499da6647e293da5152591b651ff9474f6215833a0&source=constructor"
|
||||
width="100%"
|
||||
height="450"
|
||||
></iframe>
|
||||
<div className='content'>
|
||||
<div className="content">
|
||||
<h3>Наши Кладбища</h3>
|
||||
<p>Мы работаем по всей облачти</p>
|
||||
<p>Мы работаем по всей области</p>
|
||||
</div>
|
||||
</MapContainer>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|
|
@ -1,14 +1,14 @@
|
|||
'use client'
|
||||
"use client";
|
||||
|
||||
import { Container } from '@/app/GlobalStyles'
|
||||
import MainButton from '@/components/UI/button/MainButton'
|
||||
import ProductService from '@/services/product/productServeces'
|
||||
import { useEffect, useState } from 'react'
|
||||
import styled from 'styled-components'
|
||||
import ServiceItem from './ServiceItem'
|
||||
import Loader from '@/components/UI/loader/Loader'
|
||||
import { Container } from "@/app/GlobalStyles";
|
||||
import MainButton from "@/components/UI/button/MainButton";
|
||||
import ProductService from "@/services/product/productServeces";
|
||||
import { useEffect, useState } from "react";
|
||||
import styled from "styled-components";
|
||||
import ServiceItem from "./ServiceItem";
|
||||
import Loader from "@/components/UI/loader/Loader";
|
||||
|
||||
type Props = {}
|
||||
type Props = {};
|
||||
|
||||
const ServicesContainer = styled.div`
|
||||
display: flex;
|
||||
|
@ -16,7 +16,7 @@ const ServicesContainer = styled.div`
|
|||
flex-direction: column;
|
||||
margin: 50px 0;
|
||||
gap: 50px;
|
||||
`
|
||||
`;
|
||||
|
||||
const List = styled.div`
|
||||
display: grid;
|
||||
|
@ -35,7 +35,7 @@ const List = styled.div`
|
|||
${(props) => props.theme.mediaQueries.mobile} {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
const MessageContainer = styled.div`
|
||||
position: absolute;
|
||||
|
@ -50,26 +50,30 @@ const MessageContainer = styled.div`
|
|||
padding: 20px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
`
|
||||
`;
|
||||
|
||||
export default function Services({}: Props) {
|
||||
const [services, setServices] = useState([])
|
||||
const [loadingState, setLoadingState] = useState(true)
|
||||
const [errorState, setErrorState] = useState(false)
|
||||
const [services, setServices] = useState([]);
|
||||
const [loadingState, setLoadingState] = useState(true);
|
||||
const [errorState, setErrorState] = useState(false);
|
||||
|
||||
const getServices = async () => {
|
||||
try {
|
||||
const response = await ProductService.get('')
|
||||
setServices(response.data.Data)
|
||||
const response = await ProductService.get("");
|
||||
if (response.status === 200) {
|
||||
setServices(response.data.Data);
|
||||
} else {
|
||||
setErrorState(false);
|
||||
}
|
||||
} catch (error) {
|
||||
setErrorState(true)
|
||||
}
|
||||
setLoadingState(false)
|
||||
setErrorState(true);
|
||||
}
|
||||
setLoadingState(false);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
getServices()
|
||||
}, [])
|
||||
getServices();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Container>
|
||||
|
@ -98,5 +102,5 @@ export default function Services({}: Props) {
|
|||
)}
|
||||
</ServicesContainer>
|
||||
</Container>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
|