mirror of
https://github.com/Megghy/vtsuru.live.git
synced 2025-12-06 18:36:55 +08:00
fix attribute name
This commit is contained in:
@@ -9,9 +9,10 @@ import {
|
|||||||
export interface SongListConfigType {
|
export interface SongListConfigType {
|
||||||
userInfo: UserInfo | undefined
|
userInfo: UserInfo | undefined
|
||||||
biliInfo: any | undefined
|
biliInfo: any | undefined
|
||||||
songRequestSettings: Setting_LiveRequest
|
liveRequestSettings: Setting_LiveRequest
|
||||||
songRequestActive: SongRequestInfo[]
|
liveRequestActive: SongRequestInfo[]
|
||||||
data: SongsInfo[] | undefined
|
data: SongsInfo[] | undefined
|
||||||
|
config?: any
|
||||||
}
|
}
|
||||||
export interface SongListConfigTypeWithConfig<T> extends SongListConfigType {
|
export interface SongListConfigTypeWithConfig<T> extends SongListConfigType {
|
||||||
config?: T
|
config?: T
|
||||||
|
|||||||
@@ -658,7 +658,7 @@ onMounted(async () => {
|
|||||||
<Transition name="fade" mode="out-in">
|
<Transition name="fade" mode="out-in">
|
||||||
<div v-if="selectedComponent" :key="selectedTemplateData.Selected">
|
<div v-if="selectedComponent" :key="selectedTemplateData.Selected">
|
||||||
<component ref="dynamicConfigRef" @vue:mounted="getTemplateConfig" :is="selectedComponent"
|
<component ref="dynamicConfigRef" @vue:mounted="getTemplateConfig" :is="selectedComponent"
|
||||||
:user-info="accountInfo" :bili-info="biliUserInfo" :current-data="selectedTemplateData.Data"
|
:user-info="accountInfo" :bili-info="biliUserInfo" :data="selectedTemplateData.Data"
|
||||||
:config="selectedTemplateData.Config" />
|
:config="selectedTemplateData.Config" />
|
||||||
</div>
|
</div>
|
||||||
</Transition>
|
</Transition>
|
||||||
|
|||||||
@@ -5,7 +5,7 @@
|
|||||||
:is="ScheduleTemplateMap[componentType ?? ''].compoent"
|
:is="ScheduleTemplateMap[componentType ?? ''].compoent"
|
||||||
:bili-info="biliInfo"
|
:bili-info="biliInfo"
|
||||||
:user-info="userInfo"
|
:user-info="userInfo"
|
||||||
:currentData="currentData"
|
:data="currentData"
|
||||||
v-bind="$attrs"
|
v-bind="$attrs"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -1,9 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<NSpin v-if="isLoading" show />
|
<NSpin v-if="isLoading" show />
|
||||||
<component v-else ref="dynamicConfigRef" :config="currentConfig"
|
<component v-else ref="dynamicConfigRef" :config="selectedTemplateConfig?.name ? currentConfig : undefined"
|
||||||
:is="SongListTemplateMap[componentType ?? '']?.compoent" :user-info="userInfo" :bili-info="biliInfo"
|
:is="SongListTemplateMap[componentType ?? '']?.compoent" :user-info="userInfo" :bili-info="biliInfo"
|
||||||
:currentData="currentData" :live-request-settings="settings" :live-request-active="songsActive"
|
:data="currentData" :live-request-settings="settings" :live-request-active="songsActive" @request-song="requestSong"
|
||||||
@request-song="requestSong" v-bind="$attrs" />
|
v-bind="$attrs" />
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
@@ -87,6 +87,7 @@ async function getSongs() {
|
|||||||
}
|
}
|
||||||
async function getConfig() {
|
async function getConfig() {
|
||||||
isLoading.value = true
|
isLoading.value = true
|
||||||
|
console.log(selectedTemplateConfig.value!.name)
|
||||||
await DownloadConfig(selectedTemplateConfig.value!.name)
|
await DownloadConfig(selectedTemplateConfig.value!.name)
|
||||||
.then((data) => {
|
.then((data) => {
|
||||||
if (data.msg) {
|
if (data.msg) {
|
||||||
|
|||||||
@@ -26,8 +26,9 @@ export const Config: TemplateConfig<ConfigType> = {
|
|||||||
name: '封面',
|
name: '封面',
|
||||||
type: 'image',
|
type: 'image',
|
||||||
imageLimit: 1,
|
imageLimit: 1,
|
||||||
|
key: 'cover',
|
||||||
onUploaded: (url, config) => {
|
onUploaded: (url, config) => {
|
||||||
config.cover = url instanceof String ? (url as string) : url[0]
|
config.cover = url[0]
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|||||||
@@ -20,49 +20,44 @@ const message = useMessage()
|
|||||||
const buttons = (song: SongsInfo) => [
|
const buttons = (song: SongsInfo) => [
|
||||||
accountInfo.value?.id != props.userInfo?.id
|
accountInfo.value?.id != props.userInfo?.id
|
||||||
? h(
|
? h(
|
||||||
NTooltip,
|
NTooltip,
|
||||||
{ trigger: 'hover' },
|
{ trigger: 'hover' },
|
||||||
{
|
{
|
||||||
trigger: () =>
|
trigger: () =>
|
||||||
h(
|
h(
|
||||||
NButton,
|
NButton,
|
||||||
{
|
{
|
||||||
type: 'warning',
|
type: 'warning',
|
||||||
size: 'small',
|
size: 'small',
|
||||||
circle: true,
|
circle: true,
|
||||||
loading: isLoading.value == song.key,
|
loading: isLoading.value == song.key,
|
||||||
disabled: !accountInfo,
|
disabled: !accountInfo,
|
||||||
onClick: () => {
|
onClick: () => {
|
||||||
isLoading.value = song.key
|
isLoading.value = song.key
|
||||||
emits('requestSong', song)
|
emits('requestSong', song)
|
||||||
isLoading.value = ''
|
isLoading.value = ''
|
||||||
},
|
|
||||||
},
|
},
|
||||||
{
|
},
|
||||||
icon: () => h(NIcon, { component: CloudAdd20Filled }),
|
{
|
||||||
},
|
icon: () => h(NIcon, { component: CloudAdd20Filled }),
|
||||||
),
|
},
|
||||||
default: () =>
|
),
|
||||||
!props.songRequestSettings.allowFromWeb || song.options
|
default: () =>
|
||||||
? '点歌 | 用户不允许从网页点歌, 点击后将复制点歌内容到剪切板'
|
!props.liveRequestSettings.allowFromWeb || song.options
|
||||||
: !accountInfo
|
? '点歌 | 用户不允许从网页点歌, 点击后将复制点歌内容到剪切板'
|
||||||
? '点歌 | 你需要登录后才能点歌'
|
: !accountInfo
|
||||||
: '点歌',
|
? '点歌 | 你需要登录后才能点歌'
|
||||||
},
|
: '点歌',
|
||||||
)
|
},
|
||||||
|
)
|
||||||
: undefined,
|
: undefined,
|
||||||
]
|
]
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<NDivider style="margin-top: 10px" />
|
<NDivider style="margin-top: 10px" />
|
||||||
<SongList
|
<SongList v-if="data" :songs="data ?? []" :is-self="accountInfo?.id == userInfo?.id" :extraButton="buttons"
|
||||||
v-if="data"
|
v-bind="$attrs" />
|
||||||
:songs="data ?? []"
|
|
||||||
:is-self="accountInfo?.id == userInfo?.id"
|
|
||||||
:extraButton="buttons"
|
|
||||||
v-bind="$attrs"
|
|
||||||
/>
|
|
||||||
<NCollapse v-if="userInfo?.canRequestSong">
|
<NCollapse v-if="userInfo?.canRequestSong">
|
||||||
<NCollapseItem title="点歌列表">
|
<NCollapseItem title="点歌列表">
|
||||||
<NCard size="small" embedded>
|
<NCard size="small" embedded>
|
||||||
|
|||||||
@@ -100,72 +100,52 @@ function loadMore() {
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div
|
<div :style="{
|
||||||
:style="{
|
display: 'flex',
|
||||||
display: 'flex',
|
justifyContent: 'center',
|
||||||
justifyContent: 'center',
|
flexDirection: windowSize.width.value > 900 ? 'row' : 'column',
|
||||||
flexDirection: windowSize.width.value > 900 ? 'row' : 'column',
|
gap: '10px',
|
||||||
gap: '10px',
|
width: '100%',
|
||||||
width: '100%',
|
}">
|
||||||
}"
|
|
||||||
>
|
|
||||||
<NCard size="small" :style="{ width: windowSize.width.value > 900 ? '400px' : '100%' }">
|
<NCard size="small" :style="{ width: windowSize.width.value > 900 ? '400px' : '100%' }">
|
||||||
<NCollapseTransition>
|
<NCollapseTransition>
|
||||||
<SongPlayer v-if="selectedSong" :song="selectedSong" v-model:is-lrc-loading="isLrcLoading" />
|
<SongPlayer v-if="selectedSong" :song="selectedSong" v-model:is-lrc-loading="isLrcLoading" />
|
||||||
</NCollapseTransition>
|
</NCollapseTransition>
|
||||||
<NDivider> 标签 </NDivider>
|
<NDivider> 标签 </NDivider>
|
||||||
<NSpace>
|
<NSpace>
|
||||||
<NButton
|
<NButton v-for="tag in tags" :key="tag" size="small" secondary
|
||||||
v-for="tag in tags"
|
|
||||||
:key="tag"
|
|
||||||
size="small"
|
|
||||||
secondary
|
|
||||||
:type="selectedTag == tag ? 'primary' : 'default'"
|
:type="selectedTag == tag ? 'primary' : 'default'"
|
||||||
@click="selectedTag == tag ? (selectedTag = '') : (selectedTag = tag)"
|
@click="selectedTag == tag ? (selectedTag = '') : (selectedTag = tag)">
|
||||||
>
|
|
||||||
{{ tag }}
|
{{ tag }}
|
||||||
</NButton>
|
</NButton>
|
||||||
</NSpace>
|
</NSpace>
|
||||||
<NDivider> 搜索歌曲 </NDivider>
|
<NDivider> 搜索歌曲 </NDivider>
|
||||||
<NSpace vertical>
|
<NSpace vertical>
|
||||||
<NInput v-model:value="searchKeyword" placeholder="歌名" clearable />
|
<NInput v-model:value="searchKeyword" placeholder="歌名" clearable />
|
||||||
<NSelect
|
<NSelect v-model:value="selectedAuthor" :options="authors.map((a) => {
|
||||||
v-model:value="selectedAuthor"
|
return { label: a, value: a }
|
||||||
:options="
|
})
|
||||||
authors.map((a) => {
|
" placeholder="选择歌手" clearable />
|
||||||
return { label: a, value: a }
|
|
||||||
})
|
|
||||||
"
|
|
||||||
placeholder="选择歌手"
|
|
||||||
clearable
|
|
||||||
/>
|
|
||||||
<NDivider />
|
<NDivider />
|
||||||
<LiveRequestOBS
|
<LiveRequestOBS v-if="userInfo?.extra?.enableFunctions.includes(FunctionTypes.SongRequest)"
|
||||||
v-if="userInfo?.extra?.enableFunctions.includes(FunctionTypes.SongRequest)"
|
:id="userInfo?.id" />
|
||||||
:id="userInfo?.id"
|
|
||||||
/>
|
|
||||||
</NSpace>
|
</NSpace>
|
||||||
</NCard>
|
</NCard>
|
||||||
<NEmpty v-if="!data || songs?.length == 0" description="暂无曲目" style="max-width: 0 auto" />
|
<NEmpty v-if="!data || songs?.length == 0" description="暂无曲目" style="max-width: 0 auto" />
|
||||||
<NScrollbar
|
<NScrollbar v-else ref="container" :style="{
|
||||||
v-else
|
flexGrow: 1,
|
||||||
ref="container"
|
height: windowSize.width.value > 900 ? '90vh' : '800px',
|
||||||
:style="{
|
overflowY: 'auto',
|
||||||
flexGrow: 1,
|
overflowX: 'hidden',
|
||||||
height: windowSize.width.value > 900 ? '90vh' : '800px',
|
}" @scroll="onScroll">
|
||||||
overflowY: 'auto',
|
|
||||||
overflowX: 'hidden',
|
|
||||||
}"
|
|
||||||
@scroll="onScroll"
|
|
||||||
>
|
|
||||||
<NGrid cols="1 600:2 900:3 1200:4" x-gap="10" y-gap="10" responsive="self">
|
<NGrid cols="1 600:2 900:3 1200:4" x-gap="10" y-gap="10" responsive="self">
|
||||||
<NGridItem v-for="item in songs" :key="item.key">
|
<NGridItem v-for="item in songs" :key="item.key">
|
||||||
<NCard size="small" style="height: 200px; min-width: 300px">
|
<NCard size="small" style="height: 200px; min-width: 300px">
|
||||||
<template #header>
|
<template #header>
|
||||||
<NSpace :wrap="false" align="center">
|
<NSpace :wrap="false" align="center">
|
||||||
<div
|
<div
|
||||||
:style="`border-radius: 4px; background-color: ${item.options ? '#bd5757' : '#577fb8'}; width: 7px; height: 20px`"
|
:style="`border-radius: 4px; background-color: ${item.options ? '#bd5757' : '#577fb8'}; width: 7px; height: 20px`">
|
||||||
></div>
|
</div>
|
||||||
<NEllipsis>
|
<NEllipsis>
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</NEllipsis>
|
</NEllipsis>
|
||||||
@@ -174,11 +154,8 @@ function loadMore() {
|
|||||||
<NSpace vertical>
|
<NSpace vertical>
|
||||||
<NSpace v-if="(item.author?.length ?? 0) > 0" :size="0">
|
<NSpace v-if="(item.author?.length ?? 0) > 0" :size="0">
|
||||||
<div v-for="(author, index) in item.author" v-bind:key="author">
|
<div v-for="(author, index) in item.author" v-bind:key="author">
|
||||||
<NButton
|
<NButton size="small" text
|
||||||
size="small"
|
@click="selectedAuthor == author ? (selectedAuthor = undefined) : (selectedAuthor = author)">
|
||||||
text
|
|
||||||
@click="selectedAuthor == author ? (selectedAuthor = undefined) : (selectedAuthor = author)"
|
|
||||||
>
|
|
||||||
<NText depth="3" :style="{ color: selectedAuthor == author ? '#82bcd3' : '' }">
|
<NText depth="3" :style="{ color: selectedAuthor == author ? '#82bcd3' : '' }">
|
||||||
{{ author }}
|
{{ author }}
|
||||||
</NText>
|
</NText>
|
||||||
@@ -195,11 +172,9 @@ function loadMore() {
|
|||||||
<template v-if="item.options">
|
<template v-if="item.options">
|
||||||
<NSpace>
|
<NSpace>
|
||||||
<NTag v-if="item.options?.scMinPrice" size="small" type="error" :bordered="false">
|
<NTag v-if="item.options?.scMinPrice" size="small" type="error" :bordered="false">
|
||||||
SC | {{ item.options?.scMinPrice }}</NTag
|
SC | {{ item.options?.scMinPrice }}</NTag>
|
||||||
>
|
|
||||||
<NTag v-if="item.options?.fanMedalMinLevel" size="small" type="info" :bordered="false">
|
<NTag v-if="item.options?.fanMedalMinLevel" size="small" type="info" :bordered="false">
|
||||||
粉丝牌 | {{ item.options?.fanMedalMinLevel }}</NTag
|
粉丝牌 | {{ item.options?.fanMedalMinLevel }}</NTag>
|
||||||
>
|
|
||||||
<NTag v-if="item.options?.needZongdu" size="small" :color="{ color: GetGuardColor(1) }">
|
<NTag v-if="item.options?.needZongdu" size="small" :color="{ color: GetGuardColor(1) }">
|
||||||
总督
|
总督
|
||||||
</NTag>
|
</NTag>
|
||||||
@@ -215,12 +190,8 @@ function loadMore() {
|
|||||||
<NSpace align="center" :wrap="false">
|
<NSpace align="center" :wrap="false">
|
||||||
<NTooltip v-if="item.url">
|
<NTooltip v-if="item.url">
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<NButton
|
<NButton size="small" @click="selectedSong = item" type="success"
|
||||||
size="small"
|
:loading="isLrcLoading == item.key">
|
||||||
@click="selectedSong = item"
|
|
||||||
type="success"
|
|
||||||
:loading="isLrcLoading == item.key"
|
|
||||||
>
|
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<NIcon :component="Play24Filled" />
|
<NIcon :component="Play24Filled" />
|
||||||
</template>
|
</template>
|
||||||
@@ -230,25 +201,20 @@ function loadMore() {
|
|||||||
</NTooltip>
|
</NTooltip>
|
||||||
<NTooltip>
|
<NTooltip>
|
||||||
<template #trigger>
|
<template #trigger>
|
||||||
<NButton
|
<NButton size="small" @click="() => {
|
||||||
size="small"
|
isLoading = item.key
|
||||||
@click="
|
emits('requestSong', item)
|
||||||
() => {
|
isLoading = ''
|
||||||
isLoading = item.key
|
}
|
||||||
emits('requestSong', item)
|
" :type="liveRequestSettings?.allowFromWeb == false || item.options ? 'warning' : 'info'"
|
||||||
isLoading = ''
|
:loading="isLoading == item.key">
|
||||||
}
|
|
||||||
"
|
|
||||||
:type="songRequestSettings?.allowFromWeb == false || item.options ? 'warning' : 'info'"
|
|
||||||
:loading="isLoading == item.key"
|
|
||||||
>
|
|
||||||
<template #icon>
|
<template #icon>
|
||||||
<NIcon :component="CloudAdd20Filled" />
|
<NIcon :component="CloudAdd20Filled" />
|
||||||
</template>
|
</template>
|
||||||
</NButton>
|
</NButton>
|
||||||
</template>
|
</template>
|
||||||
{{
|
{{
|
||||||
songRequestSettings?.allowFromWeb == false || item.options
|
liveRequestSettings?.allowFromWeb == false || item.options
|
||||||
? '点歌 | 用户或此歌曲不允许从网页点歌, 点击后将复制点歌内容到剪切板'
|
? '点歌 | 用户或此歌曲不允许从网页点歌, 点击后将复制点歌内容到剪切板'
|
||||||
: !accountInfo
|
: !accountInfo
|
||||||
? '点歌 | 你需要登录后才能点歌'
|
? '点歌 | 你需要登录后才能点歌'
|
||||||
@@ -263,13 +229,9 @@ function loadMore() {
|
|||||||
</NButton>
|
</NButton>
|
||||||
</template>
|
</template>
|
||||||
<NSpace :wrap="false">
|
<NSpace :wrap="false">
|
||||||
<NButton
|
<NButton v-for="tag in item.tags" size="tiny" :key="tag"
|
||||||
v-for="tag in item.tags"
|
|
||||||
size="tiny"
|
|
||||||
:key="tag"
|
|
||||||
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
|
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
|
||||||
:type="selectedTag == tag ? 'primary' : 'default'"
|
:type="selectedTag == tag ? 'primary' : 'default'">
|
||||||
>
|
|
||||||
<NEllipsis style="max-width: 50px">
|
<NEllipsis style="max-width: 50px">
|
||||||
{{ tag }}
|
{{ tag }}
|
||||||
</NEllipsis>
|
</NEllipsis>
|
||||||
@@ -277,13 +239,9 @@ function loadMore() {
|
|||||||
</NSpace>
|
</NSpace>
|
||||||
</NPopover>
|
</NPopover>
|
||||||
<NSpace v-else :wrap="false">
|
<NSpace v-else :wrap="false">
|
||||||
<NButton
|
<NButton v-for="tag in item.tags" size="tiny" :key="tag"
|
||||||
v-for="tag in item.tags"
|
|
||||||
size="tiny"
|
|
||||||
:key="tag"
|
|
||||||
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
|
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
|
||||||
:type="selectedTag == tag ? 'primary' : 'default'"
|
:type="selectedTag == tag ? 'primary' : 'default'">
|
||||||
>
|
|
||||||
<NEllipsis style="max-width: 50px">
|
<NEllipsis style="max-width: 50px">
|
||||||
{{ tag }}
|
{{ tag }}
|
||||||
</NEllipsis>
|
</NEllipsis>
|
||||||
|
|||||||
@@ -46,26 +46,26 @@ export const Config: TemplateConfig<ConfigType> = {
|
|||||||
alignItems: 'center',
|
alignItems: 'center',
|
||||||
position: 'relative',
|
position: 'relative',
|
||||||
}">
|
}">
|
||||||
<div style="{
|
<div :style="{
|
||||||
height: 100%;
|
height: '100%',
|
||||||
width: 100%;
|
width: '100%',
|
||||||
min-height: 400px;
|
minHeight: '400px',
|
||||||
backdrop-filter: blur(10px);
|
backdropFilter: 'blur(10px)',
|
||||||
display: flex;
|
display: 'flex',
|
||||||
flex-direction: column;
|
flexDirection: 'column',
|
||||||
justify-content: center;
|
justifyContent: 'center',
|
||||||
align-items: center;
|
alignItems: 'center',
|
||||||
}">
|
}">
|
||||||
<div style="{
|
<div style="
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
border: 3px solid var(--pinky-border-color-dark);
|
border: 3px solid var(--pinky-border-color-dark);
|
||||||
height: 50px;
|
height: 50px;
|
||||||
width: 400px;
|
width: 400px;
|
||||||
}">
|
">
|
||||||
<div v-for="song in props.data" :key="song.id">
|
<div v-for="song in props.data" :key="song.id">
|
||||||
{{song.name}}
|
{{ song.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
Reference in New Issue
Block a user