diff --git a/package.json b/package.json
index 56979f3..542fcb6 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
"dependencies": {
"@ant-design/icons": "^5.0.1",
"@nanostores/react": "^0.4.1",
+ "@tanstack/react-query": "^4.24.9",
"@turf/bbox": "^6.5.0",
"@turf/helpers": "^6.5.0",
"@watergis/maplibre-gl-export": "^1.3.7",
diff --git a/src/App.jsx b/src/App.jsx
index e98fd69..3fc884d 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -4,17 +4,22 @@ import { LoginPage } from "./pages/Login";
import { VerifyRegistrationPage } from "./pages/VerifyRegistration";
import { RegisterPage } from "./pages/Register";
import { MapPage } from "./pages/Map";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
+
+const queryClient = new QueryClient();
function App() {
return (
-
-
- } />
- } />
- } />
- } />
-
-
+
+
+
+ } />
+ } />
+ } />
+ } />
+
+
+
);
}
diff --git a/src/modules/Table/Table.css b/src/modules/Table/Table.css
index 21019a9..80bd866 100644
--- a/src/modules/Table/Table.css
+++ b/src/modules/Table/Table.css
@@ -2,7 +2,7 @@
padding: 0 !important;
}
-.ant-table-body {
+.ant-table {
@apply max-w-[100vw];
}
diff --git a/src/modules/Table/Table.jsx b/src/modules/Table/Table.jsx
index 9ebfcac..fa272de 100644
--- a/src/modules/Table/Table.jsx
+++ b/src/modules/Table/Table.jsx
@@ -1,112 +1,82 @@
import React, { useRef } from "react";
import { Collapse, Empty, Table as AntdTable } from "antd";
import "./Table.css";
+import { useQuery } from "@tanstack/react-query";
+import { api } from "../../api";
const columns = [
- {
- title: "Категория",
- dataIndex: "category",
- key: "category",
- },
{
title: "Статус",
dataIndex: "status",
key: "status",
+ width: "120px",
+ ellipsis: true,
},
{
- title: "Прогноз",
- dataIndex: "predict",
- key: "predict",
+ title: "Категория",
+ dataIndex: "category",
+ key: "category",
+ width: "120px",
+ ellipsis: true,
},
{
- title: "Факт",
- dataIndex: "fact",
- key: "fact",
+ title: "Прогноз",
+ dataIndex: "prediction",
+ key: "prediction",
+ width: "120px",
+ ellipsis: true,
},
{
title: "Зрелость",
dataIndex: "age",
key: "age",
- },
-];
-
-const data = [
- {
- id: "1",
- category: "Жилой дом",
- status: "Работающий",
- predict: 80,
- fact: 50,
- age: 6,
- },
- {
- id: "2",
- category: "МФЦ",
- status: "Не работает",
- predict: 100,
- fact: undefined,
- age: 0,
- },
- {
- id: "3",
- category: "Библиотека",
- status: "На рассмотрении",
- predict: 80,
- fact: undefined,
- age: 0,
+ width: "120px",
+ ellipsis: true,
},
{
- id: "4",
- category: "Жилой дом",
- status: "Работающий",
- predict: 80,
- fact: 50,
- age: 6,
+ title: "План",
+ dataIndex: "plan",
+ key: "plan",
+ width: "120px",
+ ellipsis: true,
},
{
- id: "5",
- category: "МФЦ",
- status: "Не работает",
- predict: 100,
- fact: undefined,
- age: 0,
- },
- {
- id: "6",
- category: "Библиотека",
- status: "На рассмотрении",
- predict: 80,
- fact: undefined,
- age: 0,
+ title: "Факт",
+ dataIndex: "fact",
+ key: "fact",
+ width: "120px",
+ ellipsis: true,
},
{
- id: "7",
- category: "Жилой дом",
- status: "Работающий",
- predict: 80,
- fact: 50,
- age: 6,
+ title: "Дельта",
+ dataIndex: "delta",
+ key: "delta",
+ width: "120px",
+ ellipsis: true,
},
{
- id: "8",
- category: "МФЦ",
- status: "Не работает",
- predict: 100,
- fact: undefined,
- age: 0,
+ title: "АО",
+ dataIndex: "okrug",
+ key: "okrug",
+ width: "120px",
+ ellipsis: true,
},
{
- id: "9",
- category: "Библиотека",
- status: "На рассмотрении",
- predict: 80,
- fact: undefined,
- age: 0,
+ title: "Район",
+ dataIndex: "rayon",
+ key: "rayon",
+ width: "120px",
+ ellipsis: true,
},
];
export const Table = React.memo(({ height = 200 }) => {
const tableRef = useRef(null);
+ const { data } = useQuery(["table"], async () => {
+ const { data } = await api.get("/api/placement_points?page_size=20");
+
+ return data;
+ });
const SCROLL = {
y: `${height}px`,
@@ -125,7 +95,7 @@ export const Table = React.memo(({ height = 200 }) => {
locale={{ emptyText: }}
// loading={isLoading}
pagination={false}
- dataSource={data}
+ dataSource={data?.results}
columns={columns}
rowKey="id"
scroll={SCROLL}
diff --git a/yarn.lock b/yarn.lock
index a32b3c5..cf5bdd1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -534,6 +534,19 @@
"@svgr/hast-util-to-babel-ast" "^6.5.1"
svg-parser "^2.0.4"
+"@tanstack/query-core@4.24.9":
+ version "4.24.9"
+ resolved "https://registry.yarnpkg.com/@tanstack/query-core/-/query-core-4.24.9.tgz#52a5981d46f48e85630bcf5a645318e405493ce1"
+ integrity sha512-pZQ2NpdaHzx8gPPkAPh06d6zRkjfonUzILSYBXrdHDapP2eaBbGsx5L4/dMF+fyAglFzQZdDDzZgAykbM20QVw==
+
+"@tanstack/react-query@^4.24.9":
+ version "4.24.9"
+ resolved "https://registry.yarnpkg.com/@tanstack/react-query/-/react-query-4.24.9.tgz#8ec7e22dd3a858e174a90e81d20c85908f2ea653"
+ integrity sha512-6WLwUT9mrngIinRtcZjrWOUENOuLbWvQpKmU6DZCo2iPQVA+qvv3Ji90Amme4AkUyWQ8ZSSRTnAFq8V2tj2ACg==
+ dependencies:
+ "@tanstack/query-core" "4.24.9"
+ use-sync-external-store "^1.2.0"
+
"@turf/bbox@^6.5.0":
version "6.5.0"
resolved "https://registry.yarnpkg.com/@turf/bbox/-/bbox-6.5.0.tgz#bec30a744019eae420dac9ea46fb75caa44d8dc5"