Compare commits

...

165 Commits

Author SHA1 Message Date
jxxghp
01835c0ac5 Merge pull request #420 from PKC278/v2 2026-01-06 15:19:24 +08:00
PKC278
e5749bd6ef address review comments for useVersionChecker
- Simplify props passing for VersionUpdateToast
- Remove redundant removeEventListener call
2026-01-06 15:07:20 +08:00
PKC278
689e58737b feat(service-worker): 兼容旧版前端监听逻辑 2026-01-06 14:10:57 +08:00
PKC278
38da061cf1 refactor(useVersionChecker): 优化版本检查逻辑和通知机制
feat(locales): 更新多语言版本信息
style(main.scss): 移除版本更新通知样式
2026-01-06 12:00:11 +08:00
jxxghp
e79940e52e 更新 package.json 2026-01-04 09:56:31 +08:00
jxxghp
88dd6068b6 Merge pull request #419 from PKC278/v2 2026-01-04 07:04:32 +08:00
PKC278
7dd10f9c96 fix(VersionUpdateToast): 优化消息样式和移动端适配 2026-01-03 23:28:29 +08:00
PKC278
94aaf83107 fix(index): 移除多余判断 2026-01-03 22:36:25 +08:00
PKC278
e84fc5f424 Update src/service-worker.ts
Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com>
2026-01-03 22:32:52 +08:00
PKC278
f342b08179 fix(service-worker): 优化缓存版本控制和监控缓存大小逻辑 2026-01-03 21:53:04 +08:00
PKC278
0fcad02f3b fix(VersionUpdateToast): 优化通知样式
fix(useVersionChecker): 优化处理逻辑
2026-01-03 20:15:05 +08:00
PKC278
43d2406ee9 feat(timeout): 添加多语言页面加载超时提示 2026-01-03 19:09:37 +08:00
PKC278
78e2d05730 feat(index): 添加页面加载超时提示,修改默认主题设置为跟随系统
fix(service-worker): 优化清理运行时缓存逻辑
2026-01-03 19:08:16 +08:00
PKC278
425bf808ed fix: 修复 i18n-menu 工具函数外部调用导致的运行时错误 2026-01-03 19:03:37 +08:00
PKC278
6d2916dc9f feat(pwa): 重构 Service Worker 及版本更新机制 2026-01-02 20:36:33 +08:00
jxxghp
2281e4224b Merge pull request #418 from PKC278/v2 2026-01-01 12:54:38 +08:00
PKC278
95282f9883 perf: 优化导航栏动画流畅度 2026-01-01 12:29:42 +08:00
jxxghp
b470f182c9 Merge pull request #417 from PKC278/v2 2025-12-31 22:19:27 +08:00
PKC278
0bba1068af revert(Footer): 回滚9284d48 Footer.vue 2025-12-31 22:14:13 +08:00
jxxghp
947a7d8296 更新 package.json 2025-12-30 07:01:48 +08:00
jxxghp
bd36cbf888 Merge pull request #416 from PKC278/v2 2025-12-30 07:01:22 +08:00
PKC278
d8fa47bff7 fix(aboutDialog): 修复关于页面在手机端可左右滑动的问题 2025-12-30 04:18:09 +08:00
PKC278
1132beea5e feat(aboutDialog): 添加清除缓存按钮 2025-12-30 04:01:11 +08:00
PKC278
2e3314e6c3 fix(type): 修复Axios请求类型声明 2025-12-30 03:43:20 +08:00
PKC278
daa8f857f8 fix(ui): 移除UI模式切换后自动刷新页面
fix(locales): 修改自动布局文本为更简洁的“自动”
2025-12-30 03:25:55 +08:00
PKC278
6d14271fe8 feat(aboutDialog): 添加浏览器缓存版本信息展示 2025-12-30 02:55:08 +08:00
PKC278
9284d48f67 fix(logo): 使用外链替换页面内联svg,修复safari浏览器logo显示不全问题
fix(footer): 改善底部导航栏的动画效果
2025-12-30 02:32:13 +08:00
PKC278
c5d1c5a468 fix(type): 修复类型检查错误 2025-12-30 01:47:45 +08:00
PKC278
b98512789f feat(uiMode): 添加UI模式手动切换功能 2025-12-30 01:42:43 +08:00
PKC278
6b8ed8d527 fix(vite): 消除编译警告 2025-12-30 00:54:13 +08:00
PKC278
ec4500dcef refactor(versionChecker): 重构版本检查功能并更新通知样式 2025-12-30 00:00:37 +08:00
jxxghp
288e63ce68 更新 package.json 2025-12-28 17:46:37 +08:00
jxxghp
b3885584bb Merge pull request #415 from PKC278/v2 2025-12-28 17:17:49 +08:00
PKC278
968b24be1e feat(globalSetting): 添加版本检查与通知功能 2025-12-28 16:35:16 +08:00
jxxghp
5a23c1783a 更新 UserProfileView.vue 2025-12-23 23:18:11 +08:00
jxxghp
ddeeb5a7c3 更新 UserProfileView.vue 2025-12-23 23:16:28 +08:00
jxxghp
0b9bbcc7b8 Merge pull request #414 from PKC278/v2 2025-12-23 23:03:10 +08:00
PKC278
022c8b4515 fix(icon): 更新apple-touch-icon
refactor(html): 移除不必要的预加载链接
2025-12-23 22:43:42 +08:00
jxxghp
be04991928 Merge pull request #413 from PKC278/v2 2025-12-23 17:37:30 +08:00
PKC278
34770567a5 fix(mfa): 修复双重验证漏洞 2025-12-23 15:15:41 +08:00
jxxghp
6154fc2157 Merge pull request #412 from PKC278/v2 2025-12-23 14:40:56 +08:00
PKC278
e77dcdd3d4 feat(passkey): 添加PassKey支持并优化双重验证登录逻辑 2025-12-23 13:53:55 +08:00
jxxghp
58a3532c1b 更新 package.json 2025-12-23 12:53:07 +08:00
jxxghp
116a5eeb43 Merge pull request #411 from HankunYu/v2 2025-12-23 12:52:04 +08:00
HankunYu
decd50cb40 更新Discord模块支持互动消息 2025-12-22 20:00:06 +00:00
HankunYu
355563244c 通知渠道增加Discord 2025-12-22 02:11:09 +00:00
jxxghp
51aad628b5 fix path mapping ui 2025-12-10 14:20:59 +08:00
jxxghp
7dd7a2cf34 Merge pull request #409 from stkevintan/download_uri 2025-12-08 18:45:56 +08:00
Kevin Tan
4c0ff7c7f2 Delete vite.config.ts.timestamp-1765185924563-2ee2d81ca5c1a.mjs 2025-12-08 18:27:26 +08:00
stkevintan
8aba3cbe00 fix key index issue 2025-12-08 17:43:49 +08:00
stkevintan
e21c3ec507 update naming 2025-12-08 17:26:26 +08:00
stkevintan
fdbb0b2ca8 fix: recommended 2025-12-08 17:25:25 +08:00
stkevintan
180195ab7d refine the logic of update storage path 2025-12-08 16:21:41 +08:00
stkevintan
8add4e6b46 implement path mapping UI 2025-12-08 14:01:42 +08:00
stkevintan
3d622d2efe add path mapping 2025-12-08 09:15:51 +08:00
jxxghp
bb7ed7b963 Merge pull request #408 from stkevintan/download_uri 2025-12-06 20:05:02 +08:00
stkevintan
d541ea41ad filter out undefined options 2025-12-06 20:02:50 +08:00
stkevintan
7c7ebc9eb7 display storage type on the download path 2025-12-06 19:49:03 +08:00
jxxghp
22275c3b12 更新 package.json 2025-12-06 03:51:19 +08:00
jxxghp
8744a34e8e Merge pull request #407 from stkevintan/file-browser-initial 2025-12-06 03:50:51 +08:00
stkevintan
e98836fd0e simplify sort on FileNavigator 2025-12-06 00:00:29 +08:00
stkevintan
feb62196a2 keep sort in sync 2025-12-05 23:50:37 +08:00
stkevintan
9fd29a2958 enhance the file browser 2025-12-05 23:42:24 +08:00
jxxghp
546c82ca40 更新 package.json 2025-11-25 15:54:10 +08:00
jxxghp
f132dc38f4 Merge pull request #404 from wikrin/heartbeat 2025-11-25 15:53:04 +08:00
jxxghp
58c70b8ca6 chore: bump version to 2.8.6 in package.json and add global AI assistant settings in locales and AccountSettingSystem.vue 2025-11-23 13:50:35 +08:00
Attente
147f55eefe feat(App): 添加心跳机制通过后端刷新资源访问令牌 2025-11-23 13:40:34 +08:00
jxxghp
229b7b0c12 chore: bump version to 2.8.5 in package.json 2025-11-20 19:37:58 +08:00
jxxghp
4b7b5ff8a4 fix #397 2025-11-20 19:37:33 +08:00
jxxghp
4906bde746 chore: bump version to 2.8.4 in package.json and refactor AccountSettingSystem.vue to streamline AI agent settings 2025-11-20 19:25:28 +08:00
jxxghp
a87a1a8988 Merge pull request #403 from madrays/v2 2025-11-20 19:11:51 +08:00
madrays
e05f45e681 增加自动拉取可用ai模型的易用性功能 2025-11-20 19:01:25 +08:00
jxxghp
b4acacea81 chore: bump version to 2.8.3 in package.json 2025-11-18 12:49:06 +08:00
jxxghp
fa9645b05b Merge pull request #402 from cddjr/trimemedia 2025-11-17 14:21:39 +08:00
景大侠
1ed4052814 fix #401 2025-11-17 14:08:51 +08:00
jxxghp
7dc814461f 更新 package.json 2025-11-16 06:31:32 +08:00
jxxghp
9154ec0e8c Merge pull request #400 from wikrin/cursor-move 2025-11-16 06:30:57 +08:00
jxxghp
3a2ea60583 Merge pull request #399 from wikrin/release_dates 2025-11-16 06:30:31 +08:00
Attente
b36bff3a1e feat(dashboard): 移除 Vue 渲染模式下的固定拖拽图标
更新`docs/module-federation-guide.md` 文档,使用 `v-hover` 实现仅在鼠标悬停时显示拖拽图标。
2025-11-15 18:03:29 +08:00
Attente
b3d8cbf280 feat: 为媒体信息添加数字/实体发行日期支持 2025-11-13 23:52:54 +08:00
jxxghp
38fb02d112 Merge pull request #398 from cddjr/trimemedia 2025-11-05 23:16:28 +08:00
景大侠
2597f893cd rename 2025-11-05 15:26:34 +08:00
景大侠
ebdd036654 避免飞牛媒体库的图片地址携带敏感数据 2025-11-05 15:15:36 +08:00
景大侠
5032f0e6a9 fix 飞牛影视无法显示图片
图片接口增加Cookies参数
2025-11-04 11:32:41 +08:00
jxxghp
ad963d718d refactor: Remove unused AI agent subheader from account settings 2025-11-01 10:39:25 +08:00
jxxghp
69d314bce3 feat: Add AI agent settings and localization support for LLM configuration 2025-10-31 11:46:45 +08:00
jxxghp
4a7425a947 feat: Add download count formatting function and update card components to use it 2025-10-18 20:13:41 +08:00
jxxghp
c172ac0d5c Merge pull request #395 from jxxghp/cursor/add-default-all-filter-for-subscription-styles-ad8f 2025-09-16 13:38:33 +08:00
Cursor Agent
01a66493a8 feat: Add "All" option to genre filter
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 05:37:47 +00:00
jxxghp
188f8b3faa 更新缓存版本至v13 2025-09-16 13:14:17 +08:00
jxxghp
ebcf5fad71 Merge pull request #394 from jxxghp/cursor/update-subscription-sorting-and-scoring-6aa9 2025-09-16 12:26:44 +08:00
Cursor Agent
d1a656db82 Refactor: Move sort filter to top in subscribe views
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 04:25:38 +00:00
Cursor Agent
4f6a11fd7c Refactor subscribe views to use VChipGroup for sorting
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 04:25:02 +00:00
jxxghp
1d09a946bb Merge pull request #393 from jxxghp/cursor/add-sorting-to-subscription-filters-b700 2025-09-16 12:02:21 +08:00
Cursor Agent
6c4eb7edbd Add sorting options to subscribe views and locales
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 03:46:35 +00:00
jxxghp
4f9f669ac6 Merge pull request #392 from jxxghp/cursor/translate-missing-string-and-adjust-slider-max-value-4d93 2025-09-16 11:12:31 +08:00
Cursor Agent
f9e0e78473 Refactor: Remove rating input, display max rating
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 03:10:14 +00:00
Cursor Agent
b004facfca Refactor: Improve rating filter UI and update locale text
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 02:36:16 +00:00
jxxghp
fb6ee2910f 更新 package.json 2025-09-16 09:00:54 +08:00
jxxghp
3fedc9b730 Merge pull request #391 from jxxghp/cursor/update-popular-subscriptions-api-with-filters-9c20 2025-09-16 08:47:41 +08:00
Cursor Agent
b260427312 feat: Add filtering and genre selection to subscribe share
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 00:46:08 +00:00
Cursor Agent
dd1447e93c feat: Add minSubscribers translation to zh-TW locale
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 00:20:27 +00:00
Cursor Agent
dbcc213562 feat: Add subscribe filtering and localization
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-16 00:17:40 +00:00
jxxghp
1c019cd5c8 重构离线页面组件 2025-09-13 14:00:03 +08:00
jxxghp
e37bde77a1 fix https://github.com/jxxghp/MoviePilot/issues/4922 2025-09-13 10:18:41 +08:00
jxxghp
57bf0d2021 优化快捷访问组件的滚动管理 2025-09-12 20:57:29 +08:00
jxxghp
88b00f7069 更新viewport设置 2025-09-12 08:25:21 +08:00
jxxghp
7b08cbb2f7 优化进度对话框 2025-09-11 20:33:14 +08:00
jxxghp
97c0ec184d Fix: Center cache statistics on mobile (#389)
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-11 18:15:38 +08:00
jxxghp
d18c845088 Refactor cache view for better mobile responsiveness (#388)
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-11 18:05:23 +08:00
jxxghp
a64d97774d 优化关于对话框和快捷栏的布局 2025-09-11 17:36:02 +08:00
jxxghp
2ddc51aa4f 调整词表、缓存、关于功能的位置 2025-09-11 15:29:24 +08:00
jxxghp
28afe2a922 统一图标导入方式 2025-09-11 15:03:12 +08:00
jxxghp
c2e97bf191 调整 Vite 配置,增加最大缓存文件大小至 10MB,以支持更大的文件。 2025-09-11 14:40:34 +08:00
jxxghp
c922752a1f Merge pull request #387 from jxxghp/setup-wizard
Setup wizard
2025-09-11 14:32:30 +08:00
jxxghp
08f36a74ca 增强配置向导功能 2025-09-11 14:30:52 +08:00
jxxghp
d7809dd00c 调整配置向导的布局,增加右侧按钮组 2025-09-11 12:36:12 +08:00
jxxghp
27582004da 增强配置向导功能 2025-09-11 08:31:13 +08:00
jxxghp
3d6a176cde 提升配置向导的样式,增加z-index和阴影效果 2025-09-10 17:10:01 +08:00
jxxghp
4a2073a038 优化配置向导 2025-09-10 16:56:06 +08:00
jxxghp
c8a65ecbe4 修复配置向导中的用户信息保存逻辑 2025-09-10 15:23:48 +08:00
jxxghp
3750d5cba0 增强配置向导功能 2025-09-10 14:46:02 +08:00
jxxghp
55b383780e Split setup vue into view components (#386)
* Refactor: Extract setup wizard into composable and components

This commit refactors the setup wizard by extracting its logic into a composable function `useSetupWizard` and breaking down the UI into individual components for better organization and reusability.

Co-authored-by: jxxghp <jxxghp@qq.com>

* Refactor: Move setup wizard components to separate files

This commit refactors the setup wizard by extracting individual steps into their own Vue components. This improves code organization and maintainability.

Co-authored-by: jxxghp <jxxghp@qq.com>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: jxxghp <jxxghp@qq.com>
2025-09-10 11:48:09 +08:00
jxxghp
6aec0ddf88 更新配置向导 2025-09-10 08:51:05 +08:00
jxxghp
7c8e94d1df 更新用户配置 2025-09-10 08:30:19 +08:00
jxxghp
5ecbf626c8 更新用户配置向导 2025-09-09 20:31:00 +08:00
jxxghp
584f580e3b 实现配置向导功能 2025-09-09 13:50:37 +08:00
jxxghp
280de47dac 新增配置向导 2025-09-09 12:43:53 +08:00
jxxghp
c7c05f5897 Merge pull request #385 from cddjr/fix_calendar 2025-09-08 21:39:39 +08:00
景大侠
bb86180582 修复日历可能会空白的问题 2025-09-08 21:33:37 +08:00
jxxghp
aff228edd3 更新 Footer 组件以支持动态显示导航 2025-09-08 19:19:31 +08:00
jxxghp
f65ae6d703 更新 DefaultLayout.vue 2025-09-08 18:38:52 +08:00
jxxghp
0fccc06883 修改 ProgressDialog 组件 2025-09-08 17:38:44 +08:00
jxxghp
8652966645 调整 index.html 和默认布局样式,修改溢出属性以改善页面滚动体验 2025-09-08 16:49:58 +08:00
jxxghp
6d84eb9f09 更新 package.json 版本号至 2.8.0 2025-09-08 16:13:10 +08:00
jxxghp
1a3dccac29 更新 index.html 2025-09-08 16:12:28 +08:00
jxxghp
fa8de34fc5 更新页面样式 2025-09-08 08:49:00 +08:00
jxxghp
10cfd6be80 更新 service-worker.ts 2025-09-02 13:47:57 +08:00
jxxghp
a390b36e7c 更新 package.json 版本号至 2.7.9 2025-09-02 12:35:41 +08:00
jxxghp
d6b5994e22 添加搜索时间间隔选项 2025-09-02 11:48:24 +08:00
jxxghp
08611a97e7 Merge pull request #384 from Aqr-K/feat-v2.7.8-filelist-case-insensitive 2025-08-31 07:51:18 +08:00
Aqr-K
35bbb44ce3 更新 FileList.vue 2025-08-30 21:08:17 +08:00
Aqr-K
8ff879661a fix(file): Simplify the selectMode button. 2025-08-30 20:56:58 +08:00
Aqr-K
a8f01f099d feat(file): Add an ignoreCase button. 2025-08-30 20:54:17 +08:00
jxxghp
040ab1096b 更新 package.json 版本号至 2.7.8 2025-08-28 08:22:51 +08:00
jxxghp
0cbdf24315 fix https://github.com/jxxghp/MoviePilot/issues/4849 2025-08-27 12:32:19 +08:00
jxxghp
164ea79bd1 Use body-lock for quick access background scroll (#382)
* Checkpoint before follow-up message

Co-authored-by: jxxghp <jxxghp@live.cn>

* Replace custom BodyLock with body-scroll-lock library

Co-authored-by: jxxghp <jxxghp@live.cn>

* Fix scroll behavior in QuickAccess panel with targeted scroll disabling

Co-authored-by: jxxghp <jxxghp@live.cn>

---------

Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: jxxghp <jxxghp@live.cn>
2025-08-25 23:10:15 +08:00
jxxghp
97f3435bb3 Prevent scroll when QuickAccess overlay is open (#381)
Co-authored-by: Cursor Agent <cursoragent@cursor.com>
Co-authored-by: jxxghp <jxxghp@live.cn>
2025-08-25 22:46:28 +08:00
jxxghp
63b108ff6b 更新 package.json 2025-08-25 22:19:02 +08:00
jxxghp
b0880cb369 更新 types.ts 2025-08-25 21:48:55 +08:00
jxxghp
5f70ee8e18 更新缓存版本至 v1.1.0 2025-08-25 13:18:38 +08:00
jxxghp
4c64f7a2c3 优化 HTML 结构,调整 CSS 样式 2025-08-25 13:03:45 +08:00
jxxghp
262927e459 fix:整理中的所以取消 2025-08-24 18:50:07 +08:00
jxxghp
b16c566004 fix ui 2025-08-24 18:32:29 +08:00
jxxghp
1af82dbee6 优化 TransferQueueDialog 组件,合并相同 title_year 的媒体记录和任务 2025-08-24 18:25:59 +08:00
jxxghp
2e9a5a4e13 更新 TransferQueueDialog 组件 2025-08-24 18:18:53 +08:00
jxxghp
b455f603dc 调整 TransferQueueDialog 组件 2025-08-24 18:11:36 +08:00
jxxghp
37c0c3e339 优化 TransferQueueDialog 组件的 SSE 连接管理 2025-08-24 18:02:15 +08:00
jxxghp
b6cb341082 fix 整理进度显示 2025-08-24 17:50:03 +08:00
jxxghp
1af1a06700 优化 SSE 管理器 2025-08-24 17:34:43 +08:00
jxxghp
79e4ecfdbe 引入 crypto-js 库以计算文件路径的 MD5 值 2025-08-24 17:05:36 +08:00
jxxghp
1585271e37 为 TransferQueueDialog 组件优化 SSE 监听管理 2025-08-24 16:16:33 +08:00
jxxghp
c240b171e4 更新 package.json 版本号至 2.7.6 2025-08-24 13:03:25 +08:00
jxxghp
9c405e90ac 重构 TransferQueueDialog 组件,添加整体和当前文件进度管理 2025-08-24 13:02:40 +08:00
jxxghp
3ec3212ca5 更新 service-worker.ts 2025-08-24 08:16:14 +08:00
99 changed files with 8683 additions and 2293 deletions

View File

@@ -245,13 +245,21 @@ const props = defineProps({
<template>
<div class="dashboard-widget">
<!-- 仪表板内容 -->
<v-card>
<v-card-title>{{ config.title || '仪表板组件' }}</v-card-title>
<v-card-text>
<!-- 组件内容 -->
</v-card-text>
</v-card>
<v-hover>
<!-- 仪表板内容 -->
<template #default="{ isHovering, props: hoverProps }">
<v-card v-bind="hoverProps">
<v-card-title>{{ config.title || '仪表板组件' }}</v-card-title>
<v-card-text>
<!-- 组件内容 -->
</v-card-text>
<!-- 只在悬停时显示拖拽图标 -->
<div v-show="isHovering" class="absolute right-5 top-5">
<v-icon class="cursor-move">mdi-drag</v-icon>
</div>
</v-card>
</template>
</v-hover>
</div>
</template>
```

View File

@@ -1,430 +1,363 @@
<!DOCTYPE html>
<html
lang="zh-CN"
style="
<html lang="zh-CN" style="
overflow: hidden auto;
min-block-size: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom));
min-block-size: 100vh;
min-block-size: 100dvh;
--safe-area-inset-bottom: env(safe-area-inset-bottom);
--safe-area-inset-top: env(safe-area-inset-top);
background: var(--initial-loader-bg, #fff);
"
>
<head>
<title>MoviePilot</title>
<meta charset="UTF-8" />
<!-- 核心viewport设置 - 针对PWA优化 -->
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover, shrink-to-fit=no"
/>
">
<!-- 防止缩放和选择,提供原生应用体验 -->
<meta name="format-detection" content="telephone=no, date=no, email=no, address=no" />
<head>
<title>MoviePilot</title>
<meta charset="UTF-8" />
<!-- 核心viewport设置 - 针对PWA优化 -->
<meta name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover, shrink-to-fit=no, interactive-widget=resizes-content" />
<!-- 基础信息 -->
<meta name="description" content="MoviePilot - 智能影视媒体库管理工具" />
<meta name="author" content="MoviePilot" />
<meta name="keywords" content="MoviePilot,影视,媒体库,管理" />
<!-- 防止缩放和选择,提供原生应用体验 -->
<meta name="format-detection" content="telephone=no, date=no, email=no, address=no" />
<!-- 安全和隐私 -->
<meta name="Robots" content="noindex,nofollow,noarchive" />
<meta name="referrer" content="no-referrer" />
<!-- 基础信息 -->
<meta name="description" content="MoviePilot - 智能影视媒体库管理工具" />
<meta name="author" content="MoviePilot" />
<meta name="keywords" content="MoviePilot,影视,媒体库,管理" />
<!-- PWA - 基础图标 -->
<link rel="icon" type="image/png" href="/favicon.ico" />
<link rel="icon" type="image/png" href="/logo.png" sizes="any" />
<link rel="icon" type="image/svg+xml" href="/logo.svg" />
<!-- 安全和隐私 -->
<meta name="Robots" content="noindex,nofollow,noarchive" />
<meta name="referrer" content="no-referrer" />
<!-- iOS Safari PWA 优化 -->
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon-precomposed.png" />
<link rel="apple-touch-startup-image" href="/splash/apple-splash.png" />
<!-- PWA - 基础图标 -->
<link rel="icon" type="image/png" href="/favicon.ico" />
<link rel="icon" type="image/png" href="/logo.png" sizes="any" />
<link rel="icon" type="image/svg+xml" href="/logo.svg" />
<!-- iOS Safari 全屏模式 -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="MoviePilot" />
<!-- iOS Safari PWA 优化 -->
<link rel="apple-touch-icon" href="/apple-touch-icon.png" />
<link rel="apple-touch-icon-precomposed" href="/apple-touch-icon.png" />
<link rel="apple-touch-startup-image" href="/splash/apple-splash.png" />
<!-- iOS Safari 防止自动识别 -->
<meta name="apple-mobile-web-app-orientations" content="portrait" />
<!-- iOS Safari 全屏模式 -->
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="apple-mobile-web-app-title" content="MoviePilot" />
<!-- Android Chrome PWA 优化 -->
<meta name="mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="mobile-web-app-title" content="MoviePilot" />
<!-- iOS Safari 防止自动识别 -->
<meta name="apple-mobile-web-app-orientations" content="portrait" />
<!-- Microsoft Windows PWA -->
<meta name="msapplication-TileColor" content="#0E1116" />
<meta name="msapplication-TileImage" content="/android-chrome-192x192.png" />
<meta name="msapplication-config" content="none" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="msapplication-navbutton-color" content="#0E1116" />
<!-- Android Chrome PWA 优化 -->
<meta name="mobile-web-app-capable" content="yes" />
<meta name="mobile-web-app-status-bar-style" content="black-translucent" />
<meta name="mobile-web-app-title" content="MoviePilot" />
<!-- 主题色彩 - 适配深色和浅色模式 -->
<meta name="theme-color" content="#0E1116" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#F4F5FA" media="(prefers-color-scheme: light)" />
<meta name="color-scheme" content="dark light" />
<!-- Microsoft Windows PWA -->
<meta name="msapplication-TileColor" content="#0E1116" />
<meta name="msapplication-TileImage" content="/android-chrome-192x192.png" />
<meta name="msapplication-config" content="none" />
<meta name="msapplication-tap-highlight" content="no" />
<meta name="msapplication-navbutton-color" content="#0E1116" />
<!-- 屏幕方向锁定 -->
<meta name="screen-orientation" content="portrait" />
<meta name="x5-orientation" content="portrait" />
<meta name="x5-fullscreen" content="true" />
<meta name="x5-page-mode" content="app" />
<!-- 主题色彩 - 适配深色和浅色模式 -->
<meta name="theme-color" content="#0E1116" media="(prefers-color-scheme: dark)" />
<meta name="theme-color" content="#F4F5FA" media="(prefers-color-scheme: light)" />
<meta name="color-scheme" content="dark light" />
<!-- UC浏览器优化 -->
<meta name="browsermode" content="application" />
<meta name="wap-font-scale" content="no" />
<!-- 屏幕方向锁定 -->
<meta name="screen-orientation" content="portrait" />
<meta name="x5-orientation" content="portrait" />
<meta name="x5-fullscreen" content="true" />
<meta name="x5-page-mode" content="app" />
<!-- 360浏览器优化 -->
<meta name="renderer" content="webkit" />
<!-- UC浏览器优化 -->
<meta name="browsermode" content="application" />
<meta name="wap-font-scale" content="no" />
<!-- 触摸优化 -->
<meta name="HandheldFriendly" content="True" />
<meta name="MobileOptimized" content="320" />
<!-- 360浏览器优化 -->
<meta name="renderer" content="webkit" />
<!-- 缓存控制 -->
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<!-- 触摸优化 -->
<meta name="HandheldFriendly" content="True" />
<meta name="MobileOptimized" content="320" />
<!-- DNS预解析和预连接 -->
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
<link rel="dns-prefetch" href="//cdn.jsdelivr.net" />
<link rel="dns-prefetch" href="//image.tmdb.org" />
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin />
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
<!-- 缓存控制 -->
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" />
<!-- 预加载关键资源 -->
<link rel="preload" href="/logo.png" as="image" />
<link rel="modulepreload" href="/src/main.ts" />
<!-- DNS预解析和预连接 -->
<link rel="dns-prefetch" href="//fonts.googleapis.com" />
<link rel="dns-prefetch" href="//cdn.jsdelivr.net" />
<link rel="dns-prefetch" href="//image.tmdb.org" />
<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin />
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
<!-- 内联关键CSS -->
<style>
/* 关键路径CSS - 从loader.css内联 */
#loading-bg {
position: fixed;
z-index: 99999;
display: block;
background: var(--initial-loader-bg, #fff);
block-size: 100vh;
inline-size: 100vw;
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
<style>
#app {
block-size: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
}
#loading-bg {
position: fixed;
z-index: 99999;
display: block;
background: var(--initial-loader-bg, #fff);
block-size: 100vh;
inline-size: 100vw;
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
.loading-logo {
position: absolute;
inset-block-start: 35%;
inset-inline-start: calc(50% - 5rem);
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
}
.loading-complete .loading-logo {
filter: blur(10px);
opacity: 0;
transform: scale(1.5);
}
.loading-complete {
filter: blur(15px);
opacity: 0;
transform: scale(1.2);
}
.loading {
position: absolute;
box-sizing: border-box;
border: 3px solid transparent;
border-radius: 50%;
block-size: 55px;
inline-size: 55px;
inset-block-start: 80%;
inset-inline-start: calc(50% - 27.5px);
transition: opacity 0.6s ease;
}
.loading-complete .loading {
opacity: 0;
}
.loading .effect-1,
.loading .effect-2,
.loading .effect-3 {
position: absolute;
box-sizing: border-box;
border: 3px solid transparent;
border-radius: 50%;
block-size: 100%;
border-inline-start: 3px solid var(--initial-loader-color, #eee);
inline-size: 100%;
}
.loading .effect-1 {
animation: rotate 1s ease infinite;
}
.loading .effect-2 {
animation: rotate-opacity 1s ease infinite 0.1s;
}
.loading .effect-3 {
animation: rotate-opacity 1s ease infinite 0.2s;
}
.loading .effects {
transition: all 0.3s ease;
}
@keyframes rotate {
0% {
transform: rotate(0deg);
}
.loading-logo {
position: absolute;
inset-block-start: 35%;
inset-inline-start: calc(50% - 5rem);
transition: opacity 0.8s ease, transform 0.8s ease, filter 0.8s ease;
100% {
transform: rotate(1turn);
}
}
@keyframes rotate-opacity {
0% {
opacity: 0.1;
transform: rotate(0deg);
}
/* 添加logo完成动画 - 放大虚化效果 */
.loading-complete .loading-logo {
filter: blur(10px);
opacity: 0;
transform: scale(1.5);
100% {
opacity: 1;
transform: rotate(1turn);
}
}
/* 添加加载背景消失动画 - 放大虚化效果 */
.loading-complete {
filter: blur(15px);
opacity: 0;
transform: scale(1.2);
/* 超时通知样式 */
#loading-timeout {
position: absolute;
z-index: 2500;
display: none;
inset-block-end: 20px;
inset-inline-start: 50%;
transform: translateX(-50%);
background: rgba(0, 0, 0, 0.8);
color: #fff;
padding: 12px 24px;
border-radius: 12px;
font-size: 14px;
font-family: sans-serif;
text-align: center;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
white-space: nowrap;
backdrop-filter: blur(4px);
border: 1px solid rgba(255, 255, 255, 0.1);
}
#timeout-btn {
color: var(--initial-loader-color, #9155FD);
text-decoration: none;
font-weight: bold;
margin-inline-start: 8px;
border-bottom: 1px solid var(--initial-loader-color, #9155FD);
}
</style>
<script>
// 检测系统主题是否为深色模式
function checkPrefersColorSchemeIsDark() {
try {
return window.matchMedia('(prefers-color-scheme: dark)').matches
} catch (e) {
return false
}
}
.loading {
position: absolute;
box-sizing: border-box;
border: 3px solid transparent;
border-radius: 50%;
block-size: 55px;
inline-size: 55px;
inset-block-start: 80%;
inset-inline-start: calc(50% - 27.5px);
transition: opacity 0.6s ease;
// 主题色彩初始化
let loaderColor = localStorage.getItem('materio-initial-loader-bg')
let primaryColor = localStorage.getItem('materio-initial-loader-color')
// 检查主题设置
const savedTheme = localStorage.getItem('theme') || 'auto'
const isAutoTheme = savedTheme === 'auto'
// 如果是自动主题或者没有保存的背景色,根据系统主题设置背景色
if (isAutoTheme || !loaderColor) {
loaderColor = checkPrefersColorSchemeIsDark() ? '#0E1116' : '#FFFFFF'
}
if (!primaryColor) {
primaryColor = '#9155FD'
}
// 应用主题色彩
document.documentElement.style.setProperty('--initial-loader-bg', loaderColor)
document.documentElement.style.setProperty('--initial-loader-color', primaryColor)
// 状态栏适配
if (window.navigator.standalone) {
document.documentElement.style.setProperty('--status-bar-height', '20px')
}
// 安全区域适配
function updateSafeArea() {
const safeAreaTop = getComputedStyle(document.documentElement).getPropertyValue('env(safe-area-inset-top)')
const safeAreaBottom = getComputedStyle(document.documentElement).getPropertyValue('env(safe-area-inset-bottom)',
)
if (safeAreaTop) document.documentElement.style.setProperty('--safe-area-top', safeAreaTop)
if (safeAreaBottom) document.documentElement.style.setProperty('--safe-area-bottom', safeAreaBottom)
}
updateSafeArea()
window.addEventListener('resize', updateSafeArea)
window.addEventListener('orientationchange', updateSafeArea)
// 清除缓存处理逻辑
window.clearAndReload = async function() {
try {
// 1. 清除所有缓存
if ('caches' in window) {
const cacheNames = await caches.keys()
await Promise.all(cacheNames.map(name => caches.delete(name)))
console.log('[VersionChecker] 已清除所有缓存')
}
// 2. 注销 Service Worker
if ('serviceWorker' in navigator) {
const registrations = await navigator.serviceWorker.getRegistrations()
await Promise.all(registrations.map(registration => registration.unregister()))
console.log('[VersionChecker] 已注销所有 Service Worker')
}
} catch (e) {
console.error('[VersionChecker] 清除缓存时出错:', e)
} finally {
// 3. 重载页面
const url = new URL(window.location.href)
url.searchParams.set('_t', Date.now().toString())
window.location.replace(url.pathname + url.search + url.hash)
}
};
/* 完成时隐藏加载动画 */
.loading-complete .loading {
opacity: 0;
}
.loading .effect-1,
.loading .effect-2,
.loading .effect-3 {
position: absolute;
box-sizing: border-box;
border: 3px solid transparent;
border-radius: 50%;
block-size: 100%;
border-inline-start: 3px solid var(--initial-loader-color, #eee);
inline-size: 100%;
}
.loading .effect-1 {
animation: rotate 1s ease infinite;
}
.loading .effect-2 {
animation: rotate-opacity 1s ease infinite 0.1s;
}
.loading .effect-3 {
animation: rotate-opacity 1s ease infinite 0.2s;
}
.loading .effects {
transition: all 0.3s ease;
}
@keyframes rotate {
0% {
transform: rotate(0deg);
setTimeout(function() {
const timeoutEl = document.getElementById('loading-timeout');
if (timeoutEl) {
// 适配多语言
const lang = navigator.language || 'zh-CN';
const messages = {
'zh-CN': {
text: '页面加载似乎遇到了阻碍,请尝试',
btn: '清除缓存'
},
'zh-TW': {
text: '頁面載入似乎遇到了阻礙,請嘗試',
btn: '清除快取'
},
'en-US': {
text: 'Page loading seems to be blocked, please try',
btn: 'Clear Cache'
}
};
// 默认匹配前缀,如 en-GB 匹配 en-US 的逻辑
let msg = messages['zh-CN'];
if (lang.startsWith('zh-TW') || lang.startsWith('zh-HK')) {
msg = messages['zh-TW'];
} else if (lang.startsWith('en')) {
msg = messages['en-US'];
}
100% {
transform: rotate(1turn);
}
const textNode = document.createTextNode(msg.text + ' ');
const btnLink = document.createElement('a');
btnLink.href = 'javascript:void(0)';
btnLink.id = 'timeout-btn';
btnLink.onclick = window.clearAndReload;
btnLink.textContent = msg.btn;
timeoutEl.innerHTML = '';
timeoutEl.appendChild(textNode);
timeoutEl.appendChild(btnLink);
timeoutEl.style.display = 'block';
}
}, 15000); // 15秒后显示超时提示
</script>
</head>
@keyframes rotate-opacity {
0% {
opacity: 0.1;
transform: rotate(0deg);
}
100% {
opacity: 1;
transform: rotate(1turn);
}
}
</style>
<!-- 初始化脚本 -->
<script>
// 检测系统主题是否为深色模式
function checkPrefersColorSchemeIsDark() {
try {
return window.matchMedia('(prefers-color-scheme: dark)').matches
} catch (e) {
return false
}
}
// 主题色彩初始化
let loaderColor = localStorage.getItem('materio-initial-loader-bg')
let primaryColor = localStorage.getItem('materio-initial-loader-color')
// 检查主题设置
const savedTheme = localStorage.getItem('theme')
const isAutoTheme = savedTheme === 'auto'
// 如果是自动主题或者没有保存的背景色,根据系统主题设置背景色
if (isAutoTheme || !loaderColor) {
loaderColor = checkPrefersColorSchemeIsDark() ? '#0E1116' : '#FFFFFF'
}
if (!primaryColor) {
primaryColor = '#9155FD'
}
// 应用主题色彩
document.documentElement.style.setProperty('--initial-loader-bg', loaderColor)
document.documentElement.style.setProperty('--initial-loader-color', primaryColor)
// 状态栏适配
if (window.navigator.standalone) {
document.documentElement.style.setProperty('--status-bar-height', '20px')
}
// 安全区域适配
function updateSafeArea() {
const safeAreaTop = getComputedStyle(document.documentElement).getPropertyValue('env(safe-area-inset-top)')
const safeAreaBottom = getComputedStyle(document.documentElement).getPropertyValue('env(safe-area-inset-bottom)',
)
if (safeAreaTop) document.documentElement.style.setProperty('--safe-area-top', safeAreaTop)
if (safeAreaBottom) document.documentElement.style.setProperty('--safe-area-bottom', safeAreaBottom)
}
updateSafeArea()
window.addEventListener('resize', updateSafeArea)
window.addEventListener('orientationchange', updateSafeArea)
</script>
</head>
<body style="margin: 0; overflow: hidden; overscroll-behavior: none; -webkit-overflow-scrolling: touch">
<div id="loading-bg">
<div class="loading-logo">
<!-- Logo -->
<svg
width="160px"
height="160px"
viewBox="0 0 192 192"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
style="fill-rule: evenodd; clip-rule: evenodd; stroke-linejoin: round; stroke-miterlimit: 2"
>
<g transform="matrix(1,0,0,1,-2606,-236)">
<g id="a2-c" transform="matrix(1,0,0,1,2606,236)">
<rect x="0" y="0" width="192" height="192" style="fill: none" />
<g transform="matrix(-0.800798,0.462341,-0.769972,-1.33363,1869.11,-896.718)">
<path
d="M2241.27,-28.175C2238.86,-28.931 2236.64,-29.181 2234.48,-29.254L2159.78,-29.286L2165.01,-11.207C2167.16,-13.121 2169.64,-13.722 2172.26,-13.808L2222.12,-13.822C2223.52,-13.824 2225,-13.701 2226.78,-13.108L2241.27,-28.175Z"
style="fill: url(#_Linear1)"
/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path
d="M2205.67,331.428L2205.67,332.25L2205.67,352.835C2205.67,354.263 2204.91,355.583 2203.67,356.298C2202.43,357.012 2200.91,357.013 2199.67,356.3L2190.78,351.174C2189.73,350.595 2188.83,350.083 2188.03,349.59L2187.45,349.257C2186.66,348.725 2185.91,348.142 2185.21,347.461C2185.08,347.331 2184.95,347.198 2184.82,347.061C2184.26,346.457 2183.75,345.778 2183.3,344.995C2182.16,343.05 2181.69,341.024 2181.68,338.948L2181.67,268.923L2209.77,274.425C2207.5,275.639 2205.68,278.3 2205.67,281.429L2205.67,331.428Z"
style="fill: url(#_Linear2)"
/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path
d="M2295.93,363.064C2299.48,360.882 2301.46,357.55 2301.67,352.926L2301.67,277.879L2301.67,276.775L2301.67,252.515C2301.67,251.801 2302.05,251.14 2302.67,250.783C2303.29,250.426 2304.05,250.426 2304.67,250.784L2319.81,259.54C2321.59,260.617 2322.95,262.115 2324.04,263.875C2325.03,265.551 2325.56,267.37 2325.67,269.835L2325.67,339.91C2325.18,343.645 2323.51,346.705 2320.3,348.887L2295.93,363.064ZM2295.93,363.064C2295.73,363.184 2295.53,363.301 2295.32,363.414L2295.93,363.064Z"
style="fill: rgb(141, 81, 249)"
/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path
d="M2295.93,363.064C2299.48,360.882 2301.46,357.55 2301.67,352.926L2301.67,277.879L2301.67,276.775L2301.67,252.515C2301.67,251.801 2302.05,251.14 2302.67,250.783C2303.29,250.426 2304.05,250.426 2304.67,250.784L2319.81,259.54C2321.59,260.617 2322.95,262.115 2324.04,263.875C2325.03,265.551 2325.56,267.37 2325.67,269.835L2325.67,339.91C2325.18,343.645 2323.51,346.705 2320.3,348.887L2295.93,363.064ZM2299.79,360.238C2299.79,360.238 2320.03,348.464 2320.04,348.461C2323.1,346.372 2324.69,343.444 2325.17,339.877C2325.17,339.877 2325.17,269.846 2325.17,269.839C2325.06,267.482 2324.56,265.739 2323.61,264.133C2322.56,262.445 2321.26,261.005 2319.55,259.97L2304.42,251.217C2303.96,250.949 2303.39,250.948 2302.92,251.216C2302.46,251.484 2302.17,251.979 2302.17,252.515L2302.17,276.775L2302.17,277.879L2302.17,352.926C2302.17,352.933 2302.17,352.941 2302.17,352.948C2302.04,355.861 2301.23,358.279 2299.79,360.238Z"
style="fill: url(#_Linear3)"
/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path
d="M2253.67,223.256C2255.26,223.245 2257.02,223.56 2259.11,224.557L2275.67,234.102C2276.91,234.816 2277.67,236.138 2277.67,237.568L2277.67,259.508C2277.67,260.222 2277.29,260.882 2276.67,261.239C2276.05,261.597 2275.29,261.597 2274.67,261.24L2257.52,251.353C2256.38,250.731 2255.12,250.341 2253.67,250.347C2252.26,250.339 2250.99,250.721 2249.82,251.353L2187.87,287.04C2184.23,289.147 2181.96,292.478 2181.67,297.57L2181.68,269.865C2181.85,265.167 2183.93,261.653 2187.92,259.322L2248.23,224.557C2249.69,223.796 2251.5,223.29 2253.67,223.256Z"
style="fill: rgb(165, 118, 255)"
/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path
d="M2253.67,223.256C2255.26,223.245 2257.02,223.56 2259.11,224.557L2275.67,234.102C2276.91,234.816 2277.67,236.138 2277.67,237.568L2277.67,259.508C2277.67,260.222 2277.29,260.882 2276.67,261.239C2276.05,261.597 2275.29,261.597 2274.67,261.24L2257.52,251.353C2256.38,250.731 2255.12,250.341 2253.67,250.347C2252.26,250.339 2250.99,250.721 2249.82,251.353L2187.87,287.04C2184.23,289.147 2181.96,292.478 2181.67,297.57L2181.68,269.865C2181.85,265.167 2183.93,261.653 2187.92,259.322L2248.23,224.557C2249.69,223.796 2251.5,223.29 2253.67,223.256ZM2253.68,223.756C2251.6,223.789 2249.87,224.269 2248.47,224.996L2188.17,259.754C2184.35,261.992 2182.35,265.367 2182.18,269.874C2182.18,269.874 2182.17,292.759 2182.17,292.757C2183.25,290.047 2185.13,288.051 2187.62,286.607L2249.57,250.919C2249.58,250.917 2249.58,250.915 2249.59,250.913C2250.83,250.243 2252.17,249.839 2253.67,249.847C2255.21,249.841 2256.54,250.253 2257.76,250.914C2257.76,250.916 2257.76,250.917 2257.76,250.919L2274.92,260.807C2275.38,261.075 2275.95,261.074 2276.42,260.806C2276.88,260.538 2277.17,260.043 2277.17,259.508L2277.17,237.568C2277.17,236.317 2276.5,235.16 2275.42,234.535C2275.42,234.535 2258.88,225 2258.87,224.996C2256.87,224.049 2255.2,223.746 2253.68,223.756Z"
style="fill: url(#_Linear4)"
/>
</g>
<g transform="matrix(0.800798,0.462341,0.769972,-1.33363,-1677.22,-896.858)">
<path
d="M2241.55,-28.184C2239.1,-28.989 2236.83,-29.204 2234.68,-29.295C2234.68,-29.295 2220.82,-29.3 2215.03,-29.303C2213.48,-29.303 2212.05,-28.808 2211.28,-28.004C2208.65,-25.275 2202.56,-18.936 2199.45,-15.709C2199.07,-15.306 2199.07,-14.809 2199.46,-14.406C2199.85,-14.004 2200.57,-13.758 2201.34,-13.761C2208.36,-13.788 2222.72,-13.845 2222.72,-13.845C2223.98,-13.851 2225.44,-13.657 2227.06,-13.117L2241.55,-28.184Z"
style="fill: rgb(141, 81, 249)"
/>
</g>
<g transform="matrix(-4.32309,0,0,12.4454,9610.35,-1450.35)">
<path
d="M2205.31,121.966C2205.31,121.88 2205.18,121.8 2204.96,121.757C2204.74,121.714 2204.48,121.714 2204.27,121.757C2201.75,122.263 2195.36,123.547 2192.85,124.052C2192.63,124.095 2192.5,124.174 2192.5,124.261C2192.5,124.347 2192.63,124.426 2192.85,124.469C2195.36,124.974 2201.75,126.255 2204.27,126.759C2204.48,126.802 2204.74,126.802 2204.96,126.759C2205.18,126.716 2205.31,126.636 2205.31,126.55C2205.31,125.541 2205.31,122.976 2205.31,121.966Z"
style="fill: rgb(104, 0, 197)"
/>
<clipPath id="_clip5">
<path
d="M2205.31,121.966C2205.31,121.88 2205.18,121.8 2204.96,121.757C2204.74,121.714 2204.48,121.714 2204.27,121.757C2201.75,122.263 2195.36,123.547 2192.85,124.052C2192.63,124.095 2192.5,124.174 2192.5,124.261C2192.5,124.347 2192.63,124.426 2192.85,124.469C2195.36,124.974 2201.75,126.255 2204.27,126.759C2204.48,126.802 2204.74,126.802 2204.96,126.759C2205.18,126.716 2205.31,126.636 2205.31,126.55C2205.31,125.541 2205.31,122.976 2205.31,121.966Z"
/>
</clipPath>
<g clip-path="url(#_clip5)">
<g transform="matrix(0.124502,0.074907,0.206623,-0.0414384,1997.62,-7.40235)">
<path
d="M1726.17,-64.249L1708.16,-72.303L1708.05,-23.514L1721.88,-32.386C1722.96,-33.241 1723.09,-33.944 1723.15,-34.636L1723.15,-54.373C1723.19,-56.238 1724.96,-57.594 1726.87,-56.686L1726.17,-64.249Z"
style="fill: url(#_Linear6)"
/>
</g>
<g transform="matrix(-0.126036,0.0767377,0.569859,0.112933,2435.01,-3.09225)">
<path
d="M1726.17,-45.661L1704.47,-40.254C1706.28,-40.527 1708.14,-40.212 1708.16,-39.416L1708.16,-18.976L1726.17,-18.976L1726.17,-45.661Z"
style="fill: rgb(141, 81, 249)"
/>
</g>
<g transform="matrix(-0.126036,0.0767377,0.569859,0.112933,2435.01,-3.09225)">
<path
d="M1726.17,-45.661L1726.17,-18.976L1708.16,-18.976L1708.16,-39.416C1707.79,-40.732 1704.5,-40.298 1702.68,-40.025L1726.17,-45.661ZM1705.49,-40.491C1706.2,-40.507 1706.87,-40.464 1707.4,-40.327C1708.01,-40.173 1708.48,-39.899 1708.62,-39.436C1708.62,-39.429 1708.62,-39.423 1708.62,-39.416L1708.62,-19.152C1708.62,-19.152 1725.72,-19.152 1725.72,-19.152L1725.72,-45.345L1705.49,-40.491Z"
style="fill: url(#_Radial7)"
/>
</g>
</g>
</g>
</g>
</g>
<defs>
<linearGradient
id="_Linear1"
x1="0"
y1="0"
x2="1"
y2="0"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(-70.0711,-0.927611,1.54482,-42.0752,2233.59,-20.1891)"
>
<stop offset="0" style="stop-color: rgb(141, 81, 249); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(116, 50, 223); stop-opacity: 1" />
</linearGradient>
<linearGradient
id="_Linear2"
x1="0"
y1="0"
x2="1"
y2="0"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(4.78193e-15,-78.0949,78.0949,4.78193e-15,2195.72,354.021)"
>
<stop offset="0" style="stop-color: rgb(141, 81, 249); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(116, 50, 223); stop-opacity: 1" />
</linearGradient>
<linearGradient
id="_Linear3"
x1="0"
y1="0"
x2="1"
y2="0"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(41.6089,41.5866,-41.5866,41.6089,2282.31,262.837)"
>
<stop offset="0" style="stop-color: rgb(211, 187, 255); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(211, 187, 255); stop-opacity: 0" />
</linearGradient>
<linearGradient
id="_Linear4"
x1="0"
y1="0"
x2="1"
y2="0"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(9.25616,16.7005,-16.7005,9.25616,2215,243.712)"
>
<stop offset="0" style="stop-color: rgb(211, 187, 255); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(211, 187, 255); stop-opacity: 0" />
</linearGradient>
<linearGradient
id="_Linear6"
x1="0"
y1="0"
x2="1"
y2="0"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(-0.130164,-61.9937,59.4003,-0.135847,1711.63,-25.7957)"
>
<stop offset="0" style="stop-color: rgb(116, 50, 223); stop-opacity: 1" />
<stop offset="0.51" style="stop-color: rgb(110, 38, 217); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(91, 0, 197); stop-opacity: 1" />
</linearGradient>
<radialGradient
id="_Radial7"
cx="0"
cy="0"
r="1"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(13.8659,4.71436,-12.1609,5.37534,1708.16,-32.287)"
>
<stop offset="0" style="stop-color: rgb(211, 187, 255); stop-opacity: 1" />
<stop offset="1" style="stop-color: rgb(211, 187, 255); stop-opacity: 0" />
</radialGradient>
</defs>
</svg>
</div>
<div class="loading">
<div class="effect-1 effects"></div>
<div class="effect-2 effects"></div>
<div class="effect-3 effects"></div>
</div>
<body style="margin: 0; overflow: hidden; overscroll-behavior: none; -webkit-overflow-scrolling: touch">
<div id="loading-bg">
<div class="loading-logo">
<!-- Logo -->
<img src="/logo.svg" alt="MoviePilot" width="160px" height="160px" />
</div>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>
<div class="loading">
<div class="effect-1 effects"></div>
<div class="effect-2 effects"></div>
<div class="effect-3 effects"></div>
</div>
<!-- 超时提示 - 默认隐藏 -->
<div id="loading-timeout"></div>
</div>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

View File

@@ -1,6 +1,6 @@
{
"name": "moviepilot",
"version": "2.7.5",
"version": "2.9.2",
"private": true,
"type": "module",
"bin": "dist/service.js",
@@ -27,6 +27,7 @@
"@fullcalendar/timegrid": "^6.1.15",
"@fullcalendar/vue3": "^6.1.15",
"@iconify/utils": "^2.2.1",
"@types/crypto-js": "^4.2.2",
"@types/js-cookie": "^3.0.6",
"@vue-flow/background": "^1.3.2",
"@vue-flow/controls": "^1.1.2",
@@ -40,8 +41,10 @@
"ace-builds": "^1.37.4",
"apexcharts": "^4.0.0",
"axios": "^1.7.9",
"body-scroll-lock": "^3.1.5",
"colorthief": "^2.6.0",
"copy-to-clipboard": "^3.3.3",
"crypto-js": "^4.2.0",
"dayjs": "^1.11.13",
"express": "^4.21.2",
"express-http-proxy": "^2.1.1",
@@ -72,6 +75,7 @@
"@intlify/unplugin-vue-i18n": "^6.0.3",
"@originjs/vite-plugin-federation": "^1.4.1",
"@tailwindcss/aspect-ratio": "^0.4.2",
"@types/body-scroll-lock": "^3.1.2",
"@types/lodash-es": "^4.17.12",
"@types/mousetrap": "^1.6.15",
"@types/node": "^20.1.4",

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 54 KiB

After

Width:  |  Height:  |  Size: 102 KiB

53
public/logo.svg Normal file
View File

@@ -0,0 +1,53 @@
<svg width="3em" height="3em" viewBox="0 0 192 192" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<g transform="matrix(1,0,0,1,-2606,-236)">
<g id="a2-c" transform="matrix(1,0,0,1,2606,236)">
<rect x="0" y="0" width="192" height="192" style="fill:none;"/>
<g transform="matrix(-0.800798,0.462341,-0.769972,-1.33363,1869.11,-896.718)">
<path d="M2241.27,-28.175C2238.86,-28.931 2236.64,-29.181 2234.48,-29.254L2159.78,-29.286L2165.01,-11.207C2167.16,-13.121 2169.64,-13.722 2172.26,-13.808L2222.12,-13.822C2223.52,-13.824 2225,-13.701 2226.78,-13.108L2241.27,-28.175Z" style="fill:url(#_Linear1);"/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path d="M2205.67,331.428L2205.67,332.25L2205.67,352.835C2205.67,354.263 2204.91,355.583 2203.67,356.298C2202.43,357.012 2200.91,357.013 2199.67,356.3L2190.78,351.174C2189.73,350.595 2188.83,350.083 2188.03,349.59L2187.45,349.257C2186.66,348.725 2185.91,348.142 2185.21,347.461C2185.08,347.331 2184.95,347.198 2184.82,347.061C2184.26,346.457 2183.75,345.778 2183.3,344.995C2182.16,343.05 2181.69,341.024 2181.68,338.948L2181.67,268.923L2209.77,274.425C2207.5,275.639 2205.68,278.3 2205.67,281.429L2205.67,331.428Z" style="fill:url(#_Linear2);"/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path d="M2295.93,363.064C2299.48,360.882 2301.46,357.55 2301.67,352.926L2301.67,277.879L2301.67,276.775L2301.67,252.515C2301.67,251.801 2302.05,251.14 2302.67,250.783C2303.29,250.426 2304.05,250.426 2304.67,250.784L2319.81,259.54C2321.59,260.617 2322.95,262.115 2324.04,263.875C2325.03,265.551 2325.56,267.37 2325.67,269.835L2325.67,339.91C2325.18,343.645 2323.51,346.705 2320.3,348.887L2295.93,363.064ZM2295.93,363.064C2295.73,363.184 2295.53,363.301 2295.32,363.414L2295.93,363.064Z" style="fill:rgb(141,81,249);"/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path d="M2295.93,363.064C2299.48,360.882 2301.46,357.55 2301.67,352.926L2301.67,277.879L2301.67,276.775L2301.67,252.515C2301.67,251.801 2302.05,251.14 2302.67,250.783C2303.29,250.426 2304.05,250.426 2304.67,250.784L2319.81,259.54C2321.59,260.617 2322.95,262.115 2324.04,263.875C2325.03,265.551 2325.56,267.37 2325.67,269.835L2325.67,339.91C2325.18,343.645 2323.51,346.705 2320.3,348.887L2295.93,363.064ZM2299.79,360.238C2299.79,360.238 2320.03,348.464 2320.04,348.461C2323.1,346.372 2324.69,343.444 2325.17,339.877C2325.17,339.877 2325.17,269.846 2325.17,269.839C2325.06,267.482 2324.56,265.739 2323.61,264.133C2322.56,262.445 2321.26,261.005 2319.55,259.97L2304.42,251.217C2303.96,250.949 2303.39,250.948 2302.92,251.216C2302.46,251.484 2302.17,251.979 2302.17,252.515L2302.17,276.775L2302.17,277.879L2302.17,352.926C2302.17,352.933 2302.17,352.941 2302.17,352.948C2302.04,355.861 2301.23,358.279 2299.79,360.238Z" style="fill:url(#_Linear3);"/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path d="M2253.67,223.256C2255.26,223.245 2257.02,223.56 2259.11,224.557L2275.67,234.102C2276.91,234.816 2277.67,236.138 2277.67,237.568L2277.67,259.508C2277.67,260.222 2277.29,260.882 2276.67,261.239C2276.05,261.597 2275.29,261.597 2274.67,261.24L2257.52,251.353C2256.38,250.731 2255.12,250.341 2253.67,250.347C2252.26,250.339 2250.99,250.721 2249.82,251.353L2187.87,287.04C2184.23,289.147 2181.96,292.478 2181.67,297.57L2181.68,269.865C2181.85,265.167 2183.93,261.653 2187.92,259.322L2248.23,224.557C2249.69,223.796 2251.5,223.29 2253.67,223.256Z" style="fill:rgb(165,118,255);"/>
</g>
<g transform="matrix(1,0,0,1,-2157.67,-208.423)">
<path d="M2253.67,223.256C2255.26,223.245 2257.02,223.56 2259.11,224.557L2275.67,234.102C2276.91,234.816 2277.67,236.138 2277.67,237.568L2277.67,259.508C2277.67,260.222 2277.29,260.882 2276.67,261.239C2276.05,261.597 2275.29,261.597 2274.67,261.24L2257.52,251.353C2256.38,250.731 2255.12,250.341 2253.67,250.347C2252.26,250.339 2250.99,250.721 2249.82,251.353L2187.87,287.04C2184.23,289.147 2181.96,292.478 2181.67,297.57L2181.68,269.865C2181.85,265.167 2183.93,261.653 2187.92,259.322L2248.23,224.557C2249.69,223.796 2251.5,223.29 2253.67,223.256ZM2253.68,223.756C2251.6,223.789 2249.87,224.269 2248.47,224.996L2188.17,259.754C2184.35,261.992 2182.35,265.367 2182.18,269.874C2182.18,269.874 2182.17,292.759 2182.17,292.757C2183.25,290.047 2185.13,288.051 2187.62,286.607L2249.57,250.919C2249.58,250.917 2249.58,250.915 2249.59,250.913C2250.83,250.243 2252.17,249.839 2253.67,249.847C2255.21,249.841 2256.54,250.253 2257.76,250.914C2257.76,250.916 2257.76,250.917 2257.76,250.919L2274.92,260.807C2275.38,261.075 2275.95,261.074 2276.42,260.806C2276.88,260.538 2277.17,260.043 2277.17,259.508L2277.17,237.568C2277.17,236.317 2276.5,235.16 2275.42,234.535C2275.42,234.535 2258.88,225 2258.87,224.996C2256.87,224.049 2255.2,223.746 2253.68,223.756Z" style="fill:url(#_Linear4);"/>
</g>
<g transform="matrix(0.800798,0.462341,0.769972,-1.33363,-1677.22,-896.858)">
<path d="M2241.55,-28.184C2239.1,-28.989 2236.83,-29.204 2234.68,-29.295C2234.68,-29.295 2220.82,-29.3 2215.03,-29.303C2213.48,-29.303 2212.05,-28.808 2211.28,-28.004C2208.65,-25.275 2202.56,-18.936 2199.45,-15.709C2199.07,-15.306 2199.07,-14.809 2199.46,-14.406C2199.85,-14.004 2200.57,-13.758 2201.34,-13.761C2208.36,-13.788 2222.72,-13.845 2222.72,-13.845C2223.98,-13.851 2225.44,-13.657 2227.06,-13.117L2241.55,-28.184Z" style="fill:rgb(141,81,249);"/>
</g>
<g transform="matrix(-4.32309,0,0,12.4454,9610.35,-1450.35)">
<path d="M2205.31,121.966C2205.31,121.88 2205.18,121.8 2204.96,121.757C2204.74,121.714 2204.48,121.714 2204.27,121.757C2201.75,122.263 2195.36,123.547 2192.85,124.052C2192.63,124.095 2192.5,124.174 2192.5,124.261C2192.5,124.347 2192.63,124.426 2192.85,124.469C2195.36,124.974 2201.75,126.255 2204.27,126.759C2204.48,126.802 2204.74,126.802 2204.96,126.759C2205.18,126.716 2205.31,126.636 2205.31,126.55C2205.31,125.541 2205.31,122.976 2205.31,121.966Z" style="fill:rgb(104,0,197);"/>
<clipPath id="_clip5">
<path d="M2205.31,121.966C2205.31,121.88 2205.18,121.8 2204.96,121.757C2204.74,121.714 2204.48,121.714 2204.27,121.757C2201.75,122.263 2195.36,123.547 2192.85,124.052C2192.63,124.095 2192.5,124.174 2192.5,124.261C2192.5,124.347 2192.63,124.426 2192.85,124.469C2195.36,124.974 2201.75,126.255 2204.27,126.759C2204.48,126.802 2204.74,126.802 2204.96,126.759C2205.18,126.716 2205.31,126.636 2205.31,126.55C2205.31,125.541 2205.31,122.976 2205.31,121.966Z"/>
</clipPath>
<g clip-path="url(#_clip5)">
<g transform="matrix(0.124502,0.074907,0.206623,-0.0414384,1997.62,-7.40235)">
<path d="M1726.17,-64.249L1708.16,-72.303L1708.05,-23.514L1721.88,-32.386C1722.96,-33.241 1723.09,-33.944 1723.15,-34.636L1723.15,-54.373C1723.19,-56.238 1724.96,-57.594 1726.87,-56.686L1726.17,-64.249Z" style="fill:url(#_Linear6);"/>
</g>
<g transform="matrix(-0.126036,0.0767377,0.569859,0.112933,2435.01,-3.09225)">
<path d="M1726.17,-45.661L1704.47,-40.254C1706.28,-40.527 1708.14,-40.212 1708.16,-39.416L1708.16,-18.976L1726.17,-18.976L1726.17,-45.661Z" style="fill:rgb(141,81,249);"/>
</g>
<g transform="matrix(-0.126036,0.0767377,0.569859,0.112933,2435.01,-3.09225)">
<path d="M1726.17,-45.661L1726.17,-18.976L1708.16,-18.976L1708.16,-39.416C1707.79,-40.732 1704.5,-40.298 1702.68,-40.025L1726.17,-45.661ZM1705.49,-40.491C1706.2,-40.507 1706.87,-40.464 1707.4,-40.327C1708.01,-40.173 1708.48,-39.899 1708.62,-39.436C1708.62,-39.429 1708.62,-39.423 1708.62,-39.416L1708.62,-19.152C1708.62,-19.152 1725.72,-19.152 1725.72,-19.152L1725.72,-45.345L1705.49,-40.491Z" style="fill:url(#_Radial7);"/>
</g>
</g>
</g>
</g>
</g>
<defs>
<linearGradient id="_Linear1" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-70.0711,-0.927611,1.54482,-42.0752,2233.59,-20.1891)"><stop offset="0" style="stop-color:rgb(141,81,249);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(116,50,223);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear2" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(4.78193e-15,-78.0949,78.0949,4.78193e-15,2195.72,354.021)"><stop offset="0" style="stop-color:rgb(141,81,249);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(116,50,223);stop-opacity:1"/></linearGradient>
<linearGradient id="_Linear3" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(41.6089,41.5866,-41.5866,41.6089,2282.31,262.837)"><stop offset="0" style="stop-color:rgb(211,187,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(211,187,255);stop-opacity:0"/></linearGradient>
<linearGradient id="_Linear4" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(9.25616,16.7005,-16.7005,9.25616,2215,243.712)"><stop offset="0" style="stop-color:rgb(211,187,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(211,187,255);stop-opacity:0"/></linearGradient>
<linearGradient id="_Linear6" x1="0" y1="0" x2="1" y2="0" gradientUnits="userSpaceOnUse" gradientTransform="matrix(-0.130164,-61.9937,59.4003,-0.135847,1711.63,-25.7957)"><stop offset="0" style="stop-color:rgb(116,50,223);stop-opacity:1"/><stop offset="0.51" style="stop-color:rgb(110,38,217);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(91,0,197);stop-opacity:1"/></linearGradient>
<radialGradient id="_Radial7" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse" gradientTransform="matrix(13.8659,4.71436,-12.1609,5.37534,1708.16,-32.287)"><stop offset="0" style="stop-color:rgb(211,187,255);stop-opacity:1"/><stop offset="1" style="stop-color:rgb(211,187,255);stop-opacity:0"/></radialGradient>
</defs>
</svg>

After

Width:  |  Height:  |  Size: 10 KiB

1
shims.d.ts vendored
View File

@@ -12,3 +12,4 @@ declare module 'vue-prism-component' {
export default component
}
declare module 'vue-shepherd';
declare module 'colorthief';

View File

@@ -48,8 +48,7 @@ $header: ".layout-navbar";
/* Ensure header styles are preserved when dialog is opened,
but only if window was scrolled before dialog opened
*/
html.v-overlay-scroll-blocked &.window-scrolled.layout-navbar-fixed,
html.dialog-scroll-locked &.window-scrolled.layout-navbar-fixed {
html.v-overlay-scroll-blocked &.window-scrolled.layout-navbar-fixed {
#{$header} {
padding-inline: 1rem;

View File

@@ -45,7 +45,7 @@ code {
inset-block-start: 0;
inset-inline: 0;
pointer-events: none;
transition: all 0.3s ease-in-out;
transition: padding 0.3s ease-in-out;
.v-theme--light & {
background: rgba(var(--v-theme-surface), 0.6);

View File

@@ -1,5 +1,5 @@
@use "sass:map";
@use "vuetify/lib/styles/settings" as vuetify_settings;
@use "vuetify/lib/styles/settings/_index.sass" as vuetify_settings;
@use "@styles/variables/_vuetify.scss" as vuetify;
@mixin themed($property, $light-value, $dark-value) {

View File

@@ -1,5 +1,7 @@
.auth-wrapper {
min-block-size: calc(var(--vh, 1vh) * 100 + env(safe-area-inset-top) + env(safe-area-inset-bottom));
min-block-size: 100%;
min-block-size: 100vh;
min-block-size: 100dvh;
}
.auth-footer-mask {

View File

@@ -23,6 +23,13 @@ export function kFormatter(num: number) {
: Math.abs(num).toFixed(0).replace(regex, ',')
}
// 格式化下载量显示超过1000显示为x.xk格式
export function formatDownloadCount(num: number): string {
if (!num || num < 1000) return num?.toLocaleString() || '0'
return `${(num / 1000).toFixed(1)}k`
}
/**
* Format and return date in Humanize format
* Intl docs: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/DateTimeFormat/format

View File

@@ -35,6 +35,19 @@ export function urlBase64ToUint8Array(base64String: string) {
return outputArray
}
// Uint8Array 转 Base64URL
export function bufferToBase64Url(buffer: ArrayBuffer): string {
return btoa(String.fromCharCode(...new Uint8Array(buffer)))
.replace(/\+/g, '-')
.replace(/\//g, '_')
.replace(/=/g, '')
}
// Base64URL 转 Uint8Array
export function base64UrlToUint8Array(base64Url: string): Uint8Array {
return Uint8Array.from(atob(base64Url.replace(/-/g, '+').replace(/_/g, '/')), c => c.charCodeAt(0))
}
// 判断是否为PWA
export const isPWA = async (): Promise<boolean> => {
if ('serviceWorker' in navigator) {

View File

@@ -23,9 +23,7 @@ export default defineComponent({
// 监听弹窗状态变化
const checkDialogState = () => {
const wasDialogOpen = isDialogOpen.value
isDialogOpen.value =
document.documentElement.classList.contains('dialog-scroll-locked') ||
document.documentElement.classList.contains('v-overlay-scroll-blocked')
isDialogOpen.value = document.documentElement.classList.contains('v-overlay-scroll-blocked')
// 当弹窗刚打开时,记录当前的滚动状态
if (!wasDialogOpen && isDialogOpen.value) {
@@ -121,7 +119,7 @@ export default defineComponent({
'layout-navbar-fixed',
mdAndDown.value && 'layout-overlay-nav',
route.meta.layoutWrapperClasses,
(scrollDistance.value > 0 || (isDialogOpen.value && wasScrolledBeforeDialog.value)) && 'window-scrolled',
(scrollDistance.value > 5 || (isDialogOpen.value && wasScrolledBeforeDialog.value)) && 'window-scrolled',
],
},
[verticalNav, h('div', { class: 'layout-content-wrapper' }, [navbar, main, footer]), layoutOverlay],

View File

@@ -6,8 +6,8 @@
html {
background: rgb(var(--v-theme-background));
min-block-size: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom));
overflow-y: overlay;
min-block-size: 100vh;
min-block-size: 100dvh;
}
body {
@@ -40,8 +40,8 @@ body,
// TODO: Use grid gutter variable here;
padding-block: 1.5rem;
padding-inline: 0.5rem;
padding-block-start: calc(env(safe-area-inset-top) + 4.5rem);
padding-inline: 0.5rem;
// display: flex;display

View File

@@ -7,5 +7,7 @@
html {
box-sizing: border-box;
min-height: calc(100% + env(safe-area-inset-top) + env(safe-area-inset-bottom))
min-block-size: 100%;
min-block-size: 100vh;
min-block-size: 100dvh;
}

View File

@@ -1,4 +1,4 @@
import type { ValidationRule } from 'vuetify/types/services/validation'
type ValidationRule = (value: any) => string | boolean
// 必输校验
export const requiredValidator: ValidationRule = (value: any) => {

View File

@@ -15,7 +15,7 @@ import { themeManager } from '@/utils/themeManager'
// 生效主题
const { global: globalTheme } = useTheme()
let themeValue = localStorage.getItem('theme') || 'light'
let themeValue = localStorage.getItem('theme') || 'auto'
const autoTheme = checkPrefersColorSchemeIsDark() ? 'dark' : 'light'
globalTheme.name.value = themeValue === 'auto' ? autoTheme : themeValue
@@ -38,6 +38,9 @@ const backgroundImages = ref<string[]>([])
const activeImageIndex = ref(0)
const isTransparentTheme = computed(() => globalTheme.name.value === 'transparent')
// 心跳检测
let heartbeatInterval: number | null = null
// ApexCharts 全局配置
declare global {
interface Window {
@@ -45,6 +48,33 @@ declare global {
}
}
// 启动心跳
const startHeartbeat = () => {
// 如果已经有心跳,则先停止
if (heartbeatInterval) {
stopHeartbeat()
}
// 开始心跳任务
heartbeatInterval = window.setInterval(async () => {
try {
if (isLogin.value) {
await api.get('dashboard/cpu')
}
} catch (error) {
console.warn('Heartbeat request failed:', error)
}
}, 5 * 60 * 1000)
}
// 停止心跳
const stopHeartbeat = () => {
if (heartbeatInterval) {
window.clearInterval(heartbeatInterval)
heartbeatInterval = null
}
}
// 配置 ApexCharts 全局选项
function configureApexCharts() {
if (typeof window !== 'undefined' && window.Apex) {
@@ -207,6 +237,14 @@ async function loadBackgroundImages(retryCount = 0) {
}
onMounted(async () => {
// 移除URL中的时间戳参数
const url = new URL(window.location.href)
if (url.searchParams.has('_t')) {
url.searchParams.delete('_t')
const newUrl = url.pathname + url.search + url.hash
window.history.replaceState(null, '', newUrl)
}
// 配置 ApexCharts
configureApexCharts()
@@ -234,11 +272,15 @@ onMounted(async () => {
ensureRenderComplete(() => {
nextTick(removeLoadingWithStateCheck)
})
// 启动心跳
startHeartbeat()
})
onUnmounted(() => {
// 清除背景轮换定时器
removeBackgroundTimer('background-rotation')
// 停止心跳
stopHeartbeat()
})
</script>

View File

@@ -314,6 +314,8 @@ export interface MediaInfo {
production_countries?: any[]
// 语种
spoken_languages?: string[]
// 数字/实体发行日期
release_dates?: MediaRelease[]
// 状态
status?: string
// 标签
@@ -368,6 +370,18 @@ export interface TmdbSeason {
vote_average?: number
}
// 发行信息
export interface MediaRelease {
// 发行日期
date: string
// 发行地区
iso_code: string
// 备注
note?: string
// 发行类型
type: number
}
// TMDB集信息
export interface TmdbEpisode {
// 上映日期
@@ -520,7 +534,7 @@ export interface SiteUserData {
// 用户名
username?: string
// 用户ID
userid?: number
userid?: string
// 用户等级
user_level?: string
// 加入时间
@@ -992,6 +1006,8 @@ export interface MediaServerPlayItem {
percent?: number
// 媒体服务器类型
server_type?: string
// 图片是否需要Cookies
use_cookies?: boolean
}
// 媒体服务器媒体库
@@ -1014,6 +1030,8 @@ export interface MediaServerLibrary {
link?: string
// 媒体服务器类型
server_type?: string
// 图片是否需要Cookies
use_cookies?: boolean
}
// 消息通知
@@ -1066,6 +1084,8 @@ export interface DownloaderConf {
config: { [key: string]: any }
// 是否启用
enabled: boolean
// 路径映射
path_mapping?: Array<[storagePath: string, downloadPath: string]>
}
// 通知配置

Binary file not shown.

After

Width:  |  Height:  |  Size: 29 KiB

View File

@@ -4,6 +4,12 @@ import FileToolbar from './filebrowser/FileToolbar.vue'
import FileNavigator from './filebrowser/FileNavigator.vue'
import type { EndPoints, FileItem, StorageConf } from '@/api/types'
import { storageIconDict } from '@/api/constants'
import type { AxiosInstance } from 'axios'
// LocalStorage keys
const SORT_KEY = 'fileBrowser.sort'
const SHOW_TREE_KEY = 'fileBrowser.showDirTree'
const NAV_WIDTH_KEY = 'fileBrowser.navigatorWidth'
// 输入参数
const props = defineProps({
@@ -11,7 +17,7 @@ const props = defineProps({
tree: Boolean,
endpoints: Object as PropType<EndPoints>,
axios: {
type: Function,
type: Object as PropType<AxiosInstance>,
required: true,
},
axiosconfig: Object,
@@ -119,22 +125,33 @@ const fileIcons = {
// 加载次数
const loading = ref(0)
// 当前存储
const activeStorage = ref('local')
// 刷新
const refreshPending = ref(false)
// 排序
const sort = ref('name')
// 排序 - 从localStorage恢复
const sort = ref(localStorage.getItem(SORT_KEY) || 'name')
// 是否显示目录树
const showDirTree = ref(false)
// 是否显示目录树 - 从localStorage恢复
const showDirTree = ref(localStorage.getItem(SHOW_TREE_KEY) === 'true')
// 拖动分隔条相关
const navigatorWidth = ref(280) // 初始宽度
// 拖动分隔条相关 - 从localStorage恢复宽度
const navigatorWidth = ref(parseInt(localStorage.getItem(NAV_WIDTH_KEY) || '280'))
const isDragging = ref(false)
const dragStartX = ref(0)
const dragStartWidth = ref(0)
watch(sort, (val) => {
localStorage.setItem(SORT_KEY, val)
})
watch(showDirTree, (val) => {
localStorage.setItem(SHOW_TREE_KEY, String(val))
})
watch(navigatorWidth, (val) => {
localStorage.setItem(NAV_WIDTH_KEY, String(val))
})
// 计算属性
const storagesArray = computed(() => {
return props.storages?.map(item => ({
@@ -144,15 +161,15 @@ const storagesArray = computed(() => {
}))
})
// 方法
function loadingChanged(loading: number) {
if (loading) loading++
else if (loading > 0) loading--
function loadingChanged(isLoading: number) {
if (isLoading) loading.value++
else if (loading.value > 0) loading.value--
}
// 存储切换
async function storageChanged(storage: string) {
activeStorage.value = storage
emit('pathchanged', { storage: storage, path: '/', fileid: 'root' })
}
@@ -235,12 +252,12 @@ function stopDrag() {
<template>
<div class="mx-auto" :loading="loading > 0">
<div v-if="activeStorage && item">
<div v-if="item">
<FileToolbar
:sort="sort"
:item="item"
:itemstack="itemstack"
:storages="storagesArray"
:storage="activeStorage"
:endpoints="endpoints"
:axios="axios"
@storagechanged="storageChanged"
@@ -251,7 +268,7 @@ function stopDrag() {
<div class="flex">
<FileNavigator
v-if="showDirTree"
:storage="activeStorage"
:storage="item.storage"
:currentPath="item.path"
:items="fileListItems"
:endpoints="endpoints"
@@ -266,7 +283,6 @@ function stopDrag() {
</div>
<FileList
:item="item"
:storage="activeStorage"
:icons="fileIcons"
:endpoints="endpoints"
:axios="axios"

View File

@@ -26,7 +26,12 @@ async function goPlay() {
// 计算图片地址
const getImgUrl = computed(() => {
const image = props.media?.image || ''
return `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(image)}`
let url = `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(image)}`
const use_cookies = props.media?.use_cookies
if (use_cookies) {
url += `&use_cookies=${encodeURIComponent(use_cookies)}`
}
return url
})
</script>

View File

@@ -4,12 +4,10 @@ import { formatFileSize } from '@/@core/utils/formatters'
import { DownloaderConf } from '@/api/types'
import { useToast } from 'vue-toastification'
import type { DownloaderInfo } from '@/api/types'
import qbittorrent_image from '@images/logos/qbittorrent.png'
import transmission_image from '@images/logos/transmission.png'
import custom_image from '@images/logos/downloader.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { cloneDeep } from 'lodash-es'
import { useI18n } from 'vue-i18n'
import { downloaderDict } from '@/api/constants'
import { downloaderDict, storageAttributes } from '@/api/constants'
import { useDisplay } from 'vuetify'
import { useBackgroundOptimization } from '@/composables/useBackgroundOptimization'
@@ -54,6 +52,54 @@ const download_rate = ref(0)
// 下载器详情弹窗
const downloaderInfoDialog = ref(false)
// 表单
const downloaderForm = ref()
// 路径前缀选项
const prefixOptions = computed(() => {
return storageAttributes.map(item => ({
title: t(`storage.${item.type}`),
value: item.type,
}))
})
function getStorageType(path: string) {
if (!path) return 'local'
// 查找匹配的存储类型
const storage = storageAttributes.find(s => s.type !== 'local' && path.startsWith(`${s.type}:`))
return storage?.type || 'local'
}
function storage2Prefix(storage: string) {
return storage === 'local' ? '' : storage + ':'
}
// 获取存储路径前后缀
function parseStoragePath(path: string): [prefix: string, suffix: string] {
if (!path) return ['', '']
const storage = getStorageType(path)
const prefix = storage2Prefix(storage)
return [prefix, path.slice(prefix.length)]
}
// 更新存储路径前缀
function updateStoragePrefix(row: PathMappingRow, storage: string) {
const [, currentSuffix] = parseStoragePath(row.storage)
const prefix = storage2Prefix(storage)
row.storage = prefix + currentSuffix
}
// 更新存储路径后缀
function updateStorageSuffix(row: PathMappingRow, suffix: string) {
const [currentPrefix] = parseStoragePath(row.storage)
row.storage = currentPrefix + suffix
}
const pathValidationRules = [
(v: string) => !!v || t('downloader.pathMappingRequired'),
(v: string) => v.startsWith('/') || t('downloader.pathMappingError'),
]
// 下载器详情
const downloaderInfo = ref<DownloaderConf>({
name: '',
@@ -61,8 +107,24 @@ const downloaderInfo = ref<DownloaderConf>({
default: false,
enabled: false,
config: {},
path_mapping: [],
})
// 路径映射行定义
interface PathMappingRow {
id: string
storage: string
download: string
}
// 路径映射行数据
const pathMappingRows = ref<PathMappingRow[]>([])
// 生成随机ID
function generateId() {
return Math.random().toString(36).substring(2, 9)
}
// 下载器是否应该刷新数据的计算属性
const shouldRefresh = computed(() => props.allowRefresh && props.downloader.enabled)
@@ -94,11 +156,24 @@ async function loadDownloaderInfo() {
function openDownloaderInfoDialog() {
// 深复制
downloaderInfo.value = cloneDeep(props.downloader)
// 初始化路径映射行数据
pathMappingRows.value = (downloaderInfo.value.path_mapping || []).map(item => ({
id: generateId(),
storage: item[0],
download: item[1],
}))
downloaderInfoDialog.value = true
}
// 保存详情数据
function saveDownloaderInfo() {
async function saveDownloaderInfo() {
// 表单校验
const { valid } = await downloaderForm.value?.validate()
if (!valid) return
// 同步路径映射数据
downloaderInfo.value.path_mapping = pathMappingRows.value.map(row => [row.storage, row.download])
// 为空不保存,跳出警告框
if (!downloaderInfo.value.name) {
$toast.error(t('downloader.nameRequired'))
@@ -128,14 +203,28 @@ function saveDownloaderInfo() {
const getIcon = computed(() => {
switch (props.downloader.type) {
case 'qbittorrent':
return qbittorrent_image
return getLogoUrl('qbittorrent')
case 'transmission':
return transmission_image
return getLogoUrl('transmission')
default:
return custom_image
return getLogoUrl('downloader')
}
})
// 添加路径映射
function addPathMapping() {
pathMappingRows.value.push({
id: generateId(),
storage: '',
download: '',
})
}
// 移除路径映射
function removePathMapping(index: number) {
pathMappingRows.value.splice(index, 1)
}
// 按钮点击
function onClose() {
emit('close')
@@ -154,6 +243,7 @@ onUnmounted(() => {
stopRefresh()
})
</script>
<template>
<div>
<VHover v-slot="hover">
@@ -214,7 +304,7 @@ onUnmounted(() => {
<VDialogCloseBtn v-model="downloaderInfoDialog" />
<VDivider />
<VCardText>
<VForm>
<VForm ref="downloaderForm">
<VRow>
<VCol cols="12" md="6">
<VSwitch v-model="downloaderInfo.enabled" :label="t('downloader.enabled')" />
@@ -375,6 +465,89 @@ onUnmounted(() => {
/>
</VCol>
</VRow>
<VRow>
<VCol cols="12">
<VDivider class="my-2">
<span class="text-body-1 font-weight-medium">{{ t('downloader.pathMapping') }}</span>
</VDivider>
<div v-if="pathMappingRows.length === 0" class="text-center py-2">
<VIcon icon="mdi-folder-network" size="48" class="text-disabled mb-1" />
<div class="text-body-2 text-disabled">{{ t('common.noData') }}</div>
</div>
<VCard v-for="(row, index) in pathMappingRows" :key="row.id" variant="outlined" class="my-2">
<VCardText class="pa-3">
<VRow align="center" no-gutters>
<VCol cols="12" class="mb-2">
<div class="d-flex align-center mb-1">
<VIcon icon="mdi-folder-outline" size="18" class="me-1 text-primary" />
<span class="text-caption text-medium-emphasis">{{ t('downloader.storagePath') }}</span>
</div>
<VRow no-gutters>
<VCol cols="12" sm="4" class="pe-2">
<VSelect
:model-value="getStorageType(row.storage)"
:items="prefixOptions"
density="compact"
variant="outlined"
hide-details
@update:model-value="v => updateStoragePrefix(row, v)"
/>
</VCol>
<VCol cols="12" sm="8">
<VTextField
:model-value="parseStoragePath(row.storage)[1]"
:placeholder="'/path/to/storage'"
density="compact"
variant="outlined"
hide-details="auto"
:rules="pathValidationRules"
@update:model-value="v => updateStorageSuffix(row, v)"
/>
</VCol>
</VRow>
</VCol>
<VCol cols="12" class="mb-1">
<div class="d-flex align-center justify-center my-1">
<VIcon icon="mdi-arrow-down" size="18" class="text-medium-emphasis" />
</div>
<div class="d-flex align-center mb-1">
<VIcon icon="mdi-download-outline" size="18" class="me-1 text-success" />
<span class="text-caption text-medium-emphasis">{{ t('downloader.downloadPath') }}</span>
</div>
<VTextField
v-model="row.download"
:placeholder="'/path/to/download'"
density="compact"
variant="outlined"
hide-details="auto"
:rules="pathValidationRules"
/>
</VCol>
<VCol cols="12" class="d-flex justify-end pt-1">
<IconBtn variant="text" color="error" size="small" @click="removePathMapping(index)">
<VIcon icon="mdi-delete-outline" />
</IconBtn>
</VCol>
</VRow>
</VCardText>
</VCard>
<VBtn
variant="tonal"
color="primary"
prepend-icon="mdi-plus-circle-outline"
@click="addPathMapping"
class="mt-1"
size="small"
>
{{ t('common.add') }} {{ t('downloader.pathMapping') }}
</VBtn>
</VCol>
</VRow>
</VForm>
</VCardText>
<VCardActions class="pt-3">

View File

@@ -3,7 +3,7 @@ import type { MediaServerLibrary } from '@/api/types'
import plex from '@images/misc/plex.png'
import emby from '@images/misc/emby.png'
import jellyfin from '@images/misc/jellyfin.png'
import trimemedia from '@images/logos/trimemedia.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { openMediaServerWithAutoDetect } from '@/utils/appDeepLink'
// 输入参数
@@ -40,7 +40,7 @@ function getDefaultImage() {
if (props.media?.server_type === 'plex') return plex
else if (props.media?.server_type === 'emby') return emby
else if (props.media?.server_type === 'jellyfin') return jellyfin
else if (props.media?.server_type === 'trimemedia') return trimemedia
else if (props.media?.server_type === 'trimemedia') return getLogoUrl('trimemedia')
else return plex
}
@@ -52,31 +52,39 @@ async function goPlay() {
}
// 生成图片代理路径
function getImgUrl(url: string) {
function getImgUrl(url: string, use_cookies?: boolean) {
if (!url) return getDefaultImage()
else return `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(url)}`
let imgurl = `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(url)}`
if (use_cookies) {
imgurl += `&use_cookies=${encodeURIComponent(use_cookies)}`
}
return imgurl
}
// 根据多张图片生成媒体库封面
async function drawImages(imageList: string[]) {
async function drawImages(imageList: string[], use_cookies?: boolean) {
// 图片
const IMAGES = imageList
if (IMAGES.length === 0) return getDefaultImage()
// 为所有图片添加system/img前缀
for (let i = 0; i < IMAGES.length; i++)
for (let i = 0; i < IMAGES.length; i++) {
IMAGES[i] = `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(IMAGES[i])}`
if (use_cookies) {
IMAGES[i] += `&use_cookies=${encodeURIComponent(use_cookies)}`
}
}
// canvas
const canvas = canvasRef.value
if (!canvas) return getDefaultImage()
// 画布参数
const POSTER_WIDTH = (canvas.width - 40) / 4 // 左右边框8px + 3个间隔24px = 40px
const POSTER_HEIGHT = 256 // 上方海报高256
const MARGIN_WIDTH = 8 // 左右间隔为8
const MARGIN_HEIGHT = 4 // 海报和倒影之间的间隔为4
const REFLECTION_HEIGHT = canvas.height - POSTER_HEIGHT - MARGIN_HEIGHT // 下方倒影使用剩余全部高度
const POSTER_WIDTH = (canvas.width - 40) / 4 // 左右边框8px + 3个间隔24px = 40px
const POSTER_HEIGHT = 256 // 上方海报高256
const MARGIN_WIDTH = 8 // 左右间隔为8
const MARGIN_HEIGHT = 4 // 海报和倒影之间的间隔为4
const REFLECTION_HEIGHT = canvas.height - POSTER_HEIGHT - MARGIN_HEIGHT // 下方倒影使用剩余全部高度
// 获取画布上下文
const ctx = canvas.getContext('2d')
@@ -107,30 +115,20 @@ async function drawImages(imageList: string[]) {
}
const x = MARGIN_WIDTH * index + POSTER_WIDTH * (index - 1)
const y = 0 // 海报紧贴顶部
const y = 0 // 海报紧贴顶部
ctx.drawImage(img, x, y, POSTER_WIDTH, POSTER_HEIGHT)
ctx.save()
ctx.translate(0, canvas.height)
ctx.scale(1, -1)
ctx.drawImage(
img,
0,
0,
img.width,
img.height,
x,
0,
POSTER_WIDTH,
REFLECTION_HEIGHT,
)
ctx.drawImage(img, 0, 0, img.width, img.height, x, 0, POSTER_WIDTH, REFLECTION_HEIGHT)
const gradient = ctx.createLinearGradient(0, 0, 0, canvas.height - (POSTER_HEIGHT + MARGIN_HEIGHT))
gradient.addColorStop(0, 'rgba(0, 0, 0, 1)')
gradient.addColorStop(1, 'rgba(0, 0, 0, 0.7)')
ctx.globalCompositeOperation = 'destination-out';
ctx.globalCompositeOperation = 'destination-out'
ctx.fillStyle = gradient
ctx.fillRect(x, 0, POSTER_WIDTH, REFLECTION_HEIGHT)
@@ -147,8 +145,8 @@ async function drawImages(imageList: string[]) {
onMounted(async () => {
if (props.media?.image_list && props.media?.image_list.length > 0)
imgUrl.value = await drawImages(props.media?.image_list || [])
else imgUrl.value = getImgUrl(props.media?.image || '')
imgUrl.value = await drawImages(props.media?.image_list || [], props.media?.use_cookies)
else imgUrl.value = getImgUrl(props.media?.image || '', props.media?.use_cookies)
})
</script>

View File

@@ -1,8 +1,6 @@
<script lang="ts" setup>
import noImage from '@images/no-image.jpeg'
import tmdbImage from '@images/logos/tmdb.png'
import doubanImage from '@images/logos/douban-black.png'
import bangumiImage from '@images/logos/bangumi.png'
import { getLogoUrl } from '@/utils/imageUtils'
import api from '@/api'
import { useToast } from 'vue-toastification'
import { formatSeason, formatRating } from '@/@core/utils/formatters'
@@ -64,9 +62,9 @@ const seasonsSelected = ref<MediaSeason[]>([])
// 来源角标字典
const sourceIconDict: { [key: string]: any } = {
themoviedb: tmdbImage,
douban: doubanImage,
bangumi: bangumiImage,
themoviedb: getLogoUrl('tmdb'),
douban: getLogoUrl('douban-black'),
bangumi: getLogoUrl('bangumi'),
}
// 绑定MediaCard元素

View File

@@ -1,11 +1,7 @@
<script setup lang="ts">
import { MediaServerConf, MediaServerLibrary, MediaStatistic } from '@/api/types'
import { useToast } from 'vue-toastification'
import emby_image from '@images/logos/emby.png'
import jellyfin_image from '@images/logos/jellyfin.png'
import plex_image from '@images/logos/plex.png'
import trimemedia_image from '@images/logos/trimemedia.png'
import custom_image from '@images/logos/mediaserver.png'
import { getLogoUrl } from '@/utils/imageUtils'
import api from '@/api'
import { cloneDeep } from 'lodash-es'
import { useI18n } from 'vue-i18n'
@@ -109,15 +105,15 @@ function saveMediaServerInfo() {
const getIcon = computed(() => {
switch (props.mediaserver.type) {
case 'emby':
return emby_image
return getLogoUrl('emby')
case 'jellyfin':
return jellyfin_image
return getLogoUrl('jellyfin')
case 'trimemedia':
return trimemedia_image
return getLogoUrl('trimemedia')
case 'plex':
return plex_image
return getLogoUrl('plex')
default:
return custom_image
return getLogoUrl('mediaserver')
}
})
@@ -262,6 +258,16 @@ onMounted(() => {
prepend-inner-icon="mdi-play-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="mediaServerInfo.config.username"
:label="t('mediaserver.username')"
:hint="t('mediaserver.usernameHint')"
persistent-hint
active
prepend-inner-icon="mdi-account"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="mediaServerInfo.config.apikey"

View File

@@ -1,12 +1,6 @@
<script setup lang="ts">
import { NotificationConf } from '@/api/types'
import wechat_image from '@images/logos/wechat.png'
import telegram_image from '@images/logos/telegram.webp'
import vocechat_image from '@images/logos/vocechat.png'
import synologychat_image from '@images/logos/synologychat.png'
import slack_image from '@images/logos/slack.webp'
import chrome_image from '@images/logos/chrome.png'
import custom_image from '@images/logos/notification.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { useToast } from 'vue-toastification'
import { cloneDeep } from 'lodash-es'
import { useI18n } from 'vue-i18n'
@@ -55,6 +49,7 @@ const notificationTypeNames: { [key: string]: string } = {
vocechat: t('notification.vocechat.name'),
synologychat: t('notification.synologychat.name'),
slack: t('notification.slack.name'),
discord: t('notification.discord.name'),
webpush: t('notification.webpush.name'),
custom: t('setting.notification.custom'),
}
@@ -99,19 +94,21 @@ function saveNotificationInfo() {
const getIcon = computed(() => {
switch (props.notification.type) {
case 'wechat':
return wechat_image
return getLogoUrl('wechat')
case 'telegram':
return telegram_image
return getLogoUrl('telegram')
case 'vocechat':
return vocechat_image
return getLogoUrl('vocechat')
case 'synologychat':
return synologychat_image
return getLogoUrl('synologychat')
case 'slack':
return slack_image
return getLogoUrl('slack')
case 'discord':
return getLogoUrl('discord')
case 'webpush':
return chrome_image
return getLogoUrl('chrome')
default:
return custom_image
return getLogoUrl('notification')
}
})
@@ -356,6 +353,47 @@ function onClose() {
/>
</VCol>
</VRow>
<VRow v-else-if="notificationInfo.type == 'discord'">
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
persistent-hint
prepend-inner-icon="mdi-label"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.DISCORD_BOT_TOKEN"
:label="t('notification.discord.botToken')"
:hint="t('notification.discord.botTokenHint')"
persistent-hint
prepend-inner-icon="mdi-key-variant"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.DISCORD_GUILD_ID"
:label="t('notification.discord.guildId')"
:placeholder="t('notification.discord.guildIdPlaceholder')"
:hint="t('notification.discord.guildIdHint')"
persistent-hint
prepend-inner-icon="mdi-pound"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.DISCORD_CHANNEL_ID"
:label="t('notification.discord.channelId')"
:placeholder="t('notification.discord.channelIdPlaceholder')"
:hint="t('notification.discord.channelIdHint')"
persistent-hint
prepend-inner-icon="mdi-pound-box"
/>
</VCol>
</VRow>
<VRow v-else-if="notificationInfo.type == 'synologychat'">
<VCol cols="12" md="6">
<VTextField

View File

@@ -3,9 +3,10 @@ import { useToast } from 'vue-toastification'
import VersionHistory from '../misc/VersionHistory.vue'
import api from '@/api'
import type { Plugin } from '@/api/types'
import noImage from '@images/logos/plugin.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { getDominantColor } from '@/@core/utils/image'
import { isNullOrEmptyObject } from '@/@core/utils'
import { formatDownloadCount } from '@/@core/utils/formatters'
import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
import { useI18n } from 'vue-i18n'
@@ -103,7 +104,7 @@ async function installPlugin() {
// 计算图标路径
const iconPath: Ref<string> = computed(() => {
if (imageLoadError.value) return noImage
if (imageLoadError.value) return getLogoUrl('plugin')
// 如果是网络图片则使用代理后返回
if (props.plugin?.plugin_icon?.startsWith('http'))
return `${import.meta.env.VITE_API_BASE_URL}system/img/1?imgurl=${encodeURIComponent(
@@ -244,7 +245,7 @@ const dropdownItems = ref([
</div>
<div v-if="props.count" class="ms-2 flex-shrink-0 download-count align-middle items-center">
<VIcon size="small" icon="mdi-download" />
<span class="text-sm">{{ props.count?.toLocaleString() }}</span>
<span class="text-sm">{{ formatDownloadCount(props.count) }}</span>
</div>
</div>
<div class="absolute bottom-0 right-0">
@@ -327,7 +328,7 @@ const dropdownItems = ref([
}}</VBtn>
<div class="text-xs mt-2" v-if="props.count">
<VIcon icon="mdi-fire" />{{
t('plugin.totalDownloads', { count: props.count?.toLocaleString() })
t('plugin.totalDownloads', { count: formatDownloadCount(props.count) })
}}
</div>
</div>

View File

@@ -4,8 +4,9 @@ import { useConfirm } from '@/composables/useConfirm'
import api from '@/api'
import type { Plugin } from '@/api/types'
import { isNullOrEmptyObject } from '@core/utils'
import noImage from '@images/logos/plugin.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { getDominantColor } from '@/@core/utils/image'
import { formatDownloadCount } from '@/@core/utils/formatters'
import VersionHistory from '@/components/misc/VersionHistory.vue'
import ProgressDialog from '../dialog/ProgressDialog.vue'
import PluginConfigDialog from '../dialog/PluginConfigDialog.vue'
@@ -167,7 +168,7 @@ async function showPluginConfig() {
// 计算图标路径
const iconPath: Ref<string> = computed(() => {
if (imageLoadError.value) return noImage
if (imageLoadError.value) return getLogoUrl('plugin')
// 如果是网络图片则使用代理后返回
if (props.plugin?.plugin_icon?.startsWith('http'))
return `${import.meta.env.VITE_API_BASE_URL}system/img/1?imgurl=${encodeURIComponent(
@@ -492,7 +493,7 @@ watch(
</div>
<span v-if="props.count" class="ms-2 flex-shrink-0 download-count items-center align-middle">
<VIcon size="small" icon="mdi-download" />
<span class="text-sm">{{ props.count?.toLocaleString() }}</span>
<span class="text-sm">{{ formatDownloadCount(props.count) }}</span>
</span>
</div>
<div class="absolute bottom-0 right-0">

View File

@@ -28,7 +28,12 @@ function getChipColor(type: string) {
const getImgUrl = computed(() => {
if (imageLoadError.value) return noImage
const image = props.media?.image || ''
return `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(image)}`
let url = `${import.meta.env.VITE_API_BASE_URL}system/img/0?imgurl=${encodeURIComponent(image)}`
const use_cookies = props.media?.use_cookies
if (use_cookies) {
url += `&use_cookies=${encodeURIComponent(use_cookies)}`
}
return url
})
// 跳转播放

View File

@@ -1,6 +1,6 @@
<script lang="ts" setup>
import type { PropType } from 'vue'
import noImage from '@images/logos/site.webp'
import { getLogoUrl } from '@/utils/imageUtils'
import { useToast } from 'vue-toastification'
import { useI18n } from 'vue-i18n'
import SiteAddEditDialog from '../dialog/SiteAddEditDialog.vue'
@@ -62,7 +62,7 @@ async function getSiteIcon() {
try {
siteIcon.value = (await api.get(`site/icon/${cardProps.site?.id}`)).data.icon
if (!siteIcon.value) {
siteIcon.value = noImage
siteIcon.value = getLogoUrl('site')
}
} catch (error) {
console.error(error)

View File

@@ -0,0 +1,414 @@
<script lang="ts" setup>
import { formatDateDifference } from '@/@core/utils/formatters'
import api from '@/api'
import { clearCachesAndServiceWorker, reloadWithTimestamp } from '@/composables/useVersionChecker'
import { useI18n } from 'vue-i18n'
import { useDisplay } from 'vuetify'
// 国际化
const { t } = useI18n()
// APP版本
const appVersion = __APP_VERSION__
// 定义事件
const emit = defineEmits(['close'])
// 显示器
const display = useDisplay()
// 系统环境变量
const systemEnv = ref<any>({})
// 所有Release
const allRelease = ref<any>([])
// 支持站点
const supportingSites = ref<any>({})
// 支持站点折叠状态
const sitesExpanded = ref(false)
// 去重后的支持站点
const uniqueSupportingSites = computed(() => {
const sitesMap = new Map()
Object.entries(supportingSites.value).forEach(([domain, site]: [string, any]) => {
if (!sitesMap.has(site.name)) {
sitesMap.set(site.name, {
name: site.name,
urls: [{ domain, url: site.url }],
})
} else {
sitesMap.get(site.name).urls.push({ domain, url: site.url })
}
})
return Array.from(sitesMap.values())
})
// 显示的支持站点折叠时只显示前5个
const displayedSites = computed(() => {
if (sitesExpanded.value) {
return uniqueSupportingSites.value
}
return uniqueSupportingSites.value.slice(0, 5)
})
// 变更日志对话框
const releaseDialog = ref(false)
// 最新版本
const latestRelease = ref('')
// 变更日志对话框标题
const releaseDialogTitle = ref('')
// 变更日志对话框内容
const releaseDialogBody = ref('')
// 打开日志对话框
function showReleaseDialog(title: string, body: string) {
releaseDialogTitle.value = title
releaseDialogBody.value = body.replaceAll('\r\n', '<br />')
releaseDialog.value = true
}
// 查询系统环境变量
async function querySystemEnv() {
try {
const result: { [key: string]: any } = await api.get('system/env')
systemEnv.value = result.data
} catch (error) {
console.log(error)
}
}
// 查询所有Release
async function queryAllRelease() {
try {
const result: { [key: string]: any } = await api.get('system/versions')
allRelease.value = result.data ?? []
// 最新版本
if (allRelease.value.length > 0) latestRelease.value = allRelease.value[0].tag_name
} catch (error) {
console.log(error)
}
}
// 查询支持站点
async function querySupportingSites() {
try {
supportingSites.value = await api.get('site/supporting')
} catch (error) {
console.log(error)
}
}
// 切换站点列表展开状态
function toggleSitesExpanded() {
sitesExpanded.value = !sitesExpanded.value
}
// 计算发布时间
function releaseTime(releaseDate: string) {
// 上一次更新时间
return formatDateDifference(releaseDate)
}
// 强制清除缓存
async function clearCache() {
await clearCachesAndServiceWorker()
// 刷新页面,添加时间戳参数以强制更新
reloadWithTimestamp()
}
onMounted(() => {
querySystemEnv()
queryAllRelease()
querySupportingSites()
})
</script>
<template>
<VDialog max-width="50rem" scrollable :fullscreen="!display.mdAndUp.value">
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-information" class="me-2" />
{{ t('setting.about.title') }}
</VCardTitle>
<VDialogCloseBtn @click="emit('close')" />
</VCardItem>
<VDivider />
<VCardText>
<div class="px-3">
<div class="section">
<div class="section border-gray-800">
<dl>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.softwareVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.VERSION }}</code>
<a
v-if="latestRelease === systemEnv.VERSION"
href="https://github.com/jxxghp/MoviePilot/releases"
target="_blank"
rel="noopener noreferrer"
>
<span
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap bg-green-500 bg-opacity-80 border border-green-500 !text-green-100 ml-2 !cursor-pointer transition hover:bg-green-400"
>
{{ t('setting.about.latest') }}
</span>
</a>
</span>
</dd>
</div>
</div>
<div v-if="systemEnv.FRONTEND_VERSION">
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.frontendVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.FRONTEND_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.browserVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ appVersion }}</code>
<VBtn
size="x-small"
variant="tonal"
class="ms-2"
@click="clearCache"
>
<template #prepend>
<VIcon icon="mdi-refresh" size="14" />
</template>
{{ t('setting.about.clearCache') }}
</VBtn>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.authVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.AUTH_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.indexerVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.INDEXER_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.configDir') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all">
<code>{{ systemEnv.CONFIG_DIR }}</code>
</span>
</dd>
</div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.dataDir') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all"
><code>{{ t('setting.about.dataDirectory') }}</code></span
>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.timezone') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all">
<code>{{ systemEnv.TZ }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.supportingSites') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<div class="flex flex-col gap-2">
<div class="flex flex-wrap gap-2 mt-1 ms-1">
<VChip v-for="site in displayedSites" :key="site.name" variant="outlined" size="small">
<span class="truncate max-w-32">{{ site.name }}</span>
</VChip>
<VChip
v-if="!sitesExpanded && uniqueSupportingSites.length > 5"
variant="tonal"
size="small"
@click="toggleSitesExpanded"
>
<span> {{ uniqueSupportingSites.length }}+ ...</span>
</VChip>
<VChip
v-if="sitesExpanded && uniqueSupportingSites.length > 5"
variant="tonal"
size="small"
@click="toggleSitesExpanded"
>
<span>< {{ t('setting.about.collapse') }}</span>
</VChip>
</div>
</div>
</dd>
</div>
</div>
</dl>
</div>
</div>
<div class="section">
<div>
<h3 class="heading">{{ t('setting.about.support') }}</h3>
</div>
<div class="section border-t border-gray-800">
<dl>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.documentation') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all">
<a
href="https://movie-pilot.org"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://movie-pilot.org
</a>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.feedback') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all">
<a
href="https://github.com/jxxghp/MoviePilot/issues/new/choose"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://github.com/jxxghp/MoviePilot/issues/new/choose
</a>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.channel') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow break-all">
<a
href="https://t.me/moviepilot_channel"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://t.me/moviepilot_channel
</a>
</span>
</dd>
</div>
</div>
</dl>
</div>
</div>
<div class="section">
<div>
<h3 class="heading">{{ t('setting.about.versions') }}</h3>
<div class="section space-y-3">
<div>
<div
v-for="release in allRelease"
:key="release.tag_name"
class="mb-3 flex w-full flex-col space-y-3 rounded-md px-4 py-2 ring-1 ring-gray-400 sm:flex-row sm:space-y-0 sm:space-x-3"
>
<div class="flex w-full flex-grow items-center justify-start space-x-2 truncate sm:justify-start">
<span class="truncate text-lg font-bold">
<span class="mr-2 whitespace-nowrap text-xs font-normal">{{
releaseTime(release.published_at)
}}</span>
{{ release.tag_name }}
</span>
<span
v-if="release.tag_name === latestRelease"
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap cursor-default bg-green-500 bg-opacity-80 border border-green-500 !text-green-100"
>
{{ t('setting.about.latestVersion') }}
</span>
<span
v-if="release.tag_name === systemEnv.VERSION"
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap cursor-default bg-indigo-500 bg-opacity-80 border border-indigo-500 !text-indigo-100"
>
{{ t('setting.about.currentVersion') }}
</span>
</div>
<VBtn @click.stop="showReleaseDialog(release.tag_name, release.body)">
<template #prepend>
<VIcon icon="mdi-text-box-outline" />
</template>
{{ t('setting.about.viewChangelog') }}
</VBtn>
</div>
</div>
</div>
</div>
</div>
</div>
</VCardText>
</VCard>
<VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
<VCard>
<VCardItem>
<VDialogCloseBtn @click="releaseDialog = false" />
<VCardTitle>{{ releaseDialogTitle }} {{ t('setting.about.changelog') }}</VCardTitle>
</VCardItem>
<VCardText v-html="releaseDialogBody" />
</VCard>
</VDialog>
</VDialog>
</template>
<style type="scss" scoped>
.heading {
font-size: 1.5rem;
font-weight: 700;
line-height: 2rem;
--tw-text-opacity: 1;
}
.section {
margin-block: 0.5rem 2.5rem;
}
</style>

View File

@@ -6,10 +6,20 @@ import type { DownloaderConf, MediaInfo, TorrentInfo, TransferDirectoryConf } fr
import { formatFileSize } from '@/@core/utils/formatters'
import { VCardTitle, VChip } from 'vuetify/lib/components/index.mjs'
import { useI18n } from 'vue-i18n'
import MediaIdSelector from '../misc/MediaIdSelector.vue'
import { numberValidator } from '@/@validators'
import { useGlobalSettingsStore } from '@/stores'
// 多语言支持
const { t } = useI18n()
// 从 provide 中获取全局设置
const globalSettingsStore = useGlobalSettingsStore()
const globalSettings = globalSettingsStore.globalSettings
// 当前识别类型
const mediaSource = ref(globalSettings.RECOGNIZE_SOURCE || 'themoviedb')
// 输入参数
const props = defineProps({
title: String,
@@ -38,6 +48,18 @@ const directories = ref<TransferDirectoryConf[]>([])
// 是否正在加载
const loading = ref(false)
// 是否显示高级选项
const showAdvancedOptions = ref(false)
// TMDB ID
const tmdbid = ref<number | undefined>(undefined)
// 豆瓣ID
const doubanId = ref<string | undefined>(undefined)
// TMDB选择对话框
const mediaSelectorDialog = ref(false)
// 计算按钮图标
const icon = computed(() => (loading.value ? 'mdi-progress-download' : 'mdi-download'))
@@ -56,9 +78,21 @@ async function loadDirectories() {
}
}
function convertToUri(item: TransferDirectoryConf) {
if (!item.download_path) {
return undefined
}
if (item.storage === 'local') {
return item.download_path
}
return item.storage + ':' + item.download_path
}
// 获取保存目录
const targetDirectories = computed(() => {
const downloadDirectories = directories.value.map(item => item.download_path)
const downloadDirectories = directories.value
.map(item => convertToUri(item))
.filter((item): item is string => item !== undefined)
return [...new Set(downloadDirectories)]
})
@@ -96,6 +130,14 @@ async function addDownload() {
payload.media_in = props.media
}
// 添加媒体ID辅助识别
if (tmdbid.value) {
payload.tmdbid = tmdbid.value
}
if (doubanId.value) {
payload.doubanid = doubanId.value
}
const endpoint = props.media ? 'download/' : 'download/add'
result = await api.post(endpoint, payload)
@@ -202,6 +244,56 @@ onMounted(() => {
/>
</VCol>
</VRow>
<VRow class="px-5 mt-2">
<VCol cols="12">
<VBtn
variant="text"
size="small"
:prepend-icon="showAdvancedOptions ? 'mdi-chevron-up' : 'mdi-chevron-down'"
@click="showAdvancedOptions = !showAdvancedOptions"
>
{{
showAdvancedOptions
? t('dialog.addDownload.hideAdvancedOptions')
: t('dialog.addDownload.showAdvancedOptions')
}}
</VBtn>
</VCol>
</VRow>
<VRow v-show="showAdvancedOptions" class="px-5">
<VCol cols="12">
<VTextField
v-if="mediaSource === 'themoviedb'"
v-model="tmdbid"
:label="t('dialog.reorganize.tmdbId')"
:placeholder="t('dialog.reorganize.mediaIdPlaceholder')"
:rules="[numberValidator]"
append-inner-icon="mdi-magnify"
:hint="t('dialog.reorganize.mediaIdHint')"
persistent-hint
prepend-inner-icon="mdi-identifier"
size="small"
variant="underlined"
density="comfortable"
@click:append-inner="mediaSelectorDialog = true"
/>
<VTextField
v-else
v-model="doubanId"
:label="t('dialog.reorganize.doubanId')"
:placeholder="t('dialog.reorganize.mediaIdPlaceholder')"
:rules="[numberValidator]"
append-inner-icon="mdi-magnify"
:hint="t('dialog.reorganize.mediaIdHint')"
persistent-hint
prepend-inner-icon="mdi-identifier"
size="small"
variant="underlined"
density="comfortable"
@click:append-inner="mediaSelectorDialog = true"
/>
</VCol>
</VRow>
</VCardText>
<VCardText class="text-center">
<VBtn variant="elevated" :disabled="loading" @click="addDownload" :prepend-icon="icon" class="px-5">
@@ -209,5 +301,15 @@ onMounted(() => {
</VBtn>
</VCardText>
</VCard>
<!-- 媒体ID选择器 -->
<VDialog v-model="mediaSelectorDialog" width="40rem" scrollable max-height="85vh">
<MediaIdSelector
v-if="mediaSource === 'themoviedb'"
v-model="tmdbid"
@close="mediaSelectorDialog = false"
:type="mediaSource"
/>
<MediaIdSelector v-else v-model="doubanId" @close="mediaSelectorDialog = false" :type="mediaSource" />
</VDialog>
</VDialog>
</template>

View File

@@ -122,7 +122,7 @@ function loadRecentSearches() {
function getMenus(): NavMenu[] {
let menus: NavMenu[] = []
// 导航菜单
getNavMenus().forEach(
getNavMenus(t).forEach(
item =>
item &&
menus.push({
@@ -134,7 +134,7 @@ function getMenus(): NavMenu[] {
}),
)
// 设置标签页
getSettingTabs().forEach(
getSettingTabs(t).forEach(
item =>
item &&
menus.push({

View File

@@ -1,10 +1,12 @@
<script lang="ts" setup>
import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
import { formatFileSize } from '@/@core/utils/formatters'
import api from '@/api'
import { FileItem, TransferQueue } from '@/api/types'
import { useDisplay } from 'vuetify'
import { useI18n } from 'vue-i18n'
import { useBackgroundOptimization } from '@/composables/useBackgroundOptimization'
import CryptoJS from 'crypto-js'
// 多语言支持
const { t } = useI18n()
@@ -18,11 +20,14 @@ const emit = defineEmits(['close'])
// 数据列表
const dataList = ref<TransferQueue[]>([])
// 整进度文本
const progressText = ref(t('dialog.transferQueue.processing'))
// 整进度相关 - 根据完成的文件计算
const overallProgress = ref({
value: 0,
text: t('dialog.transferQueue.processing'),
})
// 整理进度
const progressValue = ref(0)
// 文件进度映射
const fileProgressMap = ref<Map<string, { enable: boolean; value: number }>>(new Map())
// 数据可刷新标志
const refreshFlag = ref(false)
@@ -33,6 +38,9 @@ const progressActive = ref(false)
// 活动标签
const activeTab = ref('')
// 定时器引用
const queueTimer = ref<NodeJS.Timeout | null>(null)
// 状态标签
const stateDict: { [key: string]: string } = {
'waiting': t('dialog.transferQueue.waitingState'),
@@ -50,9 +58,18 @@ function getStateColor(state: string) {
else return 'error'
}
// 从dataList中提取所有的媒体信息
// 从dataList中提取所有的媒体信息合并相同title_year的记录
const mediaList = computed(() => {
return dataList.value.map(item => item.media)
const mediaMap = new Map<string, any>()
dataList.value.forEach(item => {
const titleYear = item.media.title_year || ''
if (!mediaMap.has(titleYear)) {
mediaMap.set(titleYear, item.media)
}
})
return Array.from(mediaMap.values())
})
// 按media计算总数和完成数返回 x/x
@@ -66,17 +83,49 @@ function getMediaCount(title_year: string) {
return `${completed} / ${total}`
}
// 根据媒体信息获取对应的整理任务
// 根据媒体信息获取对应的整理任务合并相同title_year的所有任务
const activeTasks = computed(() => {
return dataList.value.find(item => item.media.title_year === activeTab.value)?.tasks
const tasks = dataList.value.filter(item => item.media.title_year === activeTab.value).flatMap(item => item.tasks)
return tasks
})
// 根据媒体title_year获取对应的任务列表
function getTasksByMedia(title_year: string) {
return dataList.value.filter(item => item.media.title_year === title_year).flatMap(item => item.tasks)
}
// 计算整体进度
const overallProgressComputed = computed(() => {
if (dataList.value.length === 0) return 0
const allTasks = dataList.value.flatMap(item => item.tasks)
const totalTasks = allTasks.length
const completedTasks = allTasks.filter(task => task.state === 'completed').length
return totalTasks > 0 ? (completedTasks / totalTasks) * 100 : 0
})
// 获取文件进度
function getFileProgress(filePath: string) {
return fileProgressMap.value.get(filePath) || { enable: false, value: 0 }
}
// 调用API获取队列信息
async function get_transfer_queue() {
try {
dataList.value = await api.get('transfer/queue')
if (dataList.value.length > 0) {
if (!activeTab.value || activeTasks.value?.length == 0) activeTab.value = dataList.value[0].media.title_year || ''
// 如果有数据且SSE未启动则启动SSE监听
if (!progressActive.value) {
startLoadingProgress()
}
} else {
// 如果没有数据停止SSE监听
if (progressActive.value) {
stopLoadingProgress()
}
}
} catch (error) {
console.error(error)
@@ -93,86 +142,164 @@ async function remove_queue_task(fileitem: FileItem) {
}
}
// 进度SSE消息处理函数
function handleProgressMessage(event: MessageEvent) {
const progress = JSON.parse(event.data)
if (progress) {
if (!progress.enable) {
progressText.value = t('dialog.transferQueue.processing')
progressValue.value = 0
if (refreshFlag.value) {
refreshFlag.value = false
get_transfer_queue()
}
return
}
progressText.value = progress.text
progressValue.value = progress.value
if (progress.value >= 100 && refreshFlag.value) {
refreshFlag.value = false
get_transfer_queue()
} else {
if (progress.value > 0 && refreshFlag.value && progress.text?.includes('整理完成')) {
refreshFlag.value = false
get_transfer_queue()
} else {
refreshFlag.value = true
// 文件进度SSE消息处理函数
function createFileProgressHandler(filePath: string) {
return function handleFileProgressMessage(event: MessageEvent) {
try {
const progress = JSON.parse(event.data)
if (progress) {
fileProgressMap.value.set(filePath, {
enable: progress.enable || false,
value: progress.value || 0,
})
}
} catch (error) {
console.error('解析文件进度消息失败:', error)
}
}
}
// 使用优化的进度SSE连接
const progressSSE = useProgressSSE(
`${import.meta.env.VITE_API_BASE_URL}system/progress/filetransfer`,
handleProgressMessage,
'transfer-queue-progress',
progressActive,
// 文件进度SSE连接映射
const fileProgressSSEMap = ref<Map<string, any>>(new Map())
// 启动文件进度监听
function startFileProgress(filePath: string) {
if (fileProgressSSEMap.value.has(filePath)) {
return // 已经存在连接
}
// filePath计算md5
const filePathMd5 = CryptoJS.MD5(filePath).toString()
// 使用包含文件路径的唯一监听器ID
const uniqueListenerId = `transfer-queue-file-progress-${filePathMd5}`
const fileProgressUrl = `${import.meta.env.VITE_API_BASE_URL}system/progress/${filePathMd5}`
const fileProgressSSE = useProgressSSE(
fileProgressUrl,
createFileProgressHandler(filePath),
uniqueListenerId,
progressActive,
)
fileProgressSSE.start()
fileProgressSSEMap.value.set(filePath, fileProgressSSE)
}
// 停止所有文件进度监听
function stopAllFileProgress() {
fileProgressSSEMap.value.forEach((sse, filePath) => {
sse.stop()
})
fileProgressSSEMap.value.clear()
fileProgressMap.value.clear()
}
// 监听队列变化自动管理文件进度SSE
watch(
dataList,
newDataList => {
// 获取当前正在运行的文件路径集合
const currentRunningFiles = new Set<string>()
newDataList.forEach(item => {
item.tasks.forEach(task => {
if (task.state === 'running') {
currentRunningFiles.add(task.fileitem.path)
}
})
})
// 获取当前已建立SSE连接的文件路径集合
const currentSSEFiles = new Set(fileProgressSSEMap.value.keys())
// 停止不再需要的SSE连接
currentSSEFiles.forEach(filePath => {
if (!currentRunningFiles.has(filePath)) {
const sse = fileProgressSSEMap.value.get(filePath)
if (sse) {
sse.stop()
fileProgressSSEMap.value.delete(filePath)
}
// 清除对应的进度数据
fileProgressMap.value.delete(filePath)
}
})
// 为新的运行中文件建立SSE连接
currentRunningFiles.forEach(filePath => {
if (!fileProgressSSEMap.value.has(filePath)) {
startFileProgress(filePath)
}
})
},
{ deep: true },
)
// 使用SSE监听加载进度
function startLoadingProgress() {
progressText.value = t('dialog.transferQueue.processing')
overallProgress.value.text = t('dialog.transferQueue.processing')
progressActive.value = true
progressSSE.start()
}
// 停止监听加载进度
function stopLoadingProgress() {
progressActive.value = false
progressSSE.stop()
// 只有在没有数据时才停止所有文件进度监听
if (dataList.value.length === 0) {
stopAllFileProgress()
}
}
// 启动定时获取队列
function startQueueTimer() {
// 清除可能存在的定时器
if (queueTimer.value) {
clearInterval(queueTimer.value)
}
// 立即执行一次
get_transfer_queue()
// 设置3秒定时器
queueTimer.value = setInterval(() => {
get_transfer_queue()
}, 3000)
}
// 停止定时获取队列
function stopQueueTimer() {
if (queueTimer.value) {
clearInterval(queueTimer.value)
queueTimer.value = null
}
}
onMounted(() => {
get_transfer_queue()
startLoadingProgress()
startQueueTimer()
})
onUnmounted(() => {
stopQueueTimer()
stopLoadingProgress()
})
</script>
<template>
<VDialog scrollable max-width="50rem" :fullscreen="!display.mdAndUp.value">
<VDialog scrollable max-width="60rem" :fullscreen="!display.mdAndUp.value">
<VCard class="mx-auto" width="100%">
<VCardItem>
<VCardTitle>{{ t('dialog.transferQueue.title') }}</VCardTitle>
</VCardItem>
<VDialogCloseBtn @click="emit('close')" />
<VDivider />
<VProgressLinear
v-if="dataList.length > 0 && progressValue > 0"
:value="progressValue"
color="primary"
indeterminate
:height="2"
/>
<VCardItem v-if="dataList.length > 0 && progressValue > 0" class="text-center pt-2">
<span class="text-sm">{{ progressText }}</span>
</VCardItem>
<VCardText v-if="dataList.length === 0" class="text-center"> {{ t('dialog.transferQueue.noTasks') }} </VCardText>
<VCardText>
<!-- 整体进度显示 -->
<VProgressLinear v-if="dataList.length > 0" :model-value="overallProgressComputed" color="primary" />
<VDivider v-else />
<VCardText v-if="dataList.length === 0" class="text-center">
{{ t('dialog.transferQueue.noTasks') }}
</VCardText>
<VCardText v-if="dataList.length > 0">
<VTabs v-model="activeTab" show-arrows class="v-tabs-pill" stacked>
<VTab
v-for="media in mediaList"
@@ -186,16 +313,34 @@ onUnmounted(() => {
<VWindow v-model="activeTab" class="mt-5 disable-tab-transition" :touch="false">
<VWindowItem v-for="media in mediaList" :value="media.title_year">
<VList>
<VListItem v-for="task in activeTasks">
<VListItem v-for="task in getTasksByMedia(media.title_year || '')" :key="task.fileitem.path">
<VListItemTitle>{{ task.fileitem.name }}</VListItemTitle>
<VListItemSubtitle>
<VListItemSubtitle class="py-1">
{{ t('dialog.transferQueue.sizeTitle') }}{{ formatFileSize(task.fileitem.size || 0) }}
<VChip size="small" :color="getStateColor(task.state)" class="ms-2">
<VChip size="small" :color="getStateColor(task.state)" class="mx-2">
{{ stateDict[task.state] }}
</VChip>
</VListItemSubtitle>
<!-- 文件进度显示 -->
<div v-if="task.state === 'running' && getFileProgress(task.fileitem.path).enable" class="mt-2">
<VProgressLinear
:model-value="getFileProgress(task.fileitem.path).value"
color="success"
class="mb-1"
:height="3"
/>
<div class="text-xs text-medium-emphasis text-center">
{{ getFileProgress(task.fileitem.path).value.toFixed(1) }}%
</div>
</div>
<template #append>
<IconBtn size="small" icon="mdi-cancel" @click="remove_queue_task(task.fileitem)" />
<IconBtn
size="small"
icon="mdi-cancel"
@click="remove_queue_task(task.fileitem)"
:disabled="task.state === 'completed'"
/>
</template>
</VListItem>
</VList>

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { AxiosRequestConfig } from 'axios'
import type { AxiosRequestConfig, AxiosInstance } from 'axios'
import type { PropType } from 'vue'
import { useConfirm } from '@/composables/useConfirm'
import { useToast } from 'vue-toastification'
@@ -26,10 +26,9 @@ const { appMode } = usePWA()
// 输入参数
const inProps = defineProps({
icons: Object,
storage: String,
endpoints: Object as PropType<EndPoints>,
axios: {
type: Function,
type: Object as PropType<AxiosInstance>,
required: true,
},
refreshpending: Boolean,
@@ -82,6 +81,9 @@ const items = ref<FileItem[]>([])
// 过滤条件
const filter = ref('')
// 是否忽略大小写
const ignoreCase = ref(true)
// 重命名弹窗
const renamePopper = ref(false)
@@ -112,12 +114,26 @@ const dropdownItems = ref<{ [key: string]: any }[]>([])
// 进度是否激活
const progressActive = ref(false)
// 通用过滤
const getFilteredItems = (type: 'dir' | 'file') => {
const filterValue = filter.value
if (!filterValue) {
return items.value.filter(item => item.type === type)
}
if (ignoreCase.value) {
const lowerCaseFilter = filterValue.toLowerCase()
return items.value.filter(item => item.type === type && item.name.toLowerCase().includes(lowerCaseFilter))
} else {
return items.value.filter(item => item.type === type && item.name.includes(filterValue))
}
}
// 目录过滤
const dirs = computed(() => items.value.filter(item => item.type === 'dir' && item.name.includes(filter.value)))
const dirs = computed(() => getFilteredItems('dir'))
// 文件过滤
const files = computed(() => items.value.filter(item => item.type === 'file' && item.name.includes(filter.value)))
const files = computed(() => getFilteredItems('file'))
// 是否文件
const isFile = computed(() => inProps.item.type == 'file')
@@ -166,6 +182,8 @@ function changeSelectMode() {
// 调API加载文件夹内的内容
async function list_files() {
loading.value = true
const takeURISnapshot = () => [inProps.item.storage, inProps.item.path].join(':/');
const prevURI = takeURISnapshot();
emit('loading', true)
// 参数
@@ -178,7 +196,12 @@ async function list_files() {
}
// 加载数据
items.value = (await inProps.axios.request(config)) ?? []
const data = ((await inProps.axios.request<FileItem[], FileItem[]>(config))) ?? []
// 如果当前路径已经变化,则放弃此次加载结果
if (prevURI !== takeURISnapshot()) {
return;
}
items.value = data
emit('loading', false)
loading.value = false
@@ -277,7 +300,7 @@ async function download(item: FileItem) {
responseType: 'blob',
}
// 加载数据
const result: Blob = await inProps.axios.request(config)
const result: Blob = (await inProps.axios.request<Blob, Blob>(config))
if (result) {
const downloadUrl = URL.createObjectURL(result)
window.open(downloadUrl, '_blank')
@@ -295,7 +318,7 @@ async function getImgLink(item: FileItem) {
responseType: 'blob',
}
// 加载二进制数据
const result: Blob = await inProps.axios.request(config)
const result: Blob = (await inProps.axios.request<Blob, Blob>(config))
if (result) {
// 创建图片地址
currentImgLink.value = URL.createObjectURL(result)
@@ -372,7 +395,7 @@ async function rename() {
method: inProps.endpoints?.rename.method || 'post',
data: currentItem.value,
}
const result: { [key: string]: any } = await inProps.axios?.request(config)
const result: { [key: string]: any } = (await inProps.axios?.request<any, { [key: string]: any }>(config))
if (!result.success) {
$toast.error(result.message)
}
@@ -429,9 +452,9 @@ watch(
},
)
// 监听item变化或者storage变化
// 监听item变化
watch(
[() => inProps.item, () => inProps.storage],
[() => inProps.item],
async () => {
// 清空列表
items.value = []
@@ -533,7 +556,7 @@ async function scrape(item: FileItem, confirm: boolean = true) {
progressDialog.value = true
progressText.value = t('file.scraping', { path: item.path })
const result: { [key: string]: any } = await api.post(`media/scrape/${inProps.storage}`, item)
const result: { [key: string]: any } = await api.post(`media/scrape/${inProps.item.storage}`, item)
// 关闭进度条
progressDialog.value = false
@@ -622,9 +645,11 @@ onMounted(() => {
rounded
/>
<VSpacer v-if="isFile" />
<IconBtn v-if="!isFile" @click="ignoreCase = !ignoreCase">
<VIcon :color="ignoreCase ? 'primary' : 'error'" icon="mdi-format-letter-case" />
</IconBtn>
<IconBtn v-if="!isFile" @click="changeSelectMode">
<VIcon color="primary" v-if="selectMode"> mdi-selection-remove </VIcon>
<VIcon color="primary" v-else>mdi-select</VIcon>
<VIcon color="primary" :icon="selectMode ? 'mdi-selection-remove' : 'mdi-select'" />
</IconBtn>
<IconBtn v-if="isFile" @click="recognize(inProps.item.path || '')">
<VIcon color="primary"> mdi-text-recognition </VIcon>
@@ -789,7 +814,7 @@ onMounted(() => {
v-if="transferPopper"
v-model="transferPopper"
:items="transferItems"
:target_storage="inProps.storage"
:target_storage="inProps.item.storage"
@done="transferDone"
@close="transferPopper = false"
/>

View File

@@ -2,7 +2,7 @@
import type { PropType } from 'vue'
import type { FileItem } from '@/api/types'
import { useDisplay } from 'vuetify'
import type { AxiosRequestConfig } from 'axios'
import type { AxiosRequestConfig, AxiosInstance } from 'axios'
import { useI18n } from 'vue-i18n'
import { usePWA } from '@/composables/usePWA'
@@ -42,7 +42,7 @@ const availableHeight = computed(() => {
const props = defineProps({
storage: {
type: String,
default: 'local',
required: true,
},
currentPath: {
type: String,
@@ -54,7 +54,7 @@ const props = defineProps({
},
endpoints: Object,
axios: {
type: Function,
type: Object as PropType<AxiosInstance>,
required: true,
},
})
@@ -131,7 +131,7 @@ async function loadSubdirectories(path: string) {
data: fakeItem,
}
const result = await props.axios?.request(config)
const result = (await props.axios?.request(config))
if (result && Array.isArray(result)) {
// 过滤出目录项
const dirs = result.filter(item => item.type === 'dir')
@@ -223,7 +223,7 @@ watch(
watch(
() => props.items,
newItems => {
if (newItems && newItems.length > 0) {
if (newItems) {
// 过滤出目录项
const dirs = newItems.filter(item => item.type === 'dir')
@@ -283,9 +283,6 @@ onMounted(async () => {
await loadRootDirectories()
})
onActivated(() => {
updateHeight()
})
</script>
<template>
@@ -309,7 +306,6 @@ onActivated(() => {
<span>{{ t('file.rootDirectory') }}</span>
</div>
</div>
<!-- 加载根目录 -->
<div v-if="loading['/']" class="tree-loading">
<VProgressCircular indeterminate size="24" color="primary" class="ma-2" />

View File

@@ -1,5 +1,5 @@
<script lang="ts" setup>
import type { AxiosRequestConfig } from 'axios'
import type { AxiosRequestConfig, AxiosInstance } from 'axios'
import type { EndPoints, FileItem } from '@/api/types'
import { useDisplay } from 'vuetify'
import { useI18n } from 'vue-i18n'
@@ -13,7 +13,6 @@ const display = useDisplay()
// 输入参数
const inProps = defineProps({
storages: Array as PropType<any[]>,
storage: String,
item: {
type: Object as PropType<FileItem>,
required: true,
@@ -24,9 +23,13 @@ const inProps = defineProps({
},
endpoints: Object as PropType<EndPoints>,
axios: {
type: Function,
type: Object as PropType<AxiosInstance>,
required: true,
},
sort: {
type: String,
default: 'name',
},
})
// 对外事件
@@ -38,15 +41,10 @@ const newFolderPopper = ref(false)
// 新建文件名称
const newFolderName = ref('')
// 排序方式
const sort = ref('name')
// 调整排序方式
function changeSort() {
if (sort.value === 'name') sort.value = 'time'
else sort.value = 'name'
emit('sortchanged', sort.value)
const newSort = inProps.sort === 'name' ? 'time' : 'name'
emit('sortchanged', newSort)
}
// 计算PATH面包屑
@@ -67,12 +65,12 @@ const pathSegments = computed(() => {
// 当前存储
const storageObject = computed(() => {
return inProps.storages?.find(item => item.value === inProps.storage)
return inProps.storages?.find(item => item.value === inProps.item.storage)
})
// 切换存储
function changeStorage(code: string) {
if (inProps.storage !== code) {
if (inProps.item.storage!== code) {
emit('storagechanged', code)
}
}
@@ -113,7 +111,7 @@ async function mkdir() {
// 计算排序图标
const sortIcon = computed(() => {
if (sort.value === 'time') return 'mdi-sort-clock-ascending-outline'
if (inProps.sort === 'time') return 'mdi-sort-clock-ascending-outline'
else return 'mdi-sort-alphabetical-ascending'
})
</script>

View File

@@ -10,7 +10,6 @@ const props = defineProps({
root: {
type: String,
default: '/',
required: true,
},
storage: {
type: String,

View File

@@ -91,10 +91,6 @@ onUnmounted(() => {
<!-- Vue 渲染模式 -->
<div v-if="pluginRenderMode === 'vue'">
<component :is="dynamicPluginComponent" :config="props.config" :allow-refresh="props.allowRefresh" :api="api" />
<!-- Vue 模式下也可以显示拖拽句柄 -->
<div class="absolute right-5 top-5">
<VIcon class="cursor-move">mdi-drag</VIcon>
</div>
</div>
<!-- Vuetify 渲染模式 -->
<VHover v-else-if="pluginRenderMode === 'vuetify'">

View File

@@ -0,0 +1,82 @@
<template>
<div class="version-update-toast">
<span class="message">{{ message }}</span>
<button v-if="refreshText" class="refresh-button" @click="handleRefresh">
{{ refreshText }}
</button>
<div v-else class="spinner"></div>
</div>
</template>
<script setup lang="ts">
// 接收 props
interface Props {
message: string
refreshText?: string
onRefresh?: () => void
}
const props = defineProps<Props>()
const handleRefresh = () => {
if (props.onRefresh) {
props.onRefresh()
} else {
window.location.reload()
}
}
</script>
<style scoped>
.version-update-toast {
display: flex;
align-items: center;
gap: 12px;
}
.message {
flex: 1;
word-break: break-all;
line-height: 1.4;
}
.refresh-button {
padding: 6px 16px;
background-color: #fff;
color: #333;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 14px;
font-weight: 500;
white-space: nowrap;
flex-shrink: 0;
transition: all 0.2s;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.refresh-button:hover {
background-color: #f5f5f5;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
.refresh-button:active {
transform: scale(0.98);
}
.spinner {
width: 16px;
height: 16px;
border: 2px solid rgba(255, 255, 255, 0.3);
border-top-color: #fff;
border-radius: 50%;
animation: spin 0.8s linear infinite;
flex-shrink: 0;
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
</style>

View File

@@ -25,7 +25,8 @@ export function useBackgroundOptimization() {
connectDelay?: number // 新增:连接延迟
},
) => {
const manager = sseManagerSingleton.getManager(url, options)
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, options)
const isConnected = ref(false)
onMounted(() => {
@@ -101,7 +102,8 @@ export function useBackgroundOptimization() {
delay: number = 3000,
options?: Parameters<typeof useSSE>[3],
) => {
const manager = sseManagerSingleton.getManager(url, options)
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, options)
onMounted(() => {
setTimeout(() => {
@@ -133,7 +135,8 @@ export function useBackgroundOptimization() {
listenerId: string,
isActive: Ref<boolean>,
) => {
const manager = sseManagerSingleton.getManager(url, {
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, {
backgroundCloseDelay: 1000, // 进度SSE更快关闭
reconnectDelay: 1000,
maxReconnectAttempts: 5,

View File

@@ -12,6 +12,16 @@ const globalPwaStatus = ref<{
const globalLoading = ref(false)
let initPromise: Promise<void> | null = null
// UI模式设置
export type UIMode = 'auto' | 'desktop' | 'app'
const uiMode = ref<UIMode>((localStorage.getItem('ui-mode') as UIMode) || 'auto')
// 设置UI模式
function setUIMode(mode: UIMode) {
uiMode.value = mode
localStorage.setItem('ui-mode', mode)
}
// 全局初始化函数
async function initializePWAGlobally() {
if (initPromise) return initPromise
@@ -50,6 +60,8 @@ export function usePWA() {
})
const appMode = computed(() => {
if (uiMode.value === 'app') return true
if (uiMode.value === 'desktop') return false
return pwaMode.value && display.mdAndDown.value
})
@@ -70,6 +82,8 @@ export function usePWA() {
pwaMode,
appMode,
pwaStatus,
uiMode,
setUIMode,
loading: globalLoading,
initializePWA: initializePWAGlobally,
}

View File

@@ -236,16 +236,15 @@ export function usePullDownGesture(options: PullDownOptions = {}) {
}
}
// PWA状态确定后一次性决定是否添加事件监听器
// 监听 appMode 变化动态添加/移除事件监听器
onMounted(() => {
// 等待PWA检测完成后添加事件监听器
const stopWatcher = watch(
watch(
appMode,
newValue => {
if (newValue) {
addEventListeners()
// PWA状态确定后停止监听
stopWatcher()
} else {
removeEventListeners()
}
},
{ immediate: true },

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,174 @@
import { ref, h } from 'vue'
import { useToast } from 'vue-toastification'
import { Workbox } from 'workbox-window'
import i18n from '@/plugins/i18n'
import VersionUpdateToast from '@/components/toast/VersionUpdateToast.vue'
// 全局状态
const currentVersion = ref(__APP_VERSION__)
let isUpdateToastShown = false
let wb: Workbox | null = null
/**
* 普通刷新页面
*/
export const reloadPage = (): void => {
window.location.reload()
}
/**
* 刷新页面并添加时间戳
*/
export const reloadWithTimestamp = (): void => {
const url = new URL(window.location.href)
url.searchParams.set('_t', Date.now().toString())
window.location.replace(url.pathname + url.search + url.hash)
}
/**
* 清除所有缓存和 Service Worker
*/
export const clearCachesAndServiceWorker = async (): Promise<void> => {
try {
// 1. 清除所有缓存
if ('caches' in window) {
const cacheNames = await caches.keys()
await Promise.all(cacheNames.map(name => caches.delete(name)))
console.log('[VersionChecker] 已清除所有缓存')
}
// 2. 注销 Service Worker
if ('serviceWorker' in navigator) {
const registrations = await navigator.serviceWorker.getRegistrations()
await Promise.all(registrations.map(registration => registration.unregister()))
console.log('[VersionChecker] 已注销所有 Service Worker')
}
} catch (error) {
console.error('[VersionChecker] 清除缓存失败:', error)
}
}
/**
* 清除缓存并刷新
*/
const clearCacheAndReload = async (): Promise<void> => {
await clearCachesAndServiceWorker()
reloadWithTimestamp()
}
/**
* 版本检查 Composable
*
* 功能:
* - 使用 Workbox 监听 Service Worker 更新
* - 检查浏览器版本与服务端版本是否一致
* - 显示持久化更新通知
*/
export function useVersionChecker() {
const toast = useToast()
/**
* 显示版本更新通知
* @param message 通知消息文本
* @param refreshText 按钮文本,不传则不显示按钮
* @param onRefresh 按钮点击事件
*/
const showUpdateNotification = (message: string, refreshText?: string, onRefresh?: () => void): void => {
if (isUpdateToastShown) return
isUpdateToastShown = true
const component = h(VersionUpdateToast, {
message,
refreshText,
onRefresh,
})
toast.info(component, {
timeout: false, // 不自动消失
closeButton: false,
closeOnClick: false,
draggable: false,
})
}
// 初始化 Workbox
if (!wb && 'serviceWorker' in navigator) {
wb = new Workbox('/service-worker.js')
// Service Worker 激活事件 (install -> activate)
wb.addEventListener('activated', event => {
// 只有在更新时才显示通知
if (event.isUpdate) {
console.log('[VersionChecker] Service Worker 更新已就绪,等待用户刷新')
showUpdateNotification(i18n.global.t('common.swUpdateReady'), i18n.global.t('common.refresh'), reloadPage)
}
})
// 注册 Service Worker
wb.register()
}
/**
* 检查版本并在需要时显示更新通知
* @param latestVersion 服务端返回的最新版本号
*/
const checkVersion = async (latestVersion: string): Promise<void> => {
// 如果已经显示过通知,说明已经检查过了
if (isUpdateToastShown) return
// 版本一致,无需操作
if (latestVersion === currentVersion.value) {
console.log('[VersionChecker] 版本号一致,无需操作')
return
}
console.log(`[VersionChecker] 检测到版本不一致: ${currentVersion.value} -> ${latestVersion}`)
// 尝试触发 Service Worker 更新检查
if ('serviceWorker' in navigator && navigator.serviceWorker.controller) {
try {
const registration = await navigator.serviceWorker.getRegistration()
if (registration) {
console.log('[VersionChecker] 触发 Service Worker 更新检查...')
// 标记是否发现更新
let updateFound = false
const onUpdateFound = () => {
updateFound = true
}
// 监听 updatefound 事件
registration.addEventListener('updatefound', onUpdateFound, { once: true })
// 等待检查完成
await registration.update()
// 检查是否有更新正在进行
// 如果发现更新,或者正在安装/等待中,则直接返回(交由 SW activated 事件处理)
if (updateFound || registration.installing || registration.waiting) {
console.log('[VersionChecker] Service Worker 更新中...')
return
}
console.log('[VersionChecker] SW 无更新,但版本号不一致,可能是缓存问题')
}
} catch (error) {
console.log('[VersionChecker] Service Worker 更新检查失败:', error)
// 失败继续向下执行,显示通知
}
} else {
console.log('[VersionChecker] 无 Service Worker, 直接显示通知')
}
// 最终兜底:显示版本不一致通知(清除缓存)
showUpdateNotification(
i18n.global.t('common.versionMismatch'),
i18n.global.t('common.clearCache'),
clearCacheAndReload,
)
}
return {
checkVersion,
}
}

View File

@@ -197,7 +197,7 @@ const {
// 根据分类获取菜单列表
const getMenuList = (header: string) => {
// 使用国际化菜单
const menus = getNavMenus()
const menus = getNavMenus(t)
const filteredMenus = filterMenusByPermission(menus, userPermissions.value)
return filteredMenus.filter((item: NavMenu) => item.header === header)
}
@@ -386,7 +386,7 @@ onMounted(() => {
<!-- 👉 Footer -->
<template #footer>
<Footer />
<Footer :show-nav="!showPluginQuickAccess" />
</template>
</VerticalNavLayout>

View File

@@ -7,6 +7,14 @@ import { useUserStore } from '@/stores'
import { filterMenusByPermission } from '@/utils/permission'
import { usePWA } from '@/composables/usePWA'
// 是否显示的输入参数
defineProps({
showNav: {
type: Boolean,
default: true,
},
})
const display = useDisplay()
// PWA模式检测
const { appMode } = usePWA()
@@ -41,7 +49,7 @@ const userPermissions = computed(() => {
// 获取导航菜单
const navMenus = computed(() => {
const allMenus = getNavMenus()
const allMenus = getNavMenus(t)
return filterMenusByPermission(allMenus, userPermissions.value)
})
@@ -160,53 +168,59 @@ const showDynamicButton = computed(() => {
</script>
<template>
<Teleport v-if="appMode" to="body">
<Teleport v-if="appMode && showNav" to="body">
<div class="footer-nav-container">
<VCard elevation="3" class="footer-nav-card border" rounded="pill" :class="{ 'shift-left': showDynamicButton }">
<VCardText class="footer-card-content">
<!-- 添加指示器 -->
<div ref="indicator" class="nav-indicator"></div>
<VBtnToggle class="footer-btn-group" :mandatory="true" v-model="currentMenu">
<!-- 遍历底部菜单项 -->
<VBtn
v-for="menu in footerMenus"
:key="menu.to"
:to="menu.to"
:variant="currentMenu === menu.to ? 'text' : 'plain'"
color="primary"
:ripple="false"
class="footer-nav-btn"
rounded="pill"
:class="{ 'footer-nav-btn-active': currentMenu === menu.to }"
:value="menu.to"
>
<div class="btn-content">
<VIcon :icon="menu.icon" size="32"></VIcon>
<span v-if="!isEnglish" class="text-xs">{{ menu.title }}</span>
</div>
</VBtn>
<TransitionGroup name="footer-nav" tag="div" class="footer-nav-group">
<VCard key="main-nav" elevation="3" class="footer-nav-card border" rounded="pill">
<VCardText class="footer-card-content">
<!-- 添加指示器 -->
<div ref="indicator" class="nav-indicator"></div>
<VBtnToggle class="footer-btn-group" :mandatory="true" v-model="currentMenu">
<!-- 遍历底部菜单项 -->
<VBtn
v-for="menu in footerMenus"
:key="menu.to"
:to="menu.to"
:variant="currentMenu === menu.to ? 'text' : 'plain'"
color="primary"
:ripple="false"
class="footer-nav-btn"
rounded="pill"
:class="{ 'footer-nav-btn-active': currentMenu === menu.to }"
:value="menu.to"
>
<div class="btn-content">
<VIcon :icon="menu.icon" size="32"></VIcon>
<span v-if="!isEnglish" class="text-xs">{{ menu.title }}</span>
</div>
</VBtn>
<!-- 更多按钮 -->
<VBtn
:variant="currentMenu === '/apps' ? 'text' : 'plain'"
color="primary"
:ripple="false"
to="/apps"
rounded="pill"
class="footer-nav-btn"
:class="{ 'footer-nav-btn-active': currentMenu === '/apps' }"
value="/apps"
>
<div class="btn-content">
<VIcon icon="mdi-dots-horizontal" size="32"></VIcon>
<span v-if="!isEnglish" class="text-xs">{{ t('nav.more') }}</span>
</div>
</VBtn>
</VBtnToggle>
</VCardText>
</VCard>
<Transition name="fade-slide">
<VCard v-if="showDynamicButton" elevation="3" class="footer-nav-card dynamic-btn-card border" rounded="pill">
<!-- 更多按钮 -->
<VBtn
:variant="currentMenu === '/apps' ? 'text' : 'plain'"
color="primary"
:ripple="false"
to="/apps"
rounded="pill"
class="footer-nav-btn"
:class="{ 'footer-nav-btn-active': currentMenu === '/apps' }"
value="/apps"
>
<div class="btn-content">
<VIcon icon="mdi-dots-horizontal" size="32"></VIcon>
<span v-if="!isEnglish" class="text-xs">{{ t('nav.more') }}</span>
</div>
</VBtn>
</VBtnToggle>
</VCardText>
</VCard>
<VCard
v-if="showDynamicButton"
key="dynamic-btn"
elevation="3"
class="footer-nav-card dynamic-btn-card border"
rounded="pill"
>
<VCardText class="footer-card-content">
<!-- 各页面的动态按钮 -->
<VBtn
@@ -221,7 +235,7 @@ const showDynamicButton = computed(() => {
</VBtn>
</VCardText>
</VCard>
</Transition>
</TransitionGroup>
</div>
</Teleport>
</template>
@@ -237,6 +251,12 @@ const showDynamicButton = computed(() => {
inset-inline: 0;
padding-block-end: calc(6px + env(safe-area-inset-bottom, 0px));
pointer-events: none;
}
.footer-nav-group {
display: flex;
align-items: center;
justify-content: center;
// 按钮卡片之间的间距
> .v-card + .v-card {
@@ -251,6 +271,7 @@ const showDynamicButton = computed(() => {
background-color: rgba(var(--v-theme-surface), 0.6);
pointer-events: auto;
transition: all 0.5s cubic-bezier(0.25, 1, 0.5, 1);
will-change: transform, max-width, opacity;
// 透明主题下的特殊样式
.v-theme--transparent & {
@@ -258,10 +279,6 @@ const showDynamicButton = computed(() => {
background-color: rgba(var(--v-theme-surface), var(--transparent-opacity-heavy, 0.5));
}
&.shift-left {
transform: translateX(0);
}
.v-btn-toggle {
block-size: auto;
min-block-size: 56px;
@@ -319,6 +336,7 @@ const showDynamicButton = computed(() => {
block-size: auto;
inline-size: auto;
min-block-size: 0;
max-width: 60px;
.footer-card-content {
padding: 3px;
@@ -340,23 +358,25 @@ const showDynamicButton = computed(() => {
}
}
// 淡入滑动动画
.fade-slide-enter-active {
// 底部导航动画
.footer-nav-enter-active,
.footer-nav-leave-active {
transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
overflow: hidden;
}
.fade-slide-leave-active {
transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.fade-slide-enter-from {
.footer-nav-enter-from,
.footer-nav-leave-to {
opacity: 0;
max-width: 0 !important;
margin-inline-start: 0 !important;
border-width: 0 !important;
padding: 0 !important;
transform: translateX(20px);
}
.fade-slide-leave-to {
opacity: 0;
transform: translateX(20px);
.footer-nav-move {
transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
@keyframes fade-in {

View File

@@ -57,159 +57,78 @@ const statusIcon = computed(() => {
const colorTheme = computed(() => {
return props.type === 'online' ? 'success' : 'error'
})
// 动画时长
const ENTER_DURATION = 600
const LEAVE_DURATION = 400
// 进入动画
function onEnter(el: HTMLElement, done: () => void) {
// 初始状态
el.style.opacity = '0'
el.style.transform = 'scale(0.9)'
el.style.filter = 'blur(10px)'
// 强制重绘
el.offsetHeight
// 应用过渡
el.style.transition = `all ${ENTER_DURATION}ms cubic-bezier(0.4, 0, 0.2, 1)`
// 目标状态
requestAnimationFrame(() => {
el.style.opacity = '1'
el.style.transform = 'scale(1)'
el.style.filter = 'blur(0)'
})
// 动画完成
setTimeout(done, ENTER_DURATION)
}
// 离开动画
function onLeave(el: HTMLElement, done: () => void) {
// 应用过渡
el.style.transition = `all ${LEAVE_DURATION}ms cubic-bezier(0.4, 0, 1, 1)`
// 目标状态
requestAnimationFrame(() => {
el.style.opacity = '0'
el.style.transform = 'scale(1.1)'
el.style.filter = 'blur(20px)'
})
// 动画完成
setTimeout(done, LEAVE_DURATION)
}
</script>
<template>
<Teleport to="body">
<Transition
:css="false"
@enter="onEnter"
@leave="onLeave"
>
<div v-if="shouldShow" class="offline-page" ref="offlinePage">
<div class="offline-container" :class="{ 'container-animate': shouldShow }">
<!-- 状态图标 -->
<div class="status-icon-wrapper">
<div class="status-icon-bg">
<VIcon :icon="statusIcon" size="64" :color="colorTheme" />
</div>
</div>
<!-- 主要信息 -->
<div class="content-section">
<h1 class="offline-title">
{{ props.type === 'online' ? t('app.online') : t('app.offline') }}
</h1>
<p class="offline-message">
{{ statusText }}
</p>
<!-- 重试按钮 -->
<div class="action-section">
<VBtn
v-if="props.type === 'offline'"
:loading="retrying"
:color="colorTheme"
size="large"
variant="flat"
@click="handleRetry"
>
<VIcon icon="mdi-refresh" class="me-2" />
{{ retrying ? t('common.checking') : t('common.retry') }}
</VBtn>
</div>
<!-- 状态指示器 -->
<div class="status-indicators">
<VChip
:color="isOnline ? 'success' : 'error'"
:prepend-icon="isOnline ? 'mdi-wifi' : 'mdi-wifi-off'"
variant="tonal"
class="me-2"
>
{{ isOnline ? t('common.networkOnline') : t('common.networkOffline') }}
</VChip>
<VChip
:color="canPerformNetworkAction ? 'success' : 'warning'"
:prepend-icon="canPerformNetworkAction ? 'mdi-check-circle' : 'mdi-alert-circle'"
variant="tonal"
>
{{ canPerformNetworkAction ? t('common.serviceAvailable') : t('common.serviceUnavailable') }}
</VChip>
</div>
</div>
<!-- 底部信息 -->
<div class="footer-section">
<p class="app-info">{{ t('app.moviepilot') }}</p>
<VDialog :model-value="shouldShow" persistent max-width="420" scrollable>
<VCard class="offline-dialog">
<!-- 状态图标 -->
<div class="status-icon-wrapper">
<div class="status-icon-bg">
<VIcon :icon="statusIcon" size="48" :color="colorTheme" />
</div>
</div>
</div>
</Transition>
</Teleport>
<!-- 主要信息 -->
<VCardText class="text-center">
<h2 class="offline-title mb-4">
{{ props.type === 'online' ? t('app.online') : t('app.offline') }}
</h2>
<p class="offline-message mb-6">
{{ statusText }}
</p>
<!-- 重试按钮 -->
<div class="action-section mb-6">
<VBtn
v-if="props.type === 'offline'"
:loading="retrying"
:color="colorTheme"
size="default"
variant="flat"
@click="handleRetry"
>
<VIcon icon="mdi-refresh" class="me-2" />
{{ retrying ? t('common.checking') : t('common.retry') }}
</VBtn>
</div>
<!-- 状态指示器 -->
<div class="status-indicators">
<VChip
:color="isOnline ? 'success' : 'error'"
:prepend-icon="isOnline ? 'mdi-wifi' : 'mdi-wifi-off'"
variant="tonal"
size="small"
class="me-2"
>
{{ isOnline ? t('common.networkOnline') : t('common.networkOffline') }}
</VChip>
<VChip
:color="canPerformNetworkAction ? 'success' : 'warning'"
:prepend-icon="canPerformNetworkAction ? 'mdi-check-circle' : 'mdi-alert-circle'"
variant="tonal"
size="small"
>
{{ canPerformNetworkAction ? t('common.serviceAvailable') : t('common.serviceUnavailable') }}
</VChip>
</div>
</VCardText>
</VCard>
</VDialog>
</template>
<style scoped>
.offline-page {
position: fixed;
z-index: 9999;
display: flex;
align-items: center;
justify-content: center;
padding: 20px;
backdrop-filter: blur(10px);
background: linear-gradient(135deg, rgb(var(--v-theme-surface)) 0%, rgb(var(--v-theme-surface-variant)) 100%);
inset: 0;
will-change: transform, opacity, filter;
}
.offline-container {
padding: 40px;
border-radius: 24px;
background: rgb(var(--v-theme-surface));
box-shadow: 0 20px 40px rgba(0, 0, 0, 10%), 0 0 0 1px rgba(var(--v-border-color), var(--v-border-opacity));
inline-size: 100%;
max-inline-size: 500px;
text-align: center;
opacity: 0;
transform: translateY(20px);
transition: all 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.offline-page .offline-container.container-animate {
opacity: 1;
transform: translateY(0);
transition-delay: 0.2s;
.offline-dialog {
border-radius: 16px;
}
.status-icon-wrapper {
margin-block-end: 32px;
padding-block: 24px 0;
padding-inline: 24px;
text-align: center;
}
.status-icon-bg {
@@ -218,71 +137,61 @@ function onLeave(el: HTMLElement, done: () => void) {
align-items: center;
justify-content: center;
border-radius: 50%;
animation: icon-pulse 3s ease-in-out infinite;
background: rgba(var(--v-theme-surface-variant), 0.5);
block-size: 120px;
inline-size: 120px;
block-size: 80px;
inline-size: 80px;
margin-block: 0;
margin-inline: auto;
}
.status-icon-bg {
animation: iconPulse 3s ease-in-out infinite;
}
.status-icon-bg::before {
position: absolute;
z-index: -1;
border-radius: 50%;
animation: icon-glow 2s ease-in-out infinite alternate;
background: linear-gradient(45deg, rgb(var(--v-theme-primary)), rgb(var(--v-theme-secondary)));
content: '';
inset: -4px;
inset: -3px;
opacity: 0.1;
animation: iconGlow 2s ease-in-out infinite alternate;
}
@keyframes iconPulse {
0%, 100% {
@keyframes icon-pulse {
0%,
100% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
}
@keyframes iconGlow {
@keyframes icon-glow {
0% {
opacity: 0.1;
transform: scale(1);
}
100% {
opacity: 0.3;
transform: scale(1.1);
}
}
.content-section {
margin-block-end: 32px;
}
.offline-title {
color: rgb(var(--v-theme-on-surface));
font-size: 2rem;
font-size: 1.5rem;
font-weight: 600;
margin-block-end: 16px;
}
.offline-message {
color: rgb(var(--v-theme-on-surface));
font-size: 1.1rem;
line-height: 1.6;
margin-block-end: 32px;
font-size: 1rem;
line-height: 1.5;
opacity: 0.7;
}
.action-section {
margin-block-end: 32px;
}
.status-indicators {
display: flex;
flex-wrap: wrap;
@@ -290,41 +199,19 @@ function onLeave(el: HTMLElement, done: () => void) {
gap: 8px;
}
.help-section {
margin-block-end: 32px;
}
.help-panels {
text-align: start;
}
.footer-section {
opacity: 0.7;
}
.app-info {
color: rgb(var(--v-theme-on-surface));
font-size: 0.875rem;
}
/* 移动端优化 */
@media (width <= 600px) {
.offline-container {
padding: 24px;
margin: 16px;
.status-icon-bg {
block-size: 70px;
inline-size: 70px;
}
.offline-title {
font-size: 1.5rem;
font-size: 1.25rem;
}
.offline-message {
font-size: 1rem;
}
.status-icon-bg {
block-size: 100px;
inline-size: 100px;
font-size: 0.9rem;
}
.status-indicators {
@@ -332,13 +219,4 @@ function onLeave(el: HTMLElement, done: () => void) {
align-items: center;
}
}
/* 暗黑模式优化 */
.v-theme--dark .offline-page {
background: linear-gradient(135deg, rgb(var(--v-theme-surface)) 0%, rgba(var(--v-theme-surface-variant), 0.8) 100%);
}
.v-theme--dark .offline-container {
box-shadow: 0 20px 40px rgba(0, 0, 0, 30%), 0 0 0 1px rgba(var(--v-border-color), var(--v-border-opacity));
}
</style>

View File

@@ -1,12 +1,13 @@
<script setup lang="ts">
import api from '@/api'
import type { Plugin } from '@/api/types'
import noImage from '@images/logos/plugin.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { useI18n } from 'vue-i18n'
import { useRecentPlugins } from '@/composables/useRecentPlugins'
import PluginDataDialog from '@/components/dialog/PluginDataDialog.vue'
import { VCard } from 'vuetify/components'
import { getDominantColor } from '@/@core/utils/image'
import { disableBodyScroll, enableBodyScroll } from 'body-scroll-lock'
// 国际化
const { t } = useI18n()
@@ -136,8 +137,8 @@ const componentOpacity = computed(() => {
// 计算插件图标路径
function getPluginIcon(plugin: Plugin): string {
if (!plugin.plugin_icon) return noImage
if (pluginIconLoadError.value[plugin.id]) return noImage
if (!plugin.plugin_icon) return getLogoUrl('plugin')
if (pluginIconLoadError.value[plugin.id]) return getLogoUrl('plugin')
// 如果是网络图片则使用代理后返回
if (plugin?.plugin_icon?.startsWith('http'))
@@ -205,6 +206,29 @@ function handleClosePluginDataDialog() {
currentPlugin.value = null
}
// 管理滚动状态
function manageScrollLock() {
if (isVisible.value) {
// 使用 nextTick 确保 DOM 已经更新
nextTick(() => {
// 先恢复之前的锁定状态,避免重复锁定
const scrollableElement = document.querySelector('.all-plugins-grid')
if (scrollableElement) {
// 确保元素存在且可见
if ((scrollableElement as HTMLElement).offsetHeight > 0) {
disableBodyScroll(scrollableElement as HTMLElement)
}
}
})
} else {
// 恢复背景滚动
const scrollableElement = document.querySelector('.all-plugins-grid')
if (scrollableElement) {
enableBodyScroll(scrollableElement as HTMLElement)
}
}
}
// 监听可见性变化,加载数据
watch(
() => isVisible.value,
@@ -212,6 +236,9 @@ watch(
if (visible) {
fetchPluginsWithPage()
loadRecentPlugins()
manageScrollLock()
} else {
manageScrollLock()
}
},
{ immediate: true },
@@ -221,6 +248,15 @@ onMounted(() => {
if (isVisible.value) {
fetchPluginsWithPage()
loadRecentPlugins()
manageScrollLock()
}
})
// 组件卸载时确保恢复背景滚动
onUnmounted(() => {
const scrollableElement = document.querySelector('.all-plugins-grid')
if (scrollableElement) {
enableBodyScroll(scrollableElement as HTMLElement)
}
})
@@ -420,40 +456,41 @@ function handleBackdropClick(event: MouseEvent) {
<div class="section-title">{{ t('plugin.allPlugins') }}</div>
</div>
<div v-if="pluginsWithPage.length > 0" class="all-plugins-grid">
<div
v-for="plugin in pluginsWithPage"
:key="plugin.id"
class="plugin-item"
@click="handlePluginClick(plugin)"
>
<VBadge
dot
:color="plugin.state ? 'success' : 'secondary'"
location="top end"
:offset-x="-1"
:offset-y="-1"
<div v-if="pluginsWithPage.length > 0" class="all-plugins-container">
<div class="all-plugins-grid">
<div
v-for="plugin in pluginsWithPage"
:key="plugin.id"
class="plugin-item"
@click="handlePluginClick(plugin)"
>
<div
class="plugin-icon"
:style="{
background: `${getPluginBackgroundColor(plugin)}`,
}"
<VBadge
dot
:color="plugin.state ? 'success' : 'secondary'"
location="top end"
:offset-x="-1"
:offset-y="-1"
>
<VImg
:src="getPluginIcon(plugin)"
:alt="plugin.plugin_name"
cover
@load="src => handleIconLoaded(src, plugin)"
@error="handleIconError(plugin)"
class="rounded-lg"
/>
</div>
</VBadge>
<div class="plugin-name">{{ plugin.plugin_name }}</div>
<div
class="plugin-icon"
:style="{
background: `${getPluginBackgroundColor(plugin)}`,
}"
>
<VImg
:src="getPluginIcon(plugin)"
:alt="plugin.plugin_name"
cover
@load="src => handleIconLoaded(src, plugin)"
@error="handleIconError(plugin)"
class="rounded-lg"
/>
</div>
</VBadge>
<div class="plugin-name">{{ plugin.plugin_name }}</div>
</div>
</div>
</div>
<!-- 空状态只有在没有插件时显示 -->
<div v-else-if="pluginsWithPage.length === 0" class="empty-state">
<VIcon icon="mdi-puzzle-outline" size="48" color="grey" />
@@ -622,10 +659,34 @@ function handleBackdropClick(event: MouseEvent) {
padding-inline: 0;
}
.all-plugins-container {
display: flex;
overflow: hidden;
flex: 1;
flex-direction: column;
min-block-size: 0;
}
.all-plugins-grid {
display: grid;
gap: 4px;
grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
max-block-size: 100%;
-webkit-overflow-scrolling: touch;
-ms-overflow-style: none; // IE/Edge
overflow-y: auto;
overscroll-behavior: contain;
padding-block: 8px;
padding-inline: 0;
// 隐藏滚动条
scrollbar-width: none; // Firefox
touch-action: pan-y;
will-change: scroll-position;
&::-webkit-scrollbar {
display: none; // WebKit 浏览器
}
}
.plugin-item {
@@ -677,6 +738,7 @@ function handleBackdropClick(event: MouseEvent) {
font-size: 12px;
font-weight: 500;
-webkit-line-clamp: 2;
line-clamp: 2;
line-height: 1.2;
max-block-size: 2.4em;
text-align: center;

View File

@@ -5,6 +5,8 @@ import LoggingView from '@/views/system/LoggingView.vue'
import RuleTestView from '@/views/system/RuleTestView.vue'
import ModuleTestView from '@/views/system/ModuleTestView.vue'
import MessageView from '@/views/system/MessageView.vue'
import WordsView from '@/views/system/WordsView.vue'
import CacheView from '@/views/system/CacheView.vue'
import api from '@/api'
import { useDisplay } from 'vuetify'
import { getQueryValue } from '@/@core/utils'
@@ -41,6 +43,12 @@ const systemTestDialog = ref(false)
// 消息中心弹窗
const messageDialog = ref(false)
// 词表设置弹窗
const wordsDialog = ref(false)
// 缓存管理弹窗
const cacheDialog = ref(false)
// 输入消息
const user_message = ref('')
@@ -86,6 +94,20 @@ const shortcuts = [
dialog: 'netTest',
dialogRef: netTestDialog,
},
{
title: t('shortcut.words.title'),
subtitle: t('shortcut.words.subtitle'),
icon: 'mdi-file-word-box',
dialog: 'words',
dialogRef: wordsDialog,
},
{
title: t('shortcut.cache.title'),
subtitle: t('shortcut.cache.subtitle'),
icon: 'mdi-database',
dialog: 'cache',
dialogRef: cacheDialog,
},
{
title: t('shortcut.system.title'),
subtitle: t('shortcut.system.subtitle'),
@@ -249,7 +271,15 @@ onMounted(() => {
flat
class="pa-2 d-flex align-center cursor-pointer transition-transform duration-300 hover:-translate-y-1 border h-full"
hover
@click="item.dialog === 'message' ? openMessageDialog() : openDialog(item.dialogRef)"
@click="
item.dialog === 'message'
? openMessageDialog()
: item.dialog === 'words'
? openDialog(item.dialogRef)
: item.dialog === 'cache'
? openDialog(item.dialogRef)
: openDialog(item.dialogRef)
"
>
<VAvatar variant="text" size="48" rounded="lg">
<VIcon color="primary" :icon="item.icon" size="24" />
@@ -358,6 +388,38 @@ onMounted(() => {
</VCardText>
</VCard>
</VDialog>
<!-- 词表设置弹窗 -->
<VDialog v-if="wordsDialog" v-model="wordsDialog" max-width="60rem" scrollable :fullscreen="!display.mdAndUp.value">
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-file-word-box" class="me-2" />
{{ t('shortcut.words.subtitle') }}
</VCardTitle>
<VDialogCloseBtn @click="wordsDialog = false" />
</VCardItem>
<VDivider />
<VCardText>
<WordsView />
</VCardText>
</VCard>
</VDialog>
<!-- 缓存管理弹窗 -->
<VDialog v-if="cacheDialog" v-model="cacheDialog" max-width="90rem" scrollable :fullscreen="!display.mdAndUp.value">
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-database" class="me-2" />
{{ t('shortcut.cache.subtitle') }}
</VCardTitle>
<VDialogCloseBtn @click="cacheDialog = false" />
</VCardItem>
<VDivider />
<VCardText>
<CacheView />
</VCardText>
</VCard>
</VDialog>
<!-- 系统健康检查弹窗 -->
<VDialog
v-if="systemTestDialog"

View File

@@ -5,7 +5,8 @@ import avatar1 from '@images/avatars/avatar-1.png'
import api from '@/api'
import ProgressDialog from '@/components/dialog/ProgressDialog.vue'
import UserAuthDialog from '@/components/dialog/UserAuthDialog.vue'
import { useAuthStore, useUserStore } from '@/stores'
import AboutDialog from '@/components/dialog/AboutDialog.vue'
import { useAuthStore, useUserStore, useGlobalSettingsStore } from '@/stores'
import { useI18n } from 'vue-i18n'
import { useDisplay, useTheme } from 'vuetify'
import { SUPPORTED_LOCALES, SupportedLocale } from '@/types/i18n'
@@ -15,15 +16,20 @@ import { saveLocalTheme } from '@/@core/utils/theme'
import type { ThemeSwitcherTheme } from '@layouts/types'
import { useConfirm } from '@/composables/useConfirm'
import { themeManager } from '@/utils/themeManager'
import { usePWA, type UIMode } from '@/composables/usePWA'
// 认证 Store
const authStore = useAuthStore()
// 用户 Store
const userStore = useUserStore()
// 全局设置 Store
const globalSettingsStore = useGlobalSettingsStore()
// 国际化
const { t } = useI18n()
// 显示器
const display = useDisplay()
// PWA
const { uiMode, setUIMode } = usePWA()
// 提示框
const $toast = useToast()
@@ -37,6 +43,9 @@ const siteAuthDialog = ref(false)
// 自定义CSS弹窗
const cssDialog = ref(false)
// UI模式菜单是否显示
const showUIModeMenu = ref(false)
// 主题菜单是否显示
const showThemeMenu = ref(false)
@@ -53,6 +62,9 @@ const transparencyLevel = ref(localStorage.getItem('transparency-level') || 'med
const isTransparentTheme = computed(() => currentThemeName.value === 'transparent')
const showTransparencyDialog = ref(false)
// 关于对话框
const aboutDialog = ref(false)
// 预设值配置
const transparencyPresets = {
low: { opacity: 0.1, blur: 5 },
@@ -205,6 +217,11 @@ function showSiteAuthDialog() {
siteAuthDialog.value = true
}
// 显示关于对话框
function showAboutDialog() {
aboutDialog.value = true
}
// 用户站点认证成功
function siteAuthDone() {
siteAuthDialog.value = false
@@ -217,9 +234,45 @@ const userName = computed(() => userStore.userName)
const avatar = computed(() => userStore.avatar || avatar1)
const userLevel = computed(() => userStore.level)
// 检查是否为高级模式
const isAdvancedMode = computed(() => {
return globalSettingsStore.get('ADVANCED_MODE') !== false
})
// UI模式相关
const uiModes = computed(() => [
{
name: 'auto',
title: t('theme.autoUI'),
icon: 'mdi-devices',
},
{
name: 'desktop',
title: t('pwa.platforms.desktop'),
icon: 'mdi-monitor',
},
{
name: 'app',
title: t('pwa.platforms.mobile'),
icon: 'mdi-cellphone',
},
])
// 切换UI模式
function changeUIMode(mode: UIMode) {
setUIMode(mode)
showUIModeMenu.value = false
}
// 获取当前UI模式图标
const getUIModeIcon = computed(() => {
const mode = uiModes.value.find(m => m.name === uiMode.value)
return mode?.icon || 'mdi-devices'
})
// 主题相关功能
const { name: themeName, global: globalTheme } = useTheme()
const savedTheme = ref(localStorage.getItem('theme') ?? themeName)
const savedTheme = ref(localStorage.getItem('theme') ?? 'auto')
const currentThemeName = ref(savedTheme.value)
const themes: ThemeSwitcherTheme[] = [
@@ -509,11 +562,17 @@ onUnmounted(() => {
<VListItemTitle>{{ t('user.profile') }}</VListItemTitle>
</VListItem>
<VListItem v-if="superUser" link @click="router.push('/setting')" class="mb-1 rounded-lg" hover>
<VListItem
v-if="superUser"
link
@click="isAdvancedMode ? router.push('/setting') : router.push('/setup-wizard')"
class="mb-1 rounded-lg"
hover
>
<template #prepend>
<VIcon icon="mdi-cog-outline" />
<VIcon :icon="isAdvancedMode ? 'mdi-cog-outline' : 'mdi-wizard-hat'" />
</template>
<VListItemTitle>{{ t('user.systemSettings') }}</VListItemTitle>
<VListItemTitle>{{ isAdvancedMode ? t('user.systemSettings') : t('user.wizardSettings') }}</VListItemTitle>
</VListItem>
<!-- 👉 Site Auth -->
@@ -524,6 +583,41 @@ onUnmounted(() => {
<VListItemTitle>{{ t('user.siteAuth') }}</VListItemTitle>
</VListItem>
<!-- 👉 UI模式设置 - 使用嵌套菜单 -->
<VMenu location="end" offset-x min-width="200" v-model="showUIModeMenu" :close-on-content-click="true">
<template v-slot:activator="{ props: menuProps }">
<VListItem v-bind="menuProps" class="mb-1 rounded-lg" hover>
<template #prepend>
<VIcon :icon="getUIModeIcon" />
</template>
<VListItemTitle>{{ t('common.uiMode') }}</VListItemTitle>
<VListItemSubtitle>
{{ uiModes.find(m => m.name === uiMode)?.title || t('theme.autoUI') }}
</VListItemSubtitle>
<template #append>
<VIcon icon="mdi-chevron-right" size="small" />
</template>
</VListItem>
</template>
<VList>
<VListItem
v-for="mode in uiModes"
:key="mode.name"
@click="changeUIMode(mode.name as UIMode)"
:active="uiMode === mode.name"
class="mb-1"
>
<template #prepend>
<VIcon :icon="mode.icon" />
</template>
<VListItemTitle>{{ mode.title }}</VListItemTitle>
<template #append v-if="uiMode === mode.name">
<VIcon icon="mdi-check" color="primary" size="small" />
</template>
</VListItem>
</VList>
</VMenu>
<!-- 👉 主题设置 - 使用嵌套菜单 -->
<VMenu location="end" offset-x min-width="200" v-model="showThemeMenu" :close-on-content-click="true">
<template v-slot:activator="{ props: menuProps }">
@@ -531,9 +625,10 @@ onUnmounted(() => {
<template #prepend>
<VIcon :icon="getThemeIcon" />
</template>
<VListItemTitle>
{{ themes.find(t => t.name === currentThemeName)?.title || t('common.theme') }}
</VListItemTitle>
<VListItemTitle>{{ t('common.theme') }}</VListItemTitle>
<VListItemSubtitle>
{{ themes.find(t => t.name === currentThemeName)?.title || t('theme.auto') }}
</VListItemSubtitle>
<template #append>
<VIcon icon="mdi-chevron-right" size="small" />
</template>
@@ -620,6 +715,14 @@ onUnmounted(() => {
<VListItemTitle>{{ t('user.helpDocs') }}</VListItemTitle>
</VListItem>
<!-- 👉 About -->
<VListItem @click="showAboutDialog" class="mb-1 rounded-lg" hover>
<template #prepend>
<VIcon icon="mdi-information-outline" />
</template>
<VListItemTitle>{{ t('setting.about.title') }}</VListItemTitle>
</VListItem>
<!-- Divider -->
<VDivider v-if="superUser" class="my-3" />
@@ -764,6 +867,9 @@ onUnmounted(() => {
</VCardText>
</VCard>
</VDialog>
<!-- 关于对话框 -->
<AboutDialog v-if="aboutDialog" v-model="aboutDialog" @close="aboutDialog = false" />
</template>
<style lang="scss" scoped>

View File

@@ -30,6 +30,7 @@ export default {
saving: 'Saving',
reset: 'Reset',
theme: 'Theme',
uiMode: 'UI Layout',
language: 'Language',
pleaseWait: 'Please wait...',
viewDetails: 'View Details',
@@ -49,6 +50,9 @@ export default {
itemsPerPage: 'Items per page',
pageText: '{0}-{1} of {2}',
noDataText: 'No data',
next: 'Next',
previous: 'Previous',
skip: 'Skip',
loadingText: 'Loading...',
networkRequired: 'This feature requires network connection',
networkDisconnected: 'Network connection lost',
@@ -63,6 +67,10 @@ export default {
serviceUnavailable: 'Service Unavailable',
status: 'Status',
preset: 'Preset',
refresh: 'Refresh',
swUpdateReady: 'New version is ready, please refresh the page to get the latest features',
versionMismatch: 'Browser cache version does not match server version, please try clearing cache',
clearCache: 'Clear Cache',
},
mediaType: {
movie: 'Movie',
@@ -126,6 +134,7 @@ export default {
light: 'Light',
dark: 'Dark',
auto: 'Follow System',
autoUI: 'Auto',
transparent: 'Transparent',
purple: 'Purple',
custom: 'Custom Style',
@@ -245,6 +254,22 @@ export default {
serverError: 'Login failed, server error!',
loginFailed: 'Login Failed',
checkCredentials: 'Please check your username, password or two-factor authentication code!',
twoFactorAuth: 'Two-Factor Authentication',
loginWithPasskey: 'Login with Passkey',
loginWithOtp: 'Login with OTP',
orUsePasskey: 'Or use Passkey for verification',
verifyWithPasskey: 'Verify with Passkey',
otpPlaceholder: 'Enter 6-digit code',
passkeyLoginStartFailed: 'Failed to start Passkey authentication',
passkeyNotSelected: 'No Passkey selected',
passkeyLoginFailed: 'Passkey login failed',
passkeyAuthCanceled: 'Passkey authentication canceled',
passkeyLoginRetry: 'Passkey login failed, please try again',
passkeyVerifyFailed: 'Passkey verification failed',
passkeyVerifyFailedRetry: 'Passkey verification failed, please try again',
mfa: {
selectVerificationMethod: 'Please select a verification method',
},
},
menu: {
start: 'Start',
@@ -321,11 +346,6 @@ export default {
title: 'Notifications',
description: 'Notification channels (WeChat, Telegram, Slack, SynologyChat, VoceChat, WebPush), message scope',
},
words: {
title: 'Word Lists',
description:
'Custom recognition words, custom production/subtitle groups, custom placeholders, file organization block words',
},
about: {
title: 'About',
description: 'Software version',
@@ -369,8 +389,10 @@ export default {
deleteFailed: 'Failed to delete user!',
profile: 'Profile',
systemSettings: 'System Settings',
wizardSettings: 'Setup Wizard',
siteAuth: 'User Authentication',
helpDocs: 'Help Documents',
about: 'About',
restart: 'Restart',
management: 'User Management',
noUsers: 'No Users',
@@ -378,8 +400,11 @@ export default {
addUser: 'Add User',
editUser: 'Edit User',
username: 'Username',
usernameHint: 'Username for system login',
password: 'Password',
passwordHint: 'Please enter your login password',
confirmPassword: 'Confirm Password',
confirmPasswordHint: 'Please enter the password again to confirm',
role: 'Role',
email: 'Email',
enabled: 'Enabled',
@@ -408,10 +433,13 @@ export default {
name: 'WeChat Work',
corpId: 'Corp ID',
corpIdHint: 'Corp ID in WeChat Work backend enterprise information',
corpIdRequired: 'Corp ID cannot be empty',
appId: 'App AgentId',
appIdHint: 'AgentId of self-built app in WeChat Work',
appIdRequired: 'App AgentId cannot be empty',
appSecret: 'App Secret',
appSecretHint: 'Secret of self-built app in WeChat Work',
appSecretRequired: 'App Secret cannot be empty',
proxy: 'Proxy Address',
proxyHint:
'Proxy address for WeChat message forwarding, required for self-built apps created after June 20, 2022',
@@ -427,8 +455,10 @@ export default {
name: 'Telegram',
token: 'Bot Token',
tokenHint: 'Telegram bot token, format: 123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11',
tokenRequired: 'Bot Token cannot be empty',
chatId: 'Chat ID',
chatIdHint: 'Chat ID of user, group or channel that receives notifications',
chatIdRequired: 'Chat ID cannot be empty',
users: 'User Whitelist',
usersHint: 'User IDs that can use Telegram bot, separated by commas. Leave empty to allow all users',
admins: 'Admin Whitelist',
@@ -443,15 +473,30 @@ export default {
name: 'Slack',
oauthToken: 'Slack Bot User OAuth Token',
oauthTokenHint: 'Bot User OAuth Token in Slack app OAuth & Permissions page',
oauthTokenRequired: 'OAuth Token cannot be empty',
appToken: 'Slack App-Level Token',
appTokenHint: 'App-Level Token in Slack app OAuth & Permissions page',
channel: 'Channel Name',
channelHint: 'Channel to send messages, default is "all"',
channelRequired: 'Channel Name cannot be empty',
},
discord: {
name: 'Discord',
botToken: 'Bot Token',
botTokenHint: 'Discord Bot Token (enable Message Content Intent in Dev Portal)',
botTokenRequired: 'Bot Token is required',
guildId: 'Guild ID',
guildIdHint: 'Optional, restrict to a specific guild; leave blank to use any joined guild',
guildIdPlaceholder: '123456789012345678',
channelId: 'Channel ID',
channelIdHint: 'Optional, default broadcast channel; leave blank to auto-pick a writable channel',
channelIdPlaceholder: '123456789012345678',
},
synologychat: {
name: 'Synology Chat',
webhook: 'Webhook URL',
webhookHint: 'Synology Chat bot webhook URL',
webhookRequired: 'Webhook URL cannot be empty',
token: 'Token',
tokenHint: 'Synology Chat bot token',
},
@@ -459,8 +504,10 @@ export default {
name: 'VoceChat',
host: 'Address',
hostHint: 'VoceChat server address, format: http(s)://ip:port',
hostRequired: 'Address cannot be empty',
apiKey: 'Bot API Key',
apiKeyHint: 'VoceChat bot API key',
apiKeyRequired: 'API Key cannot be empty',
channelId: 'Channel ID',
channelIdHint: 'VoceChat channel ID, without #',
},
@@ -468,6 +515,7 @@ export default {
name: 'WebPush',
username: 'Login Username',
usernameHint: 'Only push messages to the corresponding logged-in user',
usernameRequired: 'Username cannot be empty',
},
},
shortcut: {
@@ -496,6 +544,14 @@ export default {
title: 'Messages',
subtitle: 'Message Center',
},
words: {
title: 'Words',
subtitle: 'Word Settings',
},
cache: {
title: 'Cache',
subtitle: 'Manage Cache',
},
},
workflow: {
components: 'Action Components',
@@ -766,6 +822,8 @@ export default {
originalTitle: 'Original Title',
status: 'Status',
releaseDate: 'Release Date',
digitalRelease: 'Digital Release',
physicalRelease: 'Physical Release',
originalLanguage: 'Original Language',
productionCountries: 'Production Countries',
productionCompanies: 'Production Companies',
@@ -850,6 +908,7 @@ export default {
batchEnableError: 'Batch enable operation failed',
batchPauseError: 'Batch pause operation failed',
batchDeleteError: 'Batch delete operation failed',
minSubscribers: 'Minimum Subscribers',
},
recommend: {
all: 'All',
@@ -1172,6 +1231,7 @@ export default {
title: 'About MoviePilot',
softwareVersion: 'Software Version',
frontendVersion: 'Frontend Version',
browserVersion: 'Browser Cached Version',
authVersion: 'Auth Resource Version',
indexerVersion: 'Indexer Resource Version',
configDir: 'Config Directory',
@@ -1191,6 +1251,7 @@ export default {
dataDirectory: '/moviepilot',
expand: 'Expand',
collapse: 'Collapse',
clearCache: 'Clear Cache',
},
system: {
custom: 'Custom',
@@ -1215,9 +1276,24 @@ export default {
apiTokenLength: 'API Token must be at least 16 characters',
githubToken: 'Github Token',
githubTokenFormat: 'ghp_**** or github_pat_****',
githubTokenHint: 'Used to increase the rate limit threshold when plugins access Github API',
githubTokenHint:
'Used to increase the rate limit threshold when plugins access Github APIit is recommended to configure, otherwise plugins may not work properly',
ocrHost: 'OCR Server',
ocrHostHint: 'Used for site check-in, updating site cookies and other captcha recognition',
aiAgent: 'Enable AI Assistant',
aiAgentEnable: 'Enable AI Assistant',
aiAgentEnableHint: 'Enable AI assistant functionality, requires LLM configuration',
llmProvider: 'LLM Provider',
llmProviderHint: 'Select the LLM service provider to use',
llmModel: 'LLM Model Name',
llmModelHint: 'Specify the LLM model to use, such as gpt-3.5-turbo, deepseek-chat, etc.',
llmApiKey: 'LLM API Key',
llmApiKeyHint: 'API key from the LLM service provider for authentication',
llmApiKeyPlaceholder: 'Please enter API key',
llmBaseUrl: 'LLM Base URL',
llmBaseUrlHint: 'Base URL for LLM API, used for custom API endpoints',
aiAgentGlobal: 'Global AI Assistant',
aiAgentGlobalHint: 'Enable global AI assistant functionality, all message conversations will be answered by the AI agent without using the /ai command',
advancedSettings: 'Advanced Settings',
advancedSettingsDesc: 'System advanced settings, only need to be adjusted in special cases',
downloaders: 'Downloaders',
@@ -1669,7 +1745,11 @@ export default {
bestVersionRuleGroup: 'Version Upgrade Priority Rule Group',
bestVersionRuleGroupHint: 'Filter version upgrade subscriptions based on selected filter rule groups',
timedSearch: 'Subscription Scheduled Search',
timedSearchHint: 'Search all sites every 24 hours to supplement resources that may be missed by subscription',
timedSearchHint:
'Search all sites at specified intervals to supplement resources that may be missed by subscription',
searchInterval: 'Subscription Search Interval',
searchIntervalHint:
'Set the time interval for subscription search, only effective when subscription scheduled search is enabled',
checkLocalMedia: 'Check File System Resources',
checkLocalMediaHint:
'Scan the storage directory for existing resource files to avoid duplicate downloads; regardless of whether it is enabled, the media server will be checked',
@@ -1685,6 +1765,8 @@ export default {
hour1: '1 hour',
hour12: '12 hours',
day1: '1 day',
day3: '3 days',
week1: '1 week',
},
saveSuccess: 'Subscription sites saved successfully',
saveFailed: 'Failed to save subscription sites!',
@@ -1694,6 +1776,8 @@ export default {
cache: {
title: 'Cache Management',
subtitle: 'Manage torrent cache data',
totalCount: 'Total Count',
siteCount: 'Site Count',
filterByTitle: 'Filter by Title',
filterBySite: 'Filter by Site',
selectSite: 'Select Site',
@@ -1766,8 +1850,12 @@ export default {
add: 'Add User',
edit: 'Edit User',
username: 'Username',
usernameRequired: 'Username cannot be empty',
password: 'Password',
passwordMinLength: 'Password must be at least 6 characters',
confirmPassword: 'Confirm Password',
confirmPasswordRequired: 'Please confirm password',
passwordMismatch: 'Passwords do not match',
email: 'Email',
nickname: 'Nickname',
status: 'Status',
@@ -1788,9 +1876,7 @@ export default {
webPush: 'WebPush',
creatingUser: 'Creating user [{name}], please wait',
updatingUser: 'Updating user [{name}], please wait',
usernameRequired: 'Username cannot be empty',
usernameExists: 'Username already exists',
passwordMismatch: 'The two passwords do not match',
userCreated: 'User [{name}] created successfully',
userCreateFailed: 'Failed to create user: {message}',
userUpdateSuccess: 'User [{name}] updated successfully',
@@ -1866,6 +1952,8 @@ export default {
startDownload: 'Start Download',
downloadSuccess: '{site} {title} downloaded successfully!',
downloadFailed: '{site} {title} download failed: {message}!',
showAdvancedOptions: 'Show Advanced Options',
hideAdvancedOptions: 'Hide Advanced Options',
},
subscribeShare: {
shareSubscription: 'Share Subscription',
@@ -2090,6 +2178,10 @@ export default {
startAll: 'Start All',
refresh: 'Refresh',
close: 'Close',
processingFile: 'Processing',
overallProgress: 'Overall Progress',
currentFileProgress: 'Current File Progress',
processingStatus: 'Processing',
},
reorganize: {
title: 'Organize',
@@ -2492,15 +2584,47 @@ export default {
vocechatUser: 'VoceChat User',
synologychatUser: 'SynologyChat User',
doubanUser: 'Douban User',
twoFactorAuthentication: 'Two-Factor Authentication',
setupAuthenticator: 'Setup Authenticator',
authenticatorManagement: 'Authenticator Management',
authenticatorEnabled: 'You have enabled authenticator two-factor authentication',
clearAuthenticatorTip: 'To set up a new authenticator, please clear the current configuration first.',
clearAuthenticator: 'Clear Authenticator',
enableTwoFactor: 'Enable Two-Factor Authentication',
disableTwoFactor: 'Disable Two-Factor Authentication',
setupMfa: 'Setup Two-Factor Authentication',
enableMfa: 'Enable Two-Factor Authentication',
useAuthenticator: 'Use Authenticator',
usePasskey: 'Use Passkey',
enabled: 'Enabled',
keysCount: '{count} keys',
passkeyManagement: 'Passkey Management',
registerNewPasskey: 'Register New Passkey',
passkeyDescription: 'Passkeys allow you to sign in quickly and securely without a password.',
passkeyName: 'Passkey Name',
passkeyNamePlaceholder: 'e.g.: iPhone, Windows Hello',
registerPasskey: 'Register Passkey',
registeredPasskeys: 'Registered Passkeys',
createdAt: 'Created At',
noPasskeys: 'You have not registered any passkeys yet',
passkeyNameRequired: 'Please enter a passkey name',
passkeyRegisterSuccess: 'Passkey registered successfully',
passkeyRegisterFailed: 'Registration failed',
passkeyRegisterCancelled: 'Registration cancelled',
passkeyDeleteSuccess: 'Passkey deleted',
passkeyDeleteFailed: 'Delete failed',
passkeyDomainWarning: 'The availability of PassKeys is closely related to the {domain}. In a public network environment, please make sure to configure the correct access domain name in "Basic Settings". Domain changes or configuration errors will cause the PassKey to be unusable.',
otpRequiredForPasskey: 'For security reasons, you must first enable {otp} before you can register a PassKey. This is to ensure that you can still log in to your account via OTP code if the PassKey becomes invalid due to domain configuration changes.',
accessDomain: 'access domain name',
otpAuthenticator: 'OTP Authenticator',
otpGenerateFailed: 'Failed to get OTP URI: {message}!',
otpDisableSuccess: 'Two-factor authentication disabled successfully!',
otpDisableFailed: 'Failed to disable OTP: {message}!',
otpCodeRequired: 'Please enter the 6-digit verification code',
otpEnableSuccess: 'Two-factor authentication enabled successfully!',
otpEnableFailed: 'Failed to enable OTP: {message}!',
otpDisableRestrictedByPasskey: 'You have registered Passkeys. Please delete all Passkeys before disabling OTP verification.',
confirmToDisableOtp: 'For security reasons, verifying your login password is required to disable two-factor authentication.',
confirmToDeletePasskey: 'For security reasons, verifying your login password is required to delete a Passkey.',
authenticatorApp: 'Authenticator App',
authenticatorAppDescription:
'Use an authenticator app like Google Authenticator, Microsoft Authenticator, Authy, or 1Password to scan the QR code. It will generate a 6-digit code for you to enter below.',
@@ -2617,6 +2741,14 @@ export default {
nameRequired: 'Name cannot be empty',
nameDuplicate: 'Name already exists',
defaultChanged: 'Default downloader exists, has been replaced',
hostRequired: 'Host cannot be empty',
usernameRequired: 'Username cannot be empty',
passwordRequired: 'Password cannot be empty',
pathMapping: 'Path Mapping',
pathMappingRequired: 'Path cannot be empty',
pathMappingError: 'Must start with /',
storagePath: 'Storage Path',
downloadPath: 'Download Path',
},
filterRule: {
title: 'Filter Rule',
@@ -2661,9 +2793,15 @@ export default {
plexToken: 'X-Plex-Token',
plexTokenHint: 'X-Plex-Token obtained from Plex request URL in browser F12 -> Network',
username: 'Username',
usernameHint: 'Login username',
password: 'Password',
syncLibraries: 'Sync Libraries',
syncLibrariesHint: 'Only selected libraries will be synchronized',
hostRequired: 'Host cannot be empty',
apiKeyRequired: 'API Key cannot be empty',
tokenRequired: 'Token cannot be empty',
usernameRequired: 'Username cannot be empty',
passwordRequired: 'Password cannot be empty',
nameExists: '【{name}】 already exists, please use a different name',
},
bangumi: {
@@ -2697,6 +2835,9 @@ export default {
firstAirDateAsc: 'First Air Date Ascending',
voteAverageDesc: 'Vote Average Descending',
voteAverageAsc: 'Vote Average Ascending',
time: 'Latest',
count: 'Popular',
rating: 'Rating',
},
genreType: {
action: 'Action',
@@ -2826,7 +2967,9 @@ export default {
libraryStorage: 'Library Storage',
libraryDirectory: 'Library Directory',
transferType: 'Transfer Type',
transferTypeHint: 'File operation organization method, hard link saves space, copy is safer',
overwriteMode: 'Overwrite Mode',
overwriteModeHint: 'How to handle when target file already exists',
smartRename: 'Smart Rename',
scrapingMetadata: 'Scrape Metadata',
sendNotification: 'Send Notification',
@@ -2868,4 +3011,150 @@ export default {
customBackgroundImageHint: 'Supports web image URLs, leave blank for gradient background',
pluginCount: '{count} Plugins',
},
setupWizard: {
title: 'Welcome to MoviePilot!',
subtitle: 'Complete the configuration by the wizard, and start using it immediately.',
completed: 'Setup Wizard completed!',
failed: 'Setup Wizard failed, please try again',
complete: 'Complete Configuration',
loading: 'Loading configuration data...',
testing: 'Testing',
connectivityTestSuccess: 'Connectivity test passed',
connectivityTestFailed: 'Connectivity test failed',
testingStorage: 'Testing storage',
checkingStorage: 'Checking storage connectivity',
testingDownloader: 'Testing downloader',
checkingDownloader: 'Checking downloader connectivity',
testingMediaServer: 'Testing media server',
checkingMediaServer: 'Checking media server connectivity',
testingNotification: 'Testing notification',
checkingNotification: 'Checking notification connectivity',
testFailedHint: 'Please check if the configuration is correct, you can retest after modification',
unsupportedDownloaderType: 'Unsupported downloader type: {type}',
unsupportedMediaServerType: 'Unsupported media server type: {type}',
unsupportedNotificationType: 'Unsupported notification type: {type}',
passwordUpdateSuccess: 'Password updated successfully',
userCreateSuccess: 'User created successfully',
passwordUpdateFailed: 'Failed to update password',
basic: {
title: 'Basic Settings',
description: 'Set access domain, username/password and network configuration',
appDomain: 'App Domain',
appDomainHint: 'Used to add quick jump links when sending notifications',
wallpaper: 'Background Wallpaper',
wallpaperHint: 'Choose the source of the login page background',
recognizeSource: 'Recognize Source',
recognizeSourceHint: 'Set the default media info recognition data source',
apiToken: 'API Token',
apiTokenHint: 'API Token required for accessing MoviePilot API, please record it for subsequent use',
currentUserHint: 'Current user, cannot be modified',
passwordOptionalHint: 'Leave blank to keep current password',
confirmPasswordHint: 'Confirm new password',
apiTokenRequired: 'API Token is required',
},
storage: {
title: 'Storage',
description: 'Configure download directory and media library directory',
info: 'Storage Configuration',
infoDesc: 'Configure local storage directories for download and media library management',
downloadPath: 'Download Directory',
downloadPathHint: 'Set the storage path for downloaded files',
libraryPath: 'Media Library Directory',
libraryPathHint: 'Set the storage path for media files',
downloadPathRequired: 'Download directory is required',
libraryPathRequired: 'Media library directory is required',
},
downloader: {
title: 'Downloader',
description: 'Configure downloader',
info: 'Downloader Configuration',
infoDesc: 'Configure downloader for resource download, can choose qBittorrent or Transmission',
type: 'Downloader Type',
typeHint: 'Select the type of downloader to use',
name: 'Downloader Name',
nameHint: 'Set a name for the downloader',
qbittorrentConfig: 'qBittorrent Configuration',
transmissionConfig: 'Transmission Configuration',
host: 'Server Address',
username: 'Username',
password: 'Password',
downloadPath: 'Download Path',
},
mediaServer: {
title: 'Media Server',
description: 'Configure media server',
info: 'Media Server Configuration',
infoDesc: 'Configure media server for media library management, can choose Emby, Jellyfin or Plex etc.',
type: 'Media Server Type',
typeHint: 'Select the type of media server to use',
name: 'Server Name',
nameHint: 'Set a name for the media server',
embyConfig: 'Emby Configuration',
jellyfinConfig: 'Jellyfin Configuration',
plexConfig: 'Plex Configuration',
host: 'Server Address',
apiKey: 'API Key',
token: 'Access Token',
},
notification: {
title: 'Notification',
description: 'Configure notification channels',
info: 'Notification Configuration',
infoDesc: 'Configure notification channels for receiving system messages (optional)',
type: 'Notification Type',
typeHint: 'Select the type of notification channel to use',
name: 'Notification Name',
nameHint: 'Set a name for the notification channel',
telegramConfig: 'Telegram Configuration',
emailConfig: 'Email Configuration',
botToken: 'Bot Token',
chatId: 'Chat ID',
smtpServer: 'SMTP Server',
smtpPort: 'SMTP Port',
senderEmail: 'Sender Email',
senderPassword: 'Sender Password',
receiverEmail: 'Receiver Email',
},
preferences: {
title: 'Resource Preferences',
description: 'Set resource download preferences',
info: 'Resource Preferences',
infoDesc:
'Set resource download preferences, the system will automatically select the best resources based on these preferences',
quality: 'Quality Preference',
qualityHint: 'Select preferred video quality',
subtitle: 'Subtitle Preference',
subtitleHint: 'Select preferred subtitle type',
resolution: 'Resolution Preference',
resolutionHint: 'Select preferred video resolution',
presetRules: 'Preset Rules',
detailedConfig: 'Detailed Configuration',
quickPresets: 'Quick Presets',
quickPresetsDesc: 'Select preset configuration, system will automatically apply corresponding rules',
personalizationOptions: 'Personalization Options',
personalizationOptionsDesc: 'Adjust rules according to your needs',
excludeDolbyVision: 'Exclude Dolby Vision',
excludeDolbyVisionHint: 'Exclude Dolby Vision resources from rules when selected',
excludeBluray: 'Exclude Blu-ray',
excludeBlurayHint: 'Exclude Blu-ray resources from rules when selected',
presets: {
'4k-enthusiast': {
name: '4K Enthusiast',
description: 'Pursue the highest quality, prioritize 4K',
},
'balanced': {
name: 'Balanced Mode',
description: 'Balance between quality and storage space',
},
'space-saver': {
name: 'Space Saver',
description: 'Prioritize smaller files to save storage space',
},
'free-priority': {
name: 'Free Priority',
description: 'Prioritize free resources, no other requirements',
},
},
},
},
}

View File

@@ -30,6 +30,7 @@ export default {
saving: '保存中',
reset: '重置',
theme: '主题',
uiMode: '界面布局',
language: '语言',
pleaseWait: '请稍候...',
viewDetails: '查看详情',
@@ -49,6 +50,9 @@ export default {
itemsPerPage: '每页条数',
pageText: '{0}-{1} 共 {2} 条',
noDataText: '没有数据',
next: '下一步',
previous: '上一步',
skip: '跳过',
loadingText: '加载中...',
networkRequired: '此功能需要网络连接',
networkDisconnected: '网络连接已断开',
@@ -63,6 +67,10 @@ export default {
serviceUnavailable: '服务不可用',
status: '状态',
preset: '预设',
refresh: '刷新',
swUpdateReady: '新版本已就绪,请刷新页面以获取最新功能',
versionMismatch: '浏览器缓存版本与服务端版本不一致,请尝试清除缓存',
clearCache: '清除缓存',
},
mediaType: {
movie: '电影',
@@ -126,6 +134,7 @@ export default {
light: '浅色',
dark: '深色',
auto: '跟随系统',
autoUI: '自动',
transparent: '透明',
purple: '幻紫',
custom: '附加样式',
@@ -244,6 +253,22 @@ export default {
serverError: '登录失败,服务器错误!',
loginFailed: '登录失败',
checkCredentials: '请检查用户名、密码或双重验证码是否正确!',
twoFactorAuth: '双重验证',
loginWithPasskey: '使用通行密钥登录',
loginWithOtp: '使用验证码登录',
orUsePasskey: '或使用通行密钥进行验证',
verifyWithPasskey: '使用通行密钥验证',
otpPlaceholder: '请输入6位验证码',
passkeyLoginStartFailed: '启动通行密钥认证失败',
passkeyNotSelected: '未选择通行密钥',
passkeyLoginFailed: '通行密钥登录失败',
passkeyAuthCanceled: '通行密钥认证被取消',
passkeyLoginRetry: '通行密钥登录失败,请重试',
passkeyVerifyFailed: '通行密钥验证失败',
passkeyVerifyFailedRetry: '通行密钥验证失败,请重试',
mfa: {
selectVerificationMethod: '请选择验证方式',
},
},
menu: {
start: '开始',
@@ -320,10 +345,6 @@ export default {
title: '通知',
description: '通知渠道微信、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息发送范围',
},
words: {
title: '词表',
description: '自定义识别词、自定义制作组/字幕组、自定义占位符、文件整理屏蔽词',
},
about: {
title: '关于',
description: '软件版本',
@@ -367,8 +388,10 @@ export default {
deleteFailed: '用户删除失败!',
profile: '个人信息',
systemSettings: '系统设定',
wizardSettings: '设置向导',
siteAuth: '用户认证',
helpDocs: '帮助文档',
about: '关于',
restart: '重启',
management: '用户管理',
noUsers: '没有用户',
@@ -376,8 +399,11 @@ export default {
addUser: '添加用户',
editUser: '编辑用户',
username: '用户名',
usernameHint: '用于登录系统的用户名',
password: '密码',
passwordHint: '请输入登录密码',
confirmPassword: '确认密码',
confirmPasswordHint: '请再次输入密码以确认',
role: '角色',
email: '邮箱',
enabled: '启用',
@@ -406,10 +432,13 @@ export default {
name: '企业微信',
corpId: '企业ID',
corpIdHint: '企业微信后台企业信息中的企业ID',
corpIdRequired: '企业ID不能为空',
appId: '应用 AgentId',
appIdHint: '企业微信自建应用的AgentId',
appIdRequired: '应用AgentId不能为空',
appSecret: '应用 Secret',
appSecretHint: '企业微信自建应用的Secret',
appSecretRequired: '应用Secret不能为空',
proxy: '代理地址',
proxyHint: '微信消息的转发代理地址2022年6月20日后创建的自建应用才需要不使用代理时需要保留默认值',
token: 'Token',
@@ -424,8 +453,10 @@ export default {
name: 'Telegram',
token: 'Bot Token',
tokenHint: 'Telegram机器人token格式123456:ABC-DEF1234ghIkl-zyx57W2v1u123ew11',
tokenRequired: 'Bot Token不能为空',
chatId: 'Chat ID',
chatIdHint: '接受消息通知的用户、群组或频道Chat ID',
chatIdRequired: 'Chat ID不能为空',
users: '用户白名单',
usersHint: '可使用Telegram机器人的用户ID清单多个用户用,分隔,不填写则所有用户都能使用',
admins: '管理员白名单',
@@ -440,15 +471,30 @@ export default {
name: 'Slack',
oauthToken: 'Slack Bot User OAuth Token',
oauthTokenHint: 'Slack应用`OAuth & Permissions`页面中的`Bot User OAuth Token`',
oauthTokenRequired: 'OAuth Token不能为空',
appToken: 'Slack App-Level Token',
appTokenHint: 'Slack应用`OAuth & Permissions`页面中的`App-Level Token`',
channel: '频道名称',
channelHint: '消息发送频道,默认`全体`',
channelRequired: '频道名称不能为空',
},
discord: {
name: 'Discord',
botToken: 'Bot Token',
botTokenHint: 'Discord Bot Token需在开发者后台开启 Message Content Intent',
botTokenRequired: 'Bot Token不能为空',
guildId: '服务器 ID',
guildIdHint: '可选,限制使用的服务器;为空则使用已加入的任意服务器',
guildIdPlaceholder: '123456789012345678',
channelId: '频道 ID',
channelIdHint: '可选,默认广播频道;为空则自动选择可发送消息的频道',
channelIdPlaceholder: '123456789012345678',
},
synologychat: {
name: 'Synology Chat',
webhook: '机器人传入URL',
webhookHint: 'Synology Chat机器人传入URL',
webhookRequired: 'Webhook URL不能为空',
token: '令牌',
tokenHint: 'Synology Chat机器人令牌',
},
@@ -456,8 +502,10 @@ export default {
name: 'VoceChat',
host: '地址',
hostHint: 'VoceChat服务端地址格式http(s)://ip:port',
hostRequired: '地址不能为空',
apiKey: '机器人密钥',
apiKeyHint: 'VoceChat机器人密钥',
apiKeyRequired: 'API密钥不能为空',
channelId: '频道ID',
channelIdHint: 'VoceChat的频道ID不包含#号',
},
@@ -465,6 +513,7 @@ export default {
name: 'WebPush',
username: '登录用户名',
usernameHint: '只有对应的用户登录后才会推送消息',
usernameRequired: '用户名不能为空',
},
},
shortcut: {
@@ -493,6 +542,14 @@ export default {
title: '消息',
subtitle: '消息中心',
},
words: {
title: '词表',
subtitle: '词表设置',
},
cache: {
title: '缓存',
subtitle: '管理缓存',
},
},
workflow: {
components: '动作组件',
@@ -763,6 +820,8 @@ export default {
originalTitle: '原始标题',
status: '状态',
releaseDate: '上映日期',
digitalRelease: '数字发行',
physicalRelease: '实体发行',
originalLanguage: '原始语言',
productionCountries: '出品国家',
productionCompanies: '制作公司',
@@ -846,6 +905,7 @@ export default {
batchEnableError: '批量启用操作失败',
batchPauseError: '批量暂停操作失败',
batchDeleteError: '批量删除操作失败',
minSubscribers: '最小订阅人数',
},
recommend: {
all: '全部',
@@ -1168,6 +1228,7 @@ export default {
title: '关于 MoviePilot',
softwareVersion: '软件版本',
frontendVersion: '前端版本',
browserVersion: '浏览器缓存版本',
authVersion: '认证资源版本',
indexerVersion: '站点资源版本',
configDir: '配置目录',
@@ -1175,7 +1236,7 @@ export default {
timezone: '时区',
latest: '最新',
supportingSites: '支持站点',
support: '支',
support: '支',
documentation: '文档',
feedback: '问题反馈',
channel: '发布频道',
@@ -1187,6 +1248,7 @@ export default {
dataDirectory: '/moviepilot',
expand: '展开',
collapse: '收起',
clearCache: '清除缓存',
},
system: {
custom: '自定义',
@@ -1211,9 +1273,23 @@ export default {
apiTokenLength: 'API Token不得低于16位',
githubToken: 'Github Token',
githubTokenFormat: 'ghp_**** 或 github_pat_****',
githubTokenHint: '用于提高插件等访问Github API时的限流阈值',
githubTokenHint: '用于提高插件等访问Github API时的限流阈值,建议配置,否则插件可能无法正常使用',
ocrHost: '验证码识别服务器',
ocrHostHint: '用于站点签到、更新站点Cookie等识别验证码',
aiAgent: '启用智能助手',
aiAgentEnable: '启用智能助手',
aiAgentEnableHint: '启用后可使用智能助手功能需要配置LLM相关参数',
llmProvider: 'LLM提供商',
llmProviderHint: '选择使用的LLM服务提供商',
llmModel: 'LLM模型名称',
llmModelHint: '指定使用的LLM模型如gpt-3.5-turbo、deepseek-chat等',
llmApiKey: 'LLM API密钥',
llmApiKeyHint: 'LLM服务提供商的API密钥用于身份验证',
llmApiKeyPlaceholder: '请输入API密钥',
llmBaseUrl: 'LLM基础URL',
llmBaseUrlHint: 'LLM API的基础URL地址用于自定义API端点',
aiAgentGlobal: '全局智能助手',
aiAgentGlobalHint: '启用全局智能助手功能,所有消息对话均使用智能体回答而不用使用/ai命令',
advancedSettings: '高级设置',
advancedSettingsDesc: '系统进阶设置,特殊情况下才需要调整',
downloaders: '下载器',
@@ -1648,7 +1724,9 @@ export default {
bestVersionRuleGroup: '洗版优先级规则组',
bestVersionRuleGroupHint: '按选定的过滤规则组对洗版订阅进行过滤',
timedSearch: '订阅定时搜索',
timedSearchHint: '每隔24小时全站搜索,以补全订阅可能漏掉的资源',
timedSearchHint: '每隔指定时间全站搜索,以补全订阅可能漏掉的资源',
searchInterval: '订阅搜索时间间隔',
searchIntervalHint: '设置订阅搜索的时间间隔,仅在开启订阅定时搜索时生效',
checkLocalMedia: '检查文件系统资源',
checkLocalMediaHint: '扫描存储目录中是否已存在相应资源文件,以避免重复下载;不管是否开启都会检查媒体服务器',
modes: {
@@ -1663,6 +1741,8 @@ export default {
hour1: '1小时',
hour12: '12小时',
day1: '1天',
day3: '3天',
week1: '一周',
},
saveSuccess: '订阅站点保存成功',
saveFailed: '订阅站点保存失败!',
@@ -1672,6 +1752,8 @@ export default {
cache: {
title: '缓存管理',
subtitle: '管理缓存的站点资源',
totalCount: '总条数',
siteCount: '站点数',
filterByTitle: '按标题筛选',
filterBySite: '按站点筛选',
selectSite: '选择站点',
@@ -1744,8 +1826,12 @@ export default {
add: '添加用户',
edit: '编辑用户',
username: '用户名',
usernameRequired: '用户名不能为空',
password: '密码',
passwordMinLength: '密码长度不能少于6位',
confirmPassword: '确认密码',
confirmPasswordRequired: '请确认密码',
passwordMismatch: '两次输入的密码不一致',
email: '邮箱',
nickname: '昵称',
status: '状态',
@@ -1766,9 +1852,7 @@ export default {
webPush: 'WebPush',
creatingUser: '正在创建【{name}】用户,请稍后',
updatingUser: '正在更新【{name}】用户,请稍后',
usernameRequired: '用户名不能为空',
usernameExists: '用户名已存在',
passwordMismatch: '两次输入的密码不一致',
userCreated: '用户【{name}】创建成功',
userCreateFailed: '创建用户失败:{message}',
userUpdateSuccess: '用户【{name}】更新成功',
@@ -1844,6 +1928,8 @@ export default {
startDownload: '开始下载',
downloadSuccess: '{site} {title} 下载成功!',
downloadFailed: '{site} {title} 下载失败:{message}',
showAdvancedOptions: '显示高级选项',
hideAdvancedOptions: '隐藏高级选项',
},
subscribeShare: {
shareSubscription: '分享订阅',
@@ -2064,6 +2150,10 @@ export default {
startAll: '全部开始',
refresh: '刷新',
close: '关闭',
processingFile: '正在整理',
overallProgress: '整体进度',
currentFileProgress: '当前文件进度',
processingStatus: '整理中',
},
reorganize: {
title: '整理',
@@ -2463,15 +2553,47 @@ export default {
vocechatUser: 'VoceChat用户',
synologychatUser: 'SynologyChat用户',
doubanUser: '豆瓣用户',
twoFactorAuthentication: '登录双重验证',
setupAuthenticator: '设置身份验证',
authenticatorManagement: '身份验证器管理',
authenticatorEnabled: '您已启用身份验证器双重验证',
clearAuthenticatorTip: '如需设置新的身份验证器,请先清除当前配置。',
clearAuthenticator: '清除身份验证器',
enableTwoFactor: '开启双重验证',
disableTwoFactor: '关闭双重验证',
setupMfa: '设置双重验证',
enableMfa: '开启双重验证',
useAuthenticator: '使用身份验证器',
usePasskey: '使用通行密钥',
enabled: '已启用',
keysCount: '{count} 个密钥',
passkeyManagement: '通行密钥管理',
registerNewPasskey: '注册新通行密钥',
passkeyDescription: '通行密钥可以让您无需密码即可快速安全地登录。',
passkeyName: '通行密钥名称',
passkeyNamePlaceholder: '例如iPhone、Windows Hello',
registerPasskey: '注册通行密钥',
registeredPasskeys: '已注册的通行密钥',
createdAt: '创建时间',
noPasskeys: '您还没有注册任何通行密钥',
passkeyNameRequired: '请输入通行密钥名称',
passkeyRegisterSuccess: '通行密钥注册成功',
passkeyRegisterFailed: '注册失败',
passkeyRegisterCancelled: '注册被取消',
passkeyDeleteSuccess: '通行密钥已删除',
passkeyDeleteFailed: '删除失败',
passkeyDomainWarning: '通行密钥PassKey的可用性与 {domain} 紧密相关。在公网环境下,请务必在“基础设置”中配置正确的访问域名。域名变更或配置错误将导致通行密钥无法使用。',
otpRequiredForPasskey: '为了安全起见,您必须先启用 {otp} 验证码,然后才能注册通行密钥。这是为了防止在域名配置变动导致 PassKey 失效时,您仍能通过 OTP 码登录账户。',
accessDomain: '访问域名',
otpAuthenticator: 'OTP 身份验证器',
otpGenerateFailed: '获取otp uri失败{message}',
otpDisableSuccess: '关闭登录双重验证成功!',
otpDisableFailed: '关闭otp失败{message}',
otpCodeRequired: '请填写6位验证码',
otpEnableSuccess: '开启登录双重验证成功!',
otpEnableFailed: '开启otp失败{message}',
otpDisableRestrictedByPasskey: '您已注册通行密钥,请先删除所有通行密钥再关闭 OTP 验证。',
confirmToDisableOtp: '为了安全起见,关闭双重验证需要验证您的登录密码。',
confirmToDeletePasskey: '为了安全起见,删除通行密钥需要验证您的登录密码。',
authenticatorApp: '身份验证器',
authenticatorAppDescription:
'使用像Google Authenticator、Microsoft Authenticator、Authy或1Password这样的身份验证器应用程序扫描二维码。它将为您生成一个6位数的代码供您在下方输入。',
@@ -2587,6 +2709,14 @@ export default {
nameRequired: '不能为空,且不能重名',
nameDuplicate: '名称已存在',
defaultChanged: '存在默认下载器,已替换',
hostRequired: '地址不能为空',
usernameRequired: '用户名不能为空',
passwordRequired: '密码不能为空',
pathMapping: '路径映射',
pathMappingRequired: '路径不能为空',
pathMappingError: '必须以 / 开头',
storagePath: '存储路径',
downloadPath: '下载路径',
},
filterRule: {
title: '过滤规则',
@@ -2631,10 +2761,16 @@ export default {
plexToken: 'X-Plex-Token',
plexTokenHint: '浏览器F12->网络从Plex请求URL中获取的X-Plex-Token',
username: '用户名',
usernameHint: '登录用户名',
password: '密码',
syncLibraries: '同步媒体库',
syncLibrariesHint: '只有选中的媒体库才会被同步',
nameExists: '【{name}】已存在,请替换为其他名称',
hostRequired: '地址不能为空',
apiKeyRequired: 'API密钥不能为空',
tokenRequired: 'Token不能为空',
usernameRequired: '用户名不能为空',
passwordRequired: '密码不能为空',
},
bangumi: {
category: '类别',
@@ -2667,6 +2803,9 @@ export default {
firstAirDateAsc: '首播日期升序',
voteAverageDesc: '评分降序',
voteAverageAsc: '评分升序',
time: '最新',
count: '热门',
rating: '评分',
},
genreType: {
action: '动作',
@@ -2796,7 +2935,9 @@ export default {
libraryStorage: '媒体库存储',
libraryDirectory: '媒体库目录',
transferType: '整理方式',
transferTypeHint: '文件操作整理方式,硬链接节省空间,复制更安全',
overwriteMode: '覆盖模式',
overwriteModeHint: '当目标文件已存在时的处理方式',
smartRename: '智能重命名',
scrapingMetadata: '刮削元数据',
sendNotification: '发送通知',
@@ -2837,4 +2978,169 @@ export default {
customBackgroundImageHint: '支持网络图片URL留空则使用渐变背景',
pluginCount: '{count} 个插件',
},
setupWizard: {
title: '欢迎使用 MoviePilot ',
subtitle: '按向导完成配置,即刻开始使用。',
completed: '配置向导完成!',
failed: '配置向导失败,请重试',
complete: '完成配置',
loading: '正在加载配置数据...',
testing: '正在测试',
connectivityTestSuccess: '连通性测试通过',
connectivityTestFailed: '连通性测试失败',
testingStorage: '正在测试存储目录',
checkingStorage: '检查存储目录连通性',
storageTestFailed: '存储目录测试失败',
testingDownloader: '正在测试下载器',
checkingDownloader: '检查下载器连通性',
downloaderTestFailed: '下载器测试失败',
downloaderNotSelected: '未选择下载器',
unsupportedDownloaderType: '不支持的下载器类型: {type}',
testingMediaServer: '正在测试媒体服务器',
checkingMediaServer: '检查媒体服务器连通性',
mediaServerTestFailed: '媒体服务器测试失败',
mediaServerNotSelected: '未选择媒体服务器',
unsupportedMediaServerType: '不支持的媒体服务器类型: {type}',
testingNotification: '正在测试消息通知',
checkingNotification: '检查消息通知连通性',
notificationTestFailed: '消息通知测试失败',
notificationNotSelected: '未选择通知类型',
unsupportedNotificationType: '不支持的通知类型: {type}',
testFailedHint: '请检查配置是否正确,修改后可以重新测试',
saveStepFailed: '保存步骤设置失败',
basicSettingsSaved: '基础设置保存成功',
saveBasicSettingsFailed: '保存基础设置失败',
storageSettingsSaved: '存储设置保存成功',
saveStorageSettingsFailed: '保存存储设置失败',
downloaderSettingsSaved: '下载器设置保存成功',
saveDownloaderSettingsFailed: '保存下载器设置失败',
mediaServerSettingsSaved: '媒体服务器设置保存成功',
saveMediaServerSettingsFailed: '保存媒体服务器设置失败',
notificationSettingsSaved: '通知设置保存成功',
saveNotificationSettingsFailed: '保存通知设置失败',
preferenceSettingsSaved: '偏好设置保存成功',
savePreferenceSettingsFailed: '保存偏好设置失败',
passwordUpdateSuccess: '密码更新成功',
passwordUpdateFailed: '密码更新失败',
userCreateSuccess: '用户创建成功',
basic: {
title: '基础设置',
description: '设置访问域名、用户名密码和网络配置',
appDomain: '访问域名',
appDomainHint: '用于发送通知时,添加快捷跳转地址',
wallpaper: '背景壁纸',
wallpaperHint: '选择登录页面背景来源',
recognizeSource: '识别数据源',
recognizeSourceHint: '设置默认媒体信息识别数据源',
apiToken: 'API 令牌',
apiTokenHint: '访问MoviePilot API 需要的访问令牌,请记录下来以便后续使用',
currentUserHint: '当前用户,不可修改',
passwordOptionalHint: '留空表示不修改密码',
confirmPasswordHint: '确认新密码',
apiTokenRequired: 'API Token不能为空',
},
storage: {
title: '存储',
description: '配置下载目录和媒体库目录',
info: '存储配置说明',
infoDesc: '配置本地存储目录,用于下载和媒体库管理',
downloadPath: '下载目录',
downloadPathHint: '设置下载文件的存储路径',
libraryPath: '媒体库目录',
libraryPathHint: '设置媒体文件的存储路径',
downloadPathRequired: '下载目录不能为空',
libraryPathRequired: '媒体库目录不能为空',
},
downloader: {
title: '下载器',
description: '配置下载器',
info: '下载器配置说明',
infoDesc: '配置下载器用于下载资源可选择qBittorrent或Transmission',
type: '下载器类型',
typeHint: '选择要使用的下载器类型',
name: '下载器名称',
nameHint: '为下载器设置一个名称',
qbittorrentConfig: 'qBittorrent 配置',
transmissionConfig: 'Transmission 配置',
host: '服务器地址',
username: '用户名',
password: '密码',
downloadPath: '下载路径',
},
mediaServer: {
title: '媒体服务器',
description: '配置媒体服务器',
info: '媒体服务器配置说明',
infoDesc: '配置媒体服务器用于媒体库管理可选择Emby、Jellyfin或Plex等',
type: '媒体服务器类型',
typeHint: '选择要使用的媒体服务器类型',
name: '服务器名称',
nameHint: '为媒体服务器设置一个名称',
embyConfig: 'Emby 配置',
jellyfinConfig: 'Jellyfin 配置',
plexConfig: 'Plex 配置',
host: '服务器地址',
apiKey: 'API 密钥',
token: '访问令牌',
},
notification: {
title: '通知',
description: '配置通知渠道',
info: '通知配置说明',
infoDesc: '配置通知渠道用于接收系统消息(可选)',
type: '通知类型',
typeHint: '选择要使用的通知渠道类型',
name: '通知名称',
nameHint: '为通知渠道设置一个名称',
telegramConfig: 'Telegram 配置',
emailConfig: '邮件配置',
botToken: '机器人令牌',
chatId: '聊天ID',
smtpServer: 'SMTP 服务器',
smtpPort: 'SMTP 端口',
senderEmail: '发送邮箱',
senderPassword: '发送密码',
receiverEmail: '接收邮箱',
},
preferences: {
title: '资源偏好',
description: '设置资源下载偏好',
info: '资源偏好说明',
infoDesc: '设置资源下载的偏好,系统将根据这些偏好自动选择最佳资源',
quality: '质量偏好',
qualityHint: '选择偏好的视频质量',
subtitle: '字幕偏好',
subtitleHint: '选择偏好的字幕类型',
resolution: '分辨率偏好',
resolutionHint: '选择偏好的视频分辨率',
presetRules: '预设规则',
detailedConfig: '详细配置',
quickPresets: '快速预设',
quickPresetsDesc: '选择预设配置,系统将自动应用对应的规则',
personalizationOptions: '个性化选项',
personalizationOptionsDesc: '根据您的需求调整规则',
excludeDolbyVision: '排除杜比视界',
excludeDolbyVisionHint: '选中后规则中将排除杜比视界资源',
excludeBluray: '排除蓝光原盘',
excludeBlurayHint: '选中后规则中将排除蓝光原盘资源',
presets: {
'4k-enthusiast': {
name: '4K发烧友',
description: '追求最高画质优先4K',
},
'balanced': {
name: '平衡模式',
description: '画质与存储空间的平衡选择',
},
'space-saver': {
name: '节省空间',
description: '优先较小文件,节省存储空间',
},
'free-priority': {
name: '免费优先',
description: '优先免费资源,其它的没有要求',
},
},
},
},
}

View File

@@ -30,6 +30,7 @@ export default {
saving: '保存中',
reset: '重置',
theme: '主題',
uiMode: '界面佈局',
language: '語言',
pleaseWait: '請稍候...',
viewDetails: '查看詳情',
@@ -49,6 +50,9 @@ export default {
itemsPerPage: '每頁條數',
pageText: '{0}-{1} 共 {2} 條',
noDataText: '沒有數據',
next: '下一步',
previous: '上一步',
skip: '跳過',
loadingText: '加載中...',
networkRequired: '此功能需要網絡連接',
networkDisconnected: '網絡連接已斷開',
@@ -63,6 +67,10 @@ export default {
serviceUnavailable: '服務不可用',
status: '狀態',
preset: '預設',
refresh: '刷新',
swUpdateReady: '新版本已就緒,請刷新頁面以獲取最新功能',
versionMismatch: '瀏覽器快取版本與伺服器版本不一致,請嘗試清除快取',
clearCache: '清除快取',
},
mediaType: {
movie: '電影',
@@ -126,6 +134,7 @@ export default {
light: '淺色',
dark: '深色',
auto: '跟隨系統',
autoUI: '自動',
transparent: '透明',
purple: '幻紫',
custom: '附加樣式',
@@ -245,6 +254,22 @@ export default {
noPermission: '登錄失敗,您沒有任何功能權限,請聯繫管理員!',
loginFailed: '登錄失敗',
checkCredentials: '請檢查用戶名、密碼或雙重驗證碼是否正確!',
twoFactorAuth: '雙重驗證',
loginWithPasskey: '使用通行密鑰登錄',
loginWithOtp: '使用驗證碼登錄',
orUsePasskey: '或使用通行密鑰進行驗證',
verifyWithPasskey: '使用通行密鑰驗證',
otpPlaceholder: '請輸入6位驗證碼',
passkeyLoginStartFailed: '啟動通行密鑰驗證失敗',
passkeyNotSelected: '未選擇通行密鑰',
passkeyLoginFailed: '通行密鑰登錄失敗',
passkeyAuthCanceled: '通行密鑰驗證被取消',
passkeyLoginRetry: '通行密鑰登錄失敗,請重試',
passkeyVerifyFailed: '通行密鑰驗证失敗',
passkeyVerifyFailedRetry: '通行密鑰驗证失敗,請重試',
mfa: {
selectVerificationMethod: '請選擇驗证方式',
},
},
menu: {
start: '開始',
@@ -321,10 +346,6 @@ export default {
title: '通知',
description: '通知渠道微信、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息發送範圍',
},
words: {
title: '詞表',
description: '自定義識別詞、自定義製作組/字幕組、自定義占位符、文件整理屏蔽詞',
},
about: {
title: '關於',
description: '軟件版本',
@@ -368,8 +389,10 @@ export default {
deleteFailed: '用戶刪除失敗!',
profile: '個人信息',
systemSettings: '系統設定',
wizardSettings: '設定向導',
siteAuth: '用戶認證',
helpDocs: '幫助文檔',
about: '關於',
restart: '重啟',
management: '用戶管理',
noUsers: '沒有用戶',
@@ -377,8 +400,11 @@ export default {
addUser: '添加用戶',
editUser: '編輯用戶',
username: '用戶名',
usernameHint: '用於登入系統的用戶名',
password: '密碼',
passwordHint: '請輸入登入密碼',
confirmPassword: '確認密碼',
confirmPasswordHint: '請再次輸入密碼以確認',
role: '角色',
email: '郵箱',
enabled: '啟用',
@@ -443,6 +469,18 @@ export default {
channel: '頻道名稱',
channelHint: '消息發送頻道,默認`全體`',
},
discord: {
name: 'Discord',
botToken: 'Bot Token',
botTokenHint: 'Discord Bot Token需在開發者後台開啟 Message Content Intent',
botTokenRequired: 'Bot Token不能為空',
guildId: '伺服器 ID',
guildIdHint: '可選,限制使用的伺服器;空白則使用已加入的任意伺服器',
guildIdPlaceholder: '123456789012345678',
channelId: '頻道 ID',
channelIdHint: '可選,預設廣播頻道;空白則自動選擇可發送消息的頻道',
channelIdPlaceholder: '123456789012345678',
},
synologychat: {
name: 'Synology Chat',
webhook: '機器人傳入URL',
@@ -491,6 +529,14 @@ export default {
title: '消息',
subtitle: '消息中心',
},
words: {
title: '詞表',
subtitle: '詞表設置',
},
cache: {
title: '緩存',
subtitle: '管理緩存',
},
},
workflow: {
components: '動作組件',
@@ -761,6 +807,8 @@ export default {
originalTitle: '原始標題',
status: '狀態',
releaseDate: '上映日期',
digitalRelease: '數位發行',
physicalRelease: '實體發行',
originalLanguage: '原始語言',
productionCountries: '出品國家',
productionCompanies: '製作公司',
@@ -844,6 +892,7 @@ export default {
batchEnableError: '批量啟用操作失敗',
batchPauseError: '批量暫停操作失敗',
batchDeleteError: '批量刪除操作失敗',
minSubscribers: '最小訂閱人數',
},
recommend: {
all: '全部',
@@ -1167,6 +1216,7 @@ export default {
title: '關於 MoviePilot',
softwareVersion: '軟件版本',
frontendVersion: '前端版本',
browserVersion: '瀏覽器緩存版本',
authVersion: '認證資源版本',
indexerVersion: '站點資源版本',
configDir: '配置目錄',
@@ -1186,6 +1236,7 @@ export default {
dataDirectory: '/moviepilot',
expand: '展開',
collapse: '收起',
clearCache: '清除快取',
},
system: {
custom: '自定義',
@@ -1210,9 +1261,23 @@ export default {
apiTokenLength: 'API Token不得低於16位',
githubToken: 'Github Token',
githubTokenFormat: 'ghp_**** 或 github_pat_****',
githubTokenHint: '用於提高插件等訪問Github API時的限流閾值',
githubTokenHint: '用於提高插件等訪問Github API時的限流閾值,建議配置,否則插件可能無法正常使用',
ocrHost: '驗證碼識別服務器',
ocrHostHint: '用於站點簽到、更新站點Cookie等識別驗證碼',
aiAgent: '啟用智能助手',
aiAgentEnable: '啟用智能助手',
aiAgentEnableHint: '啟用後可使用智能助手功能需要配置LLM相關參數',
llmProvider: 'LLM提供商',
llmProviderHint: '選擇使用的LLM服務提供商',
llmModel: 'LLM模型名稱',
llmModelHint: '指定使用的LLM模型如gpt-3.5-turbo、deepseek-chat等',
llmApiKey: 'LLM API密鑰',
llmApiKeyHint: 'LLM服務提供商的API密鑰用於身份驗證',
llmApiKeyPlaceholder: '請輸入API密鑰',
llmBaseUrl: 'LLM基礎URL',
llmBaseUrlHint: 'LLM API的基礎URL地址用於自定義API端點',
aiAgentGlobal: '全局智能助手',
aiAgentGlobalHint: '啟用全局智能助手功能,所有消息對話均使用智能體回答而不用使用/ai命令',
advancedSettings: '高級設置',
advancedSettingsDesc: '系統進階設置,特殊情況下才需要調整',
downloaders: '下載器',
@@ -1646,7 +1711,9 @@ export default {
bestVersionRuleGroup: '洗版優先級規則組',
bestVersionRuleGroupHint: '按選定的過濾規則組對洗版訂閱進行過濾',
timedSearch: '訂閱定時搜索',
timedSearchHint: '每隔24小時全站搜索,以補全訂閱可能漏掉的資源',
timedSearchHint: '每隔指定時間全站搜索,以補全訂閱可能漏掉的資源',
searchInterval: '訂閱搜索時間間隔',
searchIntervalHint: '設置訂閱搜索的時間間隔,僅在開啟訂閱定時搜索時生效',
checkLocalMedia: '檢查文件系統資源',
checkLocalMediaHint: '掃描存儲目錄中是否已存在相應資源文件,以避免重複下載;不管是否開啟都會檢查媒體伺服器',
modes: {
@@ -1661,6 +1728,8 @@ export default {
hour1: '1小時',
hour12: '12小時',
day1: '1天',
day3: '3天',
week1: '一週',
},
saveSuccess: '訂閱站點保存成功',
saveFailed: '訂閱站點保存失敗!',
@@ -1743,8 +1812,12 @@ export default {
add: '添加用戶',
edit: '編輯用戶',
username: '用戶名',
usernameRequired: '用戶名不能為空',
password: '密碼',
passwordMinLength: '密碼長度不能少於6位',
confirmPassword: '確認密碼',
confirmPasswordRequired: '請確認密碼',
passwordMismatch: '兩次輸入的密碼不一致',
email: '郵箱',
nickname: '暱稱',
status: '狀態',
@@ -1765,9 +1838,7 @@ export default {
webPush: 'WebPush',
creatingUser: '正在創建【{name}】用戶,請稍後',
updatingUser: '正在更新【{name}】用戶,請稍後',
usernameRequired: '用戶名不能為空',
usernameExists: '用戶名已存在',
passwordMismatch: '兩次輸入的密碼不一致',
userCreated: '用戶【{name}】創建成功',
userCreateFailed: '創建用戶失敗:{message}',
userUpdateSuccess: '用戶【{name}】更新成功',
@@ -1843,6 +1914,8 @@ export default {
startDownload: '開始下載',
downloadSuccess: '{site} {title} 下載成功!',
downloadFailed: '{site} {title} 下載失敗:{message}',
showAdvancedOptions: '顯示高級選項',
hideAdvancedOptions: '隱藏高級選項',
},
subscribeShare: {
shareSubscription: '分享訂閱',
@@ -2063,6 +2136,10 @@ export default {
startAll: '全部開始',
refresh: '刷新',
close: '關閉',
processingFile: '正在整理',
overallProgress: '整體進度',
currentFileProgress: '當前文件進度',
processingStatus: '整理中',
},
reorganize: {
title: '整理',
@@ -2462,15 +2539,47 @@ export default {
vocechatUser: 'VoceChat用戶',
synologychatUser: 'SynologyChat用戶',
doubanUser: '豆瓣用戶',
twoFactorAuthentication: '登錄雙重驗證',
setupAuthenticator: '設置身份驗證',
authenticatorManagement: '身份驗證器管理',
authenticatorEnabled: '您已啟用身份驗證器雙重驗證',
clearAuthenticatorTip: '如需設置新的身份驗證器,請先清除當前配置。',
clearAuthenticator: '清除身份驗證器',
enableTwoFactor: '開啟雙重驗證',
disableTwoFactor: '關閉雙重驗證',
setupMfa: '設置雙重驗證',
enableMfa: '開啟雙重驗證',
useAuthenticator: '使用身份驗證器',
usePasskey: '使用通行密鑰',
enabled: '已啟用',
keysCount: '{count} 個密鑰',
passkeyManagement: '通行密鑰管理',
registerNewPasskey: '註冊新通行密鑰',
passkeyDescription: '通行密鑰可以讓您無需密碼即可快速安全地登入。',
passkeyName: '通行密鑰名稱',
passkeyNamePlaceholder: '例如iPhone、Windows Hello',
registerPasskey: '註冊通行密鑰',
registeredPasskeys: '已註冊的通行密鑰',
createdAt: '建立時間',
noPasskeys: '您還沒有註冊任何通行密鑰',
passkeyNameRequired: '請輸入通行密鑰名稱',
passkeyRegisterSuccess: '通行密鑰註冊成功',
passkeyRegisterFailed: '註冊失敗',
passkeyRegisterCancelled: '註冊被取消',
passkeyDeleteSuccess: '通行密鑰已刪除',
passkeyDeleteFailed: '刪除失敗',
passkeyDomainWarning: '通行密鑰PassKey的可用性與 {domain} 緊密相關。在公網環境下,請務必在「基本設定」中配置正確的訪問域名。域名變更或配置錯誤將導致通行密鑰無法使用。',
otpRequiredForPasskey: '為了安全起見,您必須先啟用 {otp} 驗證碼,然後才能註冊通行密鑰。這是為了防止在網域配置變動導致 PassKey 失效時,您仍能通過 OTP 碼登入帳戶。',
accessDomain: '訪問域名',
otpAuthenticator: 'OTP 身份驗證器',
otpGenerateFailed: '獲取otp uri失敗{message}',
otpDisableSuccess: '關閉登錄雙重驗證成功!',
otpDisableFailed: '關閉otp失敗{message}',
otpCodeRequired: '請填寫6位驗證碼',
otpEnableSuccess: '開啟登錄雙重驗證成功!',
otpEnableFailed: '開啟otp失敗{message}',
otpDisableRestrictedByPasskey: '您已註冊通行密鑰,請先刪除所有通行密鑰再關閉 OTP 驗證。',
confirmToDisableOtp: '為了安全起見,關閉雙重驗證需要驗證您的登錄密碼。',
confirmToDeletePasskey: '為了安全起見,刪除通行密鑰需要驗證您的登錄密碼。',
authenticatorApp: '身份驗證器',
authenticatorAppDescription:
'使用像Google Authenticator、Microsoft Authenticator、Authy或1Password這樣的身份驗證器應用程序掃描二維碼。它將為您生成一個6位數的代碼供您在下方輸入。',
@@ -2586,6 +2695,14 @@ export default {
nameRequired: '名稱不能為空',
nameDuplicate: '名稱已存在',
defaultChanged: '存在預設下載器,已替換',
hostRequired: '地址不能為空',
usernameRequired: '用戶名不能為空',
passwordRequired: '密碼不能為空',
pathMapping: '路徑映射',
pathMappingRequired: '路徑不能為空',
pathMappingError: '必須以 / 開頭',
storagePath: '存儲路徑',
downloadPath: '下載路徑',
},
filterRule: {
title: '過濾規則',
@@ -2621,15 +2738,21 @@ export default {
host: '地址',
hostPlaceholder: 'http(s)://ip:port',
hostHint: '服務端地址格式http(s)://ip:port',
hostRequired: '地址不能為空',
playHost: '外網播放地址',
playHostPlaceholder: 'http(s)://domain:port',
playHostHint: '跳轉播放頁面使用的地址格式http(s)://domain:port',
apiKey: 'API密鑰',
apiKeyRequired: 'API密鑰不能為空',
embyApiKeyHint: 'Emby設置->高級->API密鑰中生成的密鑰',
jellyfinApiKeyHint: 'Jellyfin設置->高級->API密鑰中生成的密鑰',
plexToken: 'X-Plex-Token',
tokenRequired: 'Token不能為空',
usernameRequired: '用戶名不能為空',
passwordRequired: '密碼不能為空',
plexTokenHint: '瀏覽器F12->網絡從Plex請求URL中獲取的X-Plex-Token',
username: '用戶名',
usernameHint: '登錄用戶名',
password: '密碼',
syncLibraries: '同步媒體庫',
syncLibrariesHint: '只有選中的媒體庫才會被同步',
@@ -2666,6 +2789,9 @@ export default {
firstAirDateAsc: '首播日期升序',
voteAverageDesc: '評分降序',
voteAverageAsc: '評分升序',
time: '最新',
count: '熱門',
rating: '評分',
},
genreType: {
action: '動作',
@@ -2795,7 +2921,9 @@ export default {
libraryStorage: '媒體庫存儲',
libraryDirectory: '媒體庫目錄',
transferType: '轉移方式',
transferTypeHint: '文件操作整理方式,硬連結節省空間,複製更安全',
overwriteMode: '覆蓋模式',
overwriteModeHint: '當目標文件已存在時的處理方式',
smartRename: '智能重命名',
scrapingMetadata: '刮削元數據',
sendNotification: '發送通知',
@@ -2836,4 +2964,149 @@ export default {
customBackgroundImageHint: '支援網路圖片URL留空則使用漸變背景',
pluginCount: '{count} 個插件',
},
setupWizard: {
title: '歡迎使用 MoviePilot ',
subtitle: '按向導完成配置,即刻開始使用。',
completed: '設定精靈完成!',
failed: '設定精靈失敗,請重試',
complete: '完成設定',
loading: '正在載入配置資料...',
testing: '正在測試',
connectivityTestSuccess: '連通性測試通過',
connectivityTestFailed: '連通性測試失敗',
testingStorage: '正在測試存儲目錄',
checkingStorage: '檢查存儲目錄連通性',
testingDownloader: '正在測試下載器',
checkingDownloader: '檢查下載器連通性',
testingMediaServer: '正在測試媒體服務器',
checkingMediaServer: '檢查媒體服務器連通性',
testingNotification: '正在測試消息通知',
checkingNotification: '檢查消息通知連通性',
testFailedHint: '請檢查配置是否正確,修改後可以重新測試',
unsupportedDownloaderType: '不支援的下載器類型: {type}',
unsupportedMediaServerType: '不支援的媒體服務器類型: {type}',
unsupportedNotificationType: '不支援的通知類型: {type}',
passwordUpdateSuccess: '密碼更新成功',
userCreateSuccess: '使用者建立成功',
passwordUpdateFailed: '密碼更新失敗',
basic: {
title: '基礎設定',
description: '設定存取網域、用戶名密碼和網路配置',
appDomain: '存取網域',
appDomainHint: '用於發送通知時,新增快速跳轉位址',
wallpaper: '背景桌布',
wallpaperHint: '選擇登入頁面背景來源',
recognizeSource: '識別資料來源',
recognizeSourceHint: '設定預設媒體資訊識別資料來源',
apiToken: 'API 權杖',
apiTokenHint: '訪問MoviePilot API 需要的訪問令牌,請記錄下來以便後續使用',
currentUserHint: '目前使用者,不可修改',
passwordOptionalHint: '留空表示不修改密碼',
confirmPasswordHint: '確認新密碼',
apiTokenRequired: 'API Token 不能為空',
},
storage: {
title: '儲存',
description: '設定下載目錄和媒體庫目錄',
info: '儲存設定說明',
infoDesc: '設定本機儲存目錄,用於下載和媒體庫管理',
downloadPath: '下載目錄',
downloadPathHint: '設定下載檔案的儲存路徑',
libraryPath: '媒體庫目錄',
libraryPathHint: '設定媒體檔案的儲存路徑',
downloadPathRequired: '下載目錄不能為空',
libraryPathRequired: '媒體庫目錄不能為空',
},
downloader: {
title: '下載器',
description: '設定下載器',
info: '下載器設定說明',
infoDesc: '設定下載器用於下載資源可選擇qBittorrent或Transmission',
type: '下載器類型',
typeHint: '選擇要使用的下載器類型',
name: '下載器名稱',
nameHint: '為下載器設定一個名稱',
qbittorrentConfig: 'qBittorrent 設定',
transmissionConfig: 'Transmission 設定',
host: '伺服器位址',
username: '使用者名稱',
password: '密碼',
downloadPath: '下載路徑',
},
mediaServer: {
title: '媒體伺服器',
description: '設定媒體伺服器',
info: '媒體伺服器設定說明',
infoDesc: '設定媒體伺服器用於媒體庫管理可選擇Emby、Jellyfin或Plex等',
type: '媒體伺服器類型',
typeHint: '選擇要使用的媒體伺服器類型',
name: '伺服器名稱',
nameHint: '為媒體伺服器設定一個名稱',
embyConfig: 'Emby 設定',
jellyfinConfig: 'Jellyfin 設定',
plexConfig: 'Plex 設定',
host: '伺服器位址',
apiKey: 'API 金鑰',
token: '存取權杖',
},
notification: {
title: '通知',
description: '設定通知管道',
info: '通知設定說明',
infoDesc: '設定通知管道用於接收系統訊息(可選)',
type: '通知類型',
typeHint: '選擇要使用的通知管道類型',
name: '通知名稱',
nameHint: '為通知管道設定一個名稱',
telegramConfig: 'Telegram 設定',
emailConfig: '郵件設定',
botToken: '機器人權杖',
chatId: '聊天ID',
smtpServer: 'SMTP 伺服器',
smtpPort: 'SMTP 連接埠',
senderEmail: '發送信箱',
senderPassword: '發送密碼',
receiverEmail: '接收信箱',
},
preferences: {
title: '資源偏好',
description: '設定資源下載偏好',
info: '資源偏好說明',
infoDesc: '設定資源下載的偏好,系統將根據這些偏好自動選擇最佳資源',
quality: '品質偏好',
qualityHint: '選擇偏好的影片品質',
subtitle: '字幕偏好',
subtitleHint: '選擇偏好的字幕類型',
resolution: '解析度偏好',
resolutionHint: '選擇偏好的影片解析度',
presetRules: '預設規則',
detailedConfig: '詳細設定',
quickPresets: '快速預設',
quickPresetsDesc: '選擇預設配置,系統將自動應用對應的規則',
personalizationOptions: '個性化選項',
personalizationOptionsDesc: '根據您的需求調整規則',
excludeDolbyVision: '排除杜比視界',
excludeDolbyVisionHint: '選中後規則中將排除杜比視界資源',
excludeBluray: '排除藍光原盤',
excludeBlurayHint: '選中後規則中將排除藍光原盤資源',
presets: {
'4k-enthusiast': {
name: '4K發燒友',
description: '追求最高畫質優先4K',
},
'balanced': {
name: '平衡模式',
description: '畫質與儲存空間的平衡選擇',
},
'space-saver': {
name: '節省空間',
description: '優先較小檔案,節省儲存空間',
},
'free-priority': {
name: '免費優先',
description: '優先免費資源,其它的沒有要求',
},
},
},
},
}

View File

@@ -23,7 +23,7 @@ const appGroups = ref<Record<string, NavMenu[]>>({})
// 根据header属性对应用进行分类
function categorizeApps() {
// 获取所有菜单并根据权限过滤
const allMenus = getNavMenus()
const allMenus = getNavMenus(t)
const filteredMenus = filterMenusByPermission(allMenus, userPermissions.value)
const menus = filteredMenus.filter((item: NavMenu) => !item.footer)

View File

@@ -58,7 +58,7 @@ function initializeColors() {
// 初始化发现标签
function initDiscoverTabs() {
const tabs = getDiscoverTabs()
const tabs = getDiscoverTabs(t)
for (const tab of tabs) {
discoverTabs.value.push({
name: tab.name,

View File

@@ -1,5 +1,4 @@
<script setup lang="ts">
import { debounce } from 'lodash-es'
import { VForm } from 'vuetify/components/VForm'
import { useAuthStore, useUserStore } from '@/stores'
import { authState, userState } from '@/stores/types'
@@ -7,7 +6,7 @@ import { requiredValidator } from '@/@validators'
import api from '@/api'
import router from '@/router'
import logo from '@images/logo.png'
import { urlBase64ToUint8Array } from '@/@core/utils/navigator'
import { bufferToBase64Url, base64UrlToUint8Array, urlBase64ToUint8Array } from '@/@core/utils/navigator'
import { SUPPORTED_LOCALES, SupportedLocale } from '@/types/i18n'
import { getCurrentLocale, setI18nLanguage } from '@/plugins/i18n'
import { useTheme } from 'vuetify'
@@ -22,7 +21,7 @@ const authStore = useAuthStore()
const userStore = useUserStore()
// 获取有权限的菜单
const navMenus = getNavMenus()
const navMenus = computed(() => getNavMenus(t))
// 表单
const form = ref({
@@ -43,6 +42,12 @@ const errorMessage = ref('')
// 是否开启双重验证
const isOTP = ref(false)
// 双重验证对话框
const mfaDialog = ref(false)
// MFA PassKey loading
const mfaPasskeyLoading = ref(false)
// 用户名称输入框
const usernameInput = ref()
@@ -66,6 +71,79 @@ const locales = Object.values(SUPPORTED_LOCALES)
// 登录按钮 loading
const loading = ref(false)
// PassKey 登录按钮 loading
const passkeyLoading = ref(false)
// 使用PassKey登录
async function loginWithPassKey() {
errorMessage.value = ''
passkeyLoading.value = true
try {
// 1. 开始认证流程
const startResponse: any = await api.post('/mfa/passkey/authenticate/start', {})
if (!startResponse.success) {
errorMessage.value = startResponse.message || t('login.passkeyLoginStartFailed')
return
}
const { options, challenge } = startResponse.data
const publicKeyOptions = JSON.parse(options)
// 2. 调用WebAuthn API
const credential = await navigator.credentials.get({
publicKey: {
...publicKeyOptions,
challenge: base64UrlToUint8Array(publicKeyOptions.challenge),
allowCredentials: publicKeyOptions.allowCredentials?.map((cred: any) => ({
...cred,
id: base64UrlToUint8Array(cred.id),
})),
},
})
if (!credential) {
errorMessage.value = t('login.passkeyNotSelected')
return
}
// 3. 转换credential为可传输格式
const credentialJSON = {
id: credential.id,
rawId: bufferToBase64Url((credential as any).rawId),
type: credential.type,
response: {
authenticatorData: bufferToBase64Url((credential as any).response.authenticatorData),
clientDataJSON: bufferToBase64Url((credential as any).response.clientDataJSON),
signature: bufferToBase64Url((credential as any).response.signature),
userHandle: (credential as any).response.userHandle
? bufferToBase64Url((credential as any).response.userHandle)
: null,
},
}
// 4. 完成认证
const finishResponse: any = await api.post('/mfa/passkey/authenticate/finish', {
credential: credentialJSON,
challenge: challenge,
})
await handleLoginSuccess(finishResponse)
} catch (error: any) {
console.error('PassKey login failed:', error)
if (error.response) {
errorMessage.value = error.response.data?.detail || t('login.passkeyLoginFailed')
} else if (error.name === 'NotAllowedError') {
errorMessage.value = t('login.passkeyAuthCanceled')
} else {
errorMessage.value = t('login.passkeyLoginRetry')
}
} finally {
passkeyLoading.value = false
}
}
// 切换语言
async function switchLanguage(locale: SupportedLocale) {
await setI18nLanguage(locale)
@@ -74,21 +152,21 @@ async function switchLanguage(locale: SupportedLocale) {
}
// 查询是否开启双重验证
const fetchOTP = debounce(async () => {
const userid = usernameInput.value?.value
if (!userid) {
async function fetchOTP(): Promise<boolean> {
if (!form.value.username) {
isOTP.value = false
return
return false
}
api
.get(`/user/otp/${userid}`)
.then((response: any) => {
isOTP.value = response.success
})
.catch((error: any) => {
console.log(error)
})
}, 500)
try {
const response: any = await api.get(`/mfa/status/${form.value.username}`)
isOTP.value = response.success
return response.success
} catch (error: any) {
console.log(error)
isOTP.value = false
return false
}
}
// 订阅推送通知
async function subscribeForPushNotifications() {
@@ -117,93 +195,196 @@ async function subscribeForPushNotifications() {
// 登录后处理
async function afterLogin(superuser: boolean, userPayload: userState, filteredMenus: any[]) {
// 如果有原始路径,优先跳转到原始路径
if (authStore.originalPath && authStore.originalPath !== '/') {
router.push(authStore.originalPath)
// 如果需要显示设置向导,跳转到设置向导页面
if (userPayload.wizard) {
router.push('/setup-wizard')
} else {
// 跳转到第一个有权限的菜单
router.push(filteredMenus[0].to)
// 如果有原始路径,优先跳转到原始路径
if (authStore.originalPath && authStore.originalPath !== '/') {
router.push(authStore.originalPath)
} else {
// 跳转到第一个有权限的菜单
router.push(filteredMenus[0].to)
}
}
// 订阅推送通知
if (superuser) await subscribeForPushNotifications()
// 登录按钮 loading
loading.value = false
}
// 处理登录成功
async function handleLoginSuccess(response: any) {
const userPayload: userState = {
superUser: response.super_user,
userID: response.user_id,
userName: response.user_name,
avatar: response.avatar,
level: response.level,
permissions: response.permissions,
wizard: response.wizard,
}
const userPermissions = {
is_superuser: userPayload.superUser,
...userPayload.permissions,
}
const filteredMenus = filterMenusByPermission(navMenus.value, userPermissions)
if (filteredMenus.length === 0) {
errorMessage.value = t('login.noPermission')
return
}
const authPayLoad: authState = {
token: response.access_token,
remember: form.value.remember,
}
authStore.login(authPayLoad)
userStore.loginUser(userPayload)
await afterLogin(userPayload.superUser, userPayload, filteredMenus)
}
// 登录获取token事件
function login() {
async function login() {
errorMessage.value = ''
// 进行表单校验
if (!form.value.username || !form.value.password || (isOTP.value && !form.value.otp_password)) {
if (!form.value.username || !form.value.password) {
return
}
// 登录按钮 loading
loading.value = true
// 用户名密码
const formData = new FormData()
try {
// 用户名密码
const formData = new FormData()
formData.append('username', form.value.username)
formData.append('password', form.value.password)
formData.append('otp_password', form.value.otp_password)
formData.append('username', form.value.username)
formData.append('password', form.value.password)
formData.append('otp_password', form.value.otp_password)
// 请求token
api
.post('/login/access-token', formData, {
// 请求token
const response: any = await api.post('/login/access-token', formData, {
headers: {
Accept: 'application/json', // 设置 Accept 类型
},
})
.then((response: any) => {
const userPayload: userState = {
superUser: response.super_user,
userID: response.user_id,
userName: response.user_name,
avatar: response.avatar,
level: response.level,
permissions: response.permissions,
}
// 在保存用户信息之前检查权限
const userPermissions = {
is_superuser: userPayload.superUser,
...userPayload.permissions,
}
const filteredMenus = filterMenusByPermission(navMenus, userPermissions)
// 如果用户没有任何可用菜单,拒绝登录
if (filteredMenus.length === 0) {
// 显示错误信息
errorMessage.value = t('login.noPermission')
loading.value = false
await handleLoginSuccess(response)
} catch (error: any) {
// 登录失败,显示错误提示
if (!error.response) {
errorMessage.value = t('login.networkError')
} else if (error.response.status === 401) {
// 401错误可能是需要MFA或者认证失败
// 检查响应头是否有MFA要求标识
const mfaRequired = error.response.headers?.['x-mfa-required'] === 'true'
if (mfaRequired && !form.value.otp_password) {
// 需要MFA验证弹出对话框
isOTP.value = true
mfaDialog.value = true
return
}
// 不需要MFA或已填写OTP但认证失败
errorMessage.value = t('login.authFailure')
// 认证失败后清空OTP密码防止下次点击不弹出对话框
form.value.otp_password = ''
} else if (error.response.status === 403) {
errorMessage.value = t('login.permissionDenied')
} else if (error.response.status === 500) {
errorMessage.value = t('login.serverError')
} else {
errorMessage.value = `${t('login.loginFailed')} ${error.response.status}${t('login.checkCredentials')}`
}
} finally {
loading.value = false
}
}
// 权限检查通过,保存用户信息
const authPayLoad: authState = {
token: response.access_token,
remember: form.value.remember,
}
// 使用OTP码继续登录
function loginWithOTP() {
mfaDialog.value = false
login()
}
authStore.login(authPayLoad)
userStore.loginUser(userPayload)
// 使用PassKey进行MFA验证
async function verifyWithPassKey() {
if (!form.value.username) return
// 登录后处理
afterLogin(userPayload.superUser, userPayload, filteredMenus)
mfaPasskeyLoading.value = true
errorMessage.value = ''
try {
// 1. 开始认证流程(指定用户名)
const startResponse: any = await api.post('/mfa/passkey/authenticate/start', {
username: form.value.username,
})
.catch((error: any) => {
// 登录失败,显示错误提示
if (!error.response) errorMessage.value = t('login.networkError')
else if (error.response.status === 401) errorMessage.value = t('login.authFailure')
else if (error.response.status === 403) errorMessage.value = t('login.permissionDenied')
else if (error.response.status === 500) errorMessage.value = t('login.serverError')
else errorMessage.value = `${t('login.loginFailed')} ${error.response.status}${t('login.checkCredentials')}`
// 登录按钮 loading
loading.value = false
if (!startResponse.success) {
errorMessage.value = startResponse.message || t('login.passkeyLoginStartFailed')
return
}
const { options, challenge } = startResponse.data
const publicKeyOptions = JSON.parse(options)
// 2. 调用WebAuthn API
const credential = await navigator.credentials.get({
publicKey: {
...publicKeyOptions,
challenge: base64UrlToUint8Array(publicKeyOptions.challenge),
allowCredentials: publicKeyOptions.allowCredentials?.map((cred: any) => ({
...cred,
id: base64UrlToUint8Array(cred.id),
})),
},
})
if (!credential) {
errorMessage.value = t('login.passkeyNotSelected')
return
}
// 3. 转换credential
const credentialJSON = {
id: credential.id,
rawId: bufferToBase64Url((credential as any).rawId),
type: credential.type,
response: {
authenticatorData: bufferToBase64Url((credential as any).response.authenticatorData),
clientDataJSON: bufferToBase64Url((credential as any).response.clientDataJSON),
signature: bufferToBase64Url((credential as any).response.signature),
userHandle: (credential as any).response.userHandle
? bufferToBase64Url((credential as any).response.userHandle)
: null,
},
}
// 4. 完成认证(直接登录,不需要密码)
const finishResponse: any = await api.post('/mfa/passkey/authenticate/finish', {
credential: credentialJSON,
challenge: challenge,
})
// 关闭MFA对话框
mfaDialog.value = false
await handleLoginSuccess(finishResponse)
} catch (error: any) {
console.error('PassKey MFA verification failed:', error)
if (error.response) {
errorMessage.value = error.response.data?.detail || t('login.passkeyVerifyFailed')
} else if (error.name === 'NotAllowedError') {
errorMessage.value = t('login.passkeyAuthCanceled')
} else {
errorMessage.value = t('login.passkeyVerifyFailedRetry')
}
} finally {
mfaPasskeyLoading.value = false
}
}
// 自动登录
@@ -268,7 +449,7 @@ onMounted(async () => {
</template>
</VCardItem>
<VCardText>
<VForm ref="refForm" autocomplete="on" @submit.prevent="() => {}">
<VForm ref="refForm" autocomplete="on" @submit.prevent="login">
<VRow>
<!-- username -->
<VCol cols="12">
@@ -280,7 +461,7 @@ onMounted(async () => {
name="username"
autocomplete="username"
:rules="[requiredValidator]"
@input="fetchOTP"
hide-details
/>
</VCol>
<!-- password -->
@@ -293,11 +474,11 @@ onMounted(async () => {
autocomplete="current-password"
:append-inner-icon="isPasswordVisible ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
:rules="[requiredValidator]"
hide-details
@click:append-inner="isPasswordVisible = !isPasswordVisible"
/>
</VCol>
<VCol cols="12">
<VTextField v-if="isOTP" v-model="form.otp_password" :label="t('login.otpCode')" type="input" />
<!-- remember me checkbox -->
<div class="d-flex align-center justify-space-between flex-wrap">
<VCheckbox v-model="form.remember" :label="t('login.stayLoggedIn')" required />
@@ -305,9 +486,21 @@ onMounted(async () => {
</VCol>
<VCol cols="12">
<!-- login button -->
<VBtn block type="submit" @click="login" prepend-icon="mdi-login" :loading="loading">
<VBtn block type="submit" prepend-icon="mdi-login" :loading="loading">
{{ t('login.login') }}
</VBtn>
<!-- passkey login button -->
<VBtn
block
variant="tonal"
color="success"
class="mt-3"
prepend-icon="mdi-key-variant"
:loading="passkeyLoading"
@click="loginWithPassKey"
>
{{ t('login.loginWithPasskey') }}
</VBtn>
<VAlert v-if="errorMessage" type="error" variant="tonal" class="mt-3">
{{ errorMessage }}
</VAlert>
@@ -317,6 +510,56 @@ onMounted(async () => {
</VCardText>
</VCard>
</div>
<!-- MFA双重验证对话框 -->
<VDialog v-model="mfaDialog" max-width="400" persistent>
<VCard>
<VCardTitle class="text-h5 text-center mt-4">{{ t('login.twoFactorAuth') }}</VCardTitle>
<VCardText>
<p class="text-center mb-4">{{ t('login.mfa.selectVerificationMethod') }}</p>
<!-- TOTP验证 -->
<VCard variant="tonal" class="mb-3">
<VCardText>
<VForm @submit.prevent="loginWithOTP">
<VTextField
v-model="form.otp_password"
:label="t('login.otpCode')"
:placeholder="t('login.otpPlaceholder')"
type="text"
inputmode="numeric"
autocomplete="one-time-code"
prepend-inner-icon="mdi-shield-key"
class="mb-2"
/>
<VBtn block type="submit" color="primary" :disabled="!form.otp_password">
{{ t('login.loginWithOtp') }}
</VBtn>
</VForm>
</VCardText>
</VCard>
<!-- PassKey验证 -->
<VCard variant="tonal">
<VCardText>
<p class="text-body-2 mb-2">{{ t('login.orUsePasskey') }}</p>
<VBtn
block
variant="tonal"
color="success"
prepend-icon="mdi-key-variant"
:loading="mfaPasskeyLoading"
@click="verifyWithPassKey"
>
{{ t('login.verifyWithPasskey') }}
</VBtn>
</VCardText>
</VCard>
<VBtn block variant="text" class="mt-4" @click="mfaDialog = false">{{ t('common.cancel') }}</VBtn>
</VCardText>
</VCard>
</VDialog>
</div>
</template>

View File

@@ -231,12 +231,23 @@ registerHeaderTab({
],
})
// 页面是否准备就绪
const isReady = ref(false)
// 定时器
let timer: ReturnType<typeof setTimeout>
onBeforeMount(async () => {
await loadConfig()
initializeColors()
})
onMounted(async () => {
// 延迟渲染内容,避免阻塞页面切换动画
timer = setTimeout(() => {
isReady.value = true
}, 400)
await loadExtraRecommendSources()
// 为新增的数据源也生成颜色
extraRecommendSources.value.forEach(source => {
@@ -246,6 +257,10 @@ onMounted(async () => {
})
})
onUnmounted(() => {
if (timer) clearTimeout(timer)
})
onActivated(async () => {
await loadExtraRecommendSources()
})
@@ -256,10 +271,16 @@ onActivated(async () => {
<!-- 滚动内容区域 -->
<div class="recommend-content">
<TransitionGroup name="fade">
<MediaCardSlideView v-for="item in filteredViews" :key="item.title" v-bind="item" class="content-group" />
<MediaCardSlideView
v-for="item in filteredViews"
:key="item.title"
v-bind="item"
:ready="isReady"
class="content-group"
/>
</TransitionGroup>
<div v-if="filteredViews.length === 0" class="empty-category">
<div v-if="isReady && filteredViews.length === 0" class="empty-category">
<VIcon icon="mdi-alert-circle-outline" size="large" class="empty-icon" />
<p class="empty-text">{{ t('recommend.noCategoryContent') }}</p>
<VBtn color="primary" variant="tonal" size="small" @click="dialog = true">

View File

@@ -49,7 +49,7 @@ const dataList = ref<Array<Context>>([])
const isRefreshed = ref(false)
// 加载进度文本
const progressText = ref('')
const progressText = ref(t('common.pleaseWait'))
// 加载进度
const progressValue = ref(0)

View File

@@ -3,22 +3,20 @@ import { useRoute } from 'vue-router'
import router from '@/router'
import AccountSettingNotification from '@/views/setting/AccountSettingNotification.vue'
import AccountSettingSite from '@/views/setting/AccountSettingSite.vue'
import AccountSettingWords from '@/views/setting/AccountSettingWords.vue'
import AccountSettingAbout from '@/views/setting/AccountSettingAbout.vue'
import AccountSettingSearch from '@/views/setting/AccountSettingSearch.vue'
import AccountSettingSubscribe from '@/views/setting/AccountSettingSubscribe.vue'
import AccountSettingSystem from '@/views/setting/AccountSettingSystem.vue'
import AccountSettingService from '@/views/setting/AccountSettingService.vue'
import AccountSettingDirectory from '@/views/setting/AccountSettingDirectory.vue'
import AccountSettingRule from '@/views/setting/AccountSettingRule.vue'
import AccountSettingCache from '@/views/setting/AccountSettingCache.vue'
import { getSettingTabs } from '@/router/i18n-menu'
import { useDynamicHeaderTab } from '@/composables/useDynamicHeaderTab'
const { t } = useI18n()
const route = useRoute()
const activeTab = ref((route.query.tab as string) || '')
const settingTabs = computed(() => getSettingTabs())
const settingTabs = computed(() => getSettingTabs(t))
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()
@@ -104,15 +102,6 @@ onMounted(() => {
</transition>
</VWindowItem>
<!-- 缓存 -->
<VWindowItem value="cache">
<transition name="fade-slide" appear>
<div>
<AccountSettingCache />
</div>
</transition>
</VWindowItem>
<!-- 通知 -->
<VWindowItem value="notification">
<transition name="fade-slide" appear>
@@ -121,24 +110,6 @@ onMounted(() => {
</div>
</transition>
</VWindowItem>
<!-- 词表 -->
<VWindowItem value="words">
<transition name="fade-slide" appear>
<div>
<AccountSettingWords />
</div>
</transition>
</VWindowItem>
<!-- 关于 -->
<VWindowItem value="about">
<transition name="fade-slide" appear>
<div>
<AccountSettingAbout />
</div>
</transition>
</VWindowItem>
</VWindow>
</div>
</template>

190
src/pages/setup.vue Normal file
View File

@@ -0,0 +1,190 @@
<script lang="ts" setup>
import { onMounted } from 'vue'
import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import { useSetupWizard } from '@/composables/useSetupWizard'
import BasicSettingsStep from '@/views/setup/BasicSettingsStep.vue'
import StorageSettingsStep from '@/views/setup/StorageSettingsStep.vue'
import DownloaderSettingsStep from '@/views/setup/DownloaderSettingsStep.vue'
import MediaServerSettingsStep from '@/views/setup/MediaServerSettingsStep.vue'
import NotificationSettingsStep from '@/views/setup/NotificationSettingsStep.vue'
import PreferencesSettingsStep from '@/views/setup/PreferencesSettingsStep.vue'
import ConnectivityTest from '@/views/setup/ConnectivityTest.vue'
import { useDisplay } from 'vuetify'
const { t } = useI18n()
const router = useRouter()
// 显示器宽度
const display = useDisplay()
const {
currentStep,
totalSteps,
stepTitles,
connectivityTest,
nextStep,
prevStep,
completeWizard,
initialize,
isLoading,
} = useSetupWizard()
// 初始化
onMounted(async () => {
await initialize()
})
</script>
<template>
<div class="setup-wizard-fullscreen">
<!-- 全屏头部 -->
<div class="setup-wizard-header">
<div class="d-flex align-center justify-space-between">
<!-- 左侧占位 -->
<div v-if="display.mdAndUp.value" style="inline-size: 96px"></div>
<!-- 中间标题 -->
<div class="d-flex align-center text-center">
<div>
<h1 class="text-h3 font-weight-bold text-moviepilot mb-3">{{ t('setupWizard.title') }}</h1>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.subtitle') }}</p>
</div>
</div>
<!-- 右侧按钮组 -->
<div v-if="display.mdAndUp.value" class="d-flex gap-2 px-3">
<VBtn
variant="text"
icon="mdi-cog"
@click="router.push('/setting')"
size="small"
class="text-medium-emphasis"
/>
<VBtn variant="text" icon="mdi-close" @click="router.push('/')" size="small" />
</div>
</div>
</div>
<!-- 向导内容 -->
<VCard max-width="800px" class="mx-auto my-5">
<VCardText class="px-1">
<!-- 加载状态 -->
<div v-if="isLoading" class="d-flex flex-column align-center justify-center py-16">
<VProgressCircular indeterminate color="primary" size="64" class="mb-4" />
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.loading') }}</p>
</div>
<!-- 使用 VStepper 组件 -->
<VStepper v-else v-model="currentStep" class="elevation-0" flat alt-labels :mobile="display.smAndDown.value">
<!-- 步骤标题 -->
<VStepperHeader class="elevation-0">
<template v-for="(step, index) in stepTitles" :key="index">
<VStepperItem
:value="index + 1"
:complete="currentStep > index + 1"
:color="currentStep >= index + 1 ? 'primary' : 'default'"
complete-icon="mdi-check-circle"
>
<template #title>
<span class="text-caption">{{ step }}</span>
</template>
</VStepperItem>
<VDivider v-if="index < stepTitles.length - 1" />
</template>
</VStepperHeader>
<!-- 步骤内容 -->
<VStepperWindow>
<!-- 步骤1基础参数 -->
<VStepperWindowItem :value="1">
<BasicSettingsStep />
</VStepperWindowItem>
<!-- 步骤2存储目录 -->
<VStepperWindowItem :value="2">
<StorageSettingsStep />
</VStepperWindowItem>
<!-- 步骤3下载器 -->
<VStepperWindowItem :value="3">
<DownloaderSettingsStep />
</VStepperWindowItem>
<!-- 步骤4媒体服务器 -->
<VStepperWindowItem :value="4">
<MediaServerSettingsStep />
</VStepperWindowItem>
<!-- 步骤5通知 -->
<VStepperWindowItem :value="5">
<NotificationSettingsStep />
</VStepperWindowItem>
<!-- 步骤6资源偏好 -->
<VStepperWindowItem :value="6">
<PreferencesSettingsStep />
</VStepperWindowItem>
</VStepperWindow>
<!-- 连通性测试进度条 -->
<ConnectivityTest />
<!-- 操作按钮 -->
<VCardActions class="justify-space-between">
<div class="d-flex gap-2">
<VBtn
v-if="currentStep !== 1"
prepend-icon="mdi-chevron-left"
@click="prevStep"
:disabled="connectivityTest.isTesting"
>
{{ t('common.previous') }}
</VBtn>
</div>
<div class="d-flex gap-2">
<VBtn
v-if="currentStep < totalSteps"
color="primary"
append-icon="mdi-chevron-right"
@click="nextStep"
:disabled="connectivityTest.isTesting"
>
{{ connectivityTest.isTesting ? t('setupWizard.testing') : t('common.next') }}
</VBtn>
<VBtn
v-else
color="success"
prepend-icon="mdi-check"
@click="completeWizard"
:disabled="connectivityTest.isTesting"
>
{{ t('setupWizard.complete') }}
</VBtn>
</div>
</VCardActions>
</VStepper>
</VCardText>
</VCard>
</div>
</template>
<style scoped>
.setup-wizard-fullscreen {
position: fixed;
background-color: rgb(var(--v-theme-background));
inset: 0;
overflow-y: auto;
}
.setup-wizard-header {
position: sticky;
z-index: 2000;
background-color: rgb(var(--v-theme-surface));
border-block-end: 1px solid rgb(var(--v-theme-outline-variant));
box-shadow: 0 0 5px rgba(0, 0, 0, 4%);
inset-block-start: 0;
padding-block: calc(16px + env(safe-area-inset-top)) 16px;
}
</style>

View File

@@ -22,9 +22,9 @@ const shareViewKey = ref(0)
// 获取标签页
const subscribeTabs = computed(() => {
if (subType === '电影') {
return getSubscribeMovieTabs()
return getSubscribeMovieTabs(t)
} else {
return getSubscribeTvTabs()
return getSubscribeTvTabs(t)
}
})

View File

@@ -17,7 +17,7 @@ const listViewKey = ref(0)
// 获取标签页
const workflowTabs = computed(() => {
return getWorkflowTabs()
return getWorkflowTabs(t)
})
// 新增工作流对话框

View File

@@ -1,5 +1,5 @@
import { Icon } from '@iconify/vue'
import { aliases } from 'vuetify/lib/iconsets/mdi'
import { aliases } from 'vuetify/iconsets/mdi'
const alertTypeIcon = {
success: 'mdi-check-circle-outline',

View File

@@ -1,8 +1,12 @@
import { useI18n } from 'vue-i18n'
import { useGlobalSettingsStore } from '@/stores'
import type { Composer } from 'vue-i18n'
// 构建路由菜单,每次调用时使用当前的语言环境
export function getNavMenus() {
const { t } = useI18n()
export function getNavMenus(t: Composer['t']) {
const globalSettingsStore = useGlobalSettingsStore()
// 检查是否为高级模式
const isAdvancedMode = globalSettingsStore.get('ADVANCED_MODE') !== false
return [
{
@@ -127,21 +131,23 @@ export function getNavMenus() {
admin: true,
permission: 'admin',
},
{
title: t('navItems.settings'),
icon: 'mdi-cog-outline',
to: '/setting',
header: t('menu.system'),
admin: true,
permission: 'admin',
},
...(isAdvancedMode
? [
{
title: t('navItems.settings'),
icon: 'mdi-cog-outline',
to: '/setting',
header: t('menu.system'),
admin: true,
permission: 'admin',
},
]
: []),
]
}
// 获取设置标签页
export function getSettingTabs() {
const { t } = useI18n()
export function getSettingTabs(t: Composer['t']) {
return [
{
title: t('settingTabs.system.title'),
@@ -185,37 +191,17 @@ export function getSettingTabs() {
tab: 'scheduler',
description: t('settingTabs.scheduler.description'),
},
{
title: t('settingTabs.cache.title'),
icon: 'mdi-database',
tab: 'cache',
description: t('settingTabs.cache.description'),
},
{
title: t('settingTabs.notification.title'),
icon: 'mdi-bell',
tab: 'notification',
description: t('settingTabs.notification.description'),
},
{
title: t('settingTabs.words.title'),
icon: 'mdi-file-word-box',
tab: 'words',
description: t('settingTabs.words.description'),
},
{
title: t('settingTabs.about.title'),
icon: 'mdi-information',
tab: 'about',
description: t('settingTabs.about.description'),
},
]
}
// 获取电影订阅标签页
export function getSubscribeMovieTabs() {
const { t } = useI18n()
export function getSubscribeMovieTabs(t: Composer['t']) {
return [
{
title: t('subscribeTabs.movie.mysub'),
@@ -231,9 +217,7 @@ export function getSubscribeMovieTabs() {
}
// 获取电视剧订阅标签页
export function getSubscribeTvTabs() {
const { t } = useI18n()
export function getSubscribeTvTabs(t: Composer['t']) {
return [
{
title: t('subscribeTabs.tv.mysub'),
@@ -254,9 +238,7 @@ export function getSubscribeTvTabs() {
}
// 获取插件标签页
export function getPluginTabs() {
const { t } = useI18n()
export function getPluginTabs(t: Composer['t']) {
return [
{
title: t('pluginTabs.installed'),
@@ -272,9 +254,7 @@ export function getPluginTabs() {
}
// 获取发现标签页
export function getDiscoverTabs() {
const { t } = useI18n()
export function getDiscoverTabs(t: Composer['t']) {
return [
{
name: t('discoverTabs.themoviedb'),
@@ -295,9 +275,7 @@ export function getDiscoverTabs() {
}
// 获取工作流标签页
export function getWorkflowTabs() {
const { t } = useI18n()
export function getWorkflowTabs(t: Composer['t']) {
return [
{
title: t('workflowTabs.list'),

View File

@@ -208,6 +208,13 @@ const router = createRouter({
path: 'login',
component: () => import('../pages/login.vue'),
},
{
path: 'setup-wizard',
component: () => import('../pages/setup.vue'),
meta: {
requiresAuth: true,
},
},
{
path: '/:pathMatch(.*)*',
component: () => import('../pages/[...all].vue'),

View File

@@ -1,32 +1,73 @@
import { cleanupOutdatedCaches, precacheAndRoute } from 'workbox-precaching'
import { registerRoute, setCatchHandler } from 'workbox-routing'
import { CacheFirst, NetworkFirst, StaleWhileRevalidate } from 'workbox-strategies'
import { ExpirationPlugin } from 'workbox-expiration'
import { CacheableResponsePlugin } from 'workbox-cacheable-response'
import * as navigationPreload from 'workbox-navigation-preload'
// Service Worker 类型声明
declare let self: ServiceWorkerGlobalScope & {
__WB_MANIFEST: Array<{ url: string; revision?: string }>
readonly __WB_MANIFEST: Array<{ url: string; revision?: string }>
}
// 缓存版本控制
const CACHE_VERSION = 'v1.0.8'
const CACHE_NAMES = {
appShell: `app-shell-${CACHE_VERSION}`,
static: `static-resources-${CACHE_VERSION}`,
images: `image-cache-${CACHE_VERSION}`,
fonts: `font-cache-${CACHE_VERSION}`,
api: `api-cache-${CACHE_VERSION}`,
tmdb: `tmdb-image-cache-${CACHE_VERSION}`,
pages: `pages-cache-${CACHE_VERSION}`,
}
const RESOURCE_VERSION = 'V2'
const CACHE_VERSION = `${__APP_VERSION__}-${__BUILD_TIME__}` // 开发环境下无法使用此环境变量,生产环境正常
// 缓存大小限制
const CACHE_SIZE_LIMITS = {
appShell: { maxEntries: 10, maxAgeSeconds: 7 * 24 * 60 * 60 }, // 7天
static: { maxEntries: 100, maxAgeSeconds: 30 * 24 * 60 * 60 }, // 30天
images: { maxEntries: 200, maxAgeSeconds: 30 * 24 * 60 * 60 }, // 30天
fonts: { maxEntries: 50, maxAgeSeconds: 365 * 24 * 60 * 60 }, // 1年
api: { maxEntries: 500, maxAgeSeconds: 24 * 60 * 60 }, // 24小时
tmdb: { maxEntries: 300, maxAgeSeconds: 7 * 24 * 60 * 60 }, // 7天
pages: { maxEntries: 50, maxAgeSeconds: 7 * 24 * 60 * 60 }, // 7天
}
// 启用导航预载
navigationPreload.enable()
// 自动清理旧的预缓存
cleanupOutdatedCaches()
// 预缓存并路由
precacheAndRoute(self.__WB_MANIFEST)
// 变量记录是否为更新安装(兼容旧版前端监听逻辑)
let isUpdate = false
// 监听安装事件
self.addEventListener('install', () => {
// 强制等待中的 Service Worker 立即激活
self.skipWaiting()
// 检查是否是更新(兼容旧版前端监听逻辑)
if (self.registration.active) {
isUpdate = true
// 通知客户端发现新版本
self.clients.matchAll({ includeUncontrolled: true, type: 'window' }).then(clients => {
clients.forEach(client => {
client.postMessage({
type: 'SW_VERSION_DETECTED',
version: CACHE_VERSION,
})
})
})
}
})
// 监听激活事件
self.addEventListener('activate', event => {
// 让 Service Worker 立即接管页面
event.waitUntil(
(async () => {
await self.clients.claim()
// 清理旧版本的运行时缓存
await cleanupRuntimeCaches(true)
// 如果是更新,则通知客户端刷新页面(兼容旧版前端监听逻辑)
if (isUpdate) {
const clients = await self.clients.matchAll({ type: 'window' })
clients.forEach(client => {
client.postMessage({
type: 'SW_RELOAD_PAGE',
})
})
}
})(),
)
})
// 通知选项
const options = {
@@ -38,100 +79,226 @@ const options = {
// 存储未读消息数量的键名
const UNREAD_COUNT_KEY = 'mp_unread_count'
// 从IndexedDB获取未读消息数量
async function getStoredUnreadCount(): Promise<number> {
try {
const count = await get(UNREAD_COUNT_KEY)
return count || 0
} catch (error) {
console.error('Failed to get stored unread count:', error)
return 0
// --- 缓存策略配置 ---
// 导航请求与 App Shell - 优先网络
registerRoute(
({ request, url }) => request.mode === 'navigate' || url.pathname === '/' || url.pathname === '/index.html',
new NetworkFirst({
cacheName: `app-shell-${CACHE_VERSION}`,
plugins: [
new ExpirationPlugin({
maxEntries: 10,
maxAgeSeconds: 7 * 24 * 60 * 60, // 7天
}),
],
}),
)
// 静态资源 (JS, CSS, HTML) - 优先缓存
registerRoute(
({ request }) => ['style', 'script', 'worker'].includes(request.destination),
new StaleWhileRevalidate({
cacheName: `static-resources-${CACHE_VERSION}`,
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200],
}),
],
}),
)
// 图片资源 - 优先缓存
registerRoute(
({ request }) => request.destination === 'image',
new CacheFirst({
cacheName: `image-cache-${RESOURCE_VERSION}`,
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200],
}),
new ExpirationPlugin({
maxEntries: 200,
maxAgeSeconds: 30 * 24 * 60 * 60, // 30天
}),
],
}),
)
// 字体资源 - 优先缓存
registerRoute(
({ request }) => request.destination === 'font',
new CacheFirst({
cacheName: `font-cache-${RESOURCE_VERSION}`,
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200],
}),
new ExpirationPlugin({
maxEntries: 50,
maxAgeSeconds: 365 * 24 * 60 * 60, // 1年
}),
],
}),
)
// TMDB 图片 - 优先缓存
registerRoute(
({ url }) => url.hostname === 'image.tmdb.org',
new CacheFirst({
cacheName: `tmdb-image-cache-${RESOURCE_VERSION}`,
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200],
}),
new ExpirationPlugin({
maxEntries: 300,
maxAgeSeconds: 7 * 24 * 60 * 60, // 7天
}),
],
}),
)
// API GET 请求 - 优先网络
registerRoute(
({ url, request }) =>
url.pathname.includes('/api/v1/') &&
request.method === 'GET' &&
!url.pathname.includes('/api/v1/system/message') && // 排除 SSE 长连接
!url.pathname.includes('/api/v1/common/message') && // 排除通用消息
!url.pathname.includes('/api/v1/message/') && // 排除所有消息类接口
!url.pathname.includes('/api/v1/system/global'), // 排除global接口
new NetworkFirst({
cacheName: `api-cache-${CACHE_VERSION}`,
networkTimeoutSeconds: 5,
plugins: [
new CacheableResponsePlugin({
statuses: [0, 200],
}),
new ExpirationPlugin({
maxEntries: 500,
maxAgeSeconds: 24 * 60 * 60, // 24小时
}),
],
}),
)
// 设置默认离线页面
setCatchHandler(async ({ request }) => {
if (request?.destination === 'document') {
return (await caches.match('/offline.html')) || Response.error()
}
return Response.error()
})
// --- 辅助函数 (通知与徽章) ---
// 清理运行时缓存
async function cleanupRuntimeCaches(onlyOld: boolean = false) {
const cacheNames = await caches.keys()
const runtimeCachePrefixes = [
'app-shell',
'static-resources',
'image-cache',
'font-cache',
'api-cache',
'tmdb-image-cache',
]
// 当前版本的缓存全名
const currentCacheNames = [
`app-shell-${CACHE_VERSION}`,
`static-resources-${CACHE_VERSION}`,
`image-cache-${RESOURCE_VERSION}`,
`font-cache-${RESOURCE_VERSION}`,
`tmdb-image-cache-${RESOURCE_VERSION}`,
`api-cache-${CACHE_VERSION}`,
]
await Promise.all(
cacheNames.map(cacheName => {
const isRuntimeCache = runtimeCachePrefixes.some(prefix => cacheName.startsWith(prefix))
if (isRuntimeCache) {
if (!onlyOld || !currentCacheNames.includes(cacheName)) {
console.log('[SW] Deleting runtime cache:', cacheName)
return caches.delete(cacheName)
}
}
return Promise.resolve()
}),
)
}
// 保存未读消息数量到IndexedDB
async function setStoredUnreadCount(count: number): Promise<void> {
try {
await set(UNREAD_COUNT_KEY, count)
} catch (error) {
console.error('Failed to set stored unread count:', error)
}
}
// 简单的IndexedDB包装器
// 简单的 IndexedDB 包装器 (用于未读计数)
async function openDB(): Promise<IDBDatabase> {
// Bump the version to add the new "sync" store while keeping existing data intact
return new Promise((resolve, reject) => {
const request = indexedDB.open('mp_badge_db', 2)
request.onerror = () => reject(request.error)
request.onsuccess = () => resolve(request.result)
request.onupgradeneeded = event => {
const db = (event.target as IDBOpenDBRequest).result
// Badge store (existing)
if (!db.objectStoreNames.contains('badge')) {
db.createObjectStore('badge')
}
// Dedicated store for offline-sync items
if (!db.objectStoreNames.contains('sync')) {
db.createObjectStore('sync')
}
}
})
}
// 获取IndexedDB中的数据
async function get(key: string, storeName: string = 'badge'): Promise<any> {
const db = await openDB()
return new Promise((resolve, reject) => {
const tx = db.transaction([storeName], 'readonly')
const store = tx.objectStore(storeName)
const request = store.get(key)
request.onerror = () => reject(request.error)
request.onsuccess = () => resolve(request.result)
})
try {
const db = await openDB()
return new Promise((resolve, reject) => {
if (!db.objectStoreNames.contains(storeName)) {
resolve(null)
return
}
const tx = db.transaction([storeName], 'readonly')
const store = tx.objectStore(storeName)
const request = store.get(key)
request.onerror = () => reject(request.error)
request.onsuccess = () => resolve(request.result)
})
} catch (e) {
return null
}
}
// 保存数据到IndexedDB
async function set(key: string, value: any, storeName: string = 'badge'): Promise<void> {
const db = await openDB()
return new Promise((resolve, reject) => {
const tx = db.transaction([storeName], 'readwrite')
const store = tx.objectStore(storeName)
store.put(value, key)
tx.oncomplete = () => resolve()
tx.onerror = () => reject(tx.error)
})
try {
const db = await openDB()
return new Promise((resolve, reject) => {
if (!db.objectStoreNames.contains(storeName)) {
console.warn(`Store ${storeName} not found`)
resolve()
return
}
const tx = db.transaction([storeName], 'readwrite')
const store = tx.objectStore(storeName)
store.put(value, key)
tx.oncomplete = () => resolve()
tx.onerror = () => reject(tx.error)
})
} catch (e) {
console.error(`[SW] Failed to set IndexedDB key "${key}" in store "${storeName}":`, e)
}
}
// 删除IndexedDB中的数据确保事务完成
async function del(key: string, storeName: string = 'badge'): Promise<void> {
const db = await openDB()
return new Promise((resolve, reject) => {
const tx = db.transaction([storeName], 'readwrite')
const store = tx.objectStore(storeName)
store.delete(key)
tx.oncomplete = () => resolve()
tx.onerror = () => reject(tx.error)
})
async function getStoredUnreadCount(): Promise<number> {
const count = await get(UNREAD_COUNT_KEY)
return typeof count === 'number' ? count : 0
}
async function setStoredUnreadCount(count: number): Promise<void> {
await set(UNREAD_COUNT_KEY, count)
}
// 更新桌面图标徽章
async function updateBadge(count: number) {
if ('setAppBadge' in navigator) {
if ('setAppBadge' in self.navigator) {
try {
if (count > 0) {
await navigator.setAppBadge!(count)
await self.navigator.setAppBadge(count)
} else {
await navigator.clearAppBadge!()
await self.navigator.clearAppBadge()
}
} catch (error) {
console.error('Failed to update app badge:', error)
@@ -139,11 +306,10 @@ async function updateBadge(count: number) {
}
}
// 清除桌面图标徽章
async function clearBadge() {
if ('clearAppBadge' in navigator) {
if ('clearAppBadge' in self.navigator) {
try {
await navigator.clearAppBadge!()
await self.navigator.clearAppBadge()
await setStoredUnreadCount(0)
} catch (error) {
console.error('Failed to clear app badge:', error)
@@ -151,352 +317,91 @@ async function clearBadge() {
}
}
// 清理旧版本缓存
async function deleteOldCaches() {
const cacheWhitelist = Object.values(CACHE_NAMES)
const cacheNames = await caches.keys()
await Promise.all(
cacheNames.map(async cacheName => {
if (!cacheWhitelist.includes(cacheName)) {
console.log('Deleting old cache:', cacheName)
return caches.delete(cacheName)
}
}),
)
}
// 获取缓存大小
async function getCacheSize(cacheName: string): Promise<number> {
if (!('estimate' in navigator.storage)) {
return 0
}
try {
const cache = await caches.open(cacheName)
const keys = await cache.keys()
let totalSize = 0
for (const request of keys) {
const response = await cache.match(request)
if (response) {
const blob = await response.blob()
totalSize += blob.size
}
}
return totalSize
} catch (error) {
console.error('Failed to get cache size:', error)
return 0
}
}
// 监控缓存大小
async function monitorCacheSize() {
const cacheSizes: Record<string, number> = {}
let totalSize = 0
let calculatedTotalSize = 0
for (const [key, cacheName] of Object.entries(CACHE_NAMES)) {
const size = await getCacheSize(cacheName)
cacheSizes[key] = size
totalSize += size
}
try {
const cacheNames = await caches.keys()
// 发送缓存统计信息给客户端
const clients = await self.clients.matchAll()
clients.forEach(client => {
client.postMessage({
type: 'CACHE_SIZE_UPDATE',
data: {
cacheSizes,
totalSize,
totalSizeMB: (totalSize / 1024 / 1024).toFixed(2),
},
})
})
// 并行处理所有缓存
await Promise.all(
cacheNames.map(async cacheName => {
const cache = await caches.open(cacheName)
const requests = await cache.keys()
let cacheSize = 0
return { cacheSizes, totalSize }
}
// 清理过期缓存条目
async function cleanupExpiredCaches() {
for (const [key, cacheName] of Object.entries(CACHE_NAMES)) {
const limit = CACHE_SIZE_LIMITS[key as keyof typeof CACHE_SIZE_LIMITS]
if (!limit) continue
try {
const cache = await caches.open(cacheName)
const keys = await cache.keys()
// 如果缓存条目超过限制,删除最老的条目
if (keys.length > limit.maxEntries) {
const deleteCount = keys.length - limit.maxEntries
console.log(`Cleaning up ${deleteCount} entries from ${cacheName}`)
// 删除最老的条目(假设数组开头是最老的)
for (let i = 0; i < deleteCount; i++) {
await cache.delete(keys[i])
// 遍历请求以获取响应头部,避免 matchAll 一次性加载大量响应对象到内存
for (const request of requests) {
const response = await cache.match(request)
if (response) {
const contentLength = response.headers.get('content-length')
if (contentLength) {
cacheSize += parseInt(contentLength, 10)
}
}
}
}
} catch (error) {
console.error(`Failed to cleanup cache ${cacheName}:`, error)
cacheSizes[cacheName] = cacheSize
}),
)
calculatedTotalSize = Object.values(cacheSizes).reduce((acc, size) => acc + size, 0)
// 获取系统级存储估算
let quota = 0
let usage = 0
if (self.navigator.storage && self.navigator.storage.estimate) {
const estimate = await self.navigator.storage.estimate()
quota = estimate.quota || 0
usage = estimate.usage || 0
}
}
}
// 安装事件
self.addEventListener('install', () => {
// 强制等待中的Service Worker立即成为活动的Service Worker
self.skipWaiting()
})
// 激活事件
self.addEventListener('activate', event => {
event.waitUntil(
(async () => {
// 启用导航预载功能以提高性能
if ('navigationPreload' in self.registration) {
await self.registration.navigationPreload.enable()
}
// 清理旧版本的缓存
await deleteOldCaches()
// 清理过期的缓存条目
await cleanupExpiredCaches()
// 监控缓存大小
await monitorCacheSize()
})(),
)
// 告诉活动的Service Worker立即控制页面
self.clients.claim()
})
// 处理API请求当离线时发送消息到客户端
self.addEventListener('fetch', event => {
const url = new URL(event.request.url)
// 处理API请求
if (event.request.url.includes('/api/v1/')) {
// GET请求尝试从缓存返回
if (event.request.method === 'GET') {
event.respondWith(
(async () => {
try {
// 尝试网络请求
const networkResponse = await fetch(event.request)
return networkResponse
} catch (error) {
// 网络错误时,通知客户端当前处于离线状态
if (self.clients) {
self.clients.matchAll().then(clients => {
clients.forEach(client => {
client.postMessage({
type: 'OFFLINE_STATUS',
offline: true,
})
})
})
}
// 尝试返回缓存的响应
const cache = await caches.open(CACHE_NAMES.api)
const cachedResponse = await cache.match(event.request)
if (cachedResponse) {
return cachedResponse
}
// 如果没有缓存,抛出错误
throw error
}
})(),
)
// 构造结果:满足 useCacheManager.ts 的需求
const result = {
cacheSizes,
// 优先使用准确的 usage (真实磁盘占用),如果不可用则退回到计算值
totalSize: usage || calculatedTotalSize,
totalSizeMB: ((usage || calculatedTotalSize) / 1024 / 1024).toFixed(2),
// 额外信息保留,供未来扩展
quota,
usage,
quotaMB: (quota / 1024 / 1024).toFixed(2),
usageMB: (usage / 1024 / 1024).toFixed(2),
calculatedTotalSize,
}
// POST/PUT/DELETE请求离线时加入同步队列
else if (['POST', 'PUT', 'DELETE', 'PATCH'].includes(event.request.method)) {
event.respondWith(
(async () => {
try {
// 尝试网络请求
const networkResponse = await fetch(event.request)
return networkResponse
} catch (error) {
// 网络错误时,加入同步队列
await addToSyncQueue(event.request)
// 通知客户端请求已加入队列
if (self.clients) {
self.clients.matchAll().then(clients => {
clients.forEach(client => {
client.postMessage({
type: 'REQUEST_QUEUED',
url: event.request.url,
method: event.request.method,
})
})
})
}
// 返回一个假的成功响应
return new Response(
JSON.stringify({
success: true,
queued: true,
message: '请求已加入离线队列,将在网络恢复后自动同步',
}),
{
status: 202,
headers: { 'Content-Type': 'application/json' },
},
)
}
})(),
)
}
return
}
})
// 后台同步队列
const syncQueue: Array<{
id: string
url: string
method: string
data?: any
timestamp: number
}> = []
// 添加请求到同步队列
async function addToSyncQueue(request: Request) {
const id = `${Date.now()}-${Math.random().toString(36).substr(2, 9)}`
const url = request.url
const method = request.method
let data: any = null
if (method !== 'GET' && method !== 'HEAD') {
try {
data = await request.clone().text()
} catch (e) {
console.error('Failed to read request body:', e)
}
}
const syncItem = {
id,
url,
method,
data,
timestamp: Date.now(),
}
// 保存到IndexedDB (使用专用的 "sync" store)
await set(id, syncItem, 'sync')
syncQueue.push(syncItem)
// 注册后台同步
if ('sync' in self.registration) {
await self.registration.sync.register('sync-data')
}
}
// 执行同步队列中的请求
async function processSyncQueue() {
const db = await openDB()
// 先用只读事务获取所有同步项
const items: Array<any> = await new Promise((resolve, reject) => {
const tx = db.transaction(['sync'], 'readonly')
const store = tx.objectStore('sync')
const req = store.getAll()
req.onsuccess = () => resolve(req.result)
req.onerror = () => reject(req.error)
})
// 收集需要删除的项目ID
const itemsToDelete: string[] = []
const itemsToDeleteExpired: string[] = []
for (const syncItem of items) {
const key = syncItem.id
try {
// 构建请求
const init: RequestInit = {
method: syncItem.method,
headers: {
'Content-Type': 'application/json',
},
}
if (syncItem.data) {
init.body = syncItem.data
}
// 发送请求
const response = await fetch(syncItem.url, init)
if (response.ok) {
// 成功后标记为需要删除
itemsToDelete.push(key)
// 通知客户端同步成功
const clients = await self.clients.matchAll()
clients.forEach(client => {
client.postMessage({
type: 'SYNC_SUCCESS',
syncId: syncItem.id,
url: syncItem.url,
})
})
} else {
throw new Error(`HTTP ${response.status}`)
}
} catch (error) {
console.error('Sync failed for item:', key, error)
// 如果该同步项已存在超过 24 小时,则标记为需要删除
if (Date.now() - syncItem.timestamp > 24 * 60 * 60 * 1000) {
itemsToDeleteExpired.push(key)
}
}
}
// 批量删除所有成功处理的项目和过期项目
const allItemsToDelete = [...itemsToDelete, ...itemsToDeleteExpired]
if (allItemsToDelete.length > 0) {
await new Promise<void>((resolve, reject) => {
const tx = db.transaction(['sync'], 'readwrite')
const store = tx.objectStore('sync')
// 批量删除所有标记的项目
allItemsToDelete.forEach(id => {
store.delete(id)
// 发送缓存统计信息给客户端
const clients = await self.clients.matchAll()
clients.forEach(client => {
client.postMessage({
type: 'CACHE_SIZE_UPDATE',
data: result,
})
tx.oncomplete = () => resolve()
tx.onerror = () => reject(tx.error)
})
return result
} catch (error) {
console.error('Failed to monitor cache size:', error)
return {
cacheSizes: {},
totalSize: 0,
totalSizeMB: '0.00',
quota: 0,
usage: 0,
quotaMB: '0.00',
usageMB: '0.00',
}
}
}
// 初始化 Workbox
cleanupOutdatedCaches()
precacheAndRoute(self.__WB_MANIFEST)
// --- 事件监听 ---
// 监听 sync 事件,处理后台同步
self.addEventListener('sync', (event: SyncEvent) => {
if (event.tag === 'sync-data') {
event.waitUntil(processSyncQueue())
}
})
// 监听 push 事件,显示通知
// 监听 push 事件
self.addEventListener('push', function (event) {
if (!event.data) {
return
}
// 解析获取推送消息
let payload
try {
payload = event.data?.json()
@@ -505,7 +410,7 @@ self.addEventListener('push', function (event) {
title: event.data?.text(),
}
}
// 根据推送消息生成桌面通知并展现出来
try {
const content = {
body: payload.body || '',
@@ -515,7 +420,6 @@ self.addEventListener('push', function (event) {
actions: options.actions,
}
// 增加未读消息计数并持久化存储
event.waitUntil(
(async () => {
const currentCount = await getStoredUnreadCount()
@@ -525,11 +429,11 @@ self.addEventListener('push', function (event) {
})(),
)
} catch (e) {
// 静默处理错误
// 忽略错误
}
})
// 监听通知点击事件
// 监听通知点击
self.addEventListener('notificationclick', function (event) {
const info = event.notification
if (event.action === 'close') {
@@ -539,10 +443,9 @@ self.addEventListener('notificationclick', function (event) {
}
})
// 监听来自主应用的消息,用于清除徽章或更新徽章数量
// 监听消息
self.addEventListener('message', function (event) {
if (event.data && event.data.type === 'CLEAR_BADGE') {
// 清除徽章
clearBadge()
.then(() => {
event.ports[0]?.postMessage({ success: true })
@@ -551,7 +454,6 @@ self.addEventListener('message', function (event) {
event.ports[0]?.postMessage({ success: false, error: error instanceof Error ? error.message : String(error) })
})
} else if (event.data && event.data.type === 'UPDATE_BADGE') {
// 更新徽章数量
const count = event.data.count || 0
setStoredUnreadCount(count)
.then(() => updateBadge(count))
@@ -562,25 +464,27 @@ self.addEventListener('message', function (event) {
event.ports[0]?.postMessage({ success: false, error: error instanceof Error ? error.message : String(error) })
})
} else if (event.data && event.data.type === 'GET_UNREAD_COUNT') {
// 获取未读消息数量
getStoredUnreadCount()
.then(count => {
event.ports[0]?.postMessage({ count })
})
.catch(error => {
.catch(() => {
event.ports[0]?.postMessage({ count: 0 })
})
} else if (event.data && event.data.type === 'CLEANUP_CACHES') {
// 手动触发缓存清理
Promise.all([deleteOldCaches(), cleanupExpiredCaches(), monitorCacheSize()])
.then(([, , cacheInfo]) => {
// 手动清理: 清理所有运行时缓存
const performCleanup = async () => {
await cleanupRuntimeCaches(false)
return await monitorCacheSize()
}
performCleanup()
.then(cacheInfo => {
event.ports[0]?.postMessage({ success: true, cacheInfo })
})
.catch(error => {
event.ports[0]?.postMessage({ success: false, error: error instanceof Error ? error.message : String(error) })
})
} else if (event.data && event.data.type === 'GET_CACHE_INFO') {
// 获取缓存信息
monitorCacheSize()
.then(cacheInfo => {
event.ports[0]?.postMessage({ success: true, cacheInfo })
@@ -588,5 +492,7 @@ self.addEventListener('message', function (event) {
.catch(error => {
event.ports[0]?.postMessage({ success: false, error: error instanceof Error ? error.message : String(error) })
})
} else if (event.data && event.data.type === 'SKIP_WAITING') {
self.skipWaiting()
}
})

View File

@@ -1,6 +1,7 @@
import { defineStore } from 'pinia'
import type { globalSettingsState } from '@/stores/types'
import { fetchGlobalSettings } from '@/utils/globalSetting'
import { useVersionChecker } from '@/composables/useVersionChecker'
export const useGlobalSettingsStore = defineStore('globalSettings', {
state: (): globalSettingsState => ({
@@ -18,6 +19,12 @@ export const useGlobalSettingsStore = defineStore('globalSettings', {
const result = await fetchGlobalSettings()
this.data = result || {}
this.initialized = true
// 检查版本更新
if (result.FRONTEND_VERSION) {
const { checkVersion } = useVersionChecker()
await checkVersion(result.FRONTEND_VERSION)
}
} catch (error) {
console.error('Failed to initialize global settings', error)
} finally {

View File

@@ -20,6 +20,8 @@ export interface userState {
level: number
// 权限
permissions: { [key: string]: any }
// 是否需要显示设置向导
wizard: boolean
}
export interface globalSettingsState {

View File

@@ -10,6 +10,7 @@ export const useUserStore = defineStore('user', {
avatar: '',
level: 1,
permissions: DEFAULT_PERMISSIONS,
wizard: false,
}),
// 全局持久化
@@ -34,6 +35,9 @@ export const useUserStore = defineStore('user', {
setPermissions(permissions: object) {
this.permissions = { ...DEFAULT_PERMISSIONS, ...permissions }
},
setWizard(wizard: boolean) {
this.wizard = wizard
},
loginUser(payload: userState) {
this.setSuperUser(payload.superUser)
this.setUserID(payload.userID)
@@ -41,6 +45,7 @@ export const useUserStore = defineStore('user', {
this.setAvatar(payload.avatar)
this.setLevel(payload.level)
this.setPermissions(payload.permissions)
this.setWizard(payload.wizard)
},
reset() {
this.setSuperUser(false)
@@ -49,6 +54,7 @@ export const useUserStore = defineStore('user', {
this.setAvatar('')
this.setLevel(1)
this.setPermissions(DEFAULT_PERMISSIONS)
this.setWizard(false)
},
},
@@ -59,5 +65,6 @@ export const useUserStore = defineStore('user', {
getAvatar: state => state.avatar,
getLevel: state => state.level,
getPermissions: state => state.permissions,
getWizard: state => state.wizard,
},
})

View File

@@ -3,15 +3,15 @@
@tailwind components;
@tailwind utilities;
@supports (-webkit-touch-callout: none) {
html.v-overlay-scroll-blocked {
position: inherit;
}
html.v-overlay-scroll-blocked {
position: static;
}
body {
overscroll-behavior: none;
html.v-overlay-scroll-blocked body {
position: fixed;
overflow: hidden;
inset: 0;
inset-block-start: var(--v-body-scroll-y);
}
@mixin hide-scrollbar {
@@ -74,17 +74,17 @@ body {
// 路由过渡动画
.fade-slide-leave-active,
.fade-slide-enter-active {
transition: all 0.6s;
transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.fade-slide-enter-from {
opacity: 0;
transform: translateY(-45px);
transform: translateX(20px);
}
.fade-slide-leave-to {
opacity: 0;
transform: translateY(45px);
transform: translateX(20px);
}
// 网格布局样式

View File

@@ -1,5 +1,8 @@
// PWA Badge API 类型定义
declare global {
const __APP_VERSION__: string
const __BUILD_TIME__: string
interface Navigator {
/**
* 设置应用徽章数量

86
src/utils/imageUtils.ts Normal file
View File

@@ -0,0 +1,86 @@
/**
* 静态资源导入工具函数
* 用于在生产环境中正确引用静态资源
*/
// 导入所有 logo 图标
import qbittorrentLogo from '@/assets/images/logos/qbittorrent.png'
import transmissionLogo from '@/assets/images/logos/transmission.png'
import embyLogo from '@/assets/images/logos/emby.png'
import jellyfinLogo from '@/assets/images/logos/jellyfin.png'
import plexLogo from '@/assets/images/logos/plex.png'
import trimemediaLogo from '@/assets/images/logos/trimemedia.png'
import wechatLogo from '@/assets/images/logos/wechat.png'
import telegramLogo from '@/assets/images/logos/telegram.webp'
import slackLogo from '@/assets/images/logos/slack.webp'
import discordLogo from '@/assets/images/logos/discord.png'
import synologychatLogo from '@/assets/images/logos/synologychat.png'
import vocechatLogo from '@/assets/images/logos/vocechat.png'
import downloaderLogo from '@/assets/images/logos/downloader.png'
import mediaserverLogo from '@/assets/images/logos/mediaserver.png'
import notificationLogo from '@/assets/images/logos/notification.png'
import chromeLogo from '@/assets/images/logos/chrome.png'
import doubanLogo from '@/assets/images/logos/douban.png'
import githubLogo from '@/assets/images/logos/github.png'
import tmdbLogo from '@/assets/images/logos/tmdb.png'
import fanartLogo from '@/assets/images/logos/fanart.webp'
import pythonLogo from '@/assets/images/logos/python.png'
import pluginLogo from '@/assets/images/logos/plugin.png'
import siteLogo from '@/assets/images/logos/site.webp'
import bangumiLogo from '@/assets/images/logos/bangumi.png'
import doubanBlackLogo from '@/assets/images/logos/douban-black.png'
// 图标映射表
const logoMap: Record<string, string> = {
qbittorrent: qbittorrentLogo,
transmission: transmissionLogo,
emby: embyLogo,
jellyfin: jellyfinLogo,
plex: plexLogo,
trimemedia: trimemediaLogo,
wechat: wechatLogo,
telegram: telegramLogo,
slack: slackLogo,
discord: discordLogo,
synologychat: synologychatLogo,
vocechat: vocechatLogo,
downloader: downloaderLogo,
mediaserver: mediaserverLogo,
notification: notificationLogo,
chrome: chromeLogo,
douban: doubanLogo,
github: githubLogo,
tmdb: tmdbLogo,
fanart: fanartLogo,
python: pythonLogo,
plugin: pluginLogo,
site: siteLogo,
bangumi: bangumiLogo,
'douban-black': doubanBlackLogo,
}
/**
* 获取图标 URL
* @param logoName 图标名称
* @returns 图标的 URL
*/
export function getLogoUrl(logoName: string): string {
return logoMap[logoName] || ''
}
/**
* 获取所有可用的图标名称
* @returns 图标名称数组
*/
export function getAvailableLogos(): string[] {
return Object.keys(logoMap)
}
/**
* 检查图标是否存在
* @param logoName 图标名称
* @returns 是否存在
*/
export function hasLogo(logoName: string): boolean {
return logoName in logoMap
}

View File

@@ -119,11 +119,12 @@ export class SSEManager {
this.eventSource.onmessage = event => {
// 分发消息给所有监听器
this.listeners.forEach(listener => {
this.listeners.forEach((listener, listenerId) => {
try {
// 为每个监听器提供独立的错误处理
listener(event)
} catch (error) {
console.error('SSE: 监听器错误', error)
console.error(`SSE: 监听器错误 [${listenerId}]`, error)
}
})
}
@@ -245,12 +246,37 @@ class SSEManagerSingleton {
/**
* 获取或创建SSE管理器
* @param url SSE连接URL
* @param options SSE选项
* @returns SSE管理器实例
*/
getManager(url: string, options?: ConstructorParameters<typeof SSEManager>[1]): SSEManager {
if (!this.managers.has(url)) {
this.managers.set(url, new SSEManager(url, options))
// 使用完整的URL作为key确保不同路径的SSE连接不会复用
const managerKey = url
if (!this.managers.has(managerKey)) {
this.managers.set(managerKey, new SSEManager(url, options))
}
return this.managers.get(url)!
return this.managers.get(managerKey)!
}
/**
* 获取或创建独立的SSE管理器为每个监听器创建独立连接
* @param url SSE连接URL
* @param listenerId 监听器ID
* @param options SSE选项
* @returns SSE管理器实例
*/
getIndependentManager(
url: string,
listenerId: string,
options?: ConstructorParameters<typeof SSEManager>[1],
): SSEManager {
// 使用URL + 监听器ID作为key确保每个监听器都有独立的连接
const managerKey = `${url}::${listenerId}`
if (!this.managers.has(managerKey)) {
this.managers.set(managerKey, new SSEManager(url, options))
}
return this.managers.get(managerKey)!
}
/**

View File

@@ -4,6 +4,7 @@ import type { MediaInfo } from '@/api/types'
import MediaCard from '@/components/cards/MediaCard.vue'
import SlideView from '@/components/slide/SlideView.vue'
import { useI18n } from 'vue-i18n'
import { useIntersectionObserver, until } from '@vueuse/core'
const { t } = useI18n()
@@ -12,6 +13,10 @@ const props = defineProps({
apipath: String,
linkurl: String,
title: String,
ready: {
type: Boolean,
default: true,
},
})
// 提供给子组件的属性
@@ -19,38 +24,71 @@ provide('rankingPropsKey', reactive({ ...props }))
// 组件加载完成
const componentLoaded = ref(false)
// 是否已尝试加载
const hasTriedLoading = ref(false)
// 数据列表
const dataList = ref<MediaInfo[]>([])
// 容器引用
const containerRef = ref<HTMLElement | null>(null)
// 获取订阅列表数据
async function fetchData() {
try {
if (!props.apipath) return
dataList.value = await api.get(props.apipath)
if (dataList.value.length > 0) componentLoaded.value = true
if (dataList.value.length > 0) {
// 数据获取后,等待 ready 信号再渲染,避免阻塞动画
await until(() => props.ready).toBe(true)
}
componentLoaded.value = true
} catch (error) {
console.error(error)
componentLoaded.value = true
} finally {
hasTriedLoading.value = true
}
}
// 加载时获取数据
onMounted(() => {
fetchData()
})
// 使用 IntersectionObserver 实现懒加载
const { stop } = useIntersectionObserver(
containerRef,
([{ isIntersecting }]) => {
if (isIntersecting) {
fetchData()
stop()
}
},
{
rootMargin: '300px', // 提前加载距离
},
)
onActivated(() => {
if (dataList.value.length == 0) {
if (dataList.value.length == 0 && hasTriedLoading.value) {
fetchData()
}
})
</script>
<template>
<SlideView v-if="componentLoaded">
<template #content>
<template v-for="data in dataList" :key="data.tmdb_id || data.douban_id || data.bangumi_id">
<MediaCard :media="data" width="9rem" />
<div ref="containerRef">
<SlideView v-if="componentLoaded">
<template #content>
<template v-for="data in dataList" :key="data.tmdb_id || data.douban_id || data.bangumi_id">
<MediaCard :media="data" width="9rem" />
</template>
</template>
</template>
</SlideView>
</SlideView>
<SlideView v-else-if="!componentLoaded">
<template #content>
<div v-for="i in 10" :key="i" style="width: 9rem">
<VCard class="outline-none overflow-hidden">
<div style="padding-bottom: 150%"></div>
</VCard>
</div>
</template>
</SlideView>
</div>
</template>

View File

@@ -428,6 +428,17 @@ const getProductionCompanies = computed(() => {
return mediaDetail.value.production_companies?.map(company => company.name)
})
// 获取最早实体/数字发行日期
const getEarliestReleaseDate = computed(() => {
const filteredDates = mediaDetail.value.release_dates?.filter(date => [4, 5].includes(date.type))
if (!filteredDates || filteredDates.length === 0)
return null
return filteredDates.reduce((earliest, current) =>
new Date(current.date) < new Date(earliest.date) ? current : earliest,
)
})
// 计算存在状态的颜色
function getExistColor(season: number) {
const state = seasonsNotExisted.value[season]
@@ -840,6 +851,17 @@ onBeforeMount(() => {
</span>
</span>
</div>
<div v-if="mediaDetail.type === '电影' && getEarliestReleaseDate" class="media-fact">
<span>{{ t(getEarliestReleaseDate.type === 4 ? 'media.info.digitalRelease' : 'media.info.physicalRelease') }}</span>
<span class="media-fact-value">
<span class="flex items-center justify-end">
<span class="inline-flex items-center justify-center h-4 w-4 text-[0.6rem] font-bold text-current border border-current leading-none">
{{ getEarliestReleaseDate.iso_code }}
</span>
<span class="ml-1.5">{{ getEarliestReleaseDate.date.slice(0, 10) }}</span>
</span>
</span>
</div>
<div v-if="mediaDetail.original_language" class="media-fact">
<span>{{ t('media.info.originalLanguage') }}</span>
<span class="media-fact-value">{{ mediaDetail.original_language }}</span>

View File

@@ -5,7 +5,7 @@ import api from '@/api'
import type { Plugin } from '@/api/types'
import NoDataFound from '@/components/NoDataFound.vue'
import PluginAppCard from '@/components/cards/PluginAppCard.vue'
import noImage from '@images/logos/plugin.png'
import { getLogoUrl } from '@/utils/imageUtils'
import { useDisplay } from 'vuetify'
import { isNullOrEmptyObject } from '@/@core/utils'
import { getPluginTabs } from '@/router/i18n-menu'
@@ -32,7 +32,7 @@ const { appMode } = usePWA()
const activeTab = ref('installed')
// 获取插件标签页
const pluginTabs = computed(() => getPluginTabs())
const pluginTabs = computed(() => getPluginTabs(t))
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()
@@ -675,7 +675,7 @@ function pluginIconError(item: Plugin) {
// 插件图标地址
function pluginIcon(item: Plugin) {
// 如果图片加载错误
if (pluginIconLoaded.value[item.id || '0'] === false) return noImage
if (pluginIconLoaded.value[item.id || '0'] === false) return getLogoUrl('plugin')
// 如果是网络图片则使用代理后返回
if (item?.plugin_icon?.startsWith('http'))
return `${import.meta.env.VITE_API_BASE_URL}system/img/1?imgurl=${encodeURIComponent(item?.plugin_icon)}&cache=true`

View File

@@ -32,40 +32,13 @@ const endpoints = {
// 所有存储
const storages = ref<StorageConf[]>([])
// 查询存储
async function loadStorages() {
try {
const result: { [key: string]: any } = await api.get('system/setting/Storages')
storages.value = result.data?.value ?? []
} catch (error) {
console.log(error)
}
}
const storageTypes = computed(() => storages.value.map(s => s.type))
// 当前文件项
const operItem = ref<FileItem>({
storage: 'local',
type: 'dir',
name: '/',
path: '/',
fileid: 'root',
})
const operItem = ref<FileItem | undefined>(undefined)
// fileid的堆栈
const itemstack = ref<FileItem[]>([
{
storage: 'local',
type: 'dir',
name: '/',
path: '/',
fileid: 'root',
},
])
// 下载目录列表
const downloadDirectories = ref<TransferDirectoryConf[]>([])
const itemstack = ref<FileItem[]>([])
// 计算公共路径
function findCommonPath(paths: string[]): string {
@@ -101,29 +74,97 @@ function findCommonPath(paths: string[]): string {
return commonPath
}
const STORAGE_KEY = 'fileBrowserView.activeStorage'
interface BrowserInitialParams {
storage: string;
path: string;
name: string;
}
// determine which entry to select initially
function determineBrowserInitialParams(downloadDirectories: TransferDirectoryConf[]): BrowserInitialParams {
const isAvailable = (storage: string) => storageTypes.value.includes(storage);
const buckets = downloadDirectories.reduce<Map<string, string[]>>((dict, item) => {
// filter out directories whose storage is not available
if (!isAvailable(item.storage)) {
return dict
}
if (item.download_path == undefined) {
return dict
}
if (!dict.has(item.storage)) {
dict.set(item.storage, [item.download_path])
} else {
dict.get(item.storage)!.push(item.download_path)
}
return dict
}, new Map());
const cachedStorage = localStorage.getItem(STORAGE_KEY) || '';
// if no download directories are configured, fall back to cached storage or first available storage
if (buckets.size === 0) {
return {
storage: isAvailable(cachedStorage)
? cachedStorage
: (storageTypes.value[0] || 'local'),
path: '/',
name: '/',
}
}
let selectedEntry: [string, string[]];
if (cachedStorage && buckets.has(cachedStorage)) {
selectedEntry = [cachedStorage, buckets.get(cachedStorage)!];
} else {
// if no storage selected previously, use the most populous one
selectedEntry = Array.from(buckets.entries()).reduce((prev, curr) => {
return curr[1].length > prev[1].length ? curr : prev;
});
}
const path = findCommonPath(selectedEntry[1]);
return {
storage: selectedEntry[0],
path,
name: path.split('/').filter(Boolean).pop() ?? '',
}
}
// 查询下载目录
async function loadDownloadDirectories() {
try {
// fetch available storages
const storageResult: { [key: string]: any } = await api.get('system/setting/Storages')
storages.value = storageResult.data?.value ?? []
const result: { [key: string]: any } = await api.get('system/setting/Directories')
if (result.success && result.data?.value) {
downloadDirectories.value = result.data.value
const path = findCommonPath(downloadDirectories.value.map(item => item.download_path) as string[])
const name = path.split('/').filter(Boolean).pop() ?? ''
const { storage, path, name } = determineBrowserInitialParams(result.data.value);
// operItem初始化
operItem.value = {
storage: 'local',
type: 'dir',
storage,
name: name,
path: path,
}
// itemstack初始化
itemstack.value = [
{
storage: storage,
type: 'dir',
name: '/',
path: '/',
fileid: 'root',
}
];
// 将初始数据拆分到堆栈中
const paths = path.split('/').filter(Boolean)
paths.map((name, index) => {
const path = '/' + paths.slice(0, index + 1).join('/') + '/'
itemstack.value.push({
storage: 'local',
storage,
type: 'dir',
name: name,
path: path,
name,
path,
})
})
}
@@ -134,6 +175,11 @@ async function loadDownloadDirectories() {
// 目录变化
function pathChanged(item: FileItem) {
// save storage to localStorage
if (item.storage !== operItem.value?.storage) {
localStorage.setItem(STORAGE_KEY, item.storage)
}
operItem.value = item
if (item.path == '/') {
itemstack.value = [
@@ -156,16 +202,13 @@ function pathChanged(item: FileItem) {
}
// 加载初始目录
onBeforeMount(loadDownloadDirectories)
onMounted(() => {
loadStorages()
})
onMounted(loadDownloadDirectories)
</script>
<template>
<div class="file-browser-view">
<FileBrowser
v-if="operItem"
:storages="storages"
:tree="false"
:itemstack="itemstack"

View File

@@ -1,364 +0,0 @@
<script lang="ts" setup>
import { formatDateDifference } from '@/@core/utils/formatters'
import api from '@/api'
import { useI18n } from 'vue-i18n'
// 国际化
const { t } = useI18n()
// 系统环境变量
const systemEnv = ref<any>({})
// 所有Release
const allRelease = ref<any>([])
// 支持站点
const supportingSites = ref<any>({})
// 支持站点折叠状态
const sitesExpanded = ref(false)
// 去重后的支持站点
const uniqueSupportingSites = computed(() => {
const sitesMap = new Map()
Object.entries(supportingSites.value).forEach(([domain, site]: [string, any]) => {
if (!sitesMap.has(site.name)) {
sitesMap.set(site.name, {
name: site.name,
urls: [{ domain, url: site.url }],
})
} else {
sitesMap.get(site.name).urls.push({ domain, url: site.url })
}
})
return Array.from(sitesMap.values())
})
// 显示的支持站点折叠时只显示前5个
const displayedSites = computed(() => {
if (sitesExpanded.value) {
return uniqueSupportingSites.value
}
return uniqueSupportingSites.value.slice(0, 5)
})
// 变更日志对话框
const releaseDialog = ref(false)
// 最新版本
const latestRelease = ref('')
// 变更日志对话框标题
const releaseDialogTitle = ref('')
// 变更日志对话框内容
const releaseDialogBody = ref('')
// 打开日志对话框
function showReleaseDialog(title: string, body: string) {
releaseDialogTitle.value = title
releaseDialogBody.value = body.replaceAll('\r\n', '<br />')
releaseDialog.value = true
}
// 查询系统环境变量
async function querySystemEnv() {
try {
const result: { [key: string]: any } = await api.get('system/env')
systemEnv.value = result.data
} catch (error) {
console.log(error)
}
}
// 查询所有Release
async function queryAllRelease() {
try {
const result: { [key: string]: any } = await api.get('system/versions')
allRelease.value = result.data ?? []
// 最新版本
if (allRelease.value.length > 0) latestRelease.value = allRelease.value[0].tag_name
} catch (error) {
console.log(error)
}
}
// 查询支持站点
async function querySupportingSites() {
try {
supportingSites.value = await api.get('site/supporting')
} catch (error) {
console.log(error)
}
}
// 切换站点列表展开状态
function toggleSitesExpanded() {
sitesExpanded.value = !sitesExpanded.value
}
// 计算发布时间
function releaseTime(releaseDate: string) {
// 上一次更新时间
return formatDateDifference(releaseDate)
}
onMounted(() => {
querySystemEnv()
queryAllRelease()
querySupportingSites()
})
</script>
<template>
<div class="px-3">
<div class="section">
<div>
<h3 class="heading">{{ t('setting.about.title') }}</h3>
</div>
<div class="section border-t border-gray-800">
<dl>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.softwareVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.VERSION }}</code>
<a
v-if="latestRelease === systemEnv.VERSION"
href="https://github.com/jxxghp/MoviePilot/releases"
target="_blank"
rel="noopener noreferrer"
>
<span
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap bg-green-500 bg-opacity-80 border border-green-500 !text-green-100 ml-2 !cursor-pointer transition hover:bg-green-400"
>
{{ t('setting.about.latest') }}
</span>
</a>
</span>
</dd>
</div>
</div>
<div v-if="systemEnv.FRONTEND_VERSION">
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.frontendVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.FRONTEND_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.authVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.AUTH_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.indexerVersion') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow flex flex-row items-center truncate">
<code class="truncate">{{ systemEnv.INDEXER_VERSION }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.configDir') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined">
<code>{{ systemEnv.CONFIG_DIR }}</code>
</span>
</dd>
</div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.dataDir') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined"
><code>{{ t('setting.about.dataDirectory') }}</code></span
>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.timezone') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined">
<code>{{ systemEnv.TZ }}</code>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.supportingSites') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<div class="flex flex-col gap-2">
<div class="flex flex-wrap gap-2 mt-1 ms-1">
<VChip v-for="site in displayedSites" :key="site.name" variant="outlined" size="small">
<span class="truncate max-w-32">{{ site.name }}</span>
</VChip>
<VChip
v-if="!sitesExpanded && uniqueSupportingSites.length > 5"
variant="tonal"
size="small"
@click="toggleSitesExpanded"
>
<span> {{ uniqueSupportingSites.length }}+ ...</span>
</VChip>
<VChip
v-if="sitesExpanded && uniqueSupportingSites.length > 5"
variant="tonal"
size="small"
@click="toggleSitesExpanded"
>
<span>< {{ t('setting.about.collapse') }}</span>
</VChip>
</div>
</div>
</dd>
</div>
</div>
</dl>
</div>
</div>
<div class="section">
<div>
<h3 class="heading">{{ t('setting.about.support') }}</h3>
</div>
<div class="section border-t border-gray-800">
<dl>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.documentation') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined">
<a
href="https://movie-pilot.org"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://movie-pilot.org
</a>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.feedback') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined">
<a
href="https://github.com/jxxghp/MoviePilot/issues/new/choose"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://github.com/jxxghp/MoviePilot/issues/new/choose
</a>
</span>
</dd>
</div>
</div>
<div>
<div class="max-w-6xl py-4 sm:grid sm:grid-cols-3 sm:gap-4">
<dt class="block text-sm font-bold">{{ t('setting.about.channel') }}</dt>
<dd class="flex text-sm sm:col-span-2 sm:mt-0">
<span class="flex-grow undefined">
<a
href="https://t.me/moviepilot_channel"
target="_blank"
rel="noreferrer"
class="text-indigo-500 transition duration-300 hover:underline"
>
https://t.me/moviepilot_channel
</a>
</span>
</dd>
</div>
</div>
</dl>
</div>
</div>
<div class="section">
<div>
<h3 class="heading">{{ t('setting.about.versions') }}</h3>
<div class="section space-y-3">
<div>
<div
v-for="release in allRelease"
:key="release.tag_name"
class="mb-3 flex w-full flex-col space-y-3 rounded-md px-4 py-2 ring-1 ring-gray-400 sm:flex-row sm:space-y-0 sm:space-x-3"
>
<div class="flex w-full flex-grow items-center justify-start space-x-2 truncate sm:justify-start">
<span class="truncate text-lg font-bold">
<span class="mr-2 whitespace-nowrap text-xs font-normal">{{
releaseTime(release.published_at)
}}</span>
{{ release.tag_name }}
</span>
<span
v-if="release.tag_name === latestRelease"
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap cursor-default bg-green-500 bg-opacity-80 border border-green-500 !text-green-100"
>
{{ t('setting.about.latestVersion') }}
</span>
<span
v-if="release.tag_name === systemEnv.VERSION"
class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full whitespace-nowrap cursor-default bg-indigo-500 bg-opacity-80 border border-indigo-500 !text-indigo-100"
>
{{ t('setting.about.currentVersion') }}
</span>
</div>
<VBtn @click.stop="showReleaseDialog(release.tag_name, release.body)">
<template #prepend>
<VIcon icon="mdi-text-box-outline" />
</template>
{{ t('setting.about.viewChangelog') }}
</VBtn>
</div>
</div>
</div>
</div>
</div>
</div>
<VDialog v-if="releaseDialog" v-model="releaseDialog" width="600" scrollable>
<VCard>
<VCardItem>
<VDialogCloseBtn @click="releaseDialog = false" />
<VCardTitle>{{ releaseDialogTitle }} {{ t('setting.about.changelog') }}</VCardTitle>
</VCardItem>
<VCardText v-html="releaseDialogBody" />
</VCard>
</VDialog>
</template>
<style type="scss" scoped>
.heading {
font-size: 1.5rem;
font-weight: 700;
line-height: 2rem;
--tw-text-opacity: 1;
}
.section {
margin-block: 0.5rem 2.5rem;
}
</style>

View File

@@ -45,7 +45,7 @@ const templateTypes = ref([
// 编辑器主题
const { name: themeName, global: globalTheme } = useTheme()
const savedTheme = ref(localStorage.getItem('theme') ?? themeName)
const savedTheme = ref(localStorage.getItem('theme') ?? 'auto')
const currentThemeName = ref(savedTheme.value)
const editorTheme = computed(() => (currentThemeName.value === 'light' ? 'github' : 'monokai'))
@@ -294,6 +294,9 @@ onMounted(() => {
<VListItem @click="addNotification('slack')">
<VListItemTitle>{{ t('setting.notification.slack') }}</VListItemTitle>
</VListItem>
<VListItem @click="addNotification('discord')">
<VListItemTitle>Discord</VListItemTitle>
</VListItem>
<VListItem @click="addNotification('synologychat')">
<VListItemTitle>{{ t('setting.notification.synologyChat') }}</VListItemTitle>
</VListItem>

View File

@@ -54,12 +54,20 @@ const rssIntervalItems = [
{ title: t('setting.subscribe.intervals.day1'), value: 1440 },
]
// 订阅搜索时间间隔选择项(小时)
const subscribeSearchIntervalItems = [
{ title: t('setting.subscribe.intervals.day1'), value: 24 },
{ title: t('setting.subscribe.intervals.day3'), value: 72 },
{ title: t('setting.subscribe.intervals.week1'), value: 168 },
]
// 系统设置项
const SystemSettings = ref<any>({
// 基础设置
Basic: {
SUBSCRIBE_MODE: 'auto',
SUBSCRIBE_SEARCH: false,
SUBSCRIBE_SEARCH_INTERVAL: 24,
SUBSCRIBE_RSS_INTERVAL: 30,
LOCAL_EXISTS_SEARCH: false,
},
@@ -252,6 +260,16 @@ onMounted(() => {
persistent-hint
/>
</VCol>
<VCol v-if="SystemSettings.Basic.SUBSCRIBE_SEARCH" cols="12" md="6">
<VSelect
v-model="SystemSettings.Basic.SUBSCRIBE_SEARCH_INTERVAL"
:items="subscribeSearchIntervalItems"
:label="t('setting.subscribe.searchInterval')"
:hint="t('setting.subscribe.searchIntervalHint')"
persistent-hint
prepend-inner-icon="mdi-timer"
/>
</VCol>
<VCol cols="12" md="6">
<VSwitch
v-model="SystemSettings.Basic.LOCAL_EXISTS_SEARCH"

View File

@@ -31,6 +31,12 @@ const SystemSettings = ref<any>({
GITHUB_TOKEN: null,
OCR_HOST: null,
CUSTOMIZE_WALLPAPER_API_URL: null,
AI_AGENT_ENABLE: false,
AI_AGENT_GLOBAL: false,
LLM_PROVIDER: 'deepseek',
LLM_MODEL: 'deepseek-chat',
LLM_API_KEY: null,
LLM_BASE_URL: 'https://api.deepseek.com',
},
// 高级系统设置
Advanced: {
@@ -114,6 +120,10 @@ const progressDialog = ref(false)
// 高级设置对话框
const advancedDialog = ref(false)
// LLM 模型列表
const llmModels = ref<string[]>([])
const loadingModels = ref(false)
const activeTab = ref('system')
// 元数据语言
@@ -149,6 +159,30 @@ const logLevelItems = [
// 安全域名添加变量
const newSecurityDomain = ref('')
// 加载LLM模型列表
async function loadLlmModels() {
loadingModels.value = true
try {
const result: { [key: string]: any } = await api.get('system/llm-models', {
params: {
provider: SystemSettings.value.Basic.LLM_PROVIDER,
api_key: SystemSettings.value.Basic.LLM_API_KEY,
base_url: SystemSettings.value.Basic.LLM_BASE_URL,
},
})
if (result.success) {
llmModels.value = result.data
if (llmModels.value.length > 0) SystemSettings.value.Basic.LLM_MODEL = llmModels.value[0]
} else {
$toast.error(result.message)
}
} catch (error) {
console.log(error)
}
loadingModels.value = false
}
// 添加安全域名
function addSecurityDomain() {
if (
@@ -607,6 +641,82 @@ onDeactivated(() => {
/>
</VCol>
</VRow>
<VDivider class="my-4" />
<VRow>
<VCol cols="12">
<VSwitch
v-model="SystemSettings.Basic.AI_AGENT_ENABLE"
:label="t('setting.system.aiAgentEnable')"
:hint="t('setting.system.aiAgentEnableHint')"
persistent-hint
/>
</VCol>
<VCol v-if="SystemSettings.Basic.AI_AGENT_ENABLE" cols="12" md="6">
<VSelect
v-model="SystemSettings.Basic.LLM_PROVIDER"
:label="t('setting.system.llmProvider')"
:hint="t('setting.system.llmProviderHint')"
persistent-hint
:items="[
{ title: 'OpenAI', value: 'openai' },
{ title: 'Google', value: 'google' },
{ title: 'DeepSeek', value: 'deepseek' },
]"
prepend-inner-icon="mdi-robot"
/>
</VCol>
<VCol v-if="SystemSettings.Basic.AI_AGENT_ENABLE" cols="12" md="6">
<VTextField
v-model="SystemSettings.Basic.LLM_BASE_URL"
:label="t('setting.system.llmBaseUrl')"
:hint="t('setting.system.llmBaseUrlHint')"
placeholder="https://api.deepseek.com"
persistent-hint
prepend-inner-icon="mdi-link"
/>
</VCol>
<VCol v-if="SystemSettings.Basic.AI_AGENT_ENABLE" cols="12" md="6">
<VTextField
v-model="SystemSettings.Basic.LLM_API_KEY"
:label="t('setting.system.llmApiKey')"
:hint="t('setting.system.llmApiKeyHint')"
:placeholder="t('setting.system.llmApiKeyPlaceholder')"
persistent-hint
type="password"
prepend-inner-icon="mdi-key-variant"
/>
</VCol>
<VCol v-if="SystemSettings.Basic.AI_AGENT_ENABLE" cols="12" md="6">
<VCombobox
v-model="SystemSettings.Basic.LLM_MODEL"
:label="t('setting.system.llmModel')"
:hint="t('setting.system.llmModelHint')"
:placeholder="t('setting.system.llmModelHint')"
persistent-hint
:items="llmModels"
:loading="loadingModels"
prepend-inner-icon="mdi-brain"
>
<template #append-inner>
<VBtn
variant="text"
icon="mdi-refresh"
size="small"
@click="loadLlmModels"
:disabled="!SystemSettings.Basic.LLM_API_KEY"
/>
</template>
</VCombobox>
</VCol>
<VCol v-if="SystemSettings.Basic.AI_AGENT_ENABLE" cols="12" md="6">
<VSwitch
v-model="SystemSettings.Basic.AI_AGENT_GLOBAL"
:label="t('setting.system.aiAgentGlobal')"
:hint="t('setting.system.aiAgentGlobalHint')"
persistent-hint
/>
</VCol>
</VRow>
</VForm>
</VCardText>
<VCardText>

View File

@@ -0,0 +1,160 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
const { t } = useI18n()
const { wizardData, createRandomString, copyValue, validateCurrentStep } = useSetupWizard()
// 密码可见性控制
const isPasswordVisible = ref(false)
const isConfirmPasswordVisible = ref(false)
// 验证状态
const validation = computed(() => validateCurrentStep())
const hasErrors = computed(() => !validation.value.isValid)
// 密码相关验证
const passwordError = computed(() => {
if (!wizardData.value.basic.password) return false
return wizardData.value.basic.password.length < 6
})
const confirmPasswordError = computed(() => {
if (!wizardData.value.basic.password) return false
if (!wizardData.value.basic.confirmPassword) return true
return wizardData.value.basic.password !== wizardData.value.basic.confirmPassword
})
const passwordErrorMessage = computed(() => {
if (passwordError.value) return t('dialog.userAddEdit.passwordMinLength')
return ''
})
const confirmPasswordErrorMessage = computed(() => {
if (!wizardData.value.basic.password) return ''
if (!wizardData.value.basic.confirmPassword) return t('dialog.userAddEdit.confirmPasswordRequired')
if (confirmPasswordError.value) return t('dialog.userAddEdit.passwordMismatch')
return ''
})
// API Token验证
const apiTokenError = computed(() => {
return !wizardData.value.basic.apiToken && hasErrors.value
})
const apiTokenErrorMessage = computed(() => {
if (apiTokenError.value) return t('setupWizard.basic.apiTokenRequired')
return ''
})
// 用户名验证(虽然是只读的,但为了完整性)
const usernameError = computed(() => {
return !wizardData.value.basic.username && hasErrors.value
})
const usernameErrorMessage = computed(() => {
if (usernameError.value) return t('dialog.userAddEdit.usernameRequired')
return ''
})
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.basic.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.basic.description') }}</p>
</div>
<VRow>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.appDomain"
:label="t('setupWizard.basic.appDomain')"
:hint="t('setupWizard.basic.appDomainHint')"
placeholder="http://localhost:3000"
persistent-hint
prepend-inner-icon="mdi-web"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.username"
:label="t('user.username')"
:hint="t('setupWizard.basic.currentUserHint')"
persistent-hint
prepend-inner-icon="mdi-account"
readonly
:error="usernameError"
:error-messages="usernameError ? [usernameErrorMessage] : []"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.password"
:type="isPasswordVisible ? 'text' : 'password'"
:label="t('user.password')"
:hint="t('setupWizard.basic.passwordOptionalHint')"
persistent-hint
prepend-inner-icon="mdi-lock"
:append-inner-icon="isPasswordVisible ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
@click:append-inner="isPasswordVisible = !isPasswordVisible"
:error="passwordError"
:error-messages="passwordError ? [passwordErrorMessage] : []"
clearable
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.confirmPassword"
:type="isConfirmPasswordVisible ? 'text' : 'password'"
:label="t('user.confirmPassword')"
:hint="t('setupWizard.basic.confirmPasswordHint')"
persistent-hint
prepend-inner-icon="mdi-lock-check"
:append-inner-icon="isConfirmPasswordVisible ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
@click:append-inner="isConfirmPasswordVisible = !isConfirmPasswordVisible"
:disabled="!wizardData.basic.password"
:error="confirmPasswordError"
:error-messages="confirmPasswordError ? [confirmPasswordErrorMessage] : []"
clearable
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.proxyHost"
:label="t('setting.system.proxyHost')"
:hint="t('setting.system.proxyHostHint')"
placeholder="http://127.0.0.1:7890"
persistent-hint
prepend-inner-icon="mdi-server-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.githubToken"
:label="t('setting.system.githubToken')"
:placeholder="t('setting.system.githubTokenFormat')"
:hint="t('setting.system.githubTokenHint')"
persistent-hint
prepend-inner-icon="mdi-github"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.basic.apiToken"
:label="t('setupWizard.basic.apiToken')"
:hint="t('setupWizard.basic.apiTokenHint')"
persistent-hint
prepend-inner-icon="mdi-key"
:append-inner-icon="wizardData.basic.apiToken ? 'mdi-content-copy' : 'mdi-reload'"
@click:append-inner="
wizardData.basic.apiToken ? copyValue(wizardData.basic.apiToken) : createRandomString()
"
:error="apiTokenError"
:error-messages="apiTokenError ? [apiTokenErrorMessage] : []"
/>
</VCol>
</VRow>
</VCardText>
</VCard>
</template>

View File

@@ -0,0 +1,64 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
const { t } = useI18n()
const { connectivityTest } = useSetupWizard()
</script>
<template>
<!-- 连通性测试进度条 -->
<VCard v-if="connectivityTest.isTesting || connectivityTest.showResult" variant="outlined" class="mx-4 mb-4">
<VCardText class="text-center py-4">
<!-- 测试中 -->
<div v-if="connectivityTest.isTesting">
<VIcon icon="mdi-cog-sync" class="rotating mb-2" color="primary" size="24" />
<div class="text-body-2 mb-2">{{ connectivityTest.testMessage }}</div>
<VProgressLinear
v-model="connectivityTest.testProgress"
color="primary"
height="6"
rounded
class="mb-2"
/>
<div class="text-caption text-medium-emphasis">{{ Math.round(connectivityTest.testProgress) }}%</div>
</div>
<!-- 测试结果 -->
<div v-else-if="connectivityTest.showResult">
<VIcon
:icon="connectivityTest.testResult === 'success' ? 'mdi-check-circle' : 'mdi-alert-circle'"
:color="connectivityTest.testResult === 'success' ? 'success' : 'error'"
size="24"
class="mb-2"
/>
<div
:class="connectivityTest.testResult === 'success' ? 'text-success' : 'text-error'"
class="text-body-2 mb-2 font-weight-medium"
>
{{ connectivityTest.testMessage }}
</div>
<div v-if="connectivityTest.testResult === 'error'" class="text-caption text-medium-emphasis">
{{ t('setupWizard.testFailedHint') }}
</div>
</div>
</VCardText>
</VCard>
</template>
<style scoped>
/* 旋转动画 */
.rotating {
animation: rotate 2s linear infinite;
}
@keyframes rotate {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
</style>

View File

@@ -0,0 +1,262 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
import { getLogoUrl } from '@/utils/imageUtils'
const { t } = useI18n()
const { wizardData, selectDownloader, validationErrors } = useSetupWizard()
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.downloader.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.downloader.description') }}</p>
</div>
<VRow>
<VCol cols="12">
<VAlert type="info" variant="tonal" class="mb-4">
<VAlertTitle>{{ t('setupWizard.downloader.info') }}</VAlertTitle>
{{ t('setupWizard.downloader.infoDesc') }}
</VAlert>
</VCol>
<!-- 下载器选择 -->
<VCol cols="12">
<div class="mb-4">
<h4 class="text-h6 mb-4">{{ t('setupWizard.downloader.type') }}</h4>
<VRow>
<VCol cols="12" md="6">
<VCard
:color="wizardData.downloader.type === 'qbittorrent' ? 'primary' : 'default'"
:variant="wizardData.downloader.type === 'qbittorrent' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectDownloader('qbittorrent')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('qbittorrent')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">qBittorrent</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="6">
<VCard
:color="wizardData.downloader.type === 'transmission' ? 'primary' : 'default'"
:variant="wizardData.downloader.type === 'transmission' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectDownloader('transmission')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('transmission')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Transmission</div>
</VCardText>
</VCard>
</VCol>
</VRow>
</div>
</VCol>
<!-- 下载器配置 -->
<VCol v-if="wizardData.downloader.type" cols="12">
<VCard>
<VCardText>
<VForm>
<VRow v-if="wizardData.downloader.type === 'qbittorrent'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.name"
:label="t('downloader.name')"
:placeholder="t('downloader.nameRequired')"
:hint="t('downloader.name')"
:error="validationErrors.downloader.name"
:error-messages="validationErrors.downloader.name ? [t('downloader.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.host"
:label="t('downloader.host')"
placeholder="http(s)://ip:port"
:hint="t('downloader.host')"
:error="validationErrors.downloader.host"
:error-messages="validationErrors.downloader.host ? [t('downloader.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.username"
:label="t('downloader.username')"
:hint="t('downloader.username')"
:error="validationErrors.downloader.username"
:error-messages="validationErrors.downloader.username ? [t('downloader.usernameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-account"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.password"
type="password"
:label="t('downloader.password')"
:hint="t('downloader.password')"
:error="validationErrors.downloader.password"
:error-messages="validationErrors.downloader.password ? [t('downloader.passwordRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-lock"
required
/>
</VCol>
<VCol cols="12" md="6">
<VSwitch
v-model="wizardData.downloader.config.sequentail"
:label="t('downloader.sequentail')"
:hint="t('downloader.sequentail')"
persistent-hint
active
/>
</VCol>
<VCol cols="12" md="6">
<VSwitch
v-model="wizardData.downloader.config.force_resume"
:label="t('downloader.force_resume')"
:hint="t('downloader.force_resume')"
persistent-hint
active
/>
</VCol>
<VCol cols="12" md="6">
<VSwitch
v-model="wizardData.downloader.config.first_last_piece"
:label="t('downloader.first_last_piece')"
:hint="t('downloader.first_last_piece')"
persistent-hint
active
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.downloader.type === 'transmission'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.name"
:label="t('downloader.name')"
:placeholder="t('downloader.nameRequired')"
:hint="t('downloader.name')"
:error="validationErrors.downloader.name"
:error-messages="validationErrors.downloader.name ? [t('downloader.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.host"
:label="t('downloader.host')"
placeholder="http(s)://ip:port"
:hint="t('downloader.host')"
:error="validationErrors.downloader.host"
:error-messages="validationErrors.downloader.host ? [t('downloader.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.username"
:label="t('downloader.username')"
:hint="t('downloader.username')"
:error="validationErrors.downloader.username"
:error-messages="validationErrors.downloader.username ? [t('downloader.usernameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-account"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.config.password"
type="password"
:label="t('downloader.password')"
:hint="t('downloader.password')"
:error="validationErrors.downloader.password"
:error-messages="validationErrors.downloader.password ? [t('downloader.passwordRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-lock"
required
/>
</VCol>
</VRow>
<VRow v-else>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.type"
:label="t('downloader.type')"
:hint="t('downloader.customTypeHint')"
persistent-hint
active
prepend-inner-icon="mdi-cog"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.downloader.name"
:label="t('downloader.name')"
:hint="t('downloader.nameRequired')"
persistent-hint
active
prepend-inner-icon="mdi-label"
/>
</VCol>
</VRow>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</VCardText>
</VCard>
</template>
<style scoped>
.cursor-pointer {
cursor: pointer;
transition: all 0.2s ease;
}
.cursor-pointer:hover {
box-shadow: 0 4px 12px rgba(0, 0, 0, 15%);
transform: translateY(-2px);
}
.cursor-pointer:active {
transform: translateY(0);
}
/* 选中状态的样式 */
.v-card--variant-tonal.v-theme--light {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.12);
}
.v-card--variant-tonal.v-theme--dark {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.2);
}
</style>

View File

@@ -0,0 +1,507 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
import api from '@/api'
import { getLogoUrl } from '@/utils/imageUtils'
const { t } = useI18n()
const { wizardData, selectMediaServer, validationErrors } = useSetupWizard()
// 同步媒体库选项
const librariesOptions = ref<{ title: string; value: string | undefined }[]>([
{
title: t('common.all'),
value: 'all',
},
])
// 调用API查询媒体库
async function loadLibrary(server: string) {
try {
console.log('Loading library for server:', server)
const result: any[] = await api.get('mediaserver/library', { params: { server } })
if (result && result.length > 0) {
librariesOptions.value = result.map(item => ({
title: item.name,
value: item.id?.toString(),
}))
console.log('Loaded libraries:', librariesOptions.value)
} else {
librariesOptions.value = []
console.log('No libraries found')
}
librariesOptions.value.unshift({
title: t('common.all'),
value: 'all',
})
} catch (e) {
console.log('Error loading library:', e)
}
}
// 选择媒体服务器并自动加载媒体库
async function selectMediaServerWithLibrary(type: string) {
selectMediaServer(type)
// 如果选择了媒体服务器类型,自动加载媒体库
if (type && wizardData.value.mediaServer.name) {
await loadLibrary(wizardData.value.mediaServer.name)
}
}
// 组件挂载时检查是否需要加载媒体库
onMounted(async () => {
// 如果已经有媒体服务器配置,自动加载媒体库
if (wizardData.value.mediaServer.type && wizardData.value.mediaServer.name) {
await loadLibrary(wizardData.value.mediaServer.name)
}
})
// 监听媒体服务器配置变化,自动加载媒体库
watch(
() => [wizardData.value.mediaServer.type, wizardData.value.mediaServer.name],
async ([type, name]) => {
console.log('Media server changed:', { type, name })
if (type && name) {
await loadLibrary(name)
}
},
{ immediate: true },
)
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.mediaServer.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.mediaServer.description') }}</p>
</div>
<VRow>
<VCol cols="12">
<VAlert type="info" variant="tonal" class="mb-4">
<VAlertTitle>{{ t('setupWizard.mediaServer.info') }}</VAlertTitle>
{{ t('setupWizard.mediaServer.infoDesc') }}
</VAlert>
</VCol>
<!-- 媒体服务器选择 -->
<VCol cols="12">
<div class="mb-4">
<h4 class="text-h6 mb-4">{{ t('setupWizard.mediaServer.type') }}</h4>
<VRow>
<VCol cols="12" md="3">
<VCard
:color="wizardData.mediaServer.type === 'emby' ? 'primary' : 'default'"
:variant="wizardData.mediaServer.type === 'emby' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectMediaServerWithLibrary('emby')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('emby')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Emby</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.mediaServer.type === 'jellyfin' ? 'primary' : 'default'"
:variant="wizardData.mediaServer.type === 'jellyfin' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectMediaServerWithLibrary('jellyfin')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('jellyfin')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Jellyfin</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.mediaServer.type === 'plex' ? 'primary' : 'default'"
:variant="wizardData.mediaServer.type === 'plex' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectMediaServerWithLibrary('plex')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('plex')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Plex</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.mediaServer.type === 'trimemedia' ? 'primary' : 'default'"
:variant="wizardData.mediaServer.type === 'trimemedia' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectMediaServerWithLibrary('trimemedia')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('trimemedia')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">飞牛影视</div>
</VCardText>
</VCard>
</VCol>
</VRow>
</div>
</VCol>
<!-- 媒体服务器配置 -->
<VCol v-if="wizardData.mediaServer.type" cols="12">
<VCard>
<VCardText>
<VForm>
<VRow v-if="wizardData.mediaServer.type === 'emby'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.name"
:label="t('common.name')"
:placeholder="t('mediaserver.nameRequired')"
:hint="t('mediaserver.serverAlias')"
:error="validationErrors.mediaServer.name"
:error-messages="validationErrors.mediaServer.name ? [t('mediaserver.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.host"
:label="t('mediaserver.host')"
:placeholder="t('mediaserver.hostPlaceholder')"
:hint="t('mediaserver.hostHint')"
:error="validationErrors.mediaServer.host"
:error-messages="validationErrors.mediaServer.host ? [t('mediaserver.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.play_host"
:label="t('mediaserver.playHost')"
:placeholder="t('mediaserver.playHostPlaceholder')"
:hint="t('mediaserver.playHostHint')"
persistent-hint
active
prepend-inner-icon="mdi-play-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.username"
:label="t('mediaserver.username')"
:hint="t('mediaserver.usernameHint')"
persistent-hint
active
prepend-inner-icon="mdi-account"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.apikey"
:label="t('mediaserver.apiKey')"
:hint="t('mediaserver.embyApiKeyHint')"
:error="validationErrors.mediaServer.apikey"
:error-messages="validationErrors.mediaServer.apikey ? [t('mediaserver.apiKeyRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12">
<VAutocomplete
v-model="wizardData.mediaServer.sync_libraries"
:label="t('mediaserver.syncLibraries')"
:items="librariesOptions"
chips
multiple
clearable
:hint="t('mediaserver.syncLibrariesHint')"
persistent-hint
active
append-inner-icon="mdi-refresh"
prepend-inner-icon="mdi-library"
@click:append-inner="loadLibrary(wizardData.mediaServer.name)"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.mediaServer.type === 'jellyfin'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.name"
:label="t('common.name')"
:placeholder="t('mediaserver.nameRequired')"
:hint="t('mediaserver.serverAlias')"
:error="validationErrors.mediaServer.name"
:error-messages="validationErrors.mediaServer.name ? [t('mediaserver.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.host"
:label="t('mediaserver.host')"
:placeholder="t('mediaserver.hostPlaceholder')"
:hint="t('mediaserver.hostHint')"
:error="validationErrors.mediaServer.host"
:error-messages="validationErrors.mediaServer.host ? [t('mediaserver.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.play_host"
:label="t('mediaserver.playHost')"
:placeholder="t('mediaserver.playHostPlaceholder')"
:hint="t('mediaserver.playHostHint')"
persistent-hint
active
prepend-inner-icon="mdi-play-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.apikey"
:label="t('mediaserver.apiKey')"
:hint="t('mediaserver.jellyfinApiKeyHint')"
:error="validationErrors.mediaServer.apikey"
:error-messages="validationErrors.mediaServer.apikey ? [t('mediaserver.apiKeyRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12">
<VAutocomplete
v-model="wizardData.mediaServer.sync_libraries"
:label="t('mediaserver.syncLibraries')"
:items="librariesOptions"
chips
multiple
clearable
:hint="t('mediaserver.syncLibrariesHint')"
persistent-hint
active
append-inner-icon="mdi-refresh"
prepend-inner-icon="mdi-library"
@click:append-inner="loadLibrary(wizardData.mediaServer.name)"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.mediaServer.type === 'trimemedia'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.name"
:label="t('common.name')"
:placeholder="t('mediaserver.nameRequired')"
:hint="t('mediaserver.serverAlias')"
:error="validationErrors.mediaServer.name"
:error-messages="validationErrors.mediaServer.name ? [t('mediaserver.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.host"
:label="t('mediaserver.host')"
:placeholder="t('mediaserver.hostPlaceholder')"
:hint="t('mediaserver.hostHint')"
:error="validationErrors.mediaServer.host"
:error-messages="validationErrors.mediaServer.host ? [t('mediaserver.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12">
<VTextField
v-model="wizardData.mediaServer.config.play_host"
:label="t('mediaserver.playHost')"
:placeholder="t('mediaserver.playHostPlaceholder')"
:hint="t('mediaserver.playHostHint')"
persistent-hint
active
prepend-inner-icon="mdi-play-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.username"
:label="t('mediaserver.username')"
:error="validationErrors.mediaServer.username"
:error-messages="validationErrors.mediaServer.username ? [t('mediaserver.usernameRequired')] : []"
active
prepend-inner-icon="mdi-account"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
type="password"
v-model="wizardData.mediaServer.config.password"
:label="t('mediaserver.password')"
:error="validationErrors.mediaServer.password"
:error-messages="validationErrors.mediaServer.password ? [t('mediaserver.passwordRequired')] : []"
active
prepend-inner-icon="mdi-lock"
required
/>
</VCol>
<VCol cols="12">
<VAutocomplete
v-model="wizardData.mediaServer.sync_libraries"
:label="t('mediaserver.syncLibraries')"
:items="librariesOptions"
chips
multiple
clearable
:hint="t('mediaserver.syncLibrariesHint')"
persistent-hint
active
append-inner-icon="mdi-refresh"
prepend-inner-icon="mdi-library"
@click:append-inner="loadLibrary(wizardData.mediaServer.name)"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.mediaServer.type === 'plex'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.name"
:label="t('common.name')"
:placeholder="t('mediaserver.nameRequired')"
:hint="t('mediaserver.serverAlias')"
:error="validationErrors.mediaServer.name"
:error-messages="validationErrors.mediaServer.name ? [t('mediaserver.nameRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.host"
:label="t('mediaserver.host')"
:placeholder="t('mediaserver.hostPlaceholder')"
:hint="t('mediaserver.hostHint')"
:error="validationErrors.mediaServer.host"
:error-messages="validationErrors.mediaServer.host ? [t('mediaserver.hostRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.play_host"
:label="t('mediaserver.playHost')"
:placeholder="t('mediaserver.playHostPlaceholder')"
:hint="t('mediaserver.playHostHint')"
persistent-hint
active
prepend-inner-icon="mdi-play-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.config.token"
:label="t('mediaserver.plexToken')"
:hint="t('mediaserver.plexTokenHint')"
:error="validationErrors.mediaServer.token"
:error-messages="validationErrors.mediaServer.token ? [t('mediaserver.tokenRequired')] : []"
persistent-hint
active
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12">
<VAutocomplete
v-model="wizardData.mediaServer.sync_libraries"
:label="t('mediaserver.syncLibraries')"
:items="librariesOptions"
chips
multiple
clearable
:hint="t('mediaserver.syncLibrariesHint')"
persistent-hint
active
append-inner-icon="mdi-refresh"
prepend-inner-icon="mdi-library"
@click:append-inner="loadLibrary(wizardData.mediaServer.name)"
/>
</VCol>
</VRow>
<VRow v-else>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.type"
:label="t('mediaserver.type')"
:hint="t('mediaserver.customTypeHint')"
persistent-hint
prepend-inner-icon="mdi-cog"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.mediaServer.name"
:label="t('common.name')"
:hint="t('mediaserver.nameRequired')"
persistent-hint
prepend-inner-icon="mdi-label"
/>
</VCol>
</VRow>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</VCardText>
</VCard>
</template>
<style scoped>
.cursor-pointer {
cursor: pointer;
transition: all 0.2s ease;
}
.cursor-pointer:hover {
box-shadow: 0 4px 12px rgba(0, 0, 0, 15%);
transform: translateY(-2px);
}
.cursor-pointer:active {
transform: translateY(0);
}
/* 选中状态的样式 */
.v-card--variant-tonal.v-theme--light {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.12);
}
.v-card--variant-tonal.v-theme--dark {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.2);
}
</style>

View File

@@ -0,0 +1,553 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
import { getLogoUrl } from '@/utils/imageUtils'
const { t } = useI18n()
const { wizardData, selectNotification, validationErrors } = useSetupWizard()
// 消息类型下拉字典
const notificationTypes = [
{ value: '资源下载', title: t('notificationSwitch.resourceDownload') },
{ value: '整理入库', title: t('notificationSwitch.organize') },
{ value: '订阅', title: t('notificationSwitch.subscribe') },
{ value: '站点', title: t('notificationSwitch.site') },
{ value: '媒体服务器', title: t('notificationSwitch.mediaServer') },
{ value: '手动处理', title: t('notificationSwitch.manual') },
{ value: '插件', title: t('notificationSwitch.plugin') },
{ value: '其它', title: t('notificationSwitch.other') },
]
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.notification.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.notification.description') }}</p>
</div>
<VRow>
<VCol cols="12">
<VAlert type="info" variant="tonal" class="mb-4">
<VAlertTitle>{{ t('setupWizard.notification.info') }}</VAlertTitle>
{{ t('setupWizard.notification.infoDesc') }}
</VAlert>
</VCol>
<!-- 通知选择 -->
<VCol cols="12">
<div class="mb-4">
<h4 class="text-h6 mb-4">{{ t('setupWizard.notification.type') }}</h4>
<VRow>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'wechat' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'wechat' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('wechat')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('wechat')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">微信</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'telegram' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'telegram' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('telegram')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('telegram')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Telegram</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'slack' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'slack' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('slack')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('slack')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Slack</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'synologychat' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'synologychat' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('synologychat')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('synologychat')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">Synology Chat</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'vocechat' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'vocechat' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('vocechat')"
>
<VCardText class="text-center">
<VImg :src="getLogoUrl('vocechat')" height="48" width="48" class="mx-auto mb-2" />
<div class="text-h6">VoceChat</div>
</VCardText>
</VCard>
</VCol>
<VCol cols="12" md="3">
<VCard
:color="wizardData.notification.type === 'webpush' ? 'primary' : 'default'"
:variant="wizardData.notification.type === 'webpush' ? 'tonal' : 'outlined'"
class="cursor-pointer"
@click="selectNotification('webpush')"
>
<VCardText class="text-center">
<VIcon icon="mdi-apple-safari" size="48" class="mb-2" />
<div class="text-h6">WebPush</div>
</VCardText>
</VCard>
</VCol>
</VRow>
</div>
</VCol>
<!-- 通知配置 -->
<VCol v-if="wizardData.notification.type" cols="12">
<VCard>
<VCardText>
<VForm>
<VRow>
<VCol cols="12">
<VAutocomplete
v-model="wizardData.notification.switchs"
:items="notificationTypes"
:label="t('notification.type')"
:hint="t('notification.typeHint')"
multiple
clearable
chips
persistent-hint
prepend-inner-icon="mdi-bell-outline"
/>
</VCol>
</VRow>
<VRow v-if="wizardData.notification.type === 'wechat'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_CORPID"
:label="t('notification.wechat.corpId')"
:hint="t('notification.wechat.corpIdHint')"
:error="validationErrors.notification.WECHAT_CORPID"
:error-messages="
validationErrors.notification.WECHAT_CORPID ? [t('notification.wechat.corpIdRequired')] : []
"
persistent-hint
prepend-inner-icon="mdi-domain"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_APP_ID"
:label="t('notification.wechat.appId')"
:hint="t('notification.wechat.appIdHint')"
:error="validationErrors.notification.WECHAT_APP_ID"
:error-messages="
validationErrors.notification.WECHAT_APP_ID ? [t('notification.wechat.appIdRequired')] : []
"
persistent-hint
prepend-inner-icon="mdi-application"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_APP_SECRET"
:label="t('notification.wechat.appSecret')"
:hint="t('notification.wechat.appSecretHint')"
:error="validationErrors.notification.WECHAT_APP_SECRET"
:error-messages="
validationErrors.notification.WECHAT_APP_SECRET
? [t('notification.wechat.appSecretRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_PROXY"
:label="t('notification.wechat.proxy')"
:hint="t('notification.wechat.proxyHint')"
persistent-hint
prepend-inner-icon="mdi-server-network"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_TOKEN"
:label="t('notification.wechat.token')"
:hint="t('notification.wechat.tokenHint')"
persistent-hint
prepend-inner-icon="mdi-key-variant"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_ENCODING_AESKEY"
:label="t('notification.wechat.encodingAesKey')"
:hint="t('notification.wechat.encodingAesKeyHint')"
persistent-hint
prepend-inner-icon="mdi-lock"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WECHAT_ADMINS"
:label="t('notification.wechat.admins')"
:placeholder="t('notification.wechat.adminsPlaceholder')"
:hint="t('notification.wechat.adminsHint')"
persistent-hint
prepend-inner-icon="mdi-account-supervisor"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.notification.type === 'telegram'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.TELEGRAM_TOKEN"
:label="t('notification.telegram.token')"
:hint="t('notification.telegram.tokenHint')"
:error="validationErrors.notification.TELEGRAM_TOKEN"
:error-messages="
validationErrors.notification.TELEGRAM_TOKEN ? [t('notification.telegram.tokenRequired')] : []
"
persistent-hint
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.TELEGRAM_CHAT_ID"
:label="t('notification.telegram.chatId')"
:hint="t('notification.telegram.chatIdHint')"
:error="validationErrors.notification.TELEGRAM_CHAT_ID"
:error-messages="
validationErrors.notification.TELEGRAM_CHAT_ID
? [t('notification.telegram.chatIdRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-chat"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.TELEGRAM_USERS"
:label="t('notification.telegram.users')"
:placeholder="t('notification.telegram.usersPlaceholder')"
:hint="t('notification.telegram.usersHint')"
persistent-hint
prepend-inner-icon="mdi-account-group"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.TELEGRAM_ADMINS"
:label="t('notification.telegram.admins')"
:placeholder="t('notification.telegram.adminsPlaceholder')"
:hint="t('notification.telegram.adminsHint')"
persistent-hint
prepend-inner-icon="mdi-account-supervisor"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.API_URL"
:label="t('notification.telegram.apiUrl')"
:placeholder="t('notification.telegram.apiUrlPlaceholder')"
:hint="t('notification.telegram.apiUrlHint')"
persistent-hint
prepend-inner-icon="mdi-web"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.notification.type === 'slack'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.SLACK_OAUTH_TOKEN"
:label="t('notification.slack.oauthToken')"
:placeholder="t('notification.slack.oauthTokenPlaceholder')"
:hint="t('notification.slack.oauthTokenHint')"
:error="validationErrors.notification.SLACK_OAUTH_TOKEN"
:error-messages="
validationErrors.notification.SLACK_OAUTH_TOKEN
? [t('notification.slack.oauthTokenRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.SLACK_APP_TOKEN"
:label="t('notification.slack.appToken')"
:placeholder="t('notification.slack.appTokenPlaceholder')"
:hint="t('notification.slack.appTokenHint')"
persistent-hint
prepend-inner-icon="mdi-application"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.SLACK_CHANNEL"
:label="t('notification.slack.channel')"
:placeholder="t('notification.slack.channelPlaceholder')"
:hint="t('notification.slack.channelHint')"
:error="validationErrors.notification.SLACK_CHANNEL"
:error-messages="
validationErrors.notification.SLACK_CHANNEL ? [t('notification.slack.channelRequired')] : []
"
persistent-hint
prepend-inner-icon="mdi-pound"
required
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.notification.type === 'synologychat'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.SYNOLOGYCHAT_WEBHOOK"
:label="t('notification.synologychat.webhook')"
:hint="t('notification.synologychat.webhookHint')"
:error="validationErrors.notification.SYNOLOGYCHAT_WEBHOOK"
:error-messages="
validationErrors.notification.SYNOLOGYCHAT_WEBHOOK
? [t('notification.synologychat.webhookRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-webhook"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.SYNOLOGYCHAT_TOKEN"
:label="t('notification.synologychat.token')"
:hint="t('notification.synologychat.tokenHint')"
persistent-hint
prepend-inner-icon="mdi-key"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.notification.type === 'vocechat'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.VOCECHAT_HOST"
:label="t('notification.vocechat.host')"
:hint="t('notification.vocechat.hostHint')"
:error="validationErrors.notification.VOCECHAT_HOST"
:error-messages="
validationErrors.notification.VOCECHAT_HOST ? [t('notification.vocechat.hostRequired')] : []
"
persistent-hint
prepend-inner-icon="mdi-server"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.VOCECHAT_API_KEY"
:label="t('notification.vocechat.apiKey')"
:hint="t('notification.vocechat.apiKeyHint')"
:error="validationErrors.notification.VOCECHAT_API_KEY"
:error-messages="
validationErrors.notification.VOCECHAT_API_KEY
? [t('notification.vocechat.apiKeyRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-key"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.VOCECHAT_CHANNEL_ID"
:label="t('notification.vocechat.channelId')"
:placeholder="t('notification.vocechat.channelIdPlaceholder')"
:hint="t('notification.vocechat.channelIdHint')"
persistent-hint
prepend-inner-icon="mdi-pound"
/>
</VCol>
</VRow>
<VRow v-else-if="wizardData.notification.type === 'webpush'">
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:placeholder="t('notification.name')"
:hint="t('notification.nameHint')"
:error="validationErrors.notification.name"
:error-messages="validationErrors.notification.name ? [t('notification.nameRequired')] : []"
persistent-hint
prepend-inner-icon="mdi-label"
required
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.config.WEBPUSH_USERNAME"
:label="t('notification.webpush.username')"
:hint="t('notification.webpush.usernameHint')"
:error="validationErrors.notification.WEBPUSH_USERNAME"
:error-messages="
validationErrors.notification.WEBPUSH_USERNAME
? [t('notification.webpush.usernameRequired')]
: []
"
persistent-hint
prepend-inner-icon="mdi-account"
required
/>
</VCol>
</VRow>
<VRow v-else>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.type"
:label="t('notification.type')"
:hint="t('notification.customTypeHint')"
persistent-hint
active
prepend-inner-icon="mdi-cog"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="wizardData.notification.name"
:label="t('notification.name')"
:hint="t('notification.nameRequired')"
persistent-hint
prepend-inner-icon="mdi-label"
/>
</VCol>
</VRow>
</VForm>
</VCardText>
</VCard>
</VCol>
</VRow>
</VCardText>
</VCard>
</template>
<style scoped>
.cursor-pointer {
cursor: pointer;
transition: all 0.2s ease;
}
.cursor-pointer:hover {
box-shadow: 0 4px 12px rgba(0, 0, 0, 15%);
transform: translateY(-2px);
}
.cursor-pointer:active {
transform: translateY(0);
}
/* 选中状态的样式 */
.v-card--variant-tonal.v-theme--light {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.12);
}
.v-card--variant-tonal.v-theme--dark {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.2);
}
</style>

View File

@@ -0,0 +1,279 @@
<script lang="ts" setup>
import { ref, computed, onMounted } from 'vue'
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
import api from '@/api'
const { t } = useI18n()
const { updatePreferences } = useSetupWizard()
// 个性化选项
const personalizationOptions = ref({
excludeDolbyVision: true, // 排除杜比视界
excludeBluray: true, // 排除蓝光原盘
})
// 预设配置 - 使用多语言
const presetConfigs = computed(() => ({
'4k-enthusiast': {
name: t('setupWizard.preferences.presets.4k-enthusiast.name'),
description: t('setupWizard.preferences.presets.4k-enthusiast.description'),
icon: 'mdi-4k',
color: 'primary',
ruleString:
' SPECSUB & 4K & 60FPS & UHD & !BLU & !DOLBY > CNSUB & 4K & 60FPS & UHD & !BLU & !DOLBY > 4K & 60FPS & UHD & !BLU & !DOLBY > SPECSUB & 4K & UHD & !BLU & !DOLBY > CNSUB & 4K & UHD & !BLU & !DOLBY > 4K & UHD & !BLU & !DOLBY > SPECSUB & 4K & !BLU & !DOLBY > CNSUB & 4K & !BLU & !DOLBY > 4K & !BLU & !DOLBY ',
},
'balanced': {
name: t('setupWizard.preferences.presets.balanced.name'),
description: t('setupWizard.preferences.presets.balanced.description'),
icon: 'mdi-scale-unbalanced',
color: 'success',
ruleString:
' SPECSUB & 4K & !BLU & !DOLBY & !UHD & !60FPS > CNSUB & 4K & !BLU & !DOLBY & !REMUX & !60FPS > SPECSUB & 1080P & !BLU & !DOLBY & !60FPS & !UHD > CNSUB & 1080P & !BLU & !DOLBY & !UHD & !60FPS > 4K & BLU & !DOLBY & !UHD & !60FPS > 1080P & !BLU & !DOLBY & !UHD & !60FPS ',
},
'space-saver': {
name: t('setupWizard.preferences.presets.space-saver.name'),
description: t('setupWizard.preferences.presets.space-saver.description'),
icon: 'mdi-harddisk',
color: 'warning',
ruleString:
' SPECSUB & 1080P & !BLU & !UHD & !60FPS & !DOLBY > CNSUB & 1080P & !BLU & !UHD & !60FPS & !DOLBY > 1080P & !BLU & !UHD & !60FPS & !DOLBY > !BLU & !UHD & !60FPS & !DOLBY ',
},
'free-priority': {
name: t('setupWizard.preferences.presets.free-priority.name'),
description: t('setupWizard.preferences.presets.free-priority.description'),
icon: 'mdi-gift',
color: 'info',
ruleString:
' SPECSUB & FREE & !BLU & !DOLBY > CNSUB & FREE & !BLU & !DOLBY > FREE & !BLU & !DOLBY > !BLU & !DOLBY ',
},
}))
// 当前选中的预设
const selectedPreset = ref('')
// 加载用户当前的规则组设置
async function loadUserFilterRuleGroups() {
try {
const result: { [key: string]: any } = await api.get('system/setting/UserFilterRuleGroups')
if (result.success && result.data?.value && result.data.value.length > 0) {
const userRuleGroups = result.data.value
// 查找匹配的预设
for (const [presetKey, preset] of Object.entries(presetConfigs.value)) {
const matchingRule = userRuleGroups.find((rule: any) => rule.name === preset.name)
if (matchingRule) {
selectedPreset.value = presetKey
// 分析规则字符串,判断个性化选项
const ruleString = matchingRule.rule_string || ''
personalizationOptions.value.excludeDolbyVision = ruleString.includes('!DOLBY')
personalizationOptions.value.excludeBluray = ruleString.includes('!BLU')
// 更新向导数据
updateWizardData()
break
}
}
}
} catch (error) {
console.log('Load user filter rule groups failed:', error)
}
}
// 选择预设
function selectPreset(presetKey: string) {
if (selectedPreset.value === presetKey) {
// 如果再次点击同一个预设,则取消选择
selectedPreset.value = ''
return
}
selectedPreset.value = presetKey
updateWizardData()
}
// 生成规则序列的逻辑
const generateRuleSequences = computed(() => {
if (!selectedPreset.value) {
return []
}
const preset = presetConfigs.value[selectedPreset.value as keyof typeof presetConfigs.value]
if (!preset) {
return []
}
let ruleString = preset.ruleString
// 根据个性化选项调整规则
if (!personalizationOptions.value.excludeDolbyVision) {
// 移除所有 !DOLBY 条件
ruleString = ruleString.replace(/ & !DOLBY/g, '').replace(/!DOLBY & /g, '')
}
if (!personalizationOptions.value.excludeBluray) {
// 移除所有 !BLU 条件
ruleString = ruleString.replace(/ & !BLU/g, '').replace(/!BLU & /g, '')
}
return [
{
name: preset.name,
rule_string: ruleString,
media_type: '',
category: '',
},
]
})
// 监听偏好变化更新到wizardData
function updateWizardData() {
if (updatePreferences) {
updatePreferences(personalizationOptions.value, generateRuleSequences.value)
}
}
// 组件挂载时加载用户设置
onMounted(() => {
loadUserFilterRuleGroups()
})
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.preferences.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.preferences.description') }}</p>
</div>
<!-- 快速预设 -->
<VCard class="mb-6">
<VCardTitle class="text-h6 d-flex align-center">
<VIcon icon="mdi-flash" class="me-2" />
{{ t('setupWizard.preferences.quickPresets') }}
</VCardTitle>
<VCardText>
<p class="text-body-2 text-medium-emphasis mb-4">{{ t('setupWizard.preferences.quickPresetsDesc') }}</p>
<VRow>
<VCol v-for="(preset, key) in presetConfigs" :key="key" cols="12" sm="6" md="3">
<VCard
:color="selectedPreset === key ? preset.color : 'default'"
:variant="selectedPreset === key ? 'tonal' : 'outlined'"
class="cursor-pointer preset-card"
@click="selectPreset(key)"
>
<VCardText class="text-center pa-4">
<VIcon :icon="preset.icon" size="40" class="mb-3" />
<div class="text-h6 mb-2">{{ preset.name }}</div>
<div class="text-body-2 text-medium-emphasis">{{ preset.description }}</div>
</VCardText>
</VCard>
</VCol>
</VRow>
</VCardText>
</VCard>
<!-- 个性化选项 -->
<VCard class="mb-6">
<VCardTitle class="text-h6 d-flex align-center">
<VIcon icon="mdi-cog" class="me-2" />
{{ t('setupWizard.preferences.personalizationOptions') }}
</VCardTitle>
<VCardText>
<p class="text-body-2 text-medium-emphasis mb-4">
{{ t('setupWizard.preferences.personalizationOptionsDesc') }}
</p>
<VRow>
<VCol cols="12" md="6">
<VSwitch
v-model="personalizationOptions.excludeDolbyVision"
:label="t('setupWizard.preferences.excludeDolbyVision')"
color="primary"
hide-details
@change="updateWizardData"
/>
<p class="text-caption text-medium-emphasis mt-1">
{{ t('setupWizard.preferences.excludeDolbyVisionHint') }}
</p>
</VCol>
<VCol cols="12" md="6">
<VSwitch
v-model="personalizationOptions.excludeBluray"
:label="t('setupWizard.preferences.excludeBluray')"
color="primary"
hide-details
@change="updateWizardData"
/>
<p class="text-caption text-medium-emphasis mt-1">{{ t('setupWizard.preferences.excludeBlurayHint') }}</p>
</VCol>
</VRow>
</VCardText>
</VCard>
</VCardText>
</VCard>
</template>
<style scoped>
.cursor-pointer {
cursor: pointer;
transition: all 0.3s ease;
}
.preset-card:hover {
box-shadow: 0 8px 25px rgba(0, 0, 0, 15%);
transform: translateY(-4px);
}
.preset-card:active {
transform: translateY(-2px);
}
/* 预设卡片选中状态的样式 */
.v-card--variant-tonal.v-theme--light {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.12);
}
.v-card--variant-tonal.v-theme--dark {
border: 2px solid rgb(var(--v-theme-primary));
background-color: rgb(var(--v-theme-primary), 0.2);
}
/* 规则代码样式 */
.v-code {
padding: 12px;
border-radius: 8px;
background-color: rgba(var(--v-theme-surface-variant), 0.3);
font-family: 'JetBrains Mono', 'Fira Code', Consolas, monospace;
font-size: 0.875rem;
line-height: 1.5;
white-space: pre-wrap;
word-break: break-all;
}
/* 展开面板样式 */
.v-expansion-panel-title {
font-weight: 500;
}
.v-expansion-panel-text {
padding-block-start: 16px;
}
/* 开关组件样式优化 */
.v-switch {
margin-block-end: 8px;
}
/* 芯片组样式 */
.v-chip-group {
gap: 8px;
}
.v-chip {
margin-block: 4px;
margin-inline: 0;
}
</style>

View File

@@ -0,0 +1,94 @@
<script lang="ts" setup>
import { useI18n } from 'vue-i18n'
import { useSetupWizard } from '@/composables/useSetupWizard'
const { t } = useI18n()
const { wizardData, validateCurrentStep } = useSetupWizard()
// 验证状态
const validation = computed(() => validateCurrentStep())
const hasErrors = computed(() => !validation.value.isValid)
// 整理方式选项
const transferTypeItems = [
{ title: '硬链接', value: 'link' },
{ title: '软链接', value: 'softlink' },
{ title: '复制', value: 'copy' },
{ title: '移动', value: 'move' },
]
// 覆盖模式选项
const overwriteModeItems = [
{ title: '从不覆盖', value: 'never' },
{ title: '总是覆盖', value: 'always' },
{ title: '按文件大小', value: 'size' },
{ title: '仅保留最新', value: 'latest' },
]
</script>
<template>
<VCard variant="outlined">
<VCardText>
<div class="text-center mb-6">
<h3 class="text-h4 mb-2">{{ t('setupWizard.storage.title') }}</h3>
<p class="text-body-1 text-medium-emphasis">{{ t('setupWizard.storage.description') }}</p>
</div>
<VRow>
<VCol cols="12">
<VAlert type="info" variant="tonal" class="mb-4">
<VAlertTitle>{{ t('setupWizard.storage.info') }}</VAlertTitle>
{{ t('setupWizard.storage.infoDesc') }}
</VAlert>
</VCol>
<VCol cols="12" md="6">
<VPathField
v-model="wizardData.storage.downloadPath"
:label="t('setupWizard.storage.downloadPath')"
:hint="t('setupWizard.storage.downloadPathHint')"
persistent-hint
prepend-inner-icon="mdi-download"
placeholder="/downloads"
:error="!wizardData.storage.downloadPath && hasErrors"
:error-messages="
!wizardData.storage.downloadPath && hasErrors ? [t('setupWizard.storage.downloadPathRequired')] : []
"
/>
</VCol>
<VCol cols="12" md="6">
<VPathField
v-model="wizardData.storage.libraryPath"
:label="t('setupWizard.storage.libraryPath')"
:hint="t('setupWizard.storage.libraryPathHint')"
persistent-hint
prepend-inner-icon="mdi-folder-multiple"
placeholder="/media"
:error="!wizardData.storage.libraryPath && hasErrors"
:error-messages="
!wizardData.storage.libraryPath && hasErrors ? [t('setupWizard.storage.libraryPathRequired')] : []
"
/>
</VCol>
<VCol cols="12" md="6">
<VSelect
v-model="wizardData.storage.transferType"
:label="t('directory.transferType')"
:hint="t('directory.transferTypeHint')"
persistent-hint
:items="transferTypeItems"
prepend-inner-icon="mdi-swap-horizontal"
/>
</VCol>
<VCol cols="12" md="6">
<VSelect
v-model="wizardData.storage.overwriteMode"
:label="t('directory.overwriteMode')"
:hint="t('directory.overwriteModeHint')"
persistent-hint
:items="overwriteModeItems"
prepend-inner-icon="mdi-file-replace"
/>
</VCol>
</VRow>
</VCardText>
</VCard>
</template>

View File

@@ -120,8 +120,9 @@ async function getSubscribes() {
loading.value = true
const subscribes: Subscribe[] = await api.get('subscribe/')
loading.value = false
const subEvents = await Promise.all(subscribes.map(async sub => eventsHander(sub)))
calendarOptions.value.events = subEvents.flat().filter(event => event.start) as EventSourceInput
const subEvents = await Promise.allSettled(subscribes.map(async sub => eventsHander(sub)))
const succEvents = subEvents.filter(result => result.status === 'fulfilled').map(result => result.value)
calendarOptions.value.events = succEvents.flat().filter(event => event.start) as EventSourceInput
isLoaded.value = true
} catch (error) {
console.error(error)

View File

@@ -34,13 +34,104 @@ const isRefreshed = ref(false)
const dataList = ref<MediaInfo[]>([])
const currData = ref<MediaInfo[]>([])
// 筛选参数
const filterParams = reactive({
genre_id: '', // 空字符串表示选中"全部"
min_rating: 0,
max_rating: 10,
min_sub: 1,
sort_type: 'count', // 默认按热度排序
})
// 当前Key用于重新加载数据
const currentKey = ref(0)
// TMDB电影风格字典
const tmdbMovieGenreDict: Record<string, string> = {
'28': t('tmdb.genreType.action'),
'12': t('tmdb.genreType.adventure'),
'16': t('tmdb.genreType.animation'),
'35': t('tmdb.genreType.comedy'),
'80': t('tmdb.genreType.crime'),
'99': t('tmdb.genreType.documentary'),
'18': t('tmdb.genreType.drama'),
'10751': t('tmdb.genreType.family'),
'14': t('tmdb.genreType.fantasy'),
'36': t('tmdb.genreType.history'),
'27': t('tmdb.genreType.horror'),
'10402': t('tmdb.genreType.music'),
'9648': t('tmdb.genreType.mystery'),
'10749': t('tmdb.genreType.romance'),
'878': t('tmdb.genreType.scienceFiction'),
'10770': t('tmdb.genreType.tvMovie'),
'53': t('tmdb.genreType.thriller'),
'10752': t('tmdb.genreType.war'),
'37': t('tmdb.genreType.western'),
}
// TMDB电视剧风格字典
const tmdbTvGenreDict: Record<string, string> = {
'10759': t('tmdb.genreType.actionAdventure'),
'16': t('tmdb.genreType.animation'),
'35': t('tmdb.genreType.comedy'),
'80': t('tmdb.genreType.crime'),
'99': t('tmdb.genreType.documentary'),
'18': t('tmdb.genreType.drama'),
'10751': t('tmdb.genreType.family'),
'10762': t('tmdb.genreType.kids'),
'9648': t('tmdb.genreType.mystery'),
'10763': t('tmdb.genreType.news'),
'10764': t('tmdb.genreType.reality'),
'10765': t('tmdb.genreType.sciFiFantasy'),
'10766': t('tmdb.genreType.soap'),
'10767': t('tmdb.genreType.talk'),
'10768': t('tmdb.genreType.warPolitics'),
'37': t('tmdb.genreType.western'),
}
// 获取当前类型对应的风格字典
const currentGenreDict = computed(() => {
return props.type === '电影' ? tmdbMovieGenreDict : tmdbTvGenreDict
})
// 监听筛选参数变化
watch(
filterParams,
() => {
// 重置数据
dataList.value = []
page.value = 1
isRefreshed.value = false
currentKey.value++
},
{ deep: true },
)
// 拼装参数
function getParams() {
let params = {
let params: { [key: string]: any } = {
stype: props.type,
page: page.value,
count: 30,
}
// 添加筛选参数
if (filterParams.genre_id) {
params.genre_id = parseInt(filterParams.genre_id)
}
if (filterParams.min_rating > 0) {
params.min_rating = filterParams.min_rating
}
if (filterParams.max_rating < 10) {
params.max_rating = filterParams.max_rating
}
if (filterParams.min_sub > 1) {
params.min_sub = filterParams.min_sub
}
if (filterParams.sort_type) {
params.sort_type = filterParams.sort_type
}
return params
}
@@ -110,8 +201,77 @@ async function fetchData({ done }: { done: any }) {
</script>
<template>
<!-- 筛选器 -->
<div class="px-3 mb-4">
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.sort') }}</VLabel>
</div>
<VChipGroup v-model="filterParams.sort_type">
<VChip :color="filterParams.sort_type == 'time' ? 'primary' : ''" filter tile value="time">
{{ t('tmdb.sortType.time') }}
</VChip>
<VChip :color="filterParams.sort_type == 'count' ? 'primary' : ''" filter tile value="count">
{{ t('tmdb.sortType.count') }}
</VChip>
<VChip :color="filterParams.sort_type == 'rating' ? 'primary' : ''" filter tile value="rating">
{{ t('tmdb.sortType.rating') }}
</VChip>
</VChipGroup>
</div>
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.genre') }}</VLabel>
</div>
<VChipGroup v-model="filterParams.genre_id">
<VChip
:color="filterParams.genre_id == '' ? 'primary' : ''"
filter
tile
value=""
>
{{ t('common.all') }}
</VChip>
<VChip
:color="filterParams.genre_id == key ? 'primary' : ''"
filter
tile
:value="key"
v-for="(value, key) in currentGenreDict"
:key="key"
>
{{ value }}
</VChip>
</VChipGroup>
</div>
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.rating') }}</VLabel>
</div>
<VSlider
v-model="filterParams.min_rating"
thumb-label
max="10"
min="0"
:step="1"
class="align-center"
hide-details
>
</VSlider>
</div>
</div>
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
<VInfiniteScroll mode="intersect" side="end" :items="dataList" class="overflow-visible px-2" @load="fetchData">
<VInfiniteScroll
mode="intersect"
side="end"
:items="dataList"
class="overflow-visible px-2"
@load="fetchData"
:key="currentKey"
>
<template #loading />
<template #empty />
<div v-if="dataList.length > 0" class="grid gap-4 grid-media-card" tabindex="0">

View File

@@ -28,6 +28,66 @@ const page = ref(1)
// 搜索关键字
const keyword = ref(props.keyword)
// 筛选参数
const filterParams = reactive({
genre_id: '', // 空字符串表示选中"全部"
min_rating: 0,
max_rating: 10,
sort_type: 'time', // 默认按时间排序
})
// 当前Key用于重新加载数据
const currentKey = ref(0)
// TMDB电影风格字典
const tmdbMovieGenreDict: Record<string, string> = {
'28': t('tmdb.genreType.action'),
'12': t('tmdb.genreType.adventure'),
'16': t('tmdb.genreType.animation'),
'35': t('tmdb.genreType.comedy'),
'80': t('tmdb.genreType.crime'),
'99': t('tmdb.genreType.documentary'),
'18': t('tmdb.genreType.drama'),
'10751': t('tmdb.genreType.family'),
'14': t('tmdb.genreType.fantasy'),
'36': t('tmdb.genreType.history'),
'27': t('tmdb.genreType.horror'),
'10402': t('tmdb.genreType.music'),
'9648': t('tmdb.genreType.mystery'),
'10749': t('tmdb.genreType.romance'),
'878': t('tmdb.genreType.scienceFiction'),
'10770': t('tmdb.genreType.tvMovie'),
'53': t('tmdb.genreType.thriller'),
'10752': t('tmdb.genreType.war'),
'37': t('tmdb.genreType.western'),
}
// TMDB电视剧风格字典
const tmdbTvGenreDict: Record<string, string> = {
'10759': t('tmdb.genreType.actionAdventure'),
'16': t('tmdb.genreType.animation'),
'35': t('tmdb.genreType.comedy'),
'80': t('tmdb.genreType.crime'),
'99': t('tmdb.genreType.documentary'),
'18': t('tmdb.genreType.drama'),
'10751': t('tmdb.genreType.family'),
'10762': t('tmdb.genreType.kids'),
'9648': t('tmdb.genreType.mystery'),
'10763': t('tmdb.genreType.news'),
'10764': t('tmdb.genreType.reality'),
'10765': t('tmdb.genreType.sciFiFantasy'),
'10766': t('tmdb.genreType.soap'),
'10767': t('tmdb.genreType.talk'),
'10768': t('tmdb.genreType.warPolitics'),
'37': t('tmdb.genreType.western'),
}
// 获取当前类型对应的风格字典(订阅分享包含电影和电视剧,所以显示所有风格)
const currentGenreDict = computed(() => {
// 合并电影和电视剧风格字典
return { ...tmdbMovieGenreDict, ...tmdbTvGenreDict }
})
// 监听 props.keyword 变化
watch(
() => props.keyword,
@@ -37,9 +97,23 @@ watch(
page.value = 1
dataList.value = []
isRefreshed.value = false
currentKey.value++
},
)
// 监听筛选参数变化
watch(
filterParams,
() => {
// 重置数据
dataList.value = []
page.value = 1
isRefreshed.value = false
currentKey.value++
},
{ deep: true },
)
// 是否加载中
const loading = ref(false)
@@ -52,11 +126,26 @@ const currData = ref<SubscribeShare[]>([])
// 拼装参数
function getParams() {
let params = {
let params: { [key: string]: any } = {
page: page.value,
count: 30,
name: keyword.value,
}
// 添加筛选参数
if (filterParams.genre_id) {
params.genre_id = parseInt(filterParams.genre_id)
}
if (filterParams.min_rating > 0) {
params.min_rating = filterParams.min_rating
}
if (filterParams.max_rating < 10) {
params.max_rating = filterParams.max_rating
}
if (filterParams.sort_type) {
params.sort_type = filterParams.sort_type
}
return params
}
@@ -131,9 +220,78 @@ function removeData(id: number) {
</script>
<template>
<!-- 筛选器 -->
<div class="px-3 mb-4">
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.sort') }}</VLabel>
</div>
<VChipGroup v-model="filterParams.sort_type">
<VChip :color="filterParams.sort_type == 'time' ? 'primary' : ''" filter tile value="time">
{{ t('tmdb.sortType.time') }}
</VChip>
<VChip :color="filterParams.sort_type == 'count' ? 'primary' : ''" filter tile value="count">
{{ t('tmdb.sortType.count') }}
</VChip>
<VChip :color="filterParams.sort_type == 'rating' ? 'primary' : ''" filter tile value="rating">
{{ t('tmdb.sortType.rating') }}
</VChip>
</VChipGroup>
</div>
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.genre') }}</VLabel>
</div>
<VChipGroup v-model="filterParams.genre_id">
<VChip
:color="filterParams.genre_id == '' ? 'primary' : ''"
filter
tile
value=""
>
{{ t('common.all') }}
</VChip>
<VChip
:color="filterParams.genre_id == key ? 'primary' : ''"
filter
tile
:value="key"
v-for="(value, key) in currentGenreDict"
:key="key"
>
{{ value }}
</VChip>
</VChipGroup>
</div>
<div class="flex justify-start align-center mb-3">
<div class="mr-5">
<VLabel>{{ t('tmdb.rating') }}</VLabel>
</div>
<VSlider
v-model="filterParams.min_rating"
thumb-label
max="10"
min="0"
:step="1"
class="align-center"
hide-details
>
</VSlider>
</div>
</div>
<VPageContentTitle v-if="keyword" :title="`${t('common.search')}${keyword}`" />
<LoadingBanner v-if="!isRefreshed" class="mt-12" />
<VInfiniteScroll mode="intersect" side="end" :items="dataList" class="overflow-visible px-2" @load="fetchData">
<VInfiniteScroll
mode="intersect"
side="end"
:items="dataList"
class="overflow-visible px-2"
@load="fetchData"
:key="currentKey"
>
<template #loading />
<template #empty />
<div v-if="dataList.length > 0" class="grid gap-4 grid-subscribe-card" tabindex="0">

View File

@@ -232,64 +232,91 @@ onMounted(() => {
</script>
<template>
<VCard>
<VCardItem>
<VCardTitle>{{ t('setting.cache.title') }}</VCardTitle>
<VCardSubtitle>{{ t('setting.cache.subtitle') }}</VCardSubtitle>
<div>
<!-- 工具栏统计信息和操作按钮 -->
<VCard class="mb-4">
<VCardItem>
<!-- 移动端垂直布局桌面端水平布局 -->
<div class="d-flex flex-column flex-md-row align-center justify-space-between w-100 gap-4">
<!-- 左侧统计信息 -->
<div class="d-flex align-center justify-center justify-md-start gap-2 gap-md-6 w-100 w-md-auto">
<!-- 统计信息卡片 -->
<div class="d-flex gap-2 gap-md-4 flex-wrap justify-center justify-md-start">
<VCard variant="tonal" color="primary" class="pa-2 pa-md-3 flex-grow-1 flex-md-grow-0" style="min-width: 120px;">
<div class="d-flex align-center gap-2">
<VIcon color="primary" size="small">mdi-database</VIcon>
<div>
<div class="text-h6 text-md-h6 font-weight-bold">{{ cacheData.count }}</div>
<div class="text-caption text-medium-emphasis">{{ t('setting.cache.totalCount') }}</div>
</div>
</div>
</VCard>
<template #append>
<div class="d-flex gap-2">
<VBtn icon color="primary" :loading="loading" @click="refreshCache">
<VIcon>mdi-refresh</VIcon>
<VTooltip activator="parent" location="bottom">{{ t('setting.cache.refresh') }}</VTooltip>
</VBtn>
<VCard variant="tonal" color="success" class="pa-2 pa-md-3 flex-grow-1 flex-md-grow-0" style="min-width: 120px;">
<div class="d-flex align-center gap-2">
<VIcon color="success" size="small">mdi-web</VIcon>
<div>
<div class="text-h6 text-md-h6 font-weight-bold">{{ cacheData.sites }}</div>
<div class="text-caption text-medium-emphasis">{{ t('setting.cache.siteCount') }}</div>
</div>
</div>
</VCard>
</div>
</div>
<VBtn
icon
color="warning"
:loading="loading"
:disabled="selectedItems.length === 0"
@click="deleteSelectedItems"
>
<VIcon>mdi-delete-sweep</VIcon>
<VTooltip activator="parent" location="bottom"
>{{ t('setting.cache.deleteSelected') }} ({{ selectedItems.length }})</VTooltip
<!-- 右侧操作按钮 -->
<div class="d-flex gap-1 gap-md-2 flex-wrap justify-center justify-md-end">
<VBtn icon color="primary" :loading="loading" @click="refreshCache" size="small">
<VIcon size="small">mdi-refresh</VIcon>
<VTooltip activator="parent" location="bottom">{{ t('setting.cache.refresh') }}</VTooltip>
</VBtn>
<VBtn
icon
color="warning"
:loading="loading"
:disabled="selectedItems.length === 0"
@click="deleteSelectedItems"
size="small"
>
</VBtn>
<VIcon size="small">mdi-delete-sweep</VIcon>
<VTooltip activator="parent" location="bottom"
>{{ t('setting.cache.deleteSelected') }} ({{ selectedItems.length }})</VTooltip
>
</VBtn>
<VBtn icon color="error" :loading="loading" @click="clearAllCache">
<VIcon>mdi-delete-variant</VIcon>
<VTooltip activator="parent" location="bottom">{{ t('setting.cache.clearAll') }}</VTooltip>
</VBtn>
<VBtn icon color="error" :loading="loading" @click="clearAllCache" size="small">
<VIcon size="small">mdi-delete-variant</VIcon>
<VTooltip activator="parent" location="bottom">{{ t('setting.cache.clearAll') }}</VTooltip>
</VBtn>
</div>
</div>
</template>
</VCardItem>
</VCardItem>
</VCard>
<!-- 筛选框 -->
<VCardText>
<VRow>
<VCol cols="6">
<VTextField
v-model="titleFilter"
:label="t('setting.cache.filterByTitle')"
prepend-inner-icon="mdi-magnify"
clearable
density="compact"
/>
</VCol>
<VCol cols="6">
<VAutocomplete
v-model="siteFilter"
:label="t('setting.cache.filterBySite')"
:items="siteOptions"
prepend-inner-icon="mdi-web"
clearable
density="compact"
:placeholder="t('setting.cache.selectSite')"
/>
</VCol>
</VRow>
</VCardText>
<VRow class="mb-4">
<VCol cols="6">
<VTextField
v-model="titleFilter"
:label="t('setting.cache.filterByTitle')"
prepend-inner-icon="mdi-magnify"
clearable
density="compact"
/>
</VCol>
<VCol cols="6">
<VAutocomplete
v-model="siteFilter"
:label="t('setting.cache.filterBySite')"
:items="siteOptions"
prepend-inner-icon="mdi-web"
clearable
density="compact"
:placeholder="t('setting.cache.selectSite')"
/>
</VCol>
</VRow>
<!-- 缓存列表 -->
<VDataTable
@@ -419,54 +446,54 @@ onMounted(() => {
</div>
</template>
</VDataTable>
</VCard>
<!-- 重新识别对话框 -->
<VDialog v-model="reidentifyDialog" scrollable max-width="35rem">
<VCard>
<VCardItem class="py-2">
<template #prepend>
<VIcon>mdi-text-recognition</VIcon>
</template>
<VCardTitle>{{ t('setting.cache.reidentifyDialog.title') }}</VCardTitle>
<VCardSubtitle>{{ currentReidentifyItem?.title }}</VCardSubtitle>
</VCardItem>
<VDialogCloseBtn @click="reidentifyDialog = false" />
<VDivider />
<VCardText>
<VRow>
<VCol cols="12">
<VTextField
v-if="globalSettings.RECOGNIZE_SOURCE === 'themoviedb'"
v-model="tmdbId"
:label="t('setting.cache.reidentifyDialog.tmdbId')"
:hint="t('setting.cache.reidentifyDialog.tmdbIdHint')"
clearable
prepend-inner-icon="mdi-id-card"
persistent-hint
/>
<VTextField
v-else
v-model="doubanId"
:label="t('setting.cache.reidentifyDialog.doubanId')"
:hint="t('setting.cache.reidentifyDialog.doubanIdHint')"
clearable
prepend-inner-icon="mdi-id-card"
persistent-hint
/>
</VCol>
</VRow>
<VAlert type="info" variant="tonal" class="mt-4">
{{ t('setting.cache.reidentifyDialog.autoHint') }}
</VAlert>
</VCardText>
<!-- 重新识别对话框 -->
<VDialog v-model="reidentifyDialog" scrollable max-width="35rem">
<VCard>
<VCardItem class="py-2">
<template #prepend>
<VIcon>mdi-text-recognition</VIcon>
</template>
<VCardTitle>{{ t('setting.cache.reidentifyDialog.title') }}</VCardTitle>
<VCardSubtitle>{{ currentReidentifyItem?.title }}</VCardSubtitle>
</VCardItem>
<VDialogCloseBtn @click="reidentifyDialog = false" />
<VDivider />
<VCardText>
<VRow>
<VCol cols="12">
<VTextField
v-if="globalSettings.RECOGNIZE_SOURCE === 'themoviedb'"
v-model="tmdbId"
:label="t('setting.cache.reidentifyDialog.tmdbId')"
:hint="t('setting.cache.reidentifyDialog.tmdbIdHint')"
clearable
prepend-inner-icon="mdi-id-card"
persistent-hint
/>
<VTextField
v-else
v-model="doubanId"
:label="t('setting.cache.reidentifyDialog.doubanId')"
:hint="t('setting.cache.reidentifyDialog.doubanIdHint')"
clearable
prepend-inner-icon="mdi-id-card"
persistent-hint
/>
</VCol>
</VRow>
<VAlert type="info" variant="tonal" class="mt-4">
{{ t('setting.cache.reidentifyDialog.autoHint') }}
</VAlert>
</VCardText>
<VCardActions>
<VSpacer />
<VBtn color="primary" :loading="loading" prepend-icon="mdi-check" @click="performReidentify">
{{ t('setting.cache.reidentifyDialog.confirm') }}
</VBtn>
</VCardActions>
</VCard>
</VDialog>
<VCardActions>
<VSpacer />
<VBtn color="primary" :loading="loading" prepend-icon="mdi-check" @click="performReidentify">
{{ t('setting.cache.reidentifyDialog.confirm') }}
</VBtn>
</VCardActions>
</VCard>
</VDialog>
</div>
</template>

View File

@@ -1,14 +1,7 @@
<script setup lang="ts">
import api from '@/api'
import douban from '@images/logos/douban.png'
import github from '@images/logos/github.png'
import slack from '@images/logos/slack.webp'
import telegram from '@images/logos/telegram.webp'
import tmdb from '@images/logos/tmdb.png'
import wechat from '@images/logos/wechat.png'
import fanart from '@images/logos/fanart.webp'
import { getLogoUrl } from '@/utils/imageUtils'
import tvdb from '@images/logos/thetvdb.jpeg'
import python from '@images/logos/python.png'
import { useI18n } from 'vue-i18n'
// 国际化
@@ -36,7 +29,7 @@ interface Address {
// 测试集
const targets = ref<Address[]>([
{
image: tmdb,
image: getLogoUrl('tmdb'),
name: 'api.themoviedb.org',
url: 'https://api.themoviedb.org/3/movie/550?api_key={TMDBAPIKEY}',
proxy: true,
@@ -46,7 +39,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: tmdb,
image: getLogoUrl('tmdb'),
name: 'api.tmdb.org',
url: 'https://api.tmdb.org/3/movie/550?api_key={TMDBAPIKEY}',
proxy: true,
@@ -56,7 +49,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: tmdb,
image: getLogoUrl('tmdb'),
name: 'www.themoviedb.org',
url: 'https://www.themoviedb.org',
proxy: true,
@@ -76,7 +69,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: fanart,
image: getLogoUrl('fanart'),
name: 'webservice.fanart.tv',
url: 'https://webservice.fanart.tv',
proxy: true,
@@ -86,7 +79,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: telegram,
image: getLogoUrl('telegram'),
name: 'api.telegram.org',
url: 'https://api.telegram.org',
proxy: true,
@@ -96,7 +89,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: wechat,
image: getLogoUrl('wechat'),
name: 'qyapi.weixin.qq.com',
url: 'https://qyapi.weixin.qq.com/cgi-bin/gettoken',
proxy: false,
@@ -106,7 +99,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: douban,
image: getLogoUrl('douban'),
name: 'frodo.douban.com',
url: 'https://frodo.douban.com',
proxy: false,
@@ -116,7 +109,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: slack,
image: getLogoUrl('slack'),
name: 'slack.com',
url: 'https://slack.com',
proxy: false,
@@ -126,7 +119,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: python,
image: getLogoUrl('python'),
name: 'pypi.org',
url: '{PIP_PROXY}rsa/',
proxy: true,
@@ -137,7 +130,7 @@ const targets = ref<Address[]>([
include: 'pypi:repository-version',
},
{
image: github,
image: getLogoUrl('github'),
name: 'github.com',
url: '{GITHUB_PROXY}https://github.com/jxxghp/MoviePilot/blob/v2/README.md',
proxy: true,
@@ -148,7 +141,7 @@ const targets = ref<Address[]>([
include: 'MoviePilot',
},
{
image: github,
image: getLogoUrl('github'),
name: 'codeload.github.com',
url: 'https://codeload.github.com',
proxy: true,
@@ -158,7 +151,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: github,
image: getLogoUrl('github'),
name: 'api.github.com',
url: 'https://api.github.com',
proxy: true,
@@ -168,7 +161,7 @@ const targets = ref<Address[]>([
btndisable: false,
},
{
image: github,
image: getLogoUrl('github'),
name: 'raw.githubusercontent.com',
url: '{GITHUB_PROXY}https://raw.githubusercontent.com/jxxghp/MoviePilot/v2/README.md',
proxy: true,
@@ -188,7 +181,7 @@ const resolveStatusColor: Status = {
}
const abortControllers = new Set<AbortController>()
const isUnmounting = ref(false);
const isUnmounting = ref(false)
// 调用API测试网络连接
async function netTest(index: number) {
@@ -229,17 +222,16 @@ async function netTest(index: number) {
// 加载时测试所有连接
onMounted(async () => {
isUnmounting.value = false;
for (let i = 0; !isUnmounting.value && i < targets.value.length; i++)
await netTest(i)
isUnmounting.value = false
for (let i = 0; !isUnmounting.value && i < targets.value.length; i++) await netTest(i)
})
onBeforeUnmount(() => {
isUnmounting.value = true;
isUnmounting.value = true
for (const controller of abortControllers) {
controller.abort()
}
abortControllers.clear()
});
})
</script>
<template>

View File

@@ -1,4 +1,5 @@
<script lang="ts" setup>
import { bufferToBase64Url, base64UrlToUint8Array } from '@/@core/utils/navigator'
import { useToast } from 'vue-toastification'
import QrcodeVue from 'qrcode.vue'
import { VForm } from 'vuetify/lib/components/index.mjs'
@@ -10,7 +11,7 @@ import { useUserStore } from '@/stores'
import { useI18n } from 'vue-i18n'
// 国际化
const { t } = useI18n()
const { t, locale } = useI18n()
// 显示器宽度
const display = useDisplay()
@@ -67,6 +68,54 @@ const accountInfo = ref<User>({
// 二维码信息
const qrCode = ref('')
// PassKey类型
interface PassKey {
id: number
name: string
created_at: string
last_used_at?: string
aaguid?: string
transports?: string
}
// PassKey列表
const passkeyList = ref<PassKey[]>([])
// PassKey对话框
const passkeyDialog = ref(false)
// PassKey注册loading
const passkeyRegistering = ref(false)
// PassKey名称
const passkeyName = ref('')
// PassKey challenge
const passkeyChallenge = ref('')
// 双重验证菜单
const mfaMenu = ref(false)
// 密码验证对话框
const verifyPasswordDialog = ref(false)
// 验证密码
const verifyPassword = ref('')
// 验证后的回调
const verifyCallback = ref<(() => void) | null>(null)
// 验证对话框标题
const verifyTitle = ref('')
// 验证对话框提示
const verifyText = ref('')
// 检查是否已启用任何双重验证
const hasMfaEnabled = computed(() => {
return accountInfo.value.is_otp || passkeyList.value.length > 0
})
// 更新头像
function changeAvatar(file: Event) {
const fileReader = new FileReader()
@@ -116,13 +165,15 @@ async function fetchUserInfo() {
accountInfo.value.avatar = accountInfo.value.avatar ? accountInfo.value.avatar : avatar1
currentUserName.value = accountInfo.value.name
currentAvatar.value = accountInfo.value.avatar
// 同时加载PassKey列表
await fetchPassKeyList()
}
} catch (error) {
console.log(error)
}
}
// 保存户信息
// 保存户信息
async function saveAccountInfo() {
if (isSaving.value) {
$toast.error(t('profile.savingInProgress'))
@@ -197,8 +248,16 @@ async function saveAccountInfo() {
// 为当前用户获取Otp Uri
async function getOtpUri() {
// 如果已经启用OTP只打开对话框不生成新的二维码
if (accountInfo.value.is_otp) {
qrCode.value = '' // 清空二维码,这样对话框会显示清除界面
otpDialog.value = true
return
}
// 未启用OTP生成新的二维码
try {
const result: { [key: string]: any } = await api.post('user/otp/generate')
const result: { [key: string]: any } = await api.post('mfa/otp/generate')
if (result.success) {
otpUri.value = result.data.uri
secret.value = result.data.secret
@@ -212,19 +271,49 @@ async function getOtpUri() {
}
}
// 密码验证并执行回调
function withPasswordVerification(title: string, text: string, callback: () => void) {
verifyTitle.value = title
verifyText.value = text
verifyCallback.value = callback
verifyPassword.value = ''
verifyPasswordDialog.value = true
}
// 确认密码验证
async function confirmVerifyPassword() {
if (!verifyPassword.value) {
$toast.error(t('user.passwordHint'))
return
}
if (verifyCallback.value) {
verifyCallback.value()
}
verifyPasswordDialog.value = false
}
// 关闭当前用户的双重验证
async function disableOtp() {
try {
const result: { [key: string]: any } = await api.post('user/otp/disable')
if (result.success) {
accountInfo.value.is_otp = false
$toast.success(t('profile.otpDisableSuccess'))
} else {
$toast.error(t('profile.otpDisableFailed', { message: result.message }))
}
} catch (error) {
console.log(error)
if (passkeyList.value.length > 0) {
$toast.error(t('profile.otpDisableRestrictedByPasskey'))
return
}
withPasswordVerification(t('profile.disableTwoFactor'), t('profile.confirmToDisableOtp'), async () => {
try {
const result: { [key: string]: any } = await api.post('mfa/otp/disable', {
password: verifyPassword.value,
})
if (result.success) {
accountInfo.value.is_otp = false
$toast.success(t('profile.otpDisableSuccess'))
otpDialog.value = false
} else {
$toast.error(t('profile.otpDisableFailed', { message: result.message }))
}
} catch (error) {
console.log(error)
}
})
}
// 启用Otp
@@ -234,7 +323,7 @@ async function judgeOtpPassword() {
return
}
try {
const result: { [key: string]: any } = await api.post('user/otp/judge', {
const result: { [key: string]: any } = await api.post('mfa/otp/verify', {
uri: otpUri.value,
otpPassword: otpPassword.value,
})
@@ -251,6 +340,128 @@ async function judgeOtpPassword() {
}
}
// 获取PassKey列表
async function fetchPassKeyList() {
try {
const result: { [key: string]: any } = await api.get('mfa/passkey/list')
if (result.success) {
passkeyList.value = result.data || []
}
} catch (error) {
console.log(error)
}
}
// 打开PassKey注册对话框
async function openPassKeyDialog() {
passkeyName.value = ''
passkeyDialog.value = true
await fetchPassKeyList()
}
// 注册PassKey
async function registerPassKey() {
if (!passkeyName.value) {
$toast.error(t('profile.passkeyNameRequired'))
return
}
passkeyRegistering.value = true
try {
// 1. 开始注册
const startResult: { [key: string]: any } = await api.post('mfa/passkey/register/start', {
name: passkeyName.value,
})
if (!startResult.success) {
$toast.error(startResult.message || t('profile.passkeyRegisterFailed'))
passkeyRegistering.value = false
return
}
const { options, challenge } = startResult.data
const publicKeyOptions = JSON.parse(options)
passkeyChallenge.value = challenge
// 2. 调用WebAuthn API
const credential = await navigator.credentials.create({
publicKey: {
...publicKeyOptions,
challenge: base64UrlToUint8Array(publicKeyOptions.challenge),
user: {
...publicKeyOptions.user,
id: base64UrlToUint8Array(publicKeyOptions.user.id),
},
excludeCredentials: publicKeyOptions.excludeCredentials?.map((cred: any) => ({
...cred,
id: base64UrlToUint8Array(cred.id),
})),
},
})
if (!credential) {
$toast.error(t('profile.passkeyRegisterCancelled'))
return
}
// 3. 转换credential为可传输格式
const credentialJSON = {
id: credential.id,
rawId: bufferToBase64Url((credential as any).rawId),
type: credential.type,
response: {
attestationObject: bufferToBase64Url((credential as any).response.attestationObject),
clientDataJSON: bufferToBase64Url((credential as any).response.clientDataJSON),
transports: (credential as any).response.getTransports ? (credential as any).response.getTransports() : [],
},
}
// 4. 完成注册
const finishResult: { [key: string]: any } = await api.post('mfa/passkey/register/finish', {
credential: credentialJSON,
challenge: passkeyChallenge.value,
name: passkeyName.value,
})
if (finishResult.success) {
$toast.success(t('profile.passkeyRegisterSuccess'))
passkeyName.value = ''
await fetchPassKeyList()
} else {
$toast.error(finishResult.message || t('profile.passkeyRegisterFailed'))
}
} catch (error: any) {
console.error('PassKey注册失败:', error)
if (error.name === 'NotAllowedError') {
$toast.error(t('profile.passkeyRegisterCancelled'))
} else {
$toast.error(t('profile.passkeyRegisterFailed'))
}
}
passkeyRegistering.value = false
}
// 删除PassKey
async function deletePassKey(passkeyId: number) {
withPasswordVerification(t('common.delete') + t('profile.usePasskey'), t('profile.confirmToDeletePasskey'), async () => {
try {
const result: { [key: string]: any } = await api.post('mfa/passkey/delete', {
passkey_id: passkeyId,
password: verifyPassword.value,
})
if (result.success) {
$toast.success(t('profile.passkeyDeleteSuccess'))
await fetchPassKeyList()
} else {
$toast.error(result.message || t('profile.passkeyDeleteFailed'))
}
} catch (error) {
console.log(error)
$toast.error(t('profile.passkeyDeleteFailed'))
}
})
}
// 加载当前用户数据
onMounted(() => {
fetchUserInfo()
@@ -301,16 +512,42 @@ watch(
<span v-if="display.mdAndUp.value" class="ms-2">{{ t('common.default') }}</span>
</VBtn>
<VBtn
:color="accountInfo.is_otp ? 'warning' : 'success'"
variant="tonal"
@click.stop="accountInfo.is_otp ? disableOtp() : getOtpUri()"
>
<VIcon icon="mdi-account-key" />
<span v-if="display.mdAndUp.value" class="ms-2">{{
accountInfo.is_otp ? t('profile.disableTwoFactor') : t('profile.enableTwoFactor')
}}</span>
</VBtn>
<!-- 双重验证菜单按钮 -->
<VMenu v-model="mfaMenu" :close-on-content-click="false">
<template #activator="{ props }">
<VBtn
:color="hasMfaEnabled ? 'warning' : 'success'"
variant="tonal"
v-bind="props"
>
<VIcon icon="mdi-shield-key" />
<span v-if="display.mdAndUp.value" class="ms-2">
{{ hasMfaEnabled ? t('profile.setupMfa') : t('profile.enableMfa') }}
</span>
<VIcon icon="mdi-menu-down" class="ms-1" />
</VBtn>
</template>
<VList>
<VListItem @click="getOtpUri(); mfaMenu = false">
<template #prepend>
<VIcon icon="mdi-cellphone-key" />
</template>
<VListItemTitle>{{ t('profile.useAuthenticator') }}</VListItemTitle>
<VListItemSubtitle v-if="accountInfo.is_otp" class="text-success">
{{ t('profile.enabled') }}
</VListItemSubtitle>
</VListItem>
<VListItem @click="openPassKeyDialog(); mfaMenu = false">
<template #prepend>
<VIcon icon="mdi-key-variant" />
</template>
<VListItemTitle>{{ t('profile.usePasskey') }}</VListItemTitle>
<VListItemSubtitle v-if="passkeyList.length > 0" class="text-success">
{{ t('profile.keysCount', { count: passkeyList.length }) }}
</VListItemSubtitle>
</VListItem>
</VList>
</VMenu>
</div>
<p class="text-body-1 mb-0">{{ t('profile.avatarFormatTip') }}</p>
@@ -455,37 +692,201 @@ watch(
<!-- 双重验证弹窗 -->
<VDialog v-if="otpDialog" v-model="otpDialog" max-width="45rem" scrollable>
<!-- 开启双重验证弹窗内容 -->
<VCard>
<VDialogCloseBtn @click="otpDialog = false" />
<VCardText>
<h4 class="text-h4 text-center mb-6 mt-5">{{ t('profile.twoFactorAuthentication') }}</h4>
<h5 class="text-h5 font-weight-medium mb-2">{{ t('profile.authenticatorApp') }}</h5>
<p class="mb-6">
{{ t('profile.authenticatorAppDescription') }}
</p>
<div class="my-6">
<QrcodeVue class="mx-auto" :value="qrCode" :size="200" max-width="25rem" />
</div>
<VAlert :title="secret" variant="tonal" type="warning" class="my-4" :text="t('profile.secretKeyTip')">
<template #prepend />
</VAlert>
<VForm>
<VTextField
v-model="otpPassword"
type="text"
:label="t('profile.enterVerificationCode')"
autocomplete=""
class="mb-8"
variant="outlined"
prepend-inner-icon="mdi-shield-key"
/>
<!-- 如果已启用OTP显示清除界面 -->
<template v-if="accountInfo.is_otp && !qrCode">
<h4 class="text-h4 text-center mb-6 mt-5">{{ t('profile.authenticatorManagement') }}</h4>
<VAlert type="success" variant="tonal" class="mb-4">
{{ t('profile.authenticatorEnabled') }}
</VAlert>
<p class="mb-6">
{{ t('profile.clearAuthenticatorTip') }}
</p>
<div class="d-flex justify-end flex-wrap gap-4">
<VBtn variant="outlined" color="secondary" @click="otpDialog = false"> {{ t('common.cancel') }} </VBtn>
<VBtn @click="judgeOtpPassword">
<VBtn variant="outlined" color="secondary" @click="otpDialog = false">
{{ t('common.cancel') }}
</VBtn>
<VBtn color="error" @click="disableOtp(); otpDialog = false">
<template #prepend>
<VIcon icon="mdi-check" />
<VIcon icon="mdi-delete" />
</template>
{{ t('profile.clearAuthenticator') }}
</VBtn>
</div>
</template>
<!-- 设置新的OTP -->
<template v-else>
<h4 class="text-h4 text-center mb-6 mt-5">{{ t('profile.setupAuthenticator') }}</h4>
<h5 class="text-h5 font-weight-medium mb-2">{{ t('profile.authenticatorApp') }}</h5>
<p class="mb-6">
{{ t('profile.authenticatorAppDescription') }}
</p>
<div class="my-6">
<QrcodeVue class="mx-auto" :value="qrCode" :size="200" max-width="25rem" />
</div>
<VAlert :title="secret" variant="tonal" type="warning" class="my-4" :text="t('profile.secretKeyTip')">
<template #prepend />
</VAlert>
<VForm @submit.prevent="judgeOtpPassword">
<VTextField
v-model="otpPassword"
type="text"
inputmode="numeric"
autocomplete="one-time-code"
:label="t('profile.enterVerificationCode')"
class="mb-8"
variant="outlined"
prepend-inner-icon="mdi-shield-key"
/>
<div class="d-flex justify-end flex-wrap gap-4">
<VBtn variant="outlined" color="secondary" @click="otpDialog = false">
{{ t('common.cancel') }}
</VBtn>
<VBtn type="submit">
<template #prepend>
<VIcon icon="mdi-check" />
</template>
{{ t('common.confirm') }}
</VBtn>
</div>
</VForm>
</template>
</VCardText>
<VDialogCloseBtn @click="otpDialog = false" />
</VCard>
</VDialog>
<!-- PassKey管理对话框 -->
<VDialog v-if="passkeyDialog" v-model="passkeyDialog" max-width="45rem" scrollable>
<VCard>
<VCardText>
<h4 class="text-h4 text-center mb-6 mt-5">{{ t('profile.passkeyManagement') }}</h4>
<!-- 安全警告 -->
<VAlert
type="warning"
variant="tonal"
class="mb-6"
icon="mdi-alert"
>
<i18n-t keypath="profile.passkeyDomainWarning" tag="span">
<template #domain>
<b>{{ t('profile.accessDomain') }}</b>
</template>
</i18n-t>
</VAlert>
<!-- 注册新通行密钥 -->
<VCard v-if="accountInfo.is_otp" variant="tonal" class="mb-6">
<VCardText>
<h5 class="text-h5 font-weight-medium mb-2">{{ t('profile.registerNewPasskey') }}</h5>
<p class="mb-4">{{ t('profile.passkeyDescription') }}</p>
<VForm @submit.prevent="registerPassKey">
<VTextField
v-model="passkeyName"
:label="t('profile.passkeyName')"
:placeholder="t('profile.passkeyNamePlaceholder')"
class="mb-4"
variant="outlined"
prepend-inner-icon="mdi-form-textbox"
/>
<VBtn
color="primary"
type="submit"
:loading="passkeyRegistering"
prepend-icon="mdi-plus"
>
{{ t('profile.registerPasskey') }}
</VBtn>
</VForm>
</VCardText>
</VCard>
<!-- 未启用 OTP 提示 -->
<VAlert
v-else
type="error"
variant="tonal"
class="mb-6"
icon="mdi-shield-lock"
>
<i18n-t keypath="profile.otpRequiredForPasskey" tag="span">
<template #otp>
<b>{{ t('profile.otpAuthenticator') }}</b>
</template>
</i18n-t>
</VAlert>
<!-- 已注册的通行密钥列表 -->
<VCard variant="tonal">
<VCardText>
<h5 class="text-h5 font-weight-medium mb-2">{{ t('profile.registeredPasskeys') }}</h5>
<VList v-if="passkeyList.length > 0" class="mt-4">
<VListItem
v-for="passkey in passkeyList"
:key="passkey.id"
class="mb-2 py-4"
rounded="lg"
border
>
<template #prepend>
<VIcon icon="mdi-key-variant" size="32" class="me-4" />
</template>
<VListItemTitle class="font-weight-medium">
{{ passkey.name }}
</VListItemTitle>
<VListItemSubtitle>
{{ t('profile.createdAt') }}: {{ new Date(passkey.created_at).toLocaleString(locale) }}
</VListItemSubtitle>
<template #append>
<VBtn
icon="mdi-delete"
variant="text"
color="error"
size="small"
@click="deletePassKey(passkey.id)"
/>
</template>
</VListItem>
</VList>
<VAlert v-else type="info" variant="tonal" class="mt-4">
{{ t('profile.noPasskeys') }}
</VAlert>
</VCardText>
</VCard>
<div class="d-flex justify-end mt-6">
<VBtn variant="outlined" @click="passkeyDialog = false">{{ t('common.close') }}</VBtn>
</div>
</VCardText>
<VDialogCloseBtn @click="passkeyDialog = false" />
</VCard>
</VDialog>
<!-- 密码验证对话框 -->
<VDialog v-model="verifyPasswordDialog" max-width="30rem">
<VCard>
<VCardTitle class="text-h5 text-center mt-4">{{ verifyTitle }}</VCardTitle>
<VCardText>
<p class="mb-4">{{ verifyText }}</p>
<VForm @submit.prevent="confirmVerifyPassword">
<VTextField
v-model="verifyPassword"
:type="isConfirmPasswordVisible ? 'text' : 'password'"
:label="t('user.password')"
:append-inner-icon="isConfirmPasswordVisible ? 'mdi-eye-off-outline' : 'mdi-eye-outline'"
variant="outlined"
prepend-inner-icon="mdi-lock"
autocomplete="current-password"
@click:append-inner="isConfirmPasswordVisible = !isConfirmPasswordVisible"
/>
<div class="d-flex justify-end gap-4 mt-4">
<VBtn variant="outlined" color="secondary" @click="verifyPasswordDialog = false">
{{ t('common.cancel') }}
</VBtn>
<VBtn type="submit" color="primary">
{{ t('common.confirm') }}
</VBtn>
</div>

View File

@@ -10,6 +10,11 @@ import VueI18n from '@intlify/unplugin-vue-i18n/vite'
import { resolve } from 'node:path'
import federation from '@originjs/vite-plugin-federation'
import topLevelAwait from 'vite-plugin-top-level-await'
import { readFileSync } from 'node:fs'
// 读取 package.json 获取版本号
const packageJson = JSON.parse(readFileSync('./package.json', 'utf-8'))
const buildTime = new Date().getTime().toString()
// https://vitejs.dev/config/
export default defineConfig({
@@ -52,104 +57,10 @@ export default defineConfig({
strategies: 'injectManifest',
srcDir: 'src',
filename: 'service-worker.ts',
workbox: {
globPatterns: ['**/*.{js,css,html,ico,png,svg,jpg,jpeg,webp,woff,woff2,ttf,otf,eot}'],
// 确保关键资源被预缓存
additionalManifestEntries: [
{
url: '/offline.html',
revision: null,
},
// 预缓存App Shell关键资源
{
url: '/logo.png',
revision: null,
},
],
// 启用导航预加载
navigationPreload: true,
runtimeCaching: [
// App Shell缓存 - 优先缓存
{
urlPattern: /^\/$|\/index\.html$/,
handler: 'CacheFirst',
options: {
cacheName: 'app-shell-cache',
expiration: {
maxEntries: 10,
maxAgeSeconds: 7 * 24 * 60 * 60, // 7天
},
},
},
{
urlPattern: /\.(?:js|css|html)$/,
handler: 'StaleWhileRevalidate',
options: {
cacheName: 'static-resources',
},
},
{
urlPattern: /\.(?:png|jpg|jpeg|svg|ico|webp|avif|gif|bmp|tiff)$/,
handler: 'CacheFirst',
options: {
cacheName: 'image-cache',
expiration: {
maxEntries: 200,
maxAgeSeconds: 30 * 24 * 60 * 60, // 30天
},
},
},
{
urlPattern: /\.(?:woff|woff2|ttf|otf|eot)$/,
handler: 'CacheFirst',
options: {
cacheName: 'font-cache',
expiration: {
maxEntries: 50,
maxAgeSeconds: 365 * 24 * 60 * 60, // 1年
},
},
},
{
urlPattern: /\/api\/v1\/.*$/,
handler: 'NetworkFirst',
options: {
cacheName: 'api-cache',
networkTimeoutSeconds: 10,
expiration: {
maxEntries: 500,
maxAgeSeconds: 24 * 60 * 60, // 24小时
},
},
},
{
urlPattern: /^https:\/\/image\.tmdb\.org\/.*$/,
handler: 'CacheFirst',
options: {
cacheName: 'tmdb-image-cache',
expiration: {
maxEntries: 300,
maxAgeSeconds: 7 * 24 * 60 * 60, // 7天
},
},
},
{
urlPattern: ({ request }) => request.destination === 'document',
handler: 'StaleWhileRevalidate',
options: {
cacheName: 'pages-cache',
},
},
],
navigateFallback: '/offline.html',
navigateFallbackDenylist: [/.*\/api\/.*/, /\/offline\.html$/],
ignoreURLParametersMatching: [/^utm_/, /^fbclid$/, /^gclid$/],
skipWaiting: true,
clientsClaim: true,
},
injectManifest: {
rollupFormat: 'iife',
maximumFileSizeToCacheInBytes: 5 * 1024 * 1024,
maximumFileSizeToCacheInBytes: 10 * 1024 * 1024,
globPatterns: ['**/*.{js,css,html,ico,png,svg,jpg,jpeg,webp,woff,woff2,ttf,otf,eot}'],
},
devOptions: {
enabled: true,
@@ -277,7 +188,11 @@ export default defineConfig({
promiseImportName: i => `__mp_tla_${i}`,
}),
],
define: { 'process.env': {} },
define: {
'process.env': {},
'__APP_VERSION__': JSON.stringify(`v${packageJson.version}`),
'__BUILD_TIME__': JSON.stringify(buildTime),
},
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url)),
@@ -300,12 +215,6 @@ export default defineConfig({
},
chunkSizeWarningLimit: 5000,
cssCodeSplit: false,
rollupOptions: {
output: {
entryFileNames: '[name].js',
chunkFileNames: '[name].js',
},
},
},
optimizeDeps: {
exclude: ['vuetify'],
@@ -324,6 +233,7 @@ export default defineConfig({
css: {
preprocessorOptions: {
scss: {
api: 'modern-compiler',
quietDeps: true,
},
},

View File

@@ -1927,6 +1927,16 @@
dependencies:
tslib "^2.4.0"
"@types/body-scroll-lock@^3.1.2":
version "3.1.2"
resolved "https://registry.yarnpkg.com/@types/body-scroll-lock/-/body-scroll-lock-3.1.2.tgz#1ae7857d98180dbe6c3b05abbe7ec1fa67b614e3"
integrity sha512-ELhtuphE/YbhEcpBf/rIV9Tl3/O0A0gpCVD+oYFSS8bWstHFJUgA4nNw1ZakVlRC38XaQEIsBogUZKWIPBvpfQ==
"@types/crypto-js@^4.2.2":
version "4.2.2"
resolved "https://registry.yarnpkg.com/@types/crypto-js/-/crypto-js-4.2.2.tgz#771c4a768d94eb5922cc202a3009558204df0cea"
integrity sha512-sDOLlVbHhXpAUAL0YHDUUwDZf3iN4Bwi4W6a0W0b+QcAezUbRtH4FVb+9J4h+XFPW7l/gQ9F8qC7P+Ec4k8QVQ==
"@types/debug@^4.1.12":
version "4.1.12"
resolved "https://registry.npmjs.org/@types/debug/-/debug-4.1.12.tgz"
@@ -2874,6 +2884,11 @@ body-parser@1.20.3:
type-is "~1.6.18"
unpipe "1.0.0"
body-scroll-lock@^3.1.5:
version "3.1.5"
resolved "https://registry.yarnpkg.com/body-scroll-lock/-/body-scroll-lock-3.1.5.tgz#c1392d9217ed2c3e237fee1e910f6cdd80b7aaec"
integrity sha512-Yi1Xaml0EvNA0OYWxXiYNqY24AfWkbA6w5vxE7GWxtKfzIbZM+Qw+aSmkgsbWzbHiy/RCSkUZBplVxTA+E4jJg==
boolbase@^1.0.0:
version "1.0.0"
resolved "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz"
@@ -3002,9 +3017,9 @@ camelcase-css@^2.0.1:
integrity sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==
caniuse-lite@^1.0.30001688, caniuse-lite@^1.0.30001702:
version "1.0.30001715"
resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001715.tgz"
integrity sha512-7ptkFGMm2OAOgvZpwgA4yjQ5SQbrNVGdRjzH0pBdy1Fasvcr+KAeECmbCAECzTuDuoX0FCY8KzUxjf9+9kfZEw==
version "1.0.30001761"
resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001761.tgz"
integrity sha512-JF9ptu1vP2coz98+5051jZ4PwQgd2ni8A+gYSN7EA7dPKIMf0pDlSUxhdmVOaV3/fYK5uWBkgSXJaRLr4+3A6g==
chalk@^4.0.0, chalk@^4.0.2:
version "4.1.2"
@@ -3246,6 +3261,11 @@ cross-spawn@^7.0.6:
shebang-command "^2.0.0"
which "^2.0.1"
crypto-js@^4.2.0:
version "4.2.0"
resolved "https://registry.yarnpkg.com/crypto-js/-/crypto-js-4.2.0.tgz#4d931639ecdfd12ff80e8186dba6af2c2e856631"
integrity sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q==
crypto-random-string@^2.0.0:
version "2.0.0"
resolved "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz"
@@ -6835,16 +6855,8 @@ std-env@^3.9.0:
resolved "https://registry.npmjs.org/std-env/-/std-env-3.9.0.tgz"
integrity sha512-UGvjygr6F6tpH7o2qyqR6QYpwraIjKSdtzyBdyytFOHmPZY917kwdwLG0RbOjWOnKmnm3PeHjaoLLMie7kPLQw==
"string-width-cjs@npm:string-width@^4.2.0":
version "4.2.3"
resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
dependencies:
emoji-regex "^8.0.0"
is-fullwidth-code-point "^3.0.0"
strip-ansi "^6.0.1"
string-width@^4.1.0, string-width@^4.2.3:
"string-width-cjs@npm:string-width@^4.2.0", string-width@^4.1.0, string-width@^4.2.3:
name string-width-cjs
version "4.2.3"
resolved "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz"
integrity sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==
@@ -6929,14 +6941,8 @@ stringify-object@^3.3.0:
is-obj "^1.0.1"
is-regexp "^1.0.0"
"strip-ansi-cjs@npm:strip-ansi@^6.0.1":
version "6.0.1"
resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==
dependencies:
ansi-regex "^5.0.1"
strip-ansi@^6.0.0, strip-ansi@^6.0.1:
"strip-ansi-cjs@npm:strip-ansi@^6.0.1", strip-ansi@^6.0.0, strip-ansi@^6.0.1:
name strip-ansi-cjs
version "6.0.1"
resolved "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz"
integrity sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==