Добавление настроек и их функциональности

2025-07-04 15:07:41 +05:00 · 2025-07-04 15:07:41 +05:00 · ee350c1852
commit ee350c1852
parent 4257864b3d
23 changed files with 368 additions and 91 deletions
--- a/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/TableScanner.tsx
+++ b/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/TableScanner.tsx
@ -1,17 +1,21 @@
-import React, {useEffect, useState} from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import { DeviceUser } from '../../../../../../store/useDeviceStore';
-
-interface TableScannerProps {
-    devices: DeviceUser[];
-}
 import styled from 'styled-components';
 import {IconComponent} from "../../../../../../const/buttons/icons";
 import {buttonNames} from "../../../../../../const/buttons/names";
 import {ModalMap} from "../../../../../modalwindows/windowsType";
 import {useModalContext} from "../../../../../../store";
 import Pagination from "../../../../../UI/Pagination";
-import {useSettingsStore} from "../../../../../../store/settings/settingsStore";
-import {useNameSetting, usePaginateSetting} from "../../../../../../hooks/useSettings";
+import {
+    useDisabledColumns,
+    useNameSetting,
+    useOrdersColumns,
+    usePaginateSetting
+} from "../../../../../../hooks/useSettings";
+
+interface TableScannerProps {
+    devices: DeviceUser[];
+}

 const TableContainer = styled.div`
  width: 100%;
@ -67,6 +71,7 @@ const StatusBadge = styled.span<{ status:string }>`

 const TableScanner = ({devices}:TableScannerProps) => {
    const { openModal } = useModalContext();
+    const nameSetting = useNameSetting();

    const openModalNote = (e: React.MouseEvent, device:DeviceUser ) => {
        e.stopPropagation();
@ -75,7 +80,27 @@ const TableScanner = ({devices}:TableScannerProps) => {
            currentNote: device.note || ''
        });
    };
-    const nameSetting = useNameSetting();
+
+    // Применение настроек отображения
+    const ordersColumns = useOrdersColumns();
+    const disabledColumns = useDisabledColumns();
+    const columnVisibility = useMemo(() => {
+        return {
+            status: !disabledColumns.includes(ordersColumns.indexOf('Онлайн')),
+            name: !disabledColumns.includes(ordersColumns.indexOf('Имя')),
+            vendor: !disabledColumns.includes(ordersColumns.indexOf('Производитель')),
+            ip: !disabledColumns.includes(ordersColumns.indexOf('IP адрес')),
+            ports: !disabledColumns.includes(ordersColumns.indexOf('Открытые порты')),
+            activity: !disabledColumns.includes(ordersColumns.indexOf('Последняя активность')),
+            note: !disabledColumns.includes(ordersColumns.indexOf('Заметка')),
+            action: !disabledColumns.includes(ordersColumns.indexOf('Действие'))
+        };
+    }, [ordersColumns, disabledColumns]);
+    const sortedColumns = useMemo(() => {
+        return ordersColumns.filter(column =>
+            !disabledColumns.includes(ordersColumns.indexOf(column))
+        );
+    }, [ordersColumns, disabledColumns]);

    // Пагинация
    const paginateSetting = usePaginateSetting();
