功能: - 新增 PathBreadcrumb 组件,支持路径快速跳转 - 新增 DropdownItem 通用下拉菜单组件 优化: - 版本升级流程优化(Pinia 状态管理、进度节流、完整下载验证) - 模块延迟初始化(数据库、文件系统按需启动) - API 数据格式统一(蛇形转驼峰) - CodeMirror 语言包按需动态加载 - Markdown 渲染增强(支持锚点跳转) 重构: - 迁移到 Pinia 状态管理(stores/config.ts、stores/theme.ts、stores/update.ts) - 简化 UpdatePanel、UpdateNotification、ThemeToggle 逻辑 - 优化表结构加载逻辑 清理: - 删除测试组件 index-simple.vue - 删除旧的 useTheme.ts
46 lines
875 B
Vue
46 lines
875 B
Vue
<template>
|
|
<a-tooltip :content="themeStore.tooltipText" position="bottom">
|
|
<div
|
|
class="theme-toggle-btn"
|
|
@click="handleToggle"
|
|
>
|
|
{{ themeStore.isDark ? '🌙' : '☀️' }}
|
|
</div>
|
|
</a-tooltip>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { useThemeStore } from '../stores/theme'
|
|
|
|
const themeStore = useThemeStore()
|
|
|
|
const handleToggle = () => {
|
|
themeStore.toggleTheme()
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.theme-toggle-btn {
|
|
width: 32px;
|
|
height: 32px;
|
|
font-size: 16px;
|
|
cursor: pointer;
|
|
border-radius: var(--border-radius-small, 2px);
|
|
user-select: none;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex-shrink: 0;
|
|
box-sizing: border-box;
|
|
transition: background-color 0.2s;
|
|
}
|
|
|
|
.theme-toggle-btn:hover {
|
|
background: var(--color-bg-2);
|
|
}
|
|
|
|
.theme-toggle-btn:active {
|
|
background: var(--color-bg-3);
|
|
}
|
|
</style>
|