From 6571c110989a069cc5391bd4eda348a51fc7c43c Mon Sep 17 00:00:00 2001 From: Yukino Song Date: Wed, 21 May 2025 00:44:38 +0800 Subject: [PATCH] Various webui fix fixes #742 Add save button for reordering instead of auto saving --- .../common/assets/web/PlatformLayout.vue | 14 +- src_assets/common/assets/web/apps.html | 130 +++++++++++------- src_assets/common/assets/web/config.html | 1 + .../assets/web/configs/tabs/General.vue | 1 + .../assets/web/public/assets/locale/en.json | 3 +- .../assets/web/public/assets/locale/zh.json | 1 + 6 files changed, 85 insertions(+), 65 deletions(-) diff --git a/src_assets/common/assets/web/PlatformLayout.vue b/src_assets/common/assets/web/PlatformLayout.vue index 31064fec..029b220b 100644 --- a/src_assets/common/assets/web/PlatformLayout.vue +++ b/src_assets/common/assets/web/PlatformLayout.vue @@ -8,17 +8,9 @@ const props = defineProps({ diff --git a/src_assets/common/assets/web/apps.html b/src_assets/common/assets/web/apps.html index 8b35f789..7e7acb3d 100644 --- a/src_assets/common/assets/web/apps.html +++ b/src_assets/common/assets/web/apps.html @@ -96,7 +96,7 @@ :key="app.uuid" :class="{dragover: app.dragover}" draggable="true" - @dragstart="onDragStart(i)" + @dragstart="onDragStart($event, i)" @dragenter="onDragEnter($event, app)" @dragover="onDragOver($event)" @dragleave="onDragLeave(app)" @@ -179,18 +179,17 @@ - - + + + - -
{{ $t('config.gamepad_desc') }}
@@ -427,44 +426,53 @@ -
- {{ $t('apps.env_sunshine_compatibility') }} -
+ + + - - - - - -
+ {{ $t('_common.see_more') }}
+ target="_blank" + class="text-decoration-none" + > + {{ $t('_common.see_more') }} + + + +
+ {{ $t('apps.env_sunshine_compatibility') }} +
+
- +
- +
@@ -473,7 +481,6 @@ import { initApp } from './init' import Navbar from './Navbar.vue' import Checkbox from './Checkbox.vue' - import Platformlayout from './PlatformLayout.vue' import { Dropdown } from 'bootstrap/dist/js/bootstrap' const newApp = { @@ -496,13 +503,10 @@ "gamepad": "" } - console.log(Platformlayout) - const app = createApp({ components: { Navbar, - Checkbox, - Platformlayout + Checkbox }, data() { return { @@ -516,7 +520,8 @@ coverCandidates: [], platform: "", currentApp: "", - draggingApp: -1 + draggingApp: -1, + listReordered: false }; }, created() { @@ -529,7 +534,12 @@ .then(r => this.platform = r.platform); }, methods: { - onDragStart(idx) { + onDragStart(e, idx) { + if (this.showEditForm) { + e.preventDefault(); + return; + } + this.draggingApp = idx; this.apps.push({}) }, @@ -575,8 +585,17 @@ this.apps.splice(idx, 0, draggedApp); - const reorderedUUIDs = this.apps.map(i => i.uuid); - reorderedUUIDs.pop(); + this.listReordered = true; + }, + saveOrder() { + this.actionDisabled = true; + + const reorderedUUIDs = this.apps.reduce((reordered, i) => { + if (i.uuid) { + reordered.push(i.uuid) + } + return reordered + }, []) fetch("./api/apps/reorder", { credentials: 'include', @@ -590,18 +609,23 @@ } }) .finally(() => { - this.loadApps(); - }); + return this.loadApps(); + }) + .finally(() => { + this.actionDisabled = false; + }) + }, loadApps() { - fetch("./api/apps", { + return fetch("./api/apps", { credentials: 'include' }) - .then(r => r.json()) - .then(r => { - this.apps = r.apps.filter(i => i.uuid).map(i => ({...i, launching: false, dragover: false})); - this.currentApp = r.current_app; - }); + .then(r => r.json()) + .then(r => { + this.apps = r.apps.filter(i => i.uuid).map(i => ({...i, launching: false, dragover: false})); + this.currentApp = r.current_app; + this.listReordered = false; + }); }, newApp() { this.editForm = Object.assign({}, newApp); diff --git a/src_assets/common/assets/web/config.html b/src_assets/common/assets/web/config.html index 8e6b7fa9..63a94c03 100644 --- a/src_assets/common/assets/web/config.html +++ b/src_assets/common/assets/web/config.html @@ -185,6 +185,7 @@ "install_steam_audio_drivers": "enabled", "keep_sink_default": "enabled", "auto_capture_sink": "enabled", + "stream_audio": "enabled", "adapter_name": "", "output_name": "", "fallback_mode": "", diff --git a/src_assets/common/assets/web/configs/tabs/General.vue b/src_assets/common/assets/web/configs/tabs/General.vue index d99ca253..e6122aaa 100644 --- a/src_assets/common/assets/web/configs/tabs/General.vue +++ b/src_assets/common/assets/web/configs/tabs/General.vue @@ -126,6 +126,7 @@ onMounted(() => { diff --git a/src_assets/common/assets/web/public/assets/locale/en.json b/src_assets/common/assets/web/public/assets/locale/en.json index 399bbbfb..f9510b72 100644 --- a/src_assets/common/assets/web/public/assets/locale/en.json +++ b/src_assets/common/assets/web/public/assets/locale/en.json @@ -39,7 +39,7 @@ "app_name": "Application Name", "app_name_desc": "Application Name, as shown on Moonlight", "applications_desc": "Applications are refreshed when a session is terminated.", - "applications_reorder_desc": "Drag and drop apps to reorder them. Any changes made will terminate the current running app.", + "applications_reorder_desc": "Drag and drop apps to reorder the apps. Any changes made will terminate the current running app.", "applications_title": "Applications", "auto_detach": "Continue streaming if the application exits quickly", "auto_detach_desc": "This will attempt to automatically detect launcher-type apps that close quickly after launching another program or instance of themselves. When a launcher-type app is detected, it is treated as a detached app.", @@ -102,6 +102,7 @@ "resolution_scale_factor_desc": "Scale the client requested resolution based on this factor. e.g. 2000x1000 with a factor of 120% will become 2400x1200. Overrides client requested factor when the number isn't 100%. This option won't affect client requested streaming resolution.", "run_as_desc": "This can be necessary for some applications that require administrator permissions to run properly. Might cause URL schemes to fail.", "save_failed": "Failed to save app: ", + "save_order": "Save Order", "use_app_identity": "Use App Identity", "use_app_identity_desc": "Use the app's own identity while creating virtual displays instead of client's. This is useful when you want display configuration for each APP separately.", "virtual_display": "Always use Virtual Display", diff --git a/src_assets/common/assets/web/public/assets/locale/zh.json b/src_assets/common/assets/web/public/assets/locale/zh.json index d40ce5fc..7ad0c4ea 100644 --- a/src_assets/common/assets/web/public/assets/locale/zh.json +++ b/src_assets/common/assets/web/public/assets/locale/zh.json @@ -103,6 +103,7 @@ "resolution_scale_factor_desc": "基于此比例缩放客户端请求的分辨率。例如 2000x1000 缩放 120% 将变成 2400x1200。当此项为非 100% 时覆盖客户端请求的缩放比例。此选项不会影响客户端请求的串流分辨率。", "run_as_desc": "这可能是某些需要管理员权限才能正常运行的应用程序所必需的。可能会导致 URL schemes 无法正常启动。", "save_failed": "保存APP失败：", + "save_order": "保存排序", "use_app_identity": "使用 App 身份", "use_app_identity_desc": "在创建虚拟显示器时使用 App 自身的身份，而非客户端的。这样可以针对 APP 进行单独的显示器组合配置。", "virtual_display": "总是使用虚拟显示器",