feat(ui): 为导航菜单项添加图标并优化设置页的标签输入组件

- 在导航菜单项中引入图标组件,提升视觉识别性
- 将设置页中的文本域输入替换为交互式标签输入组件,支持添加/删除标签
- 新增标签输入组件的样式和交互逻辑,改善用户体验
This commit is contained in:
anghunk
2026-02-02 11:11:02 +08:00
parent fd2cecc6d4
commit e6bbac8366
4 changed files with 321 additions and 47 deletions

View File

@@ -83,35 +83,40 @@
:class="{ active: isRouteActive('comments') }"
@click="goComments"
>
评论管理
<PhChatCircleDots class="menu-item-icon" :size="18" />
<span>评论管理</span>
</li>
<li
class="menu-item"
:class="{ active: isRouteActive('stats') }"
@click="goStats"
>
数据看板
<PhSquaresFour class="menu-item-icon" :size="18" />
<span>数据看板</span>
</li>
<li
class="menu-item"
:class="{ active: isRouteActive('analytics') }"
@click="goAnalytics"
>
访问统计
<PhChartBar class="menu-item-icon" :size="18" />
<span>访问统计</span>
</li>
<li
class="menu-item"
:class="{ active: isRouteActive('settings') }"
@click="goSettings"
>
网站设置
<PhGear class="menu-item-icon" :size="18" />
<span>网站设置</span>
</li>
<li
class="menu-item"
:class="{ active: isRouteActive('data') }"
@click="goData"
>
数据管理
<PhDatabase class="menu-item-icon" :size="18" />
<span>数据管理</span>
</li>
</ul>
<div class="layout-sider-footer" @click="openVersionModal">