diff --git a/FRONT/DEV/src/api/request.ts b/FRONT/DEV/src/api/request.ts index b0568fc..ac1490c 100644 --- a/FRONT/DEV/src/api/request.ts +++ b/FRONT/DEV/src/api/request.ts @@ -95,7 +95,35 @@ export class NetworkService { static async scanWifi(ipAddress: string): Promise { try { const axiosInstance = this.createAxiosInstance(ipAddress); - return await axiosInstance.get('/subnet/user'); + return await axiosInstance.get('/subnet/wifi'); + } catch (error: any) { + return error.response; + } + } + static async addNote(ipAddress: string, mac:string, note: string): Promise { + try { + const axiosInstance = this.createAxiosInstance(ipAddress); + return await axiosInstance.post(`/subnet/devices/${mac}/note`, { + note: note + }); + } catch (error: any) { + return error.response; + } + } + static async editNote(ipAddress: string, mac:string, note: string): Promise { + try { + const axiosInstance = this.createAxiosInstance(ipAddress); + return await axiosInstance.put(`/subnet/devices/${mac}/note`, { + note: note + }); + } catch (error: any) { + return error.response; + } + } + static async deleteNote(ipAddress: string, mac:string): Promise { + try { + const axiosInstance = this.createAxiosInstance(ipAddress); + return await axiosInstance.delete(`/subnet/devices/${mac}/note`); } catch (error: any) { return error.response; } diff --git a/FRONT/DEV/src/components/UI/Dropdown/DeviceCard.tsx b/FRONT/DEV/src/components/UI/Dropdown/DeviceCard.tsx index 79328b2..5467dd8 100644 --- a/FRONT/DEV/src/components/UI/Dropdown/DeviceCard.tsx +++ b/FRONT/DEV/src/components/UI/Dropdown/DeviceCard.tsx @@ -1,6 +1,10 @@ -import React from 'react'; +import React, {useState} from 'react'; import styled, { css } from 'styled-components'; import { DeviceUser } from "../../../store/useDeviceStore"; +import {buttonNames} from "../../../const/buttons/names"; +import {ModalMap} from "../../modalwindows/windowsType"; +import {IconComponent} from "../../../const/buttons/icons"; +import {useModalContext} from "../../../store"; interface DeviceCardProps { device: DeviceUser; @@ -24,7 +28,7 @@ const CardWrapper = styled.div<{ status: 'online' | 'offline' }>` const CardHeader = styled.div<{ status: 'online' | 'offline' }>` background: ${({ status, theme }) => - status === 'online' ? theme.successColor : theme.errorColor}; + status === 'online' ? theme.successColor : theme.offlineColor}; color: white; padding: 16px; font-size: 18px; @@ -67,9 +71,19 @@ const Value = styled.span` color: #333; `; + const DeviceCard: React.FC = ({ device, status }) => { - const [isExpanded, setIsExpanded] = React.useState(false); + const [isExpanded, setIsExpanded] = useState(false); const toggleExpanded = () => setIsExpanded(!isExpanded); + const { openModal } = useModalContext(); + + const openModalNote = (e: React.MouseEvent) => { + e.stopPropagation(); + openModal(ModalMap['6'], { + mac: device.mac, + currentNote: device.note || '' + }); + }; return ( @@ -78,6 +92,9 @@ const DeviceCard: React.FC = ({ device, status }) => {

MAC: {device.mac}

+ + + @@ -107,6 +124,11 @@ const DeviceCard: React.FC = ({ device, status }) => { {device.last_seen} + + + + {device.note || '-'} + ); diff --git a/FRONT/DEV/src/components/UI/Dropdown/DropdownType.tsx b/FRONT/DEV/src/components/UI/Dropdown/DropdownType.tsx index 180684a..d1e90c5 100644 --- a/FRONT/DEV/src/components/UI/Dropdown/DropdownType.tsx +++ b/FRONT/DEV/src/components/UI/Dropdown/DropdownType.tsx @@ -68,6 +68,7 @@ const DropdownRow = styled.button` font-size: 16px; border: none; width: 100%; + color: ${({theme}) => theme.textColor}; transition: all .3s ease; cursor: pointer; diff --git a/FRONT/DEV/src/components/UI/buttons/mainButton.tsx b/FRONT/DEV/src/components/UI/buttons/mainButton.tsx index 0afe0a2..55ca7e3 100644 --- a/FRONT/DEV/src/components/UI/buttons/mainButton.tsx +++ b/FRONT/DEV/src/components/UI/buttons/mainButton.tsx @@ -9,15 +9,15 @@ const Button = styled.button.withConfig({ border: none; padding: ${(props) => props.size === "small" - ? "4px 8px" + ? "10px 28px" : props.size === "big" ? "10px 20px" - : "6px 10px"}; // По умолчанию + : "12px 20px"}; // По умолчанию border-radius: 8px; color: white; font-size: ${(props) => props.size === "small" - ? "12px" + ? "14px" : props.size === "big" ? "16px" : "14px"}; // По умолчанию @@ -30,7 +30,7 @@ const Button = styled.button.withConfig({ ? 'row-reverse' : 'row'}; gap: 10px; - + transition: all .3s ease; &:hover{ background-color: ${(props) => props.$hoverсolor}; } diff --git a/FRONT/DEV/src/components/UI/inputs/input.tsx b/FRONT/DEV/src/components/UI/inputs/input.tsx index 0fac915..4c8c5fc 100644 --- a/FRONT/DEV/src/components/UI/inputs/input.tsx +++ b/FRONT/DEV/src/components/UI/inputs/input.tsx @@ -5,7 +5,7 @@ type Props = { placeholderText: string; id: string; value?: string; - onChange?: (identifier: string, value: string) => void; + onChange?: (value: string) => void; onFileChange?: (event: React.ChangeEvent) => void; type?: string; multiple?: boolean; @@ -24,7 +24,7 @@ const InputContainer = styled.div` `; const StyledInput = styled.input` - padding: 8px 10px; + padding: 12px 10px; color: black; border-radius: 8px; border: 1px solid #A1A1A1; @@ -41,7 +41,7 @@ const Input = React.forwardRef(({ placeholderText, id, const handleInputChange = (e: React.ChangeEvent) => { const { value } = e.target; if (onChange) { - onChange(id, value); + onChange(value); } }; diff --git a/FRONT/DEV/src/components/UI/tables/TableScanner.tsx b/FRONT/DEV/src/components/UI/tables/TableScanner.tsx index 569e295..0adc730 100644 --- a/FRONT/DEV/src/components/UI/tables/TableScanner.tsx +++ b/FRONT/DEV/src/components/UI/tables/TableScanner.tsx @@ -5,6 +5,10 @@ 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"; const TableContainer = styled.div` width: 100%; @@ -48,12 +52,21 @@ const TableCell = styled.td` const StatusBadge = styled.span<{ status:string }>` width: 10px; height: 30px; - background-color: ${({theme, status}) => (status==='online' ? theme.successColor : theme.errorColor)}; + background-color: ${({theme, status}) => (status==='online' ? theme.successColor : theme.offlineColor)}; display: inline-block; border-radius:4px; ` const TableScanner = ({devices}:TableScannerProps) => { + const { openModal } = useModalContext(); + + const openModalNote = (e: React.MouseEvent, device:DeviceUser ) => { + e.stopPropagation(); + openModal(ModalMap['6'], { + mac: device.mac, + currentNote: device.note || '' + }); + }; return ( @@ -66,6 +79,8 @@ const TableScanner = ({devices}:TableScannerProps) => { IP адрес Открытые порты Последняя активность + Заметка + @@ -77,6 +92,12 @@ const TableScanner = ({devices}:TableScannerProps) => { {item.ip} {item.open_ports.join(', ') || '-'} {item.last_seen} + {item.note || '-'} + + openModalNote(e, item)}> + + + ))} diff --git a/FRONT/DEV/src/components/modalwindows/modalContainers/NoteDevice.tsx b/FRONT/DEV/src/components/modalwindows/modalContainers/NoteDevice.tsx new file mode 100644 index 0000000..897e3f1 --- /dev/null +++ b/FRONT/DEV/src/components/modalwindows/modalContainers/NoteDevice.tsx @@ -0,0 +1,81 @@ +// components/modalContainers/NoteDevice.tsx +import { ModalContainer, ModalTitle, ModalContent, ButtonContainer } from "../style"; +import { MainButton } from "../../UI/buttons/mainButton"; +import Input from "../../UI/inputs/input"; +import { useState } from "react"; +import {useIpStore} from "../../../store"; +import {NetworkService} from "../../../api/request"; +import useNetworkStore from "../../../store/useDeviceStore"; + +interface Props { + mac: string; + onClose: () => void; + currentNote?: string; +} + + + +export const NoteDevice = ({ mac, onClose, currentNote}: Props) => { + const [note, setNote] = useState(currentNote || ''); + const { ipAddress } = useIpStore(); + const { devices, setDevices } = useNetworkStore(); + + const handleSave = async () => { + try { + if (!currentNote && note.trim() !== '') { + await NetworkService.addNote(ipAddress, mac, note); + }else if (currentNote && note.trim() !== '' && note !== currentNote) { + await NetworkService.editNote(ipAddress, mac, note); + }else if (currentNote && note.trim() === '') { + await NetworkService.deleteNote(ipAddress, mac); + }else { + onClose(); + return; + } + + const updatedDevices = devices.map(device => + device.mac === mac + ? { ...device, note: note.trim() } + : device + ); + setDevices(updatedDevices); + onClose(); + + } catch (error) { + console.error('Error saving note:', error); + } + }; + + return ( + + +

{currentNote ? 'Редактирование заметки' : 'Добавление заметки'}

+ + + + setNote(value)} + /> + + + + + + + + ); +}; \ No newline at end of file diff --git a/FRONT/DEV/src/components/modalwindows/modalWindow.tsx b/FRONT/DEV/src/components/modalwindows/modalWindow.tsx index ca04701..9915cfa 100644 --- a/FRONT/DEV/src/components/modalwindows/modalWindow.tsx +++ b/FRONT/DEV/src/components/modalwindows/modalWindow.tsx @@ -3,6 +3,7 @@ import { IpConfirm, ConnectionError, AddDevice, RightsConfirm } from "./modalCon import { ModalMap } from "./windowsType"; import Loader from "../UI/loader"; import { ModalWindow } from "./style"; +import {NoteDevice} from "./modalContainers/NoteDevice"; type Props = { isOpen: boolean, @@ -35,6 +36,13 @@ export default function WindowComponent({ isOpen, type, data }: Props) { message={data.message} /> } + {type === ModalMap['6'] && ( + + )} {type === ModalMap['4'] && ( diff --git a/FRONT/DEV/src/components/modalwindows/style.ts b/FRONT/DEV/src/components/modalwindows/style.ts index bbbeb26..71c52f1 100644 --- a/FRONT/DEV/src/components/modalwindows/style.ts +++ b/FRONT/DEV/src/components/modalwindows/style.ts @@ -24,7 +24,7 @@ export const ModalContainer = styled.div<{height?: string}>` flex-direction: column; justify-content: space-between; gap: 15px; - height: ${(props) => props.height ? props.height : '200px'}; + height: ${(props) => props.height ? props.height : '230px'}; width: 520px; ` diff --git a/FRONT/DEV/src/components/modalwindows/windowsType.ts b/FRONT/DEV/src/components/modalwindows/windowsType.ts index 4582266..6340fe8 100644 --- a/FRONT/DEV/src/components/modalwindows/windowsType.ts +++ b/FRONT/DEV/src/components/modalwindows/windowsType.ts @@ -5,5 +5,6 @@ export const ModalMap: ModalType = { '2': 'loader', '3': 'connectionError', '4': 'addDevice', - '5': 'sudo' + '5': 'sudo', + '6': 'noteDevice', } diff --git a/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx b/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx index 6215b08..1075a09 100644 --- a/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx +++ b/FRONT/DEV/src/components/workSpace/modules/appModules/usersScanner/modules/ListUsers.tsx @@ -25,8 +25,6 @@ interface ListUsersProps { } const ListUsers = ({loading, handleScan, devices, scanInitiated}: ListUsersProps) => { - - // Фильтр по статусу const activeDevices = devices.filter(device => device.status === 'online'); const inactiveDevices = devices.filter(device => device.status !== 'online'); @@ -55,7 +53,7 @@ const ListUsers = ({loading, handleScan, devices, scanInitiated}: ListUsersProps {/* Колонка неактивных устройств */}
-

Неактивные устройства ({inactiveDevices.length})

+

Неактивные устройства ({inactiveDevices.length})

{inactiveDevices.map((device, index) => ( ` @@ -60,8 +65,8 @@ const TitleWrapper = styled.h2` left: 50%; transform: translateX(-50%); font-size: 32px; + width: max-content; ` - const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` width: 60px; height: 60px; @@ -77,11 +82,11 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` left: 50%; transform: translate(-50%, -50%); border-radius: 50%; - &.center{ + &.center { width: 60px; height: 60px; - - } + animation: ${({ loading }) => (loading ? pulse : "none")} 2s ease infinite; + } &.ring1 { opacity: 0.12; width: 250px; @@ -94,6 +99,7 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` width: 400px; height: 400px; animation: ${({ loading }) => (loading ? ring2 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.1s" : "0")}; } &.ring3 { @@ -101,9 +107,9 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` width: 550px; height: 550px; animation: ${({ loading }) => (loading ? ring3 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.2s" : "0")}; } } - `; const LoadingText = styled.div` diff --git a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx index 6af3ff7..7225666 100644 --- a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx +++ b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/WifiScanner.tsx @@ -15,27 +15,30 @@ type Option ={ // Анимации const ring1 = keyframes` - 0% { width: 250px; height: 250px; } - 50% { width: 280px; height: 280px; } - 100% { width: 250px; height: 250px; } + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.12; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.2; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.12; } `; - const ring2 = keyframes` - 0% { width: 400px; height: 400px; } - 50% { width: 430px; height: 430px; } - 100% { width: 400px; height: 400px; } + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.08; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.15; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.08; } `; - const ring3 = keyframes` - 0% { width: 550px; height: 550px; } - 50% { width: 580px; height: 580px; } - 100% { width: 550px; height: 550px; } + 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.04; } + 50% { transform: translate(-50%, -50%) scale(1.1); opacity: 0.1; } + 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.04; } `; const dotAnimation = keyframes` - 0% { content: '.'; } - 33% { content: '..'; } - 66% { content: '...'; } - 100% { content: '.'; } + 0% { content: '.'; } + 33% { content: '..'; } + 66% { content: '...'; } + 100% { content: '.'; } +`; +const pulse = keyframes` + 0% { transform: translate(-50%, -50%) scale(1); } + 50% { transform: translate(-50%, -50%) scale(1.1); } + 100% { transform: translate(-50%, -50%) scale(1); } `; // Стили @@ -43,7 +46,7 @@ const Wrapper = styled.div<{ scanInitiated: boolean, loading: boolean}>` display: flex; flex-direction: column; align-items: center; - justify-content:${({scanInitiated, loading})=>(scanInitiated && !loading ? 'start' : 'center')}; + justify-content:center ; height: 100%; width: 100%; position: relative; @@ -68,8 +71,8 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` height: 60px; border-radius: 50%; position: relative; - transition: .4s ease; - transform: ${({scanInitiated,loading})=>(scanInitiated && !loading ? 'scale(0)' : 'scale(1)')}; + transition: .4s ease; + transform: scale(1); span { position: absolute; display: inline-block; @@ -78,11 +81,11 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` left: 50%; transform: translate(-50%, -50%); border-radius: 50%; - &.center{ + &.center { width: 60px; height: 60px; - - } + animation: ${({ loading }) => (loading ? pulse : "none")} 2s ease infinite; + } &.ring1 { opacity: 0.12; width: 250px; @@ -95,6 +98,7 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` width: 400px; height: 400px; animation: ${({ loading }) => (loading ? ring2 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.1s" : "0")}; } &.ring3 { @@ -102,11 +106,12 @@ const UserLocate = styled.div<{ loading: boolean, scanInitiated: boolean }>` width: 550px; height: 550px; animation: ${({ loading }) => (loading ? ring3 : "none")} 4s linear infinite; + animation-delay: ${({ loading }) => (loading ? "0.2s" : "0")}; } } - `; + const LoadingText = styled.div` position: relative; padding: 14px 22px; @@ -122,7 +127,7 @@ const ScanningText = styled.span` animation: ${dotAnimation} 1.5s infinite; } `; -const ScanBtn = styled.button<{loading: boolean}>` +const ScanBtn = styled.button<{scanInitiated: boolean}>` position: relative; padding: 14px 22px; background-color: #4CAF50; @@ -130,80 +135,46 @@ const ScanBtn = styled.button<{loading: boolean}>` border: none; border-radius: 12px; font-size: 18px; - transition: .4s ease; - transform: ${({loading}) => (!loading ? "translateY(240px)" : "translateY(0)")}; + transition: transform .4s ease; + transform: ${({scanInitiated}) => (scanInitiated ? "translateY(240px)" : "translateY(0)")}; &:hover{ - transform: ${({loading}) => (!loading ? "translateY(240px)" : "translateY(0)")} scale(1.03); + transform: ${({scanInitiated}) => (scanInitiated ? "translateY(240px)" : "translateY(0)")} scale(1.03); } ` -const data = [ - { - ssid: "Huawei", - bssid: "wef", - channel: 0, - signal:2, - encryption: "wef", - frequency: "ewf", - vendor: "striwefwng", - hidden: false - }, - { - ssid: "Gu-2", - bssid: "grgerger", - channel: 0, - signal: 2, - encryption: "weergref", - frequency: "eergewf", - vendor: "grgregerge", - hidden: false - }, - { - ssid: "Huawei_wifi2", - bssid: "wqdqw", - channel: 2, - signal: 3, - encryption: "wefwe", - frequency: "wef", - vendor: "fwefw", - hidden: false - }, -]; - export function WifiScanner() { - const {ipAddress} = useIpStore(); + const ipAddress = '192.168.1.147'; const [loading, setLoading] = useState(false); const [scanInitiated, setScanInitiated] = useState(false); const {wifiNetworks, setWifiNetworks} = useNetworkStore(); const [currentNetwork, setCurrentNetwork] = useState(null); - const handleScan = async () => { - try { + const handleScan = async () => { + setWifiNetworks([]); setLoading(true); setScanInitiated(true); - const res = await NetworkService.scanWifi(ipAddress); - const networks = res.data.access_points || []; - setWifiNetworks(networks); - } catch (err) { - console.error("Ошибка сканирования сети:", err); - setWifiNetworks([]); - } finally { - setLoading(false); - } - }; + try { + const res = await NetworkService.scanWifi(ipAddress); + const networks = res.data.access_points || []; + setWifiNetworks(networks); + } catch (err) { + console.error("Ошибка сканирования сети:", err); + setWifiNetworks([]); + } finally { + setLoading(false); + } + }; return ( - {(!scanInitiated || loading) && ( - Сканирование Wi-Fi сети - )} + Сканирование Wi-Fi сети - {data.map((network) => ( + {wifiNetworks.map((network) => ( ) : ( - + {wifiNetworks.length > 0 ? 'Обновить список' : 'Сканировать сеть'} )} diff --git a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/ModalWifiScaner.tsx b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/ModalWifiScaner.tsx index 0efdd8d..5af3e8d 100644 --- a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/ModalWifiScaner.tsx +++ b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/ModalWifiScaner.tsx @@ -25,7 +25,7 @@ const CloseBtn = styled.div` top: -20px; right: -20px; cursor: pointer; - background-color: white; + background-color: ${(props) => props.theme.primary}; border-radius: 50%; display: flex; justify-content: center; @@ -37,7 +37,7 @@ const CloseBtn = styled.div` visibility: visible; &:hover { - background-color: #d6d6d6; + background-color: ${(props) => props.theme.hoverBtn}; } ` const ModalTitle = styled.div` @@ -100,9 +100,9 @@ const ModalWifiScaner = ({ network,onClose }: { network: WifiNetworkScanner, onC

{network.ssid}

- = 1} /> - = 2} /> - = 3} /> + = -120} /> + = -70} /> + = -50} /> diff --git a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/WifiDot.tsx b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/WifiDot.tsx index 1a885c8..55223e2 100644 --- a/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/WifiDot.tsx +++ b/FRONT/DEV/src/components/workSpace/modules/appModules/wifiScanner/modules/WifiDot.tsx @@ -46,15 +46,24 @@ const WifiDot = ({ network, onSelect }: { network: WifiNetworkScanner, onSelect: }; const getPosition = (signal: number, bssid: string) => { - const strength = Math.min(3, Math.max(1, signal)); + let strength: 1 | 2 | 3; + if (signal >= -50) { + strength = 3; + } else if (signal >= -70) { + strength = 2; + } else if (signal >= -90) { + strength = 1; + } else { + strength = 1; + } const ringSizes = { 1: 550, 2: 400, 3: 250 }; - const ringSize = ringSizes[strength as 1 | 2 | 3]; + const ringSize = ringSizes[strength]; const offset = getPositionInRing(bssid, ringSize); return { top: `calc(50% - ${offset.y}px)`, left: `calc(50% - ${offset.x}px)` - } + }; }; const position = getPosition(network.signal, network.bssid); diff --git a/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx b/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx index 63d576e..9fd05a2 100644 --- a/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx +++ b/FRONT/DEV/src/components/workSpace/sideBar/toolBar/toolBar.tsx @@ -57,7 +57,7 @@ export const ToolBar = () => { diff --git a/FRONT/DEV/src/const/buttons/icons.tsx b/FRONT/DEV/src/const/buttons/icons.tsx index 56039b1..fdc2578 100644 --- a/FRONT/DEV/src/const/buttons/icons.tsx +++ b/FRONT/DEV/src/const/buttons/icons.tsx @@ -17,6 +17,7 @@ import admin from '@iconify/icons-ic/baseline-admin-panel-settings'; import noAdmin from '@iconify/icons-ic/baseline-remove-moderator' import refresh from '@iconify/icons-ic/baseline-refresh'; import close from '@iconify/icons-ic/round-close'; +import wifiFind from '@iconify/icons-ic/baseline-wifi-find'; export const ICONS = { [buttonNames[1]]: exitToApp, @@ -33,6 +34,7 @@ export const ICONS = { [buttonNames[12]]: close, [buttonNames[13]]: noAdmin, [buttonNames[14]]: userSearch, + [buttonNames[15]]: wifiFind, } as const; type IconName = keyof typeof ICONS; diff --git a/FRONT/DEV/src/const/buttons/names.ts b/FRONT/DEV/src/const/buttons/names.ts index a73b63a..0b4b45d 100644 --- a/FRONT/DEV/src/const/buttons/names.ts +++ b/FRONT/DEV/src/const/buttons/names.ts @@ -14,5 +14,6 @@ export const buttonNames: names ={ 11: 'reset', 12: 'close', 13: 'noAdmin', - 14: 'userSearch' + 14: 'userSearch', + 15: 'wifiFind', } \ No newline at end of file diff --git a/FRONT/DEV/src/const/theme/theme.ts b/FRONT/DEV/src/const/theme/theme.ts index f3aa5dc..aab3658 100644 --- a/FRONT/DEV/src/const/theme/theme.ts +++ b/FRONT/DEV/src/const/theme/theme.ts @@ -11,7 +11,10 @@ export const light = { secondary: '#EDEDED', background: '#E8E8E8', textColor: '#000000', + borderColor: '#404040', scannerColor: '#007ACC', + offlineColor: '#ababab', + hoverBtn: '#d6d6d6', }; export const dark = { @@ -20,5 +23,8 @@ export const dark = { secondary: '#252525', background: '#3A3A3A', textColor: '#FFFFFF', + borderColor: '#b6b6b6', scannerColor: '#0E9C9D', + offlineColor: '#656565', + hoverBtn: '#4a4a4a', }; \ No newline at end of file diff --git a/FRONT/DEV/src/store/useDeviceStore.ts b/FRONT/DEV/src/store/useDeviceStore.ts index d24d7dd..2d1d729 100644 --- a/FRONT/DEV/src/store/useDeviceStore.ts +++ b/FRONT/DEV/src/store/useDeviceStore.ts @@ -8,6 +8,7 @@ export interface DeviceUser { open_ports: string[]; status: string; last_seen: string; + note: string; } export interface WifiNetworkScanner {