From 704814f4d68e595229a58673f2aa37e80e91293b Mon Sep 17 00:00:00 2001
From: yiqiu <yiqiu@ycyaw.com>
Date: Wed, 18 Mar 2026 22:28:16 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BE=A7=E8=BE=B9=E6=B5=AE?=
 =?UTF-8?q?=E7=AA=97=E4=BB=8E=E5=9F=BA=E7=A1=80=E9=85=8D=E7=BD=AE=E7=A7=BB?=
 =?UTF-8?q?=E5=88=B0=E5=AF=BC=E8=88=AA=E9=85=8D=E7=BD=AE=20tab?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../template/admin/index_new.html             | 161 +++++++++---------
 1 file changed, 81 insertions(+), 80 deletions(-)

diff --git a/plugins/addon/theme_configurator/template/admin/index_new.html b/plugins/addon/theme_configurator/template/admin/index_new.html
index 5fb7e88..84236bf 100644
--- a/plugins/addon/theme_configurator/template/admin/index_new.html
+++ b/plugins/addon/theme_configurator/template/admin/index_new.html
@@ -93,86 +93,6 @@
         </div>
       </div>
 
-      <div class="section-card" data-title="侧边浮窗">
-        <p class="theme-tip">
-          配置前台右下角悬浮工具条。支持 4 种模块类型：QQ客服、在线客服、群聊、公众号。
-        </p>
-        <div v-if="!fullConfig.side.length" class="empty-tip">
-          还没有浮窗模块，点击下方按钮添加。
-        </div>
-        <div class="config-item" v-for="(item, index) in fullConfig.side" :key="'side-' + index">
-          <div class="config-item__header">
-            <h4>{{ {qq:'QQ客服', service:'在线客服', group:'群聊', wechat:'公众号'}[item.type] || '浮窗' }} {{ index + 1 }}</h4>
-            <t-button size="small" theme="danger" variant="outline" @click="removeSide(index)">
-              删除
-            </t-button>
-          </div>
-          <div class="form-grid">
-            <div class="form-item">
-              <label>模块类型</label>
-              <t-select v-model="item.type">
-                <t-option value="qq" label="QQ客服"></t-option>
-                <t-option value="service" label="在线客服"></t-option>
-                <t-option value="group" label="群聊"></t-option>
-                <t-option value="wechat" label="公众号"></t-option>
-              </t-select>
-            </div>
-            <div class="form-item">
-              <label>显示名称</label>
-              <t-input v-model="item.label" placeholder="如：QQ客服"></t-input>
-            </div>
-
-            <!-- QQ 客服 -->
-            <template v-if="item.type === 'qq'">
-              <div class="form-item form-item--full" v-for="(qq, qIndex) in item.items" :key="'qq-' + qIndex">
-                <label>
-                  客服 {{ qIndex + 1 }}
-                  <t-button size="small" theme="danger" variant="text" @click="item.items.splice(qIndex, 1)">删除</t-button>
-                </label>
-                <div class="form-grid">
-                  <div class="form-item">
-                    <label>QQ号</label>
-                    <t-input v-model="qq.qq" placeholder="10001"></t-input>
-                  </div>
-                  <div class="form-item">
-                    <label>在线时间</label>
-                    <t-input v-model="qq.time" placeholder="09:00 - 22:00"></t-input>
-                  </div>
-                </div>
-              </div>
-              <div class="form-item form-item--full">
-                <t-button size="small" theme="primary" variant="outline" @click="addSideQQ(item)">新增QQ客服</t-button>
-              </div>
-            </template>
-
-            <!-- 在线客服 -->
-            <template v-if="item.type === 'service'">
-              <div class="form-item form-item--full">
-                <label>客服链接地址</label>
-                <t-input v-model="item.url" placeholder="https://客服链接"></t-input>
-              </div>
-            </template>
-
-            <!-- 群聊 / 公众号 -->
-            <template v-if="item.type === 'group' || item.type === 'wechat'">
-              <div class="form-item form-item--full">
-                <label>二维码图片</label>
-                <div class="upload-row">
-                  <t-input v-model="item.qrcode" placeholder="/upload/qrcode.png"></t-input>
-                  <t-upload theme="custom" :action="uploadUrl" :headers="uploadHeaders"
-                    :format-response="uploadFormatResponse" :show-upload-progress="false" :max="1"
-                    @success="(ctx) => handleUpload(['side', index, 'qrcode'], ctx)">
-                    <t-button size="small" class="ml-10">
-                      <t-icon name="upload" size="small" /> 上传
-                    </t-button>
-                  </t-upload>
-                </div>
-              </div>
-            </template>
-          </div>
-        </div>
-        <t-button theme="primary" variant="outline" @click="addSide">新增浮窗模块</t-button>
-      </div>
 
       <div class="section-card" data-title="反馈类型">
         <p class="theme-tip">
