add and edit

src/features/api/apiSlice.ts

+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+import { RootState } from '../../main';
+
+export const apiSlice = createApi({
+    reducerPath: 'api',
+    baseQuery: fetchBaseQuery({
+        baseUrl: "http://77.243.80.217:8080/esutd/api",
+        prepareHeaders: (headers, { getState }) => {
+            const state = getState() as RootState;
+            const accessToken = state.auth.token;
+
+            if (accessToken) {
+                headers.set("Authorization", `Bearer ${accessToken}`);
+            }
+
+            headers.set("Content-Type", "application/json");
+            headers.set("Accept", "application/json");
+
+            return headers;
+        },
+    }),
+    tagTypes: ["organizations", "requests"],
+    endpoints: () => ({}),
+});
\ No newline at end of file

src/features/api/apiSlice.tsx → src/features/api/organizationApiSlice.ts

-import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
-import { RootState } from '../../main';
+import { apiSlice } from "./apiSlice";
 
 interface Organization {
     id: number;
@@ -14,58 +13,50 @@ interface Organization {
     host: string;
 }
 
-export const apiSlice = createApi({
-    reducerPath: 'api',
-    baseQuery: fetchBaseQuery({
-        baseUrl: "http://77.243.80.217:8080/esutd/api/organizations",
-        prepareHeaders: (headers, { getState }) => {
-            const state = getState() as RootState;
-            const accessToken = state.auth.token;
-
-            if (accessToken) {
-                headers.set("Authorization", `Bearer ${accessToken}`);
-            }
-
-            headers.set("Content-Type", "application/json");
-            headers.set("Accept", "application/json");
-
-            return headers;
-        },
-    }),
-    tagTypes: ["organizations"],
+export const organizationApiSlice = apiSlice.injectEndpoints({
     endpoints: (builder) => ({
         getOrganizations: builder.query<Organization[], void>({
-            query: () => '/list',
+            query: () => 'organizations/list',
             providesTags: ["organizations"],
         }),
         getOrganization: builder.query<Organization, string>({
-            query: (orgId) => `/info?id=${orgId}`,
+            query: (orgId) => `organizations/info?id=${orgId}`,
         }),
         addNewOrganization: builder.mutation<Organization, Partial<Organization>>({
             query: (initialOrg) => ({
+<<<<<<< HEAD:src/features/api/apiSlice.tsx
                 url: '/save',
+=======
+                url: 'organizations/save',
+>>>>>>> e93810e4a59710e9f9329c2e9ad9fd0a34104287:src/features/api/organizationApiSlice.ts
                 method: 'POST',
                 body: initialOrg,
             }),
             invalidatesTags: ["organizations"],
         }),
         editOrganization: builder.mutation<Organization, Partial<Organization>>({
+<<<<<<< HEAD:src/features/api/apiSlice.tsx
             query: ({ ...rest }) => ({
                 url: `/save`,
                 method: 'POST',
+=======
+            query: ({ id, ...rest }) => ({
+                url: `organizations/edit?id=${id}`,
+                method: 'PUT',
+>>>>>>> e93810e4a59710e9f9329c2e9ad9fd0a34104287:src/features/api/organizationApiSlice.ts
                 body: rest,
             }),
             invalidatesTags: ["organizations"],
         }),
         deleteOrganization: builder.mutation<{ success: boolean; id: number }, number>({
             query: (orgId) => ({
-                url: `/delete?id=${orgId}`,
+                url: `organizations/delete?id=${orgId}`,
                 method: 'DELETE',
             }),
             invalidatesTags: ["organizations"],
         }),
-    }),
-});
+    })
+})
 
 export const {
     useGetOrganizationsQuery,
@@ -73,4 +64,4 @@ export const {
     useAddNewOrganizationMutation,
     useEditOrganizationMutation,
     useDeleteOrganizationMutation,
-} = apiSlice;
+} = organizationApiSlice;

src/features/api/requestApiSlice.ts

+import { apiSlice } from "./apiSlice";
+
+interface Request {
+    id: number;
+    sendDate: string;
+    errorMessage: string;
+    resendDate: null;
+    resentCount: number;
+    status: number;
+    esutdOrganizationCode: string;
+    requestType: string;
+    documentID: string;
+    xml: string;
+}
+
+interface RequestsResponse {
+    list: Request[];
+    pageNumber: number;
+    pageSize: number;
+    totalPages: number;
+    totalCount: number;
+}
+
+export const requestApiSlice = apiSlice.injectEndpoints({
+    endpoints: (builder) => ({
+        getRequests: builder.query<RequestsResponse, void>({
+            query: () => 'requests/list?pageNumber=0&pageSize=30',
+            providesTags: ["requests"],
+        }),
+        addNewRequest: builder.mutation<Request, Partial<Request>>({
+            query: (initialReq) => ({
+                url: 'requests/save',
+                method: 'POST',
+                body: initialReq,
+            }),
+            invalidatesTags: ["requests"],
+        })
+    })
+})
+
+export const {
+    useAddNewRequestMutation,
+    useGetRequestsQuery,
+} = requestApiSlice;
\ No newline at end of file

src/features/pagination/mainPagination.tsx → src/features/pagination/mainPagination.ts

@@ -13,7 +13,7 @@ const initialState: InitialState = {
 }
 
 const mainPaginationSlice = createSlice({
-    name: 'pagination',
+    name: 'mainPagination',
     initialState,
     reducers: {
         setCurrentPage: (state, action) => {

src/features/pagination/reqPagination.ts

+import { createSlice } from "@reduxjs/toolkit";
+
+const initialState = {
+    currentPage: 1,
+    totalReqNumber: 0,
+    REQ_NUMBER_PER_PAGE: 10
+}
+
+const reqPaginationSlice = createSlice({
+    name: 'reqPagination',
+    initialState,
+    reducers: {
+        setCurrentPage: (state, action) => {
+            state.currentPage = action.payload;
+        },
+        setTotalReqNumber: (state, action) => {
+            state.totalReqNumber = action.payload;
+        }
+    }
+})
+
+export const { setCurrentPage, setTotalReqNumber } = reqPaginationSlice.actions;
+export default reqPaginationSlice.reducer;
\ No newline at end of file

src/pages/(crudPages)/AddPage.tsx

 import React from 'react';
 import { useNavigate } from 'react-router';
 import { Form, Input, Button, Select, message } from 'antd';
-import { useAddNewOrganizationMutation } from '../../features/api/apiSlice';
+import { useAddNewOrganizationMutation } from '../../features/api/organizationApiSlice';
 import { setTotalOrgNumber, setCurrentPage } from '../../features/pagination/mainPagination';
 import { useSelector, useDispatch } from 'react-redux';
 import './style.css';

src/pages/(crudPages)/EditPage.tsx

 import React, { useEffect } from 'react';
 import { useNavigate, useParams } from 'react-router';
 import { Form, Input, Button, Select, message } from 'antd';
-import { useGetOrganizationQuery, useEditOrganizationMutation } from '../../features/api/apiSlice';
+import { useGetOrganizationQuery, useEditOrganizationMutation } from '../../features/api/organizationApiSlice';
 import './style.css';
 interface EditValues {
     id: number; 

src/pages/HomePage/Columns.tsx

@@ -2,7 +2,7 @@ import React, { useState } from 'react';
 import { useNavigate } from 'react-router';
 import { Button, Space, Tag, Modal, message } from 'antd';
 import type { TableProps } from 'antd';
-import { useDeleteOrganizationMutation } from '../../features/api/apiSlice';
+import { useDeleteOrganizationMutation } from '../../features/api/organizationApiSlice';
 import { getStatusText, getStatusColor } from './utils';
 
 export interface DataType {

src/pages/HomePage/HomePage.tsx

@@ -2,7 +2,7 @@ import React, { useEffect } from 'react';
 import { useNavigate } from 'react-router';
 import { useSelector, useDispatch } from 'react-redux';
 import { Button, Pagination, Spin, Table } from 'antd';
-import { useGetOrganizationsQuery } from '../../features/api/apiSlice';
+import { useGetOrganizationsQuery } from '../../features/api/organizationApiSlice';
 import { setCurrentPage, setTotalOrgNumber } from '../../features/pagination/mainPagination';
 import { DataType, columns } from './Columns';
 import './Homepage.css';

src/pages/RequestPage/Columns.tsx

 import React, { useState } from 'react';
-import { useNavigate } from 'react-router';
 import { Button, Space, Tag, Modal, message } from 'antd';
 import type { TableProps } from 'antd';
 import { getStatusText, getStatusColor } from './utils';
@@ -18,129 +17,6 @@ export interface DataType {
     xml: string;
 }
 
-export const rows = [
-    {
-        "id": 2,
-        "sendDate": "2024-07-11T19:05:00.000+00:00",
-        "errorMessage": "<soap>err1</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 1,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "22345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data1</soapenv>"
-    },
-    {
-        "id": 3,
-        "sendDate": "2024-07-11T19:10:00.000+00:00",
-        "errorMessage": "<soap>err2</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 2,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "32345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data2</soapenv>"
-    },
-    {
-        "id": 4,
-        "sendDate": "2024-07-11T19:15:00.000+00:00",
-        "errorMessage": "<soap>err3</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 3,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "42345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data3</soapenv>"
-    },
-    {
-        "id": 5,
-        "sendDate": "2024-07-11T19:20:00.000+00:00",
-        "errorMessage": "<soap>err4</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 4,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "52345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data4</soapenv>"
-    },
-    {
-        "id": 6,
-        "sendDate": "2024-07-11T19:25:00.000+00:00",
-        "errorMessage": "<soap>err5</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 3,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "62345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data5</soapenv>"
-    },
-    {
-        "id": 7,
-        "sendDate": "2024-07-11T19:30:00.000+00:00",
-        "errorMessage": "<soap>err6</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 4,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "72345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data6</soapenv>"
-    },
-    {
-        "id": 8,
-        "sendDate": "2024-07-11T19:35:00.000+00:00",
-        "errorMessage": "<soap>err7</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 2,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "82345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data7</soapenv>"
-    },
-    {
-        "id": 9,
-        "sendDate": "2024-07-11T19:40:00.000+00:00",
-        "errorMessage": "<soap>err8</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 2,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "92345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data8</soapenv>"
-    },
-    {
-        "id": 10,
-        "sendDate": "2024-07-11T19:45:00.000+00:00",
-        "errorMessage": "<soap>err9</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 1,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "102345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data9</soapenv>"
-    },
-    {
-        "id": 11,
-        "sendDate": "2024-07-11T19:50:00.000+00:00",
-        "errorMessage": "<soap>err10</soap>",
-        "resendDate": null,
-        "resentCount": 0,
-        "status": 1,
-        "esutdOrganizationCode": "arta",
-        "requestType": "contract",
-        "documentID": "112345678-1234-1234-1234-123456789012",
-        "xml": "<soapenv>data10</soapenv>"
-    }
-]
-
 export const columns: TableProps<DataType>['columns'] = [
     {
         title: "ID",
@@ -207,44 +83,38 @@ export const columns: TableProps<DataType>['columns'] = [
     }
 ]
 
-export const ActionColumn: React.FC<{ data: DataType }> = ({ data }) => {
+export const ActionColumn: React.FC<{ data: DataType }> = () => {
     const [open, setOpen] = useState<boolean>(false);
-    const navigate = useNavigate();
-    // const [deleteOrganization] = useDeleteOrganizationMutation();
 
-    const showDeleteModal = () => {
+    const showResendModal = () => {
         setOpen(true);
     };
 
-    // const handleDeleteModalOk = async () => {
-    //     try {
-    //         await deleteOrganization(data.id).unwrap();
-    //         message.success('Организация успешно удалена!');
-    //         setOpen(false);
-    //     } catch (err) {
-    //         message.error('Произошла ошибка при удалении организации!');
-    //     }
-    // };
-
-    const handleDeleteModalCancel = () => {
+    const handleResendModalOk = async () => {
+        try {
+            // await resendRequest().unwrap();
+            message.success('Запрос успешно переотправлен!');
             setOpen(false);
+        } catch (err) {
+            message.error('Произошла ошибка при переотправке запроса!');
+        }
     };
 
-    const handleEditClick = () => {
-        navigate(`/edit/${data.id}`);
-    }
+    const handleResendModalCancel = () => {
+        setOpen(false);
+    };
 
     return (
         <Space>
-            <Button onClick={handleEditClick}>Изменить</Button>
-            <Button onClick={showDeleteModal} type="primary" danger>Удалить</Button>
+            <Button onClick={showResendModal}>П</Button>
             <Modal
                 open={open}
-                title={`Вы уверены, что хотите удалить?`}
+                title={`Вы уверены, что хотите переотправить?`}
                 // onOk={handleDeleteModalOk}
-                onCancel={handleDeleteModalCancel}
+                onCancel={handleResendModalCancel}
+                onOk={handleResendModalOk}
             >
-                <p>Подтвердите удаление организации.</p>
+                <p>Подтвердите переотправку запроса.</p>
             </Modal>
         </Space>
     )

src/pages/RequestPage/RequestPage.tsx

 import React, { useEffect } from 'react';
+import dayjs from 'dayjs';
 import { DatePicker, Select, Button, Pagination, Spin, Table } from 'antd';
-// import { MaterialSymbol } from 'react-material-symbols';
-import { useNavigate } from 'react-router';
 import { useDispatch, useSelector } from 'react-redux';
-import dayjs from 'dayjs';
+import { columns, DataType } from './Columns';
+import { useGetRequestsQuery } from '../../features/api/requestApiSlice';
+import { setCurrentPage, setTotalReqNumber } from '../../features/pagination/reqPagination';
 import './RequestPage.css';
-import { columns, DataType, rows } from './Columns';
 
 const dateFormat = 'YYYY/MM/DD';
 
 const RequestPage: React.FC = () => {
-    const navigate = useNavigate();
     const dispatch = useDispatch();
-    const totalOrgNumber = useSelector((state: any) => state.mainPagination.totalOrgNumber);
-    const currentPage = useSelector((state: any) => state.mainPagination.currentPage);
-    const ORG_NUMBER_PER_PAGE = useSelector((state: any) => state.mainPagination.ORG_NUMBER_PER_PAGE);
-
-    const handleAddClick = () => {
-        
-    };
+    const totalReqNumber = useSelector((state: any) => state.reqPagination.totalReqNumber);
+    const currentPage = useSelector((state: any) => state.reqPagination.currentPage);
+    const REQ_NUMBER_PER_PAGE = useSelector((state: any) => state.reqPagination.REQ_NUMBER_PER_PAGE);
 
     const handlePaginationChange = (page: number) => {
-
+        dispatch(setCurrentPage(page));
     };
 
     const paginatedData = (dataSource: DataType[]) => {
-        const startIndex = (currentPage - 1) * ORG_NUMBER_PER_PAGE;
-        const endIndex = Math.min(startIndex + ORG_NUMBER_PER_PAGE, totalOrgNumber);
+        const startIndex = (currentPage - 1) * REQ_NUMBER_PER_PAGE;
+        const endIndex = Math.min(startIndex + REQ_NUMBER_PER_PAGE, totalReqNumber);
         return dataSource.slice(startIndex, endIndex);
-    }
+    };
 
-    // const {
-    //     data: orgs = [],
-    //     isLoading,
-    //     isSuccess,
-    //     isError,
-    //     error
-    // } = useGetOrganizationsQuery();
+    const {
+        data: reqs = { list: [] },
+        isLoading,
+        isSuccess,
+        isError,
+        error
+    } = useGetRequestsQuery();
 
-    // let table;
+    console.log(reqs)
 
-    // if (isLoading) {
-    //     table = <Spin />
-    // } else if (isSuccess) {
-    //     table = <Table dataSource={paginatedData(orgs)} columns={columns} pagination={false} />
-    // } else if (isError) {
-    //     console.log(error)
-    //     table = <div>{error.toString()}</div>
-    // }
+    let table;
 
-    // useEffect(() => {
-    //     if (isSuccess) {
+    if (isLoading) {
+        table = <Spin />;
+    } else if (isSuccess) {
+        table = <Table 
+            dataSource={paginatedData(reqs.list)} 
+            columns={columns} 
+            pagination={false}
+        />;
+    } else if (isError) {
+        console.log(error);
+        table = <div>{error.toString()}</div>;
+    }
 
-    //     }
-    // }, [isSuccess, orgs]);
+    useEffect(() => {
+        if (isSuccess) {
+            dispatch(setTotalReqNumber(reqs.list.length));
+        }
+    }, [isSuccess, reqs, dispatch]);
 
     return (
         <div className="container">
             <div className="filter">
                 <div className="fields">
                     <div className="dates">
-                        <DatePicker defaultValue={dayjs('2023/09/24', dateFormat)} format={dateFormat} style={{marginRight: 14}}/>
+                        <DatePicker defaultValue={dayjs('2023/09/24', dateFormat)} format={dateFormat} style={{ marginRight: 14 }} />
                         <DatePicker defaultValue={dayjs('2023/09/24', dateFormat)} format={dateFormat} />
                     </div>
                     <div className="category">
-                        <Select placeholder="Не выбрано" style={{width: 270}} options={[]} />
+                        <Select placeholder="Не выбрано" style={{ width: 270 }} options={[]} />
                     </div>
                 </div>
 
                 <Button type='primary'>Применить</Button>
             </div>
             <div className="data">
-                <Table dataSource={rows} columns={columns} pagination={false} />
+                {table}
             </div>
             <div className="pagination_container">
-                <Pagination current={1} defaultCurrent={1} pageSize={1} total={10} onChange={handlePaginationChange} />
+                <Pagination
+                    current={currentPage}
+                    defaultCurrent={1}
+                    pageSize={REQ_NUMBER_PER_PAGE}
+                    total={totalReqNumber}
+                    onChange={handlePaginationChange}
+                />
             </div>
         </div>
     );
 };
 
-export default RequestPage
+export default RequestPage;
\ No newline at end of file

src/store/store.ts

@@ -3,6 +3,7 @@ import { apiSlice } from '../features/api/apiSlice';
 import mainPaginationReducer from '../features/pagination/mainPagination';
 import storage from 'redux-persist/lib/storage';
 import { persistReducer, persistStore } from 'redux-persist';
+import reqPaginationReducer from '../features/pagination/reqPagination';
 interface AuthState {
     token: string | null;
 }
@@ -37,6 +38,7 @@ const store: Store = configureStore({
     reducer: {
         auth: persistedReducer,
         mainPagination: mainPaginationReducer,
+        reqPagination: reqPaginationReducer,
         [apiSlice.reducerPath]: apiSlice.reducer,
     },
     middleware: (getDefaultMiddleware) =>