mirror of
https://github.com/EasyTier/EasyTier.git
synced 2026-05-06 17:59:11 +00:00
refactor(gui): collapse public server and standalone into initial peer list (#2017)
The GUI exposed three networking modes: public server, manual, and standalone. In practice EasyTier does not have a server/client role distinction here. Those options only mapped to different peer bootstrap shapes, which made the product model misleading and pushed users toward a non-existent "public server" concept. This change rewrites the shared configuration UX around initial nodes. Users now add or remove one or more initial node URLs directly, and the UI explains that EasyTier networking works like plugging in a cable: once a node connects to one or more existing nodes, it can join the mesh. Initial nodes may be self-hosted or shared by others. To preserve compatibility, the frontend keeps the legacy fields and adds normalization helpers in the shared NetworkConfig layer. Old configs are read as initial_node_urls, while saves, runs, validation, config generation, and persisted GUI config sync still denormalize back into the current backend shape: zero initial nodes -> Standalone, one -> PublicServer, many -> Manual. This avoids any proto or backend API change while making old saved configs and imported TOML files load cleanly in the new UI. Code changes: - add initial_node_urls plus normalize/denormalize helpers in the shared frontend NetworkConfig model - remove the mode switch and public-server/manual specific inputs from the shared Config component and replace them with a single initial-node list plus explanatory copy - update Chinese and English locale strings for the new terminology - normalize configs received from GUI/web backends and denormalize them before outbound API calls - normalize GUI save-config events before storing them in localStorage so legacy payloads remain editable under the new model
This commit is contained in:
@@ -1,17 +1,16 @@
|
||||
<script setup lang="ts">
|
||||
import InputGroup from 'primevue/inputgroup'
|
||||
import InputGroupAddon from 'primevue/inputgroupaddon'
|
||||
import { SelectButton, Checkbox, InputText, InputNumber, AutoComplete, Panel, Divider, ToggleButton, Button, Password, Dialog } from 'primevue'
|
||||
import { Checkbox, InputText, InputNumber, AutoComplete, Panel, Divider, ToggleButton, Button, Password, Dialog } from 'primevue'
|
||||
import {
|
||||
addRow,
|
||||
DEFAULT_NETWORK_CONFIG,
|
||||
NetworkConfig,
|
||||
NetworkingMethod,
|
||||
normalizeNetworkConfig,
|
||||
removeRow
|
||||
} from '../types/network'
|
||||
import { ref, onMounted, onUnmounted } from 'vue'
|
||||
import { ref, onMounted, onUnmounted, watch } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import UrlInput from './UrlInput.vue'
|
||||
import UrlListInput from './UrlListInput.vue'
|
||||
|
||||
const props = defineProps<{
|
||||
@@ -28,12 +27,6 @@ const curNetwork = defineModel('curNetwork', {
|
||||
|
||||
const { t } = useI18n()
|
||||
|
||||
const networking_methods = ref([
|
||||
{ value: NetworkingMethod.PublicServer, label: () => t('public_server') },
|
||||
{ value: NetworkingMethod.Manual, label: () => t('manual') },
|
||||
{ value: NetworkingMethod.Standalone, label: () => t('standalone') },
|
||||
])
|
||||
|
||||
const protos: { [proto: string]: number } = {
|
||||
tcp: 11010,
|
||||
udp: 11010,
|
||||
@@ -154,6 +147,16 @@ onMounted(() => {
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
function syncNormalizedNetwork(network: NetworkConfig | undefined): void {
|
||||
if (!network) {
|
||||
return
|
||||
}
|
||||
|
||||
Object.assign(network, normalizeNetworkConfig(network))
|
||||
}
|
||||
|
||||
watch(() => curNetwork.value, syncNormalizedNetwork, { immediate: true, deep: false })
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@@ -200,15 +203,13 @@ onMounted(() => {
|
||||
|
||||
<div class="flex flex-row gap-x-9 flex-wrap">
|
||||
<div class="flex flex-col gap-2 basis-5/12 grow">
|
||||
<label for="nm">{{ t('networking_method') }}</label>
|
||||
<SelectButton v-model="curNetwork.networking_method" :options="networking_methods"
|
||||
:option-label="(v) => v.label()" option-value="value" />
|
||||
<div class="flex items-center">
|
||||
<label for="initial_nodes">{{ t('initial_nodes') }}</label>
|
||||
<span class="pi pi-question-circle ml-2 self-center" v-tooltip="t('initial_nodes_help')"></span>
|
||||
</div>
|
||||
<div class="items-center flex flex-col p-fluid gap-y-2">
|
||||
<UrlListInput v-if="curNetwork.networking_method === NetworkingMethod.Manual"
|
||||
v-model="curNetwork.peer_urls" :protos="protos" :add-label="t('add_peer_url')" />
|
||||
|
||||
<UrlInput v-if="curNetwork.networking_method === NetworkingMethod.PublicServer"
|
||||
v-model="curNetwork.public_server_url" :protos="protos" />
|
||||
<UrlListInput id="initial_nodes" v-model="curNetwork.peer_urls" :protos="protos"
|
||||
:add-label="t('add_initial_node')" :placeholder="t('initial_node_placeholder')" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -3,6 +3,14 @@ networking_method: 网络方式
|
||||
public_server: 公共服务器
|
||||
manual: 手动
|
||||
standalone: 独立
|
||||
initial_nodes: 初始节点
|
||||
initial_nodes_help: |
|
||||
EasyTier 不分服务端/客户端。
|
||||
• 填“初始节点” = 插上网线,直接加入已有网络。
|
||||
• 留空 = 节点独立启动,等别人来连,或你后续手动连。
|
||||
• 无论直接还是间接连通(通过其他节点搭桥),都能组网互通。
|
||||
初始节点可以用自己的,也可以用别人分享的。
|
||||
initial_node_placeholder: 例如:tcp://node.example.com:11010
|
||||
virtual_ipv4: 虚拟IPv4地址
|
||||
virtual_ipv4_dhcp: DHCP
|
||||
network_name: 网络名称
|
||||
@@ -26,6 +34,7 @@ error_msg: 错误信息
|
||||
detail: 详情
|
||||
add_new_network: 添加新网络
|
||||
add_peer_url: 添加节点
|
||||
add_initial_node: 添加初始节点
|
||||
add_listener_url: 添加监听地址
|
||||
add_mapped_listener: 添加监听映射
|
||||
del_cur_network: 删除当前网络
|
||||
|
||||
@@ -3,6 +3,14 @@ networking_method: Networking Method
|
||||
public_server: Public Server
|
||||
manual: Manual
|
||||
standalone: Standalone
|
||||
initial_nodes: Initial Nodes
|
||||
initial_nodes_help: |
|
||||
EasyTier does not distinguish between server and client roles.
|
||||
• Filling in Initial Nodes = plugging in the cable and joining an existing network.
|
||||
• Leaving it empty = the node starts alone until others connect to it, or you connect it later yourself.
|
||||
• Direct or indirect connectivity, including through relay nodes, can form one network.
|
||||
Initial nodes can be your own nodes or ones shared by others.
|
||||
initial_node_placeholder: "Example: tcp://node.example.com:11010"
|
||||
virtual_ipv4: Virtual IPv4
|
||||
virtual_ipv4_dhcp: DHCP
|
||||
network_name: Network Name
|
||||
@@ -26,6 +34,7 @@ error_msg: Error Message
|
||||
detail: Detail
|
||||
add_new_network: New Network
|
||||
add_peer_url: Add Peer
|
||||
add_initial_node: Add Initial Node
|
||||
add_listener_url: Add Listener
|
||||
add_mapped_listener: Add Mapped Listener
|
||||
del_cur_network: Delete Current Network
|
||||
|
||||
@@ -49,4 +49,6 @@
|
||||
|
||||
.v-popper__inner {
|
||||
white-space: pre-wrap;
|
||||
}
|
||||
max-width: 32rem;
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
@@ -97,9 +97,8 @@ export function DEFAULT_NETWORK_CONFIG(): NetworkConfig {
|
||||
network_secret: '',
|
||||
credential_file: '',
|
||||
|
||||
networking_method: NetworkingMethod.PublicServer,
|
||||
|
||||
public_server_url: 'tcp://public.easytier.top:11010',
|
||||
networking_method: NetworkingMethod.Manual,
|
||||
public_server_url: '',
|
||||
peer_urls: [],
|
||||
|
||||
proxy_cidrs: [],
|
||||
@@ -154,6 +153,39 @@ export function DEFAULT_NETWORK_CONFIG(): NetworkConfig {
|
||||
}
|
||||
}
|
||||
|
||||
function cleanPeerUrls(urls: string[] | undefined): string[] {
|
||||
return (urls ?? []).map((url) => url.trim()).filter((url) => url.length > 0)
|
||||
}
|
||||
|
||||
export function normalizeNetworkConfig(config: NetworkConfig): NetworkConfig {
|
||||
const normalized: NetworkConfig = {
|
||||
...config,
|
||||
peer_urls: cleanPeerUrls(config.peer_urls),
|
||||
}
|
||||
|
||||
const publicServerUrl = normalized.public_server_url?.trim() ?? ''
|
||||
|
||||
switch (normalized.networking_method) {
|
||||
case NetworkingMethod.PublicServer:
|
||||
normalized.peer_urls = publicServerUrl ? [publicServerUrl] : []
|
||||
break
|
||||
case NetworkingMethod.Manual:
|
||||
break
|
||||
case NetworkingMethod.Standalone:
|
||||
default:
|
||||
normalized.peer_urls = []
|
||||
break
|
||||
}
|
||||
|
||||
normalized.networking_method = NetworkingMethod.Manual
|
||||
normalized.public_server_url = ''
|
||||
return normalized
|
||||
}
|
||||
|
||||
export function toBackendNetworkConfig(config: NetworkConfig): NetworkConfig {
|
||||
return normalizeNetworkConfig(config)
|
||||
}
|
||||
|
||||
export interface NetworkInstance {
|
||||
instance_id: string
|
||||
|
||||
|
||||
Reference in New Issue
Block a user