duanshuwen
fbf2c772a8
- 移除所有废弃的旧首页配置模块，包括destinationHero、demand相关、HomeExperience、vehicleService等表结构与代码，新增数据库迁移删除遗留表 - 重构管理端后台布局为标准RuoYi风格，新增Sidebar、Navbar、SettingsDrawer等组件，替换旧的过渡菜单实现 - 调整移动端响应断点为768px，更新布局相关测试用例，新增布局组件测试 - 删除OperationsTools发布/重置页面，移除/tools菜单入口，清理对应的API调用与测试代码 - 重构玩法模块编辑器：替换旧的图片手动输入框为图片上传组件，移除冗余的取消按钮 - 新增线索查询offset参数支持，完善查询参数处理逻辑 - 优化rbac菜单构建逻辑，新增可见性控制参数 - 修正管家编辑器提示文案，优化系统资源编辑器表单初始化逻辑 - 清理小程序端废弃的体验推荐组件与相关测试代码 - 更新文档与种子脚本，匹配新的API契约与使用说明
75 lines
6.2 KiB
HTML
75 lines
6.2 KiB
HTML
<h2>WonderQ Admin UI · RuoYi 默认壳视觉基线</h2>
|
||
<p class="subtitle">左侧为当前布局，右侧为拟还原的 RuoYi-Vue3 默认布局。请重点观察侧栏、顶栏、页签和设置入口的空间关系。</p>
|
||
|
||
<div class="split">
|
||
<div class="mockup">
|
||
<div class="mockup-header">当前 WonderQ-Admin-UI-Vue</div>
|
||
<div class="mockup-body" style="padding:0; min-height:520px; background:#f5f7fb; font-family:Arial,'Microsoft YaHei',sans-serif; color:#1e293b;">
|
||
<div style="display:flex; min-height:520px;">
|
||
<aside style="width:244px; flex:0 0 244px; background:#fff; border-right:1px solid #e9edf3;">
|
||
<div style="height:88px; display:flex; align-items:center; gap:10px; padding:0 22px; border-bottom:1px solid #f0f2f6;">
|
||
<div style="display:grid; place-items:center; width:35px; height:35px; border-radius:10px; color:#fff; background:#1d4ed8; font-size:11px; font-weight:bold;">WQ</div>
|
||
<div><strong style="display:block; font-size:16px;">WonderQ</strong><small style="color:#94a3b8;">内容运营后台</small></div>
|
||
</div>
|
||
<div style="padding:18px 10px; color:#64748b; font-size:13px; line-height:40px;">
|
||
<div style="padding:0 14px; color:#1d4ed8; background:#eff6ff; border-radius:8px;">首页概览</div>
|
||
<div style="padding:0 14px;">玩法管理</div>
|
||
<div style="padding:0 14px;">需求线索</div>
|
||
<div style="padding:0 14px;">系统管理</div>
|
||
</div>
|
||
</aside>
|
||
<main style="min-width:0; flex:1;">
|
||
<header style="height:88px; display:flex; align-items:center; justify-content:space-between; padding:0 25px; background:rgba(255,255,255,.82); border-bottom:1px solid #e7ebf2;">
|
||
<div><small style="display:block; color:#2563eb; font-size:9px; letter-spacing:2px;">OPERATIONS / ADMIN</small><strong style="display:block; margin-top:8px; font-size:20px;">玩法管理</strong></div>
|
||
<div style="color:#475569; font-size:12px;">权限已加载 管理员 退出</div>
|
||
</header>
|
||
<section style="padding:28px 25px;">
|
||
<div style="height:34px; margin-bottom:20px; color:#64748b; font-size:12px;">无 TagsView 页签</div>
|
||
<div style="height:185px; padding:20px; background:#fff; border:1px solid #e7ebf2; border-radius:12px;"><strong>玩法分类与路线编辑</strong><p style="color:#64748b; font-size:12px;">业务页面内容保留</p></div>
|
||
</section>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mockup">
|
||
<div class="mockup-header">目标：RuoYi-Vue3 默认后台壳</div>
|
||
<div class="mockup-body" style="padding:0; min-height:520px; background:#f5f7fb; font-family:Arial,'Microsoft YaHei',sans-serif; color:#303133;">
|
||
<div style="display:flex; min-height:520px;">
|
||
<aside style="width:200px; flex:0 0 200px; background:#304156; color:#bfcbd9; box-shadow:2px 0 6px rgba(0,21,41,.22);">
|
||
<div style="height:50px; display:flex; align-items:center; gap:10px; padding:0 16px; color:#fff; border-bottom:1px solid rgba(255,255,255,.05);"><div style="display:grid; place-items:center; width:26px; height:26px; border-radius:4px; background:#409eff; font-size:10px; font-weight:bold;">WQ</div><strong style="font-size:14px;">WonderQ</strong></div>
|
||
<div style="padding:12px 0; font-size:12px; line-height:40px;">
|
||
<div style="padding:0 16px; color:#fff; background:#263445; border-left:3px solid #409eff;">▣ 首页概览</div>
|
||
<div style="padding:0 16px;">▾ 运营管理</div>
|
||
<div style="padding:0 34px; background:#1f2d3d;">玩法管理</div>
|
||
<div style="padding:0 34px; background:#1f2d3d;">需求线索</div>
|
||
<div style="padding:0 16px;">▾ 系统管理</div>
|
||
</div>
|
||
</aside>
|
||
<main style="min-width:0; flex:1;">
|
||
<header style="height:50px; display:flex; align-items:center; justify-content:space-between; padding:0 16px; background:#fff; box-shadow:0 1px 4px rgba(0,21,41,.08);">
|
||
<div style="display:flex; align-items:center; gap:12px; color:#606266; font-size:16px;"><span style="font-size:20px;">☰</span><span style="font-size:12px;">首页 / 玩法管理</span></div>
|
||
<div style="display:flex; align-items:center; gap:12px; color:#5a5e66; font-size:12px;"><span>⌕</span><span>◐</span><span>□</span><span>☾</span><span>管理员 ⌄</span></div>
|
||
</header>
|
||
<div style="height:34px; padding:4px 10px; background:#fff; border-bottom:1px solid #d8dce5; box-shadow:0 1px 3px rgba(0,0,0,.12); font-size:11px;">
|
||
<span style="display:inline-block; height:26px; padding:0 9px; line-height:26px; color:#fff; background:#42b983; border:1px solid #42b983;">● 首页概览 ×</span>
|
||
<span style="display:inline-block; height:26px; padding:0 9px; line-height:26px; color:#495060;">玩法管理 ×</span>
|
||
</div>
|
||
<section style="padding:22px 25px;">
|
||
<div style="height:185px; padding:20px; background:#fff; border:1px solid #ebeef5; border-radius:2px;"><strong>玩法分类与路线编辑</strong><p style="color:#909399; font-size:12px;">业务页面内容保留，页面壳按 RuoYi 交互统一</p></div>
|
||
</section>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="section">
|
||
<h3>本次还原包含的交互</h3>
|
||
<div class="options" data-multiselect>
|
||
<div class="option" data-choice="sidebar" onclick="toggleSelect(this)"><div class="letter">A</div><div class="content"><h3>侧栏</h3><p>200px 深色侧栏、递归菜单、单开目录、折叠为 54px、移动端抽屉。</p></div></div>
|
||
<div class="option" data-choice="navbar" onclick="toggleSelect(this)"><div class="letter">B</div><div class="content"><h3>顶栏与页签</h3><p>50px Navbar、汉堡按钮、面包屑、右侧工具栏、可关闭 TagsView 和右键菜单。</p></div></div>
|
||
<div class="option" data-choice="settings" onclick="toggleSelect(this)"><div class="letter">C</div><div class="content"><h3>用户与布局设置</h3><p>用户下拉菜单、主题/尺寸/全屏工具、右侧布局设置抽屉，并保留 WonderQ 权限和退出流程。</p></div></div>
|
||
</div>
|
||
</div>
|