版本管理,优化

This commit is contained in:
zhongluofeng
2026-08-11 17:19:36 +08:00
parent 2f20161010
commit 6c7897bf47
33 changed files with 1361 additions and 39 deletions
+17 -3
View File
@@ -42,6 +42,11 @@ const hasSearchContent = computed(() => {
return searchQuery.value.trim().length > 0
})
/** 模块 id → 名称 查找表(用于搜索结果中标注所属模块) */
const moduleNameById = computed(() => {
return new Map(props.modules.map(m => [m.id, m.name]))
})
const handleSearchSelect = (moduleId: string) => {
emit('search', moduleId)
searchQuery.value = ''
@@ -50,6 +55,10 @@ const handleSearchSelect = (moduleId: string) => {
const handleSettingSelect = (item: SearchItem) => {
emit('search', item.moduleId)
// 记录待跳转 tab:模块挂载后由 useModuleTabs 自动切换(模块已挂载时同样生效)
if (item.tab) {
tabsStore.setPendingTab(item.moduleId, item.tab)
}
if (item.action) {
item.action()
}
@@ -323,14 +332,19 @@ const handleBlur = () => {
class="w-full px-3 py-2 text-left text-sm hover:bg-accent transition-colors flex items-center gap-2"
@click="handleSettingSelect(item)"
>
<Settings class="size-4 text-muted-foreground" />
<Settings class="size-4 text-muted-foreground shrink-0" />
<div class="flex-1 min-w-0">
<span class="truncate">{{ item.title }}</span>
<div class="flex items-center gap-1.5">
<span class="truncate">{{ item.title }}</span>
<span class="shrink-0 text-[10px] text-muted-foreground/70 px-1 py-px rounded bg-muted">
{{ moduleNameById.get(item.moduleId) || item.moduleId }}
</span>
</div>
<span v-if="item.description" class="block text-xs text-muted-foreground truncate">
{{ item.description }}
</span>
</div>
<ChevronRight class="size-4 text-muted-foreground" />
<ChevronRight class="size-4 text-muted-foreground shrink-0" />
</button>
</template>
+32
View File
@@ -4,6 +4,19 @@ import { invoke as __TAURI_INVOKE } from "@tauri-apps/api/core";
/** Commands */
export const commands = {
/** 获取当前应用版本 */
appVersion: () => __TAURI_INVOKE<string>("app_version"),
/** 检查 Gitea 最新 release,返回版本对比与可用资产 */
updateCheck: () => __TAURI_INVOKE<UpdateCheckResult>("update_check"),
/**
* 更新应用本体。
* 便携版:下载 thing_{v}_x64.exe → update.bat 覆盖重启;
* 安装版:下载 thing_{v}_x64-setup.exe → 提权静默安装 /S。
* 下载进度通过 UPDATE_PROGRESS 事件上报,调用方返回前会触发应用退出。
*/
updateInstall: () => __TAURI_INVOKE<null>("update_install"),
/** 更新 ThingHK 内核:下载 thing-hk_{v}.zip → 停止监控内核 → 覆盖内核文件 */
updateThinghk: () => __TAURI_INVOKE<null>("update_thinghk"),
proxyActivateProfile: (id: string) => __TAURI_INVOKE<null>("proxy_activate_profile", { id }),
proxyCheckKernelUpdate: () => __TAURI_INVOKE<KernelUpdateInfo>("proxy_check_kernel_update"),
proxyClearSystemProxy: () => __TAURI_INVOKE<null>("proxy_clear_system_proxy"),
@@ -480,6 +493,25 @@ export type TaskStatus =
/** 错误 */
"error";
/** release 中的一个资产 */
export type UpdateAsset = {
name: string,
size: number,
browserDownloadUrl: string,
};
/** 检查更新的结果 */
export type UpdateCheckResult = {
currentVersion: string,
latestVersion: string,
hasUpdate: boolean,
/** portable | installed */
installType: string,
releaseName: string,
releaseBody: string,
assets: UpdateAsset[],
};
/** 窗口信息(窗口拾取 / 枚举) */
export type WindowInfo = {
hwnd: number,
+2
View File
@@ -38,6 +38,8 @@ export const EVENTS = {
screenshotExported: 'screenshot-exported',
// 内核安装进度
kernelInstallProgress: 'kernel-install-progress',
// 应用更新进度
updateProgress: 'update-progress',
// 监控 OSD
osdStateUpdate: 'osd-state-update',
osdContentSize: 'osd-content-size',
+25 -2
View File
@@ -12,12 +12,15 @@ import { useModuleTabsStore, type ModuleTab } from '@/stores/moduleTabsStore'
* ```ts
* // 模块 <script setup> 顶部
* const activeTab = ref('overview')
* const tabsListRef = useModuleTabs(activeTab, [
* const tabsListRef = useModuleTabs('proxy', activeTab, [
* { value: 'overview', label: '概览' },
* { value: 'settings', label: '设置' }
* ])
* ```
*
* 第一个参数为模块 id:搜索导航跳转时,模块挂载后会自动
* 消费 moduleTabsStore 中对应的待跳转 tabpendingTab)。
*
* ```vue
* <!-- 模板中给 TabsList 包一层带 ref 的 div -->
* <div ref="tabsListRef">
@@ -29,7 +32,8 @@ import { useModuleTabsStore, type ModuleTab } from '@/stores/moduleTabsStore'
* 1. onMounted 时注册标签到 moduleTabsStoreTitleBar 据此渲染浮动切换器
* 2. 用 IntersectionObserver 监听 TabsList 可见性(rootMargin 裁剪 TitleBar 高度)
* 3. 双向 watch 同步本地 activeTab 与 store.activeTab
* 4. onUnmounted 时清理 observer 并注销标签
* 4. 消费搜索导航的待跳转 tab(模块尚未挂载的场景)
* 5. onUnmounted 时清理 observer 并注销标签
*
* ## 约束
* - TitleBar 高度固定为 40px (h-10)composable 内部已用 44px 裁剪(含缓冲)
@@ -37,6 +41,7 @@ import { useModuleTabsStore, type ModuleTab } from '@/stores/moduleTabsStore'
* - 模块卸载时务必让 composable 的 onUnmounted 执行(已自动处理,无需手动调用)
*/
export function useModuleTabs(
moduleId: string,
activeTab: Ref<string>,
tabs: ModuleTab[]
): Ref<HTMLElement | null> {
@@ -45,6 +50,15 @@ export function useModuleTabs(
let observer: IntersectionObserver | null = null
/** 应用待跳转 tab(若属于当前模块的 tab 列表) */
const applyPendingTab = () => {
const pending = tabsStore.consumePendingTab(moduleId)
if (pending && tabs.some(t => t.value === pending)) {
activeTab.value = pending
tabsStore.setActiveTab(pending)
}
}
const setupObserver = () => {
const el = tabsListRef.value
if (!el || observer) return
@@ -75,10 +89,19 @@ export function useModuleTabs(
}
})
// 模块已挂载时(搜索结果选中同一模块),pendingTab 变化 → 直接切换 tab
watch(() => tabsStore.pendingTab, (p) => {
if (p?.moduleId === moduleId) {
applyPendingTab()
}
})
onMounted(async () => {
tabsStore.registerTabs(tabs, activeTab.value)
await nextTick()
setupObserver()
// 搜索导航跳转:模块刚挂载,消费待跳转 tab
applyPendingTab()
})
onUnmounted(() => {
+3
View File
@@ -6,6 +6,9 @@ import 'vue-sonner/style.css'
import { createLogger } from './lib/logger'
const logger = createLogger('main')
// 禁用 WebView 默认右键菜单(桌面应用体验,主窗口与独立窗口共用)
document.addEventListener('contextmenu', (e) => e.preventDefault())
// 全局未捕获异常日志
window.addEventListener('error', (event) => {
logger.error(`全局JS错误: ${event.message} @ ${event.filename}:${event.lineno}`)
+1 -1
View File
@@ -32,7 +32,7 @@ const store = useClipboardStore()
const activeTab = ref('history')
const tabsStore = useModuleTabsStore()
const tabsListRef = useModuleTabs(activeTab, [
const tabsListRef = useModuleTabs('clipboard', activeTab, [
{ value: 'history', label: '历史' },
{ value: 'pinned', label: '固定' },
{ value: 'settings', label: '设置' },
+38 -1
View File
@@ -5,7 +5,44 @@ const searchItems: SearchIndexItem[] = [
{
title: '剪贴板历史',
description: '查看和管理剪贴板记录',
keywords: ['剪贴板', '复制', '粘贴', 'clipboard', 'copy', 'paste']
keywords: ['剪贴板', '复制', '粘贴', 'clipboard', 'copy', 'paste'],
tab: 'history'
},
{
title: '固定记录',
description: '查看固定的剪贴板条目',
keywords: ['固定', '收藏', 'pin', '置顶'],
tab: 'pinned'
},
{
title: '剪贴板设置',
description: '历史数量、图片收录与快捷弹窗快捷键',
keywords: ['设置', 'setting', '选项', '配置'],
tab: 'settings'
},
{
title: '快捷弹窗快捷键',
description: '配置全局快捷键唤起剪贴板弹窗',
keywords: ['快捷键', '热键', 'shortcut', 'hotkey', '弹窗', 'popup'],
tab: 'settings'
},
{
title: '最大历史条数',
description: '设置剪贴板历史记录数量上限',
keywords: ['历史', '数量', '上限', '条数', 'max', 'limit'],
tab: 'settings'
},
{
title: '图片大小上限',
description: '设置收录图片的大小上限 (KB)',
keywords: ['图片', '大小', '上限', 'image', 'kb', '体积'],
tab: 'settings'
},
{
title: '记录图片',
description: '是否收录复制/截图的图片',
keywords: ['图片', '截图', '收录', 'image', 'capture'],
tab: 'settings'
}
]
+1 -1
View File
@@ -45,7 +45,7 @@ const logger = createLogger('downloader')
// ===== 主 Tab 状态 =====
const activeTab = ref('tasks')
const tabsStore = useModuleTabsStore()
const tabsListRef = useModuleTabs(activeTab, [
const tabsListRef = useModuleTabs('downloader', activeTab, [
{ value: 'tasks', label: '下载任务' },
{ value: 'settings', label: '设置' },
{ value: 'extension', label: '浏览器扩展' }
+26 -4
View File
@@ -5,22 +5,44 @@ const searchItems: SearchIndexItem[] = [
{
title: '下载任务',
description: '查看与管理下载任务',
keywords: ['下载', 'download', '任务', 'task']
keywords: ['下载', 'download', '任务', 'task'],
tab: 'tasks'
},
{
title: '添加下载',
description: '添加 HTTP/HTTPS 直链下载',
keywords: ['添加', '链接', 'url', 'add', '新建']
keywords: ['添加', '链接', 'url', 'add', '新建'],
tab: 'tasks'
},
{
title: '下载设置',
description: '配置下载目录、并发数与速度限制',
keywords: ['设置', 'setting', '速度', '目录', '并发']
keywords: ['设置', 'setting', '速度', '目录', '并发'],
tab: 'settings'
},
{
title: '下载目录',
description: '设置任务默认保存目录',
keywords: ['目录', '保存', '路径', 'dir', 'folder', '下载位置'],
tab: 'settings'
},
{
title: '并发下载数',
description: '设置同时下载的任务数量上限',
keywords: ['并发', '数量', 'concurrent', '线程'],
tab: 'settings'
},
{
title: '速度限制',
description: '设置全局下载/上传限速',
keywords: ['限速', '速度', '速率', 'rate', 'limit', '带宽'],
tab: 'settings'
},
{
title: '浏览器扩展',
description: '安装 Thing Extension 接管浏览器下载',
keywords: ['扩展', 'extension', '浏览器', 'chrome', 'edge']
keywords: ['扩展', 'extension', '浏览器', 'chrome', 'edge'],
tab: 'extension'
}
]
+1 -1
View File
@@ -45,7 +45,7 @@ const store = useMonitorStore()
// ===== Tab 配置(注册到 TitleBar 浮动切换器) =====
const activeTab = ref('overview')
const tabsListRef = useModuleTabs(activeTab, [
const tabsListRef = useModuleTabs('monitor', activeTab, [
{ value: 'overview', label: '概览' },
{ value: 'details', label: '详细' },
{ value: 'osd', label: 'OSD 显示' },
+50 -1
View File
@@ -6,7 +6,56 @@ const searchItems: SearchIndexItem[] = [
{
title: '硬件监控',
description: '查看系统硬件状态',
keywords: ['监控', '硬件', 'cpu', '内存', 'monitor', 'hardware']
keywords: ['监控', '硬件', 'cpu', '内存', 'monitor', 'hardware'],
tab: 'overview'
},
{
title: '详细数据',
description: '查看各传感器详细读数',
keywords: ['详细', '数据', '传感器', 'sensor', '温度', '转速'],
tab: 'details'
},
{
title: 'OSD 显示',
description: '配置悬浮窗显示项、位置与外观',
keywords: ['osd', '悬浮窗', '小窗', '显示', 'overlay'],
tab: 'osd'
},
{
title: 'OSD 悬浮窗位置',
description: '设置悬浮窗在屏幕中的位置',
keywords: ['位置', '悬浮窗', '屏幕', 'position', 'osd'],
tab: 'osd'
},
{
title: '警告阈值',
description: '设置传感器告警阈值与颜色',
keywords: ['阈值', '告警', '警告', 'threshold', '颜色'],
tab: 'osd'
},
{
title: '监控设置',
description: '内核控制、自动启动与监控项配置',
keywords: ['设置', 'setting', '配置', '选项'],
tab: 'settings'
},
{
title: '启动监控内核',
description: '启动或停止 ThingHK 监控内核',
keywords: ['内核', '启动', '停止', 'kernel', 'thinghk', '控制'],
tab: 'settings'
},
{
title: '自动启动监控内核',
description: '应用启动时自动运行监控内核',
keywords: ['自动启动', '开机', '内核', 'autoStart'],
tab: 'settings'
},
{
title: '监控项配置',
description: '选择要监控的传感器分组与项目',
keywords: ['监控项', '传感器', '分组', 'sensor', '配置'],
tab: 'settings'
}
]
+1 -1
View File
@@ -73,7 +73,7 @@ const onConfirmOpenChange = (open: boolean) => {
const activeTab = ref('overview')
// 浮动标签切换器:注册到 TitleBar,滚动遮挡时自动显示
const tabsStore = useModuleTabsStore()
const tabsListRef = useModuleTabs(activeTab, [
const tabsListRef = useModuleTabs('proxy', activeTab, [
{ value: 'overview', label: '概览' },
{ value: 'proxies', label: '节点' },
{ value: 'profiles', label: '订阅' },
+92 -4
View File
@@ -7,22 +7,110 @@ const searchItems: SearchIndexItem[] = [
{
title: '代理设置',
description: '配置网络代理、端口与控制接口',
keywords: ['代理', 'proxy', '网络', 'network', '端口', 'port']
keywords: ['代理', 'proxy', '网络', 'network', '端口', 'port'],
tab: 'settings'
},
{
title: '订阅管理',
description: '导入与更新 Clash/mihomo 订阅',
keywords: ['订阅', 'subscription', 'profile', '导入']
keywords: ['订阅', 'subscription', 'profile', '导入'],
tab: 'profiles'
},
{
title: '节点选择',
description: '切换代理节点并测试延迟',
keywords: ['节点', 'node', '延迟', 'delay', '测速']
keywords: ['节点', 'node', '延迟', 'delay', '测速'],
tab: 'proxies'
},
{
title: '系统代理',
description: '开启或关闭 Windows 系统代理',
keywords: ['系统代理', 'system proxy', '开关', 'toggle']
keywords: ['系统代理', 'system proxy', '开关', 'toggle'],
tab: 'overview'
},
{
title: '导入订阅',
description: '填入订阅地址导入新配置',
keywords: ['导入', '订阅地址', 'import', 'url', '添加订阅'],
tab: 'profiles'
},
{
title: '更新订阅',
description: '手动更新订阅配置',
keywords: ['更新订阅', 'update', '刷新订阅'],
tab: 'profiles'
},
{
title: '自动切换节点',
description: '定时测速并自动切换到最优节点',
keywords: ['自动切换', 'auto switch', '智能', '最优节点', '测速'],
tab: 'overview'
},
{
title: '代理组测速',
description: '测试代理组所有节点的延迟',
keywords: ['测速', '延迟', 'delay', 'test', 'ping'],
tab: 'proxies'
},
{
title: '运行模式',
description: '规则 / 全局 / 直连模式切换',
keywords: ['模式', 'mode', 'rule', 'global', 'direct', '规则', '全局', '直连'],
tab: 'settings'
},
{
title: '混合代理端口',
description: '配置 mihomo 混合代理端口',
keywords: ['端口', 'port', 'mixed', '混合'],
tab: 'settings'
},
{
title: '控制接口地址',
description: '配置外部控制接口地址',
keywords: ['控制接口', 'external', 'controller', 'api', '地址'],
tab: 'settings'
},
{
title: 'API 密钥',
description: '设置 mihomo 外部 API 密钥',
keywords: ['密钥', 'secret', 'token', '鉴权', 'api'],
tab: 'settings'
},
{
title: '允许局域网连接',
description: '允许其他设备通过本机代理上网',
keywords: ['局域网', 'lan', 'allowLan', '共享'],
tab: 'settings'
},
{
title: '日志级别',
description: '配置 mihomo 日志输出级别',
keywords: ['日志', 'log', 'level', 'debug', 'info'],
tab: 'settings'
},
{
title: '启动时自动启动 mihomo',
description: '应用启动时自动运行代理内核',
keywords: ['自动启动', 'autoStart', '开机', '启动内核'],
tab: 'settings'
},
{
title: '启动时自动开启系统代理',
description: 'mihomo 启动后自动设置 Windows 系统代理',
keywords: ['系统代理', '自动', 'autoSystemProxy'],
tab: 'settings'
},
{
title: '更新内核',
description: '检查并更新 mihomo 内核版本',
keywords: ['内核', '更新', 'kernel', 'update', '升级'],
tab: 'overview'
},
{
title: '安装内核',
description: '首次安装 mihomo 内核',
keywords: ['内核', '安装', 'kernel', 'install', '下载'],
tab: 'overview'
}
]
+25
View File
@@ -8,6 +8,31 @@ const searchItems: SearchIndexItem[] = [
title: '快速面板',
description: '全局快捷键唤起命令面板',
keywords: ['快速面板', '快速启动', '搜索', '命令', 'quickpanel', 'launcher', 'spotlight']
},
{
title: '唤起快捷键',
description: '配置全局快捷键打开快速面板',
keywords: ['快捷键', '热键', 'shortcut', 'hotkey', '唤起', '打开']
},
{
title: '唤起位置',
description: '设置面板弹出位置(屏幕中央 / 鼠标位置)',
keywords: ['位置', '弹出', '光标', 'position', 'popup']
},
{
title: '默认搜索引擎',
description: '设置快速面板网页搜索的搜索引擎',
keywords: ['搜索引擎', '搜索', '引擎', 'search', 'engine', 'bing', 'google']
},
{
title: '文件索引',
description: '构建与管理本地文件搜索索引',
keywords: ['文件', '索引', '搜索', 'index', '目录', 'file']
},
{
title: '自定义命令',
description: '添加自定义启动命令',
keywords: ['自定义', '命令', 'command', '启动']
}
]
+1 -1
View File
@@ -19,7 +19,7 @@ import { Tooltip, TooltipTrigger, TooltipContent } from '@/components/ui/tooltip
const store = useScreenshotStore()
const activeTab = ref('settings')
const tabsListRef = useModuleTabs(activeTab, [
const tabsListRef = useModuleTabs('screenshot', activeTab, [
{ value: 'settings', label: '设置' },
{ value: 'history', label: '历史' },
])
+38 -1
View File
@@ -5,7 +5,44 @@ const searchItems: SearchIndexItem[] = [
{
title: '截图工具',
description: '捕获屏幕截图',
keywords: ['截图', '屏幕', 'screenshot', 'capture']
keywords: ['截图', '屏幕', 'screenshot', 'capture'],
tab: 'settings'
},
{
title: '截图历史',
description: '查看和管理截图记录',
keywords: ['历史', '记录', 'history', '截图'],
tab: 'history'
},
{
title: '截图快捷键',
description: '配置全局截图快捷键',
keywords: ['快捷键', '热键', 'shortcut', 'hotkey', '截图'],
tab: 'settings'
},
{
title: '贴图快捷键',
description: '配置全局贴图快捷键',
keywords: ['贴图', '快捷键', 'pin', 'shortcut'],
tab: 'settings'
},
{
title: '延时截图',
description: '设置截图延时秒数',
keywords: ['延时', '延迟', 'delay', '定时截图'],
tab: 'settings'
},
{
title: '自动保存到目录',
description: '截图完成后自动保存到指定目录',
keywords: ['自动保存', '目录', '路径', 'save', 'dir'],
tab: 'settings'
},
{
title: '历史保留数量',
description: '设置截图历史记录保留上限',
keywords: ['历史', '数量', '上限', 'history', 'limit'],
tab: 'settings'
}
]
+223 -4
View File
@@ -1,27 +1,119 @@
<script setup lang="ts">
import { Monitor, Sun, Moon, Sparkles, Layers, LogOut, Package, GripVertical } from '@lucide/vue'
import { Monitor, Sun, Moon, Sparkles, Layers, LogOut, Package, GripVertical, Info, RefreshCw, Download, Check, Loader2 } from '@lucide/vue'
import { Switch } from '@/components/ui/switch'
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
import { Label } from '@/components/ui/label'
import { Button } from '@/components/ui/button'
import { Progress } from '@/components/ui/progress'
import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
import { useAppStore, type Theme, type EffectType, type ModuleInfo } from '@/stores/appStore'
import { useSearchStore } from '@/stores/searchStore'
import { useProcessStore } from '@/stores/processStore'
import { getModuleIcon } from '@/modules/icons'
import { commands, type UpdateCheckResult } from '@/lib/bindings'
import { EVENTS } from '@/lib/constants'
import { listen, type UnlistenFn } from '@tauri-apps/api/event'
import { invoke } from '@tauri-apps/api/core'
import { computed, onMounted, ref, watch } from 'vue'
import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
import { VueDraggable } from 'vue-draggable-plus'
const appStore = useAppStore()
const searchStore = useSearchStore()
const processStore = useProcessStore()
// ===== 关于 / 更新 =====
/** 更新进度事件载荷(与 Rust UpdateProgress 对应) */
interface UpdateProgress {
stage: string
percent: number
downloadedBytes: number
totalBytes: number | null
message: string
}
/** 当前应用版本(启动时读取) */
const currentVersion = ref('')
/** 检查更新的结果 */
const updateResult = ref<UpdateCheckResult | null>(null)
const checking = ref(false)
/** 应用本体更新中 */
const appUpdating = ref(false)
/** ThingHK 内核更新中 */
const kernelUpdating = ref(false)
const progress = ref<UpdateProgress | null>(null)
const thinghkExists = ref(false)
let progressUnlisten: UnlistenFn | null = null
const installTypeText = computed(() =>
updateResult.value?.installType === 'installed' ? '安装版' : '便携版',
)
const loadAppInfo = async () => {
try {
currentVersion.value = await commands.appVersion()
} catch { /* 忽略:后端未就绪 */ }
try {
const info = await invoke('monitor_kernel_info') as { exists?: boolean }
thinghkExists.value = info?.exists ?? false
} catch { /* 忽略:内核未就绪 */ }
}
/** 检查 Gitea 最新 release */
const checkUpdate = async () => {
if (checking.value || appUpdating.value) return
checking.value = true
try {
updateResult.value = await commands.updateCheck()
} catch (e) {
console.error('[updater] 检查更新失败', e)
} finally {
checking.value = false
}
}
/** 下载并应用应用更新(便携版替换 exe / 安装版静默安装),触发应用退出重启 */
const installUpdate = async () => {
if (appUpdating.value) return
appUpdating.value = true
try {
await commands.updateInstall()
} catch (e) {
console.error('[updater] 应用更新失败', e)
appUpdating.value = false
}
}
/** 更新 ThingHK 内核:后端先停止监控内核再覆盖文件 */
const updateThinghkKernel = async () => {
if (kernelUpdating.value) return
kernelUpdating.value = true
try {
await commands.updateThinghk()
await loadAppInfo()
} catch (e) {
console.error('[updater] ThingHK 更新失败', e)
} finally {
kernelUpdating.value = false
}
}
// 系统真实深浅色偏好,来自 appStore(应用启动时初始化,仅通过 onThemeChanged 更新,
// 不受 setTheme 污染),用于"跟随系统"卡片色块。
const systemDark = computed(() => appStore.systemDark)
onMounted(() => {
loadAppInfo()
// 监听更新进度事件(应用更新与 ThingHK 内核更新共用)
listen<UpdateProgress>(EVENTS.updateProgress, (e) => {
progress.value = e.payload
if (e.payload.stage === 'done') {
kernelUpdating.value = false
progress.value = null
}
}).then((fn) => {
progressUnlisten = fn
})
searchStore.registerAction('settings', 0, () => appStore.setTheme('light'))
searchStore.registerAction('settings', 1, () => appStore.setTheme('dark'))
searchStore.registerAction('settings', 2, () => appStore.setTheme('system'))
@@ -29,10 +121,21 @@ onMounted(() => {
searchStore.registerAction('settings', 4, () => appStore.setEffect('mica'))
searchStore.registerAction('settings', 5, () => appStore.setEffect('acrylic'))
searchStore.registerAction('settings', 6, () => appStore.toggleAutoStart())
// 新增设置项(模块管理/关于/退出):仅定位滚动到对应卡片
searchStore.registerAction('settings', 7, () => scrollToCard('settings-card-modules'))
searchStore.registerAction('settings', 8, () => scrollToCard('settings-card-about'))
searchStore.registerAction('settings', 9, () => scrollToCard('settings-card-about'))
searchStore.registerAction('settings', 10, () => scrollToCard('settings-card-about'))
searchStore.registerAction('settings', 11, () => scrollToCard('settings-card-quit'))
// 主动刷新所有进程状态,确保内核 badge 显示当前真实状态(而非过期缓存)
processStore.refreshAll().catch(() => { /* 忽略:后端可能未就绪 */ })
})
onUnmounted(() => {
progressUnlisten?.()
progressUnlisten = null
})
const themes: Array<{ id: Theme; name: string; color: string; icon: typeof Sun }> = [
{ id: 'light', name: '浅色模式', color: '#f8fafc', icon: Sun },
{ id: 'dark', name: '深色模式', color: '#1e293b', icon: Moon },
@@ -82,6 +185,25 @@ const quitApp = async () => {
await invoke('quit_app')
}
/** 滚动到指定卡片(搜索导航定位用)。
* 模块为异步加载,若卡片尚未渲染则短暂重试,直到模块挂载完成。 */
const scrollToCard = (id: string) => {
const tryScroll = (): boolean => {
const el = document.getElementById(id)
if (!el) return false
el.scrollIntoView({ behavior: 'smooth', block: 'start' })
return true
}
if (tryScroll()) return
let attempts = 0
const timer = window.setInterval(() => {
attempts++
if (tryScroll() || attempts >= 20) {
window.clearInterval(timer)
}
}, 100)
}
/** 判断模块开关是否处于处理中状态 */
const isModuleToggling = (moduleId: string): boolean => {
return appStore.togglingModules.has(moduleId)
@@ -243,7 +365,7 @@ const onDragEnd = () => {
</CardContent>
</Card>
<Card>
<Card id="settings-card-modules">
<CardHeader>
<CardTitle class="flex items-center gap-2">
<Package class="size-5 text-primary" />
@@ -313,7 +435,104 @@ const onDragEnd = () => {
</CardContent>
</Card>
<Card>
<Card id="settings-card-about">
<CardHeader>
<CardTitle class="flex items-center gap-2">
<Info class="size-5 text-primary" />
关于
</CardTitle>
</CardHeader>
<CardContent class="space-y-1">
<!-- 应用版本 + 检查更新 -->
<div class="flex items-center justify-between py-2">
<div class="space-y-1">
<Label class="text-base font-medium">应用版本</Label>
<p class="text-sm text-muted-foreground">
Thing v{{ currentVersion || '…' }}
<span v-if="updateResult" class="ml-1 text-xs px-1.5 py-0.5 rounded-full bg-muted">
{{ installTypeText }}
</span>
</p>
</div>
<Button
variant="outline"
size="sm"
:disabled="checking || appUpdating"
@click="checkUpdate"
>
<RefreshCw v-if="!checking" class="size-3.5 mr-1.5" />
<Loader2 v-else class="size-3.5 mr-1.5 animate-spin" />
{{ checking ? '检查中...' : '检查更新' }}
</Button>
</div>
<!-- 更新结果 -->
<div v-if="updateResult" class="rounded-lg border border-border/50 p-3 space-y-2">
<div v-if="updateResult.hasUpdate" class="space-y-2">
<div class="flex items-center justify-between">
<span class="text-sm font-medium">
发现新版本 v{{ updateResult.latestVersion }}
</span>
<span class="text-xs text-muted-foreground">当前 v{{ updateResult.currentVersion }}</span>
</div>
<p
v-if="updateResult.releaseBody"
class="text-xs text-muted-foreground whitespace-pre-wrap max-h-20 overflow-y-auto"
>
{{ updateResult.releaseBody }}
</p>
<div class="flex items-center gap-2">
<Button size="sm" :disabled="appUpdating" @click="installUpdate">
<Download class="size-3.5 mr-1.5" />
{{ appUpdating ? '更新中...' : '下载并更新' }}
</Button>
<span class="text-xs text-muted-foreground">
{{ installTypeText === '安装版' ? '将静默安装新版并重启' : '将替换程序文件并重启' }}
</span>
</div>
</div>
<div v-else class="flex items-center gap-1.5 text-sm text-muted-foreground">
<Check class="size-4 text-green-500" />
已是最新版本
</div>
</div>
<!-- 应用更新进度 -->
<div v-if="appUpdating && progress" class="space-y-1.5 py-1">
<div class="flex items-center justify-between text-xs text-muted-foreground">
<span>{{ progress.message }}</span>
<span class="font-mono">{{ progress.percent }}%</span>
</div>
<Progress :model-value="progress.percent" />
</div>
<!-- ThingHK 内核 -->
<div class="flex items-center justify-between py-2 border-t border-border/50">
<div class="space-y-1">
<Label class="text-base font-medium">ThingHK 内核</Label>
<p class="text-sm text-muted-foreground">
{{ thinghkExists ? '已安装' : '未安装' }} · 更新前请先停用监控模块
</p>
</div>
<Button variant="outline" size="sm" :disabled="kernelUpdating" @click="updateThinghkKernel">
<Loader2 v-if="kernelUpdating && !progress" class="size-3.5 mr-1.5 animate-spin" />
<Package v-else class="size-3.5 mr-1.5" />
{{ kernelUpdating ? '更新中...' : '更新内核' }}
</Button>
</div>
<!-- ThingHK 更新进度 -->
<div v-if="kernelUpdating && progress" class="space-y-1.5 py-1">
<div class="flex items-center justify-between text-xs text-muted-foreground">
<span>{{ progress.message }}</span>
<span class="font-mono">{{ progress.percent }}%</span>
</div>
<Progress :model-value="progress.percent" />
</div>
</CardContent>
</Card>
<Card id="settings-card-quit">
<CardHeader>
<CardTitle class="flex items-center gap-2">
<LogOut class="size-5 text-destructive" />
+25
View File
@@ -37,6 +37,31 @@ const searchItems: SearchIndexItem[] = [
title: '开机自启',
description: '启动 Windows 时自动运行应用',
keywords: ['开机', '自启', '自动', 'auto', 'start']
},
{
title: '模块管理',
description: '启用/禁用模块与拖拽排序',
keywords: ['模块', '管理', '排序', '禁用', '启用', 'module']
},
{
title: '检查更新',
description: '检查并下载应用新版本',
keywords: ['更新', '版本', '升级', 'update', 'check', 'release']
},
{
title: '应用版本',
description: '查看当前应用版本与安装方式',
keywords: ['版本', 'version', 'about', '关于']
},
{
title: 'ThingHK 内核',
description: '查看监控内核安装状态并更新',
keywords: ['内核', 'thinghk', 'kernel', '监控', '更新']
},
{
title: '退出程序',
description: '彻底退出 Thing 应用',
keywords: ['退出', '关闭', 'quit', 'exit', '结束']
}
]
+2 -1
View File
@@ -247,7 +247,8 @@ export const useAppStore = defineStore('app', () => {
moduleId,
title: item.title,
description: item.description,
keywords: item.keywords
keywords: item.keywords,
tab: item.tab
})
})
}
+24
View File
@@ -28,6 +28,27 @@ export const useModuleTabsStore = defineStore('moduleTabs', () => {
/** 是否显示浮动切换器(TabsList 滚出可视区时为 true */
const floatingVisible = ref<boolean>(false)
/** 待跳转 tab(搜索导航设置):{ moduleId, tab },模块挂载/已挂载时消费 */
const pendingTab = ref<{ moduleId: string; tab: string } | null>(null)
/** 设置待跳转 tab(搜索结果点击时调用) */
const setPendingTab = (moduleId: string, tab: string) => {
pendingTab.value = { moduleId, tab }
}
/**
* 消费指定模块的待跳转 tab(返回 tab 值并清除)。
* 仅在 moduleId 匹配时消费,避免误切当前已挂载模块的 tab。
*/
const consumePendingTab = (moduleId: string): string | null => {
if (pendingTab.value && pendingTab.value.moduleId === moduleId) {
const tab = pendingTab.value.tab
pendingTab.value = null
return tab
}
return null
}
/** 当前模块注册的保存处理函数(null 表示无保存按钮,如自动保存模块) */
const saveHandler = ref<(() => unknown) | null>(null)
/** 保存中状态(驱动按钮 disabled + loading 图标) */
@@ -93,6 +114,7 @@ export const useModuleTabsStore = defineStore('moduleTabs', () => {
tabs,
activeTab,
floatingVisible,
pendingTab,
saveHandler,
saving,
saveVisible,
@@ -100,6 +122,8 @@ export const useModuleTabsStore = defineStore('moduleTabs', () => {
unregisterTabs,
setFloatingVisible,
setActiveTab,
setPendingTab,
consumePendingTab,
registerSave,
runSave
}
+2
View File
@@ -2,6 +2,8 @@ export interface SearchIndexItem {
title: string
description?: string
keywords: string[]
/** 跳转目标:模块内部 tab(如 proxy 的 'settings'),无 tab 则只切换模块 */
tab?: string
}
export interface SearchIndexConfig {
+20 -9
View File
@@ -1,6 +1,7 @@
import { defineStore } from 'pinia'
import { ref } from 'vue'
import { moduleRegistry } from '@/modules/registry'
import { getTextForms, bestScore } from '@/modules/quickpanel/engine'
export interface SearchItem {
id: string
@@ -8,6 +9,8 @@ export interface SearchItem {
title: string
description?: string
keywords: string[]
/** 跳转目标:模块内部 tab(无则只切换模块) */
tab?: string
action?: () => void
}
@@ -29,7 +32,8 @@ export const useSearchStore = defineStore('search', () => {
moduleId,
title: item.title,
description: item.description,
keywords: item.keywords
keywords: item.keywords,
tab: item.tab
}
if (!items.value.find(i => i.id === searchItem.id)) {
items.value.push(searchItem)
@@ -76,14 +80,21 @@ export const useSearchStore = defineStore('search', () => {
const search = (query: string) => {
if (!query.trim()) return []
const lowerQuery = query.toLowerCase()
return items.value.filter(item => {
const titleMatch = item.title.toLowerCase().includes(lowerQuery)
const descMatch = item.description ? item.description.toLowerCase().includes(lowerQuery) : false
const keywordMatch = item.keywords.some(k => k.toLowerCase().includes(lowerQuery))
const moduleIdMatch = item.moduleId.toLowerCase().includes(lowerQuery)
return titleMatch || descMatch || keywordMatch || moduleIdMatch
})
// 复用快速面板匹配引擎:标题/描述/关键词/模块名 多形态模糊匹配(支持拼音、子序列)
const scored = items.value
.map(item => {
let score = Math.max(
bestScore(query, getTextForms(item.title)),
bestScore(query, getTextForms(item.description ?? '')),
bestScore(query, getTextForms(item.keywords.join(' ')))
)
const moduleName = moduleRegistry.getConfig(item.moduleId)?.name ?? item.moduleId
score = Math.max(score, bestScore(query, getTextForms(moduleName)) * 0.9)
return { item, score }
})
.filter(e => e.score > 0)
.sort((a, b) => b.score - a.score)
return scored.map(e => e.item)
}
const getItemsByModule = (moduleId: string) => {
+11
View File
@@ -161,6 +161,17 @@
}
}
/* 桌面应用体验:默认禁止文本选中(按钮/下拉框/标题等控件文字不可拖动选择),
输入框、文本域、可编辑区域仍允许选择/复制 */
html, body, #app {
user-select: none;
-webkit-user-select: none;
}
input, textarea, [contenteditable='true'] {
user-select: text;
-webkit-user-select: text;
}
#app {
width: 100%;
height: 100vh;