update build action

This commit is contained in:
2025-03-18 20:42:25 +08:00
parent eb43d88e44
commit 1b6ec67ba8
13 changed files with 155 additions and 122 deletions

View File

@@ -47,8 +47,8 @@ defineExpose({ setCss })
const { customCss, isOBS = true } = defineProps<{
customCss?: string
isOBS?: boolean,
active: boolean,
visible: boolean,
active?: boolean,
visible?: boolean,
}>()
const messageRender = ref()

View File

@@ -88,8 +88,13 @@ async function get() {
if (data.code == 200) {
return data.data
}
} catch (err) {}
return {} as { songs: SongRequestInfo[]; setting: Setting_LiveRequest }
} catch (err) {
console.log(err)
}
return {
songs: [],
setting: {} as Setting_LiveRequest,
} as { songs: SongRequestInfo[]; setting: Setting_LiveRequest }
}
const allowGuardTypes = computed(() => {
const types = []
@@ -148,19 +153,12 @@ onUnmounted(() => {
<NDivider class="live-request-divider">
<p class="live-request-header-count">已有 {{ activeSongs.length ?? 0 }} </p>
</NDivider>
<div
class="live-request-processing-container"
:singing="songs.findIndex((s) => s.status == SongRequestStatus.Singing) > -1"
:from="singing?.from as number"
:status="singing?.status as number"
>
<div class="live-request-processing-container"
:singing="songs.findIndex((s) => s.status == SongRequestStatus.Singing) > -1" :from="singing?.from as number"
:status="singing?.status as number">
<div class="live-request-processing-prefix"></div>
<template v-if="singing">
<img
class="live-request-processing-avatar"
:src="singing?.user?.face"
referrerpolicy="no-referrer"
/>
<img class="live-request-processing-avatar" :src="singing?.user?.face" referrerpolicy="no-referrer" />
<p class="live-request-processing-song-name">{{ singing?.songName }}</p>
<p class="live-request-processing-name">{{ singing?.user?.name }}</p>
</template>
@@ -169,22 +167,10 @@ onUnmounted(() => {
</div>
<div class="live-request-content" ref="listContainerRef">
<template v-if="activeSongs.length > 0">
<Vue3Marquee
class="live-request-list"
:key="key"
vertical
:duration="20"
:pause="!isMoreThanContainer"
:style="`height: ${height}px;width: ${width}px;`"
>
<div
class="live-request-list-item"
:from="song.from as number"
:status="song.status as number"
v-for="(song, index) in activeSongs"
:key="song.id"
:style="`height: ${itemHeight}px`"
>
<Vue3Marquee class="live-request-list" :key="key" vertical :duration="20" :pause="!isMoreThanContainer"
:style="`height: ${height}px;width: ${width}px;`">
<div class="live-request-list-item" :from="song.from as number" :status="song.status as number"
v-for="(song, index) in activeSongs" :key="song.id" :style="`height: ${itemHeight}px`">
<div class="live-request-list-item-index" :index="index + 1">
{{ index + 1 }}
</div>
@@ -194,11 +180,8 @@ onUnmounted(() => {
<p v-if="settings.showUserName" class="live-request-list-item-name">
{{ song.from == SongRequestFrom.Manual ? '主播添加' : song.user?.name }}
</p>
<div
v-if="settings.showFanMadelInfo"
class="live-request-list-item-level"
:has-level="(song.user?.fans_medal_level ?? 0) > 0"
>
<div v-if="settings.showFanMadelInfo" class="live-request-list-item-level"
:has-level="(song.user?.fans_medal_level ?? 0) > 0">
{{ `${song.user?.fans_medal_name} ${song.user?.fans_medal_level}` }}
</div>
</div>
@@ -210,13 +193,8 @@ onUnmounted(() => {
</div>
</div>
<div class="live-request-footer" v-if="settings.showRequireInfo" ref="footerRef">
<Vue3Marquee
:key="key"
ref="footerListRef"
class="live-request-footer-marquee"
:duration="10"
animate-on-overflow-only
>
<Vue3Marquee :key="key" ref="footerListRef" class="live-request-footer-marquee" :duration="10"
animate-on-overflow-only>
<span class="live-request-tag" type="prefix">
<div class="live-request-tag-key">前缀</div>
<div class="live-request-tag-value">
@@ -264,6 +242,7 @@ onUnmounted(() => {
border-radius: 10px;
color: white;
}
.live-request-header {
margin: 0;
color: #fff;
@@ -276,17 +255,20 @@ onUnmounted(() => {
0 0 30px #61606086,
0 0 40px rgba(64, 156, 179, 0.555);
}
.live-request-header-count {
color: #ffffffbd;
text-align: center;
font-size: 14px;
}
.live-request-divider {
margin: 0 auto;
margin-top: -15px;
margin-bottom: -15px;
width: 90%;
}
.live-request-processing-container {
height: 35px;
margin: 0 10px 0 10px;
@@ -294,34 +276,41 @@ onUnmounted(() => {
align-items: center;
gap: 10px;
}
.live-request-processing-empty {
font-weight: bold;
font-style: italic;
color: #ffffffbe;
}
.live-request-processing-prefix {
border: 2px solid rgb(231, 231, 231);
height: 30px;
width: 10px;
border-radius: 10px;
}
.live-request-processing-container[singing='true'] .live-request-processing-prefix {
background-color: #75c37f;
animation: animated-border 3s linear infinite;
}
.live-request-processing-container[singing='false'] .live-request-processing-prefix {
background-color: #c37575;
}
.live-request-processing-avatar {
height: 30px;
border-radius: 50%;
/* 添加无限旋转动画 */
animation: rotate 20s linear infinite;
}
/* 网页点歌 */
.live-request-processing-container[from='3'] .live-request-processing-avatar {
display: none;
}
.live-request-processing-song-name {
font-size: large;
font-weight: bold;
@@ -329,21 +318,26 @@ onUnmounted(() => {
white-space: nowrap;
max-width: 80%;
}
.live-request-processing-name {
font-size: 12px;
font-style: italic;
}
@keyframes rotate {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
.n-divider__line {
background-color: #ffffffd5;
}
.live-request-content {
background-color: #0f0f0f4f;
margin: 10px;
@@ -352,9 +346,11 @@ onUnmounted(() => {
border-radius: 10px;
overflow-x: hidden;
}
.marquee {
justify-items: left;
}
.live-request-list-item {
display: flex;
width: 100%;
@@ -364,6 +360,7 @@ onUnmounted(() => {
justify-content: left;
gap: 10px;
}
.live-request-list-item-song-name {
font-size: 18px;
font-weight: bold;
@@ -380,13 +377,13 @@ onUnmounted(() => {
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[from='1'] {}
.live-request-list-item-name {
font-style: italic;
@@ -397,6 +394,7 @@ onUnmounted(() => {
margin-left: auto;
}
.live-request-list-item-index {
text-align: center;
height: 18px;
@@ -407,6 +405,7 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993);
font-size: 12px;
}
.live-request-list-item-level {
text-align: center;
height: 18px;
@@ -417,9 +416,11 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993);
font-size: 12px;
}
.live-request-list-item-level[has-level='false'] {
display: none;
}
.live-request-footer {
margin: 0 5px 5px 5px;
height: 60px;
@@ -428,6 +429,7 @@ onUnmounted(() => {
display: flex;
align-items: center;
}
.live-request-tag {
display: flex;
margin: 5px 0 5px 5px;
@@ -440,30 +442,36 @@ onUnmounted(() => {
flex-direction: column;
justify-content: left;
}
.live-request-tag-key {
font-style: italic;
color: rgb(211, 211, 211);
font-size: 12px;
}
.live-request-tag-value {
font-size: 14px;
}
.live-request-list-item-index[index='1'] {
background-color: #ebc34c;
color: white;
font-weight: bold;
text-shadow: 0 0 6px #ebc34c;
}
.live-request-list-item-index[index='2'] {
background-color: #c0c0c0;
color: white;
font-weight: bold;
}
.live-request-list-item-index[index='3'] {
background-color: #b87333;
color: white;
font-weight: bold;
}
@keyframes animated-border {
0% {
box-shadow: 0 0 0px #589580;

View File

@@ -16,8 +16,8 @@ import { Vue3Marquee } from 'vue3-marquee'
const props = defineProps<{
id?: number,
active: boolean,
visible: boolean,
active?: boolean,
visible?: boolean,
}>()
const message = useMessage()

View File

@@ -16,8 +16,8 @@ type WaitMusicInfo = {
const props = defineProps<{
id?: number,
active: boolean,
visible: boolean,
active?: boolean,
visible?: boolean,
}>()
const message = useMessage()
@@ -52,7 +52,7 @@ async function get() {
if (data.code == 200) {
return data.data
}
} catch (err) {}
} catch (err) { }
return originSongs.value
}
const isMoreThanContainer = computed(() => {
@@ -85,18 +85,13 @@ onUnmounted(() => {
<NDivider class="music-request-divider">
<p class="music-request-header-count">已有 {{ originSongs.waiting.length ?? 0 }} </p>
</NDivider>
<div
class="music-request-singing-container"
:playing="originSongs.playing ? 'true' : 'false'"
:from="originSongs.playing?.music.from ?? -1"
>
<div class="music-request-singing-container" :playing="originSongs.playing ? 'true' : 'false'"
:from="originSongs.playing?.music.from ?? -1">
<div class="music-request-singing-prefix"></div>
<template v-if="originSongs.playing">
<img
class="music-request-singing-avatar"
<img class="music-request-singing-avatar"
:src="originSongs.playing.music.cover ?? AVATAR_URL + originSongs.playing.from?.uid"
referrerpolicy="no-referrer"
/>
referrerpolicy="no-referrer" />
<p class="music-request-singing-song-name">{{ originSongs.playing.music.name }}</p>
<p class="music-request-singing-name">{{ originSongs.playing.from?.name }}</p>
</template>
@@ -105,21 +100,10 @@ onUnmounted(() => {
</div>
<div class="music-request-content" ref="listContainerRef">
<template v-if="originSongs.waiting.length > 0">
<Vue3Marquee
class="music-request-list"
:key="key"
vertical
:pause="!isMoreThanContainer"
:duration="20"
:style="`height: ${height}px;width: ${width}px;`"
>
<span
class="music-request-list-item"
:from="item.music.from as number"
v-for="(item, index) in originSongs.waiting"
:key="item.music.id"
:style="`height: ${itemHeight}px`"
>
<Vue3Marquee class="music-request-list" :key="key" vertical :pause="!isMoreThanContainer" :duration="20"
:style="`height: ${height}px;width: ${width}px;`">
<span class="music-request-list-item" :from="item.music.from as number"
v-for="(item, index) in originSongs.waiting" :key="item.music.id" :style="`height: ${itemHeight}px`">
<div class="music-request-list-item-index" :index="index + 1">
{{ index + 1 }}
</div>
@@ -149,6 +133,7 @@ onUnmounted(() => {
border-radius: 10px;
color: white;
}
.music-request-header {
margin: 0;
color: #fff;
@@ -161,17 +146,20 @@ onUnmounted(() => {
0 0 30px #61606086,
0 0 40px rgba(64, 156, 179, 0.555);
}
.music-request-header-count {
color: #ffffffbd;
text-align: center;
font-size: 14px;
}
.music-request-divider {
margin: 0 auto;
margin-top: -15px;
margin-bottom: -15px;
width: 90%;
}
.music-request-singing-container {
height: 35px;
margin: 0 10px 0 10px;
@@ -179,34 +167,41 @@ onUnmounted(() => {
align-items: center;
gap: 10px;
}
.music-request-singing-empty {
font-weight: bold;
font-style: italic;
color: #ffffffbe;
}
.music-request-singing-prefix {
border: 2px solid rgb(231, 231, 231);
height: 30px;
width: 10px;
border-radius: 10px;
}
.music-request-singing-container[playing='true'] .music-request-singing-prefix {
background-color: #75c37f;
animation: animated-border 3s linear infinite;
}
.music-request-singing-container[playing='false'] .music-request-singing-prefix {
background-color: #c37575;
}
.music-request-singing-avatar {
height: 30px;
border-radius: 50%;
/* 添加无限旋转动画 */
animation: rotate 20s linear infinite;
}
/* 网页点歌 */
.music-request-singing-container[from='3'] .music-request-singing-avatar {
display: none;
}
.music-request-singing-song-name {
font-size: large;
font-weight: bold;
@@ -214,21 +209,26 @@ onUnmounted(() => {
white-space: nowrap;
max-width: 80%;
}
.music-request-singing-name {
font-size: 12px;
font-style: italic;
}
@keyframes rotate {
0% {
transform: rotate(0);
}
100% {
transform: rotate(360deg);
}
}
.n-divider__line {
background-color: #ffffffd5;
}
.music-request-content {
background-color: #0f0f0f4f;
margin: 10px;
@@ -237,9 +237,11 @@ onUnmounted(() => {
border-radius: 10px;
overflow-x: hidden;
}
.marquee {
justify-items: left;
}
.music-request-list-item {
display: flex;
width: 100%;
@@ -249,6 +251,7 @@ onUnmounted(() => {
justify-content: left;
gap: 10px;
}
.music-request-list-item-song-name {
font-size: 18px;
font-weight: bold;
@@ -265,13 +268,13 @@ onUnmounted(() => {
color: #d2d8d6;
font-size: 12px;
}
.music-request-list-item[from='0'] .music-request-list-item-avatar {
display: none;
}
/* 弹幕点歌 */
.music-request-list-item[from='1'] {
}
.music-request-list-item[from='1'] {}
.music-request-list-item-name {
font-style: italic;
@@ -282,6 +285,7 @@ onUnmounted(() => {
margin-left: auto;
}
.music-request-list-item-index {
text-align: center;
height: 18px;
@@ -292,6 +296,7 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993);
font-size: 12px;
}
.music-request-list-item-level {
text-align: center;
height: 18px;
@@ -302,9 +307,11 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993);
font-size: 12px;
}
.music-request-list-item-level[has-level='false'] {
display: none;
}
.music-request-tag {
display: flex;
margin: 5px 0 5px 5px;
@@ -317,14 +324,17 @@ onUnmounted(() => {
flex-direction: column;
justify-content: left;
}
.music-request-tag-key {
font-style: italic;
color: rgb(211, 211, 211);
font-size: 12px;
}
.music-request-tag-value {
font-size: 14px;
}
@keyframes animated-border {
0% {
box-shadow: 0 0 0px #589580;

View File

@@ -9,8 +9,8 @@ import { useWebRTC } from '@/store/useRTC'
const props = defineProps<{
id?: number,
active: boolean,
visible: boolean,
active?: boolean,
visible?: boolean,
}>()
const hash = ref('')

View File

@@ -20,8 +20,8 @@ import { Vue3Marquee } from 'vue3-marquee'
const props = defineProps<{
id?: number,
active: boolean,
visible: boolean,
active?: boolean,
visible?: boolean,
}>()
const message = useMessage()