diff --git a/plugins/addon/theme_configurator/template/admin/index.html b/plugins/addon/theme_configurator/template/admin/index.html index 3e45725..2160d0e 100644 --- a/plugins/addon/theme_configurator/template/admin/index.html +++ b/plugins/addon/theme_configurator/template/admin/index.html @@ -180,32 +180,55 @@ - +
-

导航配置

-

顶部和底部导航较复杂,建议使用JSON编辑器编辑

+

顶部导航

-
- 由于导航结构包含多级嵌套,建议切换到"JSON编辑器"Tab进行编辑 -
+
+ +
+
+
+
+

底部导航

+
+
+
+
- +
-

其他配置

-

友情链接、反馈类型等其他配置项

+

友情链接

-
- 这些配置项建议使用JSON编辑器编辑,格式请参考完整JSON数据 -
+ + +
+
+
+
+

侧边浮窗

+
+
+
+ +
+
+
+
+

反馈类型

+
+
+
+
@@ -293,6 +316,15 @@ // 渲染荣誉列表 renderHonors(data.honor || []); + + // 渲染导航 + renderHeaderNav(data.header_nav || []); + renderFooterNav(data.footer_nav || []); + + // 渲染其他配置 + renderFriendlyLinks(data.friendly_link || []); + renderSides(data.side || []); + renderFeedbackTypes(data.feedback_type || []); } // 获取嵌套属性值 @@ -322,6 +354,11 @@ // 收集荣誉数据 data.honor = collectHonors(); + data.friendly_link = collectFriendlyLinks(); + data.side = collectSides(); + data.feedback_type = collectFeedbackTypes(); + data.header_nav = collectHeaderNav(); + data.footer_nav = collectFooterNav(); return data; } @@ -454,12 +491,302 @@ renderHonors(honors); }; + // ========== 友情链接 ========== + function renderFriendlyLinks(links) { + const container = document.getElementById('friendlyLinkList'); + if(!container) return; + container.innerHTML = ''; + links.forEach((link, index) => { + const item = document.createElement('div'); + item.className = 'config-item'; + item.innerHTML = ` +
+

链接 ${index + 1}

+ +
+
+
+
+ + +
+
+ + +
+
+
+ `; + container.appendChild(item); + }); + } + + function collectFriendlyLinks() { + const links = []; + document.querySelectorAll('[data-friendly]').forEach(input => { + const index = parseInt(input.dataset.friendly); + const field = input.dataset.field; + if (!links[index]) links[index] = {}; + links[index][field] = input.value; + }); + return links.filter(l => l); + } + + window.addFriendlyLink = function() { + const links = collectFriendlyLinks(); + links.push({ name: '', url: '' }); + renderFriendlyLinks(links); + }; + + window.removeFriendlyLink = function(index) { + const links = collectFriendlyLinks(); + links.splice(index, 1); + renderFriendlyLinks(links); + }; + + // ========== 侧边浮窗 ========== + function renderSides(sides) { + const container = document.getElementById('sideList'); + if(!container) return; + container.innerHTML = ''; + sides.forEach((side, index) => { + const item = document.createElement('div'); + item.className = 'config-item'; + item.innerHTML = ` +
+

浮窗 ${index + 1}

+ +
+
+
+
+ + +
+
+ +
+ + +
+
+
+ + +
+
+
+ `; + container.appendChild(item); + }); + } + + function collectSides() { + const sides = []; + document.querySelectorAll('[data-side]').forEach(input => { + const index = parseInt(input.dataset.side); + const field = input.dataset.field; + if (!sides[index]) sides[index] = {}; + sides[index][field] = input.value; + }); + return sides.filter(s => s); + } + + window.addSide = function() { + const sides = collectSides(); + sides.push({ name: '', icon: '', content: '' }); + renderSides(sides); + }; + + window.removeSide = function(index) { + const sides = collectSides(); + sides.splice(index, 1); + renderSides(sides); + }; + + // ========== 反馈类型 ========== + function renderFeedbackTypes(types) { + const container = document.getElementById('feedbackTypeList'); + if(!container) return; + container.innerHTML = ''; + types.forEach((type, index) => { + const item = document.createElement('div'); + item.className = 'config-item'; + item.innerHTML = ` +
+

类型 ${index + 1}

+ +
+
+
+
+ + +
+
+ + +
+
+ + +
+
+
+ `; + container.appendChild(item); + }); + } + + function collectFeedbackTypes() { + const types = []; + document.querySelectorAll('[data-feedback]').forEach(input => { + const index = parseInt(input.dataset.feedback); + const field = input.dataset.field; + if (!types[index]) types[index] = {}; + types[index][field] = input.value; + }); + return types.filter(t => t); + } + + window.addFeedbackType = function() { + const types = collectFeedbackTypes(); + types.push({ id: '', name: '', description: '' }); + renderFeedbackTypes(types); + }; + + window.removeFeedbackType = function(index) { + const types = collectFeedbackTypes(); + types.splice(index, 1); + renderFeedbackTypes(types); + }; + + // ========== 顶部导航(简化) ========== + function renderHeaderNav(navs) { + const container = document.getElementById('headerNavList'); + if(!container) return; + container.innerHTML = ''; + navs.forEach((nav, index) => { + const item = document.createElement('div'); + item.className = 'config-item'; + item.innerHTML = ` +
+

导航 ${index + 1}

