From 0c2bffab5c76b39e71f2fb6cf50a5f38a6b12f25 Mon Sep 17 00:00:00 2001
From: mediabot-pt <295750538+mediabot-pt@users.noreply.github.com>
Date: Sun, 5 Jul 2026 21:21:55 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E7=AB=99=E7=82=B9=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E5=8F=B3=E4=BE=A7=E8=A1=A8=E5=8D=95=E5=8F=8C=E5=90=91=E5=90=8C?=
 =?UTF-8?q?=E6=AD=A5JSON=E7=BC=96=E8=BE=91=E5=99=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/views/Sites.vue | 57 ++++++++++++++++++++++++++++++++++-------
 1 file changed, 48 insertions(+), 9 deletions(-)

diff --git a/web/src/views/Sites.vue b/web/src/views/Sites.vue
index 430a9a8..a09247d 100644
--- a/web/src/views/Sites.vue
+++ b/web/src/views/Sites.vue
@@ -58,13 +58,30 @@
         </div>
       </div>
       <div style="flex:1;overflow:auto;min-height:0">
-        <div style="font-size:13px;font-weight:500;margin-bottom:8px">预览</div>
-        <el-form label-width="70px" label-position="left" size="small">
-          <el-form-item label="站点ID"><span style="font-weight:500">{{ preview.siteId||'-' }}</span></el-form-item>
-          <el-form-item label="名称"><span>{{ (preview.names||[]).join(' / ') }}</span></el-form-item>
-          <el-form-item label="地址"><span>{{ (preview.urls||[]).join(' / ') }}</span></el-form-item>
-          <el-form-item label="类型"><el-tag size="small">{{ preview.siteType }}</el-tag></el-form-item>
-          <el-form-item label="状态"><el-tag size="small" :type="preview.status==='active'?'success':'info'">{{ preview.status }}</el-tag></el-form-item>
+        <div style="font-size:13px;font-weight:500;margin-bottom:8px;display:flex;gap:8px;align-items:center">
+          <span>表单编辑（双向同步）</span>
+          <el-tag v-if="jsonError" type="danger" size="small">JSON解析错误</el-tag>
+        </div>
+        <el-form v-if="!jsonError" label-width="80px" label-position="left" size="small">
+          <el-form-item label="站点ID">
+            <el-input v-model="form.siteId" @input="formToJson" />
+          </el-form-item>
+          <el-form-item label="名称">
+            <el-input v-model="form.namesStr" type="textarea" :rows="2" @input="formToJson" placeholder="一行一个" />
+          </el-form-item>
+          <el-form-item label="地址">
+            <el-input v-model="form.urlsStr" type="textarea" :rows="2" @input="formToJson" placeholder="一行一个" />
+          </el-form-item>
+          <el-form-item label="类型">
+            <el-select v-model="form.siteType" @change="formToJson" style="width:100%">
+              <el-option v-for="t in ['nexusphp','mtorrent','gazelle','unit3d','unknown']" :key="t" :label="t" :value="t" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="状态">
+            <el-select v-model="form.status" @change="formToJson" style="width:100%">
+              <el-option label="活跃" value="active" /><el-option label="弃用" value="deprecated" />
+            </el-select>
+          </el-form-item>
         </el-form>
       </div>
     </div>
@@ -75,8 +92,30 @@
 import api from '../api'
 
 const loading = ref(false), saving = ref(false), pendingCount = ref(0)
-const sites = ref([]), editSiteId = ref(''), editorJson = ref('{}')
-const preview = computed(() => { try { return JSON.parse(editorJson.value) } catch { return {} } })
+const sites = ref([]), editSiteId = ref(''), editorJson = ref('{}'), jsonError = ref(false)
+const form = reactive({ siteId:'', namesStr:'', urlsStr:'', siteType:'nexusphp', status:'active' })
+let syncing = false
+
+const jsonToForm = () => {
+  try { const s = JSON.parse(editorJson.value); form.siteId = s.siteId||''; form.namesStr = (s.names||[]).join('\n'); form.urlsStr = (s.urls||[]).join('\n'); form.siteType = s.siteType||'nexusphp'; form.status = s.status||'active'; jsonError.value = false }
+  catch { jsonError.value = true }
+}
+
+const formToJson = () => {
+  if (syncing) return; syncing = true
+  jsonError.value = false
+  editorJson.value = JSON.stringify({
+    siteId: form.siteId, names: (form.namesStr||'').split('\n').map(s=>s.trim()).filter(Boolean),
+    urls: (form.urlsStr||'').split('\n').map(s=>s.trim()).filter(Boolean),
+    siteType: form.siteType, status: form.status,
+  }, null, 2)
+  nextTick(() => { syncing = false })
+}
+
+const jsonToFormDebounced = null
+watch(editorJson, () => { if (!syncing) jsonToForm() })
+
+const refresh = async () => {
 
 const refresh = async () => {
   loading.value = true