Private
Public Access
1
0
Files
u-desk/web/src/components/ThemeToggle.vue
绝尘 f7d648ea52 新增:文件系统导航面包屑
功能:
- 新增 PathBreadcrumb 组件,支持路径快速跳转
- 新增 DropdownItem 通用下拉菜单组件

优化:
- 版本升级流程优化(Pinia 状态管理、进度节流、完整下载验证)
- 模块延迟初始化(数据库、文件系统按需启动)
- API 数据格式统一(蛇形转驼峰)
- CodeMirror 语言包按需动态加载
- Markdown 渲染增强(支持锚点跳转)

重构:
- 迁移到 Pinia 状态管理(stores/config.ts、stores/theme.ts、stores/update.ts)
- 简化 UpdatePanel、UpdateNotification、ThemeToggle 逻辑
- 优化表结构加载逻辑

清理:
- 删除测试组件 index-simple.vue
- 删除旧的 useTheme.ts
2026-02-05 00:17:32 +08:00

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>