finaly version

src/app/admin/auth/page.tsx

@@ -1,67 +1,10 @@
-'use client'
+import Auth from '@/components/screens/admin/auth/Auth'
-
+import React from 'react'
-import MainButton from '@/components/UI/button/MainButton'
-import FormInput from '@/components/UI/input/FormInput'
-import { ChangeEvent, useState } from 'react'
-import styled from 'styled-components'
 
 type Props = {}
 
-const Container = styled.div`
-	width: 100%;
-	height: 100vh;
-	background-image: url('/image 12.png');
-	background-position: center;
-	background-size: cover;
-
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	position: absolute;
-	top: 0;
-	left: 0;
-
-	.form {
-		width: 440px;
-		padding: 20px;
-		text-align: center;
-		display: flex;
-		justify-content: center;
-    flex-direction: column;
-    gap: 20px;
-		backdrop-filter: blur(4px);
-		background: rgba(129, 129, 129, 0.4);
-		color: ${(props) => props.theme.colors.white};
-		border-radius: 12px;
-	}
-`
-
 export default function page({}: Props) {
-	const [admin, setAdmin] = useState({
-		login: '',
-		password: ''
-	})
-
 	return (
-		<Container>
+		<Auth />
-			<div className='form'>
-				<h2>Админ панель</h2>
-				<FormInput
-					value={admin.login}
-					onChange={(e: ChangeEvent<HTMLInputElement>) =>
-						setAdmin({ ...admin, login: e.target.value })
-					}
-					placeholder='Логин'
-				/>
-				<FormInput
-					value={admin.password}
-					onChange={(e: ChangeEvent<HTMLInputElement>) =>
-						setAdmin({ ...admin, password: e.target.value })
-					}
-					placeholder='Пароль'
-				/>
-        <MainButton>Войти</MainButton>
-			</div>
-		</Container>
 	)
-}
+}

src/app/admin/page.tsx