@@ -418,6 +338,87 @@
           新增一级导航
         </t-button>
       </div>
+
+      <div class="section-card" data-title="侧边浮窗">
+        <p class="theme-tip">
+          配置前台右下角悬浮工具条。支持 4 种模块类型：QQ客服、在线客服、群聊、公众号。
+        </p>
+        <div v-if="!fullConfig.side.length" class="empty-tip">
+          还没有浮窗模块，点击下方按钮添加。
+        </div>
+        <div class="config-item" v-for="(item, index) in fullConfig.side" :key="'side-' + index">
+          <div class="config-item__header">
+            <h4>{{ {qq:'QQ客服', service:'在线客服', group:'群聊', wechat:'公众号'}[item.type] || '浮窗' }} {{ index + 1 }}</h4>
+            <t-button size="small" theme="danger" variant="outline" @click="removeSide(index)">
+              删除
+            </t-button>
+          </div>
+          <div class="form-grid">
+            <div class="form-item">
+              <label>模块类型</label>
+              <t-select v-model="item.type">
+                <t-option value="qq" label="QQ客服"></t-option>
+                <t-option value="service" label="在线客服"></t-option>
+                <t-option value="group" label="群聊"></t-option>
+                <t-option value="wechat" label="公众号"></t-option>
+              </t-select>
+            </div>
+            <div class="form-item">
+              <label>显示名称</label>
+              <t-input v-model="item.label" placeholder="如：QQ客服"></t-input>
+            </div>
+
+            <!-- QQ 客服 -->
+            <template v-if="item.type === 'qq'">
+              <div class="form-item form-item--full" v-for="(qq, qIndex) in item.items" :key="'qq-' + qIndex">
+                <label>
+                  客服 {{ qIndex + 1 }}
+                  <t-button size="small" theme="danger" variant="text" @click="item.items.splice(qIndex, 1)">删除</t-button>
+                </label>
+                <div class="form-grid">
+                  <div class="form-item">
+                    <label>QQ号</label>
+                    <t-input v-model="qq.qq" placeholder="10001"></t-input>
+                  </div>
+                  <div class="form-item">
+                    <label>在线时间</label>
+                    <t-input v-model="qq.time" placeholder="09:00 - 22:00"></t-input>
+                  </div>
+                </div>
+              </div>
+              <div class="form-item form-item--full">
+                <t-button size="small" theme="primary" variant="outline" @click="addSideQQ(item)">新增QQ客服</t-button>
+              </div>
+            </template>
+
+            <!-- 在线客服 -->
+            <template v-if="item.type === 'service'">
+              <div class="form-item form-item--full">
+                <label>客服链接地址</label>
+                <t-input v-model="item.url" placeholder="https://客服链接"></t-input>
+              </div>
+            </template>
+
+            <!-- 群聊 / 公众号 -->
+            <template v-if="item.type === 'group' || item.type === 'wechat'">
+              <div class="form-item form-item--full">
+                <label>二维码图片</label>
+                <div class="upload-row">
+                  <t-input v-model="item.qrcode" placeholder="/upload/qrcode.png"></t-input>
+                  <t-upload theme="custom" :action="uploadUrl" :headers="uploadHeaders"
+                    :format-response="uploadFormatResponse" :show-upload-progress="false" :max="1"
+                    @success="(ctx) => handleUpload(['side', index, 'qrcode'], ctx)">
+                    <t-button size="small" class="ml-10">
+                      <t-icon name="upload" size="small" /> 上传
+                    </t-button>
+                  </t-upload>
+                </div>
+              </div>
+            </template>
+          </div>
+        </div>
+        <t-button theme="primary" variant="outline" @click="addSide">新增浮窗模块</t-button>
+      </div>
     </section>
 
     <section id="footer" class="config-section" :class="{active: activeSection === 'footer'}">