Compare commits

..

155 Commits

Author SHA1 Message Date
InfinityPacer
81ab3f9da8 fix(subscribe): show best version mode tag (#471) 2026-05-15 06:51:03 +08:00
Album
d520645a8b fix: keep manual reorganize preview visible on partial failures (#470) 2026-05-14 23:05:41 +08:00
jxxghp
af67fddce0 fix: ensure clear cache reloads page 2026-05-14 22:45:23 +08:00
Album
6d89dad8de fix: prevent duplicate manual reorganize requests in filtered directories (#469) 2026-05-14 21:13:46 +08:00
jxxghp
f3ab2a8eff feat: add collapsible section for AI agent settings to reduce visual clutter 2026-05-14 20:27:28 +08:00
jxxghp
74c980c7a5 feat: split agent audio input and output settings 2026-05-14 19:37:46 +08:00
jxxghp
52fc2557ec fix: refresh transfer history on activation 2026-05-14 18:15:08 +08:00
jxxghp
34124418f8 perf: optimize initial load by implementing lazy loading for modules and fine-tuning authentication/resource initialization logic. 2026-05-14 13:19:48 +08:00
jxxghp
e2d36da299 refactor: invert background poster opacity logic to represent transparency percentage 2026-05-13 22:53:15 +08:00
jxxghp
9965428bae feat: add configurable opacity and blur settings for the transparent theme background 2026-05-13 22:34:12 +08:00
jxxghp
e62a0b5a8d refactor: optimize performance by centralizing state calculations and stabilizing virtual list data refs 2026-05-13 22:01:13 +08:00
Album
3c926f7485 refactor: remove redundant path cards from reorganize preview panel (#468) 2026-05-13 21:32:31 +08:00
DDSRem
de3f4e6374 feat: add wildcard glob support to file manager filter (#467) 2026-05-13 21:15:07 +08:00
jxxghp
2e22f6ae86 feat: virtualize media server dashboard grids 2026-05-13 21:08:59 +08:00
jxxghp
99665c7d79 feat: virtualize card grids 2026-05-13 19:07:46 +08:00
jxxghp
a4a00586c7 更新 package.json 2026-05-13 17:08:11 +08:00
jxxghp
cf59a07d4b feat: add full season upgrade option to TV subscription edit dialog 2026-05-13 15:55:50 +08:00
jxxghp
8a362d0740 fix: prevent SubscribeCard overflow by adding truncation and flex constraints to username and progress display 2026-05-13 14:51:13 +08:00
jxxghp
b49385af29 chore: bump package version to 2.11.2 2026-05-12 22:33:04 +08:00
jxxghp
b227412c96 chore: update feishu logo image asset 2026-05-12 22:32:42 +08:00
jxxghp
b3c8faab70 feat: add Feishu notification configuration UI 2026-05-12 21:42:17 +08:00
jxxghp
9a480dd803 refactor: simplify ReorganizeDialog UI by removing redundant background and border styles 2026-05-12 20:56:00 +08:00
jxxghp
847fd13982 refactor: implement collapsible side-by-side preview panel in ReorganizeDialog 2026-05-12 20:47:25 +08:00
album
7fa4f4a2f0 feat: add reorganize preview panel and optimize dialog layout
- Add reorganize result preview panel on the right side of ReorganizeDialog
- Add preview types: ManualTransferPayload, ManualTransferPreviewSummary, ManualTransferPreviewItem, ManualTransferPreviewData
- Add preview-related locale keys for zh-CN, zh-TW, en-US
- Optimize dialog width, split ratios, and button positions
- Support horizontal scroll for before/after file name columns
- Auto-calculate pagination via ResizeObserver with fixed row height
- Display media info, stats, and season/episode counts in preview header
- Support parallel preview requests with per-item error handling
- Replace setTimeout with nextTick for DOM-dependent operations
2026-05-12 17:32:08 +08:00
jxxghp
4207a70716 feat: add support for ZSpace media server integration including UI configuration and logo assets 2026-05-11 18:09:29 +08:00
jxxghp
c97247b92b refactor: optimize initial loading view and viewport synchronization logic for iOS standalone mode 2026-05-11 12:45:20 +08:00
jxxghp
e9bed7ff8a feat: update loading shell transition and add exit animation transform 2026-05-11 12:35:42 +08:00
jxxghp
f25a619f13 refactor: optimize initial loading screen layout and theme handling for improved PWA startup experience 2026-05-11 12:25:31 +08:00
jxxghp
2065b05143 refactor: remove manual chunk splitting configuration in vite build settings 2026-05-10 23:46:04 +08:00
jxxghp
eec1f2d7b3 style: update loading background to cover full viewport using dynamic units 2026-05-10 22:58:02 +08:00
jxxghp
17a343392c refactor: replace mobile device check with touch capability detection for tab scroll controls 2026-05-10 22:48:49 +08:00
jxxghp
a2b2e8cd94 feat: implement automatic refresh logic for expired WeChat Claw Bot QR codes 2026-05-10 22:45:21 +08:00
jxxghp
9703b2dbee 更新 package.json 2026-05-10 22:12:21 +08:00
jxxghp
310a501380 feat: implement QR code generation for WechatClawBot status display 2026-05-10 22:10:30 +08:00
jxxghp
30bf895ae1 fix: preserve wechat clawbot login state across renames 2026-05-10 21:50:33 +08:00
jxxghp
4f9dce70d3 feat: add wechat clawbot notification setup UI 2026-05-10 21:47:35 +08:00
jxxghp
f495e13667 style: add horizontal padding to overlay list content in common styles 2026-05-10 09:40:19 +08:00
jxxghp
f293681588 refactor: implement search parameter state management and prevent API caching for search requests 2026-05-09 23:02:17 +08:00
jxxghp
2f1a356e65 fix: replace virtual card grid with progressive loading 2026-05-09 22:23:45 +08:00
jxxghp
5909d2423c fix: stabilize virtual card grid during fast scrolling 2026-05-09 21:50:32 +08:00
jxxghp
42f7df8f4a fix: refine data cleanup settings tab
Move the data tab before log, hide retention fields until cleanup is enabled, and remove the extra download files prompt to keep the advanced settings flow focused.
2026-05-09 21:40:35 +08:00
jxxghp
abaa40d819 feat: add data cleanup settings tab
Expose the cleanup switch and per-table retention periods in advanced settings so administrators can manage data cleanup from the UI.
2026-05-09 21:22:02 +08:00
jxxghp
0d05a104c4 refactor: migrate site management actions to dynamic floating menu and update sort mode exit buttons 2026-05-09 18:37:16 +08:00
jxxghp
e8708f8de7 fix: add exit action for drag sort mode 2026-05-09 18:10:56 +08:00
jxxghp
7918b21b5b fix sites title align 2026-05-09 18:05:52 +08:00
jxxghp
088db67089 fix: make sort mode drag-only across cards 2026-05-09 18:04:10 +08:00
jxxghp
62e0d8e9dc perf: virtualize remaining long result views
Reduce DOM growth across resource, history, workflow, share, downloading, and message views so large datasets stay responsive while scrolling.
2026-05-09 17:28:23 +08:00
jxxghp
96d655155a perf: virtualize management lists and make drag sorting opt-in 2026-05-09 16:07:28 +08:00
jxxghp
a475085d7b refactor: implement buffered streaming updates and disable keep-alive for resource 2026-05-09 13:22:40 +08:00
jxxghp
58fdb77b37 更新 index.ts 2026-05-09 12:25:18 +08:00
jxxghp
8a25c6578d 更新 index.ts 2026-05-09 12:15:08 +08:00
jxxghp
ef62bd6e98 fix: restore horizontal slide loading placeholders
Wrap VirtualSlideView loading content in a horizontal track so media and person slide skeletons keep their original full-width carousel layout and title presentation during loading.
2026-05-09 09:02:40 +08:00
jxxghp
876a46607b chore: bump version to 2.11.0 2026-05-09 08:51:59 +08:00
jxxghp
107f70abde refactor: unify horizontal card virtualization
Replace the remaining slide loading fallbacks with VirtualSlideView so horizontal media and person carousels use a single rendering path. Remove the now-unused SlideView component to keep the slide system smaller and easier to maintain.
2026-05-09 08:48:49 +08:00
jxxghp
090b9d735d feat: add media recognition sharing setting and update system settings UI layout 2026-05-09 08:33:29 +08:00
jxxghp
dbeea6afcc perf: reduce frontend memory pressure and startup cost
Limit long-lived page and component retention while virtualizing large card views to keep runtime memory lower. Defer heavy editor, chart, workflow, calendar, and icon code so the app loads less JavaScript up front.
2026-05-09 08:32:14 +08:00
jxxghp
2931f5df46 更新 package.json 2026-05-08 11:21:47 +08:00
jxxghp
e14c81d178 feat(settings): persist LLM base URL presets 2026-05-08 10:52:30 +08:00
jxxghp
a9403c9c34 chore: bump version to 2.10.11 2026-05-07 08:23:20 +08:00
jxxghp
dc4914e3ca style: adjust downloader card API key field to span full width 2026-05-07 08:22:39 +08:00
jxxghp
f3dbc4afad feat: add qBittorrent API key setup support
Expose qBittorrent WebUI API Key fields in settings and setup so 5.2 users can connect without requiring username/password.

Refs jxxghp/MoviePilot#5724
2026-05-07 07:41:05 +08:00
jxxghp
e3e22aebd9 feat: replace log level chips with VSelect dropdown in LoggingView and adjust layout spacing 2026-05-06 13:04:35 +08:00
jxxghp
0ca2f20b24 refactor: update logging record layout to use block-level elements for better alignment and structure 2026-05-06 08:02:50 +08:00
jxxghp
14279c773d fix: update LoggingView layout to support responsive height for mobile devices 2026-05-05 12:37:30 +08:00
jxxghp
8372f63eb6 refactor: dynamic logging view height calculation and remove redundant LLM model refresh on settings save 2026-05-05 12:34:09 +08:00
jxxghp
b7b62d7922 feat: overhaul logging view with advanced filtering, grouped display, and real-time streaming controls 2026-05-05 11:53:21 +08:00
jxxghp
162cce1f50 feat: replace VSelect with VAutocomplete for LLM provider selection in settings 2026-05-04 20:04:14 +08:00
jxxghp
aa49c6ccbc refactor(llm): merge preset selection into base URL field
Use a single editable Base URL combobox for LLM providers so preset endpoints and manual input share one field, with preset types shown as subtitles.
2026-05-03 11:31:06 +08:00
jxxghp
a40e52079f 更新 package.json 2026-05-03 09:44:37 +08:00
jxxghp
c29e329548 feat(llm): add provider URL presets
Expose provider-specific preset endpoints in the setup and system settings flows so users can start from the correct base URL while still editing it manually.
2026-05-03 09:38:28 +08:00
mcgrady.sun
e2d26f6a25 fix(resource): 解决重新搜索按钮 review 问题
- 简化 refreshSearch:移除多余的 switchToOriginalResults 调用,
  直接置 showingAiResults=false,其余状态由 fetchData 内部重置
- 标题栏 v-if 去掉 !progressActive 条件,避免点击重新搜索时
  整个标题栏 unmount 导致按钮 :loading 不可见、页面跳动
2026-05-02 16:33:19 +08:00
mcgrady.sun
1752256868 feat(resource): 资源搜索结果页增加重新搜索按钮
- 在搜索结果页右侧操作区新增"重新搜索"按钮(mdi-refresh 图标)
- 点击后使用相同搜索参数重新触发请求;正在请求或加载中时按钮禁用
- 若当前展示的是 AI 推荐结果,先切回原始结果再重新搜索,避免状态不一致
- 同步补充 zh-CN / zh-TW / en-US 三份本地化文案
2026-05-02 16:33:19 +08:00
jxxghp
23d7f0dcc1 更新 package.json 2026-04-30 11:55:22 +08:00
jxxghp
288aeed178 chore: update LLM model hint examples in localization files 2026-04-30 11:29:17 +08:00
jxxghp
9a9a618136 refactor: extract LLM provider management logic into composable and add OAuth support for system settings 2026-04-30 09:49:05 +08:00
jxxghp
723eb319e1 feat: add batch AI reorganization support to Transfer History view 2026-04-29 20:37:52 +08:00
jxxghp
96684a8d13 feat: add configuration for AI voice input/output settings and models 2026-04-29 18:15:50 +08:00
jxxghp
fc9fe5e21e chore: bump version to 2.10.8 and adjust UI styling for scraping settings 2026-04-29 17:10:36 +08:00
jxxghp
24b763d808 refactor: comment out redundant refresh call in ShortcutBar message submission 2026-04-28 13:10:37 +08:00
jxxghp
f761cdff00 chore: bump version to 2.10.7 and improve message sending reliability with explicit refresh and type safety 2026-04-28 13:04:05 +08:00
jxxghp
b785769138 feat: add transparent theme support for AI agent settings card and adjust border opacity 2026-04-25 12:30:30 +08:00
jxxghp
6d1febd70a 更新 AccountSettingSystem.vue 2026-04-25 11:41:35 +08:00
jxxghp
bdbaf503ca feat: implement custom Jinja2 syntax highlighting for rename templates and notification templates using VAceEditor 2026-04-25 11:20:15 +08:00
jxxghp
f9e74cf436 style: group AI assistant settings in system page 2026-04-25 10:48:55 +08:00
jxxghp
e043669a10 更新 package.json 2026-04-24 20:25:09 +08:00
jxxghp
78d8fdba9d fix: restore setup agent grid layout 2026-04-24 20:20:36 +08:00
jxxghp
5c0f0386a6 chore: reorder llm thinking setting 2026-04-24 20:17:22 +08:00
jxxghp
30b39283b6 feat: add unified llm thinking level setting 2026-04-24 19:50:23 +08:00
jxxghp
de84c39d2f fix card action hit areas 2026-04-22 18:01:26 +08:00
jxxghp
65152e7e37 fix: 修复媒体服务器卡片关闭按钮被背景图遮挡的问题 2026-04-22 17:07:41 +08:00
jxxghp
ba343ce5fa style: adjust login page layout spacing and formatting for improved visual alignment 2026-04-21 22:20:04 +08:00
jxxghp
60495668a6 Simplify LLM settings connectivity test 2026-04-21 22:14:19 +08:00
jxxghp
f2ac624dbb fix: refine ai assistant settings feedback 2026-04-21 21:25:21 +08:00
jxxghp
6238849d3f refactor: optimize ai assistant settings actions 2026-04-21 21:11:29 +08:00
笨笨
82cb903c1f fix: localize llm test result labels 2026-04-21 20:41:39 +08:00
笨笨
5e5eb95b55 feat: add llm test button 2026-04-21 20:41:39 +08:00
jxxghp
74e6f8b03e bump version to 2.10.3 2026-04-21 08:55:50 +08:00
jxxghp
a2bf0d2b16 refine settings card layouts 2026-04-21 08:50:14 +08:00
jxxghp
7532d39978 style: update plugin repository icon and increase compact FAB icon size 2026-04-19 14:45:35 +08:00
jxxghp
5cc9bf7418 style: reduce compact-fab size and standardize padding across filter menus 2026-04-19 13:35:25 +08:00
jxxghp
20bdb940cd refactor: standardize floating action buttons with a compact stack layout and migrate menu items to key-based i18n resolution 2026-04-19 13:00:04 +08:00
jxxghp
e9b214cff8 refactor: enhance dynamic button system to support menus, reactive properties, and improved PWA floating action button integration 2026-04-19 12:29:02 +08:00
jxxghp
54f5fb2877 更新 login.vue 2026-04-19 07:21:25 +08:00
jxxghp
e86cb9e1cc Merge pull request #461 from InfinityPacer/codex/feat/local-plugin-paths 2026-04-19 07:07:55 +08:00
InfinityPacer
3f258b9016 fix(plugin): resort market list when statistics load 2026-04-19 04:21:00 +08:00
InfinityPacer
b54e144d0e feat(plugin): show local repo paths in repository filter 2026-04-19 04:20:49 +08:00
InfinityPacer
7b20a7b775 refactor(setting): rename local repo paths setting 2026-04-19 03:03:22 +08:00
InfinityPacer
df66b3e917 fix(plugin): local source label and detection 2026-04-19 02:54:09 +08:00
jxxghp
a919622d08 Document nettest target loading flow 2026-04-18 17:52:01 +08:00
jxxghp
2a9ce950b7 Use backend-managed nettest targets 2026-04-18 17:43:38 +08:00
InfinityPacer
48c12b765d feat(setting): expose local plugin paths 2026-04-18 03:11:55 +08:00
InfinityPacer
1120055eed feat(plugin): support local plugin sources 2026-04-18 03:01:16 +08:00
jxxghp
c66b6649e2 feat: enable drag sorting for plugin market repos 2026-04-17 21:01:33 +08:00
jxxghp
8479099926 fix: simplify plugin market repo display 2026-04-17 20:42:11 +08:00
jxxghp
cab65be1c9 feat: update plugin market settings UI layout and refine localization strings 2026-04-17 15:25:36 +08:00
jxxghp
6689e976c2 更新 package.json 2026-04-17 15:12:00 +08:00
jxxghp
712dfa3fe1 feat: improve transfer history footer actions and plugin market settings 2026-04-17 15:02:56 +08:00
jxxghp
346121f3c2 chore: bump version to 2.10.1 2026-04-16 19:51:02 +08:00
jxxghp
61c073ad6c refactor: remove recognize source selection and hardcode to themoviedb in setup wizard 2026-04-16 19:50:37 +08:00
jxxghp
4b3733bc19 feat: add site auth step to setup wizard 2026-04-16 19:21:17 +08:00
jxxghp
b29c6bd83f feat: add AI agent configuration step and expand basic settings with OCR and recognition source options 2026-04-16 17:36:27 +08:00
jxxghp
b40fc4bd30 更新 package.json 2026-04-16 10:42:02 +08:00
jxxghp
a225ba6075 feat: implement responsive filter panel with collapsible search for mobile layout 2026-04-15 17:59:35 +08:00
jxxghp
303fe39c01 更新 package.json 2026-04-15 17:17:09 +08:00
jxxghp
d343cbcf71 Add AI redo progress viewer 2026-04-15 17:10:18 +08:00
jxxghp
0eef8c5174 Optimize site resource dialog layout 2026-04-15 14:18:02 +08:00
jxxghp
46fe257585 feat: add LLM image input support toggle to system settings 2026-04-15 08:46:51 +08:00
jxxghp
f69a57863e feat: add AI-powered reorganization option to transfer history records 2026-04-14 15:39:15 +08:00
jxxghp
8876aadcfa 更新 package.json 2026-04-13 18:42:07 +08:00
jxxghp
485e9691a0 Merge pull request #460 from InfinityPacer/codex/fix/dev-version-check-skip 2026-04-13 06:55:33 +08:00
InfinityPacer
a0e7283ae6 fix(version): skip mismatch toast in dev and harden sw fallback 2026-04-12 23:38:56 +08:00
jxxghp
b44c0647f1 更新 package.json 2026-04-12 10:24:07 +08:00
jxxghp
7e60ab9064 Merge pull request #459 from PKC278/v2 2026-04-12 10:23:49 +08:00
PKC278
f05c1f42b5 fix: 修复推荐和探索页面电视剧已入库标识不显示的问题 2026-04-12 09:52:18 +08:00
jxxghp
672bbb4265 feat:资源渐进式搜索 2026-04-10 16:48:29 +08:00
jxxghp
10c1041b06 Improve resource search loading UI 2026-04-10 16:07:17 +08:00
jxxghp
59c73facfe fix: expand path directories on row click 2026-04-10 15:44:13 +08:00
jxxghp
ba7d4cd392 fix: avoid closing cron menu while selecting options 2026-04-10 15:33:08 +08:00
jxxghp
d76a50c216 fix media detail transparent backdrop 2026-04-10 14:33:38 +08:00
jxxghp
617223777b refactor: 统一过滤图标为 mdi-filter-multiple-outline,插件市场筛选改为下拉多选 2026-04-09 13:03:58 +08:00
jxxghp
6ef047050d refactor: 将订阅和插件过滤弹窗改为站点管理风格的下拉列表菜单 2026-04-09 12:28:30 +08:00
jxxghp
942ecc4c04 Merge pull request #458 from DDSRem-Dev/v2 2026-04-09 08:06:48 +08:00
DDSRem
e72f9a8374 feat(plugin): 侧栏全页 AppPage、多 nav_key 联邦加载与 sidebar_nav 缓存
- 新增路由 plugin-app 与壳页,按 nav_key 尝试 AppPage{Pascal}/AppPage/Page
- DefaultLayout 与 appcenter 合并插件侧栏项;plugin/sidebar_nav 经 Pinia 去重缓存
- 工具 pluginSidebarNav、联邦 loader 与文档/示例更新;登出时清空侧栏缓存

Made-with: Cursor
2026-04-09 07:59:40 +08:00
jxxghp
9cf782eb5b style: remove background color from search bar container 2026-04-08 15:15:16 +08:00
jxxghp
660338688a refactor: adjust TransferHistoryView layout offset and apply code style improvements 2026-04-08 13:47:04 +08:00
jxxghp
2d50bd7536 refactor: optimize useAvailableHeight to improve resize event handling and performance 2026-04-08 13:23:29 +08:00
jxxghp
b02a4f1347 refactor: extract available height calculation logic into a reusable useAvailableHeight composable 2026-04-08 13:08:51 +08:00
jxxghp
1748fdea34 feat: optimize search bar UI with responsive capsule trigger and mobile-friendly dialog footer 2026-04-08 10:09:38 +08:00
jxxghp
6bbaf43671 feat: redesign search dialog UI with a custom input layout and OS-aware keyboard shortcuts 2026-04-08 08:28:42 +08:00
jxxghp
4a66aaadad rollback footer 2026-04-07 13:18:27 +08:00
jxxghp
e2e239f6d9 fix: 消息中心纯文本换行丢失、登录页优化、底部导航液态玻璃效果 2026-04-07 13:10:19 +08:00
jxxghp
fe22403e66 feat: 新增文件整理失败智能接管设置项(AI_AGENT_RETRY_TRANSFER) 2026-04-03 13:39:57 +08:00
jxxghp
3313c71805 feat: 更新日志弹窗支持Markdown渲染 2026-04-03 07:10:12 +08:00
jxxghp
1e60e83514 feat: 新增智能体(Agent)消息类型,优化通知开关加载逻辑自动合并新增类型 2026-04-02 19:11:42 +08:00
jxxghp
9c893abcdf fix: 优化登录页面密码管理器自动填充 2026-03-30 12:56:17 +08:00
136 changed files with 15593 additions and 3740 deletions

View File

@@ -16,13 +16,17 @@ MoviePilot前端采用模块联邦(Module Federation)技术实现插件的动态
## 3. 核心概念
每个插件需要提供三个标准组件:
每个 Vue 联邦插件需要提供下列标准组件`AppPage` 为可选,用于主界面侧栏全页入口)
| 组件名称 | 文件名 | 用途 |
|---------|-------|------|
| Page | Page.vue | 插件详情页面 |
| Config | Config.vue | 插件配置页面 |
| Dashboard | Dashboard.vue | 仪表组件 |
| 组件名称 | 暴露名 | 文件名 | 用途 |
|---------|--------|--------|------|
| Page | `./Page` | Page.vue | 插件管理中的详情弹窗 |
| Config | `./Config` | Config.vue | 插件配置页面 |
| Dashboard | `./Dashboard` | Dashboard.vue | 仪表盘小组件 |
| AppPage | `./AppPage` | AppPage.vue | 主界面侧栏独立全页(主内容区由插件完全绘制) |
| (可选) | `./AppPage{Xxx}` | 如 AppPageSettings.vue | 多 `nav_key` 时按名优先加载,见下文「多界面」 |
主应用在侧栏全页路由中按 `nav_key` 解析暴露名(如 `AppPageSettings`),再回退 `AppPage``Page``nav_key``main` 时仅尝试 `AppPage``Page`
## 4. 快速开始
@@ -56,6 +60,8 @@ export default defineConfig({
'./Page': './src/components/Page.vue',
'./Config': './src/components/Config.vue',
'./Dashboard': './src/components/Dashboard.vue',
'./AppPage': './src/components/AppPage.vue',
'./AppPageSettings': './src/components/AppPageSettings.vue',
},
shared: {
vue: {
@@ -264,6 +270,91 @@ const props = defineProps({
</template>
```
### 5.4 AppPage 组件(侧栏全页)
用于主应用左侧导航中的独立页面(路由 `#/plugin-app/:pluginId/:navKey?`),占据默认布局下的主内容区;与 `Page` 不同,不嵌在插件管理弹窗中。
主应用传入的 props
| 属性 | 说明 |
|------|------|
| `api` | 与 `Page` 相同,用于 `bear` 认证的插件 HTTP 调用 |
| `navKey` | 与侧栏声明的 `nav_key` 一致,同一插件多入口时用于区分 |
| `pluginId` | 当前插件 ID |
```vue
<script setup lang="ts">
const props = defineProps({
api: { type: Object, default: () => ({}) },
navKey: { type: String, default: 'main' },
pluginId: { type: String, default: '' },
})
const emit = defineEmits(['action'])
</script>
<template>
<div class="pa-4">
<div class="text-h6 mb-2">侧栏全页示例{{ pluginId }} / {{ navKey }}</div>
<v-btn size="small" @click="emit('action')">通知主应用</v-btn>
</div>
</template>
```
#### 后端:注册侧栏入口
插件需为 **Vue** 渲染模式(`get_render_mode` 返回 `vue`),并实现 `get_sidebar_nav`,返回列表项字段与主应用 `GET /api/v1/plugin/sidebar_nav` 一致:
| 字段 | 说明 |
|------|------|
| `nav_key` | URL 路径段,唯一标识本入口(同一插件可多入口) |
| `title` | 侧栏显示标题 |
| `icon` | MDI 图标名,如 `mdi-rss` |
| `section` | 分组:`start` / `discovery` / `subscribe` / `organize` / `system` |
| `permission` | 可选:`subscribe` / `discovery` / `search` / `manage` / `admin`,与主应用菜单权限一致 |
| `order` | 可选:同组内排序,数值越小越靠前 |
```python
def get_sidebar_nav(self) -> List[Dict[str, Any]]:
return [
{
"nav_key": "main",
"title": "示例订阅页",
"icon": "mdi-rss",
"section": "subscribe",
"permission": "subscribe",
"order": 10,
}
]
```
#### 同一插件多个全页界面(多 `nav_key`
`get_sidebar_nav` 中**返回多条**记录,每条使用不同的 `nav_key` / `title` / `section` 等,侧栏与「更多」中会出现多个入口,路由形如 `#/plugin-app/<插件ID>/<nav_key>`
前端加载远程组件的顺序为:
| `nav_key` | 依次尝试的联邦暴露名 |
|-----------|----------------------|
| `main` 或省略 | `./AppPage``./Page` |
| 其它(如 `settings``my_tool` | `./AppPage{PascalCase}``./AppPage``./Page` |
`PascalCase` 规则:按 `-``_`、空格分段后首字母大写并拼接。例如 `nav_key=settings` → 先试 `./AppPageSettings``my_tool``./AppPageMyTool`
**两种实现方式(二选一或混用):**
1. **单文件分支**:只暴露 `./AppPage`,在组件内根据 `navKey` prop 用 `v-if` / `<component>` 切换子界面。
2. **多文件**:为某个入口单独暴露 `./AppPageSettings.vue` 等,主应用会优先加载对应模块,失败再回退到 `AppPage`
`vite.config` 多暴露示例:
```typescript
exposes: {
'./AppPage': './src/components/AppPage.vue',
'./AppPageSettings': './src/components/AppPageSettings.vue',
// ...
}
```
## 6. 构建和部署
### 构建项目

View File

@@ -1,6 +1,6 @@
# MoviePilot 插件远程组件示例
这是 MoviePilot 插件远程组件的示例项目,展示了如何正确配置和开发与主应用兼容的远程组件。本示例实现了三个标准组件Page详情页面、Config配置页面和Dashboard仪表板组件)。
这是 MoviePilot 插件远程组件的示例项目,展示了如何正确配置和开发与主应用兼容的远程组件。本示例包含 Page、Config、Dashboard、AppPage以及可选的 `AppPageSettings``nav_key=settings` 时由主应用优先加载,用于演示「一插件多全页界面」)。
## 1. 开发环境准备
@@ -28,7 +28,9 @@ plugin-component/
│ ├── components/
│ │ ├── Page.vue # 插件详情页面组件
│ │ ├── Config.vue # 插件配置页面组件
│ │ ── Dashboard.vue # 插件仪表板组件
│ │ ── Dashboard.vue # 插件仪表板组件
│ │ ├── AppPage.vue # 侧栏全页主内容区nav_key=main
│ │ └── AppPageSettings.vue # 可选第二全页nav_key=settings
│ ├── App.vue # 本地开发入口组件
│ └── main.js # 本地开发入口文件
├── vite.config.js # Vite和模块联邦配置

View File

@@ -0,0 +1,32 @@
<script setup lang="ts">
/**
* 侧栏全页:在主应用 #/plugin-app/:pluginId/:navKey 中渲染,占据主内容区。
* 需在插件后端实现 get_sidebar_nav 才会出现在侧栏。
*/
const props = defineProps({
api: {
type: Object,
default: () => ({}),
},
navKey: {
type: String,
default: 'main',
},
pluginId: {
type: String,
default: '',
},
})
const emit = defineEmits(['action'])
</script>
<template>
<div class="plugin-app-page pa-4">
<div class="text-h6 mb-2">AppPage侧栏全页</div>
<div class="text-body-2 text-medium-emphasis mb-4">
pluginId: {{ pluginId }} · navKey: {{ navKey }}
</div>
<v-btn size="small" variant="tonal" @click="emit('action')">action</v-btn>
</div>
</template>

View File

@@ -0,0 +1,17 @@
<script setup lang="ts">
/**
* 示例nav_key=settings 时主应用会优先加载 AppPageSettings再回退 AppPage。
*/
const props = defineProps({
api: { type: Object, default: () => ({}) },
navKey: { type: String, default: 'settings' },
pluginId: { type: String, default: '' },
})
</script>
<template>
<div class="pa-4">
<div class="text-subtitle-1">Settings 子界面AppPageSettings</div>
<div class="text-caption text-medium-emphasis">navKey={{ navKey }} · pluginId={{ pluginId }}</div>
</div>
</template>

View File

@@ -12,6 +12,8 @@ export default defineConfig({
'./Page': './src/components/Page.vue',
'./Config': './src/components/Config.vue',
'./Dashboard': './src/components/Dashboard.vue',
'./AppPage': './src/components/AppPage.vue',
'./AppPageSettings': './src/components/AppPageSettings.vue',
},
shared: {
vue: {

View File

@@ -1,11 +1,14 @@
<!DOCTYPE html>
<html lang="zh-CN" style="
overflow: hidden auto;
min-block-size: 100vh;
min-block-size: 100dvh;
<html lang="zh-CN" data-launch-loading="true" style="
overflow: hidden;
--safe-area-inset-bottom: env(safe-area-inset-bottom);
--safe-area-inset-top: env(safe-area-inset-top);
background: var(--initial-loader-bg, #fff);
--initial-loader-bg: #0E1116;
--initial-loader-color: #9155FD;
--initial-loader-height: 100svh;
--initial-loader-width: 100vw;
background: var(--initial-loader-bg, #0E1116);
background-color: var(--initial-loader-bg, #0E1116);
">
<head>
@@ -92,50 +95,95 @@
<link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
<style>
#app {
min-block-size: 100%;
html,
body {
background: var(--initial-loader-bg, #0E1116);
background-color: var(--initial-loader-bg, #0E1116);
}
html[data-launch-loading="true"],
html[data-launch-loading="true"] body {
overflow: hidden;
}
html[data-launch-loading="true"] body {
min-block-size: var(--initial-loader-height, 100svh);
}
html[data-launch-loading="true"] #app {
min-block-size: var(--initial-loader-height, 100svh);
background: var(--initial-loader-bg, #0E1116);
background-color: var(--initial-loader-bg, #0E1116);
-webkit-overflow-scrolling: touch;
overscroll-behavior: contain;
}
#loading-bg {
position: fixed;
inset: 0;
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;
overflow: hidden;
background: var(--initial-loader-bg, #0E1116);
background-color: var(--initial-loader-bg, #0E1116);
}
.loading-shell {
box-sizing: border-box;
display: grid;
grid-template-rows: minmax(0, 1fr) auto;
block-size: var(--initial-loader-height, 100svh);
inline-size: 100%;
min-block-size: var(--initial-loader-height, 100svh);
transition: opacity 0.12s ease-out, transform 0.12s ease-out;
padding:
calc(env(safe-area-inset-top, 0px) + 24px)
24px
calc(env(safe-area-inset-bottom, 0px) + 48px);
}
.loading-main {
display: flex;
align-items: center;
justify-content: center;
min-block-size: 0;
}
.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;
display: flex;
align-items: center;
justify-content: center;
inline-size: min(160px, 36vw);
transform: translate3d(0, 0, 0);
will-change: transform;
}
.loading-complete .loading-logo {
filter: blur(10px);
opacity: 0;
transform: scale(1.5);
.loading-logo img {
display: block;
block-size: auto;
inline-size: 100%;
}
.loading-complete {
filter: blur(15px);
.loading-footer {
display: flex;
align-items: center;
justify-content: center;
min-block-size: clamp(72px, 14vh, 120px);
}
.loading-complete .loading-shell,
.loading-complete #loading-timeout {
opacity: 0;
transform: scale(1.2);
transform: translate3d(0, 6px, 0);
}
.loading {
position: absolute;
position: relative;
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);
block-size: 46px;
inline-size: 46px;
transition: opacity 0.6s ease;
}
@@ -198,7 +246,7 @@
position: absolute;
z-index: 2500;
display: none;
inset-block-end: 20px;
inset-block-end: calc(env(safe-area-inset-bottom, 0px) + 24px);
inset-inline-start: 50%;
transform: translateX(-50%);
background: rgba(0, 0, 0, 0.8);
@@ -209,7 +257,8 @@
font-family: sans-serif;
text-align: center;
box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
white-space: nowrap;
max-inline-size: calc(100% - 32px);
white-space: normal;
backdrop-filter: blur(4px);
border: 1px solid rgba(255, 255, 255, 0.1);
}
@@ -233,25 +282,65 @@
}
}
// 主题色彩初始化
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'
// 根据当前主题提前确定启动屏色彩,避免 iOS PWA 从原生启动图切到网页时露出默认白底。
const launchThemeBackgrounds = {
light: '#F4F5FA',
dark: '#0E1116',
purple: '#28243D',
transparent: '#1C1C1C',
default: '#F4F5FA',
}
const savedTheme = localStorage.getItem('theme') || 'auto'
const resolvedLaunchTheme = savedTheme === 'auto'
? (checkPrefersColorSchemeIsDark() ? 'dark' : 'light')
: savedTheme
let loaderColor = localStorage.getItem('materio-initial-loader-bg')
|| launchThemeBackgrounds[resolvedLaunchTheme]
|| launchThemeBackgrounds.light
let primaryColor = localStorage.getItem('materio-initial-loader-color')
if (!primaryColor) {
primaryColor = '#9155FD'
}
// 在应用脚本接管前锁定一次启动层内容高度,避免 iOS 独立模式首次重算 safe area 时把 logo 顶下去。
function syncInitialViewport(force) {
const viewport = window.visualViewport
const nextHeight = Math.round(viewport?.height || window.innerHeight || document.documentElement.clientHeight || 0)
const nextWidth = Math.round(viewport?.width || window.innerWidth || document.documentElement.clientWidth || 0)
const currentHeight = parseInt(
document.documentElement.style.getPropertyValue('--initial-loader-height') || '0',
10,
)
if (!nextHeight || !nextWidth) {
return
}
if (!force && currentHeight && Math.abs(nextHeight - currentHeight) < 120) {
return
}
document.documentElement.style.setProperty('--initial-loader-height', `${nextHeight}px`)
document.documentElement.style.setProperty('--initial-loader-width', `${nextWidth}px`)
}
// 应用主题色彩
document.documentElement.setAttribute('data-launch-theme', resolvedLaunchTheme)
document.documentElement.style.setProperty('--initial-loader-bg', loaderColor)
document.documentElement.style.setProperty('--initial-loader-color', primaryColor)
document.documentElement.style.backgroundColor = loaderColor
syncInitialViewport(true)
document.addEventListener('DOMContentLoaded', () => {
document.body.style.backgroundColor = loaderColor
})
window.addEventListener('orientationchange', () => {
window.setTimeout(() => syncInitialViewport(true), 160)
})
// 状态栏适配
if (window.navigator.standalone) {
@@ -343,14 +432,20 @@
<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 class="loading">
<div class="effect-1 effects"></div>
<div class="effect-2 effects"></div>
<div class="effect-3 effects"></div>
<div class="loading-shell">
<div class="loading-main">
<div class="loading-logo">
<!-- Logo -->
<img src="/logo.svg" alt="MoviePilot" width="160" height="160" />
</div>
</div>
<div class="loading-footer">
<div class="loading">
<div class="effect-1 effects"></div>
<div class="effect-2 effects"></div>
<div class="effect-3 effects"></div>
</div>
</div>
</div>
<!-- 超时提示 - 默认隐藏 -->
<div id="loading-timeout"></div>
@@ -359,4 +454,4 @@
<script type="module" src="/src/main.ts"></script>
</body>
</html>
</html>

View File

@@ -1,6 +1,6 @@
{
"name": "moviepilot",
"version": "2.9.21",
"version": "2.11.3",
"private": true,
"type": "module",
"bin": "dist/service.js",
@@ -76,6 +76,7 @@
"@iconify-json/lucide": "^1.2.85",
"@iconify-json/material-symbols": "^1.2.51",
"@iconify-json/mdi": "^1.1.52",
"@iconify-json/tabler": "^1.2.23",
"@iconify/tools": "^4.0.4",
"@iconify/vue": "^4.3.0",
"@intlify/unplugin-vue-i18n": "^6.0.3",
@@ -127,4 +128,4 @@
"workbox-window": "^7.3.0"
},
"packageManager": "yarn@1.22.18"
}
}

View File

@@ -15,7 +15,7 @@ function onClick() {
<template>
<IconBtn
:class="props.innerClass ? props.innerClass : 'absolute right-3 top-3'"
:class="props.innerClass ? props.innerClass : 'absolute right-3 top-3 z-10'"
@click.stop="onClick"
>
<VIcon icon="mdi-close" />

View File

@@ -17,6 +17,7 @@ import { createRequire } from 'node:module'
// Get current directory
const __dirname = dirname(fileURLToPath(import.meta.url))
const projectSrcDir = join(__dirname, '..')
// Create require function for importing JSON files in ESM
const require = createRequire(import.meta.url)
@@ -86,36 +87,12 @@ const sources: BundleScriptConfig = {
],
icons: [
// 'mdi:home',
// 'mdi:account',
// 'mdi:login',
// 'mdi:logout',
// 'octicon:book-24',
// 'octicon:code-square-24',
'lucide:sparkles',
'material-symbols:passkey',
'line-md:loading-twotone-loop',
],
json: [
// Custom JSON file
// 'json/gg.json',
// Iconify JSON file (@iconify/json is a package name, /json/ is directory where files are, then filename)
require.resolve('@iconify-json/mdi/icons.json'),
// Custom file with only few icons
// {
// filename: require.resolve('@iconify-json/line-md/icons.json'),
// icons: [
// 'home-twotone-alt',
// 'github',
// 'document-list',
// 'document-code',
// 'image-twotone',
// ],
// },
],
json: [],
}
// Iconify component (this changes import statement in generated file)
@@ -133,6 +110,15 @@ const target = join(__dirname, 'icons-bundle.js');
*/
// eslint-disable-next-line sonarjs/cognitive-complexity
(async function () {
const scannedIcons = await collectUsedIcons(projectSrcDir)
if (sources.icons) {
sources.icons.push(...scannedIcons)
sources.icons = Array.from(new Set(sources.icons)).sort()
} else {
sources.icons = scannedIcons
}
let bundle = commonJS
? `const { addCollection } = require('${component}');\n\n`
: `import { addCollection } from '${component}';\n\n`
@@ -278,8 +264,60 @@ const target = join(__dirname, 'icons-bundle.js');
console.log(`Saved ${target} (${bundle.length} bytes)`)
})().catch((err) => {
console.error(err)
// 构建图标失败时必须终止构建,避免继续发布上一次遗留的超大 icons-bundle。
process.exitCode = 1
})
async function collectUsedIcons(rootDir: string): Promise<string[]> {
const icons = new Set<string>()
const files = await walkDirectory(rootDir)
const sourceFiles = files.filter(file => /\.(vue|ts|js|tsx|jsx)$/.test(file))
for (const file of sourceFiles) {
if (file.includes('/@iconify/')) {
continue
}
const content = await fs.readFile(file, 'utf8')
for (const match of content.matchAll(/\b(lucide|material-symbols|line-md|tabler):([a-z0-9-]+)\b/g)) {
icons.add(`${match[1]}:${match[2]}`)
}
for (const match of content.matchAll(/\bmdi:([a-z0-9-]+)\b/g)) {
icons.add(`mdi:${match[1]}`)
}
for (const match of content.matchAll(/\btabler-([a-z0-9-]+)\b/g)) {
icons.add(`tabler:${match[1]}`)
}
for (const match of content.matchAll(/\bmdi-([a-z0-9-]+)\b/g)) {
icons.add(`mdi:${match[1]}`)
}
}
return Array.from(icons).sort()
}
async function walkDirectory(dir: string): Promise<string[]> {
const entries = await fs.readdir(dir, { withFileTypes: true })
const files: string[] = []
for (const entry of entries) {
const fullPath = join(dir, entry.name)
if (entry.isDirectory()) {
files.push(...(await walkDirectory(fullPath)))
continue
}
files.push(fullPath)
}
return files
}
/**
* Remove metadata from icon set
*/

View File

@@ -19,6 +19,11 @@ export default defineComponent({
const scrollDistance = ref(window.scrollY)
const isDialogOpen = ref(false)
const wasScrolledBeforeDialog = ref(false)
let dialogObserver: MutationObserver | null = null
const handleScroll = () => {
scrollDistance.value = window.scrollY
}
// 监听弹窗状态变化
const checkDialogState = () => {
@@ -32,21 +37,25 @@ export default defineComponent({
}
onMounted(() => {
window.addEventListener('scroll', () => {
scrollDistance.value = window.scrollY
})
window.addEventListener('scroll', handleScroll)
// 初始检查弹窗状态
checkDialogState()
// 监听 DOM 变化以检测弹窗状态
const observer = new MutationObserver(checkDialogState)
observer.observe(document.documentElement, {
dialogObserver = new MutationObserver(checkDialogState)
dialogObserver.observe(document.documentElement, {
attributes: true,
attributeFilter: ['class'],
})
})
onBeforeUnmount(() => {
window.removeEventListener('scroll', handleScroll)
dialogObserver?.disconnect()
dialogObserver = null
})
return () => {
// 👉 Vertical nav
const verticalNav = h(

View File

@@ -12,6 +12,9 @@ import { globalLoadingStateManager } from '@/utils/loadingStateManager'
import { addBackgroundTimer, removeBackgroundTimer } from '@/utils/backgroundManager'
import PWAInstallPrompt from '@/components/PWAInstallPrompt.vue'
import { themeManager } from '@/utils/themeManager'
import { configureApexChartsTheme } from '@/utils/apexCharts'
const LOGIN_WALLPAPER_ROUTE = '/login'
// 生效主题
const { global: globalTheme } = useTheme()
@@ -19,6 +22,16 @@ let themeValue = localStorage.getItem('theme') || 'auto'
const autoTheme = checkPrefersColorSchemeIsDark() ? 'dark' : 'light'
globalTheme.name.value = themeValue === 'auto' ? autoTheme : themeValue
// 启动屏和 iOS safe area 在同一层显示,根节点底色需要尽早和当前主题保持一致。
function syncRootLaunchPalette() {
const { background, primary } = globalTheme.current.value.colors
document.documentElement.style.setProperty('--initial-loader-bg', background)
document.documentElement.style.setProperty('--initial-loader-color', primary)
document.documentElement.style.backgroundColor = background
document.body.style.backgroundColor = background
}
// 生效语言
const localeValue = getBrowserLocale()
setI18nLanguage(localeValue as SupportedLocale)
@@ -26,6 +39,7 @@ setI18nLanguage(localeValue as SupportedLocale)
// 检查是否登录
const authStore = useAuthStore()
const isLogin = computed(() => authStore.token)
const route = useRoute()
// 全局设置store
const globalSettingsStore = useGlobalSettingsStore()
@@ -37,17 +51,36 @@ const loginStateKey = computed(() => (isLogin.value ? 'logged-in' : 'logged-out'
const backgroundImages = ref<string[]>([])
const activeImageIndex = ref(0)
const isTransparentTheme = computed(() => globalTheme.name.value === 'transparent')
const shouldLoadBackgroundImages = computed(
() => (!isLogin.value && route.path === LOGIN_WALLPAPER_ROUTE) || (Boolean(isLogin.value) && isTransparentTheme.value),
)
let backgroundRetryTimer: number | null = null
let backgroundRequestController: AbortController | null = null
let authenticatedStateTimer: number | null = null
function getStoredNumber(key: string, fallback: number, min: number, max: number) {
const parsed = Number.parseFloat(localStorage.getItem(key) || '')
if (!Number.isFinite(parsed)) return fallback
return Math.min(max, Math.max(min, parsed))
}
function applyTransparentBackgroundSettings() {
document.documentElement.style.setProperty(
'--transparent-background-poster-opacity',
(1 - getStoredNumber('transparency-background-poster-opacity', 0, 0, 1)).toString(),
)
document.documentElement.style.setProperty(
'--transparent-background-blur',
`${getStoredNumber('transparency-background-blur', 16, 0, 30)}px`,
)
}
applyTransparentBackgroundSettings()
// 心跳检测
let heartbeatInterval: number | null = null
// ApexCharts 全局配置
declare global {
interface Window {
Apex: any
}
}
// 启动心跳
const startHeartbeat = () => {
// 如果已经有心跳,则先停止
@@ -75,56 +108,20 @@ const stopHeartbeat = () => {
}
}
// 配置 ApexCharts 全局选项
function configureApexCharts() {
if (typeof window !== 'undefined' && window.Apex) {
try {
// 获取当前主题
const currentTheme = globalTheme.name.value
const isDark = currentTheme === 'dark' || currentTheme === 'transparent'
// 数据标签
window.Apex.dataLabels = {
formatter: function (_: number, { seriesIndex, w }: { seriesIndex: number; w: any }) {
// 如果有小数点,保留两位小数,否则保留整数
const data = w.config.series[seriesIndex]
return data.toFixed(data % 1 === 0 ? 0 : 1)
},
}
// 图例
window.Apex.legend = {
labels: {
useSeriesColors: true,
},
}
// 标题
window.Apex.title = {
style: {
color: 'rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity))',
},
}
// 鼠标悬浮提示
window.Apex.tooltip = {
theme: isDark ? 'dark' : 'light',
}
} catch (error) {
console.warn('ApexCharts 全局配置失败:', error)
}
}
}
// 更新data-theme属性以便CSS选择器能正确匹配
function updateHtmlThemeAttribute(themeName: string) {
document.documentElement.setAttribute('data-theme', themeName)
document.body.setAttribute('data-theme', themeName)
syncRootLaunchPalette()
}
// 获取背景图片
async function fetchBackgroundImages() {
try {
const controller = new AbortController()
backgroundRequestController?.abort()
backgroundRequestController = new AbortController()
backgroundImages.value = await api.get(`/login/wallpapers`, {
signal: controller.signal,
signal: backgroundRequestController.signal,
})
activeImageIndex.value = 0
} catch (e) {
@@ -166,12 +163,56 @@ function startBackgroundRotation() {
}
}
function stopBackgroundLoading() {
backgroundRequestController?.abort()
backgroundRequestController = null
if (backgroundRetryTimer) {
window.clearTimeout(backgroundRetryTimer)
backgroundRetryTimer = null
}
removeBackgroundTimer('background-rotation')
}
async function initializeAuthenticatedState() {
if (!isLogin.value) return
try {
globalLoadingStateManager.setLoadingState('global-settings', true)
await globalSettingsStore.initialize()
await globalSettingsStore.loadUserSettings()
} finally {
globalLoadingStateManager.setLoadingState('global-settings', false)
}
}
function scheduleAuthenticatedStateInitialization() {
if (authenticatedStateTimer) {
window.clearTimeout(authenticatedStateTimer)
}
// 登录后会立刻发生路由切换,稍后再拉取设置可避开导航中止请求。
authenticatedStateTimer = window.setTimeout(() => {
authenticatedStateTimer = null
initializeAuthenticatedState()
}, 150)
}
// 添加logo动画效果并延迟移除加载界面
function animateAndRemoveLoader() {
const loadingBg = document.querySelector('#loading-bg') as HTMLElement
if (loadingBg) {
removeEl('#loading-bg')
document.documentElement.style.removeProperty('background')
// 只收掉启动内容,背景层保持实色直到节点被移除,避免底部 safe area 先透出页面内容。
loadingBg.classList.add('loading-complete')
window.setTimeout(() => {
removeEl('#loading-bg')
// 启动阶段的根节点锁定只在 loader 存在时生效,移除后恢复正常页面与弹窗布局。
document.documentElement.removeAttribute('data-launch-loading')
document.documentElement.style.removeProperty('overflow')
document.body.style.removeProperty('overflow')
}, 120)
}
}
@@ -180,8 +221,6 @@ async function removeLoadingWithStateCheck() {
try {
// 设置各个组件的加载状态
globalLoadingStateManager.setLoadingState('pwa-state', true)
globalLoadingStateManager.setLoadingState('global-settings', true)
globalLoadingStateManager.setLoadingState('background-images', true)
// 静默检查PWA状态恢复
const pwaController = (window as any).pwaStateController
@@ -190,22 +229,7 @@ async function removeLoadingWithStateCheck() {
}
globalLoadingStateManager.setLoadingState('pwa-state', false)
// 并行加载关键资源
await Promise.all([
globalSettingsStore.initialize().then(async () => {
// 如果已登录,加载用户相关设置
if (isLogin.value) {
await globalSettingsStore.loadUserSettings()
}
globalLoadingStateManager.setLoadingState('global-settings', false)
}),
new Promise(resolve => {
setTimeout(() => {
globalLoadingStateManager.setLoadingState('background-images', false)
resolve(void 0)
}, 50)
}),
])
await initializeAuthenticatedState()
// 等待所有加载完成
await globalLoadingStateManager.waitForAllComplete()
@@ -214,7 +238,9 @@ async function removeLoadingWithStateCheck() {
animateAndRemoveLoader()
// 检查未读消息
checkAndEmitUnreadMessages()
if (isLogin.value) {
checkAndEmitUnreadMessages()
}
} catch (error) {
// 即使出错也要移除加载界面
globalLoadingStateManager.reset()
@@ -233,7 +259,8 @@ async function loadBackgroundImages(retryCount = 0) {
if (retryCount < maxRetries) {
const baseDelay = isAbortError ? 1000 : 3000
const retryDelay = Math.min(baseDelay * Math.pow(2, retryCount), 10000)
setTimeout(() => {
backgroundRetryTimer = window.setTimeout(() => {
backgroundRetryTimer = null
loadBackgroundImages(retryCount + 1)
}, retryDelay)
}
@@ -250,7 +277,7 @@ onMounted(async () => {
}
// 配置 ApexCharts
configureApexCharts()
configureApexChartsTheme(globalTheme.name.value)
// 初始化data-theme属性
updateHtmlThemeAttribute(globalTheme.name.value)
@@ -265,24 +292,55 @@ onMounted(async () => {
// 更新HTML主题属性
updateHtmlThemeAttribute(newTheme)
// 重新配置ApexCharts以适应新主题
configureApexCharts()
configureApexChartsTheme(newTheme)
},
)
// 加载背景图片
loadBackgroundImages()
// 登录页壁纸仅在未登录登录页需要,避免其他首屏额外发起图片列表请求。
watch(
shouldLoadBackgroundImages,
shouldLoad => {
stopBackgroundLoading()
if (shouldLoad) {
loadBackgroundImages()
} else if (!isTransparentTheme.value) {
backgroundImages.value = []
}
},
{ immediate: true },
)
// 使用优化后的加载界面移除逻辑
ensureRenderComplete(() => {
nextTick(removeLoadingWithStateCheck)
})
// 启动心跳
startHeartbeat()
if (isLogin.value) {
startHeartbeat()
}
// 登录状态可能在当前单页会话中变化,这里按需补齐登录后初始化和心跳。
watch(isLogin, loggedIn => {
if (loggedIn) {
startHeartbeat()
scheduleAuthenticatedStateInitialization()
} else {
if (authenticatedStateTimer) {
window.clearTimeout(authenticatedStateTimer)
authenticatedStateTimer = null
}
stopHeartbeat()
}
})
})
onUnmounted(() => {
// 清除背景轮换定时器
removeBackgroundTimer('background-rotation')
stopBackgroundLoading()
if (authenticatedStateTimer) {
window.clearTimeout(authenticatedStateTimer)
authenticatedStateTimer = null
}
// 停止心跳
stopHeartbeat()
})
@@ -291,7 +349,11 @@ onUnmounted(() => {
<template>
<div class="app-wrapper">
<!-- 透明主题背景 -->
<div v-if="backgroundImages.length > 0 && (isTransparentTheme || !isLogin)" class="background-container">
<div
v-if="backgroundImages.length > 0 && (isTransparentTheme || !isLogin)"
class="background-container"
:class="{ 'is-transparent-theme': isTransparentTheme && isLogin }"
>
<div
v-for="(imageUrl, index) in backgroundImages"
:key="`bg-${index}-${loginStateKey}`"
@@ -356,11 +418,15 @@ onUnmounted(() => {
}
}
.background-container.is-transparent-theme .background-image.active {
opacity: var(--transparent-background-poster-opacity, 1);
}
/* 全局磨砂层 */
.global-blur-layer {
position: absolute;
z-index: 1;
backdrop-filter: blur(16px);
backdrop-filter: blur(var(--transparent-background-blur, 16px));
background-color: rgba(128, 128, 128, 30%);
block-size: 100%;
inline-size: 100%;

View File

@@ -44,6 +44,488 @@ import snippertsIniUrl from 'ace-builds/src-noconflict/snippets/ini?url'
import 'ace-builds/src-noconflict/ext-language_tools'
const aceModule = ace as typeof ace & {
define?: (moduleName: string, deps: string[], payload: (...args: any[]) => void) => void
}
function registerJinja2Mode() {
aceModule.define?.(
'ace/mode/jinja2_highlight_rules',
['require', 'exports', 'module', 'ace/lib/oop', 'ace/mode/text_highlight_rules'],
(require: any, exports: any) => {
const oop = require('../lib/oop')
const TextHighlightRules = require('./text_highlight_rules').TextHighlightRules
const Jinja2HighlightRules = function (this: any) {
const tags =
'autoescape|block|call|do|elif|else|endautoescape|endblock|endcall|endfilter|endfor|endif|endmacro|endraw|endset|endtrans|endwith|extends|filter|for|from|if|import|include|macro|raw|set|trans|with'
const filters =
'abs|attr|batch|capitalize|center|count|d|default|dictsort|e|escape|filesizeformat|first|float|forceescape|format|groupby|indent|int|items|join|last|length|list|lower|map|max|min|pprint|random|reject|rejectattr|replace|reverse|round|safe|select|selectattr|slice|sort|string|striptags|sum|title|tojson|trim|truncate|unique|upper|urlencode|urlize|wordcount|wordwrap|xmlattr'
const functions = 'cycler|dict|joiner|lipsum|namespace|range'
const tests =
'boolean|defined|divisibleby|eq|escaped|even|false|filter|float|ge|gt|in|integer|iterable|le|lower|lt|mapping|ne|none|number|odd|sameas|sequence|string|test|true|undefined|upper'
const operators = 'and|in|is|not|or'
const contextVariables =
'title|en_title|original_title|season|season_fmt|year|title_year|type|category|vote_average|poster|backdrop|season_year|actors|overview|tmdbid|imdbid|doubanid|episode_title|episode_date|original_name|name|en_name|episode|season_episode|part|customization|fps|resourceType|effect|edition|videoFormat|resource_term|releaseGroup|videoCodec|audioCodec|webSource|torrent_title|pubdate|freedate|seeders|volume_factor|hit_and_run|labels|description|site_name|size|transfer_type|file_count|total_size|err_msg|fileExt|__meta__|__mediainfo__|__torrentinfo__|__transferinfo__|__episodes_info__'
const keywordMapper = this.createKeywordMapper(
{
'keyword.control.jinja2': tags,
'keyword.operator.jinja2': operators,
'support.function.jinja2': [filters, functions, tests].join('|'),
'constant.language.jinja2': 'false|False|none|None|null|true|True',
},
'identifier',
)
const jinjaExpressionRules = [
{
token: 'string',
regex: "'",
push: 'jinja2-qstring',
},
{
token: 'string',
regex: '"',
push: 'jinja2-qqstring',
},
{
token: 'constant.numeric',
regex: /[+-]?(?:0[xX][0-9a-fA-F]+|\d+(?:\.\d*)?|\.\d+)(?:[eE][+-]?\d+)?\b/,
},
{
token: ['keyword.operator.other.jinja2', 'text', 'support.function.jinja2'],
regex: `(\\|)(\\s*)(${filters})\\b`,
},
{
token: ['keyword.operator.jinja2', 'text', 'support.function.jinja2'],
regex: `(\\bis\\b)(\\s*)(${tests})\\b`,
},
{
token: ['support.function.jinja2', 'text', 'paren.lparen'],
regex: `\\b(${functions})(\\s*)(\\()`,
},
{
token: 'variable.language.jinja2',
regex: `\\b(?:${contextVariables})\\b`,
},
{
token: keywordMapper,
regex: /[a-zA-Z_$][a-zA-Z0-9_$]*\b/,
},
{
token: 'keyword.operator.assignment.jinja2',
regex: /=|~/,
},
{
token: 'keyword.operator.comparison.jinja2',
regex: /==|!=|<=|>=|<|>/,
},
{
token: 'keyword.operator.arithmetic.jinja2',
regex: /\+|-|\/\/|\/|%|\*\*|\*/,
},
{
token: 'keyword.operator.other.jinja2',
regex: /\.{2}|\||:/,
},
{
token: 'punctuation.operator.jinja2',
regex: /[.,;?]/,
},
{
token: 'paren.lparen',
regex: /[\[({]/,
},
{
token: 'paren.rparen',
regex: /[\])}]/,
},
{
token: 'text',
regex: /\s+/,
},
]
this.$rules = {
start: [
{
token: 'comment.block.jinja2',
regex: /\{#-?/,
push: 'jinja2-comment',
},
{
token: 'constant.language.jinja2',
regex: /\{\{-?/,
push: 'jinja2-expression',
},
{
token: 'keyword.control.jinja2',
regex: /\{%-?/,
push: 'jinja2-statement',
},
],
'jinja2-comment': [
{
token: 'comment.block.jinja2',
regex: /-?#\}/,
next: 'pop',
},
{
defaultToken: 'comment.block.jinja2',
},
],
'jinja2-expression': [
{
token: 'constant.language.jinja2',
regex: /-?\}\}/,
next: 'pop',
},
...jinjaExpressionRules,
],
'jinja2-statement': [
{
token: 'keyword.control.jinja2',
regex: /-?%\}/,
next: 'pop',
},
...jinjaExpressionRules,
],
'jinja2-qqstring': [
{
token: 'constant.language.escape',
regex: /\\[\\"ntr]/,
},
{
token: 'string',
regex: '"',
next: 'pop',
},
{
defaultToken: 'string',
},
],
'jinja2-qstring': [
{
token: 'constant.language.escape',
regex: /\\[\\'ntr]/,
},
{
token: 'string',
regex: "'",
next: 'pop',
},
{
defaultToken: 'string',
},
],
}
this.normalizeRules()
}
oop.inherits(Jinja2HighlightRules, TextHighlightRules)
exports.Jinja2HighlightRules = Jinja2HighlightRules
},
)
aceModule.define?.(
'ace/mode/jinja2',
['require', 'exports', 'module', 'ace/lib/oop', 'ace/mode/text', 'ace/mode/jinja2_highlight_rules'],
(require: any, exports: any) => {
const oop = require('../lib/oop')
const TextMode = require('./text').Mode
const Jinja2HighlightRules = require('./jinja2_highlight_rules').Jinja2HighlightRules
const Mode = function (this: any) {
TextMode.call(this)
this.HighlightRules = Jinja2HighlightRules
}
oop.inherits(Mode, TextMode)
;(function (this: any) {
this.$id = 'ace/mode/jinja2'
this.blockComment = { start: '{#', end: '#}' }
}).call(Mode.prototype)
exports.Mode = Mode
},
)
aceModule.define?.('ace/snippets/jinja2', ['require', 'exports', 'module'], (_require: any, exports: any) => {
exports.snippetText =
'snippet if\n\t{% if ${1:condition} %}\n\t\t${0}\n\t{% endif %}\n' +
'snippet for\n\t{% for ${1:item} in ${2:items} %}\n\t\t${0}\n\t{% endfor %}\n' +
'snippet var\n\t{{ ${1:name} }}\n'
exports.scope = 'jinja2'
})
aceModule.define?.(
'ace/mode/jinja2_json_highlight_rules',
['require', 'exports', 'module', 'ace/lib/oop', 'ace/mode/text_highlight_rules'],
(require: any, exports: any) => {
const oop = require('../lib/oop')
const TextHighlightRules = require('./text_highlight_rules').TextHighlightRules
const Jinja2JsonHighlightRules = function (this: any) {
const tags =
'autoescape|block|call|do|elif|else|endautoescape|endblock|endcall|endfilter|endfor|endif|endmacro|endraw|endset|endtrans|endwith|extends|filter|for|from|if|import|include|macro|raw|set|trans|with'
const filters =
'abs|attr|batch|capitalize|center|count|d|default|dictsort|e|escape|filesizeformat|first|float|forceescape|format|groupby|indent|int|items|join|last|length|list|lower|map|max|min|pprint|random|reject|rejectattr|replace|reverse|round|safe|select|selectattr|slice|sort|string|striptags|sum|title|tojson|trim|truncate|unique|upper|urlencode|urlize|wordcount|wordwrap|xmlattr'
const functions = 'cycler|dict|joiner|lipsum|namespace|range'
const tests =
'boolean|defined|divisibleby|eq|escaped|even|false|filter|float|ge|gt|in|integer|iterable|le|lower|lt|mapping|ne|none|number|odd|sameas|sequence|string|test|true|undefined|upper'
const operators = 'and|in|is|not|or'
const contextVariables =
'title|en_title|original_title|season|season_fmt|year|title_year|type|category|vote_average|poster|backdrop|season_year|actors|overview|tmdbid|imdbid|doubanid|episode_title|episode_date|original_name|name|en_name|episode|season_episode|part|customization|fps|resourceType|effect|edition|videoFormat|resource_term|releaseGroup|videoCodec|audioCodec|webSource|torrent_title|pubdate|freedate|seeders|volume_factor|hit_and_run|labels|description|site_name|size|transfer_type|file_count|total_size|err_msg|fileExt|__meta__|__mediainfo__|__torrentinfo__|__transferinfo__|__episodes_info__'
const keywordMapper = this.createKeywordMapper(
{
'keyword.control.jinja2': tags,
'keyword.operator.jinja2': operators,
'support.function.jinja2': [filters, functions, tests].join('|'),
'constant.language.jinja2': 'false|False|none|None|null|true|True',
},
'identifier',
)
const jinjaRules = [
{
token: 'string',
regex: "'",
push: 'jinja2-json-qstring',
},
{
token: 'constant.language.escape',
regex: /\\(?:x[0-9a-fA-F]{2}|u[0-9a-fA-F]{4}|["\\\/bfnrt])/,
},
{
token: 'constant.numeric',
regex: /[+-]?(?:0[xX][0-9a-fA-F]+|\d+(?:\.\d*)?|\.\d+)(?:[eE][+-]?\d+)?\b/,
},
{
token: ['keyword.operator.other.jinja2', 'text', 'support.function.jinja2'],
regex: `(\\|)(\\s*)(${filters})\\b`,
},
{
token: ['keyword.operator.jinja2', 'text', 'support.function.jinja2'],
regex: `(\\bis\\b)(\\s*)(${tests})\\b`,
},
{
token: ['support.function.jinja2', 'text', 'paren.lparen'],
regex: `\\b(${functions})(\\s*)(\\()`,
},
{
token: 'variable.language.jinja2',
regex: `\\b(?:${contextVariables})\\b`,
},
{
token: keywordMapper,
regex: /[a-zA-Z_$][a-zA-Z0-9_$]*\b/,
},
{
token: 'keyword.operator.assignment.jinja2',
regex: /=|~/,
},
{
token: 'keyword.operator.comparison.jinja2',
regex: /==|!=|<=|>=|<|>/,
},
{
token: 'keyword.operator.arithmetic.jinja2',
regex: /\+|-|\/\/|\/|%|\*\*|\*/,
},
{
token: 'keyword.operator.other.jinja2',
regex: /\.{2}|\||:/,
},
{
token: 'punctuation.operator.jinja2',
regex: /[.,;?]/,
},
{
token: 'paren.lparen',
regex: /[\[({]/,
},
{
token: 'paren.rparen',
regex: /[\])}]/,
},
{
token: 'text',
regex: /\s+/,
},
]
this.$rules = {
start: [
{
token: 'variable',
regex: /"(?:(?:\\.)|(?:[^"\\]))*?"\s*(?=:)/,
},
{
token: 'string',
regex: '"',
push: 'json-string',
},
{
token: 'constant.numeric',
regex: /0[xX][0-9a-fA-F]+\b/,
},
{
token: 'constant.numeric',
regex: /[+-]?\d+(?:(?:\.\d*)?(?:[eE][+-]?\d+)?)?\b/,
},
{
token: 'constant.language.boolean',
regex: /(?:true|false|null)\b/,
},
{
token: 'text',
regex: /['](?:(?:\\.)|(?:[^'\\]))*?[']/,
},
{
token: 'comment',
regex: /\/\/.*$/,
},
{
token: 'comment.start',
regex: /\/\*/,
push: 'comment',
},
{
token: 'paren.lparen',
regex: /[[({]/,
},
{
token: 'paren.rparen',
regex: /[\])}]/,
},
{
token: 'punctuation.operator',
regex: /[:,]/,
},
{
token: 'text',
regex: /\s+/,
},
],
'json-string': [
{
token: 'constant.language.escape',
regex: /\\(?:x[0-9a-fA-F]{2}|u[0-9a-fA-F]{4}|["\\\/bfnrt])/,
},
{
token: 'comment.block.jinja2',
regex: /\{#-?/,
push: 'jinja2-json-comment',
},
{
token: 'constant.language.jinja2',
regex: /\{\{-?/,
push: 'jinja2-json-expression',
},
{
token: 'keyword.control.jinja2',
regex: /\{%-?/,
push: 'jinja2-json-statement',
},
{
token: 'string',
regex: /"|$/,
next: 'pop',
},
{
defaultToken: 'string',
},
],
comment: [
{
token: 'comment.end',
regex: /\*\//,
next: 'pop',
},
{
defaultToken: 'comment',
},
],
'jinja2-json-comment': [
{
token: 'comment.block.jinja2',
regex: /-?#\}/,
next: 'pop',
},
{
defaultToken: 'comment.block.jinja2',
},
],
'jinja2-json-expression': [
{
token: 'constant.language.jinja2',
regex: /-?\}\}/,
next: 'pop',
},
...jinjaRules,
],
'jinja2-json-statement': [
{
token: 'keyword.control.jinja2',
regex: /-?%\}/,
next: 'pop',
},
...jinjaRules,
],
'jinja2-json-qstring': [
{
token: 'constant.language.escape',
regex: /\\[\\'ntr]/,
},
{
token: 'string',
regex: "'",
next: 'pop',
},
{
defaultToken: 'string',
},
],
}
this.normalizeRules()
}
oop.inherits(Jinja2JsonHighlightRules, TextHighlightRules)
exports.Jinja2JsonHighlightRules = Jinja2JsonHighlightRules
},
)
aceModule.define?.(
'ace/mode/jinja2_json',
['require', 'exports', 'module', 'ace/lib/oop', 'ace/mode/text', 'ace/mode/jinja2_json_highlight_rules'],
(require: any, exports: any) => {
const oop = require('../lib/oop')
const TextMode = require('./text').Mode
const Jinja2JsonHighlightRules = require('./jinja2_json_highlight_rules').Jinja2JsonHighlightRules
const Mode = function (this: any) {
TextMode.call(this)
this.HighlightRules = Jinja2JsonHighlightRules
}
oop.inherits(Mode, TextMode)
;(function (this: any) {
this.lineCommentStart = '//'
this.blockComment = { start: '/*', end: '*/' }
this.$id = 'ace/mode/jinja2_json'
}).call(Mode.prototype)
exports.Mode = Mode
},
)
}
ace.config.setModuleUrl('ace/mode/json', modeJsonUrl)
ace.config.setModuleUrl('ace/mode/javascript', modeJavascriptUrl)
ace.config.setModuleUrl('ace/mode/html', modeHtmlUrl)
@@ -61,9 +543,10 @@ ace.config.setModuleUrl('ace/mode/yaml_worker', workerYamlUrl)
ace.config.setModuleUrl('ace/mode/css_worker', workerCssUrl)
ace.config.setModuleUrl('ace/snippets/html', snippetsHtmlUrl)
ace.config.setModuleUrl('ace/snippets/javascript', snippetsJsUrl)
ace.config.setModuleUrl('ace/snippets/javascript', snippetsYamlUrl)
ace.config.setModuleUrl('ace/snippets/yaml', snippetsYamlUrl)
ace.config.setModuleUrl('ace/snippets/json', snippetsJsonUrl)
ace.config.setModuleUrl('ace/snippets/css', snippertsCssUrl)
ace.config.setModuleUrl('ace/snippets/ini', snippertsIniUrl)
registerJinja2Mode()
ace.require('ace/ext/language_tools')

View File

@@ -68,6 +68,10 @@ export const mediaServerOptions = [
value: 'emby',
title: i18n.global.t('setting.system.emby'),
},
{
value: 'zspace',
title: i18n.global.t('setting.system.zspace'),
},
{
value: 'jellyfin',
title: i18n.global.t('setting.system.jellyfin'),
@@ -282,6 +286,10 @@ export const notificationSwitchOptions = [
title: i18n.global.t('notificationSwitch.plugin'),
value: '插件',
},
{
title: i18n.global.t('notificationSwitch.agent'),
value: '智能体',
},
{
title: i18n.global.t('notificationSwitch.other'),
value: '其它',

View File

@@ -58,6 +58,8 @@ export interface Subscribe {
sites: number[]
// 是否洗版数字或者boolean
best_version: any
// 是否只洗全集整包数字或者boolean
best_version_full?: any
// 使用 imdbid 搜索
search_imdbid?: any
// 当前优先级
@@ -656,6 +658,17 @@ export interface Plugin {
page_open?: boolean
}
// 插件侧栏全页导航项(与后端 PluginSidebarNavItem 对齐)
export interface PluginSidebarNavItem {
plugin_id: string
nav_key: string
title: string
icon: string
section: 'start' | 'discovery' | 'subscribe' | 'organize' | 'system'
permission?: 'subscribe' | 'discovery' | 'search' | 'manage' | 'admin' | null
order: number
}
// 渲染结构
export interface RenderProps {
component: string
@@ -1134,7 +1147,7 @@ export interface StorageConf {
export interface MediaServerConf {
// 名称
name: string
// 类型 emby/jellyfin/plex/trimemedia/ugreen
// 类型 emby/zspace/jellyfin/plex/trimemedia/ugreen
type: string
// 配置
config: { [key: string]: any }
@@ -1300,6 +1313,57 @@ export interface TransferForm {
library_category_folder?: boolean
// 剧集组编号
episode_group?: string
// 预览模式
preview?: boolean
}
// 手动整理请求
export interface ManualTransferPayload extends TransferForm {}
// 手动整理预览统计
export interface ManualTransferPreviewSummary {
// 总数
total: number
// 成功数
success: number
// 失败数
failed: number
}
// 手动整理预览项
export interface ManualTransferPreviewItem {
// 原始路径
source?: string
// 目标路径
target?: string
// 目标目录
target_dir?: string
// 是否成功
success?: boolean
// 提示信息
message?: string
// 媒体类型
type?: string
// 媒体标题
title?: string
// 季
season?: number | string
// 开始集
episode?: number | string
// 结束集
episode_end?: number | string
// Part
part?: string
}
// 手动整理预览数据
export interface ManualTransferPreviewData {
// 统计信息
summary: ManualTransferPreviewSummary
// 预览结果
items: ManualTransferPreviewItem[]
// 额外消息
message?: string
}
// 整理队列

Binary file not shown.

After

Width:  |  Height:  |  Size: 63 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.2 KiB

View File

@@ -5,6 +5,8 @@ import FileNavigator from './filebrowser/FileNavigator.vue'
import type { EndPoints, FileItem, StorageConf } from '@/api/types'
import { storageIconDict } from '@/api/constants'
import type { AxiosInstance } from 'axios'
import { useDynamicButton } from '@/composables/useDynamicButton'
import { usePWA } from '@/composables/usePWA'
// LocalStorage keys
const SORT_KEY = 'fileBrowser.sort'
@@ -33,6 +35,9 @@ const props = defineProps({
// 对外事件
const emit = defineEmits(['pathchanged'])
const route = useRoute()
const { appMode } = usePWA()
const toolbarRef = ref<InstanceType<typeof FileToolbar> | null>(null)
const fileIcons = {
// 压缩包
@@ -123,6 +128,18 @@ const fileIcons = {
other: 'mdi-file-outline',
}
function openNewFolderDialog() {
toolbarRef.value?.openNewFolderDialog()
}
const showFloatingNewFolderAction = computed(() => route.path === '/filemanager')
useDynamicButton({
icon: 'mdi-folder-plus-outline',
onClick: openNewFolderDialog,
show: computed(() => appMode.value && showFloatingNewFolderAction.value),
})
// 加载次数
const loading = ref(0)
@@ -254,12 +271,14 @@ function stopDrag() {
<div class="mx-auto" :loading="loading > 0">
<div v-if="item">
<FileToolbar
ref="toolbarRef"
:sort="sort"
:item="item"
:itemstack="itemstack"
:storages="storagesArray"
:endpoints="endpoints"
:axios="axios"
:show-new-folder-button="!showFloatingNewFolderAction"
@storagechanged="storageChanged"
@pathchanged="pathChanged"
@foldercreated="refreshPending = true"
@@ -301,6 +320,18 @@ function stopDrag() {
</div>
</div>
</div>
<Teleport to="body" v-if="!appMode && showFloatingNewFolderAction">
<div class="compact-fab-stack">
<VFab
icon="mdi-folder-plus-outline"
color="primary"
appear
class="compact-fab compact-fab--primary"
@click="openNewFolderDialog"
/>
</div>
</Teleport>
</template>
<style scoped>

View File

@@ -101,19 +101,21 @@ function onClose() {
<template>
<div>
<VCard variant="tonal" @click="openRuleInfoDialog">
<span class="absolute top-3 right-12">
<IconBtn>
<VCard variant="tonal" class="app-card-shell" @click="openRuleInfoDialog">
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<h5 class="text-h6 mb-1">{{ props.rule.name }}</h5>
<div class="text-body-1 mb-3">{{ props.rule.id }}</div>
<VCardText class="app-card-summary app-card-summary--double-action app-card-summary--title-subtitle">
<div class="app-card-summary__content">
<h5 class="app-card-summary__title text-h6">{{ props.rule.name }}</h5>
<div class="app-card-summary__subtitle text-body-1">{{ props.rule.id }}</div>
</div>
<div class="app-card-summary__media" aria-hidden="true">
<VImg :src="filter_svg" contain class="app-card-summary__image" />
</div>
<VImg :src="filter_svg" cover class="mt-7" max-width="3rem" />
</VCardText>
</VCard>
<VDialog

View File

@@ -195,7 +195,7 @@ watch(
</script>
<template>
<VCard variant="tonal" :width="props.width" :height="props.height">
<VCard variant="tonal" class="app-card-shell" :width="props.width" :height="props.height">
<VDialogCloseBtn @click="onClose" />
<VCardItem>
<VTextField
@@ -204,8 +204,8 @@ watch(
:label="t('directory.alias')"
class="me-20 text-high-emphasis font-weight-bold"
/>
<span class="absolute top-3 right-12">
<IconBtn>
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>

View File

@@ -252,18 +252,19 @@ onUnmounted(() => {
<VCard
v-bind="hover.props"
variant="tonal"
class="app-card-shell"
@click="openDownloaderInfoDialog"
:class="{ 'transition transform-cpu duration-300 -translate-y-1': hover.isHovering }"
>
<VDialogCloseBtn @click="onClose" />
<span class="absolute top-3 right-12">
<IconBtn>
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<VCardText class="flex justify-space-between align-center gap-4">
<div class="align-self-start flex-1">
<div class="flex items-center">
<VCardText class="app-card-summary app-card-summary--double-action">
<div class="app-card-summary__content">
<div class="app-card-summary__title-row">
<VBadge
v-if="props.downloader.default && props.downloader.enabled"
dot
@@ -271,18 +272,21 @@ onUnmounted(() => {
color="success"
class="me-1"
/>
<span class="text-h6">{{ downloader.name }}</span>
<span class="app-card-summary__title text-h6">{{ downloader.name }}</span>
</div>
<div v-if="downloaderDict[downloader.type] && props.downloader.enabled" class="mt-1 flex flex-wrap text-sm">
<span class="me-2">{{ `${formatFileSize(upload_rate, 1)}/s ` }}</span>
<span>{{ `${formatFileSize(download_rate, 1)}/s` }}</span>
<div
v-if="downloaderDict[downloader.type] && props.downloader.enabled"
class="app-card-summary__meta text-sm"
>
<span class="app-card-summary__meta-item">{{ `${formatFileSize(upload_rate, 1)}/s` }}</span>
<span class="app-card-summary__meta-item">{{ `${formatFileSize(download_rate, 1)}/s` }}</span>
</div>
<div v-else-if="!downloaderDict[downloader.type]" class="mt-1 flex flex-wrap text-sm">
<span class="me-2">自定义下载器</span>
<div v-else-if="!downloaderDict[downloader.type]" class="app-card-summary__subtitle text-sm">
自定义下载器
</div>
</div>
<div class="h-20">
<VImg :src="getIcon" cover class="mt-8 me-3" max-width="3rem" min-width="3rem" />
<div class="app-card-summary__media" aria-hidden="true">
<VImg :src="getIcon" contain class="app-card-summary__image" />
</div>
</VCardText>
</VCard>
@@ -342,11 +346,23 @@ onUnmounted(() => {
prepend-inner-icon="mdi-server"
/>
</VCol>
<VCol cols="12">
<VTextField
v-model="downloaderInfo.config.apikey"
type="password"
:label="t('downloader.apiKey')"
:hint="t('downloader.qbittorrentApiKeyHint')"
persistent-hint
active
prepend-inner-icon="mdi-key-variant"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="downloaderInfo.config.username"
:label="t('downloader.username')"
:hint="t('downloader.username')"
:disabled="!!downloaderInfo.config.apikey"
persistent-hint
active
prepend-inner-icon="mdi-account"
@@ -358,6 +374,7 @@ onUnmounted(() => {
type="password"
:label="t('downloader.password')"
:hint="t('downloader.password')"
:disabled="!!downloaderInfo.config.apikey"
persistent-hint
active
prepend-inner-icon="mdi-lock"

View File

@@ -45,15 +45,15 @@ onMounted(() => {
</script>
<template>
<VCard variant="tonal">
<span class="absolute top-3 right-12">
<IconBtn>
<VCard variant="tonal" class="app-card-shell">
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<VDialogCloseBtn @click="onClose" />
<VCardItem>
<VCardTitle>{{ t('filterRule.priority') }} {{ props.pri }}</VCardTitle>
<VCardTitle class="pr-8">{{ t('filterRule.priority') }} {{ props.pri }}</VCardTitle>
<VRow>
<VCol>
<VAutocomplete

View File

@@ -1,10 +1,8 @@
<script lang="ts" setup>
import draggable from 'vuedraggable'
import { copyToClipboard } from '@/@core/utils/navigator'
import { CustomRule, FilterRuleGroup } from '@/api/types'
import FilterRuleCard from '@/components/cards/FilterRuleCard.vue'
import { useToast } from 'vue-toastification'
import ImportCodeDialog from '@/components/dialog/ImportCodeDialog.vue'
import filter_group_svg from '@images/svg/filter-group.svg'
import { cloneDeep } from 'lodash-es'
import { useI18n } from 'vue-i18n'
@@ -16,6 +14,10 @@ const display = useDisplay()
// 获取i18n实例
const { t } = useI18n()
// 规则组详情弹窗内才需要拖拽和导入代码,避免规则组卡片列表首屏带入重交互依赖。
const Draggable = defineAsyncComponent(() => import('vuedraggable').then(module => module.default))
const ImportCodeDialog = defineAsyncComponent(() => import('@/components/dialog/ImportCodeDialog.vue'))
// 输入参数
const props = defineProps({
// 单个规则组
@@ -205,22 +207,24 @@ function onClose() {
<template>
<div>
<VCard variant="tonal" @click="opengroupInfoDialog">
<span class="absolute top-3 right-12">
<IconBtn>
<VCard variant="tonal" class="app-card-shell" @click="opengroupInfoDialog">
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<h5 class="text-h6 mb-1">{{ props.group.name }}</h5>
<div class="text-body-1 mb-3">
<VCardText class="app-card-summary app-card-summary--double-action app-card-summary--title-subtitle">
<div class="app-card-summary__content">
<h5 class="app-card-summary__title text-h6">{{ props.group.name }}</h5>
<div class="app-card-summary__subtitle text-body-1">
<span v-if="!props.group.category">{{ props.group.media_type || t('common.all') }}</span>
<span v-else>{{ props.group.category }}</span>
</div>
</div>
<VImg :src="filter_group_svg" cover class="mt-10" max-width="3rem" />
<div class="app-card-summary__media" aria-hidden="true">
<VImg :src="filter_group_svg" contain class="app-card-summary__image" />
</div>
</VCardText>
</VCard>
<VDialog
@@ -271,7 +275,7 @@ function onClose() {
</VRow>
</VCardItem>
<VCardText>
<draggable
<Draggable
v-model="filterRuleCards"
handle=".cursor-move"
item-key="pri"
@@ -289,7 +293,7 @@ function onClose() {
@close="filterCardClose(element.pri)"
/>
</template>
</draggable>
</Draggable>
<div class="text-center" v-if="filterRuleCards.length == 0">{{ t('filterRule.add') }}</div>
</VCardText>
<VCardActions class="pt-3">

View File

@@ -40,6 +40,7 @@ function imageErrorHandler() {
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 === 'zspace') return getLogoUrl('zspace')
else if (props.media?.server_type === 'jellyfin') return jellyfin
else if (props.media?.server_type === 'trimemedia') return getLogoUrl('trimemedia')
else if (props.media?.server_type === 'ugreen') return getLogoUrl('ugreen')

View File

@@ -14,6 +14,12 @@ import SubscribeSeasonDialog from '../dialog/SubscribeSeasonDialog.vue'
import { useI18n } from 'vue-i18n'
import { mediaTypeDict } from '@/api/constants'
import { hasPermission } from '@/utils/permission'
import {
getCachedMediaExistsStatus,
getCachedMediaSubscribeStatus,
setCachedMediaExistsStatus,
setCachedMediaSubscribeStatus,
} from '@/utils/mediaStatusCache'
// 国际化
const { t } = useI18n()
@@ -123,6 +129,22 @@ function getMediaId() {
else return `${props.media?.mediaid_prefix}:${props.media?.media_id}`
}
function getSubscribeStatusKey(season: number | null = props.media?.season ?? null) {
return `${getMediaId()}::${season ?? 'all'}`
}
function getExistsStatusKey() {
return [
props.media?.tmdb_id ?? '',
props.media?.title ?? '',
props.media?.year ?? '',
props.media?.season ?? '',
props.media?.type ?? '',
props.media?.mediaid_prefix ?? '',
props.media?.media_id ?? '',
].join('::')
}
// 角标颜色
function getChipColor(type: string) {
if (type === '电影') return 'border-blue-500 bg-blue-600'
@@ -167,6 +189,7 @@ async function addSubscribe(season: number | null = null, best_version: number =
if (result.success) {
// 订阅成功
isSubscribed.value = true
setCachedMediaSubscribeStatus(getSubscribeStatusKey(season), true)
}
// 提示
@@ -213,6 +236,7 @@ async function removeSubscribe() {
if (result.success) {
isSubscribed.value = false
setCachedMediaSubscribeStatus(getSubscribeStatusKey(props.media?.season ?? null), false)
$toast.success(`${props.media?.title} ${t('subscribe.cancelSuccess')}`)
} else {
$toast.error(`${props.media?.title} ${t('subscribe.cancelFailed', { message: result.message })}`)
@@ -227,8 +251,10 @@ async function removeSubscribe() {
// 查询当前媒体是否已订阅
async function handleCheckSubscribe() {
try {
const result = await checkSubscribe(props.media?.season ?? null)
if (result) isSubscribed.value = true
const subscribed = await getCachedMediaSubscribeStatus(getSubscribeStatusKey(props.media?.season ?? null), () =>
checkSubscribe(props.media?.season ?? null),
)
isSubscribed.value = subscribed
} catch (error) {
console.error(error)
}
@@ -237,25 +263,22 @@ async function handleCheckSubscribe() {
// 查询当前媒体是否已入库
async function handleCheckExists() {
try {
// 对于总集数为 0 的电视剧季TMDB 未返回有效集数),不展示“已入库”角标,避免误判
const totalEpisode = props.media?.total_episode ?? props.media?.episode_count ?? props.media?.number_of_episodes ?? 0
const exists = await getCachedMediaExistsStatus(getExistsStatusKey(), async () => {
const result: { [key: string]: any } = await api.get('mediaserver/exists', {
params: {
tmdbid: props.media?.tmdb_id,
title: props.media?.title,
year: props.media?.year,
season: props.media?.season,
mtype: props.media?.type,
},
})
if (props.media?.type === '电视剧' && totalEpisode === 0) {
isExists.value = false
return
}
const result: { [key: string]: any } = await api.get('mediaserver/exists', {
params: {
tmdbid: props.media?.tmdb_id,
title: props.media?.title,
year: props.media?.year,
season: props.media?.season,
mtype: props.media?.type,
},
return Boolean(result.success)
})
if (result.success) isExists.value = true
isExists.value = exists
setCachedMediaExistsStatus(getExistsStatusKey(), exists)
} catch (error) {
console.error(error)
}
@@ -273,12 +296,14 @@ async function checkSubscribe(season: number | null) {
},
})
return result.id || null
} catch (error) {
console.error(error)
}
return Boolean(result.id)
} catch (error: any) {
if (error?.response?.status === 404) {
return false
}
return null
throw error
}
}
// 查询订阅弹窗规则

View File

@@ -121,6 +121,8 @@ const getIcon = computed(() => {
switch (props.mediaserver.type) {
case 'emby':
return getLogoUrl('emby')
case 'zspace':
return getLogoUrl('zspace')
case 'jellyfin':
return getLogoUrl('jellyfin')
case 'trimemedia':
@@ -199,21 +201,27 @@ onMounted(() => {
</script>
<template>
<div>
<VCard variant="tonal" @click="openMediaServerInfoDialog">
<VCard variant="tonal" class="app-card-shell" @click="openMediaServerInfoDialog">
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start flex-1">
<div class="text-h6 mb-1">{{ mediaserver.name }}</div>
<div v-if="mediaServerDict[mediaserver.type] && mediaserver.enabled" class="text-sm mt-5 flex flex-wrap">
<span v-for="item in infoItems" :key="item.title" class="me-2 mb-1">
<VIcon rounded :icon="item.avatar" class="me-1" />{{ item.amount }}
<VCardText class="app-card-summary app-card-summary--single-action">
<div class="app-card-summary__content">
<div class="app-card-summary__title text-h6">{{ mediaserver.name }}</div>
<div
v-if="mediaServerDict[mediaserver.type] && mediaserver.enabled"
class="grid min-h-6 grid-cols-3 gap-2 text-sm text-medium-emphasis"
>
<span v-for="item in infoItems" :key="item.title" class="flex min-w-0 items-center">
<VIcon rounded :icon="item.avatar" class="me-1 shrink-0" />
<span class="truncate">{{ item.amount }}</span>
</span>
</div>
<div v-else-if="!mediaServerDict[mediaserver.type]" class="text-sm mt-5 flex flex-wrap">
<span class="me-2 mb-1">自定义媒体服务器</span>
<div v-else-if="!mediaServerDict[mediaserver.type]" class="app-card-summary__subtitle text-sm">
自定义媒体服务器
</div>
</div>
<VImg :src="getIcon" class="mt-8 me-3 max-h-12" max-width="3rem" min-width="3rem" />
<div class="app-card-summary__media" aria-hidden="true">
<VImg :src="getIcon" contain class="app-card-summary__image" />
</div>
</VCardText>
</VCard>
@@ -312,6 +320,77 @@ onMounted(() => {
/>
</VCol>
</VRow>
<VRow v-else-if="mediaServerInfo.type == 'zspace'">
<VCol cols="12" md="6">
<VTextField
v-model="mediaServerInfo.name"
:label="t('common.name')"
:placeholder="t('mediaserver.nameRequired')"
:hint="t('mediaserver.serverAlias')"
persistent-hint
active
prepend-inner-icon="mdi-label"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="mediaServerInfo.config.host"
:label="t('mediaserver.host')"
:placeholder="t('mediaserver.hostPlaceholder')"
:hint="t('mediaserver.hostHint')"
persistent-hint
active
prepend-inner-icon="mdi-server"
/>
</VCol>
<VCol cols="12">
<VTextField
v-model="mediaServerInfo.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="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
type="password"
v-model="mediaServerInfo.config.password"
:label="t('mediaserver.password')"
persistent-hint
active
prepend-inner-icon="mdi-lock"
/>
</VCol>
<VCol cols="12">
<VAutocomplete
v-model="mediaServerInfo.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(mediaServerInfo.name)"
/>
</VCol>
</VRow>
<VRow v-else-if="mediaServerInfo.type == 'jellyfin'">
<VCol cols="12" md="6">
<VTextField

View File

@@ -24,6 +24,7 @@ const imageLoadError = ref(false)
// 初始化 markdown-it
const md = new MarkdownIt({
html: true,
breaks: true,
linkify: true,
typographer: true,
})

View File

@@ -1,8 +1,10 @@
<script setup lang="ts">
import api from '@/api'
import { NotificationConf } from '@/api/types'
import { getLogoUrl } from '@/utils/imageUtils'
import { useToast } from 'vue-toastification'
import { cloneDeep } from 'lodash-es'
import QRCode from 'qrcode'
import { useI18n } from 'vue-i18n'
import { useDisplay } from 'vuetify'
@@ -45,6 +47,8 @@ const notificationInfo = ref<NotificationConf>({
// 各通知类型的名称字典
const notificationTypeNames: { [key: string]: string } = {
wechat: t('notification.wechat.name'),
feishu: t('notification.feishu.name'),
wechatclawbot: t('notification.wechatclawbot.name'),
telegram: t('notification.telegram.name'),
qqbot: t('notification.qqbot.name'),
vocechat: t('notification.vocechat.name'),
@@ -64,9 +68,34 @@ const notificationTypes = [
{ value: '媒体服务器', title: t('notificationSwitch.mediaServer') },
{ value: '手动处理', title: t('notificationSwitch.manual') },
{ value: '插件', title: t('notificationSwitch.plugin') },
{ value: '智能体', title: t('notificationSwitch.agent') },
{ value: '其它', title: t('notificationSwitch.other') },
]
interface WechatClawBotStatus {
connected?: boolean
account_id?: string | null
qrcode?: string | null
qrcode_url?: string | null
qrcode_status?: string | null
qrcode_updated_at?: number | null
known_targets?: Array<{ userid: string; username: string; last_active?: number | null }>
default_target?: string | null
base_url?: string | null
}
interface WechatClawBotStatusFetchOptions {
autoGenerateQrcode?: boolean
silent?: boolean
autoRefreshExpired?: boolean
showErrorToast?: boolean
}
interface WechatClawBotRefreshOptions {
silent?: boolean
showToast?: boolean
}
function ensureWechatConfigDefaults(notification: NotificationConf) {
if (notification.type !== 'wechat') {
return
@@ -82,6 +111,89 @@ function ensureWechatConfigDefaults(notification: NotificationConf) {
}
}
function ensureWechatClawBotConfigDefaults(notification: NotificationConf) {
if (notification.type !== 'wechatclawbot') {
return
}
if (!notification.config) {
notification.config = {}
}
if (!notification.config.WECHATCLAWBOT_BASE_URL) {
notification.config.WECHATCLAWBOT_BASE_URL = 'https://ilinkai.weixin.qq.com'
}
if (!notification.config.WECHATCLAWBOT_POLL_TIMEOUT) {
notification.config.WECHATCLAWBOT_POLL_TIMEOUT = 25
}
}
const wechatClawBotLoading = ref(false)
const wechatClawBotActionLoading = ref(false)
const wechatClawBotStatus = ref<WechatClawBotStatus | null>(null)
const wechatClawBotQrImage = ref('')
const wechatClawBotExpiredRefreshAttempted = ref(false)
let wechatClawBotTimer: number | null = null
function isImageSource(value?: string | null) {
if (!value) {
return false
}
const raw = value.trim()
if (!raw) {
return false
}
if (raw.toLowerCase().startsWith('data:image/')) {
return true
}
return /\.(png|jpe?g|gif|webp|svg)(\?|$)/i.test(raw)
}
function getWechatClawBotQrText(status?: WechatClawBotStatus | null) {
const directUrl = status?.qrcode_url?.trim()
if (directUrl) {
return directUrl
}
const qrcode = status?.qrcode?.trim()
if (!qrcode) {
return ''
}
return `https://liteapp.weixin.qq.com/q/7GiQu1?qrcode=${encodeURIComponent(qrcode)}&bot_type=3`
}
async function updateWechatClawBotQrImage(status?: WechatClawBotStatus | null) {
const directUrl = status?.qrcode_url?.trim()
if (isImageSource(directUrl)) {
wechatClawBotQrImage.value = directUrl || ''
return
}
const qrText = getWechatClawBotQrText(status)
if (!qrText) {
wechatClawBotQrImage.value = ''
return
}
try {
wechatClawBotQrImage.value = await QRCode.toDataURL(qrText, {
width: 220,
margin: 1,
})
} catch (error) {
console.error(error)
wechatClawBotQrImage.value = ''
}
}
function getWechatClawBotRequestParams(extraParams: Record<string, any> = {}) {
const config = notificationInfo.value.config || {}
return {
source: notificationInfo.value.name,
fallback_source: props.notification.name,
WECHATCLAWBOT_BASE_URL: config.WECHATCLAWBOT_BASE_URL,
WECHATCLAWBOT_DEFAULT_TARGET: config.WECHATCLAWBOT_DEFAULT_TARGET,
WECHATCLAWBOT_ADMINS: config.WECHATCLAWBOT_ADMINS,
WECHATCLAWBOT_POLL_TIMEOUT: config.WECHATCLAWBOT_POLL_TIMEOUT,
...extraParams,
}
}
const isWechatBotMode = computed({
get: () => notificationInfo.value.config?.WECHAT_MODE === 'bot',
set: value => {
@@ -100,7 +212,14 @@ function openNotificationInfoDialog() {
// 替换成深复制,避免修改时影响原数据
notificationInfo.value = cloneDeep(props.notification)
ensureWechatConfigDefaults(notificationInfo.value)
ensureWechatClawBotConfigDefaults(notificationInfo.value)
notificationInfoDialog.value = true
if (notificationInfo.value.type === 'wechatclawbot') {
fetchWechatClawBotStatus({
autoGenerateQrcode: true,
autoRefreshExpired: true,
})
}
}
// 保存详情数据
@@ -116,16 +235,191 @@ function saveNotificationInfo() {
return
}
ensureWechatConfigDefaults(notificationInfo.value)
ensureWechatClawBotConfigDefaults(notificationInfo.value)
notificationInfoDialog.value = false
emit('change', notificationInfo.value, props.notification.name)
emit('done')
}
function clearWechatClawBotTimer() {
if (wechatClawBotTimer) {
window.clearTimeout(wechatClawBotTimer)
wechatClawBotTimer = null
}
}
function scheduleWechatClawBotRefresh() {
clearWechatClawBotTimer()
if (!notificationInfoDialog.value || notificationInfo.value.type !== 'wechatclawbot') {
return
}
const connected = wechatClawBotStatus.value?.connected
const pendingStatus = ['waiting', 'scanned'].includes((wechatClawBotStatus.value?.qrcode_status || '').toLowerCase())
if (connected || pendingStatus) {
wechatClawBotTimer = window.setTimeout(() => {
fetchWechatClawBotStatus({
silent: true,
autoRefreshExpired: true,
})
}, connected ? 10000 : 3000)
}
}
async function fetchWechatClawBotStatus(options: WechatClawBotStatusFetchOptions = {}) {
const {
autoGenerateQrcode = false,
silent = false,
autoRefreshExpired = false,
showErrorToast = true,
} = options
if (notificationInfo.value.type !== 'wechatclawbot' || !notificationInfo.value.name) {
return
}
if (!silent) {
wechatClawBotLoading.value = true
}
try {
const result: { [key: string]: any } = await api.get('notification/wechatclawbot/status', {
params: getWechatClawBotRequestParams({ auto_generate_qrcode: autoGenerateQrcode }),
})
if (result.success) {
wechatClawBotStatus.value = result.data
await updateWechatClawBotQrImage(result.data)
const status = (result.data?.qrcode_status || '').toLowerCase()
if (status !== 'expired') {
wechatClawBotExpiredRefreshAttempted.value = false
}
if (
autoRefreshExpired &&
!result.data?.connected &&
status === 'expired' &&
!wechatClawBotExpiredRefreshAttempted.value
) {
wechatClawBotExpiredRefreshAttempted.value = true
await refreshWechatClawBotQrcode({
silent: true,
showToast: false,
})
return
}
scheduleWechatClawBotRefresh()
} else {
wechatClawBotStatus.value = null
wechatClawBotQrImage.value = ''
clearWechatClawBotTimer()
if (showErrorToast) {
$toast.error(result.message || t('notification.wechatclawbot.statusLoadFailed'))
}
}
} catch (error) {
console.error(error)
clearWechatClawBotTimer()
if (showErrorToast) {
$toast.error(t('notification.wechatclawbot.statusLoadFailed'))
}
} finally {
if (!silent) {
wechatClawBotLoading.value = false
}
}
}
async function refreshWechatClawBotQrcode(options: WechatClawBotRefreshOptions = {}) {
const { silent = false, showToast = true } = options
if (!notificationInfo.value.name) {
return
}
if (!silent) {
wechatClawBotActionLoading.value = true
}
try {
const result: { [key: string]: any } = await api.post('notification/wechatclawbot/refresh', null, {
params: getWechatClawBotRequestParams(),
})
if (result.success) {
wechatClawBotStatus.value = result.data
await updateWechatClawBotQrImage(result.data)
wechatClawBotExpiredRefreshAttempted.value = false
scheduleWechatClawBotRefresh()
if (showToast) {
$toast.success(t('notification.wechatclawbot.qrcodeRefreshSuccess'))
}
} else {
if (showToast) {
$toast.error(result.message || t('notification.wechatclawbot.qrcodeRefreshFailed'))
}
}
} catch (error) {
console.error(error)
if (showToast) {
$toast.error(t('notification.wechatclawbot.qrcodeRefreshFailed'))
}
} finally {
if (!silent) {
wechatClawBotActionLoading.value = false
}
}
}
async function logoutWechatClawBot() {
if (!notificationInfo.value.name) {
return
}
wechatClawBotActionLoading.value = true
try {
const result: { [key: string]: any } = await api.post('notification/wechatclawbot/logout', null, {
params: getWechatClawBotRequestParams(),
})
if (result.success) {
$toast.success(result.message || t('notification.wechatclawbot.logoutSuccess'))
await fetchWechatClawBotStatus({
autoGenerateQrcode: true,
autoRefreshExpired: true,
})
} else {
$toast.error(result.message || t('notification.wechatclawbot.logoutFailed'))
}
} catch (error) {
console.error(error)
$toast.error(t('notification.wechatclawbot.logoutFailed'))
} finally {
wechatClawBotActionLoading.value = false
}
}
function formatWechatClawBotTime(timestamp?: number | null) {
if (!timestamp) {
return ''
}
return new Date(timestamp * 1000).toLocaleString()
}
const wechatClawBotStatusText = computed(() => {
const status = (wechatClawBotStatus.value?.qrcode_status || '').toLowerCase()
if (wechatClawBotStatus.value?.connected) {
return t('notification.wechatclawbot.connected')
}
if (status === 'scanned') {
return t('notification.wechatclawbot.scanned')
}
if (status === 'expired') {
return t('notification.wechatclawbot.expired')
}
if (status === 'confirmed') {
return t('notification.wechatclawbot.confirmed')
}
return t('notification.wechatclawbot.waiting')
})
// 根据存储类型选择图标
const getIcon = computed(() => {
switch (props.notification.type) {
case 'wechat':
return getLogoUrl('wechat')
case 'wechatclawbot':
return getLogoUrl('wechatclawbot')
case 'feishu':
return getLogoUrl('feishu')
case 'telegram':
return getLogoUrl('telegram')
case 'qqbot':
@@ -147,27 +441,38 @@ const getIcon = computed(() => {
// 按钮点击
function onClose() {
clearWechatClawBotTimer()
emit('close')
}
watch(notificationInfoDialog, value => {
if (!value) {
clearWechatClawBotTimer()
wechatClawBotQrImage.value = ''
wechatClawBotExpiredRefreshAttempted.value = false
}
})
</script>
<template>
<div>
<VCard variant="tonal" @click="openNotificationInfoDialog">
<span class="absolute top-3 right-12">
<IconBtn>
<VCard variant="tonal" class="app-card-shell" @click="openNotificationInfoDialog">
<span class="app-card-top-action absolute top-3 right-12">
<IconBtn @click.stop>
<VIcon class="cursor-move" icon="mdi-drag" />
</IconBtn>
</span>
<VDialogCloseBtn @click="onClose" />
<VCardText class="flex justify-space-between align-center gap-3">
<div class="align-self-start">
<div class="flex items-center">
<VCardText class="app-card-summary app-card-summary--double-action app-card-summary--title-subtitle">
<div class="app-card-summary__content">
<div class="app-card-summary__title-row">
<VBadge v-if="props.notification.enabled" dot inline color="success" class="me-1" />
<span class="text-h6">{{ props.notification.name }}</span>
<span class="app-card-summary__title text-h6">{{ props.notification.name }}</span>
</div>
<div class="text-body-1 mb-3">{{ notificationTypeNames[notification.type] }}</div>
<div class="app-card-summary__subtitle text-body-1">{{ notificationTypeNames[notification.type] }}</div>
</div>
<div class="app-card-summary__media" aria-hidden="true">
<VImg :src="getIcon" contain class="app-card-summary__image" />
</div>
<VImg :src="getIcon" cover class="mt-7 me-1" max-width="3rem" />
</VCardText>
</VCard>
@@ -344,6 +649,215 @@ function onClose() {
</VCol>
</template>
</VRow>
<VRow v-else-if="notificationInfo.type == 'wechatclawbot'">
<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.WECHATCLAWBOT_BASE_URL"
:label="t('notification.wechatclawbot.baseUrl')"
:hint="t('notification.wechatclawbot.baseUrlHint')"
persistent-hint
prepend-inner-icon="mdi-web"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.WECHATCLAWBOT_DEFAULT_TARGET"
:label="t('notification.wechatclawbot.defaultTarget')"
:placeholder="t('notification.wechatclawbot.defaultTargetPlaceholder')"
:hint="t('notification.wechatclawbot.defaultTargetHint')"
persistent-hint
prepend-inner-icon="mdi-account-arrow-right"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.WECHATCLAWBOT_ADMINS"
:label="t('notification.wechatclawbot.admins')"
:placeholder="t('notification.wechatclawbot.adminsPlaceholder')"
:hint="t('notification.wechatclawbot.adminsHint')"
persistent-hint
prepend-inner-icon="mdi-account-supervisor"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.WECHATCLAWBOT_POLL_TIMEOUT"
:label="t('notification.wechatclawbot.pollTimeout')"
:hint="t('notification.wechatclawbot.pollTimeoutHint')"
persistent-hint
type="number"
prepend-inner-icon="mdi-timer-outline"
/>
</VCol>
<VCol cols="12">
<VCard variant="tonal" class="pa-4">
<div class="d-flex flex-wrap align-center justify-space-between gap-3 mb-3">
<div>
<div class="text-subtitle-1 font-weight-medium">{{ t('notification.wechatclawbot.loginStatus') }}</div>
<div class="text-body-2 text-medium-emphasis">{{ wechatClawBotStatusText }}</div>
</div>
<div class="d-flex flex-wrap gap-2">
<VBtn
size="small"
variant="tonal"
:loading="wechatClawBotLoading"
@click.stop="fetchWechatClawBotStatus({ autoGenerateQrcode: true, autoRefreshExpired: true })"
>
{{ t('common.refresh') }}
</VBtn>
<VBtn
size="small"
color="primary"
variant="tonal"
:loading="wechatClawBotActionLoading"
@click.stop="refreshWechatClawBotQrcode"
>
{{ t('notification.wechatclawbot.refreshQrcode') }}
</VBtn>
<VBtn
size="small"
color="error"
variant="tonal"
:loading="wechatClawBotActionLoading"
:disabled="!wechatClawBotStatus?.connected"
@click.stop="logoutWechatClawBot"
>
{{ t('notification.wechatclawbot.logout') }}
</VBtn>
</div>
</div>
<VRow>
<VCol cols="12" md="5">
<div class="rounded text-center p-3 border h-100 d-flex align-center justify-center min-h-[16rem]">
<VImg
v-if="wechatClawBotQrImage"
:src="wechatClawBotQrImage"
width="220"
height="220"
class="mx-auto"
/>
<VProgressCircular v-else-if="wechatClawBotLoading" indeterminate color="primary" />
<div v-else class="text-body-2 text-medium-emphasis">
{{ t('notification.wechatclawbot.noQrcode') }}
</div>
</div>
</VCol>
<VCol cols="12" md="7">
<VAlert variant="tonal" :type="wechatClawBotStatus?.connected ? 'success' : 'info'" class="mb-3">
<div class="text-body-2">{{ t('notification.wechatclawbot.scanHint') }}</div>
<div v-if="wechatClawBotStatus?.account_id" class="mt-2">
{{ t('notification.wechatclawbot.accountId') }}: {{ wechatClawBotStatus.account_id }}
</div>
<div v-if="wechatClawBotStatus?.qrcode_updated_at" class="mt-2">
{{ t('notification.wechatclawbot.qrcodeUpdatedAt') }}:
{{ formatWechatClawBotTime(wechatClawBotStatus.qrcode_updated_at) }}
</div>
</VAlert>
<div class="text-subtitle-2 mb-2">{{ t('notification.wechatclawbot.knownTargets') }}</div>
<VList v-if="wechatClawBotStatus?.known_targets?.length" density="compact" class="border rounded">
<VListItem
v-for="item in wechatClawBotStatus.known_targets"
:key="item.userid"
:title="item.username || item.userid"
:subtitle="`${item.userid}${item.last_active ? ` · ${formatWechatClawBotTime(item.last_active)}` : ''}`"
/>
</VList>
<div v-else class="text-body-2 text-medium-emphasis">
{{ t('notification.wechatclawbot.noKnownTargets') }}
</div>
</VCol>
</VRow>
</VCard>
</VCol>
</VRow>
<VRow v-else-if="notificationInfo.type == 'feishu'">
<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.FEISHU_APP_ID"
:label="t('notification.feishu.appId')"
:hint="t('notification.feishu.appIdHint')"
persistent-hint
prepend-inner-icon="mdi-application"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_APP_SECRET"
:label="t('notification.feishu.appSecret')"
:hint="t('notification.feishu.appSecretHint')"
persistent-hint
prepend-inner-icon="mdi-key"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_OPEN_ID"
:label="t('notification.feishu.openId')"
:placeholder="t('notification.feishu.openIdPlaceholder')"
:hint="t('notification.feishu.openIdHint')"
persistent-hint
prepend-inner-icon="mdi-account"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_CHAT_ID"
:label="t('notification.feishu.chatId')"
:placeholder="t('notification.feishu.chatIdPlaceholder')"
:hint="t('notification.feishu.chatIdHint')"
persistent-hint
prepend-inner-icon="mdi-chat-processing"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_ADMINS"
:label="t('notification.feishu.admins')"
:placeholder="t('notification.feishu.adminsPlaceholder')"
:hint="t('notification.feishu.adminsHint')"
persistent-hint
prepend-inner-icon="mdi-account-supervisor"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_VERIFICATION_TOKEN"
:label="t('notification.feishu.verificationToken')"
:hint="t('notification.feishu.verificationTokenHint')"
persistent-hint
prepend-inner-icon="mdi-shield-key"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="notificationInfo.config.FEISHU_ENCRYPT_KEY"
:label="t('notification.feishu.encryptKey')"
:hint="t('notification.feishu.encryptKeyHint')"
persistent-hint
prepend-inner-icon="mdi-lock"
/>
</VCol>
</VRow>
<VRow v-else-if="notificationInfo.type == 'telegram'">
<VCol cols="12" md="6">
<VTextField

View File

@@ -118,6 +118,9 @@ const iconPath: Ref<string> = computed(() => {
function visitPluginPage() {
// 将raw.githubusercontent.com转换为项目地址
let repoUrl = props.plugin?.repo_url
if (props.plugin?.is_local || repoUrl?.startsWith('local://')) {
repoUrl = props.plugin?.author_url
}
if (repoUrl) {
if (repoUrl.includes('raw.githubusercontent.com')) {
if (!repoUrl.endsWith('/')) repoUrl += '/'

View File

@@ -11,13 +11,15 @@ import VersionHistory from '@/components/misc/VersionHistory.vue'
import ProgressDialog from '../dialog/ProgressDialog.vue'
import PluginConfigDialog from '../dialog/PluginConfigDialog.vue'
import PluginDataDialog from '../dialog/PluginDataDialog.vue'
import LoggingView from '@/views/system/LoggingView.vue'
import { useI18n } from 'vue-i18n'
import { useDisplay } from 'vuetify'
// 显示器宽度
const display = useDisplay()
// 插件日志面板只有点击“查看日志”时才需要,延后加载可减轻插件列表首屏。
const LoggingView = defineAsyncComponent(() => import('@/views/system/LoggingView.vue'))
// 输入参数
const props = defineProps({
plugin: Object as PropType<Plugin>,
@@ -25,6 +27,10 @@ const props = defineProps({
action: Boolean, // 动作标识
width: String,
height: String,
sortable: {
type: Boolean,
default: false,
},
})
// 定义触发的自定义事件
@@ -269,6 +275,14 @@ function openPluginDetail() {
else showPluginConfig()
}
function handleCardClick() {
if (props.sortable) {
return
}
openPluginDetail()
}
// 配置完成
function configDone() {
pluginConfigDialog.value = false
@@ -420,6 +434,7 @@ watch(
(newOpenState, _) => {
if (newOpenState) openPluginDetail()
},
{ immediate: true },
)
</script>
@@ -433,11 +448,13 @@ watch(
v-bind="hover.props"
:width="props.width"
:height="props.height"
@click="openPluginDetail"
@click="handleCardClick"
class="flex flex-col h-full"
:class="{
'transition transform-cpu duration-300 -translate-y-1': hover.isHovering,
'transition transform-cpu duration-300 -translate-y-1': hover.isHovering && !props.sortable,
'cursor-move': props.sortable,
}"
:ripple="!props.sortable"
>
<div
class="flex-grow"
@@ -458,7 +475,7 @@ watch(
{{ props.plugin?.plugin_desc }}
</div>
</div>
<div class="relative flex-shrink-0 self-center pb-3" :class="{ 'cursor-move': display.mdAndUp.value }">
<div class="relative flex-shrink-0 self-center pb-3" :class="{ 'cursor-move': props.sortable && display.mdAndUp.value }">
<VAvatar size="48">
<VImg
ref="imageRef"
@@ -482,7 +499,11 @@ watch(
<VIcon v-if="!isAvatarLoaded" size="small" icon="mdi-github" class="me-1" />
</template>
</VImg>
<span v-if="props.sortable" class="overflow-hidden text-ellipsis whitespace-nowrap">
{{ props.plugin?.plugin_author }}
</span>
<a
v-else
:href="props.plugin?.author_url"
target="_blank"
@click.stop
@@ -496,7 +517,7 @@ watch(
<span class="text-sm">{{ formatDownloadCount(props.count) }}</span>
</span>
</div>
<div class="absolute bottom-0 right-0">
<div v-if="!props.sortable" class="absolute bottom-0 right-0">
<IconBtn>
<VIcon icon="mdi-dots-vertical" />
<VMenu v-model="menuVisible" activator="parent" close-on-content-click>
@@ -566,13 +587,13 @@ watch(
</VDialog>
<!-- 实时日志弹窗 -->
<VDialog
v-if="loggingDialog"
v-model="loggingDialog"
scrollable
max-width="60rem"
:fullscreen="!display.mdAndUp.value"
>
<VDialog
v-if="loggingDialog"
v-model="loggingDialog"
scrollable
max-width="72rem"
:fullscreen="!display.mdAndUp.value"
>
<VCard>
<VDialogCloseBtn @click="loggingDialog = false" />
<VCardItem>
@@ -588,7 +609,7 @@ watch(
</VCardTitle>
</VCardItem>
<VDivider />
<VCardText>
<VCardText class="pa-0">
<LoggingView :logfile="`plugins/${props.plugin?.id?.toLowerCase()}.log`" />
</VCardText>
</VCard>

View File

@@ -25,6 +25,10 @@ const props = defineProps({
},
width: String,
height: String,
sortable: {
type: Boolean,
default: false,
},
})
// 定义触发的自定义事件
@@ -165,6 +169,14 @@ function openFolder() {
emit('open', props.folderName)
}
function handleCardClick() {
if (props.sortable) {
return
}
openFolder()
}
// 重命名文件夹
function showRenameDialog() {
newFolderName.value = props.folderName || ''
@@ -275,11 +287,12 @@ const dropdownItems = ref([
:width="props.width"
:height="props.height"
min-height="8.5rem"
@click="openFolder"
@click="handleCardClick"
class="plugin-folder-card h-full"
:class="{
'plugin-folder-card--mobile': display.mobile,
'plugin-folder-card--hover': hover.isHovering,
'plugin-folder-card--hover': hover.isHovering && !props.sortable,
'plugin-folder-card--sortable': props.sortable,
}"
>
<template v-if="backgroundImage" #image>
@@ -302,14 +315,14 @@ const dropdownItems = ref([
:icon="folderIcon"
:size="display.mobile ? 56 : 72"
:color="iconColor"
:class="{ 'cursor-move': display.mdAndUp.value }"
:class="{ 'cursor-move': props.sortable && display.mdAndUp.value }"
/>
</div>
<!-- 文件夹信息 -->
<div
class="plugin-folder-card__info"
:class="{ 'cursor-move': display.mdAndUp.value, 'plugin-folder-card__info--no-icon': !shouldShowIcon }"
:class="{ 'cursor-move': props.sortable && display.mdAndUp.value, 'plugin-folder-card__info--no-icon': !shouldShowIcon }"
>
<!-- 文件夹名称 -->
<h3 class="plugin-folder-card__name">
@@ -321,7 +334,7 @@ const dropdownItems = ref([
</div>
<!-- 更多菜单按钮 - 右下角 -->
<div class="absolute top-0 right-0">
<div v-if="!props.sortable" class="absolute top-0 right-0">
<VMenu v-model="menuVisible" location="top end" :close-on-content-click="true">
<template #activator="{ props: menuProps }">
<IconBtn v-bind="menuProps" @click.stop>
@@ -491,6 +504,10 @@ const dropdownItems = ref([
cursor: pointer;
transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
&--sortable {
cursor: move;
}
&--hover {
transform: translateY(-4px);
}

View File

@@ -14,12 +14,14 @@ interface Props {
pluginStatistics?: { [key: string]: number }
pluginActions?: { [key: string]: boolean }
showRemoveButton?: boolean
sortable?: boolean
}
const props = withDefaults(defineProps<Props>(), {
pluginStatistics: () => ({}),
pluginActions: () => ({}),
showRemoveButton: false,
sortable: false,
})
const emit = defineEmits<{
@@ -36,7 +38,7 @@ const emit = defineEmits<{
// 拖拽事件处理
function handleDragOver(event: DragEvent) {
// 只有当拖拽的是插件时才允许放入文件夹
if (props.item.type === 'folder') {
if (props.sortable && props.item.type === 'folder') {
event.preventDefault()
event.stopPropagation()
event.dataTransfer!.dropEffect = 'move'
@@ -46,14 +48,14 @@ function handleDragOver(event: DragEvent) {
}
function handleDragEnter(event: DragEvent) {
if (props.item.type === 'folder') {
if (props.sortable && props.item.type === 'folder') {
event.preventDefault()
event.stopPropagation()
}
}
function handleDragLeave(event: DragEvent) {
if (props.item.type === 'folder') {
if (props.sortable && props.item.type === 'folder') {
event.preventDefault()
event.stopPropagation()
const target = event.currentTarget as HTMLElement
@@ -62,7 +64,7 @@ function handleDragLeave(event: DragEvent) {
}
function handleDropToFolder(event: DragEvent) {
if (props.item.type === 'folder') {
if (props.sortable && props.item.type === 'folder') {
event.preventDefault()
event.stopPropagation()
const target = event.currentTarget as HTMLElement
@@ -89,6 +91,7 @@ function handleDropToFolder(event: DragEvent) {
:folder-name="item.data.name"
:plugin-count="item.data.pluginCount"
:folder-config="item.data.config"
:sortable="sortable"
@open="$emit('openFolder', item.id)"
@delete="$emit('deleteFolder', item.id)"
@rename="(oldName, newName) => $emit('renameFolder', oldName, newName)"
@@ -102,6 +105,7 @@ function handleDropToFolder(event: DragEvent) {
:count="pluginStatistics[item.id] || 0"
:plugin="item.data"
:action="pluginActions[item.id] || false"
:sortable="sortable"
@remove="$emit('refreshData')"
@save="$emit('refreshData')"
@action-done="$emit('actionDone', item.id)"
@@ -109,7 +113,7 @@ function handleDropToFolder(event: DragEvent) {
<!-- 移出文件夹按钮(仅在文件夹内显示) -->
<VBtn
v-if="showRemoveButton"
v-if="showRemoveButton && !sortable"
icon="mdi-folder-remove"
variant="text"
color="warning"

View File

@@ -12,6 +12,7 @@ import type { Site, SiteStatistic, SiteUserData } from '@/api/types'
import { isNullOrEmptyObject } from '@/@core/utils'
import { formatFileSize } from '@/@core/utils/formatters'
import { useConfirm } from '@/composables/useConfirm'
import { getCachedSiteIcon } from '@/utils/siteIconCache'
import { useDisplay } from 'vuetify'
// 显示器宽度
@@ -25,6 +26,10 @@ const cardProps = defineProps({
site: Object as PropType<Site>,
data: Object as PropType<SiteUserData>,
stats: Object as PropType<SiteStatistic>,
sortable: {
type: Boolean,
default: false,
},
})
// 定义触发的自定义事件
@@ -34,7 +39,8 @@ const emit = defineEmits(['update', 'remove', 'refresh-stats'])
const createConfirm = useConfirm()
// 图标
const siteIcon = ref<string>('')
const defaultSiteIcon = getLogoUrl('site')
const siteIcon = ref<string>(defaultSiteIcon)
// 提示框
const $toast = useToast()
@@ -59,12 +65,20 @@ const siteUserDataDialog = ref(false)
// 查询站点图标
async function getSiteIcon() {
const siteId = cardProps.site?.id
if (!siteId) {
siteIcon.value = defaultSiteIcon
return
}
try {
siteIcon.value = (await api.get(`site/icon/${cardProps.site?.id}`)).data.icon
if (!siteIcon.value) {
siteIcon.value = getLogoUrl('site')
}
siteIcon.value = await getCachedSiteIcon(siteId, async () => {
const response = await api.get(`site/icon/${siteId}`)
return response?.data?.icon || defaultSiteIcon
})
} catch (error) {
siteIcon.value = defaultSiteIcon
console.error(error)
}
}
@@ -109,6 +123,22 @@ function openSitePage() {
window.open(cardProps.site?.url, '_blank')
}
function handleCardClick() {
if (cardProps.sortable) {
return
}
handleResourceBrowse()
}
function handleSiteUrlClick() {
if (cardProps.sortable) {
return
}
openSitePage()
}
// 调用API删除站点信息
async function deleteSiteInfo() {
const isConfirmed = await createConfirm({
@@ -196,31 +226,40 @@ onMounted(() => {
<template>
<div>
<VCard
class="site-card relative h-full flex flex-col overflow-hidden group transition-all duration-300 cursor-pointer hover:-translate-y-1"
class="site-card relative h-full flex flex-col overflow-hidden group transition-all duration-300"
:class="[
cardProps.site?.is_active ? '' : 'opacity-70',
{
'border-error': statColor === 'error',
'border-warning': statColor === 'warning',
'border-success': statColor === 'success',
'cursor-pointer hover:-translate-y-1': !cardProps.sortable,
'cursor-move': cardProps.sortable,
'site-card--sortable': cardProps.sortable,
},
]"
:ripple="false"
variant="flat"
elevation="0"
rounded="lg"
hover
@click="handleResourceBrowse"
:hover="!cardProps.sortable"
@click="handleCardClick"
>
<!-- 装饰性状态指示器 -->
<div v-if="cardProps.site?.is_active" class="site-status-indicator" :class="statColor"></div>
<!-- 主体部分 -->
<div class="relative flex-1 flex flex-col p-3 z-1">
<div class="relative z-1 flex flex-1 flex-col p-3 pr-12">
<!-- 顶部图标和站点名称 -->
<div class="flex items-center mb-1">
<div class="mb-1 flex min-w-0 items-center gap-2">
<!-- 站点图标 -->
<VAvatar tile rounded="lg" size="32" class="me-2" :class="{ 'cursor-move': display.mdAndUp.value }">
<VAvatar
tile
rounded="lg"
size="32"
class="shrink-0"
:class="{ 'cursor-move': cardProps.sortable && display.mdAndUp.value }"
>
<VImg :src="siteIcon" class="w-full h-full" :alt="cardProps.site?.name" cover>
<template #placeholder>
<div class="w-full h-full">
@@ -231,22 +270,42 @@ onMounted(() => {
</VAvatar>
<!-- 站点名称和特性图标 -->
<div class="flex-1 min-w-0 flex items-center">
<h3 class="text-lg font-semibold leading-tight truncate">{{ cardProps.site?.name }}</h3>
<div class="flex min-w-0 flex-1 items-center gap-2">
<h3 class="min-w-0 flex-1 truncate text-lg font-semibold leading-tight">{{ cardProps.site?.name }}</h3>
<!-- 站点特性图标 -->
<div class="flex items-center gap-2 ml-auto mr-10">
<div v-if="cardProps.site?.limit_interval" class="hover:bg-primary/8 transition-colors">
<VIcon icon="mdi-speedometer" size="16" color="primary" class="opacity-85 hover:opacity-100" />
<div class="ml-auto flex shrink-0 items-center gap-2">
<div v-if="cardProps.site?.limit_interval" :class="cardProps.sortable ? '' : 'hover:bg-primary/8 transition-colors'">
<VIcon
icon="mdi-speedometer"
size="16"
color="primary"
:class="cardProps.sortable ? 'opacity-85' : 'opacity-85 hover:opacity-100'"
/>
</div>
<div v-if="cardProps.site?.proxy" class="hover:bg-primary/8 transition-colors">
<VIcon icon="mdi-network-outline" size="16" color="primary" class="opacity-85 hover:opacity-100" />
<div v-if="cardProps.site?.proxy" :class="cardProps.sortable ? '' : 'hover:bg-primary/8 transition-colors'">
<VIcon
icon="mdi-network-outline"
size="16"
color="primary"
:class="cardProps.sortable ? 'opacity-85' : 'opacity-85 hover:opacity-100'"
/>
</div>
<div v-if="cardProps.site?.render" class="hover:bg-primary/8 transition-colors">
<VIcon icon="mdi-apple-safari" size="16" color="primary" class="opacity-85 hover:opacity-100" />
<div v-if="cardProps.site?.render" :class="cardProps.sortable ? '' : 'hover:bg-primary/8 transition-colors'">
<VIcon
icon="mdi-apple-safari"
size="16"
color="primary"
:class="cardProps.sortable ? 'opacity-85' : 'opacity-85 hover:opacity-100'"
/>
</div>
<div v-if="cardProps.site?.filter" class="hover:bg-primary/8 transition-colors">
<VIcon icon="mdi-filter-cog-outline" size="16" color="primary" class="opacity-85 hover:opacity-100" />
<div v-if="cardProps.site?.filter" :class="cardProps.sortable ? '' : 'hover:bg-primary/8 transition-colors'">
<VIcon
icon="mdi-filter-cog-outline"
size="16"
color="primary"
:class="cardProps.sortable ? 'opacity-85' : 'opacity-85 hover:opacity-100'"
/>
</div>
</div>
</div>
@@ -254,10 +313,10 @@ onMounted(() => {
<!-- 中间部分网址 -->
<div class="my-3">
<div class="text-sm text-medium-emphasis truncate" @click.stop="openSitePage">
{{ cardProps.site?.url }}
<div class="min-w-0 truncate text-sm text-medium-emphasis" @click.stop="handleSiteUrlClick">
{{ cardProps.site?.url }}
</div>
</div>
</div>
<!-- 底部数据统计 -->
<div class="flex-1 flex flex-col justify-end">
@@ -289,7 +348,7 @@ onMounted(() => {
</div>
<!-- 右侧操作按钮区 -->
<VSheet class="site-card-actions absolute inset-y-0 right-0 z-20 flex flex-col py-2 px-1">
<VSheet v-if="!cardProps.sortable" class="site-card-actions absolute inset-y-0 right-0 z-20 flex flex-col py-2 px-1">
<!-- 测试按钮 -->
<VBtn
icon
@@ -412,7 +471,7 @@ onMounted(() => {
}
/* 站点卡片悬停时状态指示器变化 */
.site-card:hover .site-status-indicator {
.site-card:not(.site-card--sortable):hover .site-status-indicator {
block-size: 2px;
opacity: 0.8;
}

View File

@@ -29,6 +29,10 @@ const props = defineProps({
type: Boolean,
default: false,
},
sortable: {
type: Boolean,
default: false,
},
})
// 从 provide 中获取全局设置
@@ -63,6 +67,25 @@ const subscribeState = ref<string>(props.media?.state ?? 'P')
// 上一次更新时间
const lastUpdateText = computed(() => (props.media?.last_update ? formatDateDifference(props.media.last_update) : ''))
// 判断后端数字/布尔开关是否启用
function isEnabledFlag(value: any) {
return value === true || value === 1 || value === '1'
}
// 订阅列表接口通常返回中文媒体类型,插件或缓存数据可能只保留剧集字段
function isTvSubscribe(media?: Subscribe) {
return media?.type === '电视剧' || media?.type === 'tv' || !!media?.season || !!media?.total_episode
}
// TV 洗版订阅在卡片上展示分集或全集短标签
const bestVersionModeLabel = computed(() => {
if (!isEnabledFlag(props.media?.best_version) || !isTvSubscribe(props.media)) return ''
return isEnabledFlag(props.media?.best_version_full)
? t('subscribe.bestVersionWholeShort')
: t('subscribe.bestVersionEpisodeShort')
})
// 图片加载完成响应
function imageLoadHandler() {
imageLoaded.value = true
@@ -266,6 +289,7 @@ watch(
(newOpenState, _) => {
if (newOpenState) editSubscribeDialog()
},
{ immediate: true },
)
// 监听订阅状态
@@ -308,6 +332,10 @@ function onSubscribeEditRemove() {
// 处理卡片点击事件
function handleCardClick() {
if (props.sortable) {
return
}
if (props.batchMode) {
// 批量模式下触发选择事件
emit('select')
@@ -325,7 +353,7 @@ function handleCardClick() {
<div
class="w-full h-full rounded-lg overflow-hidden"
:class="{
'transition transform-cpu duration-300 -translate-y-1': hover.isHovering,
'transition transform-cpu duration-300 -translate-y-1': hover.isHovering && !props.sortable,
'outline-dashed outline-1': props.media?.best_version && imageLoaded,
'outline-dotted outline-pink-500 outline-2': props.batchMode && props.selected,
}"
@@ -336,13 +364,14 @@ function handleCardClick() {
class="flex flex-col h-full"
:class="{
'opacity-70': subscribeState === 'S',
'cursor-move': props.sortable,
}"
rounded="0"
min-height="150"
@click="handleCardClick"
:ripple="!props.batchMode"
:ripple="!props.batchMode && !props.sortable"
>
<div class="me-n3 absolute top-1 right-4">
<div v-if="!props.sortable" class="me-n3 absolute top-1 right-4">
<IconBtn>
<VIcon icon="mdi-dots-vertical" color="white" />
<VMenu activator="parent" close-on-content-click>
@@ -380,7 +409,7 @@ function handleCardClick() {
<div
class="h-auto w-12 flex-shrink-0 overflow-hidden rounded-md"
v-if="imageLoaded"
:class="{ 'cursor-move': display.mdAndUp.value }"
:class="{ 'cursor-move': props.sortable && display.mdAndUp.value }"
>
<VImg :src="posterUrl" aspect-ratio="2/3" cover>
<template #placeholder>
@@ -398,21 +427,39 @@ function handleCardClick() {
</div>
</div>
</VCardText>
<VCardText class="flex justify-space-between align-center flex-wrap px-3">
<div class="flex align-center">
<VCardText class="flex min-w-0 justify-space-between align-center flex-wrap px-3">
<div class="flex min-w-0 max-w-full align-center">
<VIcon
v-if="props.media?.total_episode && props.sortable"
icon="mdi-progress-download"
size="small"
color="white"
class="me-1"
/>
<IconBtn
v-if="props.media?.total_episode"
v-else-if="props.media?.total_episode"
size="small"
v-bind="props"
icon="mdi-progress-download"
color="white"
/>
<div v-if="props.media?.season" class="text-subtitle-2 me-2 text-white">
<div v-if="props.media?.season" class="flex-shrink-0 text-subtitle-2 me-2 text-white">
{{ (props.media?.total_episode || 0) - (props.media?.lack_episode || 0) }} /
{{ props.media?.total_episode }}
</div>
<IconBtn v-if="props.media?.username" icon="mdi-account" size="small" color="white" />
<span v-if="props.media?.username" class="text-subtitle-2 text-white">
<VChip
v-if="bestVersionModeLabel"
size="x-small"
color="primary"
variant="flat"
class="me-2 flex-shrink-0"
>
{{ bestVersionModeLabel }}
</VChip>
<VIcon v-if="props.media?.username && props.sortable" icon="mdi-account" size="small" color="white" class="flex-shrink-0 me-1" />
<IconBtn v-else-if="props.media?.username" icon="mdi-account" size="small" color="white" class="flex-shrink-0" />
<!-- 用户名过长时限制在卡片宽度内并用省略号展示剩余内容 -->
<span v-if="props.media?.username" class="min-w-0 truncate text-subtitle-2 text-white" :title="props.media?.username">
{{ props.media?.username }}
</span>
</div>

View File

@@ -5,6 +5,8 @@ import api from '@/api'
import type { Context } from '@/api/types'
import AddDownloadDialog from '../dialog/AddDownloadDialog.vue'
import { isNullOrEmptyObject } from '@/@core/utils'
import { getCachedSiteIcon } from '@/utils/siteIconCache'
import { downloadedTorrentMap, markTorrentDownloaded } from '@/utils/torrentDownloadCache'
// 输入参数
const props = defineProps({
@@ -32,8 +34,7 @@ const downloadItem = ref(props.torrent)
// 站点图标
const siteIcons = ref<Record<number, string>>({})
// 存储是否已经下载过的记录
const downloaded = ref<string[]>([])
const isDownloaded = computed(() => Boolean(torrent.value?.enclosure && downloadedTorrentMap[torrent.value.enclosure]))
// 添加下载对话框
const addDownloadDialog = ref(false)
@@ -41,8 +42,7 @@ const addDownloadDialog = ref(false)
// 添加下载成功
function addDownloadSuccess(url: string) {
addDownloadDialog.value = false
// 添加下载成功
downloaded.value.push(url)
markTorrentDownloaded(url)
}
// 添加下载失败
@@ -53,10 +53,21 @@ function addDownloadError(error: string) {
// 查询站点图标
async function getSiteIcon(site: number | undefined) {
if (!site) return
try {
siteIcons.value[site] = (await api.get(`site/icon/${site}`)).data.icon
siteIcons.value[site] = await getCachedSiteIcon(site, async () => {
try {
const response = await api.get(`site/icon/${site}`)
return response?.data?.icon || ''
} catch (error) {
console.error(error)
return ''
}
})
} catch (error) {
console.error(error)
siteIcons.value[site] = ''
}
}
@@ -109,20 +120,27 @@ async function openMoreTorrentsDialog() {
showMoreTorrents.value = true
}
// 装载时查询站点图标
onMounted(() => {
getSiteIcon(props.torrent?.torrent_info?.site)
})
watch(
() => props.torrent,
value => {
torrent.value = value?.torrent_info
media.value = value?.media_info
meta.value = value?.meta_info
downloadItem.value = value
getSiteIcon(value?.torrent_info?.site)
},
{ immediate: true },
)
</script>
<template>
<div class="h-full">
<VCard
:width="props.width || '100%'"
:variant="downloaded.includes(torrent?.enclosure || '') ? 'outlined' : 'flat'"
:variant="isDownloaded ? 'outlined' : 'flat'"
@click="handleAddDownload(props.torrent)"
class="h-full cursor-pointer transition-transform hover:-translate-y-1 duration-300 d-flex flex-column overflow-hidden torrent-card"
:class="{ 'border-success border-2 opacity-85': downloaded.includes(torrent?.enclosure || '') }"
:class="{ 'border-success border-2 opacity-85': isDownloaded }"
hover
>
<!-- 优惠标签 -->

View File

@@ -4,6 +4,8 @@ import { formatFileSize, formatDateDifference } from '@/@core/utils/formatters'
import api from '@/api'
import type { Context } from '@/api/types'
import AddDownloadDialog from '../dialog/AddDownloadDialog.vue'
import { getCachedSiteIcon } from '@/utils/siteIconCache'
import { downloadedTorrentMap, markTorrentDownloaded } from '@/utils/torrentDownloadCache'
// 输入参数
const props = defineProps({
@@ -22,37 +24,31 @@ const meta = ref(props.torrent?.meta_info)
// 站点图标
const siteIcon = ref('')
// 站点图标加载状态
const iconLoading = ref(false)
const iconError = ref(false)
// 存储是否已经下载过的记录
const downloaded = ref<string[]>([])
const isDownloaded = computed(() => Boolean(torrent.value?.enclosure && downloadedTorrentMap[torrent.value.enclosure]))
// 添加下载对话框
const addDownloadDialog = ref(false)
// 查询站点图标
async function getSiteIcon() {
if (!torrent?.value?.site || iconLoading.value) {
if (!torrent?.value?.site) {
return
}
iconLoading.value = true
iconError.value = false
try {
const response = await api.get(`site/icon/${torrent.value.site}`)
if (response && response.data && response.data.icon) {
siteIcon.value = response.data.icon
} else {
iconError.value = true
}
siteIcon.value = await getCachedSiteIcon(torrent.value.site, async () => {
try {
const response = await api.get(`site/icon/${torrent.value?.site}`)
return response?.data?.icon || ''
} catch (error) {
console.error('Failed to load site icon:', error)
return ''
}
})
} catch (error) {
console.error('Failed to load site icon:', error)
iconError.value = true
} finally {
iconLoading.value = false
siteIcon.value = ''
}
}
@@ -83,8 +79,7 @@ async function handleAddDownload() {
// 添加下载成功
function addDownloadSuccess(url: string) {
addDownloadDialog.value = false
// 添加下载成功
downloaded.value.push(url)
markTorrentDownloaded(url)
}
// 添加下载失败
@@ -97,10 +92,16 @@ function openTorrentDetail() {
window.open(torrent.value?.page_url, '_blank')
}
// 装载时查询站点图标
onMounted(() => {
getSiteIcon()
})
watch(
() => props.torrent,
value => {
torrent.value = value?.torrent_info
media.value = value?.media_info
meta.value = value?.meta_info
getSiteIcon()
},
{ immediate: true },
)
</script>
<template>
@@ -108,7 +109,7 @@ onMounted(() => {
<VListItem
:value="props.torrent?.torrent_info?.enclosure"
class="pa-3 mb-2 rounded torrent-item transition-all duration-300 hover:-translate-y-1 overflow-hidden"
:class="{ 'border-start border-success border-3 opacity-85': downloaded.includes(torrent?.enclosure || '') }"
:class="{ 'border-start border-success border-3 opacity-85': isDownloaded }"
@click="handleAddDownload"
>
<!-- 优惠标签 -->

View File

@@ -123,10 +123,10 @@ onMounted(() => {
'transition-transform duration-300 hover:-translate-y-1',
!props.user.is_active ? 'opacity-85 bg-surface-lighten-1' : '',
]"
class="flex flex-column"
class="user-card flex flex-column h-full"
@click="userEditDialog = true"
>
<div class="flex-grow">
<div class="user-card__body flex-grow flex-grow-1">
<!-- 用户头像和基本信息 -->
<VCardItem :class="[user.is_superuser ? 'admin-header' : '']">
<template v-slot:prepend>
@@ -247,7 +247,7 @@ onMounted(() => {
</div>
<!-- 独立的邮箱显示 -->
<VDivider class="mx-4" />
<div>
<div class="user-card__footer">
<VCardText class="d-flex align-center py-2 px-4 text-medium-emphasis">
<VIcon icon="mdi-email-outline" size="small" color="primary" class="mr-2 opacity-70" />
<span class="text-body-2 truncate">{{ user.email || t('user.noEmail') }}</span>
@@ -308,6 +308,16 @@ onMounted(() => {
</template>
<style scoped>
.user-card {
block-size: 100%;
}
/* 让邮箱和订阅统计固定在卡片底部,保证同一行用户卡片视觉等高。 */
.user-card__footer {
flex-shrink: 0;
margin-block-start: auto;
}
.admin-decoration {
position: absolute;
z-index: 1;

View File

@@ -1,7 +1,9 @@
<script lang="ts" setup>
import { formatDateDifference } from '@/@core/utils/formatters'
import api from '@/api'
import { clearCachesAndServiceWorker, reloadWithTimestamp } from '@/composables/useVersionChecker'
import { clearCacheAndReload } from '@/composables/useVersionChecker'
import MarkdownIt from 'markdown-it'
import mdLinkAttributes from 'markdown-it-link-attributes'
import { useI18n } from 'vue-i18n'
import { useDisplay } from 'vuetify'
@@ -17,6 +19,21 @@ const emit = defineEmits(['close'])
// 显示器
const display = useDisplay()
// 初始化 markdown-it
const md = new MarkdownIt({
html: true,
linkify: true,
typographer: true,
})
// 插件:链接在新窗口打开
md.use(mdLinkAttributes, {
attrs: {
target: '_blank',
rel: 'noopener noreferrer',
},
})
// 系统环境变量
const systemEnv = ref<any>({})
@@ -70,7 +87,7 @@ const releaseDialogBody = ref('')
// 打开日志对话框
function showReleaseDialog(title: string, body: string) {
releaseDialogTitle.value = title
releaseDialogBody.value = body.replaceAll('\r\n', '<br />')
releaseDialogBody.value = body ? md.render(body) : ''
releaseDialog.value = true
}
@@ -121,9 +138,7 @@ function releaseTime(releaseDate: string) {
// 强制清除缓存
async function clearCache() {
await clearCachesAndServiceWorker()
// 刷新页面,添加时间戳参数以强制更新
reloadWithTimestamp()
await clearCacheAndReload()
}
onMounted(() => {
@@ -393,7 +408,7 @@ onMounted(() => {
<VDialogCloseBtn @click="releaseDialog = false" />
<VCardTitle>{{ releaseDialogTitle }} {{ t('setting.about.changelog') }}</VCardTitle>
</VCardItem>
<VCardText v-html="releaseDialogBody" />
<VCardText class="markdown-body" v-html="releaseDialogBody" />
</VCard>
</VDialog>
</VDialog>
@@ -411,4 +426,101 @@ onMounted(() => {
.section {
margin-block: 0.5rem 2.5rem;
}
.markdown-body :deep(h1),
.markdown-body :deep(h2),
.markdown-body :deep(h3) {
margin-block: 0.5rem;
font-weight: 600;
}
.markdown-body :deep(h1) {
font-size: 1.5rem;
}
.markdown-body :deep(h2) {
font-size: 1.25rem;
}
.markdown-body :deep(h3) {
font-size: 1.1rem;
}
.markdown-body :deep(ul),
.markdown-body :deep(ol) {
padding-inline-start: 1.5rem;
margin-block: 0.5rem;
}
.markdown-body :deep(li) {
margin-block: 0.25rem;
}
.markdown-body :deep(p) {
margin-block: 0.5rem;
}
.markdown-body :deep(a) {
color: rgb(99 102 241);
text-decoration: none;
}
.markdown-body :deep(a:hover) {
text-decoration: underline;
}
.markdown-body :deep(code) {
padding: 0.15rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.875em;
background-color: rgba(127, 127, 127, 0.15);
}
.markdown-body :deep(pre) {
padding: 0.75rem 1rem;
margin-block: 0.5rem;
overflow-x: auto;
border-radius: 0.375rem;
background-color: rgba(127, 127, 127, 0.15);
}
.markdown-body :deep(pre code) {
padding: 0;
background-color: transparent;
}
.markdown-body :deep(blockquote) {
padding-inline-start: 1rem;
margin-block: 0.5rem;
border-inline-start: 3px solid rgba(127, 127, 127, 0.4);
color: rgba(127, 127, 127, 0.8);
}
.markdown-body :deep(hr) {
margin-block: 1rem;
border: none;
border-block-start: 1px solid rgba(127, 127, 127, 0.3);
}
.markdown-body :deep(table) {
width: 100%;
margin-block: 0.5rem;
border-collapse: collapse;
}
.markdown-body :deep(th),
.markdown-body :deep(td) {
padding: 0.4rem 0.75rem;
border: 1px solid rgba(127, 127, 127, 0.3);
}
.markdown-body :deep(th) {
font-weight: 600;
background-color: rgba(127, 127, 127, 0.1);
}
.markdown-body :deep(img) {
max-width: 100%;
height: auto;
}
</style>

View File

@@ -1,51 +1,36 @@
<script lang="ts" setup>
import api from '@/api'
import draggable from 'vuedraggable'
import { useToast } from 'vue-toastification'
import { useI18n } from 'vue-i18n'
import { computed } from 'vue'
import { useDisplay } from 'vuetify'
// 显示器宽度
const display = useDisplay()
// 国际化
const { t } = useI18n()
const $toast = useToast()
// 插件仓库设置字符串
const repoString = ref('')
// 用于显示的仓库地址数组
const repoArray = ref<string[]>([])
const repoList = ref<string[]>([])
const newRepoUrl = ref('')
const editingIndex = ref<number | null>(null)
const editingUrl = ref('')
// 计算属性:在数组和换行符分隔的字符串之间转换
const displayRepos = computed({
get: () => repoArray.value.join('\n'),
set: (value: string) => {
repoArray.value = value.split('\n').filter((repo: string) => repo.trim() !== '')
},
})
// 定义事件
const emit = defineEmits(['save', 'close'])
// 查询已设置的插件仓库
async function queryMarketRepoSetting() {
try {
const result: { [key: string]: any } = await api.get('system/setting/PLUGIN_MARKET')
if (result && result.data && result.data.value) {
repoString.value = result.data.value
repoArray.value = result.data.value.split(',').filter((repo: string) => repo.trim() !== '')
repoList.value = result.data.value.split(',').filter((repo: string) => repo.trim() !== '')
}
} catch (error) {
console.log(error)
}
}
// 保存设置
async function saveHandle() {
try {
// 将数组转换为逗号分隔的字符串
const repoStringToSave = repoArray.value.join(',')
const repoStringToSave = repoList.value.join(',')
const result: { [key: string]: any } = await api.post('system/setting/PLUGIN_MARKET', repoStringToSave)
if (result.success) {
@@ -57,6 +42,76 @@ async function saveHandle() {
}
}
function addRepo() {
const url = newRepoUrl.value.trim()
if (!url) return
if (!url.startsWith('http://') && !url.startsWith('https://')) {
$toast.error(t('dialog.pluginMarketSetting.invalidUrl'))
return
}
if (repoList.value.includes(url)) {
$toast.error(t('dialog.pluginMarketSetting.duplicateUrl'))
return
}
repoList.value.push(url)
newRepoUrl.value = ''
}
function removeRepo(index: number) {
repoList.value.splice(index, 1)
}
function startEdit(index: number) {
editingIndex.value = index
editingUrl.value = repoList.value[index]
}
function saveEdit() {
if (editingIndex.value === null) return
const url = editingUrl.value.trim()
if (!url) return
if (!url.startsWith('http://') && !url.startsWith('https://')) {
$toast.error(t('dialog.pluginMarketSetting.invalidUrl'))
return
}
repoList.value[editingIndex.value] = url
editingIndex.value = null
editingUrl.value = ''
}
function cancelEdit() {
editingIndex.value = null
editingUrl.value = ''
}
function formatRepoDisplay(url: string) {
try {
const parsedUrl = new URL(url)
const pathSegments = parsedUrl.pathname.split('/').filter(Boolean)
if (
['github.com', 'www.github.com', 'raw.githubusercontent.com'].includes(parsedUrl.hostname)
&& pathSegments.length >= 2
) {
return `${pathSegments[0]}/${pathSegments[1].replace(/\.git$/, '')}`
}
} catch {
// Ignore malformed URLs and fall back to the original value.
}
return url
}
function repoItemKey(repo: string) {
return repo
}
onMounted(() => {
queryMarketRepoSetting()
})
@@ -64,7 +119,7 @@ onMounted(() => {
<template>
<VDialog width="50rem" scrollable :fullscreen="!display.mdAndUp.value">
<VCard>
<VCard class="plugin-market-dialog-card">
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-store-cog" class="me-2" />
@@ -73,21 +128,127 @@ onMounted(() => {
<VDialogCloseBtn @click="emit('close')" />
</VCardItem>
<VDivider />
<VCardText class="pt-2">
<VTextarea
v-model="displayRepos"
:placeholder="t('dialog.pluginMarketSetting.repoPlaceholder')"
:hint="t('dialog.pluginMarketSetting.repoHint')"
persistent-hint
auto-grow
/>
<VCardText class="plugin-market-dialog-body pt-4">
<div class="plugin-market-input mb-4">
<VTextField
v-model="newRepoUrl"
density="compact"
:placeholder="t('dialog.pluginMarketSetting.urlPlaceholder')"
prepend-inner-icon="mdi-link-plus"
clearable
@keyup.enter="addRepo"
>
<template #append>
<VBtn icon="mdi-plus" variant="text" color="primary" @click="addRepo" />
</template>
</VTextField>
</div>
<div class="plugin-market-list-wrap">
<VList v-if="repoList.length > 0" class="px-0">
<draggable
v-model="repoList"
:item-key="repoItemKey"
handle=".drag-handle"
animation="200"
:disabled="editingIndex !== null"
>
<template #item="{ element: repo, index }">
<div>
<VListItem class="py-2">
<template #prepend>
<VBtn
icon="mdi-drag-vertical"
size="small"
variant="text"
color="primary"
class="drag-handle me-2"
:disabled="editingIndex !== null"
/>
</template>
<VListItemTitle v-if="editingIndex !== index">
<span class="text-truncate" :title="repo">{{ formatRepoDisplay(repo) }}</span>
</VListItemTitle>
<VTextField
v-else
v-model="editingUrl"
density="compact"
variant="outlined"
hide-details
@keyup.enter="saveEdit"
@keyup.escape="cancelEdit"
/>
<template #append v-if="editingIndex !== index">
<div class="d-flex align-center">
<IconBtn icon="mdi-pencil" size="small" variant="text" @click="startEdit(index)" />
<IconBtn
icon="mdi-delete"
size="small"
variant="text"
color="error"
@click="removeRepo(index)"
/>
</div>
</template>
<template #append v-else>
<div class="d-flex align-center">
<IconBtn icon="mdi-check" size="small" variant="text" color="success" @click="saveEdit" />
<IconBtn icon="mdi-close" size="small" variant="text" @click="cancelEdit" />
</div>
</template>
</VListItem>
<VDivider v-if="index < repoList.length - 1" class="mx-4" />
</div>
</template>
</draggable>
</VList>
<div v-else class="text-center text-medium-emphasis py-8">
<VIcon icon="mdi-folder-open-outline" size="48" class="mb-2" />
<div>{{ t('dialog.pluginMarketSetting.noRepos') }}</div>
</div>
</div>
</VCardText>
<VCardActions>
<VSpacer />
<VBtn @click="saveHandle" prepend-icon="mdi-content-save-check" class="px-5 me-3">
<VBtn
@click="saveHandle"
prepend-icon="mdi-content-save-check"
class="px-5 me-3"
:disabled="repoList.length === 0"
>
{{ t('dialog.pluginMarketSetting.save') }}
</VBtn>
</VCardActions>
</VCard>
</VDialog>
</template>
<style scoped lang="scss">
.plugin-market-dialog-card {
display: flex;
flex-direction: column;
}
.plugin-market-dialog-body {
display: flex;
overflow: hidden;
flex: 1;
flex-direction: column;
min-block-size: 0;
}
.plugin-market-input {
flex-shrink: 0;
}
.plugin-market-list-wrap {
flex: 1;
min-block-size: 0;
overflow-y: auto;
}
</style>

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@@ -1,13 +1,17 @@
<script setup lang="ts">
import { Site } from '@/api/types'
import api from '@/api'
import type { TorrentInfo, SiteCategory } from '@/api/types'
import type { Site, TorrentInfo, SiteCategory } from '@/api/types'
import { formatFileSize } from '@core/utils/formatters'
import { useDisplay } from 'vuetify'
import AddDownloadDialog from '../dialog/AddDownloadDialog.vue'
import ProgressiveCardGrid from '@/components/misc/ProgressiveCardGrid.vue'
import { useI18n } from 'vue-i18n'
// 国际化
const { t } = useI18n()
const { t, locale } = useI18n()
// 响应式断点
const display = useDisplay()
// 输入参数
const props = defineProps({
@@ -23,6 +27,30 @@ const selectCategory = ref<number[]>([])
// 全部分类
const siteCategoryList = ref<SiteCategory[]>()
// 注册事件
const emit = defineEmits(['close'])
// 数据列表
const resourceDataList = ref<TorrentInfo[]>([])
// 每页条数
const resourceItemsPerPage = ref(25)
// 当前页
const resourcePage = ref(1)
// 加载状态
const resourceLoading = ref(false)
// 移动端搜索栏是否展开
const mobileSearchExpanded = ref(false)
// 种子元数据
const torrent = ref<TorrentInfo>()
// 添加下载对话框
const addDownloadDialog = ref(false)
// 分类选项
const categoryOptions = computed(() => {
return siteCategoryList.value?.map(item => {
@@ -30,77 +58,89 @@ const categoryOptions = computed(() => {
})
})
// 注册事件
const emit = defineEmits(['close'])
// 数据列表
const resourceDataList = ref<TorrentInfo[]>([])
// 搜索
const resourceSearch = ref('')
// 总条数
const resourceTotalItems = ref(0)
// 每页条数
const resourceItemsPerPage = ref(25)
// 加载状态
const resourceLoading = ref(false)
// 种子元数据
const torrent = ref<TorrentInfo>()
const resourceTotalItems = computed(() => resourceDataList.value.length)
// 资源浏览表头
const resourceHeaders = [
const resourceHeaders = computed(() => [
{ title: t('dialog.siteResource.titleColumn'), key: 'title', sortable: false },
{ title: t('dialog.siteResource.timeColumn'), key: 'pubdate', sortable: true },
{ title: t('dialog.siteResource.sizeColumn'), key: 'size', sortable: true },
{ title: t('dialog.siteResource.seedersColumn'), key: 'seeders', sortable: true },
{ title: t('dialog.siteResource.peersColumn'), key: 'peers', sortable: true },
{ title: '', key: 'actions', sortable: false },
]
])
// 输入框标签
const keywordFieldLabel = computed(() => {
return keyword.value ? '' : t('dialog.siteResource.searchKeyword')
})
const categoryFieldLabel = computed(() => {
return selectCategory.value.length > 0 ? '' : t('dialog.siteResource.resourceCategory')
})
// 结果统计文案
const resultSummaryText = computed(() => {
if (locale.value.startsWith('zh')) {
return `${resourceTotalItems.value} 条结果`
}
return `${resourceTotalItems.value} results`
})
// 是否小屏幕
const isMobileLayout = computed(() => display.smAndDown.value)
// 移动端分页数据
const mobileResourceList = computed(() => resourceDataList.value)
function getResourceItemKey(item: TorrentInfo, index: number) {
return item.page_url || item.enclosure || `${item.title}-${item.pubdate || ''}-${index}`
}
// 打开种子详情页面
function openTorrentDetail(page_url: string) {
if (!page_url) return
window.open(page_url, '_blank')
}
// 下载种子文件
async function downloadTorrentFile(enclosure: string) {
if (!enclosure) return
window.open(enclosure, '_blank')
}
// 促销Chip类
function getVolumeFactorClass(downloadVolume: number, uploadVolume: number) {
if (downloadVolume === 0) return 'text-white bg-lime-500'
else if (downloadVolume < 1) return 'text-white bg-green-500'
else if (uploadVolume !== 1) return 'text-white bg-sky-500'
else return 'text-white bg-gray-500'
if (downloadVolume < 1) return 'text-white bg-green-500'
if (uploadVolume !== 1) return 'text-white bg-sky-500'
return 'text-white bg-gray-500'
}
// 添加下载
async function addDownload(_torrent: any) {
async function addDownload(_torrent: TorrentInfo) {
torrent.value = _torrent
addDownloadDialog.value = true
}
// 添加下载对话框
const addDownloadDialog = ref(false)
// 添加下载成功
function addDownloadSuccess(url: string) {
function addDownloadSuccess(_url: string) {
addDownloadDialog.value = false
}
// 添加下载失败
function addDownloadError(error: string) {
function addDownloadError(_error: string) {
addDownloadDialog.value = false
}
// 调用API查询站点资源
async function getResourceList() {
resourceLoading.value = true
resourcePage.value = 1
try {
resourceDataList.value = await api.get(`site/resource/${props.site?.id}`, {
params: {
@@ -111,7 +151,12 @@ async function getResourceList() {
} catch (error) {
console.error(error)
}
resourceLoading.value = false
if (isMobileLayout.value) {
mobileSearchExpanded.value = false
}
}
// 加载站点分类
@@ -123,16 +168,44 @@ async function getSiteCategoryList() {
}
}
// 装载时查询站点图标
watch([resourceItemsPerPage, resourceTotalItems, () => display.mdAndUp.value], () => {
if (display.mdAndUp.value) {
const maxPage = Math.max(1, Math.ceil(resourceTotalItems.value / resourceItemsPerPage.value))
if (resourcePage.value > maxPage) {
resourcePage.value = maxPage
}
return
}
})
watch(
() => display.mdAndUp.value,
isDesktop => {
if (isDesktop) {
mobileSearchExpanded.value = false
}
},
)
function toggleMobileSearch() {
mobileSearchExpanded.value = !mobileSearchExpanded.value
}
function closeMobileSearch() {
mobileSearchExpanded.value = false
}
// 装载时查询站点分类和资源
onMounted(() => {
getSiteCategoryList()
getResourceList()
})
</script>
<template>
<VDialog scrollable fullscreen :scrim="false" transition="dialog-bottom-transition">
<VCard>
<!-- Toolbar -->
<VDialog scrollable :fullscreen="display.smAndDown.value" max-width="92rem" transition="dialog-bottom-transition">
<VCard class="site-resource-dialog">
<div>
<VToolbar color="primary" density="comfortable">
<VToolbarTitle>{{ t('dialog.siteResource.browseTitle', { name: props.site?.name }) }}</VToolbarTitle>
@@ -144,45 +217,153 @@ onMounted(() => {
</VToolbarItems>
</VToolbar>
</div>
<div class="p-3">
<VRow>
<VCol cols="6" md="5">
<VTextField
v-model="keyword"
size="small"
density="compact"
:label="t('dialog.siteResource.searchKeyword')"
clearable
prepend-inner-icon="mdi-magnify"
/>
</VCol>
<VCol cols="6" md="5">
<VSelect
v-model="selectCategory"
:items="categoryOptions"
size="small"
density="compact"
chips
:label="t('dialog.siteResource.resourceCategory')"
multiple
clearable
prepend-inner-icon="mdi-folder"
/>
</VCol>
<VCol cols="12" md="2" class="text-center">
<VBtn variant="tonal" block prepend-icon="mdi-magnify" @click="getResourceList">
{{ t('dialog.siteResource.search') }}
<div class="pa-3 pb-2">
<template v-if="!isMobileLayout">
<VSheet class="site-resource-filter-panel" rounded="lg" border>
<div class="site-resource-filter-panel__inner">
<VRow class="site-resource-filter-row">
<VCol cols="12" md="4">
<VTextField
v-model="keyword"
class="site-resource-filter-input"
size="small"
density="compact"
variant="solo-filled"
flat
:label="keywordFieldLabel"
clearable
prepend-inner-icon="mdi-magnify"
hide-details
@keyup.enter="getResourceList"
/>
</VCol>
<VCol cols="12" md="5">
<VSelect
v-model="selectCategory"
:items="categoryOptions"
class="site-resource-filter-input"
size="small"
density="compact"
variant="solo-filled"
flat
chips
:label="categoryFieldLabel"
multiple
clearable
prepend-inner-icon="mdi-folder"
hide-details
/>
</VCol>
<VCol cols="12" md="3" class="d-flex align-center">
<VBtn
color="primary"
variant="flat"
block
size="default"
rounded="lg"
prepend-icon="mdi-magnify"
class="site-resource-search-btn"
@click="getResourceList"
>
{{ t('dialog.siteResource.search') }}
</VBtn>
</VCol>
</VRow>
<div
v-if="resourceTotalItems > 0"
class="d-flex justify-space-between align-center flex-wrap gap-2 mt-3"
>
<div class="text-body-2 text-medium-emphasis">
{{ resultSummaryText }}
</div>
<VChip size="small" color="primary" variant="tonal" class="site-resource-result-chip">
{{ resourceTotalItems }}
</VChip>
</div>
</div>
</VSheet>
</template>
<template v-else>
<div class="site-resource-mobile-search">
<VBtn
icon
variant="text"
color="primary"
class="site-resource-mobile-search__toggle"
@click="toggleMobileSearch"
>
<VIcon icon="mdi-magnify" />
</VBtn>
</VCol>
</VRow>
<div v-if="resourceTotalItems > 0" class="text-body-2 text-medium-emphasis">
{{ resultSummaryText }}
</div>
</div>
<VExpandTransition>
<div v-if="mobileSearchExpanded" class="mt-2">
<VSheet class="site-resource-filter-panel" rounded="lg" border>
<div class="site-resource-filter-panel__inner">
<VRow class="site-resource-filter-row">
<VCol cols="12">
<VTextField
v-model="keyword"
class="site-resource-filter-input"
size="small"
density="compact"
variant="solo-filled"
flat
:label="keywordFieldLabel"
clearable
prepend-inner-icon="mdi-magnify"
hide-details
autofocus
@keyup.enter="getResourceList"
/>
</VCol>
<VCol cols="12">
<VSelect
v-model="selectCategory"
:items="categoryOptions"
class="site-resource-filter-input"
size="small"
density="compact"
variant="solo-filled"
flat
chips
:label="categoryFieldLabel"
multiple
clearable
prepend-inner-icon="mdi-folder"
hide-details
/>
</VCol>
<VCol cols="12" class="d-flex gap-2">
<VBtn color="primary" variant="flat" block rounded="lg" class="site-resource-search-btn" @click="getResourceList">
{{ t('dialog.siteResource.search') }}
</VBtn>
<VBtn variant="text" rounded="lg" @click="closeMobileSearch">
{{ t('common.cancel') }}
</VBtn>
</VCol>
</VRow>
</div>
</VSheet>
</div>
</VExpandTransition>
</template>
</div>
<VCardText class="px-0 py-0 my-0">
<VCardText class="site-resource-content px-0 py-0 my-0">
<VDataTable
v-if="display.mdAndUp.value"
v-model:page="resourcePage"
v-model:items-per-page="resourceItemsPerPage"
:headers="resourceHeaders"
:items="resourceDataList"
:items-length="resourceTotalItems"
:search="resourceSearch"
:loading="resourceLoading"
density="compact"
item-value="title"
@@ -191,60 +372,69 @@ onMounted(() => {
hover
:items-per-page-text="t('dialog.siteResource.itemsPerPage')"
:loading-text="t('dialog.siteResource.loading')"
class="h-full"
:items-per-page-options="[10, 25, 50, 100]"
height="100%"
class="h-full site-resource-table"
>
<template #item.title="{ item }">
<a href="javascript:void(0)" @click.stop="addDownload(item)">
<div class="text-high-emphasis pt-1">
<button type="button" class="site-resource-title-btn text-start" @click.stop="addDownload(item)">
<div class="text-high-emphasis pt-1 font-weight-medium">
{{ item.title }}
</div>
<div class="text-sm my-1">
<div v-if="item.description" class="text-sm my-1 text-medium-emphasis">
{{ item.description }}
</div>
<VChip v-if="item.hit_and_run" variant="elevated" size="small" class="me-1 mb-1 text-white bg-black">
H&R
</VChip>
<VChip v-if="item.freedate_diff" variant="elevated" color="secondary" size="small" class="me-1 mb-1">
{{ item.freedate_diff }}
</VChip>
<VChip
v-for="(label, index) in item.labels"
:key="index"
variant="elevated"
size="small"
color="primary"
class="me-1 mb-1"
>
{{ label }}
</VChip>
<VChip
v-if="item.downloadvolumefactor !== 1 || item.uploadvolumefactor !== 1"
:class="getVolumeFactorClass(item.downloadvolumefactor, item.uploadvolumefactor)"
variant="elevated"
size="small"
class="me-1 mb-1"
>
{{ item.volume_factor }}
</VChip>
</a>
<div class="mt-2">
<VChip v-if="item.hit_and_run" variant="elevated" size="small" class="me-1 mb-1 text-white bg-black">
H&amp;R
</VChip>
<VChip v-if="item.freedate_diff" variant="elevated" color="secondary" size="small" class="me-1 mb-1">
{{ item.freedate_diff }}
</VChip>
<VChip
v-for="(label, index) in item.labels"
:key="index"
variant="elevated"
size="small"
color="primary"
class="me-1 mb-1"
>
{{ label }}
</VChip>
<VChip
v-if="item.downloadvolumefactor !== 1 || item.uploadvolumefactor !== 1"
:class="getVolumeFactorClass(item.downloadvolumefactor, item.uploadvolumefactor)"
variant="elevated"
size="small"
class="me-1 mb-1"
>
{{ item.volume_factor }}
</VChip>
</div>
</button>
</template>
<template #item.pubdate="{ item }">
<div>{{ item.date_elapsed }}</div>
<div class="text-sm">
<div class="text-sm text-medium-emphasis">
{{ item.pubdate }}
</div>
</template>
<template #item.size="{ item }">
<div class="text-nowrap whitespace-nowrap">
{{ formatFileSize(item.size) }}
</div>
</template>
<template #item.seeders="{ item }">
<div>{{ item.seeders }}</div>
</template>
<template #item.peers="{ item }">
<div>{{ item.peers }}</div>
</template>
<template #item.actions="{ item }">
<div class="me-n3">
<IconBtn>
@@ -268,11 +458,136 @@ onMounted(() => {
</IconBtn>
</div>
</template>
<template #no-data>{{ t('dialog.siteResource.noData') }}</template>
</VDataTable>
<div v-else class="site-resource-mobile">
<div v-if="resourceLoading" class="px-4 py-6">
<VProgressLinear color="primary" indeterminate rounded />
<div class="text-center text-body-2 text-medium-emphasis mt-3">
{{ t('dialog.siteResource.loading') }}
</div>
</div>
<div v-else-if="mobileResourceList.length > 0" class="site-resource-mobile__list px-3 pb-4">
<ProgressiveCardGrid
:items="mobileResourceList"
:columns="1"
:gap="12"
:estimated-item-height="320"
:overscan-rows="5"
:get-item-key="getResourceItemKey"
>
<template #default="{ item }">
<VCard>
<VCardText class="pa-4">
<button type="button" class="site-resource-title-btn text-start" @click="addDownload(item)">
<div class="text-body-1 font-weight-medium text-high-emphasis">
{{ item.title }}
</div>
<div
v-if="item.description"
class="site-resource-card__description mt-2 text-body-2 text-medium-emphasis"
>
{{ item.description }}
</div>
</button>
<div class="mt-3">
<VChip
v-if="item.hit_and_run"
variant="elevated"
size="small"
class="me-1 mb-1 text-white bg-black"
>
H&amp;R
</VChip>
<VChip
v-if="item.freedate_diff"
variant="elevated"
color="secondary"
size="small"
class="me-1 mb-1"
>
{{ item.freedate_diff }}
</VChip>
<VChip
v-for="(label, chipIndex) in item.labels"
:key="chipIndex"
variant="elevated"
size="small"
color="primary"
class="me-1 mb-1"
>
{{ label }}
</VChip>
<VChip
v-if="item.downloadvolumefactor !== 1 || item.uploadvolumefactor !== 1"
:class="getVolumeFactorClass(item.downloadvolumefactor, item.uploadvolumefactor)"
variant="elevated"
size="small"
class="me-1 mb-1"
>
{{ item.volume_factor }}
</VChip>
</div>
<div class="site-resource-card__meta mt-4">
<div class="site-resource-card__meta-item">
<div class="text-caption text-medium-emphasis">{{ t('dialog.siteResource.timeColumn') }}</div>
<div class="text-body-2 font-weight-medium">{{ item.date_elapsed || item.pubdate || '-' }}</div>
<div v-if="item.pubdate" class="text-caption text-medium-emphasis mt-1">{{ item.pubdate }}</div>
</div>
<div class="site-resource-card__meta-item">
<div class="text-caption text-medium-emphasis">{{ t('dialog.siteResource.sizeColumn') }}</div>
<div class="text-body-2 font-weight-medium">{{ formatFileSize(item.size) }}</div>
</div>
<div class="site-resource-card__meta-item">
<div class="text-caption text-medium-emphasis">{{ t('dialog.siteResource.seedersColumn') }}</div>
<div class="text-body-2 font-weight-medium">{{ item.seeders }}</div>
</div>
<div class="site-resource-card__meta-item">
<div class="text-caption text-medium-emphasis">{{ t('dialog.siteResource.peersColumn') }}</div>
<div class="text-body-2 font-weight-medium">{{ item.peers }}</div>
</div>
</div>
<div class="site-resource-card__actions mt-4">
<VBtn color="primary" variant="flat" block prepend-icon="mdi-download" @click="addDownload(item)">
{{ t('actionStep.addDownload') }}
</VBtn>
<div class="site-resource-card__secondary-actions mt-2">
<VBtn
variant="tonal"
prepend-icon="mdi-open-in-new"
@click="openTorrentDetail(item.page_url || '')"
>
{{ t('common.viewDetails') }}
</VBtn>
<VBtn
v-if="item.enclosure?.startsWith('http')"
variant="tonal"
prepend-icon="mdi-tray-arrow-down"
@click="downloadTorrentFile(item.enclosure)"
>
{{ t('dialog.siteResource.downloadTorrent') }}
</VBtn>
</div>
</div>
</VCardText>
</VCard>
</template>
</ProgressiveCardGrid>
</div>
<div v-else class="px-4 py-10 text-center text-medium-emphasis">
{{ t('dialog.siteResource.noData') }}
</div>
</div>
</VCardText>
</VCard>
<!-- 添加下载对话框 -->
<AddDownloadDialog
v-if="addDownloadDialog"
v-model="addDownloadDialog"
@@ -285,7 +600,169 @@ onMounted(() => {
</template>
<style lang="scss" scoped>
.site-resource-dialog {
display: flex;
flex-direction: column;
overflow: hidden;
}
.site-resource-filter-row {
align-items: center;
}
.site-resource-filter-panel {
border-color: rgba(var(--v-border-color), calc(var(--v-border-opacity) * 0.9));
background:
radial-gradient(circle at top left, rgba(var(--v-theme-primary), 0.06), transparent 40%),
linear-gradient(180deg, rgba(var(--v-theme-surface), 0.98), rgba(var(--v-theme-surface), 0.93));
box-shadow: 0 10px 24px rgba(15, 23, 42, 4%);
}
.site-resource-filter-panel__inner {
padding: 0.75rem 0.85rem;
}
.site-resource-filter-input :deep(.v-field) {
border-radius: 0.75rem;
background: rgba(var(--v-theme-surface), 0.92);
box-shadow: inset 0 0 0 1px rgba(var(--v-border-color), calc(var(--v-border-opacity) * 0.8));
}
.site-resource-filter-input :deep(.v-field__prepend-inner) {
color: rgba(var(--v-theme-primary), 0.85);
}
.site-resource-search-btn {
box-shadow: 0 8px 18px rgba(var(--v-theme-primary), 0.18);
letter-spacing: 0.02em;
min-block-size: 40px;
}
.site-resource-result-chip {
font-weight: 600;
}
.site-resource-mobile-search {
display: flex;
align-items: center;
justify-content: space-between;
gap: 0.75rem;
}
.site-resource-mobile-search__toggle {
flex: 0 0 auto;
}
.site-resource-title-btn {
padding: 0;
border: 0;
background: transparent;
cursor: pointer;
inline-size: 100%;
}
.site-resource-content {
flex: 1 1 auto;
min-block-size: 0;
overflow: hidden;
}
.site-resource-table {
block-size: 100%;
}
.site-resource-table :deep(.v-data-table) {
display: flex;
flex-direction: column;
block-size: 100%;
}
.site-resource-table :deep(.v-data-table__wrapper) {
flex: 1 1 auto;
min-block-size: 0;
}
.site-resource-table :deep(.v-table__wrapper) {
flex: 1 1 auto;
min-block-size: 0;
}
.site-resource-table :deep(.v-data-table-footer) {
flex: 0 0 auto;
}
.site-resource-mobile {
overflow-y: auto;
block-size: 100%;
}
.site-resource-mobile__list {
min-block-size: 100%;
}
.v-table th {
white-space: nowrap;
}
.site-resource-card__description {
display: -webkit-box;
overflow: hidden;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
}
.site-resource-card__meta {
display: grid;
gap: 0.55rem;
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.site-resource-card__meta-item {
border: 1px solid rgba(var(--v-border-color), calc(var(--v-border-opacity) * 0.7));
border-radius: 0.6rem;
background: rgba(var(--v-theme-surface), 0.78);
min-block-size: 0;
padding-block: 0.55rem;
padding-inline: 0.65rem;
}
.site-resource-card__meta-item :deep(.text-caption) {
font-size: 0.72rem !important;
line-height: 1.2;
}
.site-resource-card__meta-item :deep(.text-body-2) {
font-size: 0.82rem !important;
line-height: 1.25;
}
.site-resource-card__secondary-actions {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
.site-resource-card__secondary-actions :deep(.v-btn) {
flex: 1 1 12rem;
}
@media (width >= 960px) {
.site-resource-dialog {
block-size: min(88vh, 960px);
}
}
@media (width <= 959px) {
.site-resource-dialog {
border-radius: 0;
}
.site-resource-filter-panel__inner {
padding: 0.7rem 0.75rem;
}
.site-resource-mobile-search {
min-block-size: 2.5rem;
}
}
</style>

View File

@@ -52,6 +52,7 @@ const subscribeForm = ref<Subscribe>({
username: '',
sites: [],
best_version: undefined,
best_version_full: undefined,
current_priority: 0,
downloader: '',
date: '',
@@ -226,6 +227,7 @@ async function getSubscribeInfo() {
const result: Subscribe = await api.get(`subscribe/${props.subid}`)
subscribeForm.value = result
subscribeForm.value.best_version = subscribeForm.value.best_version === 1
subscribeForm.value.best_version_full = subscribeForm.value.best_version_full === 1
subscribeForm.value.search_imdbid = subscribeForm.value.search_imdbid === 1
// 加载剧集组
if (subscribeForm.value.type == '电视剧') getEpisodeGroups()
@@ -273,6 +275,16 @@ const targetDirectories = computed(() => {
return downloadDirectories.value.map(item => item.download_path)
})
// 仅电视剧订阅支持全集洗版,电影保持原有洗版逻辑
const isTvSubscribe = computed(() => props.type === '电视剧' || subscribeForm.value.type === '电视剧')
watch(
() => subscribeForm.value.best_version,
bestVersion => {
if (!bestVersion) subscribeForm.value.best_version_full = false
},
)
onMounted(() => {
queryFilterRuleGroups()
loadDownloadDirectories()
@@ -426,6 +438,14 @@ onMounted(() => {
persistent-hint
/>
</VCol>
<VCol v-if="isTvSubscribe && subscribeForm.best_version" cols="12" md="4">
<VSwitch
v-model="subscribeForm.best_version_full"
:label="t('dialog.subscribeEdit.bestVersionFull')"
:hint="t('dialog.subscribeEdit.bestVersionFullHint')"
persistent-hint
/>
</VCol>
<VCol cols="12" md="4">
<VSwitch
v-model="subscribeForm.search_imdbid"

View File

@@ -76,12 +76,12 @@ async function loadHistory({ done }: { done: any }) {
// 返回加载成功
done('ok')
}
// 取消加载中
loading.value = false
} catch (e) {
console.error(e)
// 返回加载失败
done('error')
} finally {
loading.value = false
}
}
@@ -153,65 +153,67 @@ function getMediaTypeText(type: string | undefined) {
</VCardItem>
<VDivider />
<VDialogCloseBtn @click="emit('close')" />
<VList lines="two">
<VInfiniteScroll mode="intersect" side="end" :items="historyList" class="overflow-visible" @load="loadHistory">
<VList lines="two" class="flex-grow-1 min-h-0 py-0">
<VInfiniteScroll mode="intersect" side="end" :items="historyList" class="h-100" @load="loadHistory">
<template #loading>
<LoadingBanner />
</template>
<template #empty />
<template v-if="historyList.length > 0">
<template v-for="(item, i) in historyList" :key="i">
<VListItem>
<template #prepend>
<VImg
height="75"
width="50"
:src="item.poster"
aspect-ratio="2/3"
class="object-cover rounded ring-gray-500 me-3"
cover
>
<template #placeholder>
<div class="w-full h-full">
<VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
</div>
</template>
</VImg>
</template>
<VListItemTitle v-if="item.type == '电视剧'">
{{ item.name }}
<span class="text-sm">{{ t('dialog.subscribeHistory.season', { season: item.season }) }}</span>
</VListItemTitle>
<VListItemTitle v-else>
{{ item.name }}
</VListItemTitle>
<VListItemSubtitle class="mt-2">{{ formatDateDifference(item.date) }}</VListItemSubtitle>
<VListItemSubtitle class="mt-2">{{ item.description }}</VListItemSubtitle>
<template #append>
<div class="me-n3">
<IconBtn>
<VIcon icon="mdi-dots-vertical" />
<VMenu activator="parent" close-on-content-click>
<VList>
<VListItem
v-for="(menu, i) in dropdownItems"
:key="i"
:base-color="menu.color"
@click="menu.props.click(item)"
>
<template #prepend>
<VIcon :icon="menu.props.prependIcon" />
</template>
<VListItemTitle v-text="menu.title" />
</VListItem>
</VList>
</VMenu>
</IconBtn>
</div>
</template>
</VListItem>
<VVirtualScroll v-if="historyList.length > 0" renderless :items="historyList" :item-height="104">
<template #default="{ item, itemRef }">
<div :ref="itemRef">
<VListItem>
<template #prepend>
<VImg
height="75"
width="50"
:src="item.poster"
aspect-ratio="2/3"
class="object-cover rounded ring-gray-500 me-3"
cover
>
<template #placeholder>
<div class="w-full h-full">
<VSkeletonLoader class="object-cover aspect-w-2 aspect-h-3" />
</div>
</template>
</VImg>
</template>
<VListItemTitle v-if="item.type == '电视剧'">
{{ item.name }}
<span class="text-sm">{{ t('dialog.subscribeHistory.season', { season: item.season }) }}</span>
</VListItemTitle>
<VListItemTitle v-else>
{{ item.name }}
</VListItemTitle>
<VListItemSubtitle class="mt-2">{{ formatDateDifference(item.date) }}</VListItemSubtitle>
<VListItemSubtitle class="mt-2">{{ item.description }}</VListItemSubtitle>
<template #append>
<div class="me-n3">
<IconBtn>
<VIcon icon="mdi-dots-vertical" />
<VMenu activator="parent" close-on-content-click>
<VList>
<VListItem
v-for="(menu, i) in dropdownItems"
:key="i"
:base-color="menu.color"
@click="menu.props.click(item)"
>
<template #prepend>
<VIcon :icon="menu.props.prependIcon" />
</template>
<VListItemTitle v-text="menu.title" />
</VListItem>
</VList>
</VMenu>
</IconBtn>
</div>
</template>
</VListItem>
</div>
</template>
</template>
</VVirtualScroll>
</VInfiniteScroll>
</VList>
<VCardText v-if="historyList.length === 0 && isRefreshed" class="text-center">{{

View File

@@ -8,6 +8,16 @@ import { useI18n } from 'vue-i18n'
import { useBackgroundOptimization } from '@/composables/useBackgroundOptimization'
import CryptoJS from 'crypto-js'
type TransferTask = TransferQueue['tasks'][number]
interface MediaTaskGroup {
media: TransferQueue['media']
titleYear: string
tasks: TransferTask[]
total: number
completed: number
}
// 多语言支持
const { t } = useI18n()
const { useProgressSSE } = useBackgroundOptimization()
@@ -29,9 +39,6 @@ const overallProgress = ref({
// 文件进度映射
const fileProgressMap = ref<Map<string, { enable: boolean; value: number }>>(new Map())
// 数据可刷新标志
const refreshFlag = ref(false)
// 进度是否激活
const progressActive = ref(false)
@@ -58,49 +65,58 @@ function getStateColor(state: string) {
else return 'error'
}
// 从dataList中提取所有的媒体信息合并相同title_year的记录
const mediaList = computed(() => {
const mediaMap = new Map<string, any>()
// 按媒体聚合队列,避免模板中按 tab 重复扫描 dataList
const mediaTaskGroups = computed<MediaTaskGroup[]>(() => {
const groupMap = new Map<string, MediaTaskGroup>()
dataList.value.forEach(item => {
const titleYear = item.media.title_year || ''
if (!mediaMap.has(titleYear)) {
mediaMap.set(titleYear, item.media)
let group = groupMap.get(titleYear)
if (!group) {
group = {
media: item.media,
titleYear,
tasks: [],
total: 0,
completed: 0,
}
groupMap.set(titleYear, group)
}
group.tasks.push(...item.tasks)
group.total += item.tasks.length
group.completed += item.tasks.filter(task => task.state === 'completed').length
})
return Array.from(mediaMap.values())
return Array.from(groupMap.values())
})
// 从dataList中提取所有的媒体信息合并相同title_year的记录
const mediaList = computed(() => {
return mediaTaskGroups.value.map(group => group.media)
})
// 按media计算总数和完成数返回 x/x
function getMediaCount(title_year: string) {
// 按title_year查询出所有media列表
const medias = dataList.value.filter(item => item.media.title_year === title_year)
// 计算media下任务的总数
const total = medias.reduce((acc, cur) => acc + cur.tasks.length, 0)
// 计算media下任务的完成数
const completed = medias.reduce((acc, cur) => acc + cur.tasks.filter(task => task.state === 'completed').length, 0)
return `${completed} / ${total}`
const group = mediaTaskGroups.value.find(item => item.titleYear === title_year)
return `${group?.completed ?? 0} / ${group?.total ?? 0}`
}
// 根据媒体信息获取对应的整理任务合并相同title_year的所有任务
const activeTasks = computed(() => {
const tasks = dataList.value.filter(item => item.media.title_year === activeTab.value).flatMap(item => item.tasks)
return tasks
return mediaTaskGroups.value.find(item => item.titleYear === activeTab.value)?.tasks ?? []
})
// 根据媒体title_year获取对应的任务列表
function getTasksByMedia(title_year: string) {
return dataList.value.filter(item => item.media.title_year === title_year).flatMap(item => item.tasks)
return mediaTaskGroups.value.find(item => item.titleYear === title_year)?.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
const totalTasks = mediaTaskGroups.value.reduce((total, group) => total + group.total, 0)
const completedTasks = mediaTaskGroups.value.reduce((total, group) => total + group.completed, 0)
return totalTasks > 0 ? (completedTasks / totalTasks) * 100 : 0
})

View File

@@ -91,6 +91,7 @@ const userForm = ref<ExtendedUser>({
},
settings: {
wechat_userid: null,
wechatclawbot_userid: null,
telegram_userid: null,
slack_userid: null,
discord_userid: null,
@@ -503,6 +504,15 @@ onMounted(() => {
prepend-inner-icon="mdi-wechat"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="userForm.settings.wechatclawbot_userid"
density="comfortable"
clearable
:label="t('dialog.userAddEdit.wechatClawBot')"
prepend-inner-icon="mdi-robot-happy-outline"
/>
</VCol>
<VCol cols="12" md="6">
<VTextField
v-model="userForm.settings.telegram_userid"

View File

@@ -13,6 +13,7 @@ import MediaInfoDialog from '../dialog/MediaInfoDialog.vue'
import { useI18n } from 'vue-i18n'
import { useBackgroundOptimization } from '@/composables/useBackgroundOptimization'
import { usePWA } from '@/composables/usePWA'
import { useAvailableHeight } from '@/composables/useAvailableHeight'
// 国际化
const { t } = useI18n()
@@ -23,6 +24,10 @@ const display = useDisplay()
const { appMode } = usePWA()
// 计算列表可用高度
// componentOffset = FileToolbar(48) + FileList操作栏(40) + VCard边距(4) = 92
const { availableHeight: listAvailableHeight } = useAvailableHeight(92, 300)
// 输入参数
const inProps = defineProps({
icons: Object,
@@ -102,6 +107,47 @@ const currentItem = ref<FileItem>()
// 选中的项目
const selected = ref<FileItem[]>([])
function getFileItemKey(item?: FileItem) {
return [item?.storage ?? inProps.item.storage ?? '', item?.type ?? '', item?.path ?? ''].join('|')
}
function dedupeFileItems(fileItems: FileItem[]) {
const uniqueItems = new Map<string, FileItem>()
fileItems.forEach(item => {
uniqueItems.set(getFileItemKey(item), item)
})
return Array.from(uniqueItems.values())
}
function syncSelectedItems(nextItems: FileItem[] = items.value) {
if (!selected.value.length) return
const currentItemMap = new Map(nextItems.map(item => [getFileItemKey(item), item]))
selected.value = dedupeFileItems(selected.value)
.map(item => currentItemMap.get(getFileItemKey(item)))
.filter((item): item is FileItem => !!item)
}
const selectedKeys = computed(() => new Set(selected.value.map(item => getFileItemKey(item))))
function isSelected(item: FileItem) {
return selectedKeys.value.has(getFileItemKey(item))
}
function setItemSelected(item: FileItem, checked: boolean) {
const itemKey = getFileItemKey(item)
if (checked) {
if (!selectedKeys.value.has(itemKey)) {
selected.value = [...selected.value, item]
}
return
}
selected.value = selected.value.filter(selectedItem => getFileItemKey(selectedItem) !== itemKey)
}
// 识别结果
const nameTestResult = ref<Context>()
@@ -114,26 +160,46 @@ 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))
}
// 将 glob 模式转换为正则表达式
function globToRegex(pattern: string, flags: string = ''): RegExp {
const regexStr = pattern
.replace(/[.+^${}()|[\]\\]/g, '\\$&')
.replace(/\*/g, '.*')
.replace(/\?/g, '.')
return new RegExp(`^${regexStr}$`, flags)
}
// 通用过滤
const filteredItems = computed(() => {
const filterValue = filter.value
if (!filterValue) {
return items.value
}
// 通配符模式
if (filterValue.includes('*') || filterValue.includes('?')) {
const flags = ignoreCase.value ? 'i' : ''
const regex = globToRegex(filterValue, flags)
return items.value.filter(item => regex.test(item.name ?? ''))
}
// 子字符串模式
if (ignoreCase.value) {
const lowerCaseFilter = filterValue.toLowerCase()
return items.value.filter(item => (item.name ?? '').toLowerCase().includes(lowerCaseFilter))
} else {
return items.value.filter(item => (item.name ?? '').includes(filterValue))
}
})
// 目录过滤
const dirs = computed(() => getFilteredItems('dir'))
const dirs = computed(() => filteredItems.value.filter(item => item.type === 'dir'))
// 文件过滤
const files = computed(() => getFilteredItems('file'))
const files = computed(() => filteredItems.value.filter(item => item.type === 'file'))
// 虚拟列表数据,保持引用稳定,避免模板内联展开数组导致虚拟列表重算。
const displayItems = computed(() => [...dirs.value, ...files.value])
// 是否文件
const isFile = computed(() => inProps.item.type == 'file')
@@ -143,29 +209,12 @@ const transferItems = ref<FileItem[]>([])
// 当前图片地址
const currentImgLink = ref('')
// 计算列表可用高度
const listAvailableHeight = computed(() => {
// 获取视口高度
const viewportHeight = window.innerHeight || document.documentElement.clientHeight
function revokeCurrentImgLink() {
if (!currentImgLink.value) return
// navbar高度
const navbarHeight = 72
// 工具栏高度(包含搜索框和按钮)
const toolbarHeight = 64
// 底部导航栏高度
const footerHeight = appMode.value ? 80 : 16
// 安全区域高度
const safeAreaHeight =
parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--safe-area-inset-bottom')) ||
parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--safe-area-inset-top')) ||
0
// 计算可用高度,预留一些边距
const availableHeight = viewportHeight - navbarHeight - toolbarHeight - footerHeight - safeAreaHeight - 40
// 确保最小高度
return Math.max(availableHeight, 300)
})
URL.revokeObjectURL(currentImgLink.value)
currentImgLink.value = ''
}
// 是否为图片文件
const isImage = computed(() => {
@@ -202,6 +251,7 @@ async function list_files() {
return;
}
items.value = data
syncSelectedItems(data)
emit('loading', false)
loading.value = false
@@ -277,13 +327,7 @@ function changePath(item: FileItem) {
// 点击列表项
function listItemClick(item: FileItem) {
if (selectMode.value) {
if (selected.value.includes(item)) {
selected.value = selected.value.filter(i => i !== item)
} else {
selected.value.push(item)
}
// 去重
selected.value = Array.from(new Set(selected.value))
setItemSelected(item, !isSelected(item))
return false
}
changePath(item)
@@ -304,6 +348,9 @@ async function download(item: FileItem) {
if (result) {
const downloadUrl = URL.createObjectURL(result)
window.open(downloadUrl, '_blank')
setTimeout(() => {
URL.revokeObjectURL(downloadUrl)
}, 60000)
}
}
@@ -321,6 +368,7 @@ async function getImgLink(item: FileItem) {
const result: Blob = (await inProps.axios.request<Blob, Blob>(config))
if (result) {
// 创建图片地址
revokeCurrentImgLink()
currentImgLink.value = URL.createObjectURL(result)
}
}
@@ -331,7 +379,10 @@ watch(
async () => {
if (isImage.value && isFile.value) {
await getImgLink(inProps.item)
return
}
revokeCurrentImgLink()
},
{ immediate: true },
)
@@ -421,7 +472,7 @@ function showTransfer(item: FileItem) {
// 显示批量整理对话框
function showBatchTransfer() {
transferItems.value = selected.value
transferItems.value = dedupeFileItems(selected.value)
transferPopper.value = true
}
@@ -458,6 +509,7 @@ watch(
async () => {
// 清空列表
items.value = []
selected.value = []
// 关闭弹窗
nameTestResult.value = undefined
nameTestDialog.value = false
@@ -614,6 +666,11 @@ function stopLoadingProgress() {
onMounted(() => {
list_files()
})
onUnmounted(() => {
revokeCurrentImgLink()
stopLoadingProgress()
})
</script>
<style scoped>
@@ -639,8 +696,8 @@ onMounted(() => {
flat
density="compact"
variant="plain"
:placeholder="t('common.search')"
prepend-inner-icon="mdi-filter-outline"
:placeholder="t('file.filterPlaceholder')"
:prepend-inner-icon="(filter.includes('*') || filter.includes('?')) ? 'mdi-asterisk' : 'mdi-filter-outline'"
class="mx-2"
rounded
/>
@@ -699,14 +756,18 @@ onMounted(() => {
class="text-high-emphasis file-list-container"
:style="{ height: `${listAvailableHeight}px`, maxHeight: `${listAvailableHeight}px` }"
>
<VVirtualScroll :items="[...dirs, ...files]" style="block-size: 100%">
<VVirtualScroll :items="displayItems" style="block-size: 100%">
<template #default="{ item }">
<VHover>
<template #default="hover">
<VListItem v-bind="hover.props" class="px-3 pe-1" @click="listItemClick(item)">
<template #prepend>
<VListItemAction v-if="selectMode">
<VCheckbox v-model="selected" :value="item" />
<VCheckbox
:model-value="isSelected(item)"
@update:model-value="setItemSelected(item, !!$event)"
@click.stop
/>
</VListItemAction>
<template v-else>
<VIcon

View File

@@ -5,38 +5,23 @@ import { useDisplay } from 'vuetify'
import type { AxiosRequestConfig, AxiosInstance } from 'axios'
import { useI18n } from 'vue-i18n'
import { usePWA } from '@/composables/usePWA'
import { useAvailableHeight } from '@/composables/useAvailableHeight'
// 国际化
const { t } = useI18n()
// 显示器宽度
const display = useDisplay()
const { appMode } = usePWA()
type TreeRow =
| { type: 'root'; key: string; level: number }
| { type: 'loading'; key: string; path: string; level: number }
| { type: 'directory'; key: string; dir: FileItem; level: number }
// 计算列表可用高度
const availableHeight = computed(() => {
// 获取视口高度
const viewportHeight = window.innerHeight || document.documentElement.clientHeight
// navbar高度
const navbarHeight = 72
// 工具栏高度
const toolbarHeight = 25
// 底部导航栏高度
const footerHeight = appMode.value ? 80 : 16
// 安全区域高度
const safeAreaHeight =
parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--safe-area-inset-bottom')) ||
parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--safe-area-inset-top')) ||
0
// 计算可用高度,预留一些边距
const availableHeight = viewportHeight - navbarHeight - toolbarHeight - footerHeight - safeAreaHeight - 40
// 确保最小高度
return Math.max(availableHeight, 300)
})
// componentOffset = FileToolbar(48) = 48
const { availableHeight } = useAvailableHeight(48, 300)
// 输入参数
const props = defineProps({
@@ -152,37 +137,6 @@ async function loadRootDirectories() {
await loadSubdirectories('/')
}
// 检索所有目录节点
function getAllDirectories() {
const allDirs: { dir: FileItem; level: number; parentPath: string }[] = []
// 添加根目录的子目录
if (treeCache.value['/']) {
treeCache.value['/'].forEach(dir => {
allDirs.push({ dir, level: 0, parentPath: '/' })
addSubdirectories(dir.path || '', 1, allDirs)
})
}
return allDirs
}
// 递归添加子目录
function addSubdirectories(
parentPath: string,
level: number,
result: { dir: FileItem; level: number; parentPath: string }[],
) {
if (treeCache.value[parentPath]) {
treeCache.value[parentPath].forEach(dir => {
result.push({ dir, level, parentPath })
if (isFolderExpanded(dir.path || '')) {
addSubdirectories(dir.path || '', level + 1, result)
}
})
}
}
// 监听当前路径变化,自动展开当前路径
watch(
() => props.currentPath,
@@ -244,38 +198,51 @@ const rootDirectories = computed(() => {
return treeCache.value['/'] || []
})
// 扁平化的目录树
const flattenedDirectories = computed(() => {
return getAllDirectories()
})
// 只生成当前可见的目录行,避免折叠/隐藏节点继续留在 DOM 中
const visibleTreeRows = computed<TreeRow[]>(() => {
const rows: TreeRow[] = [{ type: 'root', key: 'root', level: 0 }]
// 检查路径是否为指定目录的子目录或后代
function isChildOrDescendant(path: string, ancestorPath: string) {
if (!path || !ancestorPath) return false
if (ancestorPath === '/') return true
// 确保路径以斜杠结尾,便于比较
const normalizedPath = path.endsWith('/') ? path : path + '/'
const normalizedAncestorPath = ancestorPath.endsWith('/') ? ancestorPath : ancestorPath + '/'
// 检查路径是否以祖先路径开头,但不是祖先路径本身
return normalizedPath.startsWith(normalizedAncestorPath) && normalizedPath !== normalizedAncestorPath
}
// 计算目录相对于其祖先的缩进级别
function getIndentLevel(path: string, ancestorPath: string) {
if (!path || !ancestorPath) return 0
// 根目录特殊处理
if (ancestorPath === '/') {
return path.split('/').filter(p => p).length - 1
if (loading.value['/']) {
rows.push({ type: 'loading', key: 'loading:/', path: '/', level: 0 })
return rows
}
// 计算路径中斜杠的数量差异
const pathParts = path.split('/').filter(p => p).length
const ancestorParts = ancestorPath.split('/').filter(p => p).length
rootDirectories.value.forEach(dir => addVisibleDirectoryRows(dir, 0, rows))
return pathParts - ancestorParts
return rows
})
function addVisibleDirectoryRows(dir: FileItem, level: number, rows: TreeRow[]) {
const path = dir.path || ''
rows.push({
type: 'directory',
key: path || `${level}:${dir.name}`,
dir,
level,
})
if (!path || !isFolderExpanded(path)) {
return
}
if (loading.value[path]) {
rows.push({
type: 'loading',
key: `loading:${path}`,
path,
level: level + 1,
})
return
}
treeCache.value[path]?.forEach(child => addVisibleDirectoryRows(child, level + 1, rows))
}
function getTreeRowStyle(level: number) {
return {
paddingInlineStart: level > 0 ? `${16 + level * 12}px` : undefined,
}
}
// 组件挂载时初始加载
@@ -287,117 +254,75 @@ onMounted(async () => {
<template>
<VCard class="file-navigator rounded-e-0 rounded-t-0" v-if="!isMobile" :height="`${availableHeight}px`">
<div class="tree-container">
<!-- 根目录项 -->
<div
class="tree-item root-item"
:class="{ 'active': currentPath === '/' }"
@click="
handleFolderClick({
storage: storage,
type: 'dir',
name: '/',
path: '/',
})
"
>
<div class="folder-content">
<VIcon icon="mdi-home" class="me-2" color="primary" />
<span>{{ t('file.rootDirectory') }}</span>
</div>
</div>
<!-- 加载根目录 -->
<div v-if="loading['/']" class="tree-loading">
<VProgressCircular indeterminate size="24" color="primary" class="ma-2" />
<span>{{ t('file.loadingDirectoryStructure') }}</span>
</div>
<!-- 目录树结构 -->
<template v-else>
<!-- 一级目录(根目录下的目录) -->
<div v-for="directory in rootDirectories" :key="directory.path" class="tree-item-container">
<!-- 目录项 -->
<div class="tree-item" :class="{ 'active': currentPath === directory.path }">
<div class="folder-toggle" @click.stop="toggleFolder(directory.path || '')">
<VProgressCircular
v-if="loading[directory.path || '']"
indeterminate
size="14"
width="2"
color="primary"
/>
<VIcon
v-else
size="small"
:icon="isFolderExpanded(directory.path || '') ? 'mdi-chevron-down' : 'mdi-chevron-right'"
/>
</div>
<div class="folder-content" @click.stop="handleFolderClick(directory)">
<VIcon
size="small"
:icon="renderFolderIcon(isFolderExpanded(directory.path || ''))"
:color="currentPath === directory.path ? 'primary' : 'amber-darken-1'"
class="me-1"
/>
<span class="folder-name">
{{ directory.name }}
</span>
</div>
<VVirtualScroll :items="visibleTreeRows" :item-height="32" class="tree-container">
<template #default="{ item }">
<div
v-if="item.type === 'root'"
:key="item.key"
class="tree-item root-item"
:class="{ 'active': currentPath === '/' }"
@click="
handleFolderClick({
storage: storage,
type: 'dir',
name: '/',
path: '/',
})
"
>
<div class="folder-content">
<VIcon icon="mdi-home" class="me-2" color="primary" />
<span>{{ t('file.rootDirectory') }}</span>
</div>
</div>
<!-- 子目录容器 - 如果该目录被展开显示其所有子目录 -->
<div v-if="isFolderExpanded(directory.path || '')">
<!-- 加载中状态 -->
<div v-if="loading[directory.path || '']" class="tree-loading pl-8">
<VProgressCircular indeterminate size="14" color="primary" class="ma-2" />
<span class="text-caption">{{ t('common.loading') }}</span>
</div>
<div
v-else-if="item.type === 'loading'"
:key="item.key"
class="tree-loading"
:style="getTreeRowStyle(item.level)"
>
<VProgressCircular indeterminate size="14" color="primary" class="ma-2" />
<span class="text-caption">
{{ item.path === '/' ? t('file.loadingDirectoryStructure') : t('common.loading') }}
</span>
</div>
<!-- 所有层级的子目录列表 -->
<div v-else>
<!-- 遍历所有扁平化的目录列表查找对应层级的目录 -->
<div
v-for="item in flattenedDirectories"
:key="item.dir.path"
v-show="isChildOrDescendant(item.dir.path || '', directory.path || '')"
class="tree-item"
:class="{ 'active': currentPath === item.dir.path }"
:style="{ paddingLeft: 16 + getIndentLevel(item.dir.path || '', directory.path || '') * 12 + 'px' }"
>
<!-- 展开/折叠按钮 -->
<div class="folder-toggle" @click.stop="toggleFolder(item.dir.path || '')">
<VProgressCircular
v-if="loading[item.dir.path || '']"
indeterminate
size="14"
width="2"
color="primary"
/>
<VIcon
v-else
size="small"
:icon="isFolderExpanded(item.dir.path || '') ? 'mdi-chevron-down' : 'mdi-chevron-right'"
/>
</div>
<!-- 文件夹图标和名称 -->
<div class="folder-content" @click.stop="handleFolderClick(item.dir)">
<VIcon
size="small"
:icon="renderFolderIcon(isFolderExpanded(item.dir.path || ''))"
:color="currentPath === item.dir.path ? 'primary' : 'amber-darken-1'"
class="me-1"
/>
<span class="folder-name">
{{ item.dir.name }}
</span>
</div>
</div>
</div>
<div
v-else
:key="item.key"
class="tree-item"
:class="{ 'active': currentPath === item.dir.path }"
:style="getTreeRowStyle(item.level)"
>
<div class="folder-toggle" @click.stop="toggleFolder(item.dir.path || '')">
<VProgressCircular
v-if="loading[item.dir.path || '']"
indeterminate
size="14"
width="2"
color="primary"
/>
<VIcon
v-else
size="small"
:icon="isFolderExpanded(item.dir.path || '') ? 'mdi-chevron-down' : 'mdi-chevron-right'"
/>
</div>
<div class="folder-content" @click.stop="handleFolderClick(item.dir)">
<VIcon
size="small"
:icon="renderFolderIcon(isFolderExpanded(item.dir.path || ''))"
:color="currentPath === item.dir.path ? 'primary' : 'amber-darken-1'"
class="me-1"
/>
<span class="folder-name">
{{ item.dir.name }}
</span>
</div>
</div>
</template>
</div>
</VVirtualScroll>
</VCard>
</template>
@@ -422,8 +347,8 @@ onMounted(async () => {
}
.tree-container {
overflow: hidden auto;
flex: 1;
min-block-size: 0;
}
.tree-item-container {

View File

@@ -30,6 +30,10 @@ const inProps = defineProps({
type: String,
default: 'name',
},
showNewFolderButton: {
type: Boolean,
default: true,
},
})
// 对外事件
@@ -109,11 +113,20 @@ async function mkdir() {
emit('foldercreated')
}
function openNewFolderDialog() {
newFolderName.value = ''
newFolderPopper.value = true
}
// 计算排序图标
const sortIcon = computed(() => {
if (inProps.sort === 'time') return 'mdi-sort-clock-ascending-outline'
else return 'mdi-sort-alphabetical-ascending'
})
defineExpose({
openNewFolderDialog,
})
</script>
<template>
@@ -165,9 +178,9 @@ const sortIcon = computed(() => {
</IconBtn>
<!-- 新建文件夹 -->
<VDialog v-model="newFolderPopper" max-width="35rem">
<template #activator="{ props }">
<IconBtn>
<VIcon v-bind="props" icon="mdi-folder-plus-outline" />
<template v-if="showNewFolderButton" #activator="{ props }">
<IconBtn v-bind="props">
<VIcon icon="mdi-folder-plus-outline" />
</IconBtn>
</template>
<VCard>

View File

@@ -8,7 +8,44 @@ const props = defineProps({
const emit = defineEmits(['update:modelValue'])
const menu = ref(false)
const currentCron = ref(props.modelValue)
const menuRoot = ref<HTMLElement>()
const instance = getCurrentInstance()
const menuContentClass = `cron-input-menu-${instance?.uid ?? 'default'}`
const menuContentSelector = `.${menuContentClass}`
function isCronMenuTarget(target: EventTarget | null) {
if (!(target instanceof Element)) return false
if (menuRoot.value?.contains(target)) return true
const menuContent = document.querySelector(menuContentSelector)
if (menuContent?.contains(target)) return true
const overlayId = target.closest('.v-overlay')?.getAttribute('id')
if (!overlayId || !menuContent) return false
return Array.from(menuContent.querySelectorAll('[aria-owns]')).some(
activator => activator.getAttribute('aria-owns') === overlayId,
)
}
function closeOnOutsidePointerDown(event: PointerEvent) {
if (!menu.value || isCronMenuTarget(event.target)) return
menu.value = false
}
onMounted(() => {
document.addEventListener('pointerdown', closeOnOutsidePointerDown, true)
})
onBeforeUnmount(() => {
document.removeEventListener('pointerdown', closeOnOutsidePointerDown, true)
})
watch(currentCron, newVal => {
emit('update:modelValue', newVal)
@@ -23,8 +60,13 @@ watch(
</script>
<template>
<div>
<VMenu :close-on-content-click="false" content-class="cursor-default" persistent>
<div ref="menuRoot">
<VMenu
v-model="menu"
:close-on-content-click="false"
:content-class="['cursor-default', menuContentClass]"
persistent
>
<template v-slot:activator="{ props }">
<slot name="activator" :menuprops="props" />
</template>

View File

@@ -103,8 +103,21 @@ const selectedPath = computed(() => {
return ''
})
function isFileItem(value: unknown): value is FileItem {
return typeof value === 'object' && value !== null && 'path' in value && 'type' in value
}
function activateDir({ id }: { id: unknown }) {
const item = isFileItem(id) ? id : typeof id === 'string' ? findPath(treeItems.value[0], id) : null
if (!item || item.type !== 'dir') return
activedDirs.value = [item]
}
watch(activedDirs, newVal => {
if (!newVal.length) return
emit('update:modelValue', selectedPath.value)
})
@@ -165,8 +178,10 @@ watch(
activatable
return-object
max-height="20rem"
open-on-click
expand-icon="mdi-folder"
collapse-icon="mdi-folder-open"
@click:open="activateDir"
/>
</VMenu>
</div>

View File

@@ -1,21 +1,70 @@
<script setup lang="ts">
import { h, resolveComponent } from 'vue'
import api from '@/api'
import { DashboardItem } from '@/api/types'
import AnalyticsMediaStatistic from '@/views/dashboard/AnalyticsMediaStatistic.vue'
import AnalyticsScheduler from '@/views/dashboard/AnalyticsScheduler.vue'
import AnalyticsSpeed from '@/views/dashboard/AnalyticsSpeed.vue'
import AnalyticsStorage from '@/views/dashboard/AnalyticsStorage.vue'
import AnalyticsWeeklyOverview from '@/views/dashboard/AnalyticsWeeklyOverview.vue'
import AnalyticsCpu from '@/views/dashboard/AnalyticsCpu.vue'
import AnalyticsMemory from '@/views/dashboard/AnalyticsMemory.vue'
import AnalyticsNetwork from '@/views/dashboard/AnalyticsNetwork.vue'
import MediaServerLatest from '@/views/dashboard/MediaServerLatest.vue'
import MediaServerLibrary from '@/views/dashboard/MediaServerLibrary.vue'
import MediaServerPlaying from '@/views/dashboard/MediaServerPlaying.vue'
import DashboardRender from '@/components/render/DashboardRender.vue'
import { isNullOrEmptyObject } from '@/@core/utils'
import { loadRemoteComponent } from '@/utils/federationLoader'
const DashboardSkeleton = {
setup() {
const SkeletonLoader = resolveComponent('VSkeletonLoader')
// 用 render 函数避免 runtime-only Vue 为异步 loadingComponent 解析模板。
return () => h(SkeletonLoader, { type: 'card' })
},
}
const asyncDashboardOptions = {
loadingComponent: DashboardSkeleton,
}
// 内置仪表盘按需加载,关闭的卡片不再挤进 dashboard 首屏 chunk。
const AnalyticsStorage = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsStorage.vue'),
...asyncDashboardOptions,
})
const AnalyticsMediaStatistic = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsMediaStatistic.vue'),
...asyncDashboardOptions,
})
const AnalyticsWeeklyOverview = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsWeeklyOverview.vue'),
...asyncDashboardOptions,
})
const AnalyticsSpeed = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsSpeed.vue'),
...asyncDashboardOptions,
})
const AnalyticsScheduler = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsScheduler.vue'),
...asyncDashboardOptions,
})
const AnalyticsCpu = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsCpu.vue'),
...asyncDashboardOptions,
})
const AnalyticsMemory = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsMemory.vue'),
...asyncDashboardOptions,
})
const AnalyticsNetwork = defineAsyncComponent({
loader: () => import('@/views/dashboard/AnalyticsNetwork.vue'),
...asyncDashboardOptions,
})
const MediaServerLibrary = defineAsyncComponent({
loader: () => import('@/views/dashboard/MediaServerLibrary.vue'),
...asyncDashboardOptions,
})
const MediaServerPlaying = defineAsyncComponent({
loader: () => import('@/views/dashboard/MediaServerPlaying.vue'),
...asyncDashboardOptions,
})
const MediaServerLatest = defineAsyncComponent({
loader: () => import('@/views/dashboard/MediaServerLatest.vue'),
...asyncDashboardOptions,
})
// 输入参数
const props = defineProps({
// 仪表板配置
@@ -53,9 +102,7 @@ const dynamicPluginComponent = defineAsyncComponent({
}
},
// 加载中显示的组件
loadingComponent: {
template: '<VSkeletonLoader type="card"></VSkeletonLoader>',
},
loadingComponent: DashboardSkeleton,
// 添加错误处理
errorComponent: {
template: `

View File

@@ -0,0 +1,828 @@
<script setup lang="ts">
import type { ComponentPublicInstance } from 'vue'
type ItemKey = string | number
type ScrollTarget = Window | HTMLElement
const props = withDefaults(
defineProps<{
items: any[]
minItemWidth?: number
itemAspectRatio?: number
estimatedItemHeight?: number
scrollToIndex?: number
gap?: number
columns?: number
initialCount?: number
batchSize?: number
overscanRows?: number
getItemKey?: (item: any, index: number) => string | number
}>(),
{
minItemWidth: 144,
itemAspectRatio: 1.5,
estimatedItemHeight: undefined,
scrollToIndex: undefined,
gap: 16,
columns: undefined,
initialCount: 24,
batchSize: 24,
overscanRows: 4,
getItemKey: undefined,
},
)
interface VirtualCell {
item: any
index: number
key: ItemKey
}
const containerRef = ref<HTMLElement | null>(null)
const trackRef = ref<HTMLElement | null>(null)
const layoutWidth = ref(0)
const viewportTop = ref(0)
const viewportBottom = ref(0)
const heightVersion = ref(0)
const itemHeights = new Map<ItemKey, number>()
const observedElements = new Map<HTMLElement, ItemKey>()
const keyElements = new Map<ItemKey, HTMLElement>()
const itemRefCallbacks = new Map<ItemKey, (element: Element | ComponentPublicInstance | null) => void>()
let resizeObserver: ResizeObserver | null = null
let itemResizeObserver: ResizeObserver | null = null
let scrollTarget: ScrollTarget | null = null
let layoutFrameId: number | null = null
let scrollFrameId: number | null = null
let mounted = false
let pendingRevealIndex: number | null = null
let lastMeasuredColumnCount = 0
let lastMeasuredColumnWidth = 0
const safeGap = computed(() => Math.max(0, props.gap))
const safeMinItemWidth = computed(() => Math.max(1, props.minItemWidth))
const safeOverscanRows = computed(() => Math.max(1, props.overscanRows))
const columnCount = computed(() => {
if (props.columns && props.columns > 0) {
return Math.max(1, Math.floor(props.columns))
}
if (!layoutWidth.value) {
return 1
}
return Math.max(1, Math.floor((layoutWidth.value + safeGap.value) / (safeMinItemWidth.value + safeGap.value)))
})
const columnWidth = computed(() => {
const columns = columnCount.value
const width = layoutWidth.value || safeMinItemWidth.value
return Math.max(1, (width - safeGap.value * (columns - 1)) / columns)
})
const estimatedHeight = computed(() => {
if (props.estimatedItemHeight && props.estimatedItemHeight > 0) {
return props.estimatedItemHeight
}
return Math.max(1, columnWidth.value * props.itemAspectRatio)
})
const itemKeys = computed(() => props.items.map((item, index) => getComparableKey(item, index)))
const keyIndexMap = computed(() => {
const map = new Map<ItemKey, number>()
itemKeys.value.forEach((key, index) => {
map.set(key, index)
})
return map
})
const rowMetrics = computed(() => {
heightVersion.value
const rows = Math.ceil(props.items.length / columnCount.value)
const heights: number[] = []
const measuredRows: boolean[] = []
const offsets: number[] = [0]
for (let row = 0; row < rows; row += 1) {
const startIndex = row * columnCount.value
const endIndex = Math.min(startIndex + columnCount.value, props.items.length)
let rowHeight = 0
let hasUnmeasuredItem = false
for (let index = startIndex; index < endIndex; index += 1) {
const height = itemHeights.get(itemKeys.value[index])
if (height && height > 0) {
rowHeight = Math.max(rowHeight, height)
} else {
hasUnmeasuredItem = true
}
}
if (hasUnmeasuredItem) {
rowHeight = Math.max(rowHeight, estimatedHeight.value)
} else {
rowHeight = Math.max(rowHeight, 1)
}
heights.push(rowHeight)
measuredRows.push(!hasUnmeasuredItem)
offsets.push(offsets[row] + rowHeight + (row < rows - 1 ? safeGap.value : 0))
}
return {
heights,
measuredRows,
offsets,
rowCount: rows,
totalHeight: offsets[rows] ?? 0,
}
})
const totalHeight = computed(() => rowMetrics.value.totalHeight)
const visibleRange = computed(() => {
const { heights, offsets, rowCount } = rowMetrics.value
if (!props.items.length || rowCount === 0) {
return {
endIndex: 0,
endRow: 0,
startIndex: 0,
startRow: 0,
}
}
const top = Math.max(0, Math.min(viewportTop.value, totalHeight.value))
const bottom = Math.max(top, Math.min(viewportBottom.value, totalHeight.value))
const firstVisibleRow = findFirstRowAtOrAfterOffset(offsets, heights, top)
const lastVisibleRow = findLastRowAtOrBeforeOffset(offsets, rowCount, bottom)
const startRow = clamp(firstVisibleRow - safeOverscanRows.value, 0, rowCount - 1)
const endRow = clamp(lastVisibleRow + safeOverscanRows.value, startRow, rowCount - 1)
return {
endIndex: Math.min(props.items.length, (endRow + 1) * columnCount.value),
endRow,
startIndex: startRow * columnCount.value,
startRow,
}
})
const visibleCells = computed<VirtualCell[]>(() => {
const cells: VirtualCell[] = []
for (let index = visibleRange.value.startIndex; index < visibleRange.value.endIndex; index += 1) {
cells.push({
item: props.items[index],
index,
key: itemKeys.value[index],
})
}
return cells
})
const topSpacerHeight = computed(() => rowMetrics.value.offsets[visibleRange.value.startRow] ?? 0)
const visibleBlockHeight = computed(() => {
if (!props.items.length || visibleRange.value.endIndex <= visibleRange.value.startIndex) {
return 0
}
return Math.max(
(rowMetrics.value.offsets[visibleRange.value.endRow] ?? 0) +
(rowMetrics.value.heights[visibleRange.value.endRow] ?? 0) -
(rowMetrics.value.offsets[visibleRange.value.startRow] ?? 0),
0,
)
})
const bottomSpacerHeight = computed(() => {
return Math.max(totalHeight.value - topSpacerHeight.value - visibleBlockHeight.value, 0)
})
const gridStyle = computed(() => ({
columnGap: `${safeGap.value}px`,
gridTemplateColumns: `repeat(${columnCount.value}, minmax(0, 1fr))`,
rowGap: `${safeGap.value}px`,
}))
function clamp(value: number, min: number, max: number) {
return Math.min(Math.max(value, min), max)
}
function getComparableKey(item: any, index: number): ItemKey {
if (props.getItemKey) {
return props.getItemKey(item, index)
}
return index
}
function findFirstRowAtOrAfterOffset(offsets: number[], heights: number[], offset: number) {
let low = 0
let high = heights.length - 1
let answer = 0
while (low <= high) {
const mid = Math.floor((low + high) / 2)
const rowEnd = offsets[mid] + heights[mid]
if (rowEnd >= offset) {
answer = mid
high = mid - 1
} else {
low = mid + 1
}
}
return answer
}
function findLastRowAtOrBeforeOffset(offsets: number[], rowCount: number, offset: number) {
let low = 0
let high = rowCount - 1
let answer = 0
while (low <= high) {
const mid = Math.floor((low + high) / 2)
if (offsets[mid] <= offset) {
answer = mid
low = mid + 1
} else {
high = mid - 1
}
}
return answer
}
function getElementFromRef(element: Element | ComponentPublicInstance | null): HTMLElement | null {
if (!element || typeof HTMLElement === 'undefined') {
return null
}
if (element instanceof HTMLElement) {
return element
}
if (!('$el' in element)) {
return null
}
const componentElement = element.$el
return componentElement instanceof HTMLElement ? componentElement : null
}
function getRowHeight(row: number) {
const startIndex = row * columnCount.value
const endIndex = Math.min(startIndex + columnCount.value, props.items.length)
let rowHeight = 0
let hasUnmeasuredItem = false
for (let index = startIndex; index < endIndex; index += 1) {
const height = itemHeights.get(itemKeys.value[index])
if (height && height > 0) {
rowHeight = Math.max(rowHeight, height)
} else {
hasUnmeasuredItem = true
}
}
if (hasUnmeasuredItem) {
return Math.max(rowHeight, estimatedHeight.value)
}
return Math.max(rowHeight, 1)
}
function ensureItemResizeObserver() {
if (itemResizeObserver || typeof ResizeObserver === 'undefined') {
return
}
itemResizeObserver = new ResizeObserver(entries => {
let shouldUpdate = false
let scrollAdjustment = 0
const currentViewportTop = viewportTop.value
const currentOffsets = rowMetrics.value.offsets
entries.forEach(entry => {
const element = entry.target
if (!(element instanceof HTMLElement)) {
return
}
const key = observedElements.get(element)
const index = key === undefined ? undefined : keyIndexMap.value.get(key)
if (key === undefined || index === undefined) {
return
}
const nextHeight = getResizeEntryHeight(entry)
const previousHeight = itemHeights.get(key)
if (!nextHeight || Math.abs((previousHeight ?? 0) - nextHeight) < 0.5) {
return
}
const row = Math.floor(index / columnCount.value)
const rowWasFullyMeasured = rowMetrics.value.measuredRows[row]
const previousRowHeight = getRowHeight(row)
const previousRowBottom = (currentOffsets[row] ?? 0) + previousRowHeight
if (
rowWasFullyMeasured &&
previousHeight !== undefined &&
previousHeight < previousRowHeight - 0.5 &&
nextHeight <= previousRowHeight + 0.5
) {
return
}
itemHeights.set(key, nextHeight)
const nextRowHeight = getRowHeight(row)
const delta = nextRowHeight - previousRowHeight
if (Math.abs(delta) >= 0.5 && previousRowBottom < currentViewportTop) {
scrollAdjustment += delta
}
shouldUpdate = true
})
if (!shouldUpdate) {
return
}
heightVersion.value += 1
if (Math.abs(scrollAdjustment) >= 0.5) {
adjustScrollTop(scrollAdjustment)
}
queueViewportSync()
})
}
function getResizeEntryHeight(entry: ResizeObserverEntry) {
const borderSize = Array.isArray(entry.borderBoxSize) ? entry.borderBoxSize[0] : entry.borderBoxSize
return borderSize?.blockSize || entry.contentRect.height
}
function setItemRef(element: Element | ComponentPublicInstance | null, key: ItemKey) {
const htmlElement = getElementFromRef(element)
const previousElement = keyElements.get(key)
if (!htmlElement) {
if (previousElement) {
itemResizeObserver?.unobserve(previousElement)
observedElements.delete(previousElement)
keyElements.delete(key)
}
return
}
if (previousElement === htmlElement) {
return
}
ensureItemResizeObserver()
if (previousElement) {
itemResizeObserver?.unobserve(previousElement)
observedElements.delete(previousElement)
}
observedElements.set(htmlElement, key)
keyElements.set(key, htmlElement)
itemResizeObserver?.observe(htmlElement)
}
function getItemRef(key: ItemKey) {
const existingCallback = itemRefCallbacks.get(key)
if (existingCallback) {
return existingCallback
}
const callback = (element: Element | ComponentPublicInstance | null) => setItemRef(element, key)
itemRefCallbacks.set(key, callback)
return callback
}
function findScrollTarget(): ScrollTarget {
let parent = containerRef.value?.parentElement ?? null
while (parent && parent !== document.body && parent !== document.documentElement) {
const overflowY = window.getComputedStyle(parent).overflowY
if (overflowY === 'auto' || overflowY === 'scroll' || overflowY === 'overlay') {
return parent
}
parent = parent.parentElement
}
return window
}
function addScrollListener(target: ScrollTarget) {
target.addEventListener('scroll', queueViewportSync, { passive: true })
}
function removeScrollListener(target: ScrollTarget | null) {
target?.removeEventListener('scroll', queueViewportSync)
}
function refreshScrollTarget() {
if (!mounted) {
return
}
const nextTarget = findScrollTarget()
if (scrollTarget === nextTarget) {
return
}
removeScrollListener(scrollTarget)
scrollTarget = nextTarget
addScrollListener(scrollTarget)
}
function syncLayoutWidth() {
const element = trackRef.value
if (!element) {
layoutWidth.value = 0
return
}
layoutWidth.value = element.clientWidth
}
function syncViewport() {
const element = trackRef.value
if (!element) {
viewportTop.value = 0
viewportBottom.value = 0
return
}
const trackRect = element.getBoundingClientRect()
const viewportRect =
scrollTarget && scrollTarget !== window
? (scrollTarget as HTMLElement).getBoundingClientRect()
: {
bottom: window.innerHeight,
top: 0,
}
viewportTop.value = viewportRect.top - trackRect.top
viewportBottom.value = viewportRect.bottom - trackRect.top
}
function queueLayoutSync() {
if (typeof window === 'undefined' || layoutFrameId !== null) {
return
}
layoutFrameId = window.requestAnimationFrame(() => {
layoutFrameId = null
syncLayoutWidth()
refreshScrollTarget()
syncViewport()
flushPendingReveal()
})
}
function queueViewportSync() {
if (typeof window === 'undefined' || scrollFrameId !== null) {
return
}
scrollFrameId = window.requestAnimationFrame(() => {
scrollFrameId = null
syncViewport()
})
}
function getTrackScrollTop() {
const element = trackRef.value
if (!element || !scrollTarget || scrollTarget === window) {
return (element?.getBoundingClientRect().top ?? 0) + window.scrollY
}
const scrollElement = scrollTarget as HTMLElement
const trackRect = element.getBoundingClientRect()
const scrollRect = scrollElement.getBoundingClientRect()
return trackRect.top - scrollRect.top + scrollElement.scrollTop
}
function adjustScrollTop(delta: number) {
if (!scrollTarget || Math.abs(delta) < 0.5) {
return
}
if (scrollTarget === window) {
window.scrollBy({
behavior: 'auto',
top: delta,
})
} else {
const scrollElement = scrollTarget as HTMLElement
scrollElement.scrollTop += delta
}
}
function scrollToRelativeTop(top: number) {
if (!scrollTarget) {
return
}
const targetTop = getTrackScrollTop() + top
if (scrollTarget === window) {
window.scrollTo({
behavior: 'auto',
top: targetTop,
})
} else {
;(scrollTarget as HTMLElement).scrollTo({
behavior: 'auto',
top: targetTop,
})
}
queueViewportSync()
}
async function revealItem(index: number) {
if (typeof window === 'undefined' || index < 0 || index >= props.items.length) {
return
}
await nextTick()
const row = Math.floor(index / columnCount.value)
const top = rowMetrics.value.offsets[row] ?? 0
scrollToRelativeTop(top)
}
function requestRevealItem(index: number) {
pendingRevealIndex = index
if (!mounted) {
return
}
queueLayoutSync()
}
function flushPendingReveal() {
if (pendingRevealIndex === null || !mounted || !scrollTarget || layoutWidth.value <= 0) {
return
}
const index = pendingRevealIndex
pendingRevealIndex = null
void revealItem(index)
}
function pruneMeasurements() {
const keys = new Set(itemKeys.value)
let changed = false
Array.from(itemHeights.keys()).forEach(key => {
if (!keys.has(key)) {
itemHeights.delete(key)
changed = true
}
})
Array.from(keyElements.entries()).forEach(([key, element]) => {
if (!keys.has(key)) {
itemResizeObserver?.unobserve(element)
observedElements.delete(element)
keyElements.delete(key)
}
})
Array.from(itemRefCallbacks.keys()).forEach(key => {
if (!keys.has(key)) {
itemRefCallbacks.delete(key)
}
})
if (changed) {
heightVersion.value += 1
}
}
function didKeysAppend(nextKeys: ItemKey[], previousKeys: ItemKey[] = []) {
if (!previousKeys.length || nextKeys.length < previousKeys.length) {
return false
}
return previousKeys.every((key, index) => key === nextKeys[index])
}
function syncMeasurementsForItems(nextKeys: ItemKey[], previousKeys: ItemKey[] = []) {
if (!didKeysAppend(nextKeys, previousKeys) && itemHeights.size) {
itemHeights.clear()
heightVersion.value += 1
}
pruneMeasurements()
}
function invalidateMeasurementsForLayoutChange() {
const nextColumnCount = columnCount.value
const nextColumnWidth = columnWidth.value
if (
lastMeasuredColumnCount === nextColumnCount &&
Math.abs(lastMeasuredColumnWidth - nextColumnWidth) < 1
) {
return
}
lastMeasuredColumnCount = nextColumnCount
lastMeasuredColumnWidth = nextColumnWidth
if (!itemHeights.size) {
return
}
itemHeights.clear()
heightVersion.value += 1
}
onMounted(() => {
mounted = true
scrollTarget = findScrollTarget()
addScrollListener(scrollTarget)
resizeObserver = new ResizeObserver(queueLayoutSync)
if (trackRef.value) {
resizeObserver.observe(trackRef.value)
}
window.addEventListener('resize', queueLayoutSync, { passive: true })
queueLayoutSync()
})
onActivated(() => {
mounted = true
refreshScrollTarget()
queueLayoutSync()
})
onDeactivated(() => {
mounted = false
removeScrollListener(scrollTarget)
scrollTarget = null
})
onUnmounted(() => {
mounted = false
removeScrollListener(scrollTarget)
scrollTarget = null
window.removeEventListener('resize', queueLayoutSync)
resizeObserver?.disconnect()
resizeObserver = null
itemResizeObserver?.disconnect()
itemResizeObserver = null
if (layoutFrameId !== null) {
window.cancelAnimationFrame(layoutFrameId)
layoutFrameId = null
}
if (scrollFrameId !== null) {
window.cancelAnimationFrame(scrollFrameId)
scrollFrameId = null
}
})
watch(
itemKeys,
(nextKeys, previousKeys) => {
syncMeasurementsForItems(nextKeys, previousKeys)
queueLayoutSync()
},
{ immediate: true },
)
watch(
[
() => props.minItemWidth,
() => props.gap,
() => props.estimatedItemHeight,
() => props.itemAspectRatio,
() => props.columns,
],
() => {
queueLayoutSync()
},
)
watch(
[columnCount, columnWidth],
() => {
invalidateMeasurementsForLayoutChange()
queueViewportSync()
},
)
watch(
[() => props.scrollToIndex, () => props.items.length, columnCount],
([scrollToIndex]) => {
if (scrollToIndex === undefined || scrollToIndex < 0 || scrollToIndex >= props.items.length) {
return
}
requestRevealItem(scrollToIndex)
},
{ immediate: true },
)
</script>
<template>
<div ref="containerRef" class="progressive-card-grid">
<div ref="trackRef" class="progressive-card-grid__track">
<div
v-if="topSpacerHeight > 0"
class="progressive-card-grid__spacer"
:style="{ blockSize: `${topSpacerHeight}px` }"
aria-hidden="true"
/>
<div v-if="visibleCells.length > 0" class="progressive-card-grid__grid" :style="gridStyle">
<div
v-for="cell in visibleCells"
:key="cell.key"
:ref="getItemRef(cell.key)"
class="progressive-card-grid__item"
:data-progressive-grid-index="cell.index"
>
<slot :item="cell.item" :index="cell.index" />
</div>
</div>
<div
v-if="bottomSpacerHeight > 0"
class="progressive-card-grid__spacer"
:style="{ blockSize: `${bottomSpacerHeight}px` }"
aria-hidden="true"
/>
</div>
</div>
</template>
<style scoped>
.progressive-card-grid {
inline-size: 100%;
}
.progressive-card-grid__track {
inline-size: 100%;
min-block-size: 1px;
overflow-anchor: none;
}
.progressive-card-grid__grid {
display: grid;
}
.progressive-card-grid__item {
inline-size: 100%;
min-inline-size: 0;
}
.progressive-card-grid__item > :deep(*) {
block-size: 100%;
inline-size: 100%;
}
</style>

View File

@@ -1,5 +1,28 @@
<script lang="ts" setup>
import type { PropType } from 'vue'
import MarkdownIt from 'markdown-it'
import mdLinkAttributes from 'markdown-it-link-attributes'
// 初始化 markdown-it
const md = new MarkdownIt({
html: true,
linkify: true,
typographer: true,
})
// 插件:链接在新窗口打开
md.use(mdLinkAttributes, {
attrs: {
target: '_blank',
rel: 'noopener noreferrer',
},
})
// 渲染 Markdown
function renderMarkdown(value: string) {
if (!value) return ''
return md.render(value)
}
// 输入参数
const props = defineProps({
@@ -14,10 +37,79 @@ const props = defineProps({
<VListItemTitle class="font-bold text-lg">
{{ key }}
</VListItemTitle>
<div class="text-gray-500">
{{ value }}
</div>
<div class="markdown-body text-gray-500" v-html="renderMarkdown(value)" />
</VListItem>
</VList>
</VCardText>
</template>
<style scoped>
.markdown-body :deep(h1),
.markdown-body :deep(h2),
.markdown-body :deep(h3) {
margin-block: 0.5rem;
font-weight: 600;
}
.markdown-body :deep(h1) {
font-size: 1.5rem;
}
.markdown-body :deep(h2) {
font-size: 1.25rem;
}
.markdown-body :deep(h3) {
font-size: 1.1rem;
}
.markdown-body :deep(ul),
.markdown-body :deep(ol) {
padding-inline-start: 1.5rem;
margin-block: 0.5rem;
}
.markdown-body :deep(li) {
margin-block: 0.25rem;
}
.markdown-body :deep(p) {
margin-block: 0.5rem;
}
.markdown-body :deep(a) {
color: rgb(99 102 241);
text-decoration: none;
}
.markdown-body :deep(a:hover) {
text-decoration: underline;
}
.markdown-body :deep(code) {
padding: 0.15rem 0.4rem;
border-radius: 0.25rem;
font-size: 0.875em;
background-color: rgba(127, 127, 127, 0.15);
}
.markdown-body :deep(pre) {
padding: 0.75rem 1rem;
margin-block: 0.5rem;
overflow-x: auto;
border-radius: 0.375rem;
background-color: rgba(127, 127, 127, 0.15);
}
.markdown-body :deep(pre code) {
padding: 0;
background-color: transparent;
}
.markdown-body :deep(blockquote) {
padding-inline-start: 1rem;
margin-block: 0.5rem;
border-inline-start: 3px solid rgba(127, 127, 127, 0.4);
color: rgba(127, 127, 127, 0.8);
}
</style>

View File

@@ -1,335 +0,0 @@
<script lang="ts" setup>
import SlideViewTitle from '@/components/slide/SlideViewTitle.vue'
import { useDisplay } from 'vuetify'
// 判断是否可以触摸
const display = useDisplay()
const isTouch = computed(() => display.mobile.value)
// 元素
const slideview_content = ref<HTMLElement | null>(null)
const sliderContainer = ref<HTMLElement | null>(null)
// 分页切换状态: 0-左边不可用 1-两边可用 2-右边不可用 3-两边都不可用
const disabled = ref(0)
// 记录滚动值
const slideview_scrollLeft = ref(0)
// 所有卡片数量
let slide_card_length: number
// 卡片间距
let slide_gap_px: number
// 卡片宽度
let card_width: number
// 容器最多显示N张卡片
let card_max: number
// 当前定位
let card_current: number
// 获取传入的链接地址
const props: any = inject('rankingPropsKey', { linkurl: '', title: '' })
const isScrolling = ref(false)
let scrollTimeout: ReturnType<typeof setTimeout> | null = null
const scrollTimeoutDuration = 1500 // 滚动停止后延迟时间 (ms)
// 分页切换
function slideNext(next: boolean) {
let run_to_left_px
if (next) {
const card_index = card_current + card_max
run_to_left_px = card_index * card_width
if (run_to_left_px >= slideview_content.value!.scrollWidth - slideview_content.value!.clientWidth)
run_to_left_px = slideview_content.value!.scrollWidth - slideview_content.value!.clientWidth
} else {
const card_index = card_current - card_max
run_to_left_px = card_index * card_width
if (run_to_left_px <= 0) run_to_left_px = 0
}
slideview_content.value!.scrollTo({
top: 0,
left: run_to_left_px,
behavior: 'smooth',
})
// 点击后强制显示并重置计时器
isScrolling.value = true
if (scrollTimeout) {
clearTimeout(scrollTimeout)
}
scrollTimeout = setTimeout(() => {
isScrolling.value = false
}, scrollTimeoutDuration)
}
// 计算最大显示数量
function countMaxNumber() {
if (!slideview_content.value || !slideview_content.value.firstElementChild) return
slide_card_length = slideview_content.value.children.length
card_width = slideview_content.value.firstElementChild.getBoundingClientRect().width
slide_gap_px = slideview_content.value.scrollWidth / slide_card_length - card_width
card_width += slide_gap_px
card_max = Math.trunc(slideview_content.value.clientWidth / card_width)
countDisabled()
}
// 修改分页切换按钮状态 & 处理滚动状态
function handleContentScroll() {
if (!slideview_content.value) return
// 更新按钮禁用状态
countDisabled()
// 更新滚动状态并重置计时器
isScrolling.value = true
if (scrollTimeout) {
clearTimeout(scrollTimeout)
}
scrollTimeout = setTimeout(() => {
isScrolling.value = false
}, scrollTimeoutDuration) // 使用常量
}
// 原始的 countDisabled 逻辑,现在由 handleContentScroll 调用
function countDisabled() {
if (!slideview_content.value) return
slideview_scrollLeft.value = slideview_content.value.scrollLeft
card_current =
slideview_content.value.scrollLeft === 0
? 0
: Math.trunc((slideview_content.value.scrollLeft + card_width / 2) / card_width)
if (slide_card_length * card_width <= slideview_content.value.clientWidth) disabled.value = 3
else if (slideview_content.value.scrollLeft === 0) disabled.value = 0
else if (
slideview_content.value.scrollLeft >=
slideview_content.value.scrollWidth - slideview_content.value.clientWidth - 2
)
disabled.value = 2
else disabled.value = 1
}
// 组件加载完成
onMounted(() => {
// 初次获取元素参数
countMaxNumber()
// 窗口大小发生改变时
window.addEventListener('resize', countMaxNumber)
})
onUnmounted(() => {
// 卸载事件
window.removeEventListener('resize', countMaxNumber)
})
onActivated(() => {
if (slideview_scrollLeft.value !== 0) {
slideview_content.value!.scrollLeft = slideview_scrollLeft.value
}
})
</script>
<template>
<div ref="sliderContainer" class="slider-container" :class="{ 'is-scrolling': isScrolling }">
<div class="slider-header">
<slot name="title">
<SlideViewTitle />
</slot>
<!-- 查看全部按钮 -->
<RouterLink v-if="props.linkurl" :to="props.linkurl" class="view-all-button">
<span>更多</span>
<svg width="16" height="16" viewBox="0 0 24 24" class="arrow-svg">
<path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
</svg>
</RouterLink>
</div>
<div class="slider-content-wrapper">
<div class="slider-content-container">
<div ref="slideview_content" class="slider-content" tabindex="0" @scroll="handleContentScroll">
<slot name="content" />
</div>
</div>
<!-- 左侧导航按钮 -->
<VBtn
class="nav-button nav-button-left"
@click.stop="slideNext(false)"
v-show="disabled !== 0 && disabled !== 3 && !isTouch"
variant="text"
icon
color="secondary"
>
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z" />
</svg>
</VBtn>
<!-- 右侧导航按钮 -->
<VBtn
class="nav-button nav-button-right"
@click.stop="slideNext(true)"
v-show="disabled !== 2 && disabled !== 3 && !isTouch"
variant="text"
icon
color="secondary"
>
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
</svg>
</VBtn>
</div>
</div>
</template>
<style lang="scss" scoped>
.slider-container {
position: relative;
margin-block-end: 8px;
}
.slider-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-block-end: 8px;
padding-block: 0;
padding-inline: 8px;
& > :first-child {
flex-grow: 1;
min-inline-size: 0;
}
}
.view-all-button {
.arrow-svg {
fill: currentcolor;
margin-inline-start: 2px;
transition: transform 0.3s ease;
}
display: inline-flex;
flex-shrink: 0;
align-items: center;
border-radius: 8px;
background-color: transparent;
color: rgb(var(--v-theme-primary));
font-size: 0.85rem;
font-weight: 500;
padding-block: 5px;
padding-inline: 12px;
text-decoration: none;
transition: all 0.25s ease;
&:hover {
border-color: rgba(var(--v-theme-primary), 0.5);
background-color: rgba(var(--v-theme-primary), 0.08);
transform: translateY(-1px);
.arrow-svg {
transform: translateX(3px);
}
}
span {
margin-inline-end: 4px;
}
}
.slider-content-wrapper {
position: relative;
inline-size: 100%;
}
.slider-content-container {
position: relative;
overflow: hidden;
inline-size: 100%;
}
.nav-button {
position: absolute;
z-index: 20;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 50%;
backdrop-filter: blur(8px);
background-color: rgba(var(--v-theme-background), 0.3);
block-size: 36px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 8%);
cursor: pointer;
inline-size: 36px;
inset-block-start: 50%;
opacity: 0;
pointer-events: none;
text-shadow: 0 1px 2px rgba(0, 0, 0, 10%);
transform: translateY(-50%);
transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.3s ease,
box-shadow 0.3s ease, border-color 0.3s ease;
svg {
block-size: 22px;
fill: currentcolor;
filter: none;
inline-size: 22px;
opacity: 0.7;
transition: all 0.3s ease;
}
&:hover {
color: rgb(var(--v-theme-primary));
transform: translateY(-50%) scale(1.05);
svg {
opacity: 1;
}
}
}
.nav-button-left {
inset-inline-start: 8px;
}
.nav-button-right {
inset-inline-end: 8px;
}
.slider-content {
display: grid;
overflow: scroll hidden !important;
justify-content: start;
gap: 16px;
grid-auto-flow: column;
grid-template-rows: 1fr;
-ms-overflow-style: none !important;
overscroll-behavior-x: contain !important;
padding-block: 8px;
padding-inline: 12px;
scroll-behavior: smooth;
scrollbar-width: none !important;
&::-webkit-scrollbar {
display: none;
}
}
// 触摸设备:滚动时显示 (通过 JS 添加的类控制)
// 这个规则会在不支持 hover 的设备上生效
.slider-container.is-scrolling .nav-button {
opacity: 1;
pointer-events: auto;
}
// 桌面设备:悬停时显示
@media (hover: hover) {
.slider-container:hover .nav-button {
// 这个规则会覆盖 .is-scrolling 的效果 (如果同时存在)
// 或者在非 scrolling 状态下hover 时也能显示
opacity: 1;
pointer-events: auto;
}
// 在 hover 设备上,即使在滚动,如果鼠标不悬停,按钮也应该隐藏
// 因此,基础 .nav-button 的 opacity: 0 规则在这里仍然是必要的
// (之前错误地以为 hover 会完全覆盖,但滚动时 class 和 hover 可能同时存在)
// .nav-button { opacity: 0; pointer-events: none; } // 这行其实不需要重复,默认就是这样
}
</style>

View File

@@ -0,0 +1,433 @@
<script lang="ts" setup>
import SlideViewTitle from '@/components/slide/SlideViewTitle.vue'
import { useDisplay } from 'vuetify'
const props = withDefaults(
defineProps<{
items: any[]
itemWidth?: number
itemGap?: number
overscanItems?: number
getItemKey?: (item: any, index: number) => string | number
loading?: boolean
}>(),
{
itemWidth: 144,
itemGap: 16,
overscanItems: 4,
getItemKey: undefined,
loading: false,
},
)
const display = useDisplay()
const isTouch = computed(() => display.mobile.value)
const injectedProps: any = inject('rankingPropsKey', { linkurl: '', title: '' })
const slideContentRef = ref<HTMLElement | null>(null)
const disabled = ref(0)
const slideScrollLeft = ref(0)
const isScrolling = ref(false)
const startIndex = ref(0)
const endIndex = ref(0)
let resizeObserver: ResizeObserver | null = null
let scrollTimeout: ReturnType<typeof setTimeout> | null = null
const scrollTimeoutDuration = 1500
const itemStep = computed(() => props.itemWidth + props.itemGap)
const visibleItems = computed(() => props.items.slice(startIndex.value, endIndex.value))
const leadingSpaceWidth = computed(() => startIndex.value * itemStep.value)
const visibleItemsWidth = computed(() => {
if (!visibleItems.value.length) {
return 0
}
return visibleItems.value.length * props.itemWidth + Math.max(visibleItems.value.length - 1, 0) * props.itemGap
})
const totalContentWidth = computed(() => {
if (!props.items.length) {
return 0
}
return props.items.length * props.itemWidth + Math.max(props.items.length - 1, 0) * props.itemGap
})
const trailingSpaceWidth = computed(() => {
return Math.max(totalContentWidth.value - leadingSpaceWidth.value - visibleItemsWidth.value, 0)
})
function resolveItemKey(item: any, index: number) {
if (props.getItemKey) {
return props.getItemKey(item, startIndex.value + index)
}
return startIndex.value + index
}
function resetScrollIndicatorTimer() {
isScrolling.value = true
if (scrollTimeout) {
clearTimeout(scrollTimeout)
}
scrollTimeout = setTimeout(() => {
isScrolling.value = false
}, scrollTimeoutDuration)
}
function updateVisibleRange() {
const element = slideContentRef.value
if (!element) {
startIndex.value = 0
endIndex.value = 0
return
}
const viewportWidth = element.clientWidth
if (!viewportWidth || !props.items.length) {
startIndex.value = 0
endIndex.value = Math.min(props.items.length, props.overscanItems)
return
}
const firstVisible = Math.max(0, Math.floor(element.scrollLeft / itemStep.value) - props.overscanItems)
const lastVisible = Math.min(
props.items.length,
Math.ceil((element.scrollLeft + viewportWidth) / itemStep.value) + props.overscanItems,
)
startIndex.value = firstVisible
endIndex.value = Math.max(firstVisible + 1, lastVisible)
}
function updateDisabledState() {
const element = slideContentRef.value
if (!element) return
slideScrollLeft.value = element.scrollLeft
if (!props.items.length || totalContentWidth.value <= element.clientWidth) {
disabled.value = 3
} else if (element.scrollLeft === 0) {
disabled.value = 0
} else if (element.scrollLeft >= element.scrollWidth - element.clientWidth - 2) {
disabled.value = 2
} else {
disabled.value = 1
}
}
function syncLayoutState() {
updateVisibleRange()
updateDisabledState()
}
function slideNext(next: boolean) {
const element = slideContentRef.value
if (!element) return
const visibleCount = Math.max(1, Math.trunc(element.clientWidth / itemStep.value))
const currentIndex = element.scrollLeft === 0 ? 0 : Math.trunc((element.scrollLeft + itemStep.value / 2) / itemStep.value)
let targetLeft = 0
if (next) {
targetLeft = Math.min((currentIndex + visibleCount) * itemStep.value, element.scrollWidth - element.clientWidth)
} else {
targetLeft = Math.max((currentIndex - visibleCount) * itemStep.value, 0)
}
element.scrollTo({
behavior: 'smooth',
left: targetLeft,
top: 0,
})
resetScrollIndicatorTimer()
}
function handleContentScroll() {
syncLayoutState()
resetScrollIndicatorTimer()
}
onMounted(() => {
syncLayoutState()
resizeObserver = new ResizeObserver(() => {
syncLayoutState()
})
if (slideContentRef.value) {
resizeObserver.observe(slideContentRef.value)
}
window.addEventListener('resize', syncLayoutState)
})
onUnmounted(() => {
if (scrollTimeout) {
clearTimeout(scrollTimeout)
scrollTimeout = null
}
window.removeEventListener('resize', syncLayoutState)
resizeObserver?.disconnect()
resizeObserver = null
})
onActivated(() => {
if (slideContentRef.value && slideScrollLeft.value !== 0) {
slideContentRef.value.scrollLeft = slideScrollLeft.value
}
nextTick(syncLayoutState)
})
watch(
() => props.items.length,
() => {
nextTick(syncLayoutState)
},
{ immediate: true },
)
</script>
<template>
<div class="slider-container" :class="{ 'is-scrolling': isScrolling }">
<div class="slider-header">
<slot name="title">
<SlideViewTitle />
</slot>
<RouterLink v-if="injectedProps.linkurl" :to="injectedProps.linkurl" class="view-all-button">
<span>更多</span>
<svg width="16" height="16" viewBox="0 0 24 24" class="arrow-svg">
<path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
</svg>
</RouterLink>
</div>
<div class="slider-content-wrapper">
<div class="slider-content-container">
<div ref="slideContentRef" class="slider-content" tabindex="0" @scroll="handleContentScroll">
<template v-if="loading">
<div class="loading-track" :style="{ gap: `${itemGap}px` }">
<slot name="loading" />
</div>
</template>
<template v-else-if="items.length > 0">
<div class="virtual-track" :style="{ width: `${totalContentWidth}px` }">
<div v-if="leadingSpaceWidth > 0" class="virtual-spacer" :style="{ width: `${leadingSpaceWidth}px` }" />
<template v-for="(item, index) in visibleItems" :key="resolveItemKey(item, index)">
<div
class="virtual-slide-item"
:style="{
marginInlineEnd: index === visibleItems.length - 1 ? '0px' : `${itemGap}px`,
width: `${itemWidth}px`,
}"
>
<slot name="item" :item="item" :index="startIndex + index" />
</div>
</template>
<div v-if="trailingSpaceWidth > 0" class="virtual-spacer" :style="{ width: `${trailingSpaceWidth}px` }" />
</div>
</template>
<template v-else>
<slot name="empty" />
</template>
</div>
</div>
<VBtn
v-show="disabled !== 0 && disabled !== 3 && !isTouch"
class="nav-button nav-button-left"
variant="text"
icon
color="secondary"
@click.stop="slideNext(false)"
>
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M15.41,16.58L10.83,12L15.41,7.41L14,6L8,12L14,18L15.41,16.58Z" />
</svg>
</VBtn>
<VBtn
v-show="disabled !== 2 && disabled !== 3 && !isTouch"
class="nav-button nav-button-right"
variant="text"
icon
color="secondary"
@click.stop="slideNext(true)"
>
<svg width="24" height="24" viewBox="0 0 24 24">
<path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
</svg>
</VBtn>
</div>
</div>
</template>
<style lang="scss" scoped>
.slider-container {
position: relative;
margin-block-end: 8px;
}
.slider-header {
display: flex;
align-items: center;
justify-content: space-between;
gap: 8px;
margin-block-end: 8px;
padding-block: 0;
padding-inline: 8px;
& > :first-child {
flex-grow: 1;
min-inline-size: 0;
}
}
.view-all-button {
display: inline-flex;
flex-shrink: 0;
align-items: center;
border-radius: 8px;
background-color: transparent;
color: rgb(var(--v-theme-primary));
font-size: 0.85rem;
font-weight: 500;
padding-block: 5px;
padding-inline: 12px;
text-decoration: none;
transition: all 0.25s ease;
.arrow-svg {
fill: currentcolor;
margin-inline-start: 2px;
transition: transform 0.3s ease;
}
&:hover {
border-color: rgba(var(--v-theme-primary), 0.5);
background-color: rgba(var(--v-theme-primary), 0.08);
transform: translateY(-1px);
.arrow-svg {
transform: translateX(3px);
}
}
span {
margin-inline-end: 4px;
}
}
.slider-content-wrapper {
position: relative;
inline-size: 100%;
}
.slider-content-container {
position: relative;
overflow: hidden;
inline-size: 100%;
}
.slider-content {
overflow: scroll hidden !important;
-ms-overflow-style: none !important;
overscroll-behavior-x: contain !important;
padding-block: 8px;
padding-inline: 12px;
scroll-behavior: smooth;
scrollbar-width: none !important;
&::-webkit-scrollbar {
display: none;
}
}
.virtual-track {
display: flex;
inline-size: max-content;
}
.loading-track {
display: flex;
inline-size: max-content;
min-inline-size: 100%;
}
.virtual-slide-item,
.virtual-spacer,
.loading-track > * {
flex: 0 0 auto;
}
.nav-button {
position: absolute;
z-index: 20;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
border-radius: 50%;
backdrop-filter: blur(8px);
background-color: rgba(var(--v-theme-background), 0.3);
block-size: 36px;
box-shadow: 0 4px 12px rgba(0, 0, 0, 8%);
cursor: pointer;
inline-size: 36px;
inset-block-start: 50%;
opacity: 0;
pointer-events: none;
text-shadow: 0 1px 2px rgba(0, 0, 0, 10%);
transform: translateY(-50%);
transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.3s ease,
box-shadow 0.3s ease, border-color 0.3s ease;
svg {
block-size: 22px;
fill: currentcolor;
filter: none;
inline-size: 22px;
opacity: 0.7;
transition: all 0.3s ease;
}
&:hover {
color: rgb(var(--v-theme-primary));
transform: translateY(-50%) scale(1.05);
svg {
opacity: 1;
}
}
}
.nav-button-left {
inset-inline-start: 8px;
}
.nav-button-right {
inset-inline-end: 8px;
}
.slider-container.is-scrolling .nav-button {
opacity: 1;
pointer-events: auto;
}
@media (hover: hover) {
.slider-container:hover .nav-button {
opacity: 1;
pointer-events: auto;
}
}
</style>

View File

@@ -0,0 +1,87 @@
import { computed, ref, watch, onMounted, onUnmounted, nextTick } from 'vue'
import { usePWA } from '@/composables/usePWA'
/**
* 计算页面内容的可用高度,自动适配 iOS 安全区域和底部 Dock 栏。
*
* 通过 DOM 测量获取布局的实际 padding含 safe-area-inset-top/bottom
* 以及 Footer Dock 的实际高度,确保在任何设备上都不会被 Dock 遮挡。
*
* 计算公式: viewport - layoutPaddingTop - layoutPaddingBottom - footerDock - componentOffset
*
* @param componentOffset - 组件内部额外占用的空间(工具栏、分页栏等,默认 64
* @param minHeight - 最小高度(默认 300
*/
export function useAvailableHeight(
componentOffset: number = 64,
minHeight: number = 300,
) {
const { appMode } = usePWA()
// 响应式测量值
const viewportHeight = ref(window.innerHeight || document.documentElement.clientHeight)
const layoutPaddingTop = ref(72)
const layoutPaddingBottom = ref(24)
const footerDockMeasuredHeight = ref(0)
function updateMeasurements() {
viewportHeight.value = window.innerHeight || document.documentElement.clientHeight
// 测量 .layout-page-content 的实际 padding含 env(safe-area-inset-top) 等)
const layoutEl = document.querySelector('.layout-page-content') as HTMLElement | null
if (layoutEl) {
const style = getComputedStyle(layoutEl)
layoutPaddingTop.value = parseFloat(style.paddingTop) || 72
layoutPaddingBottom.value = parseFloat(style.paddingBottom) || 24
}
// 直接查询 Footer Dock DOM无论 appMode 状态
// Dock 通过 Teleport 挂载到 body存在即测量不存在即为 0
const footerEl = document.querySelector('.footer-nav-container') as HTMLElement | null
footerDockMeasuredHeight.value = footerEl ? footerEl.offsetHeight : 0
}
// appMode 异步变化时PWA 检测完成、屏幕尺寸变化等Dock 会出现/消失
// 需要等 DOM 更新后重新测量
watch(appMode, () => {
nextTick(updateMeasurements)
})
onMounted(() => {
nextTick(updateMeasurements)
window.addEventListener('resize', updateMeasurements)
if (window.visualViewport) {
window.visualViewport.addEventListener('resize', updateMeasurements)
}
})
onUnmounted(() => {
window.removeEventListener('resize', updateMeasurements)
if (window.visualViewport) {
window.visualViewport.removeEventListener('resize', updateMeasurements)
}
})
const availableHeight = computed(() => {
const vh = viewportHeight.value
// 布局顶部 padding含 safe-area-inset-top + navbar 高度)
const topPadding = layoutPaddingTop.value
// 布局底部 padding
const bottomPadding = layoutPaddingBottom.value
// 底部 Dock 栏遮挡高度(通过 DOM 测量,含 safe-area-inset-bottom
const footerDockHeight = footerDockMeasuredHeight.value
const available = vh - topPadding - bottomPadding - footerDockHeight - componentOffset
return Math.max(available, minHeight)
})
return {
availableHeight,
viewportHeight,
}
}

View File

@@ -28,11 +28,24 @@ export function useBackgroundOptimization() {
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, options)
const isConnected = ref(false)
let connectTimer: ReturnType<typeof setTimeout> | null = null
const cleanup = () => {
if (connectTimer) {
clearTimeout(connectTimer)
connectTimer = null
}
manager.removeMessageListener(listenerId)
sseManagerSingleton.closeIndependentManager(url, listenerId)
isConnected.value = false
}
onMounted(() => {
// 延迟建立连接,确保组件完全挂载
const connectDelay = options?.connectDelay || 100
setTimeout(() => {
connectTimer = setTimeout(() => {
connectTimer = null
try {
manager.addMessageListener(listenerId, event => {
messageHandler(event)
@@ -44,15 +57,12 @@ export function useBackgroundOptimization() {
}, connectDelay)
})
onUnmounted(() => {
manager.removeMessageListener(listenerId)
isConnected.value = false
})
onUnmounted(cleanup)
return {
manager,
readyState: () => manager.readyState,
close: () => manager.removeMessageListener(listenerId),
close: cleanup,
isConnected,
forceReconnect: () => manager.forceReconnect(),
}
@@ -104,21 +114,31 @@ export function useBackgroundOptimization() {
) => {
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, options)
let connectTimer: ReturnType<typeof setTimeout> | null = null
const cleanup = () => {
if (connectTimer) {
clearTimeout(connectTimer)
connectTimer = null
}
manager.removeMessageListener(listenerId)
sseManagerSingleton.closeIndependentManager(url, listenerId)
}
onMounted(() => {
setTimeout(() => {
connectTimer = setTimeout(() => {
connectTimer = null
manager.addMessageListener(listenerId, messageHandler)
}, delay)
})
onUnmounted(() => {
manager.removeMessageListener(listenerId)
})
onUnmounted(cleanup)
return {
manager,
readyState: () => manager.readyState,
close: () => manager.removeMessageListener(listenerId),
close: cleanup,
}
}
@@ -135,31 +155,50 @@ export function useBackgroundOptimization() {
listenerId: string,
isActive: Ref<boolean>,
) => {
// 使用独立的SSE管理器确保每个监听器都有独立的连接
const manager = sseManagerSingleton.getIndependentManager(url, listenerId, {
backgroundCloseDelay: 1000, // 进度SSE更快关闭
reconnectDelay: 1000,
maxReconnectAttempts: 5,
})
const getManager = () =>
sseManagerSingleton.getIndependentManager(url, listenerId, {
backgroundCloseDelay: 1000, // 进度SSE更快关闭
reconnectDelay: 1000,
maxReconnectAttempts: 5,
})
let manager: ReturnType<typeof getManager> | null = null
let isListening = false
const startProgress = () => {
if (isActive.value) {
manager.addMessageListener(listenerId, messageHandler)
}
if (!isActive.value || isListening) return
manager ??= getManager()
manager.addMessageListener(listenerId, messageHandler)
isListening = true
}
const stopProgress = () => {
const stopProgress = (destroyManager = true) => {
if (!manager) {
isListening = false
return
}
manager.removeMessageListener(listenerId)
if (destroyManager) {
sseManagerSingleton.closeIndependentManager(url, listenerId)
manager = null
}
isListening = false
}
onUnmounted(() => {
stopProgress()
stopProgress(true)
})
return {
start: startProgress,
stop: stopProgress,
manager,
get manager() {
return manager
},
}
}

View File

@@ -1,12 +1,43 @@
import { ref, inject, nextTick, onMounted, onActivated, onDeactivated, onUnmounted } from 'vue'
import {
computed,
inject,
nextTick,
onActivated,
onDeactivated,
onMounted,
onUnmounted,
ref,
unref,
watch,
type ComputedRef,
type Ref,
} from 'vue'
// 声明全局变量类型
declare global {
interface Window {
__VUE_INJECT_DYNAMIC_BUTTON__?: (button: any) => void
__VUE_UNINJECT_DYNAMIC_BUTTON__?: () => void
}
}
type MaybeRefValue<T> = T | Ref<T> | ComputedRef<T>
export interface DynamicButtonMenuItem {
title?: string
titleKey?: string
titleParams?: Record<string, unknown>
icon?: string
color?: string
action: () => void
}
function resolveMaybeRef<T>(value: MaybeRefValue<T> | undefined): T | undefined
function resolveMaybeRef<T>(value: MaybeRefValue<T> | undefined, fallback: T): T
function resolveMaybeRef<T>(value: MaybeRefValue<T> | undefined, fallback?: T) {
return value !== undefined ? unref(value) : fallback
}
/**
* 动态按钮钩子函数
*
@@ -23,12 +54,14 @@ declare global {
* })
*/
export function useDynamicButton(options: {
icon: string
onClick: () => void
icon: MaybeRefValue<string>
onClick?: () => void
menuItems?: MaybeRefValue<DynamicButtonMenuItem[] | undefined>
show?: MaybeRefValue<boolean>
autoRegister?: boolean // 是否自动注册默认为true
}) {
// 提取配置
const { icon, onClick, autoRegister = true } = options
const { icon, onClick, menuItems, show, autoRegister = true } = options
// 动态按钮相关
const registerDynamicButton = inject<((button: any) => void) | null>('registerDynamicButton', null)
@@ -36,22 +69,42 @@ export function useDynamicButton(options: {
// 按钮注册状态
const dynamicButtonRegistered = ref(false)
const componentActive = ref(false)
const resolvedIcon = computed(() => resolveMaybeRef(icon, 'mdi-plus'))
const resolvedShow = computed(() => resolveMaybeRef(show, true))
const resolvedMenuItems = computed(() => resolveMaybeRef(menuItems))
function buildDynamicButton() {
const buttonMenuItems = resolvedMenuItems.value
return {
icon: resolvedIcon.value,
action: onClick || (() => {}),
show: resolvedShow.value,
menuItems: buttonMenuItems && buttonMenuItems.length > 0 ? buttonMenuItems : undefined,
}
}
// 注册动态按钮
function setupDynamicButton() {
// 避免重复注册
if (dynamicButtonRegistered.value) return
if (!componentActive.value) return
const button = buildDynamicButton()
if (!button.show) {
cleanupDynamicButton()
return
}
// 确保注册方法存在
if (!registerDynamicButton) {
// 尝试获取全局注册方法
const tryUseGlobalMethod = () => {
if (!componentActive.value) return false
if (typeof window !== 'undefined' && window.__VUE_INJECT_DYNAMIC_BUTTON__) {
window.__VUE_INJECT_DYNAMIC_BUTTON__({
icon,
action: onClick,
show: true,
})
window.__VUE_INJECT_DYNAMIC_BUTTON__(button)
dynamicButtonRegistered.value = true
return true
}
@@ -68,11 +121,9 @@ export function useDynamicButton(options: {
// 如果注册方法存在,直接注册
nextTick(() => {
registerDynamicButton({
icon,
action: onClick,
show: true,
})
if (!componentActive.value) return
registerDynamicButton(button)
dynamicButtonRegistered.value = true
})
}
@@ -82,17 +133,24 @@ export function useDynamicButton(options: {
if (unregisterDynamicButton && dynamicButtonRegistered.value) {
unregisterDynamicButton()
dynamicButtonRegistered.value = false
return
}
if (typeof window !== 'undefined' && window.__VUE_UNINJECT_DYNAMIC_BUTTON__) {
window.__VUE_UNINJECT_DYNAMIC_BUTTON__()
dynamicButtonRegistered.value = false
}
}
// 暴露方法:手动打开对话框
function openDialog() {
onClick()
onClick?.()
}
// 生命周期钩子
if (autoRegister) {
onMounted(() => {
componentActive.value = true
// 延迟执行确保Footer组件已加载
setTimeout(() => {
setupDynamicButton()
@@ -100,18 +158,27 @@ export function useDynamicButton(options: {
})
onActivated(() => {
componentActive.value = true
// 重置注册状态,确保每次激活时都重新注册
dynamicButtonRegistered.value = false
setupDynamicButton()
})
onDeactivated(() => {
componentActive.value = false
cleanupDynamicButton()
})
onUnmounted(() => {
componentActive.value = false
cleanupDynamicButton()
})
watch([resolvedIcon, resolvedShow, resolvedMenuItems], () => {
if (!componentActive.value) return
setupDynamicButton()
}, { deep: true })
}
// 返回控制函数和状态

View File

@@ -0,0 +1,409 @@
import { computed, onBeforeUnmount, ref, type Ref } from 'vue'
import api from '@/api'
export interface LlmProviderAuthMethod {
id: string
type: string
label: string
description?: string
}
export interface LlmProviderAuthStatus {
connected: boolean
type?: string
label?: string
expires_at?: number | null
updated_at?: number | null
}
export interface LlmProviderUrlPreset {
id: string
label: string
value: string
}
export interface LlmProviderUrlPresetItem {
id: string
title: string
value: string
subtitle?: string
}
export interface LlmProvider {
id: string
name: string
runtime: string
default_base_url: string
base_url_presets?: LlmProviderUrlPreset[]
base_url_editable: boolean
requires_base_url: boolean
supports_api_key: boolean
api_key_label: string
api_key_hint: string
supports_model_refresh: boolean
oauth_methods: LlmProviderAuthMethod[]
description?: string
auth_status: LlmProviderAuthStatus
}
export interface LlmModel {
id: string
name: string
family?: string
context_tokens?: number | null
input_tokens?: number | null
output_tokens?: number | null
context_tokens_k?: number | null
supports_reasoning?: boolean
supports_tools?: boolean
supports_image_input?: boolean
supports_audio_input?: boolean
transport?: string
source?: string
release_date?: string | null
status?: string | null
}
export interface LlmProviderAuthSession {
session_id: string
provider_id: string
flow_type: string
status: string
message?: string
authorize_url?: string
verification_url?: string
user_code?: string
instructions?: string
interval_seconds?: number
expires_at?: number
}
interface UseLlmProviderDirectoryOptions {
provider: Ref<string>
apiKey: Ref<string>
baseUrl: Ref<string>
baseUrlPreset?: Ref<string>
model: Ref<string>
maxContextTokens?: Ref<number>
authConnected?: Ref<boolean>
}
function normalizeValue(value: unknown) {
return String(value ?? '').trim()
}
export function useLlmProviderDirectory(options: UseLlmProviderDirectoryOptions) {
const providers = ref<LlmProvider[]>([])
const models = ref<LlmModel[]>([])
const loadingProviders = ref(false)
const loadingModels = ref(false)
const authDialogVisible = ref(false)
const authPolling = ref(false)
const authPopupBlocked = ref(false)
const authSession = ref<LlmProviderAuthSession | null>(null)
let pollTimer: number | null = null
const selectedProvider = computed(
() => providers.value.find(item => item.id === normalizeValue(options.provider.value)) || null,
)
const selectedModel = computed(
() => models.value.find(item => item.id === normalizeValue(options.model.value)) || null,
)
const providerItems = computed(() => providers.value.map(item => ({ title: item.name, value: item.id })))
const baseUrlPresetItems = computed<LlmProviderUrlPresetItem[]>(() =>
(selectedProvider.value?.base_url_presets || []).map(item => ({
id: item.id,
title: item.value,
value: item.value,
subtitle: item.label,
})),
)
const providerConnected = computed(() => Boolean(selectedProvider.value?.auth_status?.connected))
const showBaseUrlField = computed(
() => Boolean(selectedProvider.value && (selectedProvider.value.oauth_methods || []).length === 0),
)
const showApiKeyField = computed(() => selectedProvider.value?.supports_api_key !== false)
const hasUsableCredential = computed(() => {
if (providerConnected.value) return true
return Boolean(normalizeValue(options.apiKey.value))
})
const canRefreshModels = computed(() => {
if (!selectedProvider.value?.supports_model_refresh) return false
if (!hasUsableCredential.value) return false
if (selectedProvider.value.requires_base_url && !normalizeValue(options.baseUrl.value)) return false
return true
})
function clearPollTimer() {
if (pollTimer !== null) {
window.clearTimeout(pollTimer)
pollTimer = null
}
}
function syncAuthConnected() {
if (options.authConnected) {
options.authConnected.value = providerConnected.value
}
}
function ensureBaseUrl(reset = false) {
const provider = selectedProvider.value
if (!provider) return
const currentBaseUrl = normalizeValue(options.baseUrl.value)
const defaultBaseUrl = provider.default_base_url || ''
const defaultPresetId = normalizeValue(provider.base_url_presets?.[0]?.id)
if (reset) {
options.baseUrl.value = defaultBaseUrl
if (options.baseUrlPreset) {
options.baseUrlPreset.value = defaultPresetId
}
return
}
if (!currentBaseUrl && defaultBaseUrl) {
options.baseUrl.value = defaultBaseUrl
}
if (!options.baseUrlPreset) return
const currentPresetId = normalizeValue(options.baseUrlPreset.value)
if (currentPresetId) return
const matchedPreset = (provider.base_url_presets || []).find(
item => normalizeValue(item.value) === normalizeValue(options.baseUrl.value),
)
options.baseUrlPreset.value = matchedPreset?.id || defaultPresetId
}
function setBaseUrlPreset(presetId?: string, presetValue?: string) {
if (!options.baseUrlPreset) return
options.baseUrlPreset.value = normalizeValue(presetId)
if (presetValue !== undefined) {
options.baseUrl.value = presetValue || ''
}
}
function handleProviderSelection(resetBaseUrl = true) {
ensureBaseUrl(resetBaseUrl)
options.apiKey.value = ''
if (options.maxContextTokens) {
options.maxContextTokens.value = 64
}
models.value = []
options.model.value = ''
syncAuthConnected()
}
function applyModelMetadata(modelId?: string) {
const targetId = normalizeValue(modelId ?? options.model.value)
if (!targetId) return null
const matched = models.value.find(item => item.id === targetId) || null
if (matched?.context_tokens_k && options.maxContextTokens) {
// models.dev / provider 返回的是精确 token这里回填到现有的 K 单位配置。
options.maxContextTokens.value = matched.context_tokens_k
}
return matched
}
function updateProviderAuthStatus(providerId: string, authStatus?: LlmProviderAuthStatus) {
if (!authStatus) return
const index = providers.value.findIndex(item => item.id === providerId)
if (index === -1) return
providers.value[index] = {
...providers.value[index],
auth_status: authStatus,
}
syncAuthConnected()
}
async function loadProviders(preserveBaseUrl = true) {
loadingProviders.value = true
try {
const result: { [key: string]: any } = await api.get('llm/providers')
if (!result.success) {
throw new Error(result.message || 'Load LLM providers failed')
}
providers.value = Array.isArray(result.data) ? result.data : []
if (!selectedProvider.value && providers.value.length > 0) {
options.provider.value = providers.value[0].id
}
ensureBaseUrl(!preserveBaseUrl)
syncAuthConnected()
return providers.value
} finally {
loadingProviders.value = false
}
}
async function loadModels(forceRefresh = false) {
if (!selectedProvider.value) return []
loadingModels.value = true
try {
const result: { [key: string]: any } = await api.get('llm/models', {
params: {
provider: normalizeValue(options.provider.value),
api_key: normalizeValue(options.apiKey.value) || undefined,
base_url: normalizeValue(options.baseUrl.value) || undefined,
base_url_preset: normalizeValue(options.baseUrlPreset?.value) || undefined,
force_refresh: forceRefresh,
},
})
if (!result.success) {
throw new Error(result.message || 'Load LLM models failed')
}
const payload = result.data || {}
models.value = Array.isArray(payload.models) ? payload.models : []
updateProviderAuthStatus(normalizeValue(options.provider.value), payload.auth_status)
const currentModelId = normalizeValue(options.model.value)
const matchedModel = currentModelId
? models.value.find(item => item.id === currentModelId)
: null
if (matchedModel) {
applyModelMetadata(matchedModel.id)
} else if (models.value.length > 0) {
options.model.value = models.value[0].id
applyModelMetadata(models.value[0].id)
}
return models.value
} finally {
loadingModels.value = false
}
}
function openAuthPage() {
const session = authSession.value
const targetUrl = session?.authorize_url || session?.verification_url
if (!targetUrl) return
const popup = window.open(targetUrl, '_blank', 'noopener,noreferrer,width=960,height=780')
authPopupBlocked.value = !popup
}
async function pollAuthSession() {
if (!authSession.value) return null
authPolling.value = true
clearPollTimer()
try {
const result: { [key: string]: any } = await api.post(
`llm/provider-auth/${authSession.value.session_id}/poll`,
)
if (!result.success) {
throw new Error(result.message || 'Poll LLM auth failed')
}
authSession.value = {
...authSession.value,
...result.data,
}
const nextSession = authSession.value
if (!nextSession) return null
if (nextSession.status === 'pending') {
pollTimer = window.setTimeout(
() => pollAuthSession().catch(() => undefined),
Math.max(nextSession.interval_seconds || 5, 1) * 1000,
)
return nextSession
}
await loadProviders()
if (nextSession.status === 'authorized') {
await loadModels(true).catch(() => undefined)
}
return nextSession
} finally {
authPolling.value = false
}
}
async function startAuth(methodId: string) {
if (!selectedProvider.value) {
throw new Error('LLM provider is required')
}
const result: { [key: string]: any } = await api.post('llm/provider-auth/start', {
provider: normalizeValue(options.provider.value),
method: methodId,
})
if (!result.success) {
throw new Error(result.message || 'Start LLM auth failed')
}
authSession.value = {
status: 'pending',
provider_id: normalizeValue(options.provider.value),
...result.data,
}
authDialogVisible.value = true
authPopupBlocked.value = false
openAuthPage()
pollTimer = window.setTimeout(() => pollAuthSession().catch(() => undefined), 1200)
return authSession.value
}
async function disconnectAuth() {
if (!selectedProvider.value) return false
const result: { [key: string]: any } = await api.delete(
`llm/provider-auth/${normalizeValue(options.provider.value)}`,
)
if (!result.success) {
throw new Error(result.message || 'Disconnect LLM auth failed')
}
await loadProviders()
return true
}
function closeAuthDialog() {
authDialogVisible.value = false
clearPollTimer()
}
onBeforeUnmount(() => {
clearPollTimer()
})
return {
providers,
providerItems,
baseUrlPresetItems,
models,
selectedProvider,
selectedModel,
loadingProviders,
loadingModels,
providerConnected,
showBaseUrlField,
showApiKeyField,
hasUsableCredential,
canRefreshModels,
setBaseUrlPreset,
authDialogVisible,
authPolling,
authPopupBlocked,
authSession,
handleProviderSelection,
applyModelMetadata,
loadProviders,
loadModels,
openAuthPage,
startAuth,
pollAuthSession,
disconnectAuth,
closeAuthDialog,
}
}

View File

@@ -13,9 +13,16 @@ export interface WizardData {
username: string
password: string
confirmPassword: string
recognizeSource: string
ocrHost: string
proxyHost: string
githubToken: string
}
siteAuth: {
auxiliaryAuthEnable: boolean
site: string
params: Record<string, string | number>
}
storage: {
downloadPath: string
libraryPath: string
@@ -41,6 +48,38 @@ export interface WizardData {
config: any
switchs: any[]
}
agent: {
enabled: boolean
global: boolean
verbose: boolean
provider: string
authConnected: boolean
model: string
thinkingLevel: string
supportImageInput: boolean
supportAudioInput: boolean
supportAudioOutput: boolean
apiKey: string
baseUrl: string
baseUrlPreset: string
maxContextTokens: number
audioInputProvider: string
audioInputApiKey: string
audioInputBaseUrl: string
audioInputModel: string
audioInputLanguage: string
audioOutputProvider: string
audioOutputApiKey: string
audioOutputBaseUrl: string
audioOutputModel: string
audioOutputVoice: string
audioOutputIncludeText: boolean
jobInterval: number
retryTransfer: boolean
recommendEnabled: boolean
recommendUserPreference: string
recommendMaxItems: number
}
preferences: {
quality: string
subtitle: string
@@ -67,9 +106,14 @@ export interface ConnectivityTestState {
}
export interface ValidationErrorState {
siteAuth: {
site: boolean
[key: string]: boolean
}
downloader: {
name: boolean
host: boolean
apikey: boolean
username: boolean
password: boolean
}
@@ -85,11 +129,45 @@ export interface ValidationErrorState {
name: boolean
[key: string]: boolean
}
agent: {
provider: boolean
apiKey: boolean
model: boolean
maxContextTokens: boolean
recommendMaxItems: boolean
}
}
function normalizeThinkingLevelValue(value?: unknown) {
const normalized = String(value ?? '').trim().toLowerCase()
if (!normalized) return ''
const aliasMap: Record<string, string> = {
none: 'off',
disabled: 'off',
disable: 'off',
enabled: 'auto',
enable: 'auto',
default: 'auto',
dynamic: 'auto',
}
return aliasMap[normalized] || normalized
}
function resolveThinkingLevelValue(data?: Record<string, any>) {
const explicit = normalizeThinkingLevelValue(data?.LLM_THINKING_LEVEL)
if (explicit) return explicit
const legacyEffort = normalizeThinkingLevelValue(data?.LLM_REASONING_EFFORT)
if (data?.LLM_DISABLE_THINKING === true) return 'off'
if (data?.LLM_DISABLE_THINKING === false) return legacyEffort || 'auto'
return legacyEffort || 'off'
}
// 全局状态,所有组件共享
const currentStep = ref(1)
const totalSteps = 6
const totalSteps = 8
// 加载状态
const isLoading = ref(false)
@@ -97,6 +175,22 @@ const isLoading = ref(false)
// 选中的预设规则
const selectedPreset = ref('')
// 可认证站点列表
const authSites = ref<{
[key: string]: {
name: string
icon: string
params: {
[key: string]: {
name: string
type: string
placeholder?: string
tooltip?: string
}
}
}
}>({})
// 向导数据
const wizardData = ref<WizardData>({
basic: {
@@ -105,9 +199,16 @@ const wizardData = ref<WizardData>({
username: '',
password: '',
confirmPassword: '',
recognizeSource: 'themoviedb',
ocrHost: '',
proxyHost: '',
githubToken: '',
},
siteAuth: {
auxiliaryAuthEnable: false,
site: '',
params: {},
},
storage: {
downloadPath: '',
libraryPath: '',
@@ -133,6 +234,38 @@ const wizardData = ref<WizardData>({
config: {},
switchs: [],
},
agent: {
enabled: false,
global: false,
verbose: false,
provider: 'deepseek',
authConnected: false,
model: 'deepseek-chat',
thinkingLevel: 'off',
supportImageInput: true,
supportAudioInput: false,
supportAudioOutput: false,
apiKey: '',
baseUrl: 'https://api.deepseek.com',
baseUrlPreset: '',
maxContextTokens: 64,
audioInputProvider: 'openai',
audioInputApiKey: '',
audioInputBaseUrl: '',
audioInputModel: 'gpt-4o-mini-transcribe',
audioInputLanguage: 'zh',
audioOutputProvider: 'openai',
audioOutputApiKey: '',
audioOutputBaseUrl: '',
audioOutputModel: 'gpt-4o-mini-tts',
audioOutputVoice: 'alloy',
audioOutputIncludeText: false,
jobInterval: 0,
retryTransfer: false,
recommendEnabled: false,
recommendUserPreference: '',
recommendMaxItems: 50,
},
preferences: {
quality: '4K',
subtitle: 'chinese',
@@ -151,9 +284,13 @@ const connectivityTest = ref<ConnectivityTestState>({
// 验证错误状态
const validationErrors = ref<ValidationErrorState>({
siteAuth: {
site: false,
},
downloader: {
name: false,
host: false,
apikey: false,
username: false,
password: false,
},
@@ -168,6 +305,13 @@ const validationErrors = ref<ValidationErrorState>({
notification: {
name: false,
},
agent: {
provider: false,
apiKey: false,
model: false,
maxContextTokens: false,
recommendMaxItems: false,
},
})
export function useSetupWizard() {
@@ -181,10 +325,12 @@ export function useSetupWizard() {
downloader: {
'qbittorrent': 'QbittorrentModule',
'transmission': 'TransmissionModule',
'rtorrent': 'RtorrentModule',
},
// 媒体服务器映射
mediaServer: {
'emby': 'EmbyModule',
'zspace': 'ZSpaceModule',
'jellyfin': 'JellyfinModule',
'plex': 'PlexModule',
'trimemedia': 'TrimeMediaModule',
@@ -192,10 +338,13 @@ export function useSetupWizard() {
},
// 通知映射
notification: {
'feishu': 'FeishuModule',
'telegram': 'TelegramModule',
'wechat': 'WechatModule',
'wechatclawbot': 'WechatClawBotModule',
'slack': 'SlackModule',
'synologychat': 'SynologyChatModule',
'qqbot': 'QQBotModule',
'vocechat': 'VoceChatModule',
'webpush': 'WebPushModule',
},
@@ -204,20 +353,24 @@ export function useSetupWizard() {
// 步骤标题
const stepTitles = computed(() => [
t('setupWizard.basic.title'),
t('setupWizard.siteAuth.title'),
t('setupWizard.storage.title'),
t('setupWizard.downloader.title'),
t('setupWizard.mediaServer.title'),
t('setupWizard.notification.title'),
t('setupWizard.agent.title'),
t('setupWizard.preferences.title'),
])
// 步骤描述
const stepDescriptions = computed(() => [
t('setupWizard.basic.description'),
t('setupWizard.siteAuth.description'),
t('setupWizard.storage.description'),
t('setupWizard.downloader.description'),
t('setupWizard.mediaServer.description'),
t('setupWizard.notification.description'),
t('setupWizard.agent.description'),
t('setupWizard.preferences.description'),
])
@@ -283,7 +436,18 @@ export function useSetupWizard() {
wizardData.value.notification.type = type
// 如果名称为空或为默认名称,则设置默认名称
if (!wizardData.value.notification.name || wizardData.value.notification.name.includes('通知')) {
wizardData.value.notification.name = `${type} 通知`
const displayNameMap: Record<string, string> = {
wechat: '企业微信',
feishu: '飞书',
wechatclawbot: '微信 ClawBot',
telegram: 'Telegram',
slack: 'Slack',
synologychat: 'SynologyChat',
qqbot: 'QQ',
vocechat: 'VoceChat',
webpush: 'WebPush',
}
wizardData.value.notification.name = `${displayNameMap[type] || type} 通知`
}
wizardData.value.notification.enabled = true
// 不清空config和switchs保留用户已输入的值
@@ -324,9 +488,13 @@ export function useSetupWizard() {
// 清除验证错误状态
function clearValidationErrors() {
validationErrors.value.siteAuth = {
site: false,
}
validationErrors.value.downloader = {
name: false,
host: false,
apikey: false,
username: false,
password: false,
}
@@ -341,6 +509,54 @@ export function useSetupWizard() {
validationErrors.value.notification = {
name: false,
}
validationErrors.value.agent = {
provider: false,
apiKey: false,
model: false,
maxContextTokens: false,
recommendMaxItems: false,
}
}
// 验证用户站点认证字段
function validateSiteAuthFields(): { isValid: boolean; errors: string[] } {
const errors: string[] = []
clearValidationErrors()
if (!wizardData.value.siteAuth.site) {
return {
isValid: true,
errors,
}
}
const selectedSite = authSites.value[wizardData.value.siteAuth.site]
if (!selectedSite) {
errors.push(t('setupWizard.siteAuth.siteConfigNotExist'))
validationErrors.value.siteAuth.site = true
return {
isValid: false,
errors,
}
}
const fields = Object.keys(selectedSite.params || {}).filter(key => {
return selectedSite.params[key]?.name && selectedSite.params[key]?.type
})
fields.forEach(key => {
const fieldKey = `${wizardData.value.siteAuth.site.toUpperCase()}_${key.toUpperCase()}`
const value = wizardData.value.siteAuth.params[fieldKey]
if (value === undefined || value === null || value === '') {
errors.push(t('setupWizard.siteAuth.fieldRequired', { name: selectedSite.params[key].name }))
validationErrors.value.siteAuth[fieldKey] = true
}
})
return {
isValid: errors.length === 0,
errors,
}
}
// 验证下载器字段
@@ -361,7 +577,20 @@ export function useSetupWizard() {
}
// 根据下载器类型验证其他必输项
if (wizardData.value.downloader.type === 'qbittorrent' || wizardData.value.downloader.type === 'transmission') {
if (wizardData.value.downloader.type === 'qbittorrent') {
const hasApiKey = !!wizardData.value.downloader.config?.apikey?.trim()
if (!hasApiKey && !wizardData.value.downloader.config?.username?.trim()) {
errors.push(t('downloader.usernameRequired'))
validationErrors.value.downloader.username = true
}
if (!hasApiKey && !wizardData.value.downloader.config?.password?.trim()) {
errors.push(t('downloader.passwordRequired'))
validationErrors.value.downloader.password = true
}
} else if (
wizardData.value.downloader.type === 'transmission'
|| wizardData.value.downloader.type === 'rtorrent'
) {
if (!wizardData.value.downloader.config?.username?.trim()) {
errors.push(t('downloader.usernameRequired'))
validationErrors.value.downloader.username = true
@@ -401,6 +630,15 @@ export function useSetupWizard() {
errors.push(t('mediaserver.apiKeyRequired'))
validationErrors.value.mediaServer.apikey = true
}
} else if (wizardData.value.mediaServer.type === 'zspace') {
if (!wizardData.value.mediaServer.config?.username?.trim()) {
errors.push(t('mediaserver.usernameRequired'))
validationErrors.value.mediaServer.username = true
}
if (!wizardData.value.mediaServer.config?.password?.trim()) {
errors.push(t('mediaserver.passwordRequired'))
validationErrors.value.mediaServer.password = true
}
} else if (wizardData.value.mediaServer.type === 'plex') {
if (!wizardData.value.mediaServer.config?.token?.trim()) {
errors.push(t('mediaserver.tokenRequired'))
@@ -451,6 +689,18 @@ export function useSetupWizard() {
validationErrors.value.notification.WECHAT_APP_SECRET = true
}
break
case 'wechatclawbot':
break
case 'feishu':
if (!config.FEISHU_APP_ID?.trim()) {
errors.push(t('notification.feishu.appIdRequired'))
validationErrors.value.notification.FEISHU_APP_ID = true
}
if (!config.FEISHU_APP_SECRET?.trim()) {
errors.push(t('notification.feishu.appSecretRequired'))
validationErrors.value.notification.FEISHU_APP_SECRET = true
}
break
case 'telegram':
if (!config.TELEGRAM_TOKEN?.trim()) {
errors.push(t('notification.telegram.tokenRequired'))
@@ -487,6 +737,12 @@ export function useSetupWizard() {
validationErrors.value.notification.VOCECHAT_API_KEY = true
}
break
case 'webpush':
if (!config.WEBPUSH_USERNAME?.trim()) {
errors.push(t('notification.webpush.usernameRequired'))
validationErrors.value.notification.WEBPUSH_USERNAME = true
}
break
case 'qqbot':
if (!config.QQ_APP_ID?.trim()) {
errors.push(t('notification.qqbot.appIdRequired'))
@@ -505,6 +761,49 @@ export function useSetupWizard() {
}
}
// 验证智能助手字段
function validateAgentFields(): { isValid: boolean; errors: string[] } {
const errors: string[] = []
clearValidationErrors()
if (!wizardData.value.agent.enabled) {
return {
isValid: true,
errors,
}
}
if (!wizardData.value.agent.provider?.trim()) {
errors.push(t('setupWizard.agent.providerRequired'))
validationErrors.value.agent.provider = true
}
if (!wizardData.value.agent.apiKey?.trim() && !wizardData.value.agent.authConnected) {
errors.push(t('setupWizard.agent.authOrApiKeyRequired'))
validationErrors.value.agent.apiKey = true
}
if (!wizardData.value.agent.model?.trim()) {
errors.push(t('setupWizard.agent.modelRequired'))
validationErrors.value.agent.model = true
}
if (!wizardData.value.agent.maxContextTokens || wizardData.value.agent.maxContextTokens < 1) {
errors.push(t('setupWizard.agent.maxContextTokensRequired'))
validationErrors.value.agent.maxContextTokens = true
}
if (wizardData.value.agent.recommendEnabled && (!wizardData.value.agent.recommendMaxItems || wizardData.value.agent.recommendMaxItems < 1)) {
errors.push(t('setupWizard.agent.recommendMaxItemsRequired'))
validationErrors.value.agent.recommendMaxItems = true
}
return {
isValid: errors.length === 0,
errors,
}
}
// 验证当前步骤的必输项
function validateCurrentStep(): { isValid: boolean; errors: string[] } {
const errors: string[] = []
@@ -531,6 +830,13 @@ export function useSetupWizard() {
break
case 2: // 存储设置
if (wizardData.value.siteAuth.site) {
const validation = validateSiteAuthFields()
errors.push(...validation.errors)
}
break
case 3: // 存储设置
if (!wizardData.value.storage.downloadPath) {
errors.push(t('setupWizard.storage.downloadPathRequired'))
}
@@ -539,7 +845,7 @@ export function useSetupWizard() {
}
break
case 3: // 下载器设置
case 4: // 下载器设置
if (wizardData.value.downloader.type) {
// 如果选择了下载器,则验证必输项
const validation = validateDownloaderFields()
@@ -547,7 +853,7 @@ export function useSetupWizard() {
}
break
case 4: // 媒体服务器设置
case 5: // 媒体服务器设置
if (wizardData.value.mediaServer.type) {
// 如果选择了媒体服务器,则验证必输项
const validation = validateMediaServerFields()
@@ -555,7 +861,7 @@ export function useSetupWizard() {
}
break
case 5: // 通知设置
case 6: // 通知设置
if (wizardData.value.notification.type) {
// 如果选择了通知,则验证必输项
const validation = validateNotificationFields()
@@ -563,7 +869,14 @@ export function useSetupWizard() {
}
break
case 6: // 偏好设置
case 7: // 智能助手设置
if (wizardData.value.agent.enabled) {
const validation = validateAgentFields()
errors.push(...validation.errors)
}
break
case 8: // 偏好设置
// 偏好设置有默认值,不需要验证
break
}
@@ -578,13 +891,15 @@ export function useSetupWizard() {
function shouldPerformTest(step: number): boolean {
switch (step) {
case 2: // 存储目录测试 - 总是需要测试
return false
case 3: // 存储目录测试 - 总是需要测试
return true
case 3: // 下载器测试 - 只有选择了下载器才测试
case 4: // 下载器测试 - 只有选择了下载器才测试
return !!wizardData.value.downloader.type
case 4: // 媒体服务器测试 - 只有选择了媒体服务器才测试
case 5: // 媒体服务器测试 - 只有选择了媒体服务器才测试
return !!wizardData.value.mediaServer.type
case 5: // 消息通知测试 - 只有选择了通知才测试
return !!wizardData.value.notification.type
case 6: // 消息通知测试 - 只有选择了通知才测试
return !!wizardData.value.notification.type && wizardData.value.notification.type !== 'wechatclawbot'
default:
return false
}
@@ -603,15 +918,17 @@ export function useSetupWizard() {
switch (step) {
case 2: // 存储目录测试
break
case 3: // 存储目录测试
testResult = await testStorageConnectivity()
break
case 3: // 下载器测试
case 4: // 下载器测试
testResult = await testDownloaderConnectivity()
break
case 4: // 媒体服务器测试
case 5: // 媒体服务器测试
testResult = await testMediaServerConnectivity()
break
case 5: // 消息通知测试
case 6: // 消息通知测试
testResult = await testNotificationConnectivity()
break
}
@@ -794,18 +1111,21 @@ export function useSetupWizard() {
validation.errors.forEach(error => {
$toast.error(error)
})
return
return false
}
// 保存当前步骤的设置
await saveCurrentStepSettings()
const saved = await saveCurrentStepSettings()
if (!saved) {
return false
}
// 检查是否需要进行测试
const needsTest = shouldPerformTest(currentStep.value)
if (needsTest) {
const testResult = await testConnectivity(currentStep.value)
if (!testResult) {
return
return false
}
}
@@ -814,6 +1134,8 @@ export function useSetupWizard() {
currentStep.value++
connectivityTest.value.showResult = false
}
return true
}
// 上一步
@@ -829,35 +1151,38 @@ export function useSetupWizard() {
try {
switch (currentStep.value) {
case 1:
await saveBasicSettings()
break
return await saveBasicSettings()
case 2:
await saveStorageSettings()
break
return await saveSiteAuthSettings()
case 3:
await saveDownloaderSettings()
break
return await saveStorageSettings()
case 4:
await saveMediaServerSettings()
break
return await saveDownloaderSettings()
case 5:
await saveNotificationSettings()
break
return await saveMediaServerSettings()
case 6:
await savePreferenceSettings()
break
return await saveNotificationSettings()
case 7:
return await saveAgentSettings()
case 8:
return await savePreferenceSettings()
}
} catch (error) {
console.error('Save current step settings failed:', error)
$toast.error(t('setupWizard.saveStepFailed'))
return false
}
return true
}
// 完成向导
async function completeWizard() {
try {
// 先处理下一步(保存当前步骤设置)
await nextStep()
const saved = await nextStep()
if (!saved) {
return
}
// 保存设置向导完成状态
await saveSetupWizardState()
@@ -910,6 +1235,8 @@ export function useSetupWizard() {
const basicSettings = {
APP_DOMAIN: wizardData.value.basic.appDomain,
API_TOKEN: wizardData.value.basic.apiToken,
RECOGNIZE_SOURCE: 'themoviedb',
OCR_HOST: wizardData.value.basic.ocrHost,
PROXY_HOST: wizardData.value.basic.proxyHost,
GITHUB_TOKEN: wizardData.value.basic.githubToken,
}
@@ -917,21 +1244,23 @@ export function useSetupWizard() {
// 保存基础设置
const response: { [key: string]: any } = await api.post('system/env', basicSettings)
if (!response.success) {
return
return false
}
// 如果输入了密码,验证密码一致性
if (wizardData.value.basic.password) {
if (wizardData.value.basic.password !== wizardData.value.basic.confirmPassword) {
$toast.error(t('dialog.userAddEdit.passwordMismatch'))
return
return false
}
// 更新用户密码
await updateUserPassword()
}
return true
} catch (error) {
console.error('Save basic settings failed:', error)
$toast.error(t('setupWizard.saveBasicSettingsFailed'))
return false
}
}
@@ -970,9 +1299,44 @@ export function useSetupWizard() {
}
await api.post('system/setting/Directories', [directory])
return true
} catch (error) {
console.error('Save storage settings failed:', error)
$toast.error(t('setupWizard.saveStorageSettingsFailed'))
return false
}
}
// 保存用户站点认证设置
async function saveSiteAuthSettings() {
try {
const envResponse: { [key: string]: any } = await api.post('system/env', {
AUXILIARY_AUTH_ENABLE: wizardData.value.siteAuth.auxiliaryAuthEnable,
})
if (!envResponse.success) {
return false
}
if (!wizardData.value.siteAuth.site) {
return true
}
const response: { [key: string]: any } = await api.post('site/auth', {
site: wizardData.value.siteAuth.site,
params: wizardData.value.siteAuth.params,
})
if (!response.success) {
$toast.error(t('setupWizard.saveSiteAuthSettingsFailed', { message: response.message }))
return false
}
return true
} catch (error) {
console.error('Save site auth settings failed:', error)
$toast.error(t('setupWizard.saveSiteAuthSettingsFailed', { message: (error as Error).message || '' }))
return false
}
}
@@ -992,13 +1356,16 @@ export function useSetupWizard() {
}
await api.post('system/setting/Downloaders', [downloader])
return true
} catch (error) {
console.error('Save downloader settings failed:', error)
$toast.error(t('setupWizard.saveDownloaderSettingsFailed'))
return false
}
} else {
// 没有选择下载器时,清空现有配置
console.log('No downloader selected, skipping save')
return true
}
}
@@ -1019,13 +1386,16 @@ export function useSetupWizard() {
}
await api.post('system/setting/MediaServers', [mediaServer])
return true
} catch (error) {
console.error('Save media server settings failed:', error)
$toast.error(t('setupWizard.saveMediaServerSettingsFailed'))
return false
}
} else {
// 没有选择媒体服务器时,清空现有配置
console.log('No media server selected, skipping save')
return true
}
}
@@ -1046,13 +1416,61 @@ export function useSetupWizard() {
}
await api.post('system/setting/Notifications', [notification])
return true
} catch (error) {
console.error('Save notification settings failed:', error)
$toast.error(t('setupWizard.saveNotificationSettingsFailed'))
return false
}
} else {
// 没有选择通知时,清空现有配置
console.log('No notification selected, skipping save')
return true
}
}
// 保存智能助手设置
async function saveAgentSettings() {
try {
const agentSettings = {
AI_AGENT_ENABLE: wizardData.value.agent.enabled,
AI_AGENT_GLOBAL: wizardData.value.agent.enabled ? wizardData.value.agent.global : false,
AI_AGENT_VERBOSE: wizardData.value.agent.enabled ? wizardData.value.agent.verbose : false,
LLM_PROVIDER: wizardData.value.agent.provider,
LLM_MODEL: wizardData.value.agent.model,
LLM_THINKING_LEVEL: wizardData.value.agent.thinkingLevel,
LLM_SUPPORT_IMAGE_INPUT: wizardData.value.agent.supportImageInput,
LLM_SUPPORT_AUDIO_INPUT: wizardData.value.agent.supportAudioInput,
LLM_SUPPORT_AUDIO_OUTPUT: wizardData.value.agent.supportAudioOutput,
LLM_API_KEY: wizardData.value.agent.apiKey,
LLM_BASE_URL: wizardData.value.agent.baseUrl || null,
LLM_BASE_URL_PRESET: wizardData.value.agent.baseUrlPreset || null,
LLM_MAX_CONTEXT_TOKENS: wizardData.value.agent.maxContextTokens,
AUDIO_INPUT_PROVIDER: wizardData.value.agent.audioInputProvider || 'openai',
AUDIO_INPUT_API_KEY: wizardData.value.agent.audioInputApiKey || null,
AUDIO_INPUT_BASE_URL: wizardData.value.agent.audioInputBaseUrl || null,
AUDIO_INPUT_MODEL: wizardData.value.agent.audioInputModel,
AUDIO_INPUT_LANGUAGE: wizardData.value.agent.audioInputLanguage,
AUDIO_OUTPUT_PROVIDER: wizardData.value.agent.audioOutputProvider || 'openai',
AUDIO_OUTPUT_API_KEY: wizardData.value.agent.audioOutputApiKey || null,
AUDIO_OUTPUT_BASE_URL: wizardData.value.agent.audioOutputBaseUrl || null,
AUDIO_OUTPUT_MODEL: wizardData.value.agent.audioOutputModel,
AUDIO_OUTPUT_VOICE: wizardData.value.agent.audioOutputVoice,
AUDIO_OUTPUT_INCLUDE_TEXT: wizardData.value.agent.audioOutputIncludeText,
AI_AGENT_JOB_INTERVAL: wizardData.value.agent.enabled ? wizardData.value.agent.jobInterval : 0,
AI_AGENT_RETRY_TRANSFER: wizardData.value.agent.enabled ? wizardData.value.agent.retryTransfer : false,
AI_RECOMMEND_ENABLED:
wizardData.value.agent.enabled && wizardData.value.agent.recommendEnabled,
AI_RECOMMEND_USER_PREFERENCE: wizardData.value.agent.recommendUserPreference,
AI_RECOMMEND_MAX_ITEMS: wizardData.value.agent.recommendMaxItems,
}
await api.post('system/env', agentSettings)
return true
} catch (error) {
console.error('Save agent settings failed:', error)
$toast.error(t('setupWizard.saveAgentSettingsFailed'))
return false
}
}
@@ -1081,9 +1499,11 @@ export function useSetupWizard() {
console.error('Save rule sequences failed:', error)
}
}
return true
} catch (error) {
console.error('Save preference settings failed:', error)
$toast.error(t('setupWizard.savePreferenceSettingsFailed'))
return false
}
}
@@ -1115,12 +1535,46 @@ export function useSetupWizard() {
if (result.data.PROXY_HOST) {
wizardData.value.basic.proxyHost = result.data.PROXY_HOST
}
if (result.data.OCR_HOST) {
wizardData.value.basic.ocrHost = result.data.OCR_HOST
}
if (result.data.GITHUB_TOKEN) {
wizardData.value.basic.githubToken = result.data.GITHUB_TOKEN
}
wizardData.value.siteAuth.auxiliaryAuthEnable = Boolean(result.data.AUXILIARY_AUTH_ENABLE)
if (result.data.SUPERUSER) {
wizardData.value.basic.username = result.data.SUPERUSER
}
wizardData.value.agent.enabled = Boolean(result.data.AI_AGENT_ENABLE)
wizardData.value.agent.global = Boolean(result.data.AI_AGENT_GLOBAL)
wizardData.value.agent.verbose = Boolean(result.data.AI_AGENT_VERBOSE)
wizardData.value.agent.provider = result.data.LLM_PROVIDER || 'deepseek'
wizardData.value.agent.authConnected = false
wizardData.value.agent.model = result.data.LLM_MODEL || ''
wizardData.value.agent.thinkingLevel = resolveThinkingLevelValue(result.data)
wizardData.value.agent.supportImageInput = result.data.LLM_SUPPORT_IMAGE_INPUT ?? true
wizardData.value.agent.supportAudioInput = Boolean(result.data.LLM_SUPPORT_AUDIO_INPUT)
wizardData.value.agent.supportAudioOutput = Boolean(result.data.LLM_SUPPORT_AUDIO_OUTPUT)
wizardData.value.agent.apiKey = result.data.LLM_API_KEY || ''
wizardData.value.agent.baseUrl = result.data.LLM_BASE_URL || ''
wizardData.value.agent.baseUrlPreset = result.data.LLM_BASE_URL_PRESET || ''
wizardData.value.agent.maxContextTokens = result.data.LLM_MAX_CONTEXT_TOKENS || 64
wizardData.value.agent.audioInputProvider = result.data.AUDIO_INPUT_PROVIDER || 'openai'
wizardData.value.agent.audioInputApiKey = result.data.AUDIO_INPUT_API_KEY || ''
wizardData.value.agent.audioInputBaseUrl = result.data.AUDIO_INPUT_BASE_URL || ''
wizardData.value.agent.audioInputModel = result.data.AUDIO_INPUT_MODEL || 'gpt-4o-mini-transcribe'
wizardData.value.agent.audioInputLanguage = result.data.AUDIO_INPUT_LANGUAGE || 'zh'
wizardData.value.agent.audioOutputProvider = result.data.AUDIO_OUTPUT_PROVIDER || 'openai'
wizardData.value.agent.audioOutputApiKey = result.data.AUDIO_OUTPUT_API_KEY || ''
wizardData.value.agent.audioOutputBaseUrl = result.data.AUDIO_OUTPUT_BASE_URL || ''
wizardData.value.agent.audioOutputModel = result.data.AUDIO_OUTPUT_MODEL || 'gpt-4o-mini-tts'
wizardData.value.agent.audioOutputVoice = result.data.AUDIO_OUTPUT_VOICE || 'alloy'
wizardData.value.agent.audioOutputIncludeText = Boolean(result.data.AUDIO_OUTPUT_INCLUDE_TEXT)
wizardData.value.agent.jobInterval = result.data.AI_AGENT_JOB_INTERVAL || 0
wizardData.value.agent.retryTransfer = Boolean(result.data.AI_AGENT_RETRY_TRANSFER)
wizardData.value.agent.recommendEnabled = Boolean(result.data.AI_RECOMMEND_ENABLED)
wizardData.value.agent.recommendUserPreference = result.data.AI_RECOMMEND_USER_PREFERENCE || ''
wizardData.value.agent.recommendMaxItems = result.data.AI_RECOMMEND_MAX_ITEMS || 50
// 如果没有API Token则创建一个随机的
if (!wizardData.value.basic.apiToken) {
@@ -1132,6 +1586,28 @@ export function useSetupWizard() {
}
}
// 加载用户站点认证列表
async function loadAuthSites() {
try {
authSites.value = (await api.get('site/auth')) || {}
} catch (error) {
console.log('Load auth sites failed:', error)
}
}
// 加载用户站点认证设置
async function loadSiteAuthSettings() {
try {
const result: { [key: string]: any } = await api.get('system/setting/UserSiteAuthParams')
if (result.success && result.data?.value) {
wizardData.value.siteAuth.site = result.data.value.site || ''
wizardData.value.siteAuth.params = result.data.value.params || {}
}
} catch (error) {
console.log('Load site auth settings failed:', error)
}
}
// 加载存储设置
async function loadStorageSettings() {
try {
@@ -1201,6 +1677,8 @@ export function useSetupWizard() {
isLoading.value = true
try {
await loadSystemSettings()
await loadAuthSites()
await loadSiteAuthSettings()
await loadStorageSettings()
await loadDownloaderSettings()
await loadMediaServerSettings()
@@ -1217,6 +1695,7 @@ export function useSetupWizard() {
stepTitles,
stepDescriptions,
wizardData,
authSites,
selectedPreset,
connectivityTest,
validationErrors,
@@ -1231,9 +1710,11 @@ export function useSetupWizard() {
selectPreset,
updatePreferences,
validateCurrentStep,
validateSiteAuthFields,
validateDownloaderFields,
validateMediaServerFields,
validateNotificationFields,
validateAgentFields,
clearValidationErrors,
testConnectivity,
nextStep,

View File

@@ -51,9 +51,25 @@ export const clearCachesAndServiceWorker = async (): Promise<void> => {
/**
* 清除缓存并刷新
*/
const clearCacheAndReload = async (): Promise<void> => {
await clearCachesAndServiceWorker()
reloadWithTimestamp()
export const clearCacheAndReload = async (): Promise<void> => {
let isReloading = false
const reload = () => {
if (isReloading) return
isReloading = true
reloadWithTimestamp()
}
const reloadTimer = window.setTimeout(reload, 3000)
try {
await Promise.race([
clearCachesAndServiceWorker(),
new Promise(resolve => window.setTimeout(resolve, 2500)),
])
} finally {
window.clearTimeout(reloadTimer)
reload()
}
}
/**

View File

@@ -9,8 +9,9 @@ import ShortcutBar from '@/layouts/components/ShortcutBar.vue'
import UserProfile from '@/layouts/components/UserProfile.vue'
import QuickAccess from '@/layouts/components/QuickAccess.vue'
import HeaderTab from '@/layouts/components/HeaderTab.vue'
import { useUserStore } from '@/stores'
import { usePluginSidebarNavStore, useUserStore } from '@/stores'
import { getNavMenus } from '@/router/i18n-menu'
import { filterPluginSidebarNavEntries } from '@/utils/pluginSidebarNav'
import { NavMenu } from '@/@layouts/types'
import { useDisplay } from 'vuetify'
import { useI18n } from 'vue-i18n'
@@ -30,6 +31,7 @@ const route = useRoute()
// 用户 Store
const userStore = useUserStore()
const pluginSidebarNavStore = usePluginSidebarNavStore()
// 响应式的超级用户状态
const superUser = computed(() => userStore.superUser)
@@ -229,7 +231,34 @@ function handlePluginClick() {
showPluginQuickAccess.value = false
}
onMounted(() => {
function appendPluginSidebarMenus() {
for (const { navMenu, section } of filterPluginSidebarNavEntries(
pluginSidebarNavStore.items,
t,
userPermissions.value,
)) {
switch (section) {
case 'start':
startMenus.value.push(navMenu)
break
case 'discovery':
discoveryMenus.value.push(navMenu)
break
case 'subscribe':
subscribeMenus.value.push(navMenu)
break
case 'organize':
organizeMenus.value.push(navMenu)
break
case 'system':
default:
systemMenus.value.push(navMenu)
break
}
}
}
onMounted(async () => {
// 获取菜单列表
startMenus.value = getMenuList(t('menu.start'))
discoveryMenus.value = getMenuList(t('menu.discovery'))
@@ -237,6 +266,9 @@ onMounted(() => {
organizeMenus.value = getMenuList(t('menu.organize'))
systemMenus.value = getMenuList(t('menu.system'))
await pluginSidebarNavStore.ensureSidebarNav()
appendPluginSidebarMenus()
// 监听全局未读消息事件
const unsubscribe = onUnreadMessage(handleUnreadMessage)

View File

@@ -6,6 +6,7 @@ import { useI18n } from 'vue-i18n'
import { useUserStore } from '@/stores'
import { filterMenusByPermission } from '@/utils/permission'
import { usePWA } from '@/composables/usePWA'
import type { DynamicButtonMenuItem } from '@/composables/useDynamicButton'
// 是否显示的输入参数
defineProps({
@@ -120,6 +121,7 @@ interface DynamicButton {
action: () => void
show: boolean
routePath?: string // 添加路径属性,用于标识哪个路由注册的
menuItems?: DynamicButtonMenuItem[]
}
// 提供动态按钮注册和获取的方法
@@ -141,11 +143,13 @@ const unregisterDynamicButton = () => {
if (typeof window !== 'undefined') {
// 确保在浏览器环境中
;(window as any).__VUE_INJECT_DYNAMIC_BUTTON__ = registerDynamicButton
;(window as any).__VUE_UNINJECT_DYNAMIC_BUTTON__ = unregisterDynamicButton
}
// 提供给其他组件使用
provide('registerDynamicButton', registerDynamicButton)
provide('unregisterDynamicButton', unregisterDynamicButton)
provide('dynamicButton', dynamicButton)
// 在组件销毁时清理
onUnmounted(() => {
@@ -153,6 +157,7 @@ onUnmounted(() => {
// 清理全局方法
if (typeof window !== 'undefined') {
delete (window as any).__VUE_INJECT_DYNAMIC_BUTTON__
delete (window as any).__VUE_UNINJECT_DYNAMIC_BUTTON__
}
})
@@ -165,6 +170,30 @@ const showDynamicButton = computed(() => {
(!dynamicButton.value.routePath || dynamicButton.value.routePath === route.path)
)
})
const hasDynamicButtonMenu = computed(() => Boolean(dynamicButton.value?.menuItems?.length))
const legacyDynamicMenuTitleKeyMap: Record<string, string> = {
'components.subscribeHistory.title': 'dialog.subscribeHistory.title',
'components.subscribeEdit.titleDefault': 'dialog.subscribeEdit.titleDefault',
'components.transferQueue.title': 'dialog.transferQueue.title',
'components.pluginMarketSetting.title': 'dialog.pluginMarketSetting.title',
}
function resolveDynamicMenuItemTitle(item: DynamicButtonMenuItem) {
if (item.titleKey) {
return t(item.titleKey, item.titleParams as any)
}
if (!item.title) {
return ''
}
const normalizedTitleKey = legacyDynamicMenuTitleKeyMap[item.title] || item.title
const looksLikeI18nKey = /^[a-z0-9_-]+(?:\.[a-z0-9_-]+)+$/i.test(normalizedTitleKey)
return looksLikeI18nKey ? t(normalizedTitleKey, item.titleParams as any) : item.title
}
</script>
<template>
@@ -223,16 +252,37 @@ const showDynamicButton = computed(() => {
>
<VCardText class="footer-card-content">
<!-- 各页面的动态按钮 -->
<VBtn
icon
variant="text"
:ripple="false"
@click="dynamicButton?.action()"
rounded="pill"
class="footer-nav-btn"
>
<VIcon color="secondary" :icon="dynamicButton?.icon || 'mdi-plus'" size="28"></VIcon>
</VBtn>
<div class="dynamic-btn-activator">
<VBtn
icon
variant="text"
:ripple="false"
@click="!hasDynamicButtonMenu && dynamicButton?.action()"
rounded="pill"
class="footer-nav-btn"
>
<VIcon
color="secondary"
:icon="hasDynamicButtonMenu ? 'mdi-chevron-up' : dynamicButton?.icon || 'mdi-plus'"
size="28"
></VIcon>
</VBtn>
<VMenu v-if="hasDynamicButtonMenu" activator="parent" location="top end" close-on-content-click>
<VList>
<VListItem
v-for="(item, index) in dynamicButton?.menuItems"
:key="item.titleKey || item.title || index"
:base-color="item.color"
@click="item.action()"
>
<template #prepend>
<VIcon v-if="item.icon" :icon="item.icon" />
</template>
<VListItemTitle>{{ resolveDynamicMenuItemTitle(item) }}</VListItemTitle>
</VListItem>
</VList>
</VMenu>
</div>
</VCardText>
</VCard>
</TransitionGroup>
@@ -271,7 +321,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;
will-change: transform, max-inline-size, opacity;
// 透明主题下的特殊样式
.v-theme--transparent & {
@@ -335,8 +385,8 @@ const showDynamicButton = computed(() => {
.dynamic-btn-card {
block-size: auto;
inline-size: auto;
max-inline-size: 60px;
min-block-size: 0;
max-width: 60px;
.footer-card-content {
padding: 3px;
@@ -361,17 +411,17 @@ const showDynamicButton = computed(() => {
// 底部导航动画
.footer-nav-enter-active,
.footer-nav-leave-active {
transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
overflow: hidden;
transition: all 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}
.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;
border-width: 0 !important;
margin-inline-start: 0 !important;
max-inline-size: 0 !important;
opacity: 0;
transform: translateX(20px);
}

View File

@@ -1,6 +1,5 @@
<script setup lang="ts">
import { useTabStateRestore } from '@/composables/useStateRestore'
import { isMobileDevice } from '@/@core/utils/navigator'
const props = defineProps({
modelValue: {
@@ -65,6 +64,10 @@ const showTabsScrollIndicator = ref(false)
const showLeftButton = ref(false)
const showRightButton = ref(false)
const isTouchDevice = () => {
return window.matchMedia('(hover: none) and (pointer: coarse)').matches || navigator.maxTouchPoints > 0
}
// Function to scroll the tabs
const scrollTabs = (direction: 'left' | 'right') => {
const el = tabsContainerRef.value
@@ -90,17 +93,17 @@ const updateTabsIndicator = () => {
const el = tabsContainerRef.value
if (!el) return
// 在移动端不显示滚动指示器
const isMobile = isMobileDevice()
// 仅在触摸设备上隐藏按钮,非触摸小屏设备仍需支持横向切换
const shouldHideScrollControls = isTouchDevice()
const tolerance = 1 // Allow 1px tolerance
const hasOverflow = el.scrollWidth > el.clientWidth + tolerance
const isScrolledToEnd = el.scrollLeft + el.clientWidth >= el.scrollWidth - tolerance
const isScrolledToStart = el.scrollLeft <= tolerance
showTabsScrollIndicator.value = hasOverflow && !isScrolledToEnd && !isMobile
showLeftButton.value = hasOverflow && !isScrolledToStart && !isMobile
showRightButton.value = hasOverflow && !isScrolledToEnd && !isMobile
showTabsScrollIndicator.value = hasOverflow && !isScrolledToEnd && !shouldHideScrollControls
showLeftButton.value = hasOverflow && !isScrolledToStart && !shouldHideScrollControls
showRightButton.value = hasOverflow && !isScrolledToEnd && !shouldHideScrollControls
}
// Debounce resize handler
@@ -185,8 +188,8 @@ onUnmounted(() => {
margin-inline-start: 6px;
}
// 在移动端隐藏滚动按钮
@media (width <= 768px) {
// 触摸设备支持手势横向滚动,无需额外按钮
@media (hover: none) and (pointer: coarse) {
display: none !important;
}
}
@@ -231,8 +234,8 @@ onUnmounted(() => {
opacity: 1;
}
// 在移动端隐藏渐变指示器
@media (width <= 768px) {
// 触摸设备支持手势横向滚动,无需额外指示器
@media (hover: none) and (pointer: coarse) {
&::after {
display: none !important;
}

View File

@@ -27,25 +27,65 @@ const metaKey = computed(() => (isMac() ? '⌘+K' : 'Ctrl+K'))
</script>
<template>
<!-- 👉 Search Icon -->
<div class="d-flex align-center cursor-pointer ms-lg-n2" style="user-select: none">
<IconBtn @click="openSearchDialog">
<VIcon icon="ri-search-line" />
</IconBtn>
<span v-if="display.lgAndUp.value" class="flex align-center text-disabled ms-2" @click="openSearchDialog">
<span class="me-3">{{ t('common.search') }}</span>
<span class="meta-key">{{ metaKey }}</span>
</span>
<!-- 小屏仅图标按钮 -->
<IconBtn v-if="!display.mdAndUp.value" @click="openSearchDialog">
<VIcon icon="mdi-magnify" />
</IconBtn>
<!-- 中屏及以上胶囊搜索触发栏 -->
<div v-else class="search-trigger" @click="openSearchDialog">
<VIcon icon="mdi-magnify" size="18" class="search-trigger-icon" />
<span class="search-trigger-text">{{ t('common.search') }}</span>
<kbd class="search-trigger-kbd">{{ metaKey }}</kbd>
</div>
<!-- 搜索弹窗 -->
<SearchBarDialog v-model="searchDialog" v-if="searchDialog" @close="searchDialog = false" />
</template>
<style type="scss" scoped>
.meta-key {
border: thin solid rgba(var(--v-border-color), var(--v-border-opacity));
border-radius: 6px;
block-size: 1.75rem;
padding-block: 0.1rem;
padding-inline: 0.25rem;
<style scoped>
.search-trigger {
display: flex;
align-items: center;
gap: 8px;
border: 1.5px solid rgba(var(--v-theme-on-surface), 0.12);
border-radius: 22px;
block-size: 36px;
cursor: pointer;
padding-inline: 12px;
transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
user-select: none;
}
.search-trigger:hover {
border-color: rgba(var(--v-theme-on-surface), 0.22);
background-color: rgba(var(--v-theme-on-surface), 0.06);
box-shadow: 0 1px 4px rgba(0, 0, 0, 4%);
}
.search-trigger-icon {
color: rgba(var(--v-theme-on-surface), 0.4);
flex-shrink: 0;
}
.search-trigger-text {
color: rgba(var(--v-theme-on-surface), 0.4);
font-size: 13.5px;
line-height: 1;
white-space: nowrap;
}
.search-trigger-kbd {
border: 1px solid rgba(var(--v-theme-on-surface), 0.12);
border-radius: 5px;
background-color: rgba(var(--v-theme-on-surface), 0.04);
color: rgba(var(--v-theme-on-surface), 0.4);
font-family: inherit;
font-size: 11px;
font-weight: 500;
line-height: 1;
margin-inline-start: 4px;
padding-block: 3px;
padding-inline: 5px;
}
</style>

View File

@@ -1,25 +1,33 @@
<script lang="ts" setup>
import NameTestView from '@/views/system/NameTestView.vue'
import NetTestView from '@/views/system/NetTestView.vue'
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 AccountSettingService from '@/views/system/ServiceView.vue'
import api from '@/api'
import { useDisplay } from 'vuetify'
import { getQueryValue } from '@/@core/utils'
import { useI18n } from 'vue-i18n'
import { clearAppBadge } from '@/utils/badge'
type MessageViewExpose = {
pauseSSE?: () => void
resumeSSE?: () => void
refreshLatestMessages?: () => Promise<void> | void
}
// 国际化
const { t } = useI18n()
// 显示器宽度
const display = useDisplay()
// 快捷工具只在弹窗打开时使用,按需加载避免默认布局首屏带上所有 system 视图。
const NameTestView = defineAsyncComponent(() => import('@/views/system/NameTestView.vue'))
const NetTestView = defineAsyncComponent(() => import('@/views/system/NetTestView.vue'))
const LoggingView = defineAsyncComponent(() => import('@/views/system/LoggingView.vue'))
const RuleTestView = defineAsyncComponent(() => import('@/views/system/RuleTestView.vue'))
const ModuleTestView = defineAsyncComponent(() => import('@/views/system/ModuleTestView.vue'))
const MessageView = defineAsyncComponent(() => import('@/views/system/MessageView.vue'))
const WordsView = defineAsyncComponent(() => import('@/views/system/WordsView.vue'))
const CacheView = defineAsyncComponent(() => import('@/views/system/CacheView.vue'))
const AccountSettingService = defineAsyncComponent(() => import('@/views/system/ServiceView.vue'))
// App捷径
const appsMenu = ref(false)
@@ -63,7 +71,7 @@ const sendButtonDisabled = ref(false)
const messageDialogRef = ref<any>(null)
// 消息视图引用
const messageViewRef = ref<any>(null)
const messageViewRef = ref<MessageViewExpose | null>(null)
// 滚动容器引用
const messageContentRef = ref<any>()
@@ -153,9 +161,7 @@ async function openMessageDialog() {
}, 600)
// 等待对话框打开后恢复SSE连接
nextTick(() => {
if (messageViewRef.value && typeof messageViewRef.value.resumeSSE === 'function') {
messageViewRef.value.resumeSSE()
}
messageViewRef.value?.resumeSSE?.()
})
}
@@ -203,16 +209,23 @@ function allLoggingUrl() {
// 发送消息
async function sendMessage() {
if (user_message.value) {
try {
sendButtonDisabled.value = true
await api.post(`message/web?text=${user_message.value}`)
user_message.value = ''
sendButtonDisabled.value = false
forceScrollToEnd() // 发送消息后强制滚动到底部
} catch (error) {
console.error(error)
}
const messageText = user_message.value.trim()
if (!messageText) {
return
}
try {
sendButtonDisabled.value = true
await api.post(`message/web?text=${encodeURIComponent(messageText)}`)
user_message.value = ''
// 发送成功后主动同步最新一页消息避免SSE短暂断流时界面停留在旧状态。
// await messageViewRef.value?.refreshLatestMessages?.()
forceScrollToEnd() // 发送消息后强制滚动到底部
} catch (error) {
console.error(error)
} finally {
sendButtonDisabled.value = false
}
}
@@ -228,7 +241,7 @@ defineExpose({
// 监听消息对话框状态变化
watch(messageDialog, newValue => {
if (!newValue && messageViewRef.value && typeof messageViewRef.value.pauseSSE === 'function') {
if (!newValue && messageViewRef.value?.pauseSSE) {
// 对话框关闭时暂停SSE连接
messageViewRef.value.pauseSSE()
}
@@ -350,13 +363,13 @@ onMounted(() => {
</VCard>
</VDialog>
<!-- 实时日志弹窗 -->
<VDialog
v-if="loggingDialog"
v-model="loggingDialog"
scrollable
max-width="70rem"
:fullscreen="!display.mdAndUp.value"
>
<VDialog
v-if="loggingDialog"
v-model="loggingDialog"
scrollable
max-width="80rem"
:fullscreen="!display.mdAndUp.value"
>
<VCard>
<VDialogCloseBtn @click="loggingDialog = false" />
<VCardItem>
@@ -372,7 +385,7 @@ onMounted(() => {
</VCardTitle>
</VCardItem>
<VDivider />
<VCardText>
<VCardText class="pa-0">
<LoggingView logfile="moviepilot.log" />
</VCardText>
</VCard>

View File

@@ -12,6 +12,7 @@ const hasNewMessage = ref(false)
// 通知列表
const notificationList = ref<SystemNotification[]>([])
const MAX_NOTIFICATIONS = 100
// 弹窗
const appsMenu = ref(false)
@@ -31,6 +32,9 @@ function handleMessage(event: MessageEvent) {
if (event.data) {
const noti: SystemNotification = JSON.parse(event.data)
notificationList.value.unshift(noti)
if (notificationList.value.length > MAX_NOTIFICATIONS) {
notificationList.value.length = MAX_NOTIFICATIONS
}
hasNewMessage.value = true
}
}

View File

@@ -58,6 +58,8 @@ const customCSS = ref('')
// 透明度相关
const transparencyOpacity = ref(parseFloat(localStorage.getItem('transparency-opacity') || '0.3'))
const transparencyBlur = ref(parseFloat(localStorage.getItem('transparency-blur') || '10'))
const backgroundPosterOpacity = ref(parseFloat(localStorage.getItem('transparency-background-poster-opacity') || '0'))
const backgroundBlur = ref(parseFloat(localStorage.getItem('transparency-background-blur') || '16'))
const transparencyLevel = ref(localStorage.getItem('transparency-level') || 'medium')
const isTransparentTheme = computed(() => currentThemeName.value === 'transparent')
const showTransparencyDialog = ref(false)
@@ -383,6 +385,15 @@ async function saveCustomCSS() {
function applyTransparencySettings() {
const root = document.documentElement
if (!Number.isFinite(backgroundPosterOpacity.value)) {
backgroundPosterOpacity.value = 1
}
backgroundPosterOpacity.value = Math.min(1, Math.max(0, backgroundPosterOpacity.value))
if (!Number.isFinite(backgroundBlur.value)) {
backgroundBlur.value = 16
}
backgroundBlur.value = Math.min(30, Math.max(0, backgroundBlur.value))
// 设置CSS变量
root.style.setProperty('--transparent-opacity', transparencyOpacity.value.toString())
root.style.setProperty('--transparent-opacity-light', (transparencyOpacity.value * 0.67).toString())
@@ -390,10 +401,14 @@ function applyTransparencySettings() {
root.style.setProperty('--transparent-blur', `${transparencyBlur.value}px`)
root.style.setProperty('--transparent-blur-light', `${transparencyBlur.value * 0.6}px`)
root.style.setProperty('--transparent-blur-heavy', `${transparencyBlur.value * 1.6}px`)
root.style.setProperty('--transparent-background-poster-opacity', (1 - backgroundPosterOpacity.value).toString())
root.style.setProperty('--transparent-background-blur', `${backgroundBlur.value}px`)
// 保存到本地存储
localStorage.setItem('transparency-opacity', transparencyOpacity.value.toString())
localStorage.setItem('transparency-blur', transparencyBlur.value.toString())
localStorage.setItem('transparency-background-poster-opacity', backgroundPosterOpacity.value.toString())
localStorage.setItem('transparency-background-blur', backgroundBlur.value.toString())
}
// 调整透明度预设
@@ -434,10 +449,22 @@ function onBlurChange() {
transparencyLevel.value = ''
}
// 背景海报透明度变化处理
function onBackgroundPosterOpacityChange() {
applyTransparencySettings()
}
// 背景磨砂变化处理
function onBackgroundBlurChange() {
applyTransparencySettings()
}
// 重置透明度设置
function resetTransparencySettings() {
transparencyOpacity.value = 0.3
transparencyBlur.value = 10
backgroundPosterOpacity.value = 0
backgroundBlur.value = 16
transparencyLevel.value = 'medium'
applyTransparencySettings()
}
@@ -821,6 +848,38 @@ onUnmounted(() => {
/>
</div>
<!-- 背景海报透明度滑动条 -->
<div>
<div class="d-flex align-center justify-space-between mb-2">
<span class="text-body-2">{{ t('theme.backgroundPosterOpacity') }}</span>
<span class="text-caption">{{ Math.round(backgroundPosterOpacity * 100) }}%</span>
</div>
<VSlider
v-model="backgroundPosterOpacity"
:min="0"
:max="1"
:step="0.01"
color="primary"
@update:model-value="onBackgroundPosterOpacityChange"
/>
</div>
<!-- 背景磨砂滑动条 -->
<div>
<div class="d-flex align-center justify-space-between mb-2">
<span class="text-body-2">{{ t('theme.backgroundBlur') }}</span>
<span class="text-caption">{{ backgroundBlur }}px</span>
</div>
<VSlider
v-model="backgroundBlur"
:min="0"
:max="30"
:step="1"
color="primary"
@update:model-value="onBackgroundBlurChange"
/>
</div>
<!-- 预设按钮 -->
<div>
<span class="text-body-2 d-block mb-2">{{ t('common.preset') }}</span>

View File

@@ -7,7 +7,7 @@ const route = useRoute()
<template>
<DefaultLayout>
<router-view v-slot="{ Component }">
<keep-alive>
<keep-alive :max="12">
<component :is="Component" v-if="route.meta.keepAlive" :key="route.fullPath" />
</keep-alive>
<component :is="Component" v-if="!route.meta.keepAlive" :key="route.fullPath" />

View File

@@ -74,6 +74,9 @@ export default {
descending: 'Descending',
versionMismatch: 'The browser cache version is inconsistent with the server version, please try to clear the cache',
clearCache: 'Clear Cache',
sortMode: 'Sort Mode',
sortModeHint: 'Drag sorting mode is active',
exit: 'Exit',
},
mediaType: {
movie: 'Movie',
@@ -90,6 +93,7 @@ export default {
mediaServer: 'Media Server',
manual: 'Manual',
plugin: 'Plugin',
agent: 'Agent',
other: 'Other',
},
actionStep: {
@@ -145,6 +149,8 @@ export default {
transparencyAdjust: 'Transparency Adjustment',
transparencyOpacity: 'Opacity',
transparencyBlur: 'Blur',
backgroundPosterOpacity: 'Background Opacity',
backgroundBlur: 'Background Frosted Blur',
transparencyReset: 'Reset',
transparencyLow: 'Low Transparency',
transparencyMedium: 'Medium Transparency',
@@ -257,6 +263,7 @@ export default {
serverError: 'Login failed, server error!',
loginFailed: 'Login Failed',
secondaryVerification: 'Secondary Verification',
orDivider: 'OR',
loginWithPasskey: 'Login with Passkey',
loginWithOtp: 'Login with OTP',
orUsePasskey: 'Or use Passkey for verification',
@@ -316,7 +323,7 @@ export default {
system: {
title: 'System',
description:
'Basic settings, downloaders (Qbittorrent, Transmission), media servers (Emby, Jellyfin, Plex, TrimeMedia, Ugreen)',
'Basic settings, downloaders (Qbittorrent, Transmission), media servers (Emby, ZSpace, Jellyfin, Plex, TrimeMedia, Ugreen)',
},
directory: {
title: 'Storage & Directories',
@@ -348,7 +355,8 @@ export default {
},
notification: {
title: 'Notifications',
description: 'Notification channels (WeChat, Telegram, Slack, SynologyChat, VoceChat, WebPush), message scope',
description:
'Notification channels (WeChat Work, WeChat ClawBot, Telegram, Slack, SynologyChat, VoceChat, WebPush), message scope',
},
about: {
title: 'About',
@@ -458,7 +466,8 @@ export default {
botSecret: 'Bot Secret',
botSecretHint: 'WebSocket secret of the WeChat Work AI bot',
botChatId: 'Default Target',
botChatIdHint: 'Use user userid; for proactive group messages use group:chatid. Leave empty to notify known interacted users',
botChatIdHint:
'Use user userid; for proactive group messages use group:chatid. Leave empty to notify known interacted users',
botChatIdPlaceholder: 'userid or group:chatid',
botWsUrl: 'WebSocket URL',
botWsUrlHint: 'WebSocket endpoint for the WeChat Work AI bot, usually the default value',
@@ -466,6 +475,60 @@ export default {
adminsHint: 'User IDs that can use admin menu and commands, separated by commas',
adminsPlaceholder: 'User IDs list, separated by commas',
},
wechatclawbot: {
name: 'WeChat ClawBot',
baseUrl: 'iLink Base URL',
baseUrlHint: 'iLink service URL for WeChat ClawBot, keep default in most cases',
defaultTarget: 'Default Target',
defaultTargetHint: 'Optional target userid; leave empty to notify interacted users',
defaultTargetPlaceholder: 'userid (optional)',
admins: 'Admin Whitelist',
adminsHint: 'User IDs allowed to run slash commands, separated by commas',
adminsPlaceholder: 'User IDs list, separated by commas',
pollTimeout: 'Poll Timeout (seconds)',
pollTimeoutHint: 'Long polling timeout, recommended 20-30 seconds',
loginStatus: 'Login Status',
connected: 'Connected',
waiting: 'Waiting for QR scan',
scanned: 'Scanned, waiting for confirmation',
confirmed: 'Confirmed, establishing connection',
expired: 'QR code expired',
refreshQrcode: 'Refresh QR Code',
logout: 'Logout',
noQrcode: 'No QR code yet. Refresh or save config first.',
scanHint: 'Scan with WeChat to bind. Save and enable this channel before first use.',
accountId: 'Account ID',
qrcodeUpdatedAt: 'QR Updated At',
knownTargets: 'Recent Interacted Users',
noKnownTargets: 'No interaction records yet',
statusLoadFailed: 'Failed to load WeChat ClawBot status',
qrcodeRefreshSuccess: 'WeChat ClawBot QR code refreshed',
qrcodeRefreshFailed: 'Failed to refresh WeChat ClawBot QR code',
logoutSuccess: 'WeChat ClawBot logged out',
logoutFailed: 'Failed to logout WeChat ClawBot',
},
feishu: {
name: 'Feishu',
appId: 'App ID',
appIdHint: 'App ID of the Feishu Open Platform application',
appIdRequired: 'App ID cannot be empty',
appSecret: 'App Secret',
appSecretHint: 'App Secret of the Feishu Open Platform application',
appSecretRequired: 'App Secret cannot be empty',
openId: 'Default User Open ID',
openIdHint: 'Default recipient user Open ID; leave empty to prefer recent interacted users',
openIdPlaceholder: 'ou_xxx',
chatId: 'Default Group Chat ID',
chatIdHint: 'Default recipient group chat ID; either this or Open ID is enough',
chatIdPlaceholder: 'oc_xxx',
admins: 'Admin Whitelist',
adminsHint: 'Open IDs allowed to run commands and admin actions, separated by commas',
adminsPlaceholder: 'Open ID list, separated by commas',
verificationToken: 'Verification Token',
verificationTokenHint: 'Verification Token for Feishu event subscription, required when validation is enabled',
encryptKey: 'Encrypt Key',
encryptKeyHint: 'Encrypt Key for Feishu event subscription, required when encryption is enabled',
},
telegram: {
name: 'Telegram',
token: 'Bot Token',
@@ -881,6 +944,7 @@ export default {
plex: 'Plex',
jellyfin: 'Jellyfin',
emby: 'Emby',
zspace: 'ZSpace',
appLaunchFailed: 'App launch failed, redirecting to web version',
appNotInstalled: 'App not detected, redirecting to web version',
downloadApp: 'Download App',
@@ -920,6 +984,8 @@ export default {
ranking: 'Ranking',
noStatisticsData: 'No share statistics data available',
bestVersion: 'Version Upgrading',
bestVersionEpisodeShort: 'Episode',
bestVersionWholeShort: 'Full',
completed: 'Completed',
subscribing: 'Subscribing',
notStarted: 'Not Started',
@@ -995,6 +1061,7 @@ export default {
aiRecommend: 'AI Recommendation',
reRecommend: 'Regenerate Recommendation',
aiRecommendError: 'AI Recommendation Failed',
refreshSearch: 'Re-search',
},
browse: {
actor: 'Actor',
@@ -1230,6 +1297,17 @@ export default {
content: 'Content',
refreshing: 'Refreshing',
initializing: 'Initializing',
searchPlaceholder: 'Search logs',
allLevels: 'All Levels',
followTail: 'Follow latest logs',
wrapLines: 'Wrap lines',
pauseStream: 'Pause stream',
resumeStream: 'Resume stream',
waitingForLogs: 'Waiting for logs...',
paused: 'Paused',
connected: 'Live',
lineCount: 'Showing {visible}/{total} lines',
jumpToLatest: 'Jump to latest ({count})',
},
moduleTest: {
normal: 'Normal',
@@ -1320,10 +1398,34 @@ export default {
aiAgent: 'Enable AI Assistant',
aiAgentEnable: 'Enable AI Assistant',
aiAgentEnableHint: 'Enable AI assistant functionality, requires LLM configuration',
aiAgentSectionTitle: 'AI Assistant Configuration',
aiAgentSectionDesc:
'After enabling it, you can use the Agent in message conversations and optionally turn on transfer-failure takeover and AI recommendations.',
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.',
llmModelHint: 'Specify the LLM model to use, such as deepseek-v4-flash, gpt-5.4, etc.',
llmModelResolvedHint: 'Max context has been auto-filled to {context}K from the model catalog. Source: {source}',
llmThinking: 'Thinking Mode / Depth',
llmThinkingHint:
'Thinking depth: off/auto/minimal/low/medium/high/max/xhigh. Unsupported levels will be mapped to the nearest provider-supported value.',
llmThinkingLevelOff: 'Off (off)',
llmThinkingLevelAuto: 'Auto (auto)',
llmThinkingLevelMinimal: 'Minimal (minimal)',
llmThinkingLevelLow: 'Low (low)',
llmThinkingLevelMedium: 'Medium (medium)',
llmThinkingLevelHigh: 'High (high)',
llmThinkingLevelMax: 'Max (max)',
llmThinkingLevelXhigh: 'XHigh (xhigh)',
llmSupportImageInput: 'Model Supports Image Input',
llmSupportImageInputHint:
'When enabled, message images are sent to the LLM as multimodal image input. When disabled, images are saved locally as attachments and only the file path is passed to the AI assistant.',
llmSupportAudioInput: 'Support Audio Input',
llmSupportAudioInputHint:
'When enabled, incoming audio messages are transcribed before being handled by the AI assistant.',
llmSupportAudioOutput: 'Support Audio Output',
llmSupportAudioOutputHint:
'When enabled, the AI assistant can send voice replies on supported channels.',
llmMaxContextTokens: 'LLM Max Context Tokens (K)',
llmMaxContextTokensHint:
'Set the maximum number of context tokens (in thousands) for the LLM. Exceeding this limit will trigger context trimming.',
@@ -1332,6 +1434,52 @@ export default {
llmApiKeyPlaceholder: 'Please enter API key',
llmBaseUrl: 'LLM Base URL',
llmBaseUrlHint: 'Base URL for LLM API, used for custom API endpoints',
llmProviderAuth: 'Provider Authorization',
llmProviderAuthHint:
'Providers that support account authorization can complete sign-in here and reuse the saved auth state.',
llmProviderConnectedAs: 'Connected as: {label}',
llmProviderDisconnect: 'Disconnect Authorization',
llmProviderDisconnected: 'Provider authorization disconnected',
llmProviderAuthDialogTitle: 'Provider Authorization',
llmProviderPopupBlocked:
'The browser blocked the authorization popup. Use the button below to continue manually.',
llmProviderDeviceCode: 'Device Code',
llmProviderOpenAuthPage: 'Open Authorization Page',
llmProviderCheckAuthStatus: 'Check Authorization Status',
audioInputProvider: 'Audio Input Provider',
audioInputProviderHint:
'Service used to transcribe incoming audio messages. Supports OpenAI audio, Chat Audio compatible APIs, and Xiaomi MiMo.',
audioProviderOpenAiAudio: 'OpenAI Audio Compatible',
audioProviderChatAudio: 'Chat Audio Compatible',
audioProviderMimo: 'Xiaomi MiMo',
audioInputApiKey: 'Audio Input API Key',
audioInputApiKeyHint: 'API key used for audio transcription.',
audioInputBaseUrl: 'Audio Input Base URL',
audioInputBaseUrlHint:
'Base URL for audio input. Use the matching compatible endpoint for Chat Audio services; MiMo defaults to https://api.xiaomimimo.com/v1.',
audioInputModel: 'Audio Input Model',
audioInputModelHint: 'Model name used to convert audio content into text.',
audioInputLanguage: 'Recognition Language',
audioInputLanguageHint:
'Default language for audio transcription, such as zh or en. Leave blank to use the backend default.',
audioOutputProvider: 'Audio Output Provider',
audioOutputProviderHint:
'Service used to generate voice replies. Supports OpenAI audio, Chat Audio compatible APIs, and Xiaomi MiMo.',
audioOutputApiKey: 'Audio Output API Key',
audioOutputApiKeyHint: 'API key used for speech synthesis.',
audioOutputBaseUrl: 'Audio Output Base URL',
audioOutputBaseUrlHint:
'Base URL for audio output. Use the matching compatible endpoint for Chat Audio services; MiMo defaults to https://api.xiaomimimo.com/v1.',
audioOutputModel: 'Audio Output Model',
audioOutputModelHint: 'Model name used to convert text content into speech.',
audioOutputVoice: 'Voice Preset',
audioOutputVoiceHint: 'Speaker or voice preset used for speech synthesis.',
audioOutputIncludeText: 'Include Text with Voice Replies',
audioOutputIncludeTextHint: 'When sending a voice reply, also include the text version of the response.',
llmTestAction: 'Test Call',
llmTestSuccessToast: 'LLM test call succeeded',
llmTestFailedToast: 'LLM test call failed',
llmTestFailedToastWithMessage: 'LLM test call failed: {message}',
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',
@@ -1352,6 +1500,9 @@ export default {
advancedSettingsDesc: 'System advanced settings, only need to be adjusted in special cases',
downloaders: 'Downloaders',
downloadersDesc: 'Only the default downloader will be used by default.',
aiAgentRetryTransfer: 'AI Takeover on Transfer Failure',
aiAgentRetryTransferHint:
'When enabled, the AI assistant will automatically take over and retry when file transfer/organization fails, using AI capabilities to resolve recognition and matching issues.',
aiRecommendEnabled: 'AI Search Recommendation',
aiRecommendEnabledHint:
'Enable AI search recommendation. When enabled, an AI recommendation button will be displayed on the search result page, recommending resources based on user preferences.',
@@ -1367,6 +1518,7 @@ export default {
media: 'Media',
network: 'Network',
log: 'Log',
data: 'Data',
lab: 'Lab',
downloaderSaveSuccess: 'Downloader settings saved successfully',
downloaderSaveFailed: 'Failed to save downloader settings!',
@@ -1384,6 +1536,7 @@ export default {
transmission: 'Transmission',
rtorrent: 'rTorrent',
emby: 'Emby',
zspace: 'ZSpace',
jellyfin: 'Jellyfin',
plex: 'Plex',
ugreen: 'Ugreen',
@@ -1429,8 +1582,12 @@ export default {
fanartEnableHint: 'Use image data from fanart.tv',
fanartLang: 'Fanart Language',
fanartLangHint: 'Set language preference for Fanart images, ordered by priority when multiple selected',
recognizePluginFirst: "Prioritize Plugin Recognition",
recognizePluginFirstHint: "Prioritize calling plugins for media recognition. If a plugin matches, native recognition will be skipped",
recognizePluginFirst: 'Prioritize Plugin Recognition',
recognizePluginFirstHint:
'Prioritize calling plugins for media recognition. If a plugin matches, native recognition will be skipped',
mediaRecognizeShare: 'Use Shared Media Recognition',
mediaRecognizeShareHint:
'Report successful keyword to media ID mappings and reuse shared recognition results when local recognition fails',
githubProxy: 'Github Acceleration Proxy',
githubProxyPlaceholder: 'Leave empty for no proxy',
githubProxyHint: 'Use proxy to accelerate Github access speed',
@@ -1460,8 +1617,26 @@ export default {
logBackupCountMin: 'Maximum number of log file backups must be greater than or equal to 1',
logFileFormat: 'Log File Format',
logFileFormatHint: 'Set the output format of log files to customize the displayed content of logs',
dataCleanupEnable: 'Enable Data Cleanup',
dataCleanupEnableHint: 'When disabled, scheduled data cleanup tasks will be skipped',
dataCleanupDaysRequired: 'Please enter a cleanup retention period',
dataCleanupDaysMin: 'Cleanup retention period must be greater than or equal to 0',
dataCleanupMessageDays: 'Message Retention Days',
dataCleanupMessageDaysHint: 'Unit: days. Set to 0 to skip cleanup for the message table',
dataCleanupDownloadHistoryDays: 'Download History Retention Days',
dataCleanupDownloadHistoryDaysHint:
'Unit: days. Set to 0 to skip cleanup for download history and its related orphaned download file records',
dataCleanupSiteUserDataDays: 'Site User Data Retention Days',
dataCleanupSiteUserDataDaysHint: 'Unit: days. Set to 0 to skip cleanup for the site user data table',
dataCleanupTransferHistoryDays: 'Transfer History Retention Days',
dataCleanupTransferHistoryDaysHint: 'Unit: days. Set to 0 to skip cleanup for the transfer history table',
downloadFilesCleanupNotice:
'The download files table has no independent timestamp field. Its orphan record cleanup follows the retention period of download history.',
pluginAutoReload: 'Plugin Hot Reload',
pluginAutoReloadHint: 'Automatically reload after modifying plugin files, used when developing plugins',
pluginLocalRepoPaths: 'Local Plugin Repository Paths',
pluginLocalRepoPathsHint:
'Local plugin repository directories. Separate multiple directories with commas. Relative and absolute paths are supported.',
encodingDetectionPerformanceMode: 'Encoding Detection Performance Mode',
encodingDetectionPerformanceModeHint:
'Prioritize detection efficiency, but may reduce encoding detection accuracy',
@@ -1503,6 +1678,7 @@ export default {
},
mb: 'MB',
hour: 'hour',
day: 'day',
customizeWallpaperApi: 'Customize Wallpaper Api',
customizeWallpaperApiHint:
'It will get the image file extension format images that are allowed in settings in the content returned by the API.',
@@ -1549,7 +1725,7 @@ export default {
skipDesc: 'Skip scraping, this file will not be generated',
missingOnlyDesc: 'Scrape only if missing, existing file remains unchanged',
overwriteDesc: 'Always scrape, existing file will be overwritten',
}
},
},
site: {
siteSync: 'Site Synchronization',
@@ -1633,7 +1809,9 @@ export default {
timeSaveSuccess: 'Notification send time saved successfully',
timeSaveFailed: 'Failed to save notification send time!',
channel: 'Notification',
wechat: 'WeChat',
wechat: 'WeChat Work',
wechatClawBot: 'WeChat ClawBot',
feishu: 'Feishu',
resourceDownload: 'Resource Download',
mediaImport: 'Media Import',
subscription: 'Subscription',
@@ -1717,7 +1895,7 @@ export default {
animeCategory: 'Anime',
downloadUser: 'Remote Search Auto Download User List',
downloadUserHint:
'Whether to automatically download when searching with Telegram, WeChat, etc., comma separated, set to all to represent all users auto-download',
'Whether to auto-download when searching with Telegram, WeChat Work, etc., comma separated, set to all for all users',
multipleNameSearch: 'Multiple Name Resource Search',
multipleNameSearchHint:
'Search site resources using multiple names (Chinese, English, etc.) and merge search results, will increase site access frequency',
@@ -1962,7 +2140,8 @@ export default {
resetDefaultAvatar: 'Reset Default Avatar',
restoreCurrentAvatar: 'Restore Current Avatar',
notifications: 'Notifications',
wechat: 'WeChat UserID',
wechat: 'WeChat Work UserID',
wechatClawBot: 'WeChat ClawBot UserID',
telegram: 'Telegram UserID',
slack: 'Slack UserID',
discord: 'Discord UserID',
@@ -2003,7 +2182,7 @@ export default {
},
searchBar: {
search: 'Search',
searchPlaceholder: 'Search features, subscriptions, settings...',
searchPlaceholder: 'Search movies, TV shows and more...',
recentSearches: 'Recent Searches',
noRecentSearches: 'No recent search history',
functions: 'Functions',
@@ -2023,6 +2202,9 @@ export default {
searchInSites: 'Search for torrent resources in sites',
relatedResources: 'Related Resources',
searchTip: 'You can search for movies, TV shows, actors, resources, etc.',
emptySearchHint: 'Enter keywords to search',
escClose: 'Close',
openSearch: 'Open search',
},
searchSite: {
selectSites: 'Select Sites',
@@ -2240,6 +2422,10 @@ export default {
repoUrl: 'Plugin Repository URL',
repoPlaceholder: 'Format: https://github.com/jxxghp/MoviePilot-Plugins/,https://github.com/xxxx/xxxxxx/',
repoHint: 'Multiple URLs separated by lines, only Github repositories are supported',
urlPlaceholder: 'Enter plugin repository URL',
noRepos: 'No plugin repository URLs',
invalidUrl: 'Please enter a valid URL',
duplicateUrl: 'This URL already exists',
close: 'Close',
save: 'Save',
saveSuccess: 'Plugin repository saved successfully',
@@ -2351,6 +2537,29 @@ export default {
scrapeHint: 'Automatically scrape metadata after organization',
fromHistoryOption: 'Reuse Historical Recognition Info',
fromHistoryHint: 'Use media info already recognized in historical organization records',
previewTitle: 'Preview Result',
previewSubtitle: 'Click "Preview" to inspect the expected organization result without changing files.',
previewResult: 'Preview',
previewLoading: 'Generating preview result...',
previewRequestFailed: 'Preview request failed',
previewTotal: 'Total {count}',
previewSuccess: 'Success {count}',
previewFailed: 'Failed {count}',
previewMediaInfo: 'Media',
previewMediaName: 'Name',
previewMediaType: 'Type',
previewSeasonInfo: 'Season',
previewSeasonLabel: 'Season',
previewEpisodeCount: 'Episodes',
previewAfterColumn: 'After',
previewBeforeColumn: 'Before',
previewFileNameColumn: 'Filename',
previewEmptyTitle: 'No preview yet',
previewEmptyDescription: 'Click "Preview" to inspect the organization result here.',
noPreviewData: 'No preview data',
noFailedPreviewData: 'No failed items',
copySuccess: 'Path copied',
copyFailed: 'Copy failed',
addToQueue: 'Add to Organization Queue',
reorganizeNow: 'Organize Now',
auto: 'Auto',
@@ -2385,6 +2594,8 @@ export default {
savePathHint: 'Specify download save path for this subscription, leave empty to use default download directory',
bestVersion: 'Version Upgrade',
bestVersionHint: 'Perform version upgrade subscription based on upgrade priorities',
bestVersionFull: 'Full Season Upgrade',
bestVersionFullHint: 'Only download full-season packs and do not split packs by episode',
searchImdbid: 'Search Using ImdbID',
searchImdbidHint: 'Use ImdbID for precise resource searching',
showEditDialog: 'Edit More Rules When Subscribing',
@@ -2534,6 +2745,7 @@ export default {
close: 'Close',
loadingDirectoryStructure: 'Loading directory structure...',
reorganize: 'Reorganize',
filterPlaceholder: 'Filter (supports * ? wildcards)',
},
person: {
alias: 'Also Known As:',
@@ -2590,6 +2802,7 @@ export default {
settings: 'Settings',
projectHome: 'Project Home',
updateHistory: 'Update History',
local: 'Local',
installToLocal: 'Install to Local',
totalDownloads: 'Total {count} downloads',
viewData: 'View Data',
@@ -2680,7 +2893,9 @@ export default {
nickname: 'Nickname',
nicknamePlaceholder: 'Display nickname, takes precedence over username',
accountBinding: 'Account Binding',
wechatUser: 'WeChat User',
wechatUser: 'WeChat Work User',
wechatClawBotUser: 'WeChat ClawBot User',
feishuUser: 'Feishu User',
telegramUser: 'Telegram User',
slackUser: 'Slack User',
discordUser: 'Discord User',
@@ -2779,10 +2994,19 @@ export default {
loading: 'Loading...',
pageSize: 'Items Per Page',
pageInfo: '{begin} - {end} / {total}',
aiRedoDisabled: 'Please enable the AI assistant in system settings first',
aiRedoQueued: 'Assistant organize task submitted: {title}',
aiRedoFailed: 'Failed to submit assistant organize task',
actions: {
aiRedo: 'Assistant Organize',
aiRedoPending: 'Assistant Organizing...',
batchAiRedo: 'Assistant Batch Organize',
redo: 'Reorganize',
delete: 'Delete',
batchRedo: 'Batch Reorganize',
batchDelete: 'Batch Delete',
},
batchOperationTitle: 'Batch Operation',
progress: {
processing: 'Processing',
pleaseWait: 'Please wait...',
@@ -2840,8 +3064,10 @@ export default {
rtorrentHostHint: 'HTTP: http://ip:port/RPC2 or SCGI: scgi://ip:port',
default: 'Default',
host: 'Host',
apiKey: 'API Key',
username: 'Username',
password: 'Password',
qbittorrentApiKeyHint: 'For qBittorrent 5.2+, you can use the WebUI API Key directly. When set, API Key auth is preferred.',
category: 'Auto Category Management',
sequentail: 'Sequential Download',
force_resume: 'Force Resume',
@@ -3170,6 +3396,8 @@ export default {
saveMediaServerSettingsFailed: 'Failed to save media server settings',
notificationSettingsSaved: 'Notification settings saved successfully',
saveNotificationSettingsFailed: 'Failed to save notification settings',
saveSiteAuthSettingsFailed: 'Failed to save user site authentication settings: {message}',
saveAgentSettingsFailed: 'Failed to save AI assistant settings',
preferenceSettingsSaved: 'Preference settings saved successfully',
savePreferenceSettingsFailed: 'Failed to save preference settings',
passwordUpdateSuccess: 'Password updated successfully',
@@ -3191,6 +3419,18 @@ export default {
confirmPasswordHint: 'Confirm new password',
apiTokenRequired: 'API Token is required',
},
siteAuth: {
title: 'User Authentication',
description: 'Configure site authentication and auxiliary authentication',
info: 'User Site Authentication',
infoDesc:
'Completing site authentication unlocks site capabilities and some plugin permissions. This step is optional and can also be configured later from the user menu.',
selectSiteHint: 'Choose a supported auth site and fill in the required credentials for that site',
submitHint:
'When you click Next, the wizard will immediately validate against the selected auth site and save the current parameters on success.',
siteConfigNotExist: 'Authentication site configuration does not exist',
fieldRequired: 'Please enter {name}',
},
storage: {
title: 'Storage',
description: 'Configure download directory and media library directory',
@@ -3224,12 +3464,13 @@ export default {
description: 'Configure media server',
info: 'Media Server Configuration',
infoDesc:
'Configure media server for media library management, can choose Emby, Jellyfin, Plex, TrimeMedia or Ugreen.',
'Configure media server for media library management, can choose Emby, ZSpace, Jellyfin, Plex, TrimeMedia or Ugreen.',
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',
zspaceConfig: 'ZSpace Configuration',
jellyfinConfig: 'Jellyfin Configuration',
plexConfig: 'Plex Configuration',
host: 'Server Address',
@@ -3245,6 +3486,7 @@ export default {
typeHint: 'Select the type of notification channel to use',
name: 'Notification Name',
nameHint: 'Set a name for the notification channel',
feishuConfig: 'Feishu Configuration',
telegramConfig: 'Telegram Configuration',
emailConfig: 'Email Configuration',
botToken: 'Bot Token',
@@ -3255,6 +3497,19 @@ export default {
senderPassword: 'Sender Password',
receiverEmail: 'Receiver Email',
},
agent: {
title: 'AI Assistant',
description: 'Configure the Agent assistant and LLM parameters',
info: 'AI Assistant Configuration',
infoDesc:
'After enabling it, you can use the Agent in message conversations and optionally turn on transfer-failure takeover and AI recommendations.',
providerRequired: 'LLM provider is required',
apiKeyRequired: 'LLM API key is required',
authOrApiKeyRequired: 'Provide an LLM API key or complete provider authorization first',
modelRequired: 'LLM model name is required',
maxContextTokensRequired: 'LLM max context tokens must be greater than 0',
recommendMaxItemsRequired: 'AI recommendation analysis limit must be greater than 0',
},
preferences: {
title: 'Resource Preferences',
description: 'Set resource download preferences',

View File

@@ -74,6 +74,9 @@ export default {
descending: '降序',
versionMismatch: '浏览器缓存版本与服务端版本不一致,请尝试清除缓存',
clearCache: '清除缓存',
sortMode: '排序模式',
sortModeHint: '已进入拖拽排序模式',
exit: '退出',
},
mediaType: {
movie: '电影',
@@ -90,6 +93,7 @@ export default {
mediaServer: '媒体服务器',
manual: '手动处理',
plugin: '插件',
agent: '智能体',
other: '其它',
},
actionStep: {
@@ -145,6 +149,8 @@ export default {
transparencyAdjust: '透明度调整',
transparencyOpacity: '透明度',
transparencyBlur: '模糊度',
backgroundPosterOpacity: '背景透明度',
backgroundBlur: '背景磨砂效果',
transparencyReset: '重置',
transparencyLow: '低透明度',
transparencyMedium: '中等透明度',
@@ -256,6 +262,7 @@ export default {
serverError: '登录失败,服务器错误!',
loginFailed: '登录失败',
secondaryVerification: '二次验证',
orDivider: '或',
loginWithPasskey: '使用通行密钥登录',
loginWithOtp: '使用验证码登录',
orUsePasskey: '或使用通行密钥进行验证',
@@ -314,7 +321,7 @@ export default {
settingTabs: {
system: {
title: '系统',
description: '基础设置、下载器Qbittorrent、Transmission、媒体服务器Emby、Jellyfin、Plex、飞牛影视、绿联影视',
description: '基础设置、下载器Qbittorrent、Transmission、媒体服务器Emby、极影视、Jellyfin、Plex、飞牛影视、绿联影视',
},
directory: {
title: '存储 & 目录',
@@ -346,7 +353,7 @@ export default {
},
notification: {
title: '通知',
description: '通知渠道(微信、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息发送范围',
description: '通知渠道(企业微信、微信 ClawBot、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息发送范围',
},
about: {
title: '关于',
@@ -463,6 +470,60 @@ export default {
adminsHint: '可使用管理菜单及命令的用户ID列表多个ID使用,分隔',
adminsPlaceholder: '用户ID列表多个ID使用,分隔',
},
wechatclawbot: {
name: '微信 ClawBot',
baseUrl: 'iLink 地址',
baseUrlHint: '微信 ClawBot iLink 服务地址,通常使用默认值',
defaultTarget: '默认通知目标',
defaultTargetHint: '可填写用户 userid不填则默认发给已互动用户',
defaultTargetPlaceholder: '用户 userid可选',
admins: '管理员白名单',
adminsHint: '允许执行斜杠命令的用户ID列表多个ID使用,分隔',
adminsPlaceholder: '用户ID列表多个ID使用,分隔',
pollTimeout: '轮询超时(秒)',
pollTimeoutHint: '长轮询请求超时时间,建议 20-30 秒',
loginStatus: '登录状态',
connected: '已连接',
waiting: '等待扫码',
scanned: '已扫码,待确认',
confirmed: '已确认,正在建立连接',
expired: '二维码已过期',
refreshQrcode: '刷新二维码',
logout: '退出登录',
noQrcode: '暂无二维码,请先刷新或保存配置后重试',
scanHint: '使用微信扫码绑定后,状态会自动刷新。首次使用请先保存并启用该通知渠道。',
accountId: '账号ID',
qrcodeUpdatedAt: '二维码更新时间',
knownTargets: '最近互动用户',
noKnownTargets: '暂无互动用户记录',
statusLoadFailed: '获取微信 ClawBot 状态失败',
qrcodeRefreshSuccess: '微信 ClawBot 二维码已刷新',
qrcodeRefreshFailed: '刷新微信 ClawBot 二维码失败',
logoutSuccess: '微信 ClawBot 已退出登录',
logoutFailed: '微信 ClawBot 退出登录失败',
},
feishu: {
name: '飞书',
appId: 'App ID',
appIdHint: '飞书开放平台应用的 App ID',
appIdRequired: 'App ID 不能为空',
appSecret: 'App Secret',
appSecretHint: '飞书开放平台应用的 App Secret',
appSecretRequired: 'App Secret 不能为空',
openId: '默认用户 Open ID',
openIdHint: '默认通知接收用户的 Open ID留空则优先使用互动用户',
openIdPlaceholder: 'ou_xxx',
chatId: '默认群聊 Chat ID',
chatIdHint: '默认通知接收群聊的 Chat ID和 Open ID 二选一即可',
chatIdPlaceholder: 'oc_xxx',
admins: '管理员白名单',
adminsHint: '允许执行命令和管理操作的 Open ID 列表,多个使用 , 分隔',
adminsPlaceholder: 'Open ID 列表,多个使用 , 分隔',
verificationToken: 'Verification Token',
verificationTokenHint: '飞书事件订阅的 Verification Token启用事件校验时填写',
encryptKey: 'Encrypt Key',
encryptKeyHint: '飞书事件订阅的 Encrypt Key启用消息加密时填写',
},
telegram: {
name: 'Telegram',
token: 'Bot Token',
@@ -878,6 +939,7 @@ export default {
plex: 'Plex',
jellyfin: 'Jellyfin',
emby: 'Emby',
zspace: '极影视',
appLaunchFailed: 'APP启动失败正在跳转到网页版',
appNotInstalled: '未检测到APP正在跳转到网页版',
downloadApp: '下载APP',
@@ -916,6 +978,8 @@ export default {
ranking: '排名',
noStatisticsData: '暂无分享统计数据',
bestVersion: '洗版中',
bestVersionEpisodeShort: '分集',
bestVersionWholeShort: '全集',
completed: '订阅完成',
subscribing: '订阅中',
notStarted: '未开始',
@@ -991,6 +1055,7 @@ export default {
aiRecommend: '智能推荐',
reRecommend: '重新生成推荐',
aiRecommendError: '智能推荐失败',
refreshSearch: '重新搜索',
},
browse: {
actor: '演员',
@@ -1226,6 +1291,17 @@ export default {
content: '内容',
refreshing: '正在刷新',
initializing: '正在初始化',
searchPlaceholder: '搜索日志内容',
allLevels: '全部级别',
followTail: '跟随最新日志',
wrapLines: '自动换行',
pauseStream: '暂停日志流',
resumeStream: '恢复日志流',
waitingForLogs: '等待日志输出...',
paused: '已暂停',
connected: '实时更新中',
lineCount: '显示 {visible}/{total} 行',
jumpToLatest: '查看最新 ({count})',
},
moduleTest: {
normal: '正常',
@@ -1315,10 +1391,31 @@ export default {
aiAgent: '启用智能助手',
aiAgentEnable: '启用智能助手',
aiAgentEnableHint: '启用后可使用智能助手功能需要配置LLM相关参数',
aiAgentSectionTitle: '智能助手配置',
aiAgentSectionDesc: '启用后可在消息会话中使用 Agent 能力,也可开启失败整理接管和智能推荐。',
llmProvider: 'LLM提供商',
llmProviderHint: '选择使用的LLM服务提供商',
llmModel: 'LLM模型名称',
llmModelHint: '指定使用的LLM模型gpt-3.5-turbo、deepseek-chat等',
llmModelHint: '指定使用的LLM模型deepseek-v4-flash、gpt-5.4等',
llmModelResolvedHint: '已根据模型目录自动回填最大上下文为 {context}K来源{source}',
llmThinking: '思考模式 / 深度',
llmThinkingHint:
'思考深度off/auto/minimal/low/medium/high/max/xhigh不支持的级别会按 provider 能力自动映射到最近值',
llmThinkingLevelOff: '关闭 (off)',
llmThinkingLevelAuto: '自动 (auto)',
llmThinkingLevelMinimal: '最小 (minimal)',
llmThinkingLevelLow: '低 (low)',
llmThinkingLevelMedium: '中 (medium)',
llmThinkingLevelHigh: '高 (high)',
llmThinkingLevelMax: '极高 (max)',
llmThinkingLevelXhigh: '超高 (xhigh)',
llmSupportImageInput: '模型支持图片输入',
llmSupportImageInputHint:
'启用后,消息中的图片会按多模态图片发送给 LLM关闭后图片会作为附件保存到本地并将文件路径提供给智能助手处理',
llmSupportAudioInput: '支持音频输入',
llmSupportAudioInputHint: '启用后,智能助手会将用户发送的音频消息转写为文字再处理',
llmSupportAudioOutput: '支持音频输出',
llmSupportAudioOutputHint: '启用后,智能助手可以在支持的渠道上发送语音回复',
llmMaxContextTokens: 'LLM 最大上下文 Token 数量 (K)',
llmMaxContextTokensHint:
'设定 LLM 记录会话历史的最大 Token 数量上限(千),超出后将自动修整历史记录以节省 Token 消耗及防止超出 LLM 限制',
@@ -1327,6 +1424,45 @@ export default {
llmApiKeyPlaceholder: '请输入API密钥',
llmBaseUrl: 'LLM基础URL',
llmBaseUrlHint: 'LLM API的基础URL地址用于自定义API端点',
llmProviderAuth: '提供商授权',
llmProviderAuthHint: '支持账号登录授权的提供商,可以直接在这里完成登录并复用授权状态。',
llmProviderConnectedAs: '当前已连接:{label}',
llmProviderDisconnect: '断开授权',
llmProviderDisconnected: '已断开提供商授权',
llmProviderAuthDialogTitle: '提供商授权',
llmProviderPopupBlocked: '浏览器拦截了授权窗口,请手动点击下方按钮继续。',
llmProviderDeviceCode: '设备码',
llmProviderOpenAuthPage: '打开授权页面',
llmProviderCheckAuthStatus: '检查授权状态',
audioInputProvider: '音频输入提供商',
audioInputProviderHint: '用于识别用户音频消息的服务,支持 OpenAI 音频接口、Chat Audio 兼容接口和 Xiaomi MiMo',
audioProviderOpenAiAudio: 'OpenAI Audio 兼容',
audioProviderChatAudio: 'Chat Audio 兼容',
audioProviderMimo: '小米 MiMo',
audioInputApiKey: '音频输入 API密钥',
audioInputApiKeyHint: '音频输入转写使用的 API 密钥',
audioInputBaseUrl: '音频输入基础URL',
audioInputBaseUrlHint: '音频输入接口基础URLChat Audio 类服务可填写对应兼容地址MiMo 默认 https://api.xiaomimimo.com/v1',
audioInputModel: '音频输入模型',
audioInputModelHint: '用于将音频内容转换为文字的模型名称',
audioInputLanguage: '识别语言',
audioInputLanguageHint: '音频转写默认语言,例如 zh、en留空时按后端默认处理',
audioOutputProvider: '音频输出提供商',
audioOutputProviderHint: '用于生成语音回复的服务,支持 OpenAI 音频接口、Chat Audio 兼容接口和 Xiaomi MiMo',
audioOutputApiKey: '音频输出 API密钥',
audioOutputApiKeyHint: '文字转语音使用的 API 密钥',
audioOutputBaseUrl: '音频输出基础URL',
audioOutputBaseUrlHint: '音频输出接口基础URLChat Audio 类服务可填写对应兼容地址MiMo 默认 https://api.xiaomimimo.com/v1',
audioOutputModel: '音频输出模型',
audioOutputModelHint: '用于将文字内容转换为语音的模型名称',
audioOutputVoice: '语音音色',
audioOutputVoiceHint: '语音合成使用的发音人或音色标识',
audioOutputIncludeText: '语音回复附带文字',
audioOutputIncludeTextHint: '发送语音回复时,同时附带一份文字内容',
llmTestAction: '测试调用',
llmTestSuccessToast: 'LLM 调用测试成功',
llmTestFailedToast: 'LLM 调用测试失败',
llmTestFailedToastWithMessage: 'LLM 调用测试失败:{message}',
aiAgentGlobal: '全局智能助手',
aiAgentGlobalHint: '启用全局智能助手功能,所有消息对话均使用智能体回答而不用使用/ai命令',
aiAgentJobInterval: '定时唤醒',
@@ -1345,6 +1481,9 @@ export default {
advancedSettingsDesc: '系统进阶设置,特殊情况下才需要调整',
downloaders: '下载器',
downloadersDesc: '只有默认下载器才会被默认使用。',
aiAgentRetryTransfer: '文件整理失败智能接管',
aiAgentRetryTransferHint:
'启用后当文件整理失败时智能助手将自动接管并尝试重新整理利用AI能力解决识别和匹配问题',
aiRecommendEnabled: '搜索结果智能推荐',
aiRecommendEnabledHint:
'启用搜索结果智能推荐功能,开启后将在搜索结果页面显示智能推荐按钮,可根据用户偏好智能推荐资源',
@@ -1360,6 +1499,7 @@ export default {
media: '媒体',
network: '网络',
log: '日志',
data: '数据',
lab: '实验室',
downloaderSaveSuccess: '下载器设置保存成功',
downloaderSaveFailed: '下载器设置保存失败!',
@@ -1377,6 +1517,7 @@ export default {
transmission: 'Transmission',
rtorrent: 'rTorrent',
emby: 'Emby',
zspace: '极影视',
jellyfin: 'Jellyfin',
plex: 'Plex',
ugreen: '绿联影视',
@@ -1421,6 +1562,8 @@ export default {
fanartLangHint: '设置Fanart图片的语言偏好多选时按优先级顺序排列',
recognizePluginFirst: "优先使用插件识别",
recognizePluginFirstHint: "优先调用插件识别媒体信息,若插件命中则不再调用原生识别",
mediaRecognizeShare: '共享使用媒体识别数据',
mediaRecognizeShareHint: '识别成功后上报关键字与媒体ID识别失败时优先回查共享识别结果',
githubProxy: 'Github加速代理',
githubProxyPlaceholder: '留空表示不使用代理',
githubProxyHint: '使用代理加速Github访问速度',
@@ -1449,8 +1592,23 @@ export default {
logBackupCountMin: '日志文件最大备份数量必须大于等于1',
logFileFormat: '日志文件格式',
logFileFormatHint: '设置日志文件的输出格式,用于自定义日志的显示内容',
dataCleanupEnable: '启用数据清理',
dataCleanupEnableHint: '总开关关闭时将跳过定时数据清理任务',
dataCleanupDaysRequired: '请输入清理周期',
dataCleanupDaysMin: '清理周期必须大于等于0',
dataCleanupMessageDays: '消息表保留天数',
dataCleanupMessageDaysHint: '单位0 表示不清理消息表数据',
dataCleanupDownloadHistoryDays: '下载历史表保留天数',
dataCleanupDownloadHistoryDaysHint: '单位0 表示不清理下载历史及其关联的下载文件孤儿记录',
dataCleanupSiteUserDataDays: '站点数据表保留天数',
dataCleanupSiteUserDataDaysHint: '单位0 表示不清理站点用户数据表',
dataCleanupTransferHistoryDays: '整理历史表保留天数',
dataCleanupTransferHistoryDaysHint: '单位0 表示不清理整理历史表',
downloadFilesCleanupNotice: '下载文件表没有独立时间字段,会跟随下载历史表的保留周期清理其孤儿记录。',
pluginAutoReload: '插件热加载',
pluginAutoReloadHint: '修改插件文件后自动重新加载,开发插件时使用',
pluginLocalRepoPaths: '本地插件仓库路径',
pluginLocalRepoPathsHint: '本地插件仓库目录,多个目录用英文逗号分隔,支持相对路径和绝对路径',
encodingDetectionPerformanceMode: '编码探测性能模式',
encodingDetectionPerformanceModeHint: '优先提升探测效率,但可能降低编码探测的准确性',
transferThreads: '文件整理线程数',
@@ -1490,6 +1648,7 @@ export default {
},
mb: 'MB',
hour: '小时',
day: '天',
customizeWallpaperApi: '自定义壁纸API地址',
customizeWallpaperApiHint: '会获取API返回内容中所有允许的安全域名地址的图片需要同步设置安全域名地址',
customizeWallpaperApiRequired: '必填项请输入自定义壁纸API',
@@ -1616,7 +1775,9 @@ export default {
timeSaveSuccess: '通知发送时间保存成功',
timeSaveFailed: '通知发送时间保存失败!',
channel: '通知',
wechat: '微信',
wechat: '企业微信',
wechatClawBot: '微信 ClawBot',
feishu: '飞书',
resourceDownload: '资源下载',
mediaImport: '整理入库',
subscription: '订阅',
@@ -1694,7 +1855,7 @@ export default {
tvCategory: '电视剧',
animeCategory: '动漫',
downloadUser: '远程搜索自动下载用户',
downloadUserHint: '使用Telegram、微信等搜索时是否自动下载使用逗号分割设置为 all 代表所有用户自动择优下载',
downloadUserHint: '使用Telegram、企业微信等搜索时是否自动下载,使用逗号分割,设置为 all 代表所有用户自动择优下载',
multipleNameSearch: '多名称资源搜索',
multipleNameSearchHint: '使用多个名称(中文、英文等)搜索站点资源并合并搜索结果,会增加站点访问频率',
downloadSubtitle: '下载站点字幕',
@@ -1934,7 +2095,8 @@ export default {
resetDefaultAvatar: '重置默认头像',
restoreCurrentAvatar: '还原当前头像',
notifications: '通知',
wechat: '微信ID',
wechat: '企业微信ID',
wechatClawBot: '微信 ClawBot ID',
telegram: 'Telegram ID',
slack: 'Slack ID',
discord: 'Discord ID',
@@ -1975,7 +2137,7 @@ export default {
},
searchBar: {
search: '搜索',
searchPlaceholder: '搜索功能、订阅、设置...',
searchPlaceholder: '搜索电影、剧集以及更多...',
recentSearches: '最近搜索',
noRecentSearches: '没有最近搜索记录',
functions: '功能',
@@ -1995,6 +2157,9 @@ export default {
searchInSites: '在站点中搜索种子资源',
relatedResources: '相关资源',
searchTip: '可搜索电影、电视剧、演员、资源等',
emptySearchHint: '输入关键字开始搜索',
escClose: '关闭',
openSearch: '打开搜索',
},
searchSite: {
selectSites: '选择站点',
@@ -2208,6 +2373,10 @@ export default {
repoUrl: '插件仓库地址',
repoPlaceholder: '格式https://github.com/jxxghp/MoviePilot-Plugins/,https://github.com/xxxx/xxxxxx/',
repoHint: '多个地址使用换行分隔仅支持Github仓库',
urlPlaceholder: '输入插件仓库地址',
noRepos: '暂无插件仓库地址',
invalidUrl: '请输入有效的URL地址',
duplicateUrl: '该地址已存在',
close: '关闭',
save: '保存',
saveSuccess: '插件仓库保存成功',
@@ -2319,6 +2488,29 @@ export default {
scrapeHint: '整理完成后自动刮削元数据',
fromHistoryOption: '复用历史识别信息',
fromHistoryHint: '使用历史整理记录中已识别的媒体信息',
previewTitle: '整理结果预览',
previewSubtitle: '点击“预览”后可查看本次整理的预计入库结果,不会实际改动文件',
previewResult: '预览',
previewLoading: '正在生成预览结果...',
previewRequestFailed: '预览请求失败',
previewTotal: '总数 {count}',
previewSuccess: '成功 {count}',
previewFailed: '失败 {count}',
previewMediaInfo: '媒体信息',
previewMediaName: '名称',
previewMediaType: '类型',
previewSeasonInfo: '季信息',
previewSeasonLabel: '季',
previewEpisodeCount: '总集数',
previewAfterColumn: '整理后',
previewBeforeColumn: '整理前',
previewFileNameColumn: '文件名',
previewEmptyTitle: '尚未生成预览',
previewEmptyDescription: '点击“预览”按钮后,在这里查看整理结果预览。',
noPreviewData: '暂无预览结果',
noFailedPreviewData: '当前没有失败项',
copySuccess: '路径已复制',
copyFailed: '复制失败',
addToQueue: '加入整理队列',
reorganizeNow: '立即整理',
auto: '自动',
@@ -2353,8 +2545,10 @@ export default {
savePathHint: '指定该订阅的下载保存路径,留空自动使用设定的下载目录',
bestVersion: '洗版',
bestVersionHint: '根据洗版优先级进行洗版订阅',
bestVersionFull: '全集洗版',
bestVersionFullHint: '只下载覆盖全集的整包资源,不按单集拆包下载',
searchImdbid: '使用 ImdbID 搜索',
searchImdbidHint: '开使用 ImdbID 精确搜索资源',
searchImdbidHint: '开启后使用 ImdbID 精确搜索资源',
showEditDialog: '订阅时编辑更多规则',
showEditDialogHint: '添加订阅时显示此编辑订阅对话框',
include: '包含(关键字、正则式)',
@@ -2502,6 +2696,7 @@ export default {
close: '关闭',
loadingDirectoryStructure: '加载目录结构...',
reorganize: '整理',
filterPlaceholder: '搜索(支持 * ? 通配符)',
},
person: {
alias: '别名:',
@@ -2558,6 +2753,7 @@ export default {
settings: '设置',
projectHome: '项目主页',
updateHistory: '更新说明',
local: '本地',
installToLocal: '安装到本地',
totalDownloads: '共 {count} 次下载',
viewData: '查看数据',
@@ -2645,7 +2841,9 @@ export default {
nickname: '昵称',
nicknamePlaceholder: '显示昵称,优先于用户名显示',
accountBinding: '账号绑定',
wechatUser: '微信用户',
wechatUser: '企业微信用户',
wechatClawBotUser: '微信 ClawBot 用户',
feishuUser: '飞书用户',
telegramUser: 'Telegram用户',
slackUser: 'Slack用户',
discordUser: 'Discord用户',
@@ -2741,10 +2939,19 @@ export default {
loading: '加载中...',
pageSize: '每页条数',
pageInfo: '{begin} - {end} / {total}',
aiRedoDisabled: '请先在系统设置中启用 AI 智能助手',
aiRedoQueued: '已提交智能助手整理任务:{title}',
aiRedoFailed: '提交智能助手整理任务失败',
actions: {
aiRedo: '智能助手整理',
aiRedoPending: '智能助手整理中...',
batchAiRedo: '智能助手批量整理',
redo: '重新整理',
delete: '删除',
batchRedo: '批量重新整理',
batchDelete: '批量删除',
},
batchOperationTitle: '批量操作',
progress: {
processing: '处理中',
pleaseWait: '请稍候...',
@@ -2802,8 +3009,10 @@ export default {
rtorrentHostHint: 'HTTP: http://ip:port/RPC2 或 SCGI: scgi://ip:port',
default: '默认',
host: '地址',
apiKey: 'API Key',
username: '用户名',
password: '密码',
qbittorrentApiKeyHint: 'qBittorrent 5.2+ 可直接使用 WebUI API Key填写后将优先使用 API Key 登录。',
category: '自动分类管理',
sequentail: '顺序下载',
force_resume: '强制继续',
@@ -3131,6 +3340,8 @@ export default {
saveMediaServerSettingsFailed: '保存媒体服务器设置失败',
notificationSettingsSaved: '通知设置保存成功',
saveNotificationSettingsFailed: '保存通知设置失败',
saveSiteAuthSettingsFailed: '保存用户站点认证设置失败:{message}',
saveAgentSettingsFailed: '保存智能助手设置失败',
preferenceSettingsSaved: '偏好设置保存成功',
savePreferenceSettingsFailed: '保存偏好设置失败',
passwordUpdateSuccess: '密码更新成功',
@@ -3152,6 +3363,16 @@ export default {
confirmPasswordHint: '确认新密码',
apiTokenRequired: 'API Token不能为空',
},
siteAuth: {
title: '用户认证',
description: '配置用户站点认证与辅助认证',
info: '用户站点认证说明',
infoDesc: '完成站点认证后可解锁站点能力与部分插件权限。此步骤可选,后续也可在个人菜单中继续配置。',
selectSiteHint: '选择一个支持认证的站点,并填写该站点要求的认证参数',
submitHint: '点击下一步时将立即向认证站点发起校验,认证成功后会保存当前参数。',
siteConfigNotExist: '认证站点配置不存在',
fieldRequired: '请输入{name}',
},
storage: {
title: '存储',
description: '配置下载目录和媒体库目录',
@@ -3184,12 +3405,13 @@ export default {
title: '媒体服务器',
description: '配置媒体服务器',
info: '媒体服务器配置说明',
infoDesc: '配置媒体服务器用于媒体库管理可选择Emby、Jellyfin、Plex、飞牛影视或绿联影视',
infoDesc: '配置媒体服务器用于媒体库管理可选择Emby、极影视、Jellyfin、Plex、飞牛影视或绿联影视',
type: '媒体服务器类型',
typeHint: '选择要使用的媒体服务器类型',
name: '服务器名称',
nameHint: '为媒体服务器设置一个名称',
embyConfig: 'Emby 配置',
zspaceConfig: '极影视 配置',
jellyfinConfig: 'Jellyfin 配置',
plexConfig: 'Plex 配置',
host: '服务器地址',
@@ -3205,6 +3427,7 @@ export default {
typeHint: '选择要使用的通知渠道类型',
name: '通知名称',
nameHint: '为通知渠道设置一个名称',
feishuConfig: '飞书配置',
telegramConfig: 'Telegram 配置',
emailConfig: '邮件配置',
botToken: '机器人令牌',
@@ -3215,6 +3438,18 @@ export default {
senderPassword: '发送密码',
receiverEmail: '接收邮箱',
},
agent: {
title: '智能助手',
description: '配置 Agent 助手与 LLM 参数',
info: '智能助手配置说明',
infoDesc: '启用后可在消息会话中使用 Agent 能力,也可开启失败整理接管和智能推荐。',
providerRequired: 'LLM 提供商不能为空',
apiKeyRequired: 'LLM API 密钥不能为空',
authOrApiKeyRequired: '请填写 LLM API 密钥或先完成提供商授权',
modelRequired: 'LLM 模型名称不能为空',
maxContextTokensRequired: 'LLM 最大上下文 Token 数量必须大于 0',
recommendMaxItemsRequired: '智能推荐分析条目上限必须大于 0',
},
preferences: {
title: '资源偏好',
description: '设置资源下载偏好',
@@ -3257,7 +3492,3 @@ export default {
},
},
}
// Apply patch to add category strings
// This is a temporary placeholder command to show intent.
// I will use replace_file_content to actually edit the file safely.

View File

@@ -74,6 +74,9 @@ export default {
descending: '降序',
versionMismatch: '瀏覽器快取版本與服務端版本不一致,請嘗試清除快取',
clearCache: '清除快取',
sortMode: '排序模式',
sortModeHint: '已進入拖拽排序模式',
exit: '退出',
},
mediaType: {
movie: '電影',
@@ -90,6 +93,7 @@ export default {
mediaServer: '媒體伺服器',
manual: '手動處理',
plugin: '插件',
agent: '智能體',
other: '其它',
},
actionStep: {
@@ -145,6 +149,8 @@ export default {
transparencyAdjust: '透明度調整',
transparencyOpacity: '透明度',
transparencyBlur: '模糊度',
backgroundPosterOpacity: '背景透明度',
backgroundBlur: '背景磨砂效果',
transparencyReset: '重置',
transparencyLow: '低透明度',
transparencyMedium: '中等透明度',
@@ -256,6 +262,7 @@ export default {
noPermission: '登錄失敗,您沒有任何功能權限,請聯繫管理員!',
loginFailed: '登錄失敗',
secondaryVerification: '二次驗證',
orDivider: '或',
loginWithPasskey: '使用通行密鑰登錄',
loginWithOtp: '使用驗證碼登錄',
orUsePasskey: '或使用通行密鑰進行驗證',
@@ -314,7 +321,8 @@ export default {
settingTabs: {
system: {
title: '系統',
description: '基礎設置、下載器Qbittorrent、Transmission、媒體服務器Emby、Jellyfin、Plex、飛牛影視、綠聯影視',
description:
'基礎設置、下載器Qbittorrent、Transmission、媒體服務器Emby、極影視、Jellyfin、Plex、飛牛影視、綠聯影視',
},
directory: {
title: '存儲 & 目錄',
@@ -346,7 +354,7 @@ export default {
},
notification: {
title: '通知',
description: '通知渠道(微信、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息發送範圍',
description: '通知渠道(企業微信、微信 ClawBot、Telegram、Slack、SynologyChat、VoceChat、WebPush、消息發送範圍',
},
about: {
title: '關於',
@@ -463,6 +471,60 @@ export default {
adminsHint: '可使用管理菜單及命令的用戶ID列表多個ID使用,分隔',
adminsPlaceholder: '用戶ID列表多個ID使用,分隔',
},
wechatclawbot: {
name: '微信 ClawBot',
baseUrl: 'iLink 地址',
baseUrlHint: '微信 ClawBot iLink 服務地址,通常使用預設值',
defaultTarget: '預設通知目標',
defaultTargetHint: '可填寫使用者 userid不填則預設發給已互動使用者',
defaultTargetPlaceholder: '使用者 userid可選',
admins: '管理員白名單',
adminsHint: '允許執行斜線命令的用戶ID列表多個ID使用,分隔',
adminsPlaceholder: '用戶ID列表多個ID使用,分隔',
pollTimeout: '輪詢超時(秒)',
pollTimeoutHint: '長輪詢請求超時時間,建議 20-30 秒',
loginStatus: '登入狀態',
connected: '已連線',
waiting: '等待掃碼',
scanned: '已掃碼,待確認',
confirmed: '已確認,正在建立連線',
expired: '二維碼已過期',
refreshQrcode: '刷新二維碼',
logout: '退出登入',
noQrcode: '暫無二維碼,請先刷新或保存配置後再試',
scanHint: '使用微信掃碼綁定後,狀態會自動刷新。首次使用請先保存並啟用該通知渠道。',
accountId: '帳號ID',
qrcodeUpdatedAt: '二維碼更新時間',
knownTargets: '最近互動用戶',
noKnownTargets: '暫無互動用戶記錄',
statusLoadFailed: '獲取微信 ClawBot 狀態失敗',
qrcodeRefreshSuccess: '微信 ClawBot 二維碼已刷新',
qrcodeRefreshFailed: '刷新微信 ClawBot 二維碼失敗',
logoutSuccess: '微信 ClawBot 已退出登入',
logoutFailed: '微信 ClawBot 退出登入失敗',
},
feishu: {
name: '飛書',
appId: 'App ID',
appIdHint: '飛書開放平台應用的 App ID',
appIdRequired: 'App ID 不能為空',
appSecret: 'App Secret',
appSecretHint: '飛書開放平台應用的 App Secret',
appSecretRequired: 'App Secret 不能為空',
openId: '預設用戶 Open ID',
openIdHint: '預設通知接收用戶的 Open ID留空則優先使用互動用戶',
openIdPlaceholder: 'ou_xxx',
chatId: '預設群聊 Chat ID',
chatIdHint: '預設通知接收群聊的 Chat ID和 Open ID 二選一即可',
chatIdPlaceholder: 'oc_xxx',
admins: '管理員白名單',
adminsHint: '允許執行命令與管理操作的 Open ID 列表,多個使用 , 分隔',
adminsPlaceholder: 'Open ID 列表,多個使用 , 分隔',
verificationToken: 'Verification Token',
verificationTokenHint: '飛書事件訂閱的 Verification Token啟用事件校驗時填寫',
encryptKey: 'Encrypt Key',
encryptKeyHint: '飛書事件訂閱的 Encrypt Key啟用消息加密時填寫',
},
telegram: {
name: 'Telegram',
token: 'Bot Token',
@@ -878,6 +940,7 @@ export default {
plex: 'Plex',
jellyfin: 'Jellyfin',
emby: 'Emby',
zspace: '極影視',
appLaunchFailed: 'APP啟動失敗正在跳轉到網頁版',
appNotInstalled: '未檢測到APP正在跳轉到網頁版',
downloadApp: '下載APP',
@@ -916,6 +979,8 @@ export default {
ranking: '排名',
noStatisticsData: '暫無分享統計數據',
bestVersion: '洗版中',
bestVersionEpisodeShort: '分集',
bestVersionWholeShort: '全集',
completed: '訂閱完成',
subscribing: '訂閱中',
notStarted: '未開始',
@@ -991,6 +1056,7 @@ export default {
aiRecommend: '智能推薦',
reRecommend: '重新生成推薦',
aiRecommendError: '智能推薦失敗',
refreshSearch: '重新搜尋',
},
browse: {
actor: '演員',
@@ -1227,6 +1293,17 @@ export default {
content: '內容',
refreshing: '正在刷新',
initializing: '正在初始化',
searchPlaceholder: '搜索日誌內容',
allLevels: '全部級別',
followTail: '跟隨最新日誌',
wrapLines: '自動換行',
pauseStream: '暫停日誌流',
resumeStream: '恢復日誌流',
waitingForLogs: '等待日誌輸出...',
paused: '已暫停',
connected: '實時更新中',
lineCount: '顯示 {visible}/{total} 行',
jumpToLatest: '查看最新 ({count})',
},
moduleTest: {
normal: '正常',
@@ -1316,10 +1393,31 @@ export default {
aiAgent: '啟用智能助手',
aiAgentEnable: '啟用智能助手',
aiAgentEnableHint: '啟用後可使用智能助手功能需要配置LLM相關參數',
aiAgentSectionTitle: '智能助手配置',
aiAgentSectionDesc: '啟用後可在消息對話中使用 Agent 能力,也可開啟失敗整理接管與智能推薦。',
llmProvider: 'LLM提供商',
llmProviderHint: '選擇使用的LLM服務提供商',
llmModel: 'LLM模型名稱',
llmModelHint: '指定使用的LLM模型gpt-3.5-turbo、deepseek-chat等',
llmModelHint: '指定使用的LLM模型deepseek-v4-flash、gpt-5.4等',
llmModelResolvedHint: '已根據模型目錄自動回填最大上下文為 {context}K來源{source}',
llmThinking: '思考模式 / 深度',
llmThinkingHint:
'思考深度off/auto/minimal/low/medium/high/max/xhigh不支援的級別會按 provider 能力自動映射到最近值',
llmThinkingLevelOff: '關閉 (off)',
llmThinkingLevelAuto: '自動 (auto)',
llmThinkingLevelMinimal: '最小 (minimal)',
llmThinkingLevelLow: '低 (low)',
llmThinkingLevelMedium: '中 (medium)',
llmThinkingLevelHigh: '高 (high)',
llmThinkingLevelMax: '極高 (max)',
llmThinkingLevelXhigh: '超高 (xhigh)',
llmSupportImageInput: '模型支援圖片輸入',
llmSupportImageInputHint:
'啟用後,消息中的圖片會按多模態圖片發送給 LLM關閉後圖片會作為附件保存到本地並將檔案路徑提供給智能助手處理',
llmSupportAudioInput: '支援音頻輸入',
llmSupportAudioInputHint: '啟用後,智能助手會將用戶發送的音頻消息轉寫為文字再處理',
llmSupportAudioOutput: '支援音頻輸出',
llmSupportAudioOutputHint: '啟用後,智能助手可以在支援的渠道上發送語音回覆',
llmMaxContextTokens: 'LLM 最大上下文 Token 數量 (K)',
llmMaxContextTokensHint:
'設定 LLM 記錄會話歷史的最大 Token 數量上限(千),超出後將自動修整歷史記錄以節省 Token 消耗及防止超出 LLM 限制',
@@ -1328,6 +1426,45 @@ export default {
llmApiKeyPlaceholder: '請輸入API密鑰',
llmBaseUrl: 'LLM基礎URL',
llmBaseUrlHint: 'LLM API的基礎URL地址用於自定義API端點',
llmProviderAuth: '提供商授權',
llmProviderAuthHint: '支援帳號登入授權的提供商,可以直接在這裡完成登入並重用授權狀態。',
llmProviderConnectedAs: '目前已連接:{label}',
llmProviderDisconnect: '斷開授權',
llmProviderDisconnected: '已斷開提供商授權',
llmProviderAuthDialogTitle: '提供商授權',
llmProviderPopupBlocked: '瀏覽器攔截了授權視窗,請手動點擊下方按鈕繼續。',
llmProviderDeviceCode: '設備碼',
llmProviderOpenAuthPage: '開啟授權頁面',
llmProviderCheckAuthStatus: '檢查授權狀態',
audioInputProvider: '音頻輸入提供商',
audioInputProviderHint: '用於識別用戶音頻消息的服務,支援 OpenAI 音頻接口、Chat Audio 兼容接口和 Xiaomi MiMo',
audioProviderOpenAiAudio: 'OpenAI Audio 兼容',
audioProviderChatAudio: 'Chat Audio 兼容',
audioProviderMimo: '小米 MiMo',
audioInputApiKey: '音頻輸入 API密鑰',
audioInputApiKeyHint: '音頻輸入轉寫使用的 API 密鑰',
audioInputBaseUrl: '音頻輸入基礎URL',
audioInputBaseUrlHint: '音頻輸入接口基礎URLChat Audio 類服務可填寫對應兼容地址MiMo 預設 https://api.xiaomimimo.com/v1',
audioInputModel: '音頻輸入模型',
audioInputModelHint: '用於將音頻內容轉換為文字的模型名稱',
audioInputLanguage: '識別語言',
audioInputLanguageHint: '音頻轉寫預設語言,例如 zh、en留空時按後端預設處理',
audioOutputProvider: '音頻輸出提供商',
audioOutputProviderHint: '用於生成語音回覆的服務,支援 OpenAI 音頻接口、Chat Audio 兼容接口和 Xiaomi MiMo',
audioOutputApiKey: '音頻輸出 API密鑰',
audioOutputApiKeyHint: '文字轉語音使用的 API 密鑰',
audioOutputBaseUrl: '音頻輸出基礎URL',
audioOutputBaseUrlHint: '音頻輸出接口基礎URLChat Audio 類服務可填寫對應兼容地址MiMo 預設 https://api.xiaomimimo.com/v1',
audioOutputModel: '音頻輸出模型',
audioOutputModelHint: '用於將文字內容轉換為語音的模型名稱',
audioOutputVoice: '語音音色',
audioOutputVoiceHint: '語音合成使用的發音人或音色標識',
audioOutputIncludeText: '語音回覆附帶文字',
audioOutputIncludeTextHint: '發送語音回覆時,同時附帶一份文字內容',
llmTestAction: '測試調用',
llmTestSuccessToast: 'LLM 調用測試成功',
llmTestFailedToast: 'LLM 調用測試失敗',
llmTestFailedToastWithMessage: 'LLM 調用測試失敗:{message}',
aiAgentGlobal: '全局智能助手',
aiAgentGlobalHint: '啟用全局智能助手功能,所有消息對話均使用智能體回答而不用使用/ai命令',
aiAgentJobInterval: '定時喚醒',
@@ -1346,6 +1483,9 @@ export default {
advancedSettingsDesc: '系統進階設置,特殊情況下才需要調整',
downloaders: '下載器',
downloadersDesc: '只有默認下載器才會被默認使用。',
aiAgentRetryTransfer: '檔案整理失敗智能接管',
aiAgentRetryTransferHint:
'啟用後當檔案整理失敗時智能助手將自動接管並嘗試重新整理利用AI能力解決識別和匹配問題',
aiRecommendEnabled: '搜索結果智能推薦',
aiRecommendEnabledHint:
'啟用搜索結果智能推薦功能,開啟後將在搜索結果頁面顯示智能推薦按鈕,可根據用戶偏好智能推薦資源',
@@ -1361,6 +1501,7 @@ export default {
media: '媒體',
network: '網絡',
log: '日誌',
data: '數據',
lab: '實驗室',
downloaderSaveSuccess: '下載器設置保存成功',
downloaderSaveFailed: '下載器設置保存失敗!',
@@ -1378,6 +1519,7 @@ export default {
transmission: 'Transmission',
rtorrent: 'rTorrent',
emby: 'Emby',
zspace: '極影視',
jellyfin: 'Jellyfin',
plex: 'Plex',
ugreen: '綠聯影視',
@@ -1420,8 +1562,10 @@ export default {
fanartEnableHint: '使用 fanart.tv 的圖片數據',
fanartLang: 'Fanart語言',
fanartLangHint: '設定Fanart圖片的語言偏好多選時按優先級順序排列',
recognizePluginFirst: "優先使用插件識別",
recognizePluginFirstHint: "優先調用插件識別媒體信息,若插件命中則不再調用原生識別",
recognizePluginFirst: '優先使用插件識別',
recognizePluginFirstHint: '優先調用插件識別媒體信息,若插件命中則不再調用原生識別',
mediaRecognizeShare: '共享使用媒體識別數據',
mediaRecognizeShareHint: '識別成功後上報關鍵字與媒體ID識別失敗時優先回查共享識別結果',
githubProxy: 'Github加速代理',
githubProxyPlaceholder: '留空表示不使用代理',
githubProxyHint: '使用代理加速Github訪問速度',
@@ -1450,8 +1594,23 @@ export default {
logBackupCountMin: '日誌文件最大備份數量必須大於等於1',
logFileFormat: '日誌文件格式',
logFileFormatHint: '設置日誌文件的輸出格式,用於自定義日誌的顯示內容',
dataCleanupEnable: '啟用數據清理',
dataCleanupEnableHint: '總開關關閉時將跳過定時數據清理任務',
dataCleanupDaysRequired: '請輸入清理週期',
dataCleanupDaysMin: '清理週期必須大於等於0',
dataCleanupMessageDays: '消息表保留天數',
dataCleanupMessageDaysHint: '單位0 表示不清理消息表數據',
dataCleanupDownloadHistoryDays: '下載歷史表保留天數',
dataCleanupDownloadHistoryDaysHint: '單位0 表示不清理下載歷史及其關聯的下載文件孤兒記錄',
dataCleanupSiteUserDataDays: '站點數據表保留天數',
dataCleanupSiteUserDataDaysHint: '單位0 表示不清理站點用戶數據表',
dataCleanupTransferHistoryDays: '整理歷史表保留天數',
dataCleanupTransferHistoryDaysHint: '單位0 表示不清理整理歷史表',
downloadFilesCleanupNotice: '下載文件表沒有獨立時間欄位,會跟隨下載歷史表的保留週期清理其孤兒記錄。',
pluginAutoReload: '插件熱加載',
pluginAutoReloadHint: '修改插件文件後自動重新加載,開發插件時使用',
pluginLocalRepoPaths: '本地插件倉庫路徑',
pluginLocalRepoPathsHint: '本地插件倉庫目錄,多個目錄用英文逗號分隔,支持相對路徑和絕對路徑',
encodingDetectionPerformanceMode: '編碼探測性能模式',
encodingDetectionPerformanceModeHint: '優先提升探測效率,但可能降低編碼探測的準確性',
transferThreads: '文件整理線程數',
@@ -1491,6 +1650,7 @@ export default {
},
mb: 'MB',
hour: '小時',
day: '天',
customizeWallpaperApi: '自定義壁紙API',
customizeWallpaperApiHint: '會獲取 API 返回內容中所有安全設置中允許的圖片地址,需要設置安全域名白名單',
customizeWallpaperApiRequired: '必填項請輸出自定義壁紙API',
@@ -1536,7 +1696,7 @@ export default {
skipDesc: '跳過刮削,不生成該文件',
missingOnlyDesc: '僅在缺失時刮削,已存在則保持不變',
overwriteDesc: '始終刮削,已存在則覆蓋',
}
},
},
site: {
siteSync: '站點同步',
@@ -1617,7 +1777,9 @@ export default {
timeSaveSuccess: '通知發送時間保存成功',
timeSaveFailed: '通知發送時間保存失敗!',
channel: '通知',
wechat: '微信',
wechat: '企業微信',
wechatClawBot: '微信 ClawBot',
feishu: '飛書',
resourceDownload: '資源下載',
mediaImport: '整理入庫',
subscription: '訂閱',
@@ -1703,7 +1865,7 @@ export default {
mediaSourceHint: '搜索媒體信息時使用的數據源以及排序',
filterRuleGroupHint: '搜索媒體信息時按選定的過濾規則組對結果進行過濾',
downloadUserPlaceholder: '用戶ID1,用戶ID2',
downloadUserHint: '使用Telegram、微信等搜索時是否自動下載使用逗號分割設置為 all 代表所有用戶自動擇優下載',
downloadUserHint: '使用Telegram、企業微信等搜索時是否自動下載,使用逗號分割,設置為 all 代表所有用戶自動擇優下載',
downloadLabelPlaceholder: 'MOVIEPILOT',
},
directory: {
@@ -1935,7 +2097,8 @@ export default {
resetDefaultAvatar: '重置默認頭像',
restoreCurrentAvatar: '還原當前頭像',
notifications: '通知',
wechat: '微信UserID',
wechat: '企業微信 UserID',
wechatClawBot: '微信 ClawBot ID',
telegram: 'Telegram UserID',
slack: 'Slack UserID',
discord: 'Discord UserID',
@@ -1976,7 +2139,7 @@ export default {
},
searchBar: {
search: '搜索',
searchPlaceholder: '搜索功能、訂閱、設置...',
searchPlaceholder: '搜索電影、劇集以及更多...',
recentSearches: '最近搜索',
noRecentSearches: '沒有最近搜索記錄',
functions: '功能',
@@ -1996,6 +2159,9 @@ export default {
searchInSites: '在站點中搜索種子資源',
relatedResources: '相關資源',
searchTip: '可搜索電影、電視劇、演員、資源等',
emptySearchHint: '輸入關鍵字開始搜索',
escClose: '關閉',
openSearch: '打開搜索',
},
searchSite: {
selectSites: '選擇站點',
@@ -2209,6 +2375,10 @@ export default {
repoUrl: '插件倉庫地址',
repoPlaceholder: '格式https://github.com/jxxghp/MoviePilot-Plugins/,https://github.com/xxxx/xxxxxx/',
repoHint: '多個地址使用换行分隔僅支援Github倉庫',
urlPlaceholder: '輸入插件倉庫地址',
noRepos: '暫無插件倉庫地址',
invalidUrl: '請輸入有效的URL地址',
duplicateUrl: '該地址已存在',
close: '關閉',
save: '儲存',
saveSuccess: '插件倉庫儲存成功',
@@ -2320,6 +2490,29 @@ export default {
scrapeHint: '整理完成後自動刮削元數據',
fromHistoryOption: '復用歷史識別資訊',
fromHistoryHint: '使用歷史整理記錄中已識別的媒體資訊',
previewTitle: '整理結果預覽',
previewSubtitle: '點擊「預覽」後可查看本次整理的預計入庫結果,不會實際改動文件',
previewResult: '預覽',
previewLoading: '正在生成預覽結果...',
previewRequestFailed: '預覽請求失敗',
previewTotal: '總數 {count}',
previewSuccess: '成功 {count}',
previewFailed: '失敗 {count}',
previewMediaInfo: '媒體資訊',
previewMediaName: '名稱',
previewMediaType: '類型',
previewSeasonInfo: '季資訊',
previewSeasonLabel: '季',
previewEpisodeCount: '總集數',
previewAfterColumn: '整理後',
previewBeforeColumn: '整理前',
previewFileNameColumn: '文件名',
previewEmptyTitle: '尚未生成預覽',
previewEmptyDescription: '點擊「預覽」按鈕後,在這裡查看整理結果預覽。',
noPreviewData: '暫無預覽結果',
noFailedPreviewData: '目前沒有失敗項',
copySuccess: '路徑已複製',
copyFailed: '複製失敗',
addToQueue: '加入整理隊列',
reorganizeNow: '立即整理',
auto: '自動',
@@ -2354,6 +2547,8 @@ export default {
savePathHint: '指定該訂閱的下載儲存路徑,留空自動使用設定的下載目錄',
bestVersion: '洗版',
bestVersionHint: '根據洗版優先級進行洗版訂閱',
bestVersionFull: '全集洗版',
bestVersionFullHint: '只下載覆蓋全集的整包資源,不按單集拆包下載',
searchImdbid: '使用 ImdbID 搜索',
searchImdbidHint: '開使用 ImdbID 精確搜索資源',
showEditDialog: '訂閱時編輯更多規則',
@@ -2503,6 +2698,7 @@ export default {
close: '關閉',
loadingDirectoryStructure: '加載目錄結構...',
reorganize: '整理',
filterPlaceholder: '搜尋(支援 * ? 萬用字元)',
},
person: {
alias: '別名:',
@@ -2559,6 +2755,7 @@ export default {
settings: '設置',
projectHome: '項目主頁',
updateHistory: '更新說明',
local: '本地',
installToLocal: '安裝到本地',
totalDownloads: '共 {count} 次下載',
viewData: '查看數據',
@@ -2646,7 +2843,9 @@ export default {
nickname: '暱稱',
nicknamePlaceholder: '顯示暱稱,優先於用戶名顯示',
accountBinding: '賬號綁定',
wechatUser: '微信用戶',
wechatUser: '企業微信用戶',
wechatClawBotUser: '微信 ClawBot 用戶',
feishuUser: '飛書用戶',
telegramUser: 'Telegram用戶',
slackUser: 'Slack用戶',
discordUser: 'Discord用戶',
@@ -2742,10 +2941,19 @@ export default {
loading: '加載中...',
pageSize: '每頁條數',
pageInfo: '{begin} - {end} / {total}',
aiRedoDisabled: '請先在系統設置中啟用 AI 智能助手',
aiRedoQueued: '已提交智能助手整理任務:{title}',
aiRedoFailed: '提交智能助手整理任務失敗',
actions: {
aiRedo: '智能助手整理',
aiRedoPending: '智能助手整理中...',
batchAiRedo: '智能助手批量整理',
redo: '重新整理',
delete: '刪除',
batchRedo: '批量重新整理',
batchDelete: '批量刪除',
},
batchOperationTitle: '批量操作',
progress: {
processing: '處理中',
pleaseWait: '請稍候...',
@@ -2803,8 +3011,10 @@ export default {
enabled: '啟用',
default: '預設',
host: '地址',
apiKey: 'API Key',
username: '用戶名',
password: '密碼',
qbittorrentApiKeyHint: 'qBittorrent 5.2+ 可直接使用 WebUI API Key填寫後將優先使用 API Key 登入。',
category: '自動分類管理',
sequentail: '順序下載',
force_resume: '強制繼續',
@@ -3132,6 +3342,8 @@ export default {
saveMediaServerSettingsFailed: '保存媒體服務器設置失敗',
notificationSettingsSaved: '通知設置保存成功',
saveNotificationSettingsFailed: '保存通知設置失敗',
saveSiteAuthSettingsFailed: '保存用戶站點認證設置失敗:{message}',
saveAgentSettingsFailed: '保存智能助手設置失敗',
preferenceSettingsSaved: '偏好設置保存成功',
savePreferenceSettingsFailed: '保存偏好設置失敗',
passwordUpdateSuccess: '密碼更新成功',
@@ -3153,6 +3365,16 @@ export default {
confirmPasswordHint: '確認新密碼',
apiTokenRequired: 'API Token 不能為空',
},
siteAuth: {
title: '用戶認證',
description: '配置用戶站點認證與輔助認證',
info: '用戶站點認證說明',
infoDesc: '完成站點認證後可解鎖站點能力與部分插件權限。此步驟可選,後續也可在個人選單中繼續配置。',
selectSiteHint: '選擇一個支援認證的站點,並填寫該站點要求的認證參數',
submitHint: '點擊下一步時將立即向認證站點發起校驗,認證成功後會保存當前參數。',
siteConfigNotExist: '認證站點配置不存在',
fieldRequired: '請輸入{name}',
},
storage: {
title: '儲存',
description: '設定下載目錄和媒體庫目錄',
@@ -3185,12 +3407,13 @@ export default {
title: '媒體伺服器',
description: '設定媒體伺服器',
info: '媒體伺服器設定說明',
infoDesc: '設定媒體伺服器用於媒體庫管理可選擇Emby、Jellyfin、Plex、飛牛影視或綠聯影視',
infoDesc: '設定媒體伺服器用於媒體庫管理可選擇Emby、極影視、Jellyfin、Plex、飛牛影視或綠聯影視',
type: '媒體伺服器類型',
typeHint: '選擇要使用的媒體伺服器類型',
name: '伺服器名稱',
nameHint: '為媒體伺服器設定一個名稱',
embyConfig: 'Emby 設定',
zspaceConfig: '極影視 設定',
jellyfinConfig: 'Jellyfin 設定',
plexConfig: 'Plex 設定',
host: '伺服器位址',
@@ -3206,6 +3429,7 @@ export default {
typeHint: '選擇要使用的通知管道類型',
name: '通知名稱',
nameHint: '為通知管道設定一個名稱',
feishuConfig: '飛書設定',
telegramConfig: 'Telegram 設定',
emailConfig: '郵件設定',
botToken: '機器人權杖',
@@ -3216,6 +3440,18 @@ export default {
senderPassword: '發送密碼',
receiverEmail: '接收信箱',
},
agent: {
title: '智能助手',
description: '配置 Agent 助手與 LLM 參數',
info: '智能助手配置說明',
infoDesc: '啟用後可在消息對話中使用 Agent 能力,也可開啟失敗整理接管與智能推薦。',
providerRequired: 'LLM 提供商不能為空',
apiKeyRequired: 'LLM API 密鑰不能為空',
authOrApiKeyRequired: '請填寫 LLM API 密鑰或先完成提供商授權',
modelRequired: 'LLM 模型名稱不能為空',
maxContextTokensRequired: 'LLM 最大上下文 Token 數量必須大於 0',
recommendMaxItemsRequired: '智能推薦分析條目上限必須大於 0',
},
preferences: {
title: '資源偏好',
description: '設定資源下載偏好',

View File

@@ -1,11 +1,9 @@
// 1. 配置与兼容性
import './ace-config'
import '@/@core/utils/compatibility'
import '@/@iconify/icons-bundle'
import '@/plugins/webfontloader'
// 2. 核心插件和 UI 框架
import { createApp } from 'vue'
import { createApp, defineAsyncComponent } from 'vue'
import vuetify from '@/plugins/vuetify'
import router from '@/router'
import pinia from '@/stores/index'
@@ -13,42 +11,73 @@ import i18n from '@/plugins/i18n'
// 3. 全局组件
import App from '@/App.vue'
import { VAceEditor } from 'vue3-ace-editor'
import { PerfectScrollbarPlugin } from 'vue3-perfect-scrollbar'
import { CronVuetify } from '@vue-js-cron/vuetify'
// 4. 工具函数和其他辅助模块
import { loadRemoteComponents } from './utils/federationLoader'
// 5. 其他插件和功能模块
// 4. 其他插件和功能模块
import Toast from 'vue-toastification'
import ConfirmDialog from '@/composables/useConfirm'
import VueApexCharts from 'vue3-apexcharts'
import { configureApexChartsTheme } from '@/utils/apexCharts'
// 6. 注册自定义组件
// 5. 注册自定义组件
import DialogCloseBtn from '@/@core/components/DialogCloseBtn.vue'
import ScrollToTopBtn from '@/@core/components/ScrollToTopBtn.vue'
import PageContentTitle from './@core/components/PageContentTitle.vue'
import MediaCard from './components/cards/MediaCard.vue'
import PosterCard from './components/cards/PosterCard.vue'
import BackdropCard from './components/cards/BackdropCard.vue'
import PersonCard from './components/cards/PersonCard.vue'
import MediaInfoCard from './components/cards/MediaInfoCard.vue'
import TorrentCard from './components/cards/TorrentCard.vue'
import MediaIdSelector from './components/misc/MediaIdSelector.vue'
import CronField from './components/field/CronField.vue'
import PathField from './components/field/PathField.vue'
import HeaderTab from './layouts/components/HeaderTab.vue'
// 7. 样式文件 - 合并为单一导入
// 6. 样式文件 - 合并为单一导入
import '@/styles/main.scss'
// 8. 状态恢复插件
// 7. 状态恢复插件
import stateRestorePlugin from '@/plugins/stateRestore'
// 9. 后台优化工具
import { backgroundManager } from '@/utils/backgroundManager'
import { sseManagerSingleton } from '@/utils/sseManager'
function runWhenBrowserIdle(callback: () => void, timeout = 1500) {
const requestIdle = globalThis.requestIdleCallback
if (requestIdle) {
requestIdle(callback, { timeout })
return
}
globalThis.setTimeout(callback, 0)
}
function loadIconBundle() {
import('@/@iconify/icons-bundle').catch(error => {
console.error('Failed to load icon bundle', error)
})
}
function loadRemoteComponentsAfterLogin() {
import('./utils/federationLoader')
.then(({ loadRemoteComponents }) => loadRemoteComponents())
.catch(error => {
console.error('Failed to load remote components', error)
})
}
let remoteComponentsInitialized = false
const AsyncAceEditor = defineAsyncComponent(async () => {
await import('./ace-config')
return (await import('vue3-ace-editor')).VAceEditor
})
const AsyncApexChart = defineAsyncComponent(async () => {
const component = (await import('vue3-apexcharts')).default
const themeName = document.documentElement.getAttribute('data-theme') || localStorage.getItem('theme') || 'light'
configureApexChartsTheme(themeName)
return component
})
const AsyncCronVuetify = defineAsyncComponent(async () => {
return (await import('@vue-js-cron/vuetify')).CronVuetify
})
const AsyncCronField = defineAsyncComponent(async () => {
return (await import('./components/field/CronField.vue')).default
})
const AsyncPathField = defineAsyncComponent(async () => {
return (await import('./components/field/PathField.vue')).default
})
// 创建Vue实例
const app = createApp(App)
@@ -56,11 +85,6 @@ const app = createApp(App)
// 1. 注册pinia
app.use(pinia)
// 异步加载远程组件(不阻塞启动)
loadRemoteComponents().catch(error => {
console.error('Failed to load remote components', error)
})
// 2. 注册 UI 框架
app.use(vuetify)
@@ -72,21 +96,13 @@ app.use(stateRestorePlugin)
// 5. 注册全局组件
app
.component('VAceEditor', VAceEditor)
.component('VApexChart', VueApexCharts)
.component('VCronVuetify', CronVuetify)
.component('VAceEditor', AsyncAceEditor)
.component('VApexChart', AsyncApexChart)
.component('VCronVuetify', AsyncCronVuetify)
.component('VDialogCloseBtn', DialogCloseBtn)
.component('VScrollToTopBtn', ScrollToTopBtn)
.component('VMediaCard', MediaCard)
.component('VPosterCard', PosterCard)
.component('VBackdropCard', BackdropCard)
.component('VPersonCard', PersonCard)
.component('VMediaInfoCard', MediaInfoCard)
.component('VTorrentCard', TorrentCard)
.component('VMediaIdSelector', MediaIdSelector)
.component('VCronField', CronField)
.component('VPathField', PathField)
.component('VHeaderTab', HeaderTab)
.component('VCronField', AsyncCronField)
.component('VPathField', AsyncPathField)
.component('VPageContentTitle', PageContentTitle)
// 6. 注册其他插件
@@ -98,10 +114,21 @@ app
})
.use(ConfirmDialog)
.use(i18n)
.mount('#app')
// 页面卸载时清理后台管理器
window.addEventListener('beforeunload', () => {
backgroundManager.destroy()
sseManagerSingleton.closeAllManagers()
app.mount('#app')
// 图标全集很大,延后到首屏挂载后的空闲时间加载,避免阻塞登录页首次渲染。
runWhenBrowserIdle(loadIconBundle)
// 插件远程入口只在登录后有用,延后初始化可以减少未登录首屏请求和解析成本。
router.isReady().then(() => {
const loadIfAuthenticated = () => {
if (!remoteComponentsInitialized && pinia.state.value.auth?.token) {
remoteComponentsInitialized = true
runWhenBrowserIdle(loadRemoteComponentsAfterLogin)
}
}
loadIfAuthenticated()
router.afterEach(loadIfAuthenticated)
})

View File

@@ -1,15 +1,16 @@
<script setup lang="ts">
import { NavMenu } from '@/@layouts/types'
import { getNavMenus } from '@/router/i18n-menu'
import { useUserStore } from '@/stores'
import { usePluginSidebarNavStore, useUserStore } from '@/stores'
import { useI18n } from 'vue-i18n'
import { filterPluginSidebarNavEntries } from '@/utils/pluginSidebarNav'
import { filterMenusByPermission } from '@/utils/permission'
// 国际化
const { t } = useI18n()
// 从 Store 中获取用户信息
const userStore = useUserStore()
const pluginSidebarNavStore = usePluginSidebarNavStore()
// 获取用户权限信息
const userPermissions = computed(() => ({
@@ -20,14 +21,22 @@ const userPermissions = computed(() => ({
// 应用分组以header分组
const appGroups = ref<Record<string, NavMenu[]>>({})
// 根据header属性对应用进行分类
function categorizeApps() {
// 获取所有菜单并根据权限过滤
// 根据header属性对应用进行分类(含插件侧栏项,与桌面端侧栏一致)
async function categorizeApps() {
const allMenus = getNavMenus(t)
const filteredMenus = filterMenusByPermission(allMenus, userPermissions.value)
const menus = filteredMenus.filter((item: NavMenu) => !item.footer)
let menus = filteredMenus.filter((item: NavMenu) => !item.footer)
await pluginSidebarNavStore.ensureSidebarNav()
if (pluginSidebarNavStore.items.length > 0) {
const pluginNavMenus = filterPluginSidebarNavEntries(
pluginSidebarNavStore.items,
t,
userPermissions.value,
).map(e => e.navMenu)
menus = [...menus, ...pluginNavMenus]
}
// 按header属性分组
const groupedMenus: Record<string, NavMenu[]> = {}
menus.forEach(menu => {
@@ -38,11 +47,9 @@ function categorizeApps() {
groupedMenus[header].push(menu)
})
// 将分组结果赋值给响应式变量
appGroups.value = groupedMenus
}
// 页面加载时对应用进行分类
onMounted(() => {
categorizeApps()
})
@@ -60,7 +67,7 @@ onMounted(() => {
<VList lines="one" class="settings-list">
<VListItem
v-for="(app, appIndex) in apps"
:key="appIndex"
:key="`${header}-${appIndex}-${String(app.to)}`"
:to="app.to || ''"
color="primary"
class="settings-list-item"

View File

@@ -376,16 +376,15 @@ onDeactivated(() => {
<!-- 底部操作按钮只在非移动设备上显示 -->
<Teleport to="body" v-if="route.path === '/dashboard'">
<VFab
v-if="!appMode"
icon="mdi-view-dashboard-edit"
location="bottom"
size="x-large"
fixed
app
appear
@click="dialog = true"
/>
<div v-if="!appMode" class="compact-fab-stack">
<VFab
icon="mdi-view-dashboard-edit"
color="primary"
appear
class="compact-fab compact-fab--primary"
@click="dialog = true"
/>
</div>
</Teleport>
<!-- 弹窗根据配置生成选项 -->

View File

@@ -1,6 +1,6 @@
<script setup lang="ts">
import { VForm } from 'vuetify/components/VForm'
import { useAuthStore, useUserStore, useGlobalSettingsStore } from '@/stores'
import { useAuthStore, useUserStore } from '@/stores'
import { authState, userState } from '@/stores/types'
import { requiredValidator } from '@/@validators'
import api from '@/api'
@@ -20,9 +20,6 @@ const { t } = useI18n()
const authStore = useAuthStore()
//用户 Store
const userStore = useUserStore()
// 全局设置 Store
const globalSettingsStore = useGlobalSettingsStore()
// 获取有权限的菜单
const navMenus = computed(() => getNavMenus(t))
@@ -234,8 +231,8 @@ async function handlePassKeyAuth(
isConditional && conditionalAbortController
? conditionalAbortController.signal
: !isConditional && manualAbortController
? manualAbortController.signal
: undefined,
? manualAbortController.signal
: undefined,
})
await onSuccess(finishResponse)
@@ -373,9 +370,6 @@ async function handleLoginSuccess(response: any) {
authStore.login(authPayLoad)
userStore.loginUser(userPayload)
// 登录后加载用户相关的全局设置
await globalSettingsStore.loadUserSettings()
await afterLogin(userPayload.superUser, userPayload, filteredMenus)
}
@@ -528,7 +522,7 @@ onUnmounted(() => {
<!-- 登录表单 -->
<div v-if="!mfaDialog" class="auth-wrapper d-flex align-center justify-center">
<VCard
class="auth-card px-7 py-3 w-full h-full"
class="auth-card px-7 pt-3 w-full h-full"
:class="{ 'glass-effect': !isTransparentTheme }"
max-width="24rem"
border
@@ -539,7 +533,7 @@ onUnmounted(() => {
<VImg :src="logo" width="64" height="64" />
</div>
</template>
<VCardTitle class="font-weight-bold text-2xl text-uppercase"> MoviePilot </VCardTitle>
<VCardTitle class="font-weight-bold text-3xl text-uppercase"> MoviePilot </VCardTitle>
<!-- 语言切换按钮 -->
<template #append>
@@ -582,7 +576,7 @@ onUnmounted(() => {
type="text"
name="username"
id="username"
autocomplete="username webauthn"
autocomplete="username"
:rules="[requiredValidator]"
hide-details
/>
@@ -602,7 +596,7 @@ onUnmounted(() => {
@click:append-inner="isPasswordVisible = !isPasswordVisible"
/>
</VCol>
<VCol cols="12">
<VCol cols="12" class="py-0">
<!-- remember me checkbox -->
<div class="d-flex align-center justify-space-between flex-wrap">
<VCheckbox v-model="form.remember" :label="t('login.stayLoggedIn')" required />
@@ -610,15 +604,21 @@ onUnmounted(() => {
</VCol>
<VCol cols="12">
<!-- login button -->
<VBtn block type="submit" prepend-icon="mdi-login" :loading="loading">
<VBtn block type="submit" prepend-icon="mdi-login" :loading="loading" size="large">
{{ t('login.login') }}
</VBtn>
<!-- or divider -->
<div class="or-divider my-4">
<span class="or-divider-text">{{ t('login.orDivider') }}</span>
</div>
<!-- passkey login button -->
<VBtn
block
variant="tonal"
variant="outlined"
color="success"
class="mt-3 passkey-btn"
class="passkey-btn"
prepend-icon="material-symbols:passkey"
:loading="passkeyLoading"
@click="loginWithPassKey(false)"
@@ -718,8 +718,29 @@ onUnmounted(() => {
background: rgba(var(--v-theme-surface), 0.7) !important;
}
.or-divider {
position: relative;
display: flex;
align-items: center;
text-align: center;
&::before,
&::after {
flex: 1;
border-block-end: 1px solid rgba(var(--v-border-color), var(--v-border-opacity));
content: '';
}
.or-divider-text {
color: rgba(var(--v-theme-on-surface), var(--v-medium-emphasis-opacity));
font-size: 0.8125rem;
padding-inline: 12px;
white-space: nowrap;
}
}
.v-theme--light {
.passkey-btn.v-btn--variant-tonal {
.passkey-btn.v-btn--variant-outlined {
color: rgb(86, 170, 0) !important;
}
}

50
src/pages/plugin-app.vue Normal file
View File

@@ -0,0 +1,50 @@
<script setup lang="ts">
import type { Component } from 'vue'
import api from '@/api'
import { loadRemoteAppPageComponent } from '@/utils/federationLoader'
const route = useRoute()
const pluginId = computed(() => route.params.pluginId as string)
const navKey = computed(() => (route.params.navKey as string) || 'main')
const RemoteView = shallowRef<Component | null>(null)
const loadError = ref(false)
watch(
[pluginId, navKey],
async ([pid, nk]) => {
loadError.value = false
if (!pid) {
RemoteView.value = null
return
}
try {
RemoteView.value = (await loadRemoteAppPageComponent(pid, nk)) as Component
} catch (e) {
console.error(e)
RemoteView.value = null
loadError.value = true
}
},
{ immediate: true },
)
</script>
<template>
<div class="plugin-app-page">
<VAlert v-if="loadError" type="error" class="ma-4" title="组件加载错误">
无法加载插件全页组件多入口时请暴露 AppPage AppPage{Pascal}见文档并确认插件已启用
</VAlert>
<VSkeletonLoader v-else-if="!RemoteView" class="ma-4" type="article, article, article" />
<component
v-else
:is="RemoteView"
:key="`${pluginId}-${navKey}`"
:api="api"
:nav-key="navKey"
:plugin-id="pluginId"
@action="() => {}"
/>
</div>
</template>

File diff suppressed because it is too large Load Diff

View File

@@ -1,13 +1,6 @@
<script lang="ts" setup>
import { useRoute } from 'vue-router'
import router from '@/router'
import AccountSettingNotification from '@/views/setting/AccountSettingNotification.vue'
import AccountSettingSite from '@/views/setting/AccountSettingSite.vue'
import AccountSettingSearch from '@/views/setting/AccountSettingSearch.vue'
import AccountSettingSubscribe from '@/views/setting/AccountSettingSubscribe.vue'
import AccountSettingSystem from '@/views/setting/AccountSettingSystem.vue'
import AccountSettingDirectory from '@/views/setting/AccountSettingDirectory.vue'
import AccountSettingRule from '@/views/setting/AccountSettingRule.vue'
import { getSettingTabs } from '@/router/i18n-menu'
import { useDynamicHeaderTab } from '@/composables/useDynamicHeaderTab'
@@ -17,6 +10,15 @@ const route = useRoute()
const activeTab = ref((route.query.tab as string) || '')
const settingTabs = computed(() => getSettingTabs(t))
// 设置页的每个大类都很重,按标签页拆包,避免进入设置时一次性下载全部配置面板。
const AccountSettingSystem = defineAsyncComponent(() => import('@/views/setting/AccountSettingSystem.vue'))
const AccountSettingDirectory = defineAsyncComponent(() => import('@/views/setting/AccountSettingDirectory.vue'))
const AccountSettingSite = defineAsyncComponent(() => import('@/views/setting/AccountSettingSite.vue'))
const AccountSettingRule = defineAsyncComponent(() => import('@/views/setting/AccountSettingRule.vue'))
const AccountSettingSearch = defineAsyncComponent(() => import('@/views/setting/AccountSettingSearch.vue'))
const AccountSettingSubscribe = defineAsyncComponent(() => import('@/views/setting/AccountSettingSubscribe.vue'))
const AccountSettingNotification = defineAsyncComponent(() => import('@/views/setting/AccountSettingNotification.vue'))
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()

View File

@@ -4,10 +4,12 @@ import { useI18n } from 'vue-i18n'
import { useRouter } from 'vue-router'
import { useSetupWizard } from '@/composables/useSetupWizard'
import BasicSettingsStep from '@/views/setup/BasicSettingsStep.vue'
import SiteAuthSettingsStep from '@/views/setup/SiteAuthSettingsStep.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 AgentSettingsStep from '@/views/setup/AgentSettingsStep.vue'
import PreferencesSettingsStep from '@/views/setup/PreferencesSettingsStep.vue'
import ConnectivityTest from '@/views/setup/ConnectivityTest.vue'
import { useDisplay } from 'vuetify'
@@ -101,28 +103,38 @@ onMounted(async () => {
<BasicSettingsStep />
</VStepperWindowItem>
<!-- 步骤2存储目录 -->
<!-- 步骤2用户认证 -->
<VStepperWindowItem :value="2">
<SiteAuthSettingsStep />
</VStepperWindowItem>
<!-- 步骤3存储目录 -->
<VStepperWindowItem :value="3">
<StorageSettingsStep />
</VStepperWindowItem>
<!-- 步骤3下载器 -->
<VStepperWindowItem :value="3">
<!-- 步骤4下载器 -->
<VStepperWindowItem :value="4">
<DownloaderSettingsStep />
</VStepperWindowItem>
<!-- 步骤4媒体服务器 -->
<VStepperWindowItem :value="4">
<!-- 步骤5媒体服务器 -->
<VStepperWindowItem :value="5">
<MediaServerSettingsStep />
</VStepperWindowItem>
<!-- 步骤5通知 -->
<VStepperWindowItem :value="5">
<!-- 步骤6通知 -->
<VStepperWindowItem :value="6">
<NotificationSettingsStep />
</VStepperWindowItem>
<!-- 步骤6资源偏好 -->
<VStepperWindowItem :value="6">
<!-- 步骤7智能助手 -->
<VStepperWindowItem :value="7">
<AgentSettingsStep />
</VStepperWindowItem>
<!-- 步骤8资源偏好 -->
<VStepperWindowItem :value="8">
<PreferencesSettingsStep />
</VStepperWindowItem>
</VStepperWindow>

View File

@@ -1,11 +1,11 @@
<script setup lang="ts">
import { debounce } from 'lodash-es'
import SubscribeListView from '@/views/subscribe/SubscribeListView.vue'
import SubscribePopularView from '@/views/subscribe/SubscribePopularView.vue'
import SubscribeShareView from '@/views/subscribe/SubscribeShareView.vue'
import SubscribeEditDialog from '@/components/dialog/SubscribeEditDialog.vue'
import SubscribeShareStatisticsDialog from '@/components/dialog/SubscribeShareStatisticsDialog.vue'
import { useI18n } from 'vue-i18n'
import { useDynamicHeaderTab } from '@/composables/useDynamicHeaderTab'
import { useDynamicButton } from '@/composables/useDynamicButton'
import { usePWA } from '@/composables/usePWA'
import { useUserStore } from '@/stores'
import { getSubscribeMovieTabs, getSubscribeTvTabs } from '@/router/i18n-menu'
@@ -13,11 +13,21 @@ import { getSubscribeMovieTabs, getSubscribeTvTabs } from '@/router/i18n-menu'
const { t } = useI18n()
const route = useRoute()
const userStore = useUserStore()
const { appMode } = usePWA()
// 非默认标签页和弹窗按需加载,避免进入订阅列表时同步下载分享/统计相关代码。
const SubscribePopularView = defineAsyncComponent(() => import('@/views/subscribe/SubscribePopularView.vue'))
const SubscribeShareView = defineAsyncComponent(() => import('@/views/subscribe/SubscribeShareView.vue'))
const SubscribeEditDialog = defineAsyncComponent(() => import('@/components/dialog/SubscribeEditDialog.vue'))
const SubscribeShareStatisticsDialog = defineAsyncComponent(
() => import('@/components/dialog/SubscribeShareStatisticsDialog.vue'),
)
const subType = route.meta.subType?.toString()
const subId = ref(route.query.id as string)
const activeTab = ref((route.query.tab as string) || '')
const shareViewKey = ref(0)
const subscribeListViewRef = ref<InstanceType<typeof SubscribeListView> | null>(null)
// 获取标签页
const subscribeTabs = computed(() => {
@@ -40,6 +50,9 @@ const searchShareDialog = ref(false)
// 订阅分享统计弹窗
const shareStatisticsDialog = ref(false)
// 排序模式
const subscribeSortMode = ref(false)
// 订阅过滤词
const subscribeFilter = ref('')
@@ -48,17 +61,12 @@ const subscribeStatusFilter = ref<string | null>(null)
// 分享搜索词
const shareKeyword = ref('')
// 搜索分享
const searchShares = () => {
searchShareDialog.value = false
shareViewKey.value++
}
const shareKeywordInput = ref('')
// 筛选选项
const filterOptions = computed(() => {
const baseOptions = [
{ value: 'all', label: t('common.all'), icon: 'mdi-format-list-bulleted' },
{ value: 'all', label: t('common.all'), icon: 'mdi-filter-multiple-outline' },
{ value: 'best_version', label: t('subscribe.bestVersion'), icon: 'mdi-refresh', color: 'warning' },
]
@@ -82,17 +90,127 @@ const filterOptions = computed(() => {
]
})
// 计算筛选按钮颜色
// 当前选中的筛选选项
const currentFilter = computed(() => {
return filterOptions.value.find(option => option.value === (subscribeStatusFilter.value || 'all'))
})
// 计算筛选按钮颜色 - 有名称筛选或状态筛选时高亮
const filterButtonColor = computed(() => {
if (subscribeFilter.value || (subscribeStatusFilter.value && subscribeStatusFilter.value !== 'all')) {
return 'primary'
return currentFilter.value?.color || 'primary'
}
return 'gray'
})
// 选择筛选选项
function selectFilter(value: string) {
subscribeStatusFilter.value = value
filterSubscribeDialog.value = false
}
// VMenu activator选择器
const filterActivator = computed(() => '[data-menu-activator="filter-btn"]')
const searchActivator = computed(() => '[data-menu-activator="search-btn"]')
const searchActivator = computed(() => '[data-menu-activator="share-filter-btn"]')
const showDefaultRuleAction = computed(() => activeTab.value === 'mysub')
const showSubscribeHistoryAction = computed(() => showDefaultRuleAction.value && userStore.superUser)
const showShareStatisticsAction = computed(() => activeTab.value === 'share')
function openDefaultRuleDialog() {
subscribeEditDialog.value = true
}
function openSubscribeHistoryDialog() {
subscribeListViewRef.value?.openHistoryDialog()
}
function openShareStatisticsDialog() {
shareStatisticsDialog.value = true
}
function toggleSubscribeSortMode() {
subscribeSortMode.value = !subscribeSortMode.value
}
const shareKeywordUpdater = debounce((keyword: string) => {
shareKeyword.value = keyword.trim()
}, 300)
watch(shareKeywordInput, newKeyword => {
shareKeywordUpdater(newKeyword || '')
})
watch(activeTab, newTab => {
if (newTab !== 'share') {
searchShareDialog.value = false
}
})
onUnmounted(() => {
shareKeywordUpdater.cancel()
})
const subscribeDynamicMenuItems = computed(() => {
if (!appMode.value) return undefined
if (activeTab.value === 'mysub') {
const items: Array<{
titleKey: string
titleParams?: Record<string, unknown>
icon: string
action: () => void
}> = []
if (showSubscribeHistoryAction.value) {
items.push({
titleKey: 'dialog.subscribeHistory.title',
titleParams: { type: subType },
icon: 'mdi-history',
action: openSubscribeHistoryDialog,
})
}
items.push({
titleKey: 'dialog.subscribeEdit.titleDefault',
icon: 'mdi-clipboard-edit-outline',
action: openDefaultRuleDialog,
})
return items.length > 1 ? items : undefined
}
return undefined
})
const subscribeDynamicIcon = computed(() => {
if (showShareStatisticsAction.value) return 'mdi-chart-line'
if (showSubscribeHistoryAction.value) return 'mdi-history'
return 'mdi-clipboard-edit-outline'
})
function handleSubscribeDynamicAction() {
if (showShareStatisticsAction.value) {
openShareStatisticsDialog()
return
}
if (showSubscribeHistoryAction.value) {
openSubscribeHistoryDialog()
return
}
if (showDefaultRuleAction.value) {
openDefaultRuleDialog()
}
}
useDynamicButton({
icon: subscribeDynamicIcon,
onClick: handleSubscribeDynamicAction,
menuItems: subscribeDynamicMenuItems,
show: computed(() => appMode.value && (showDefaultRuleAction.value || showShareStatisticsAction.value)),
})
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()
@@ -113,6 +231,14 @@ registerHeaderTab({
},
show: computed(() => activeTab.value === 'mysub'),
},
{
icon: 'mdi-sort-variant',
variant: 'text',
color: computed(() => (subscribeSortMode.value ? 'warning' : 'gray')),
class: 'settings-icon-button',
action: toggleSubscribeSortMode,
show: computed(() => activeTab.value === 'mysub'),
},
{
icon: 'mdi-checkbox-multiple-marked-outline',
variant: 'text',
@@ -126,37 +252,16 @@ registerHeaderTab({
show: computed(() => activeTab.value === 'mysub'),
},
{
icon: 'mdi-chart-line',
icon: 'mdi-filter-multiple-outline',
variant: 'text',
color: 'gray',
color: computed(() => (shareKeywordInput.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'statistics-btn',
action: () => {
shareStatisticsDialog.value = true
},
show: computed(() => activeTab.value === 'share'),
},
{
icon: 'mdi-movie-search-outline',
variant: 'text',
color: computed(() => (shareKeyword.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'search-btn',
dataAttr: 'share-filter-btn',
action: () => {
searchShareDialog.value = true
},
show: computed(() => activeTab.value === 'share'),
},
{
icon: 'mdi-clipboard-edit-outline',
variant: 'text',
color: 'gray',
class: 'settings-icon-button',
action: () => {
subscribeEditDialog.value = true
},
show: computed(() => activeTab.value === 'mysub'),
},
],
})
@@ -176,10 +281,13 @@ onMounted(() => {
<transition name="fade-slide" appear>
<div>
<SubscribeListView
ref="subscribeListViewRef"
:type="subType"
:subid="subId"
:keyword="subscribeFilter"
:status-filter="subscribeStatusFilter ?? ''"
:sort-mode="subscribeSortMode"
@update:sort-mode="subscribeSortMode = $event"
/>
</div>
</transition>
@@ -194,50 +302,58 @@ onMounted(() => {
<VWindowItem value="share">
<transition name="fade-slide" appear>
<div>
<SubscribeShareView :keyword="shareKeyword" :key="shareViewKey" />
<SubscribeShareView :keyword="shareKeyword" />
</div>
</transition>
</VWindowItem>
</VWindow>
<!-- 订阅过滤弹窗 -->
<!-- 订阅过滤下拉菜单 -->
<Teleport to="body" v-if="filterSubscribeDialog">
<VMenu
v-model="filterSubscribeDialog"
width="25rem"
:close-on-content-click="false"
:activator="filterActivator"
location="bottom end"
>
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-filter-multiple-outline" class="mr-2" />
{{ t('subscribe.filterSubscriptions') }}
</VCardTitle>
<VDialogCloseBtn @click="filterSubscribeDialog = false" />
</VCardItem>
<VCardText>
<VRow>
<!-- 名称筛选 -->
<VCol cols="6">
<VTextField v-model="subscribeFilter" :label="t('subscribe.name')" clearable density="comfortable" />
</VCol>
<!-- 状态筛选 -->
<VCol cols="6">
<VSelect
v-model="subscribeStatusFilter"
:items="filterOptions"
item-title="label"
item-value="value"
:label="t('common.status')"
density="comfortable"
clearable
<VCard min-width="220">
<!-- 名称搜索 -->
<div class="pa-3">
<VTextField
v-model="subscribeFilter"
:placeholder="t('subscribe.name')"
prepend-inner-icon="mdi-magnify"
density="compact"
variant="outlined"
hide-details
clearable
/>
</div>
<VDivider class="mt-2" />
<!-- 状态筛选列表 -->
<VList density="compact" class="px-2 py-1">
<VListSubheader>{{ t('common.status') }}</VListSubheader>
<VListItem
v-for="option in filterOptions"
:key="option.value"
:active="(subscribeStatusFilter || 'all') === option.value"
@click="selectFilter(option.value)"
density="compact"
>
<template #prepend>
<VIcon :icon="option.icon" :color="option.color" size="small" />
</template>
<VListItemTitle>{{ option.label }}</VListItemTitle>
<template #append>
<VIcon
v-if="(subscribeStatusFilter || 'all') === option.value"
icon="mdi-check"
color="primary"
size="small"
/>
</VCol>
</VRow>
</VCardText>
</template>
</VListItem>
</VList>
</VCard>
</VMenu>
</Teleport>
@@ -246,30 +362,56 @@ onMounted(() => {
<Teleport to="body" v-if="searchShareDialog">
<VMenu
v-model="searchShareDialog"
width="25rem"
:close-on-content-click="false"
:activator="searchActivator"
location="bottom end"
>
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-movie-search-outline" class="mr-2" />
{{ t('subscribe.searchShares') }}
</VCardTitle>
<VDialogCloseBtn @click="searchShareDialog = false" />
</VCardItem>
<VCardText>
<VTextField v-model="shareKeyword" :label="t('subscribe.keyword')" clearable density="comfortable">
<template #append>
<VBtn prepend-icon="mdi-magnify" color="primary" @click="searchShares">{{ t('common.search') }}</VBtn>
</template>
</VTextField>
</VCardText>
<VCard min-width="260" max-width="320">
<div class="pa-3">
<VTextField
v-model="shareKeywordInput"
:placeholder="t('subscribe.keyword')"
prepend-inner-icon="mdi-magnify"
density="compact"
variant="outlined"
hide-details
clearable
/>
</div>
</VCard>
</VMenu>
</Teleport>
<Teleport to="body" v-if="!appMode && route.path.startsWith(`/subscribe/${subType === '电影' ? 'movie' : 'tv'}`)">
<div class="compact-fab-stack">
<VFab
v-if="showSubscribeHistoryAction"
icon="mdi-history"
color="info"
variant="tonal"
appear
class="compact-fab compact-fab--secondary"
@click="openSubscribeHistoryDialog"
/>
<VFab
v-if="showDefaultRuleAction"
icon="mdi-clipboard-edit-outline"
color="primary"
appear
class="compact-fab compact-fab--primary"
@click="openDefaultRuleDialog"
/>
<VFab
v-if="showShareStatisticsAction"
icon="mdi-chart-line"
color="primary"
appear
class="compact-fab compact-fab--primary"
@click="openShareStatisticsDialog"
/>
</div>
</Teleport>
<!-- 订阅编辑弹窗 -->
<SubscribeEditDialog
v-if="subscribeEditDialog"

View File

@@ -1,42 +1,66 @@
<script setup lang="ts">
import { debounce } from 'lodash-es'
import WorkflowListView from '@/views/workflow/WorkflowListView.vue'
import WorkflowShareView from '@/views/workflow/WorkflowShareView.vue'
import WorkflowAddEditDialog from '@/components/dialog/WorkflowAddEditDialog.vue'
import { useI18n } from 'vue-i18n'
import { useDynamicHeaderTab } from '@/composables/useDynamicHeaderTab'
import { useDynamicButton } from '@/composables/useDynamicButton'
import { usePWA } from '@/composables/usePWA'
import { getWorkflowTabs } from '@/router/i18n-menu'
// 国际化
const { t } = useI18n()
const route = useRoute()
const { appMode } = usePWA()
const activeTab = ref((route.query.tab as string) || 'list')
const shareViewKey = ref(0)
const listViewKey = ref(0)
const workflowListViewRef = ref<InstanceType<typeof WorkflowListView> | null>(null)
// 获取标签页
const workflowTabs = computed(() => {
return getWorkflowTabs(t)
})
// 新增工作流对话框
const addWorkflowDialog = ref(false)
// 分享搜索词
const shareKeyword = ref('')
const shareKeywordInput = ref('')
// 搜索分享对话框
const searchShareDialog = ref(false)
// 搜索分享激活器
const searchActivator = computed(() => '[data-menu-activator="search-btn"]')
const searchActivator = computed(() => '[data-menu-activator="share-filter-btn"]')
// 搜索分享
const searchShares = () => {
shareViewKey.value++
function openAddWorkflowDialog() {
workflowListViewRef.value?.openAddDialog()
}
const shareKeywordUpdater = debounce((keyword: string) => {
shareKeyword.value = keyword.trim()
}, 300)
watch(shareKeywordInput, newKeyword => {
shareKeywordUpdater(newKeyword || '')
})
watch(activeTab, newTab => {
if (newTab !== 'share') {
searchShareDialog.value = false
}
})
onUnmounted(() => {
shareKeywordUpdater.cancel()
})
useDynamicButton({
icon: 'mdi-plus',
onClick: openAddWorkflowDialog,
show: computed(() => appMode.value && activeTab.value === 'list'),
})
// 使用动态标签页
const { registerHeaderTab } = useDynamicHeaderTab()
@@ -46,11 +70,11 @@ registerHeaderTab({
modelValue: activeTab,
appendButtons: [
{
icon: 'mdi-search',
icon: 'mdi-filter-multiple-outline',
variant: 'text',
color: computed(() => (shareKeyword.value ? 'primary' : 'gray')),
color: computed(() => (shareKeywordInput.value ? 'primary' : 'gray')),
class: 'settings-icon-button',
dataAttr: 'search-btn',
dataAttr: 'share-filter-btn',
show: computed(() => activeTab.value === 'share'),
action: () => {
searchShareDialog.value = true
@@ -74,54 +98,54 @@ onMounted(() => {
<VWindowItem value="list">
<transition name="fade-slide" appear>
<div>
<WorkflowListView :key="listViewKey" />
<WorkflowListView ref="workflowListViewRef" :key="listViewKey" />
</div>
</transition>
</VWindowItem>
<VWindowItem value="share">
<transition name="fade-slide" appear>
<div>
<WorkflowShareView :keyword="shareKeyword" :key="shareViewKey" @update="listViewKey++" />
<WorkflowShareView :keyword="shareKeyword" @update="listViewKey++" />
</div>
</transition>
</VWindowItem>
</VWindow>
<!-- 新增工作流对话框 -->
<WorkflowAddEditDialog
v-if="addWorkflowDialog"
v-model="addWorkflowDialog"
@close="addWorkflowDialog = false"
@save="addWorkflowDialog = false"
/>
<!-- 搜索工作流分享弹窗 -->
<Teleport to="body" v-if="searchShareDialog">
<VMenu
v-model="searchShareDialog"
width="25rem"
:close-on-content-click="false"
:activator="searchActivator"
location="bottom end"
>
<VCard>
<VCardItem>
<VCardTitle>
<VIcon icon="mdi-movie-search-outline" class="mr-2" />
{{ t('workflow.searchShares') }}
</VCardTitle>
<VDialogCloseBtn @click="searchShareDialog = false" />
</VCardItem>
<VCardText>
<VTextField v-model="shareKeyword" :label="t('workflow.searchShares')" clearable density="comfortable">
<template #append>
<VBtn prepend-icon="mdi-magnify" color="primary" @click="searchShares">{{ t('common.search') }}</VBtn>
</template>
</VTextField>
</VCardText>
<VCard min-width="260" max-width="320">
<div class="pa-3">
<VTextField
v-model="shareKeywordInput"
:placeholder="t('workflow.searchShares')"
prepend-inner-icon="mdi-magnify"
density="compact"
variant="outlined"
hide-details
clearable
/>
</div>
</VCard>
</VMenu>
</Teleport>
<Teleport to="body" v-if="!appMode && route.path === '/workflow' && activeTab === 'list'">
<div class="compact-fab-stack">
<VFab
icon="mdi-plus"
color="primary"
appear
class="compact-fab compact-fab--primary"
@click="openAddWorkflowDialog"
/>
</div>
</Teleport>
</div>
</template>

View File

@@ -283,3 +283,20 @@ export function getWorkflowTabs(t: Composer['t']) {
},
]
}
/** 插件侧栏分组(与后端 get_sidebar_nav 的 section 一致) */
export type PluginSidebarSection = 'start' | 'discovery' | 'subscribe' | 'organize' | 'system'
/**
* 将插件声明的 section 映射为与 getNavMenus 一致的已翻译 header用于 NavMenu.header
*/
export function pluginSidebarSectionToHeaderKey(section: string, t: Composer['t']): string {
const map: Record<string, string> = {
start: 'menu.start',
discovery: 'menu.discovery',
subscribe: 'menu.subscribe',
organize: 'menu.organize',
system: 'menu.system',
}
return t(map[section] ?? 'menu.system')
}

View File

@@ -73,7 +73,6 @@ const router = createRouter({
path: '/subscribe-share',
component: () => import('../pages/subscribe-share.vue'),
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -97,6 +96,7 @@ const router = createRouter({
path: '/downloading',
component: () => import('../pages/downloading.vue'),
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -104,6 +104,7 @@ const router = createRouter({
path: '/history',
component: () => import('../pages/history.vue'),
meta: {
keepAlive: true,
requiresAuth: true,
hideFooter: true,
},
@@ -140,6 +141,14 @@ const router = createRouter({
requiresAuth: true,
},
},
{
path: '/plugin-app/:pluginId/:navKey?',
name: 'plugin-app',
component: () => import('../pages/plugin-app.vue'),
meta: {
requiresAuth: true,
},
},
{
path: '/setting',
component: () => import('../pages/setting.vue'),
@@ -152,7 +161,6 @@ const router = createRouter({
component: () => import('../pages/browse.vue'),
props: true,
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -161,7 +169,6 @@ const router = createRouter({
component: () => import('../pages/credits.vue'),
props: true,
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -170,7 +177,6 @@ const router = createRouter({
component: () => import('../pages/person.vue'),
props: true,
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -178,7 +184,6 @@ const router = createRouter({
path: '/media',
component: () => import('../pages/media.vue'),
meta: {
keepAlive: true,
requiresAuth: true,
},
},
@@ -195,6 +200,7 @@ const router = createRouter({
path: '/apps',
component: () => import('../pages/appcenter.vue'),
meta: {
keepAlive: true,
requiresAuth: true,
},
},

View File

@@ -12,7 +12,18 @@ declare let self: ServiceWorkerGlobalScope & {
// 缓存版本控制
const RESOURCE_VERSION = 'V2'
const CACHE_VERSION = `${__APP_VERSION__}-${__BUILD_TIME__}` // 开发环境下无法使用此环境变量,生产环境正常
// 开发态 dev-sw 可能拿不到 Vite define 注入;仅在开发环境做 dev 兜底
const hasAppVersion = typeof __APP_VERSION__ !== 'undefined'
const hasBuildTime = typeof __BUILD_TIME__ !== 'undefined'
const isDev = import.meta.env.DEV
if (!isDev && (!hasAppVersion || !hasBuildTime)) {
throw new Error('[SW] Missing __APP_VERSION__ or __BUILD_TIME__ in production build')
}
const appVersion = hasAppVersion ? __APP_VERSION__ : 'dev'
const buildTime = hasBuildTime ? __BUILD_TIME__ : 'dev'
const CACHE_VERSION = `${appVersion}-${buildTime}`
// 启用导航预载
navigationPreload.enable()
@@ -136,6 +147,7 @@ registerRoute(
({ url, request }) =>
url.pathname.includes('/api/v1/') &&
request.method === 'GET' &&
!url.pathname.includes('/api/v1/search/') && // 搜索接口结果动态变化,避免缓存导致重复搜索失效
!url.pathname.includes('/api/v1/system/message') && // SSE实时消息流
!url.pathname.includes('/api/v1/system/progress/') && // SSE实时进度流
!url.pathname.includes('/api/v1/system/logging') && // SSE实时日志流

View File

@@ -1,5 +1,6 @@
import { defineStore } from 'pinia'
import type { authState } from '@/stores/types'
import { usePluginSidebarNavStore } from '@/stores/pluginSidebarNav'
export const useAuthStore = defineStore('auth', {
state: (): authState => ({
@@ -31,6 +32,7 @@ export const useAuthStore = defineStore('auth', {
logout() {
this.clearToken()
this.setOriginalPath(null)
usePluginSidebarNavStore().reset()
},
},

View File

@@ -23,6 +23,14 @@ export const useGlobalSettingsStore = defineStore('globalSettings', {
// 检查版本更新
if (result.FRONTEND_VERSION) {
const isBackendDev = Boolean(result.BACKEND_DEV)
const skipVersionCheck = import.meta.env.DEV || isBackendDev
if (skipVersionCheck) {
console.log('[VersionChecker] 开发环境下跳过版本一致性检查')
return
}
const { checkVersion } = useVersionChecker()
await checkVersion(result.FRONTEND_VERSION)
}

View File

@@ -13,5 +13,6 @@ export default pinia
import { useAuthStore } from './auth'
import { useUserStore } from './user'
import { useGlobalSettingsStore } from './global'
import { usePluginSidebarNavStore } from './pluginSidebarNav'
export { useAuthStore, useUserStore, useGlobalSettingsStore }
export { useAuthStore, useUserStore, useGlobalSettingsStore, usePluginSidebarNavStore }

View File

@@ -0,0 +1,49 @@
import { defineStore } from 'pinia'
import api from '@/api'
import type { PluginSidebarNavItem } from '@/api/types'
/**
* 缓存 GET plugin/sidebar_nav 结果,供 DefaultLayout 与 appcenter 等共用,避免重复请求。
*/
export const usePluginSidebarNavStore = defineStore('pluginSidebarNav', {
state: () => ({
items: [] as PluginSidebarNavItem[],
/** 是否已成功拉取过一次(含空数组) */
loaded: false,
/** 并发去重:同一时刻只进行一次请求 */
inflight: null as Promise<void> | null,
}),
actions: {
/**
* 确保侧栏导航数据已加载;已缓存则直接返回,并发调用共享同一请求。
* @param force 为 true 时忽略缓存重新请求(如登出后再登录可配合 reset + ensure
*/
async ensureSidebarNav(force = false): Promise<void> {
if (!force && this.loaded) {
return
}
if (this.inflight) {
return this.inflight
}
this.inflight = (async () => {
try {
const res = await api.get('plugin/sidebar_nav')
this.items = Array.isArray(res) ? res : []
} catch {
this.items = []
} finally {
this.loaded = true
this.inflight = null
}
})()
return this.inflight
},
reset() {
this.items = []
this.loaded = false
this.inflight = null
},
},
})

View File

@@ -48,6 +48,143 @@ html.v-overlay-scroll-blocked body {
}
}
// 应用类信息卡片:固定右侧媒体槽位,避免图片被左侧文字挤压变形
.app-card-shell {
position: relative;
block-size: 100%;
}
// 保证卡片右上角的浮动操作区始终高于可点击的卡片内容层,避免误触发详情打开。
.app-card-top-action {
z-index: 2;
}
.app-card-summary {
position: relative;
display: flex;
overflow: hidden;
align-items: stretch;
justify-content: flex-start;
block-size: 7.5rem;
min-block-size: 7.5rem;
}
.app-card-summary__content {
position: relative;
z-index: 1;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: center;
min-inline-size: 0;
padding-block: 0.25rem 0.5rem;
row-gap: 0.25rem;
}
.app-card-summary__title-row {
display: flex;
align-items: flex-start;
column-gap: 0.25rem;
min-inline-size: 0;
}
.app-card-summary__title-row > .v-badge {
flex-shrink: 0;
align-self: center;
}
.app-card-summary__subtitle,
.app-card-summary__meta-item {
overflow: hidden;
min-inline-size: 0;
text-overflow: ellipsis;
white-space: nowrap;
}
.app-card-summary__title {
display: -webkit-box;
overflow: hidden;
flex: 0 0 auto;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
line-clamp: 2;
line-height: 1.35;
max-block-size: calc(1.35em * 2);
min-inline-size: 0;
text-overflow: ellipsis;
white-space: normal;
word-break: break-word;
}
.app-card-summary__title-row .app-card-summary__title {
flex: 1 1 auto;
}
.app-card-summary__meta {
display: flex;
overflow: hidden;
align-items: center;
column-gap: 0.5rem;
min-block-size: 1.5rem;
min-inline-size: 0;
}
.app-card-summary--single-action .app-card-summary__content {
padding-inline-end: 3.75rem;
}
.app-card-summary--double-action .app-card-summary__content {
padding-inline-end: 5rem;
}
.app-card-summary--title-subtitle {
padding-block: 0.75rem !important;
}
.app-card-summary--title-subtitle .app-card-summary__content {
justify-content: space-between;
block-size: 100%;
padding-block: 0;
}
.app-card-summary--title-subtitle .app-card-summary__title {
flex: 0 1 auto;
}
.app-card-summary--title-subtitle .app-card-summary__subtitle {
flex-shrink: 0;
}
.app-card-summary__media {
position: absolute;
z-index: 0;
display: flex;
align-items: flex-end;
justify-content: flex-end;
inset-block-end: 0.75rem;
inset-inline-end: 1rem;
pointer-events: none;
}
.app-card-summary--single-action .app-card-summary__media,
.app-card-summary--double-action .app-card-summary__media {
inset-inline-end: 1rem;
}
.app-card-summary__image {
flex-shrink: 0;
block-size: 3.5rem;
inline-size: 3.5rem;
max-block-size: 3.5rem;
max-inline-size: 3.5rem;
min-block-size: 3.5rem;
min-inline-size: 3.5rem;
}
.app-card-summary__image .v-img__img {
object-fit: contain;
}
// Toast通知样式
.Vue-Toastification__container {
z-index: 2500;
@@ -238,6 +375,122 @@ html.v-overlay-scroll-blocked body {
opacity:0.75;
}
// 紧凑型悬浮操作按钮
.compact-fab-stack {
position: fixed;
z-index: 1100;
display: flex;
flex-direction: column;
align-items: flex-end;
gap: 0.75rem;
inset-block-end: max(1rem, calc(env(safe-area-inset-bottom) + 1rem));
inset-inline-end: max(1rem, calc(env(safe-area-inset-right) + 1rem));
pointer-events: none;
}
.compact-fab-stack > * {
pointer-events: auto;
}
.compact-fab-stack--history {
inset-block-end: max(4.5rem, calc(env(safe-area-inset-bottom) + 4.5rem));
}
.compact-fab.v-fab {
display: inline-flex;
overflow: visible;
flex: none;
min-inline-size: 0 !important;
pointer-events: auto;
}
.compact-fab .v-fab__container {
position: static;
display: inline-flex;
overflow: visible;
margin: 0 !important;
}
.compact-fab .v-btn {
border: 1px solid rgba(var(--v-theme-on-surface), 0.08);
backdrop-filter: blur(14px);
box-shadow:
0 16px 34px rgb(15 23 42 / 16%),
0 6px 16px rgb(15 23 42 / 10%);
opacity: 0.98;
transition:
transform 0.18s ease,
box-shadow 0.18s ease,
filter 0.18s ease,
opacity 0.18s ease;
}
.compact-fab--primary .v-btn {
block-size: 3rem !important;
box-shadow:
0 20px 40px rgb(15 23 42 / 20%),
0 8px 18px rgb(15 23 42 / 12%);
inline-size: 3rem !important;
}
.compact-fab--secondary .v-btn {
block-size: 3rem !important;
inline-size: 3rem !important;
}
.compact-fab--primary .v-icon {
font-size: 1.75rem !important;
}
.compact-fab--secondary .v-icon {
font-size: 1.75rem !important;
}
@media (hover: hover) {
.compact-fab .v-btn:hover {
box-shadow:
0 22px 42px rgb(15 23 42 / 22%),
0 8px 18px rgb(15 23 42 / 12%);
filter: saturate(1.03);
transform: translateY(-2px);
}
.compact-fab--primary .v-btn:hover {
box-shadow:
0 26px 46px rgb(15 23 42 / 24%),
0 10px 22px rgb(15 23 42 / 14%);
}
}
.compact-fab .v-btn:active {
box-shadow:
0 10px 22px rgb(15 23 42 / 16%),
0 3px 8px rgb(15 23 42 / 10%);
transform: translateY(0) scale(0.98);
}
@media (width <= 768px) {
.compact-fab-stack {
gap: 0.625rem;
inset-block-end: max(0.875rem, calc(env(safe-area-inset-bottom) + 0.875rem));
inset-inline-end: max(0.875rem, calc(env(safe-area-inset-right) + 0.875rem));
}
.compact-fab-stack--history {
inset-block-end: max(4rem, calc(env(safe-area-inset-bottom) + 4rem));
}
.compact-fab--primary .v-btn {
block-size: 3.5rem !important;
inline-size: 3.5rem !important;
}
.compact-fab--secondary .v-btn {
block-size: 3rem !important;
inline-size: 3rem !important;
}
}
.apexcharts-title-text {
color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity)) !important;
}
@@ -262,6 +515,7 @@ html.v-overlay-scroll-blocked body {
.v-overlay__content .v-list{
backdrop-filter: blur(6px);
background-color: rgb(var(--v-theme-surface), 0.9) !important;
padding-inline: 0.5rem !important;
}
.v-overlay__content .v-card:not(.bg-primary){
@@ -311,7 +565,28 @@ html.v-overlay-scroll-blocked body {
.settings-icon-button {
flex-shrink: 0;
min-inline-size: auto;
border-radius: 0.95rem;
block-size: 2.75rem;
inline-size: 2.75rem;
margin-inline-start: 0.25rem;
min-inline-size: 2.75rem;
}
.settings-icon-button .v-icon {
font-size: 1.35rem;
}
@media (width <= 768px) {
.settings-icon-button {
border-radius: 0.825rem;
block-size: 2.5rem;
inline-size: 2.5rem;
min-inline-size: 2.5rem;
}
.settings-icon-button .v-icon {
font-size: 1.25rem;
}
}
.v-infinite-scroll__side {

1
src/types/iconify-bundle.d.ts vendored Normal file
View File

@@ -0,0 +1 @@
declare module '@/@iconify/icons-bundle'

40
src/utils/apexCharts.ts Normal file
View File

@@ -0,0 +1,40 @@
declare global {
interface Window {
Apex: any
}
}
export function configureApexChartsTheme(themeName: string) {
if (typeof window === 'undefined' || !window.Apex) {
return
}
try {
const isDark = themeName === 'dark' || themeName === 'transparent'
window.Apex.dataLabels = {
formatter: function (_: number, { seriesIndex, w }: { seriesIndex: number; w: any }) {
const data = w.config.series[seriesIndex]
return data.toFixed(data % 1 === 0 ? 0 : 1)
},
}
window.Apex.legend = {
labels: {
useSeriesColors: true,
},
}
window.Apex.title = {
style: {
color: 'rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity))',
},
}
window.Apex.tooltip = {
theme: isDark ? 'dark' : 'light',
}
} catch (error) {
console.warn('ApexCharts 全局配置失败:', error)
}
}

View File

@@ -1,6 +1,6 @@
/**
* 通用APP深度链接工具类
* 支持媒体服务器Plex、Jellyfin、Emby和豆瓣的APP跳转和网页跳转
* 支持媒体服务器Plex、Jellyfin、Emby、极影视、飞牛影视和豆瓣的APP跳转和网页跳转
*
* 深度链接格式参考:
* - Plex: https://forums.plex.tv/t/plex-mobile-app-deep-linking/123456
@@ -12,7 +12,7 @@
import { isMobileDevice, isIOSDevice, isAndroidDevice } from '@/@core/utils'
// APP类型
export type AppType = 'plex' | 'jellyfin' | 'emby' | 'trimemedia' | 'douban'
export type AppType = 'plex' | 'jellyfin' | 'emby' | 'zspace' | 'trimemedia' | 'douban'
// 深度链接配置
interface DeepLinkConfig {
@@ -38,6 +38,11 @@ const DEEP_LINK_CONFIGS: Record<AppType, DeepLinkConfig> = {
webUrl: 'https://emby.media',
timeout: 2000,
},
zspace: {
appScheme: 'emby://',
webUrl: 'https://www.zspace.com.cn',
timeout: 2000,
},
trimemedia: {
appScheme: 'trimemedia://',
webUrl: 'https://trimemedia.com',
@@ -135,6 +140,9 @@ function buildDeepLinkUrl(appType: AppType, params: string | DoubanAppParams): s
case 'emby':
return buildEmbyDeepLink(params as string)
case 'zspace':
return buildEmbyDeepLink(params as string)
case 'trimemedia':
return buildTrimemediaDeepLink(params as string)
@@ -634,7 +642,7 @@ export async function openMediaServerWithAutoDetect(
// 优先使用传入的 serverType 参数
if (serverType) {
const type = serverType.toLowerCase()
if (type === 'plex' || type === 'jellyfin' || type === 'emby' || type === 'trimemedia') {
if (type === 'plex' || type === 'jellyfin' || type === 'emby' || type === 'zspace' || type === 'trimemedia') {
detectedServerType = type as AppType
}
}
@@ -649,6 +657,8 @@ export async function openMediaServerWithAutoDetect(
detectedServerType = 'jellyfin'
} else if (url.includes('emby')) {
detectedServerType = 'emby'
} else if (url.includes('zspace')) {
detectedServerType = 'zspace'
}
}
@@ -698,6 +708,8 @@ export function getAppDownloadUrl(appType: AppType): string {
return 'https://jellyfin.org/downloads/'
case 'emby':
return 'https://emby.media/download.html'
case 'zspace':
return 'https://www.zspace.com.cn/'
case 'trimemedia':
return 'https://trimemedia.com/download'
case 'douban':

View File

@@ -11,56 +11,61 @@ export class BackgroundManager {
runInBackground?: boolean
}> = new Map()
private readonly activityEvents = ['mousedown', 'mousemove', 'keypress', 'scroll', 'touchstart', 'click']
private readonly handleVisibilityChange = () => {
const wasBackground = this.isBackground
this.isBackground = document.hidden
if (this.isBackground && !wasBackground) {
console.log('Background: 进入后台,暂停定时器')
this.pauseAllTimers()
} else if (!this.isBackground && wasBackground) {
console.log('Background: 回到前台,恢复定时器')
this.resumeAllTimers()
}
}
private readonly handleBeforeUnload = () => {
this.destroy()
}
private readonly updateActivity = () => {
this.lastActivityTime = Date.now()
}
private isBackground = false
private isDestroyed = false
private lastActivityTime = Date.now()
private activityTimer: ReturnType<typeof setInterval> | null = null
private isInitialized = false
constructor() {
private ensureInitialized() {
if (this.isInitialized || this.isDestroyed) return
this.isInitialized = true
this.isBackground = document.hidden
this.setupVisibilityListener()
this.setupActivityTracking()
}
private setupVisibilityListener() {
document.addEventListener('visibilitychange', () => {
const wasBackground = this.isBackground
this.isBackground = document.hidden
if (this.isBackground && !wasBackground) {
console.log('Background: 进入后台,暂停定时器')
this.pauseAllTimers()
} else if (!this.isBackground && wasBackground) {
console.log('Background: 回到前台,恢复定时器')
this.resumeAllTimers()
}
})
// 页面卸载时清理
window.addEventListener('beforeunload', () => {
this.destroy()
})
document.addEventListener('visibilitychange', this.handleVisibilityChange)
window.addEventListener('beforeunload', this.handleBeforeUnload)
}
private setupActivityTracking() {
// 跟踪用户活动
const events = ['mousedown', 'mousemove', 'keypress', 'scroll', 'touchstart', 'click']
const updateActivity = () => {
this.lastActivityTime = Date.now()
}
events.forEach(event => {
document.addEventListener(event, updateActivity, { passive: true })
// 按需跟踪用户活动,避免应用启动时就注册一批全局监听。
this.activityEvents.forEach(event => {
document.addEventListener(event, this.updateActivity, { passive: true })
})
}
// 定期更新活动状态
this.activityTimer = setInterval(() => {
// 如果超过5分钟没有活动可以考虑减少后台活动
const inactiveTime = Date.now() - this.lastActivityTime
if (inactiveTime > 5 * 60 * 1000) {
console.log('Background: 用户长时间不活跃')
}
}, 60000) // 每分钟检查一次
private removeLifecycleListeners() {
if (!this.isInitialized) return
document.removeEventListener('visibilitychange', this.handleVisibilityChange)
window.removeEventListener('beforeunload', this.handleBeforeUnload)
this.activityEvents.forEach(event => {
document.removeEventListener(event, this.updateActivity)
})
this.isInitialized = false
}
/**
@@ -76,6 +81,9 @@ export class BackgroundManager {
} = {}
) {
const { runInBackground = false, skipInitialRun = false } = options
if (this.isDestroyed) return
this.ensureInitialized()
this.removeTimer(id)
@@ -122,6 +130,11 @@ export class BackgroundManager {
}
this.timers.delete(id)
console.log(`Background: 移除定时器 ${id}`)
// 没有任务时释放监听,首屏只导入模块不会产生常驻开销。
if (this.timers.size === 0) {
this.removeLifecycleListeners()
}
}
}
@@ -237,11 +250,8 @@ export class BackgroundManager {
})
this.timers.clear()
// 清理活动跟踪定时器
if (this.activityTimer) {
clearInterval(this.activityTimer)
this.activityTimer = null
}
// 清理按需注册的生命周期与活动监听
this.removeLifecycleListeners()
console.log('Background: 管理器已销毁')
}
@@ -273,4 +283,4 @@ export function removeBackgroundTimer(id: string) {
export function getBackgroundTimerStatus(id: string) {
return backgroundManager.getTimerStatus(id)
}
}

View File

@@ -29,6 +29,58 @@ async function fetchSingleRemoteModule(id: string): Promise<RemoteModule | null>
}
}
/**
* 将 nav_key 转为联邦暴露名的 Pascal 片段(如 settings -> Settingsmy-tool -> MyTool
*/
function navKeyToPascalSegment(navKey: string): string {
return navKey
.trim()
.split(/[-_\s]+/)
.filter(Boolean)
.map(part => part.charAt(0).toUpperCase() + part.slice(1).toLowerCase())
.join('')
}
/**
* 加载插件全页组件(支持同一插件多界面)。
*
* 解析顺序nav_key 为 main 或空时):
* `AppPage` → `Page`
*
* 其它 nav_key例如 settings、my_tool
* `AppPage{Pascal}` → `AppPage` → `Page`
* 例nav_key=settings → 尝试 `AppPageSettings`,再回退 `AppPage`、`Page`
*
* 也可在单个 `AppPage.vue` 内根据 `navKey` prop 分支渲染,无需多文件。
*/
export async function loadRemoteAppPageComponent(id: string, navKey: string = 'main') {
const raw = (navKey || 'main').trim()
const isMain = raw === '' || raw.toLowerCase() === 'main'
const candidateNames: string[] = []
if (isMain) {
candidateNames.push('AppPage', 'Page')
} else {
const pascal = navKeyToPascalSegment(raw)
if (pascal) {
candidateNames.push(`AppPage${pascal}`)
}
candidateNames.push('AppPage', 'Page')
}
let lastError: unknown
for (const name of candidateNames) {
try {
return await loadRemoteComponent(id, name)
} catch (error) {
lastError = error
console.debug(`[federation] 插件 ${id} 全页尝试 ./${name} 失败,回退下一候选`)
}
}
console.warn(`[federation] 插件 ${id} 全页均加载失败 (navKey=${raw})`, lastError)
throw lastError ?? new Error(`无法加载插件 ${id} 的全页组件`)
}
/**
* 加载远程组件
* @param id 远程模块ID

View File

@@ -8,11 +8,14 @@ import qbittorrentLogo from '@/assets/images/logos/qbittorrent.png'
import transmissionLogo from '@/assets/images/logos/transmission.png'
import rtorrentLogo from '@/assets/images/logos/rtorrent.png'
import embyLogo from '@/assets/images/logos/emby.png'
import zspaceLogo from '@/assets/images/logos/zspace.webp'
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 ugreenLogo from '@/assets/images/logos/ugreen.png'
import wechatLogo from '@/assets/images/logos/wechat.png'
import feishuLogo from '@/assets/images/logos/feishu.png'
import clawbotLogo from '@/assets/images/logos/clawbot.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'
@@ -39,11 +42,14 @@ const logoMap: Record<string, string> = {
transmission: transmissionLogo,
rtorrent: rtorrentLogo,
emby: embyLogo,
zspace: zspaceLogo,
jellyfin: jellyfinLogo,
plex: plexLogo,
trimemedia: trimemediaLogo,
ugreen: ugreenLogo,
wechat: wechatLogo,
feishu: feishuLogo,
wechatclawbot: clawbotLogo,
telegram: telegramLogo,
slack: slackLogo,
discord: discordLogo,

View File

@@ -0,0 +1,77 @@
type StatusCacheEntry = {
expiresAt: number
value: boolean
}
const STATUS_CACHE_TTL = 3 * 60 * 1000
const existsStatusCache = new Map<string, StatusCacheEntry>()
const existsStatusRequests = new Map<string, Promise<boolean>>()
const subscribeStatusCache = new Map<string, StatusCacheEntry>()
const subscribeStatusRequests = new Map<string, Promise<boolean>>()
function getCachedValue(cache: Map<string, StatusCacheEntry>, key: string): boolean | undefined {
const entry = cache.get(key)
if (!entry) {
return undefined
}
if (entry.expiresAt <= Date.now()) {
cache.delete(key)
return undefined
}
return entry.value
}
function setCachedValue(cache: Map<string, StatusCacheEntry>, key: string, value: boolean) {
cache.set(key, {
expiresAt: Date.now() + STATUS_CACHE_TTL,
value,
})
}
async function resolveCachedStatus(
cache: Map<string, StatusCacheEntry>,
requests: Map<string, Promise<boolean>>,
key: string,
loader: () => Promise<boolean>,
): Promise<boolean> {
const cachedValue = getCachedValue(cache, key)
if (cachedValue !== undefined) {
return cachedValue
}
const currentRequest = requests.get(key)
if (currentRequest) {
return currentRequest
}
const request = loader()
.then(value => {
setCachedValue(cache, key, value)
return value
})
.finally(() => {
requests.delete(key)
})
requests.set(key, request)
return request
}
export function getCachedMediaExistsStatus(key: string, loader: () => Promise<boolean>) {
return resolveCachedStatus(existsStatusCache, existsStatusRequests, key, loader)
}
export function setCachedMediaExistsStatus(key: string, value: boolean) {
setCachedValue(existsStatusCache, key, value)
}
export function getCachedMediaSubscribeStatus(key: string, loader: () => Promise<boolean>) {
return resolveCachedStatus(subscribeStatusCache, subscribeStatusRequests, key, loader)
}
export function setCachedMediaSubscribeStatus(key: string, value: boolean) {
setCachedValue(subscribeStatusCache, key, value)
}

View File

@@ -0,0 +1,54 @@
import type { Composer } from 'vue-i18n'
import type { NavMenu } from '@/@layouts/types'
import type { PluginSidebarNavItem } from '@/api/types'
import { pluginSidebarSectionToHeaderKey } from '@/router/i18n-menu'
import { filterMenusByPermission } from '@/utils/permission'
export type PluginNavMenuEntry = {
navMenu: NavMenu & { permission?: string }
section: string
}
/**
* 将后端 sidebar_nav 单项转为侧栏 / 应用中心 共用的 NavMenu
*/
export function navMenuFromPluginSidebarItem(
item: PluginSidebarNavItem,
t: Composer['t'],
): NavMenu & { permission?: string } {
const section = item.section || 'system'
const header = pluginSidebarSectionToHeaderKey(section, t)
return {
title: item.title,
icon: item.icon,
to: {
name: 'plugin-app',
params: {
pluginId: item.plugin_id,
navKey: item.nav_key,
},
},
header,
permission: item.permission ?? undefined,
} as NavMenu & { permission?: string }
}
/**
* 过滤有权限的插件导航项,并保留 section 供 DefaultLayout 分栏插入
*/
export function filterPluginSidebarNavEntries(
items: PluginSidebarNavItem[],
t: Composer['t'],
userPermissions: Record<string, unknown>,
): PluginNavMenuEntry[] {
const out: PluginNavMenuEntry[] = []
for (const item of items) {
const section = item.section || 'system'
const navMenu = navMenuFromPluginSidebarItem(item, t)
if (!filterMenusByPermission([navMenu], userPermissions).length) {
continue
}
out.push({ navMenu, section })
}
return out
}

View File

@@ -0,0 +1,52 @@
type SiteIconCacheEntry = {
expiresAt: number
value: string
}
const SITE_ICON_CACHE_TTL = 10 * 60 * 1000
const siteIconCache = new Map<string, SiteIconCacheEntry>()
const siteIconRequests = new Map<string, Promise<string>>()
function readCachedSiteIcon(key: string): string | undefined {
const entry = siteIconCache.get(key)
if (!entry) {
return undefined
}
if (entry.expiresAt <= Date.now()) {
siteIconCache.delete(key)
return undefined
}
return entry.value
}
export async function getCachedSiteIcon(siteId: string | number, loader: () => Promise<string>): Promise<string> {
const cacheKey = String(siteId)
const cachedIcon = readCachedSiteIcon(cacheKey)
if (cachedIcon !== undefined) {
return cachedIcon
}
const currentRequest = siteIconRequests.get(cacheKey)
if (currentRequest) {
return currentRequest
}
const request = loader()
.then(icon => {
siteIconCache.set(cacheKey, {
expiresAt: Date.now() + SITE_ICON_CACHE_TTL,
value: icon,
})
return icon
})
.finally(() => {
siteIconRequests.delete(cacheKey)
})
siteIconRequests.set(cacheKey, request)
return request
}

Some files were not shown because too many files have changed in this diff Show More