@@ -9,7 +9,14 @@ export default function page({}: Props) {
 	const router = useRouter()
 
 	useEffect(() => {
-		router.push('/admin/applications')
+		const hasCookie = document.cookie.includes('_identid')
+		if (!hasCookie) {
+			router.push('/admin/auth')
+			return
+		}
+		else {
+			router.push('/admin/applications')
+		}
 	}, [])
 
 	return <></>

src/components/layout/AdminSideBar.tsx

@@ -1,7 +1,9 @@
 'use client'
 
+import UserService from '@/services/user/userServices'
 import Link from 'next/link'
-import { usePathname } from 'next/navigation'
+import { usePathname, useRouter } from 'next/navigation'
+import { useEffect } from 'react'
 import styled from 'styled-components'
 
 type Props = {}
@@ -36,8 +38,32 @@ const Container = styled.div`
 
 export default function AdminSideBar({}: Props) {
 	const pathname = usePathname()
+	const router = useRouter()
 
-	return pathname.startsWith('/admin') && pathname !== '/admin/auth' ? (
+		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()
+				if (response.status === 200) {
+					router.push('/admin/auth')
+					document.cookie =
+						'_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' ? (
 		<Container>
 			<img src='/logo.svg' alt='' />
 			<div className='menu'>
@@ -59,12 +85,10 @@ export default function AdminSideBar({}: Props) {
 						<p>Вечная память</p>
 					</div>
 				</Link> */}
-				<Link href='/'>
+					<div className='item' onClick={logout}>
-					<div className='item'>
 						<img src='/log-out.svg' alt='' />
 						<p>Выйти</p>
 					</div>
-				</Link>
 			</div>
 		</Container>
 	) : null

src/components/screens/admin/auth/Auth.tsx

@@ -0,0 +1,146 @@
+'use client'
+
+import MainButton from '@/components/UI/button/MainButton'
+import FormInput from '@/components/UI/input/FormInput'
+import Loader from '@/components/UI/loader/Loader'
+import UserService from '@/services/user/userServices'
+import { useRouter } from 'next/navigation'
+import { ChangeEvent, FormEvent, useState } from 'react'
+import styled from 'styled-components'
+
+type Props = {}
+
+const Container = styled.div`
+	width: 100%;
+	height: 100vh;
+	background-image: url('/image 12.png');
+	background-position: center;
+	background-size: cover;
+
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	position: absolute;
+	top: 0;
+	left: 0;
+
+	.form {
+		width: 440px;
+		padding: 20px;
+		text-align: center;
+		display: flex;
+		justify-content: center;
+		flex-direction: column;
+		gap: 20px;
+		backdrop-filter: blur(4px);
+		background: rgba(129, 129, 129, 0.4);
+		color: ${(props) => props.theme.colors.white};
+		border-radius: 12px;
+	}
+`
+
+const NotificationContainer = styled.div`
+	position: absolute;
+	width: 100%;
+	height: 100%;
+	top: 0;
+	left: 0;
+	background: rgba(255, 255, 255, 0.5);
+	border-radius: 12px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+
+	.container {
+		background: ${(props) => props.theme.colors.white};
+		min-height: 100px;
+		min-width: 100px;
+		padding: 15px;
+		border-radius: 12px;
+		${(props) => props.theme.shadow}
+		display: flex;
+		align-items: center;
+		justify-content: center;
+		flex-direction: column;
+		gap: 15px;
+		color: ${(props) => props.theme.colors.black};
+	}
+`
+
+export default function Auth({}: Props) {
+	const router = useRouter()
+
+	const [admin, setAdmin] = useState({
+		login: '',
+		password: ''
+	})
+
+	const [errorMessage, setErrorMessage] = useState('')
+	const [errorState, setErrorState] = useState(false)
+	const [loading, setLoading] = useState(false)
+
+	const authFunc = async (e: FormEvent<HTMLFormElement>) => {
+		e.preventDefault()
+		setLoading(true)
+		try {
+			const response = await UserService.auth(admin)
+			if (response.status === 200) {
+				router.push('/admin/applications')
+			} else {
+				setErrorMessage(response.data)
+				setErrorState(true)
+			}
+		} catch (error) {
+      setErrorMessage('Сервер недоступен')
+			setErrorState(true)
+    }
+		setLoading(false)
+	}
+
+	return (
+		<>
+			<Container>
+				<form className='form' onSubmit={authFunc}>
+					<h2>Админ панель</h2>
+					<FormInput
+						value={admin.login}
+						onChange={(e: ChangeEvent<HTMLInputElement>) =>
+							setAdmin({ ...admin, login: e.target.value })
+						}
+						placeholder='Логин'
+					/>
+					<FormInput
+						value={admin.password}
+						onChange={(e: ChangeEvent<HTMLInputElement>) =>
+							setAdmin({ ...admin, password: e.target.value })
+						}
+						placeholder='Пароль'
+						type='password'
+					/>
+					<MainButton onClick={authFunc}>Войти</MainButton>
+					{loading ? (
+						<NotificationContainer>
+							<div className='container'>
+								<Loader />
+							</div>
+						</NotificationContainer>
+					) : (
+						errorState && (
+							<NotificationContainer>
+								<div className='container'>
+									<h3>{errorMessage}</h3>
+									<MainButton
+										fullWidth={true}
+										onClick={() => setErrorState(false)}
+									>
+										Закрыть
+									</MainButton>
+								</div>
+							</NotificationContainer>
+						)
+					)}
+				</form>
+			</Container>
+		</>
+	)
+}

src/components/screens/admin/service/Services.tsx

@@ -137,29 +137,23 @@ export default function Services({}: Props) {
 												</MainButton>
 											</div>
 											{loadingState ? (
-												<>
 													<NotificationContainer>
 														<Loader />
 													</NotificationContainer>
-												</>
 											) : services.length !== 0 ? (
-												<>
+												<div className='list'>
-													<div className='list'>
+													{services.map((item: T_Product, index) => (
-														{services.map((item: T_Product, index) => (
+														<ServiceItem
-															<ServiceItem
+															item={item}
-																item={item}
+															key={index}
-																key={index}
+															getServices={getServices}
-																getServices={getServices}
+														/>
-															/>
+													))}
-														))}
+												</div>
-													</div>
-												</>
 											) : (
-												<>
+												<NotificationContainer>
-													<NotificationContainer>
+													<h3>Ничего не найдено</h3>
-														<h3>Ничего не найдено</h3>
+												</NotificationContainer>
-													</NotificationContainer>
-												</>
 											)}
 										</>
 									) : (

src/components/screens/admin/service/blocks/AddServiceForm.tsx

@@ -127,6 +127,9 @@ export default function AddServiceForm({
 			OldPrice: ''
 		})
 		setSelectedImage(null)
+		if (iconInputRef.current) {
+			iconInputRef.current.value = ''
+		}
 	}, [modal])
 
 	const [errorState, setErrorState] = useState(false)
@@ -161,16 +164,21 @@ export default function AddServiceForm({
 		setLoader(true)
 		const response = await ProductService.create(newProduct)
 		if (response.status === 200 && selectedImage) {
-			const imageResponse = await ProductService.addImage(
+			try {
-				response.data.Id,
+				const imageResponse = await ProductService.addImage(
-				selectedImage
+					response.data.Id,
-			)
+					selectedImage
-			if (imageResponse.status === 200) {
+				)
-				getServices()
+				if (imageResponse.status === 200) {
-				setModal(false)
+					getServices()
-			} else {
+					setModal(false)
+				} else {
+					setErrorMessage(response.data)
+					setErrorState(true)
+				}
+			} catch (error) {
+				setErrorMessage('Нет папки images')
 				setErrorState(true)
-				setErrorMessage(response.data)
 			}
 		} else {
 			setErrorState(true)

src/components/screens/admin/service/blocks/ServiceItem.tsx

@@ -4,6 +4,7 @@ import { useState } from 'react'
 import styled from 'styled-components'
 import { T_Product } from '../../../../../services/product/type'
 import UpdateServiceForm from './UpdateServiceForm'
+import { hostName } from '../../../../../../config'
 
 const Cart = styled.div`
 	display: flex;
@@ -64,7 +65,7 @@ export default function ServiceItem({ item, getServices }: Props) {
 		<>
 			<Cart>
 				<div className='block'>
-					<img src={item.ImageUrls[0]} alt='' />
+					<img src={'/'+item.ImageUrls[0]} alt='' />
 					<h3>{item.Name}</h3>
 					<p>{item.FullDesc}</p>
 				</div>

src/components/screens/home/blocks/services/Services.tsx

@@ -116,16 +116,16 @@ export default function Services({}: Props) {
 
 	const getServices = async () => {
 		try {
-			const response = await ProductService.get()
+			const response = await ProductService.get('')
 			setServices(response.data.Data)
 		} catch (error) {
 			setErrorState(true)
 		}
-		setLoadingState(false)
 	}
 
 	useEffect(() => {
 		getServices()
+		setLoadingState(false)
 	}, [])
 
 	const [sliderHeight, setSliderHeight] = useState<number>(0)
@@ -153,15 +153,17 @@ export default function Services({}: Props) {
 				<ServicesContainer>
 					<h2>Наши услуги</h2>
 					{loadingState ? (
-						<>
+						<MessageContainer>
-							<MessageContainer>
+							<Loader />
-								<Loader />
+						</MessageContainer>
-							</MessageContainer>
-						</>
 					) : errorState ? (
 						<MessageContainer>
 							<h3>Ошибка, не удалось получить услуги, сервер не доступен.</h3>
 						</MessageContainer>
+					) : services.length === 0 ? (
+						<MessageContainer>
+							<h3>Услуг пока нет.</h3>
+						</MessageContainer>
 					) : (
 						<>
 							<div className='list'>
@@ -184,15 +186,17 @@ export default function Services({}: Props) {
 			<ServiceSliderContainer>
 				<h2 className='container-title'>Наши услуги</h2>
 				{loadingState ? (
-					<>
+					<MessageContainer>
-						<MessageContainer>
+						<Loader />
-							<Loader />
+					</MessageContainer>
-						</MessageContainer>
-					</>
 				) : errorState ? (
 					<MessageContainer>
 						<h3>Ошибка, не удалось получить услуги, сервер не доступен.</h3>
 					</MessageContainer>
+				) : services.length === 0 ? (
+					<MessageContainer>
+						<h3>Услуг пока нет.</h3>
+					</MessageContainer>
 				) : (
 					<>
 						<div ref={sliderRef}>

src/components/screens/services/Services.tsx

@@ -59,7 +59,7 @@ export default function Services({}: Props) {
 
 	const getServices = async () => {
 		try {
-			const response = await ProductService.get()
+			const response = await ProductService.get('')
 			setServices(response.data.Data)
 		} catch (error) {
 			setErrorState(true)
@@ -85,6 +85,10 @@ export default function Services({}: Props) {
 					<MessageContainer>
 						<h3>Ошибка, не удалось получить услуги, сервер не доступен.</h3>
 					</MessageContainer>
+				) : services.length === 0 ? (
+					<MessageContainer>
+						<h3>Услуг пока нет</h3>
+					</MessageContainer>
 				) : (
 					<List>
 						{services.map((item, index) => (

src/services/order/ordersServices.ts

@@ -1,6 +1,6 @@
-import { hostName } from '@/constants/host'
 import axios, { AxiosResponse } from 'axios'
 import { T_NewOrder } from './type'
+import { hostName } from '../../../config'
 
 export default class OrdersService {
 	static async get(): Promise<AxiosResponse> {

src/services/product/productServeces.ts

@@ -1,6 +1,6 @@
-import { hostName } from '@/constants/host'
 import axios, { AxiosResponse } from 'axios'
 import { T_NewProduct, T_Product } from './type'
+import { hostName } from '../../../config'
 
 export default class ProductService {
 	static async get(searchQuery: string): Promise<AxiosResponse> {

src/services/user/userServices.ts

@@ -0,0 +1,28 @@
+import axios, { AxiosResponse } from 'axios'
+import { hostName } from '../../../config'
+
+type T_user = {
+	login: string
+	password: string
+}
+
+export default class UserService {
+	static async auth(user: T_user): Promise<AxiosResponse> {
+		try {
+			const response = await axios.get(
+				`${hostName}/auth?a123=${user.login}&a321=${user.password}`
+			)
+			return response
+		} catch (error: any) {
+			return error.response
+		}
+	}
+	static async exit(): Promise<AxiosResponse> {
+		try {
+			const response = await axios.get(`${hostName}/exit`)
+			return response
+		} catch (error: any) {
+			return error.response
+		}
+	}
+}