@ -105,32 +130,42 @@ const TableScanner = ({devices}:TableScannerProps) => {
            <TableContainer>
                <StyledTable>
                    <thead>
-                        <tr>
-                            <TableHeaderCell></TableHeaderCell>
-                            <TableHeaderCell>Имя</TableHeaderCell>
-                            <TableHeaderCell>Производитель</TableHeaderCell>
-                            <TableHeaderCell>IP адрес</TableHeaderCell>
-                            <TableHeaderCell>Открытые порты</TableHeaderCell>
-                            <TableHeaderCell>Последняя активность</TableHeaderCell>
-                            <TableHeaderCell>Заметка</TableHeaderCell>
-                            <TableHeaderCell></TableHeaderCell>
-                        </tr>
+                    <tr>
+                        {columnVisibility.status && <TableHeaderCell></TableHeaderCell>}
+                        {columnVisibility.name && <TableHeaderCell>Имя</TableHeaderCell>}
+                        {columnVisibility.vendor && <TableHeaderCell>Производитель</TableHeaderCell>}
+                        {columnVisibility.ip && <TableHeaderCell>IP адрес</TableHeaderCell>}
+                        {columnVisibility.ports && <TableHeaderCell>Открытые порты</TableHeaderCell>}
+                        {columnVisibility.activity && <TableHeaderCell>Последняя активность</TableHeaderCell>}
+                        {columnVisibility.note && <TableHeaderCell>Заметка</TableHeaderCell>}
+                        {columnVisibility.action && <TableHeaderCell></TableHeaderCell>}
+                    </tr>
                    </thead>
                    <tbody>
                    {currentDevices.map((item, i) => (
                        <TableRow key={i}>
-                            <TableCell><StatusBadge status={item.status}></StatusBadge></TableCell>
-                            <TableCell>{item.hostname || (nameSetting === 'ip' ? item.ip : 'Неизвестно')}</TableCell>
-                            <TableCell>{item.vendor}</TableCell>
-                            <TableCell>{item.ip}</TableCell>
-                            <TableCell>{item.open_ports.join(', ') || '-'}</TableCell>
-                            <TableCell>{item.last_seen}</TableCell>
-                            <TableCell>{item.note || '-'}</TableCell>
-                            <TableCell>
-                                <button onClick={(e)=>openModalNote(e, item)}>
-                                    <IconComponent name={buttonNames[16]} width="26" height="26" />
-                                </button>
-                            </TableCell>
+                            {columnVisibility.status && (
+                                <TableCell><StatusBadge status={item.status} /></TableCell>
+                            )}
+                            {columnVisibility.name && (
+                                <TableCell>
+                                    {item.hostname || (nameSetting === 'ip' ? item.ip : 'Неизвестно')}
+                                </TableCell>
+                            )}
+                            {columnVisibility.vendor && <TableCell>{item.vendor}</TableCell>}
+                            {columnVisibility.ip && <TableCell>{item.ip}</TableCell>}
+                            {columnVisibility.ports && (
+                                <TableCell>{item.open_ports.join(', ') || '-'}</TableCell>
+                            )}
+                            {columnVisibility.activity && <TableCell>{item.last_seen}</TableCell>}
+                            {columnVisibility.note && <TableCell>{item.note || '-'}</TableCell>}
+                            {columnVisibility.action && (
+                                <TableCell>
+                                    <button onClick={(e) => openModalNote(e, item)}>
+                                        <IconComponent name={buttonNames[16]} width="26" height="26" />
+                                    </button>
+                                </TableCell>
+                            )}
                        </TableRow>
                    ))}
                    </tbody>
--- a/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/userScanner.tsx
+++ b/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/userScanner.tsx
@ -144,7 +144,7 @@ export default function UserScanner() {
            }
            setScanInitiated(true);
            const res = await NetworkService.scanUser(ipAddress);
-            console.log(res);
+            console.log(res)
            setDevices(res.data.devices || []);
        } catch (err) {
            console.error("Ошибка сканирования сети:", err);
--- a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx
+++ b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx
@ -137,7 +137,7 @@ const ScanBtn = styled.button<{scanInitiated: boolean}>`

 export function WifiScanner() {
    //const { ipAddress } = useIpStore();
-    const ipAddress = '192.168.1.147'
+    const ipAddress = '192.168.1.148'
    const [loading, setLoading] = useState(false);
    const [scanInitiated, setScanInitiated] = useState(false);
    const { wifiNetworks, setWifiNetworks } = useNetworkStore();
--- a/FRONT/DEV/src/components/workSpace/modules/workModules/networkInterfaces.tsx
+++ b/FRONT/DEV/src/components/workSpace/modules/workModules/networkInterfaces.tsx
@ -76,7 +76,7 @@ export const NetworkInterfaces = ({ startConnection, ws }: Props) => {
      setHasInited(false)
      initializationAttempt.current = 0;

-      const newSocket = new WebSocket(`wss://${ws}:8001/api/v1`);
+      const newSocket = new WebSocket(`ws://${ws}:8001/api/v1`);

      let connectionTimeout;
      setSocket(newSocket);
--- a/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx
+++ b/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx
@ -69,7 +69,7 @@ export const ToolBar = () => {
                    </IconContainer>
                </Button>

-                <ThemeButton />
+                {/*<ThemeButton />*/}

                <Button>
                    <IconContainer>
--- a/FRONT/DEV/src/components/workSpace/sideBar/toolSpace/devicesBar.tsx
+++ b/FRONT/DEV/src/components/workSpace/sideBar/toolSpace/devicesBar.tsx
@ -115,7 +115,7 @@ export const DevicesBar = () => {

    const checkWebSocketAvailability = async (ip: string): Promise<boolean> => {
        return new Promise((resolve) => {
-            const testSocket = new WebSocket(`wss://${ip}:8001/api/v1`);
+            const testSocket = new WebSocket(`ws://${ip}:8001/api/v1`);
            const timeout = setTimeout(() => {
                    testSocket.close();
                    resolve(false);