FIX

Rodoro · Oct 20, 2024 · 32cfd19 · 32cfd19
1 parent dc290a7
commit 32cfd19
Show file tree

Hide file tree

Showing 12 changed files with 84 additions and 268 deletions.
diff --git a/src/app/admin/(sections)/batches/create/page.tsx b/src/app/admin/(sections)/batches/create/page.tsx
@@ -22,7 +22,6 @@ const CreateBatches = () => {
     const [open, setOpen] = React.useState(false);
     const [status, setStatus] = React.useState('200');
     const [message, setMessage] = React.useState('Ok!')
-
 
 
     useEffect(() => {
@@ -108,7 +107,13 @@ const CreateBatches = () => {
     return (
         <div className="mt-20 mr-8 ml-8 md:ml-32 md:mt-8 mb-8" >
             <ErrorModal status={status} message={message} visible={open} setVisible={setOpen} />
-            <table className="table-auto w-full bg-[#0A0D1D4D]  border-[#FFFFFF26] rounded-lg overflow-hidden"> 
+            <table
+                style={{
+                    border: '1px solid transparent',
+                    background: 'linear-gradient(#141330, #141330) padding-box, linear-gradient(to top, #171833, #3D3456) border-box',
+                }}
+                className="table-auto w-full bg-[#0A0D1D4D] border-[1px]  border-[#FFFFFF26] rounded-lg overflow-hidden"
+                > 
             <tbody className='rounded-lg'>
                 <tr className="bg-[#0A0D1D4D]">
                     <td className="px-6 py-4 whitespace-nowrap">Title *</td>
@@ -154,7 +159,7 @@ const CreateBatches = () => {
                             type="number" 
                             value={sort} 
                             onChange={e => setSort(e.target.value)} 
-                            required 
+                            required
                             style={{
                                 border: '1px solid transparent',
                                 background: 'linear-gradient(#18173D, #18173D) padding-box, linear-gradient(to top, #FFFFFF01, #FFFFFF26) border-box',
@@ -222,7 +227,7 @@ const CreateBatches = () => {
             </tbody>
         </table>
             <div className='flex flex-row justify-end space-x-3 mt-4 block'>
-                <Button onClick={() => router.push("/admin/batches") } className="h-[45px]">Cancel</Button>
+                <Button onClick={() => router.push("/admin/batches") } className="h-[45px] text-white">Cancel</Button>
                 <Button3 className='bg-[#7E50FF] text-white shadow-[4px_4px_34px_0_rgba(139,50,252,0.2)] justify-center w-[110px] h-[45px]' onClick={() => handleSubmitAndMain()}>Create</Button3>
                 <Button3 className='bg-[#7E50FF] text-white shadow-[4px_4px_34px_0_rgba(139,50,252,0.2)] justify-center w-[203px] h-[45px]' onClick={handleSubmitAndNew}>Create and Open New</Button3>
             </div>

diff --git a/src/app/admin/(sections)/batches/page.tsx b/src/app/admin/(sections)/batches/page.tsx
@@ -7,9 +7,7 @@ import { Batch, Game } from '@/types/admin.interface';
 import Button2 from '@/components/interface/admin/Button2';
 import { useRouter } from 'next/navigation';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
-import Button from '@/components/interface/Button'
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
+import ButtonExit from '@/components/interface/admin/ButtonExit';
 
 const BatchesPage = () => {
   const [batches, setBatches] = useState<Batch[]>([]);
@@ -62,13 +60,10 @@ const BatchesPage = () => {
   ];
 
   return (
-    <div style={{ height: games.length === 0 ? 400 : undefined }} className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+    <div style={{ height: games.length === 0 ? 400 : undefined }} className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
       <div className="md:flex md:justify-between max-md:w-full mb-6">
         <Button2 className="px-2  md:w-[177px]" onClick={() => router.push("/admin/batches/create")}>+ Create Batch</Button2>
-        <Button className='max-md:hidden' onClick={() => { authService.logout(); window.location.reload(); }}>
-          <p className='mr-[10px]'>Exit</p>
-          <FaDoorOpen className='' />
-        </Button>
+        <ButtonExit/>
       </div>
       <DataGrid
         data={finalData}  

diff --git a/src/app/admin/(sections)/games/page.tsx b/src/app/admin/(sections)/games/page.tsx
@@ -9,9 +9,7 @@ import {
 } from '@mui/x-data-grid';
 import { useRouter } from 'next/navigation';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
-import Button from '@/components/interface/Button'
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
+import ButtonExit from '@/components/interface/admin/ButtonExit';
 
 const GamesPage = () => {
     const [games, setGames] = useState<Game[]>([]);
@@ -58,12 +56,9 @@ const GamesPage = () => {
     ]
 
     return (
-        <div style={{ height: loading ? 400 : games.length === 0 ? 400 : '' }} className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+        <div style={{ height: loading ? 400 : games.length === 0 ? 400 : '' }} className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
             <div className = "flex justify-end mb-6">
-                <Button className='max-md:hidden' onClick={() => { authService.logout(); window.location.reload(); }}>
-                    <p className='mr-[10px]'>Exit</p>
-                    <FaDoorOpen className=''/>
-                </Button>
+                <ButtonExit/>
             </div>
             <DataGrid
                 data={modifiedGames} 

diff --git a/src/app/admin/(sections)/items/page.tsx b/src/app/admin/(sections)/items/page.tsx
@@ -5,9 +5,8 @@ import DataGrid from '@/containers/admin/DataGrid';
 import { Item } from '@/types/admin.interface';
 import { useRouter } from 'next/navigation';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
-import Button from '@/components/interface/Button'
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
+import ButtonExit from '@/components/interface/admin/ButtonExit';
+import Image from 'next/image'
 
 const ItemsPage = () => {
     const [items, setItems] = useState<Item[]>([]);
@@ -18,7 +17,7 @@ const ItemsPage = () => {
         const fetchData = async () => {
             try {
                 const res = await axiosWithAuthAdmin.get('/admin/items/get-all');
-                console.log("Fetched items:", res.data); // Выводим данные
+                console.log("Fetched items:", res.data); 
                 setItems(res.data);
             } catch (error) {
                 console.error("Ошибка при получении предметов:", error);
@@ -34,32 +33,31 @@ const ItemsPage = () => {
     };
 
     const columns = [
-        { key: "id" as keyof Item, label: "ID" },
-        { key: "game" as keyof Item, label: "Game" },
-        { key: "title" as keyof Item, label: "Title" },
+        { key: 'id', label: 'ID' },
+        { key: 'game', label: 'Game' },
+        { key: 'title', label: 'Title' },
         {
-            key: "imageUrl" as keyof Item,
-            label: "Image",
+            key: 'imageUrl',
+            label: 'Image',
             render: (record: Item) => (
-                <img
-                    src={record.imageUrl.replace(/ /g, '%20')} // Заменяем пробелы на %20
-                    alt={record.title}
-                    style={{ width: 50, height: 50 }}
-                    onError={(e) => { e.currentTarget.src = 'fallback-image-url'; }} // Замените на URL изображения по умолчанию
-                />
+                <Image
+                src={record.imageUrl.replace(/ /g, '%20')}
+                alt={record.title}
+                onError={(e) => {
+                    e.currentTarget.src = 'fallback-image-url';
+                }}
+                style={{ width: 50, height: 50 }}
+            />
             ),
         },
-        { key: "price" as keyof Item, label: "Price" },
-        { key: "rarity" as keyof Item, label: "Rarity" },
+        { key: 'price', label: 'Price' },
+        { key: 'rarity', label: 'Rarity' },
     ];
 
     return (
-        <div className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+        <div className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
             <div className = "flex justify-end mb-[50px]">
-                <Button className='max-md:hidden' onClick={() => { authService.logout(); window.location.reload(); }}>
-                    <p className='mr-[10px]'>Exit</p>
-                    <FaDoorOpen className=''/>
-                </Button>
+                <ButtonExit/>
             </div>
             <DataGrid
                 data={items}

diff --git a/src/app/admin/(sections)/loot-cases/create/page.tsx b/src/app/admin/(sections)/loot-cases/create/page.tsx
@@ -99,12 +99,27 @@ const LootCreate = () => {
     return (
         <div className="mt-20 mr-8 ml-8 md:ml-32 md:mt-8 mb-8">
             <ErrorModal status={status} message={message} visible={open} setVisible={setOpen} />
-            <table className="table-auto w-full rounded-lg">
+            <table
+                style={{
+                    border: '1px solid transparent',
+                    background: 'linear-gradient(#141330, #141330) padding-box, linear-gradient(to top, #171833, #3D3456) border-box',
+                }}
+                className="table-auto w-full rounded-lg"
+            >
                 <tbody>
                     <tr className="bg-[#0A0D1D4D]  rounded-lg">
                         <td className="px-6 py-4 whitespace-nowrap">Game *</td>
                         <td className="px-6 py-4 whitespace-nowrap">
-                            <select value={selectGame} onChange={e => setSelectGame(e.target.value)} required className="placeholder-[#AABCF9] focus:outline-none flex flex-row border text-sm rounded-lg w-full p-2.5 bg-[#22276E33] border-[#FFFFFF26] placeholder-[#AABCF9] text-[#F9FAFB] focus:bg-[#8B32FC33] focus:border-[#6A12FA]">
+                            <select 
+                                value={selectGame} 
+                                onChange={e => setSelectGame(e.target.value)} 
+                                required 
+                                style={{
+                                    border: '1px solid transparent',
+                                    background: 'linear-gradient(#18173D, #18173D) padding-box, linear-gradient(to top, #FFFFFF01, #FFFFFF26) border-box',
+                                }}
+                                className="text-[#AABCF9]  focus:outline-none flex flex-row border text-sm rounded-2xl h-[51px] w-full p-2.5 bg-[#22276E33] border-[#FFFFFF26] focus:bg-[#8B32FC33] focus:border-[#6A12FA]" 
+                                >
                                 <option value='' disabled selected>-/-</option>
                                 {games.map((game) => (
                                     <option key={game.id} value={game.id}>
@@ -117,10 +132,19 @@ const LootCreate = () => {
                     <tr className="bg-[#0A0D1D4D] rounded-lg">
                         <td className="px-6 py-4 whitespace-nowrap">Batch *</td>
                         <td className="px-6 py-4 whitespace-nowrap">
-                            <select value={selectBatch} onChange={e => setSelectBatch(e.target.value)} required className="focus:outline-none flex flex-row border text-sm rounded-lg w-full p-2.5 bg-[#22276E33] border-[#FFFFFF26] placeholder-[#AABCF9] text-[#F9FAFB] focus:bg-[#8B32FC33] focus:border-[#6A12FA]">
-                                <option value='' disabled selected>-/-</option>
-                                {batches.map((batch) => (
-                                    <option key={batch.id} value={batch.id}>
+                            <select 
+                                value={selectBatch} 
+                                onChange={e => setSelectBatch(e.target.value)} 
+                                required 
+                                style={{
+                                    border: '1px solid transparent',
+                                    background: 'linear-gradient(#18173D, #18173D) padding-box, linear-gradient(to top, #FFFFFF01, #FFFFFF26) border-box',
+                                }}
+                                className=" focus:outline-none flex flex-row border text-sm rounded-2xl h-[51px] w-full p-2.5  bg-[#22276E33] border-[#FFFFFF26] text-[#AABCF9] focus:bg-[#8B32FC33] focus:border-[#6A12FA]" 
+                                >
+                                <option value='' disabled selected className='bg-[#22276E]'>-/-</option>
+                                    {batches.map((batch) => (
+                                    <option key={batch.id} value={batch.id} className='bg-[#22276E]'>
                                         {batch.title}
                                     </option>
                                 ))}
@@ -182,7 +206,7 @@ const LootCreate = () => {
                                             <td>
                                                 <button 
                                                     onClick={() => handleDeleteRow(index)}
-                                                    className='text-red-700 ml-3 p-1 px-3 rounded-full border-2'
+                                                    className='text-red-700 ml-3 p-1 px-3 rounded-full w-[37px] h-[37px] border-2'
                                                     style={{
                                                         border: '1px solid transparent',
                                                         background: 'linear-gradient(#2A1B36, #2A1B36) padding-box, linear-gradient(to right, #6A3B4D, #38223C) border-box',

diff --git a/src/app/admin/(sections)/loot-cases/page.tsx b/src/app/admin/(sections)/loot-cases/page.tsx
@@ -10,15 +10,9 @@ import {
     GridActionsCellItem,
     GridRowId,
 } from '@mui/x-data-grid';
-import FileCopyIcon from '@mui/icons-material/FileCopy';
-import VisibilityIcon from '@mui/icons-material/Visibility';
-import SettingsIcon from '@mui/icons-material/Settings';
-import DeleteIcon from '@mui/icons-material/Delete';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
 import { useQueries, useQuery } from '@tanstack/react-query';
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
-import Button from '@/components/interface/Button'
+import ButtonExit from '@/components/interface/admin/ButtonExit';
 
 
 const getData = async () => {
@@ -88,13 +82,10 @@ const columns = [
     { key: "isVisible" as keyof LootCases, label: "Is Visible"}, 
 ];
     return (
-        <div style={{ height: loading ? 400 : loots.length === 0 ? 400 : '' }} className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+        <div style={{ height: loading ? 400 : loots.length === 0 ? 400 : '' }} className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
         <div className = "flex justify-between">
             <Button2 className="px-2 mb-6 md:w-[177px]" onClick={() => router.push("/admin/loot-cases/create")}>+ Create Loot case</Button2>
-            <Button className='max-md:hidden ' onClick={() => { authService.logout(); window.location.reload(); }}>
-                <p className='mr-[10px]'>Exit</p>
-                <FaDoorOpen className=''/>
-            </Button>
+            <ButtonExit/>
         </div>
             <DataGrid
                 data={loots}  

diff --git a/src/app/admin/(sections)/staff/page.tsx b/src/app/admin/(sections)/staff/page.tsx
@@ -4,10 +4,7 @@ import React, { useEffect, useState } from 'react'
 import DataGrid from '@/containers/admin/DataGrid';
 import { Staff } from '@/types/admin.interface';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
-import Button from '@/components/interface/Button'
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
-
+import ButtonExit from '@/components/interface/admin/ButtonExit';
 
 const StafsPage = () => {
     const [stafs, setStafs] = useState<Staff[]>([]);
@@ -38,12 +35,9 @@ const StafsPage = () => {
     ];
 
     return (
-        <div style={{ height: loading ? 400 : stafs.length === 0 ? 400 : 'auto' }} className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+        <div style={{ height: loading ? 400 : stafs.length === 0 ? 400 : 'auto' }} className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
             <div className = "flex justify-end mb-6">
-                <Button className='max-md:hidden' onClick={() => { authService.logout(); window.location.reload(); }}>
-                    <p className='mr-[10px]'>Exit</p>
-                    <FaDoorOpen className=''/>
-                </Button>
+                <ButtonExit/>
             </div>
             <DataGrid
                 data={stafs}

diff --git a/src/app/admin/(sections)/users/page.tsx b/src/app/admin/(sections)/users/page.tsx
@@ -5,10 +5,7 @@ import DataGrid from '@/containers/admin/DataGrid';
 import { User } from '@/types/admin.interface';
 import Link from 'next/link';
 import { axiosWithAuthAdmin } from '@/api/intreceptors';
-import { authService } from '@/services/auth/auth.services';
-import { FaDoorOpen } from "react-icons/fa6";
-import Button from '@/components/interface/Button'
-
+import ButtonExit from '@/components/interface/admin/ButtonExit';
 
 const UsersPage = () => {
     const [users, setUsers] = useState<User[]>([]);
@@ -38,12 +35,9 @@ const UsersPage = () => {
     ];
 
     return (
-        <div style={{ height: users.length === 0 ? 400 : '' }} className="mt-20 mr-8 ml-8 md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8 ">
+        <div style={{ height: users.length === 0 ? 400 : '' }} className="mt-20 ml-8 xl:ml-[110px] lg:ml-[250px] md:ml-60 lg:ml-[150px] max-md:ml-[0px] md:mt-8 mb-8  ">
             <div className = "flex justify-end mb-6">
-                <Button className='max-md:hidden' onClick={() => { authService.logout(); window.location.reload(); }}>
-                    <p className='mr-[10px]'>Exit</p>
-                    <FaDoorOpen className=''/>
-                </Button>
+                <ButtonExit/>
             </div>
             <DataGrid
                 data={users}

diff --git a/src/app/admin/layout.tsx b/src/app/admin/layout.tsx
@@ -41,8 +41,8 @@ export default function DashboardLayout({
                     {isNavVisible && <Navbar isVisible={isNavVisible} onClose={toggleNavbar} className='max-lg:w-[240px] items-end' />}
                 </div>
                 <div>
-                    <div className="flex flex-row md:justify-end ">
-                        <div className='flex justify-between w-full'>
+                    <div className="flex flex-row md:justify-end mt-[30px]">
+                        <div className='flex justify-between w-full '>
                             <div className='inline-block md:hidden'>
                                 <Logo/>
                             </div>