mirror of
https://github.com/Jerryplusy/AI-powered-switches.git
synced 2025-07-04 05:09:19 +00:00
优化页面结构*2
This commit is contained in:
parent
36ed9562d9
commit
2bca00ee10
73
src/frontend/src/libs/script/configPage/configEffect.js
Normal file
73
src/frontend/src/libs/script/configPage/configEffect.js
Normal file
@ -0,0 +1,73 @@
|
||||
const configEffect = {
|
||||
async generateRealisticConfig({ command, devices = [] }) {
|
||||
const timestamp = new Date().toLocaleString();
|
||||
let config = `! 配置生成于 ${timestamp}\n`;
|
||||
const cmd = command.toLowerCase();
|
||||
// VLAN 配置
|
||||
if (cmd.includes('vlan')) {
|
||||
const vlanIdMatch = command.match(/vlan\s*(\d+)/i);
|
||||
const vlanId = vlanIdMatch?.[1] || '10';
|
||||
const isMgmt = cmd.includes('管理') || cmd.includes('mgmt');
|
||||
config +=
|
||||
`vlan ${vlanId}\n` +
|
||||
` name ${isMgmt ? 'MGMT' : 'USER'}_VLAN\n` +
|
||||
` exit\n` +
|
||||
`interface Vlan${vlanId}\n` +
|
||||
` description ${isMgmt ? 'Management VLAN' : 'User VLAN'}\n` +
|
||||
` ip address 192.168.${vlanId}.1 255.255.255.0\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// SSH 配置
|
||||
if (cmd.includes('ssh') || cmd.includes('安全') || cmd.includes('登录')) {
|
||||
const password = Math.random().toString(36).slice(2, 10);
|
||||
config +=
|
||||
`ip ssh server\n` +
|
||||
`ip ssh version 2\n` +
|
||||
`username admin privilege 15 secret 0 ${password}\n` +
|
||||
`line vty 0 4\n` +
|
||||
` transport input ssh\n` +
|
||||
` login local\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// 端口配置
|
||||
if (cmd.includes('端口') || cmd.includes('接口') || cmd.includes('port')) {
|
||||
const portMatch = command.match(/端口\s*(\d+)/i) || command.match(/port\s*(\d+)/i);
|
||||
const port = portMatch?.[1] || '1';
|
||||
const isTrunk = cmd.includes('trunk');
|
||||
const isAccess = cmd.includes('access') || !isTrunk;
|
||||
const desc = cmd.includes('上联') || cmd.includes('uplink') ? 'Uplink_Port' : 'Access_Port';
|
||||
const vlanId = '10';
|
||||
config +=
|
||||
`interface GigabitEthernet0/${port}\n` +
|
||||
` description ${desc}\n` +
|
||||
` switchport mode ${isTrunk ? 'trunk' : 'access'}\n` +
|
||||
` ${isTrunk ? 'switchport trunk allowed vlan all' : `switchport access vlan ${vlanId}`}\n` +
|
||||
` no shutdown\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// ACL 配置
|
||||
if (cmd.includes('acl') || cmd.includes('访问控制') || cmd.includes('防火墙')) {
|
||||
let targetIP = '192.168.10.10';
|
||||
if (devices.length > 0) {
|
||||
const randomDevice = devices[Math.floor(Math.random() * devices.length)];
|
||||
targetIP = randomDevice.ip;
|
||||
}
|
||||
config +=
|
||||
`ip access-list extended PROTECT_SERVERS\n` +
|
||||
` permit tcp any host ${targetIP} eq 22\n` +
|
||||
` permit tcp any host ${targetIP} eq 80\n` +
|
||||
` deny ip any any\n` +
|
||||
` exit\n` +
|
||||
`interface Vlan10\n` +
|
||||
` ip access-group PROTECT_SERVERS in\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
|
||||
if (config.trim() === `! 配置生成于 ${timestamp}`) {
|
||||
config += '! 当前命令未识别到任何可配置项目\n';
|
||||
}
|
||||
return { config };
|
||||
},
|
||||
};
|
||||
|
||||
export default configEffect;
|
||||
@ -1,4 +1,4 @@
|
||||
const ScanEffect = {
|
||||
const scanEffect = {
|
||||
getTestDevices() {
|
||||
return [
|
||||
{ ip: '192.168.1.1', mac: '00:1A:2B:3C:4D:5E', ports: [22, 23, 161] },
|
||||
@ -21,4 +21,4 @@ const ScanEffect = {
|
||||
},
|
||||
};
|
||||
|
||||
export default ScanEffect;
|
||||
export default scanEffect;
|
||||
|
||||
@ -20,6 +20,7 @@ import ConfigTool from '@/libs/config/ConfigTool';
|
||||
import { api } from '@/services/api/api';
|
||||
import Notification from '@/libs/system/Notification';
|
||||
import Common from '@/libs/common';
|
||||
import configEffect from '@/libs/script/configPage/configEffect';
|
||||
|
||||
const testMode = ConfigTool.load().testMode;
|
||||
|
||||
@ -44,76 +45,6 @@ const ConfigPage = () => {
|
||||
setDevices(config.devices || []);
|
||||
}, []);
|
||||
|
||||
const generateRealisticConfig = (command, devices = []) => {
|
||||
const timestamp = new Date().toLocaleString();
|
||||
let config = `! 配置生成于 ${timestamp}\n`;
|
||||
const cmd = command.toLowerCase();
|
||||
// VLAN 配置
|
||||
if (cmd.includes('vlan')) {
|
||||
const vlanIdMatch = command.match(/vlan\s*(\d+)/i);
|
||||
const vlanId = vlanIdMatch?.[1] || '10';
|
||||
const isMgmt = cmd.includes('管理') || cmd.includes('mgmt');
|
||||
config +=
|
||||
`vlan ${vlanId}\n` +
|
||||
` name ${isMgmt ? 'MGMT' : 'USER'}_VLAN\n` +
|
||||
` exit\n` +
|
||||
`interface Vlan${vlanId}\n` +
|
||||
` description ${isMgmt ? 'Management VLAN' : 'User VLAN'}\n` +
|
||||
` ip address 192.168.${vlanId}.1 255.255.255.0\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// SSH 配置
|
||||
if (cmd.includes('ssh') || cmd.includes('安全') || cmd.includes('登录')) {
|
||||
const password = Math.random().toString(36).slice(2, 10);
|
||||
config +=
|
||||
`ip ssh server\n` +
|
||||
`ip ssh version 2\n` +
|
||||
`username admin privilege 15 secret 0 ${password}\n` +
|
||||
`line vty 0 4\n` +
|
||||
` transport input ssh\n` +
|
||||
` login local\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// 端口配置
|
||||
if (cmd.includes('端口') || cmd.includes('接口') || cmd.includes('port')) {
|
||||
const portMatch = command.match(/端口\s*(\d+)/i) || command.match(/port\s*(\d+)/i);
|
||||
const port = portMatch?.[1] || '1';
|
||||
const isTrunk = cmd.includes('trunk');
|
||||
const isAccess = cmd.includes('access') || !isTrunk;
|
||||
const desc = cmd.includes('上联') || cmd.includes('uplink') ? 'Uplink_Port' : 'Access_Port';
|
||||
const vlanId = '10';
|
||||
config +=
|
||||
`interface GigabitEthernet0/${port}\n` +
|
||||
` description ${desc}\n` +
|
||||
` switchport mode ${isTrunk ? 'trunk' : 'access'}\n` +
|
||||
` ${isTrunk ? 'switchport trunk allowed vlan all' : `switchport access vlan ${vlanId}`}\n` +
|
||||
` no shutdown\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
// ACL 配置
|
||||
if (cmd.includes('acl') || cmd.includes('访问控制') || cmd.includes('防火墙')) {
|
||||
let targetIP = '192.168.10.10';
|
||||
if (devices.length > 0) {
|
||||
const randomDevice = devices[Math.floor(Math.random() * devices.length)];
|
||||
targetIP = randomDevice.ip;
|
||||
}
|
||||
config +=
|
||||
`ip access-list extended PROTECT_SERVERS\n` +
|
||||
` permit tcp any host ${targetIP} eq 22\n` +
|
||||
` permit tcp any host ${targetIP} eq 80\n` +
|
||||
` deny ip any any\n` +
|
||||
` exit\n` +
|
||||
`interface Vlan10\n` +
|
||||
` ip access-group PROTECT_SERVERS in\n` +
|
||||
` exit\n`;
|
||||
}
|
||||
|
||||
if (config.trim() === `! 配置生成于 ${timestamp}`) {
|
||||
config += '! 当前命令未识别到任何可配置项目\n';
|
||||
}
|
||||
return { config };
|
||||
};
|
||||
|
||||
const handleParse = async () => {
|
||||
if (!selectedDevice || !inputText.trim()) {
|
||||
Notification.error({
|
||||
@ -127,7 +58,7 @@ const ConfigPage = () => {
|
||||
const performParse = async () => {
|
||||
if (testMode) {
|
||||
await Common.sleep(800 + Math.random() * 700);
|
||||
return generateRealisticConfig(inputText);
|
||||
return await configEffect.generateRealisticConfig(inputText);
|
||||
}
|
||||
return await api.parseCommand(inputText);
|
||||
};
|
||||
@ -136,7 +67,7 @@ const ConfigPage = () => {
|
||||
promise: performParse(),
|
||||
loading: {
|
||||
title: '正在解析配置',
|
||||
description: '正在分析您的指令...',
|
||||
description: '正在分析您的指令..',
|
||||
},
|
||||
success: {
|
||||
title: '解析完成',
|
||||
|
||||
@ -9,8 +9,8 @@ import {
|
||||
Spinner,
|
||||
Badge,
|
||||
HStack,
|
||||
Table,
|
||||
} from '@chakra-ui/react';
|
||||
import { Table } from '@chakra-ui/react';
|
||||
import DocumentTitle from '@/components/system/pages/DocumentTitle';
|
||||
import PageContainer from '@/components/system/PageContainer';
|
||||
import DashboardBackground from '@/components/system/pages/DashboardBackground';
|
||||
@ -19,7 +19,7 @@ import { api } from '@/services/api/api';
|
||||
import ConfigTool from '@/libs/config/ConfigTool';
|
||||
import Common from '@/libs/common';
|
||||
import Notification from '@/libs/system/Notification';
|
||||
import ScanEffect from '@/libs/script/scanPage/scanEffect';
|
||||
import scanEffect from '@/libs/script/scanPage/scanEffect';
|
||||
|
||||
/**
|
||||
* 网络扫描页面
|
||||
@ -36,11 +36,13 @@ const ScanPage = () => {
|
||||
const testMode = config.testMode;
|
||||
|
||||
useEffect(() => {
|
||||
ScanEffect.fetchLocalInfo({
|
||||
scanEffect
|
||||
.fetchLocalInfo({
|
||||
setLocalIp: setLocalIp,
|
||||
setSubnet: setSubnet,
|
||||
subnet: subnet,
|
||||
}).then();
|
||||
})
|
||||
.then();
|
||||
}, [subnet, Notification]);
|
||||
|
||||
const handleScan = async () => {
|
||||
@ -49,7 +51,7 @@ const ScanPage = () => {
|
||||
let scanDevices;
|
||||
if (testMode) {
|
||||
await Common.sleep(2000);
|
||||
scanDevices = ScanEffect.getTestDevices();
|
||||
scanDevices = scanEffect.getTestDevices();
|
||||
Notification.success({
|
||||
title: '扫描子网设备成功！',
|
||||
});
|
||||
@ -89,7 +91,7 @@ const ScanPage = () => {
|
||||
let scanDevices;
|
||||
if (testMode) {
|
||||
await Common.sleep(500);
|
||||
scanDevices = ScanEffect.getTestDevices();
|
||||
scanDevices = scanEffect.getTestDevices();
|
||||
Notification.success({
|
||||
title: '获取上一次扫描记录成功！',
|
||||
});
|
||||
@ -158,7 +160,7 @@ const ScanPage = () => {
|
||||
{loading && (
|
||||
<HStack>
|
||||
<Spinner />
|
||||
<Text>{'正在加载，请稍候...'}</Text>
|
||||
<Text>{'正在加载，请稍候..'}</Text>
|
||||
</HStack>
|
||||
)}
|
||||
|
||||
@ -210,7 +212,7 @@ const ScanPage = () => {
|
||||
)}
|
||||
|
||||
{!loading && devices.length === 0 && (
|
||||
<Text color={'gray.400'}>{'暂无扫描结果，请执行扫描。'}</Text>
|
||||
<Text color={'gray.400'}>{'暂无扫描结果，请执行扫描..'}</Text>
|
||||
)}
|
||||
</Box>
|
||||
</VStack>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user