src/App.tsx

@@ -53,7 +53,7 @@ function getFirstAvailableId(ids: number[]) : number {
 }
 
 function generateNodeData(nodes : NodeData[]) : NodeData | null {
-  const hostId = getFirstAvailableId(nodes.filter(n => n.groupId == 0).map(n => n.hostId))
+  const hostId = getFirstAvailableId(nodes.map(n => n.hostId))
   if(hostId > 255) return null
   
   const privateKey = generateWireGuardPrivateKey();

src/components/NodeEditor.tsx

@@ -1,6 +1,5 @@
 import { useState, ReactNode } from 'react';
 import { NodeData, Settings } from '../types/graph';
-import { generateWireGuardPrivateKey } from '../utils/wireguardConfig'
 import './NodeEditor.css';
 
 
@@ -40,10 +39,6 @@ export default function NodeEditor({
     // onClose();
   };
 
-  const handleGenerateKey = (): void => {
-    handleInputChange('privateKey', generateWireGuardPrivateKey())
-  }
-
   return (
     <div className="node-editor-overlay">
       <div className="node-editor">
@@ -75,80 +70,21 @@ export default function NodeEditor({
           <div className="item-group">
             <input
               value={formData.privateKey || ''}
+              onChange={(e) => handleInputChange('privateKey', e.target.value)}
               readOnly
             />
-            <button className="btn-interect" onClick={handleGenerateKey}>重新生成</button>
+            <button className="btn-interect">重新生成</button>
           </div>
+
         </div>
 
         <div className="form-group">
-          <label>主机ID</label>
+          <label>侦听端口</label>
           <input
             type="number"
-            min="0" 
-            max="255" 
-            step="1"
-            value={formData.hostId}
-            onChange={(e) => handleInputChange('hostId', e.target.value)}
-            placeholder="同一子网ID下主机ID不能重复，不得超过255"
-          />
-        </div>
-
-        <div className="form-group">
-          <label>子网ID</label>
-          <input
-            type="number"
-            min="0" 
-            max="255" 
-            step="1"
-            value={formData.groupId}
-            onChange={(e) => handleInputChange('groupId', e.target.value)}
-            placeholder="不得超过255"
-          />
-        </div>
-
-        {/* host options */}
-
-        <div className="form-group">
-          <label>PostUp (可选)</label>
-          <input
-            type="text"
-            value={formData.postUp || ''}
-            onChange={(e) => handleInputChange('postUp', e.target.value)}
-          />
-        </div>
-
-        <div className="form-group">
-          <label>PostDown (可选)</label>
-          <input
-            type="text"
-            value={formData.postDown || ''}
-            onChange={(e) => handleInputChange('postDown', e.target.value)}
-          />
-        </div>
-
-        <div className="form-group">
-          <label>mtu (可选)</label>
-          <input
-            type="number"
-            min="1"
-            step="1"
-            value={formData.mtu || ''}
-            onChange={(e) => handleInputChange('mtu', e.target.value)}
-            placeholder={settings.mtu ? `默认值：${settings.mtu}` : ''}
-          />
-        </div>
-
-        <div className="form-group">
-          <label>侦听端口 (可选)</label>
-          <input
-            type="number"
-            min="1024"
-            max="49151"
-            step="1"
             value={formData.listenPort || ''}
             onChange={(e) => handleInputChange('listenPort', e.target.value)}
-            placeholder={`默认值：${settings.listenPort}`}
+            placeholder="例如: 51820"
           />
         </div>
 
@@ -158,16 +94,17 @@ export default function NodeEditor({
             type="text"
             value={formData.dnsServers || ''}
             onChange={(e) => handleInputChange('dnsServers', e.target.value)}
-            placeholder="例如: 8.8.8.8,1.1.1.1"
+            placeholder="例如: 8.8.8.8"
           />
         </div>
 
         <div className="form-group">
-          <label>备注 (可选)</label>
-          <textarea
-            rows={3}
-            value={formData.notes || ''}
-            onChange={(e) => handleInputChange('notes', e.target.value)}
+          <label>持久保活 (可选)</label>
+          <input
+            type="number"
+            value={formData.persistentKeepalive || ''}
+            onChange={(e) => handleInputChange('persistentKeepalive', e.target.value)}
+            placeholder="秒数"
           />
         </div>
 

src/types/graph.ts

@@ -4,23 +4,6 @@ export type AppNode = Node<NodeData>;
 
 export type AppEdge = Edge<EdgeData>;
 
-export interface GroupAllowRule {
-  kind: 'group'
-  allowGroup: number
-}
-
-export interface HostAllowRule {
-  kind: 'host'
-  allowHost: number
-}
-
-export interface CustomAllowRule {
-  kind: 'custom'
-  allow: string
-}
-
-export type AllowRule = GroupAllowRule | HostAllowRule | CustomAllowRule
-
 export type NodeData = {
   // basic
   label: string;
@@ -28,28 +11,27 @@ export type NodeData = {
   groupId: number;
   hostId: number;
   
-  // host options
+  // options
   postUp?: string;
   postDown?: string;
-  mtu?: number;
-  notes?: string;
-  listenPort?: number;
+  persistentKeepalive?: string;
   dnsServers?: string;
-  
-  // peer options
-  // allowRules?: AllowRule[]; 
-  // persistentKeepalive?: string; todo: 加到边上
+  disallowSubnet?: string;
+  allowIPs?: string;
+  mtu?: number;
+  listenPort?: number;
+  notes?: string;
+}
+
+export type EdgeData = {
+  isTwoWayEdge: boolean
 }
 
 export type Settings = {
   v4SubNetPrefix: [number, number];
   listenPort: number;
   
-  // options
+  // global options
   v6SubNetPrefix?: [string, string, string, string];
   mtu?: number;
-}
-
-export type EdgeData = {
-  isTwoWayEdge: boolean
 }