+ +
+
+
+
+ + +
+
+ + +
+
+
子菜单请使用JSON编辑器配置
+
+
+
+ `; + container.appendChild(item); + }); + } + + function collectHeaderNav() { + const navs = []; + document.querySelectorAll('[data-hnav]').forEach(input => { + const index = parseInt(input.dataset.hnav); + const field = input.dataset.field; + if (!navs[index]) navs[index] = { children: [] }; + navs[index][field] = input.value; + }); + // 保留原有的children + const orig = config.header_nav || []; + navs.forEach((nav, i) => { + if(orig[i] && orig[i].children) { + nav.children = orig[i].children; + } + }); + return navs.filter(n => n); + } + + window.addHeaderNav = function() { + const navs = collectHeaderNav(); + navs.push({ name: '', file_address: '', children: [] }); + renderHeaderNav(navs); + }; + + window.removeHeaderNav = function(index) { + const navs = collectHeaderNav(); + navs.splice(index, 1); + renderHeaderNav(navs); + }; + + // ========== 底部导航(简化) ========== + function renderFooterNav(navs) { + const container = document.getElementById('footerNavList'); + if(!container) return; + container.innerHTML = ''; + navs.forEach((col, index) => { + const item = document.createElement('div'); + item.className = 'config-item'; + item.innerHTML = ` +
+

栏目 ${index + 1}

+ +
+
+
+ + +
+
+
链接列表请使用JSON编辑器配置
+
+
+ `; + container.appendChild(item); + }); + } + + function collectFooterNav() { + const navs = []; + document.querySelectorAll('[data-fnav]').forEach(input => { + const index = parseInt(input.dataset.fnav); + if (!navs[index]) navs[index] = { children: [] }; + navs[index][input.dataset.field] = input.value; + }); + // 保留原有的children + const orig = config.footer_nav || []; + navs.forEach((nav, i) => { + if(orig[i] && orig[i].children) { + nav.children = orig[i].children; + } + }); + return navs.filter(n => n); + } + + window.addFooterNav = function() { + const navs = collectFooterNav(); + navs.push({ name: '', children: [] }); + renderFooterNav(navs); + }; + + window.removeFooterNav = function(index) { + const navs = collectFooterNav(); + navs.splice(index, 1); + renderFooterNav(navs); + }; + + // 文件上传 document.addEventListener('click', (e) => { if (e.target.closest('.upload-btn')) { e.preventDefault(); const btn = e.target.closest('.upload-btn'); - currentUploadTarget = btn.dataset.target || btn.dataset.targetBanner || btn.dataset.targetHonor; + currentUploadTarget = btn.dataset.target || btn.dataset.targetBanner || btn.dataset.targetHonor || btn.dataset.targetSide; document.getElementById('fileInput').click(); } }); @@ -517,11 +844,16 @@ const data = collectFormData(); + console.log('保存的数据:', data); // 调试日志 + axios.post(apiBase, data, { headers: { Authorization: `Bearer ${token}` } }).then(res => { alert(res.data.msg || '保存成功'); - loadConfig(); // 重新加载 + // 使用服务器返回的数据更新config + config = res.data.data || data; + // 重新渲染界面 + fillForm(config); }).catch(err => { alert('保存失败: ' + (err.response?.data?.msg || err.message)); }).finally(() => { @@ -533,6 +865,11 @@ // 添加按钮事件 document.getElementById('addBannerBtn').addEventListener('click', addBanner); document.getElementById('addHonorBtn').addEventListener('click', addHonor); + document.getElementById('addFriendlyLinkBtn').addEventListener('click', addFriendlyLink); + document.getElementById('addSideBtn').addEventListener('click', addSide); + document.getElementById('addFeedbackTypeBtn').addEventListener('click', addFeedbackType); + document.getElementById('addHeaderNavBtn').addEventListener('click', addHeaderNav); + document.getElementById('addFooterNavBtn').addEventListener('click', addFooterNav); // JSON编辑器功能 document.getElementById('syncJsonBtn').addEventListener('click', () => { diff --git a/plugins/addon/theme_configurator/template/admin/index.html.stable b/plugins/addon/theme_configurator/template/admin/index.html.stable new file mode 100644 index 0000000..a09d98c --- /dev/null +++ b/plugins/addon/theme_configurator/template/admin/index.html.stable @@ -0,0 +1,592 @@ + + +
+ +
+ + +
+ + + + + +
+ +
+
+
+

企业信息

+

配置企业基础联系信息

+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+ +
+ + +
+
建议尺寸: 200×60 像素
+
+
+ + +
+
+ + +
+
+
+
+
+ + +
+
+
+

SEO设置

+
+
+
+
+ + +
+
+ + +
+
+ + +
+
+
+
+
+ + +
+
+
+

首页轮播

+
+
+
+ +
+
+ +
+
+

企业荣誉

+
+
+
+ +
+
+
+ + +
+
+
+

导航配置

+

顶部和底部导航较复杂,建议使用JSON编辑器编辑

+
+
+
+ 由于导航结构包含多级嵌套,建议切换到"JSON编辑器"Tab进行编辑 +
+
+
+
+ + +
+
+
+

其他配置

+

友情链接、反馈类型等其他配置项

+
+
+
+ 这些配置项建议使用JSON编辑器编辑,格式请参考完整JSON数据 +
+
+
+
+ + +
+
+
+

JSON配置编辑器

+

直接编辑完整JSON配置

+
+
+
+ 使用说明: 点击"同步"按钮将表单数据转为JSON,编辑后点击"应用"更新表单,最后点击页面顶部"保存全部配置" +
+ +
+ + + +
+
+
+
+ +
+
+ + + + + + + + \ No newline at end of file