lxh2875931338/frpc-console
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 5 Wiki Activity

优化frpc.toml导出逻辑，从前端依赖库改为自建设计

Browse Source
This commit is contained in:
不安的亡命樱
2026-07-23 21:26:08 +08:00
parent 9675420604
commit 892fc98be2
7 changed files with 705 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/index.html
+39 -38
View File
@@ -10,8 +10,8 @@
<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
<!-- Naive UI CDN -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/naive-ui@2/dist/styles.css" />
<!-- TOML 解析库（用于导入/导出） -->
<script src="https://cdn.jsdelivr.net/npm/@iarna/toml@3.0.0/dist/toml.min.js"></script>
<!-- 不再需要前端 TOML 库，已改用后端导出 -->
<!--<script src="https://cdn.jsdelivr.net/npm/@iarna/toml@3.0.0/dist/toml.min.js"></script>-->
<!-- 自定义样式 -->
<link rel="stylesheet" href="/static/style-1.css" />
<link rel="stylesheet" href="/static/style-2.css" />
@@ -188,7 +188,8 @@
<button class="icon-btn" @click="openEditDialog(p)">
✎
</button>
<button class="icon-btn danger" @click="deleteProxy(p.id)">
<button class="icon-btn danger"
@click="(function(){ console.log('点击了删除按钮, id:', p.id); removeProxy(p.id); })()">
✕
</button>
</div>
@@ -211,44 +212,44 @@
</div>
<!-- ====== 新增/编辑弹窗 ====== -->
<Transition name="dialog">
<div v-if="dialogVisible" class="dialog-overlay" @click.self="dialogVisible = false">
<div class="dialog-card">
<h3>{{ dialogMode === 'add' ? '新增隧道' : '编辑隧道' }}</h3>
<div class="dialog-form">
<div class="form-row">
<label>名称</label>
<input v-model="dialogForm.name" />
<Transition name="dialog">
<div v-if="dialogVisible" class="dialog-overlay" @click.self="dialogVisible = false">
<div class="dialog-card">
<h3>{{ dialogMode === 'add' ? '新增隧道' : '编辑隧道' }}</h3>
<div class="dialog-form">
<div class="form-row">
<label>名称</label>
<input v-model="dialogForm.name" />
</div>
<div class="form-row">
<label>类型</label>
<select v-model="dialogForm.type">
<option value="tcp">tcp</option>
<option value="udp">udp</option>
<option value="http">http</option>
<option value="https">https</option>
</select>
</div>
<div class="form-row">
<label>本地 IP</label>
<input v-model="dialogForm.localIP" />
</div>
<div class="form-row">
<label>本地端口</label>
<input type="number" v-model="dialogForm.localPort" />
</div>
<div class="form-row">
<label>远程端口</label>
<input type="number" v-model="dialogForm.remotePort" />
</div>
</div>
<div class="form-row">
<label>类型</label>
<select v-model="dialogForm.type">
<option value="tcp">tcp</option>
<option value="udp">udp</option>
<option value="http">http</option>
<option value="https">https</option>
</select>
</div>
<div class="form-row">
<label>本地 IP</label>
<input v-model="dialogForm.localIP" />
</div>
<div class="form-row">
<label>本地端口</label>
<input type="number" v-model="dialogForm.localPort" />
</div>
<div class="form-row">
<label>远程端口</label>
<input type="number" v-model="dialogForm.remotePort" />
<div class="dialog-actions">
<button class="btn-cancel" @click="dialogVisible = false">
取消
</button>
<button class="btn-confirm" @click="confirmDialog">确认</button>
</div>
</div>
<div class="dialog-actions">
<button class="btn-cancel" @click="dialogVisible = false">
取消
</button>
<button class="btn-confirm" @click="confirmDialog">确认</button>
</div>
</div>
</Transition>
<!-- ====== 隐藏的文件输入（导入 TOML） ====== -->