From 0d5a657d5c6cbc937bd5081bb68f47366f579ba5 Mon Sep 17 00:00:00 2001 From: Megghy Date: Sun, 18 May 2025 22:02:18 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E6=9B=B4=E6=96=B0=E7=9B=B4=E6=92=AD?= =?UTF-8?q?=E8=AF=B7=E6=B1=82=E7=9B=B8=E5=85=B3=E7=BB=84=E4=BB=B6=E5=92=8C?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 在useLiveRequest.ts中使用FunctionTypes替代硬编码的功能标识 - 在SongListManageView.vue中添加调试信息输出 - 在ClassicRequestOBS.vue中优化歌曲请求列表的样式和动画效果 - 在SongRequestSettings.vue中新增OBS相关设置项,支持动态配置 --- src/composables/useLiveRequest.ts | 5 +- src/views/manage/SongListManageView.vue | 5 + .../obs/live-request/ClassicRequestOBS.vue | 100 ++++++++++-------- .../components/SongRequestSettings.vue | 82 +++++++++++++- 4 files changed, 141 insertions(+), 51 deletions(-) diff --git a/src/composables/useLiveRequest.ts b/src/composables/useLiveRequest.ts index 017f787..7956bab 100644 --- a/src/composables/useLiveRequest.ts +++ b/src/composables/useLiveRequest.ts @@ -8,6 +8,7 @@ import { DanmakuUserInfo, EventDataTypes, EventModel, + FunctionTypes, QueueSortType, SongRequestFrom, SongRequestInfo, @@ -392,10 +393,9 @@ export const useLiveRequest = defineStore('songRequest', () => { } function checkMessage(msg: string) { - if (accountInfo.value?.settings?.enableFunctions?.includes(6) != true) { + if (accountInfo.value?.settings?.enableFunctions?.includes(FunctionTypes.LiveRequest) != true) { return false } - const prefix = accountInfo.value?.settings?.songRequest?.orderPrefix || defaultPrefix.value return msg.trim().toLowerCase().startsWith(prefix.toLowerCase()) } @@ -424,6 +424,7 @@ export const useLiveRequest = defineStore('songRequest', () => { } function onGetDanmaku(danmaku: EventModel) { + console.log(checkMessage(danmaku.msg)) if (checkMessage(danmaku.msg)) { addSong(danmaku) } diff --git a/src/views/manage/SongListManageView.vue b/src/views/manage/SongListManageView.vue index fd5ee30..2f283b1 100644 --- a/src/views/manage/SongListManageView.vue +++ b/src/views/manage/SongListManageView.vue @@ -615,7 +615,12 @@ function parseExcelFile() { * 解析多值字段(如作者、标签等) */ function parseMultipleValues(value: string): string[] { + console.log(value) if (!value) return [] + // @ts-ignore + if (value instanceof Boolean) { + value = value.toString() + } return value ?.replace('/', '/') .replace(',', ',') diff --git a/src/views/obs/live-request/ClassicRequestOBS.vue b/src/views/obs/live-request/ClassicRequestOBS.vue index ef4e11b..dc00b2e 100644 --- a/src/views/obs/live-request/ClassicRequestOBS.vue +++ b/src/views/obs/live-request/ClassicRequestOBS.vue @@ -142,7 +142,7 @@ onUnmounted(() => { ref="listInnerRef" class="live-request-list" :class="{ animating: isMoreThanContainer }" - :style="`width: ${width}px;`" + :style="`width: ${width}px; --item-parent-width: ${width}px`" >
{ > {{ index + 1 }}
-
- {{ song.songName || '未知歌曲' }} -
-
- {{ song.from == SongRequestFrom.Manual ? '主播添加' : song.user?.name || '未知用户' }} -
-
- {{ `${song.user?.fans_medal_name || ''} ${song.user?.fans_medal_level || ''}` }} +
+
+
+ {{ song.songName || '未知歌曲' }} +
+
+ {{ song.from == SongRequestFrom.Manual ? '主播添加' : song.user?.name || '未知用户' }} +
+
+ {{ `${song.user?.fans_medal_name || ''} ${song.user?.fans_medal_level || ''}` }} +
+
@@ -420,55 +425,54 @@ onUnmounted(() => { align-self: flex-start; position: relative; align-items: center; - justify-content: left; - gap: 5px; padding: 4px 6px; margin-bottom: 5px; background-color: rgba(0, 0, 0, 0.2); border-radius: 6px; min-height: 36px; - flex-wrap: wrap; + overflow: hidden; + gap: 5px; +} + +.live-request-list-item-scroll-view { + flex-grow: 1; + min-width: 0; + overflow: hidden; + position: relative; +} + +.live-request-list-item-inner-scroll { + display: flex; + align-items: center; + gap: 5px; + width: max-content; + animation: item-horizontal-scroll 5s infinite alternate ease-in-out; +} + +.live-request-list-item:hover .live-request-list-item-inner-scroll { + animation-play-state: paused; +} + +@keyframes item-horizontal-scroll { + from { + transform: translateX(0px); + } + to { + transform: translateX(min(0px, calc(var(--item-parent-width) - 100% - 5px))); + } } .live-request-list-item-song-name { font-size: 16px; font-weight: bold; - overflow: hidden; - text-overflow: ellipsis; white-space: nowrap; - max-width: 60%; - flex-grow: 1; margin-right: 5px; } -/* 只有在小屏幕/容器较窄时才允许换行 */ -@media (max-width: 300px) { - .live-request-list-item-song-name { - white-space: normal; - max-width: 100%; - } -} - -/* 手动添加 */ -.live-request-list-item[from='0'] .live-request-list-item-name { - font-style: italic; - font-weight: bold; - color: #d2d8d6; - font-size: 12px; -} - -.live-request-list-item[from='0'] .live-request-list-item-avatar { - display: none; -} - -/* 弹幕点歌 */ -.live-request-list-item[from='1'] {} - .live-request-list-item-name { font-style: italic; font-size: 12px; color: rgba(204, 204, 204, 0.993); - text-overflow: ellipsis; white-space: nowrap; margin-left: auto; background-color: rgba(0, 0, 0, 0.2); @@ -487,6 +491,7 @@ onUnmounted(() => { background-color: #0f0f0f48; color: rgba(204, 204, 204, 0.993); font-size: 12px; + flex-shrink: 0; } .live-request-list-item-level { @@ -498,6 +503,7 @@ onUnmounted(() => { background-color: rgba(0, 0, 0, 0.3); color: rgba(204, 204, 204, 0.993); font-size: 12px; + white-space: nowrap; } .live-request-list-item-level[has-level='false'] { diff --git a/src/views/open_live/components/SongRequestSettings.vue b/src/views/open_live/components/SongRequestSettings.vue index 2c1554d..c2712a2 100644 --- a/src/views/open_live/components/SongRequestSettings.vue +++ b/src/views/open_live/components/SongRequestSettings.vue @@ -1,5 +1,5 @@