update song-request to live-request, add questionbox tag support

This commit is contained in:
2024-03-12 14:36:01 +08:00
parent ca3f7ca57e
commit af112da9a8
28 changed files with 542 additions and 216 deletions

View File

@@ -98,7 +98,7 @@ export interface Setting_QuestionBox {
export interface UserSetting { export interface UserSetting {
sendEmail: Setting_SendEmail sendEmail: Setting_SendEmail
questionBox: Setting_QuestionBox questionBox: Setting_QuestionBox
songRequest: Setting_SongRequest songRequest: Setting_LiveRequest
queue: Setting_Queue queue: Setting_Queue
point: Setting_Point point: Setting_Point
questionDisplay: Setting_QuestionDisplay questionDisplay: Setting_QuestionDisplay
@@ -109,7 +109,7 @@ export interface UserSetting {
songListTemplate: string | null songListTemplate: string | null
scheduleTemplate: string | null scheduleTemplate: string | null
} }
export interface Setting_SongRequest { export interface Setting_LiveRequest {
orderPrefix: string orderPrefix: string
enableOnStreaming: boolean enableOnStreaming: boolean
onlyAllowSongList: boolean onlyAllowSongList: boolean
@@ -134,6 +134,7 @@ export interface Setting_SongRequest {
showRequireInfo: boolean showRequireInfo: boolean
showUserName: boolean showUserName: boolean
showFanMadelInfo: boolean showFanMadelInfo: boolean
obsTitle: string
isReverse: boolean isReverse: boolean
} }
@@ -301,6 +302,8 @@ export interface QAInfo {
isFavorite: boolean isFavorite: boolean
sendAt: number sendAt: number
isAnonymous: boolean isAnonymous: boolean
tag?: string
} }
export interface LotteryUserInfo { export interface LotteryUserInfo {
name: string name: string

View File

@@ -10,7 +10,7 @@ const props = defineProps<{
<template> <template>
<NCard v-if="item" :embedded="!item.isReaded" hoverable size="small" :bordered="false"> <NCard v-if="item" :embedded="!item.isReaded" hoverable size="small" :bordered="false">
<template #header> <template #header>
<NFlex :size="0" align="center" > <NFlex :size="0" align="center">
<template v-if="!item.isReaded"> <template v-if="!item.isReaded">
<NTag type="warning" size="tiny"> 未读 </NTag> <NTag type="warning" size="tiny"> 未读 </NTag>
<NDivider vertical /> <NDivider vertical />
@@ -22,6 +22,14 @@ const props = defineProps<{
已注册 已注册
</NTag> </NTag>
<NTag v-if="item.isPublic" size="small" type="success" :bordered="false" style="margin-left: 5px"> 公开 </NTag> <NTag v-if="item.isPublic" size="small" type="success" :bordered="false" style="margin-left: 5px"> 公开 </NTag>
<NTooltip v-if="item.tag">
<template #trigger>
<NTag size="small" type="success" style="margin-left: 5px">
{{ item.tag }}
</NTag>
</template>
标签/话题
</NTooltip>
<NDivider vertical /> <NDivider vertical />
<NText depth="3" style="font-size: small"> <NText depth="3" style="font-size: small">
<NTooltip> <NTooltip>

View File

@@ -36,7 +36,7 @@ export const HISTORY_API_URL = { toString: () => `${BASE_API}history/` }
export const SCHEDULE_API_URL = { toString: () => `${BASE_API}schedule/` } export const SCHEDULE_API_URL = { toString: () => `${BASE_API}schedule/` }
export const VIDEO_COLLECT_API_URL = { toString: () => `${BASE_API}video-collect/` } export const VIDEO_COLLECT_API_URL = { toString: () => `${BASE_API}video-collect/` }
export const OPEN_LIVE_API_URL = { toString: () => `${BASE_API}open-live/` } export const OPEN_LIVE_API_URL = { toString: () => `${BASE_API}open-live/` }
export const SONG_REQUEST_API_URL = { toString: () => `${BASE_API}song-request/` } export const SONG_REQUEST_API_URL = { toString: () => `${BASE_API}live-request/` }
export const QUEUE_API_URL = { toString: () => `${BASE_API}queue/` } export const QUEUE_API_URL = { toString: () => `${BASE_API}queue/` }
export const EVENT_API_URL = { toString: () => `${BASE_API}event/` } export const EVENT_API_URL = { toString: () => `${BASE_API}event/` }
export const LIVE_API_URL = { toString: () => `${BASE_API}live/` } export const LIVE_API_URL = { toString: () => `${BASE_API}live/` }

View File

@@ -114,11 +114,11 @@ export default //管理页面
}, },
}, },
{ {
path: 'song-request', path: 'live-request',
name: 'manage-songRequest', name: 'manage-liveRequest',
component: () => import('@/views/open_live/SongRequest.vue'), component: () => import('@/views/open_live/LiveRequest.vue'),
meta: { meta: {
title: '点歌 (歌势', title: '点',
keepAlive: true, keepAlive: true,
danmaku: true, danmaku: true,
}, },
@@ -128,7 +128,7 @@ export default //管理页面
name: 'manage-musicRequest', name: 'manage-musicRequest',
component: () => import('@/views/open_live/MusicRequest.vue'), component: () => import('@/views/open_live/MusicRequest.vue'),
meta: { meta: {
title: '点歌 (点播', title: '点歌',
keepAlive: true, keepAlive: true,
danmaku: true, danmaku: true,
}, },

View File

@@ -11,9 +11,10 @@ export default {
}, },
}, },
{ {
path: 'song-request', path: 'live-request',
name: 'obs-song-request', name: 'obs-live-request',
component: () => import('@/views/obs/SongRequestOBS.vue'), alias: 'song-request',
component: () => import('@/views/obs/LiveRequestOBS.vue'),
meta: { meta: {
title: '弹幕点歌 (歌势', title: '弹幕点歌 (歌势',
}, },

View File

@@ -19,9 +19,9 @@ export default {
}, },
}, },
{ {
path: 'song-request', path: 'live-request',
name: 'open-live-song-request', name: 'open-live-live-request',
component: () => import('@/views/open_live/SongRequest.vue'), component: () => import('@/views/open_live/LiveRequest.vue'),
meta: { meta: {
title: '点歌', title: '点歌',
}, },

View File

@@ -7,6 +7,11 @@ import { useMessage } from 'naive-ui'
import { defineStore } from 'pinia' import { defineStore } from 'pinia'
import { computed, ref } from 'vue' import { computed, ref } from 'vue'
export type QATagInfo = {
name: string
createAt: number
visiable: boolean
}
export const useQuestionBox = defineStore('QuestionBox', () => { export const useQuestionBox = defineStore('QuestionBox', () => {
const isLoading = ref(false) const isLoading = ref(false)
const isRepling = ref(false) const isRepling = ref(false)
@@ -16,6 +21,7 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
const recieveQuestions = ref<QAInfo[]>([]) const recieveQuestions = ref<QAInfo[]>([])
const sendQuestions = ref<QAInfo[]>([]) const sendQuestions = ref<QAInfo[]>([])
const tags = ref<QATagInfo[]>([])
const onlyFavorite = ref(false) const onlyFavorite = ref(false)
const onlyPublic = ref(false) const onlyPublic = ref(false)
@@ -27,7 +33,10 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
return false return false
}*/ }*/
return ( return (
(q.isFavorite || !onlyFavorite.value) && (q.isPublic || !onlyPublic.value) && (!q.isReaded || !onlyUnread.value) (q.isFavorite || !onlyFavorite.value) &&
(q.isPublic || !onlyPublic.value) &&
(!q.isReaded || !onlyUnread.value) &&
(!displayTag.value || q.tag == displayTag.value)
) )
}) })
return result return result
@@ -36,6 +45,7 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
}) })
const currentQuestion = ref<QAInfo>() const currentQuestion = ref<QAInfo>()
const displayQuestion = ref<QAInfo>() const displayQuestion = ref<QAInfo>()
const displayTag = ref<string>()
let isRevieveGetted = false let isRevieveGetted = false
//const isSendGetted = false //const isSendGetted = false
@@ -58,7 +68,7 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
displayQuestion.value = recieveQuestions.value.find((q) => q.id == displayId) displayQuestion.value = recieveQuestions.value.find((q) => q.id == displayId)
} }
} }
message.success('共收取 ' + data.data.length + ' 条提问') //message.success('共收取 ' + data.data.length + ' 条提问')
isRevieveGetted = true isRevieveGetted = true
} else { } else {
message.error(data.message) message.error(data.message)
@@ -77,7 +87,7 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
.then((data) => { .then((data) => {
if (data.code == 200) { if (data.code == 200) {
sendQuestions.value = data.data sendQuestions.value = data.data
message.success('共发送 ' + data.data.length + ' 条提问') //message.success('共发送 ' + data.data.length + ' 条提问')
} else { } else {
message.error(data.message) message.error(data.message)
} }
@@ -89,6 +99,98 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
isLoading.value = false isLoading.value = false
}) })
} }
async function GetTags() {
isLoading.value = true
await QueryGetAPI<QATagInfo[]>(QUESTION_API_URL + 'get-tags', {
id: accountInfo.value?.id,
})
.then((data) => {
if (data.code == 200) {
tags.value = data.data
} else {
message.error(data.message)
}
})
.catch((err) => {
message.error('发生错误: ' + err)
})
.finally(() => {
isLoading.value = false
})
}
async function addTag(tag: string) {
if (!tag) {
message.warning('请输入标签')
return
}
if (tags.value.find((t) => t.name == tag)) {
message.warning('标签已存在')
return
}
await QueryGetAPI(QUESTION_API_URL + 'add-tag', {
tag: tag,
})
.then((data) => {
if (data.code == 200) {
message.success('添加成功')
GetTags()
} else {
message.error('添加失败: ' + data.message)
}
})
.catch((err) => {
message.error('添加失败: ' + err)
})
}
async function delTag(tag: string) {
if (!tag) {
message.warning('请输入标签')
return
}
if (!tags.value.find((t) => t.name == tag)) {
message.warning('标签不存在')
return
}
await QueryGetAPI(QUESTION_API_URL + 'del-tag', {
tag: tag,
})
.then((data) => {
if (data.code == 200) {
message.success('删除成功')
GetTags()
} else {
message.error('删除失败: ' + data.message)
}
})
.catch((err) => {
message.error('删除失败: ' + err)
})
}
async function updateTagVisiable(tag: string, visiable: boolean) {
if (!tag) {
message.warning('请输入标签')
return
}
if (!tags.value.find((t) => t.name == tag)) {
message.warning('标签不存在')
return
}
await QueryGetAPI(QUESTION_API_URL + 'update-tag-visiable', {
tag: tag,
visiable: visiable,
})
.then((data) => {
if (data.code == 200) {
message.success('修改成功')
GetTags()
} else {
message.error('修改失败: ' + data.message)
}
})
.catch((err) => {
message.error('修改失败: ' + err)
})
}
async function reply(id: number, msg: string) { async function reply(id: number, msg: string) {
isRepling.value = true isRepling.value = true
await QueryPostAPI<QAInfo>(QUESTION_API_URL + 'reply', { await QueryPostAPI<QAInfo>(QUESTION_API_URL + 'reply', {
@@ -229,12 +331,18 @@ export const useQuestionBox = defineStore('QuestionBox', () => {
recieveQuestions, recieveQuestions,
recieveQuestionsFiltered, recieveQuestionsFiltered,
sendQuestions, sendQuestions,
tags,
onlyFavorite, onlyFavorite,
onlyPublic, onlyPublic,
onlyUnread, onlyUnread,
displayQuestion, displayQuestion,
displayTag,
GetRecieveQAInfo, GetRecieveQAInfo,
GetSendQAInfo, GetSendQAInfo,
GetTags,
addTag,
delTag,
updateTagVisiable,
reply, reply,
read, read,
favorite, favorite,

View File

@@ -36,6 +36,7 @@ import { NButton, NCard, NDivider, NLayoutContent, NSpace, NText, NTimeline, NTi
</NSpace> </NSpace>
<NDivider title-placement="left"> 更新日志 </NDivider> <NDivider title-placement="left"> 更新日志 </NDivider>
<NTimeline> <NTimeline>
<NTimelineItem type="info" title="功能更新" content="1. 点歌(歌势) 修改为点播 2. 棉花糖支持创建话题(标签) 3. 一些bug修复" time="2024-3-12" />
<NTimelineItem type="info" title="功能更新" content="棉花糖添加展示页面" time="2024-2-20" /> <NTimelineItem type="info" title="功能更新" content="棉花糖添加展示页面" time="2024-2-20" />
<NTimelineItem type="info" title="功能更新" content="歌单新增从文件导入" time="2024-2-10" /> <NTimelineItem type="info" title="功能更新" content="歌单新增从文件导入" time="2024-2-10" />
<NTimelineItem type="info" title="功能更新" content="排队的OBS组件添加设置项" time="2024-1-27" /> <NTimelineItem type="info" title="功能更新" content="排队的OBS组件添加设置项" time="2024-1-27" />

View File

@@ -341,17 +341,17 @@ const menuOptions = [
RouterLink, RouterLink,
{ {
to: { to: {
name: 'manage-songRequest', name: 'manage-liveRequest',
}, },
}, },
{ {
default: () => '点歌(歌势', default: () => '点',
}, },
), ),
default: () => '歌势用的, 观众点歌之后需要自己唱', default: () => '歌势之类用的, 可以用来点歌或者跳舞什么的',
}, },
), ),
key: 'manage-songRequest', key: 'manage-liveRequest',
icon: renderIcon(MusicalNote), icon: renderIcon(MusicalNote),
}, },
{ {
@@ -369,7 +369,7 @@ const menuOptions = [
}, },
}, },
{ {
default: () => '点歌(点播', default: () => '点歌',
}, },
), ),
default: () => '就是传统的点歌机, 发弹幕后播放指定的歌曲', default: () => '就是传统的点歌机, 发弹幕后播放指定的歌曲',

View File

@@ -62,13 +62,13 @@ const menuOptions = [
RouterLink, RouterLink,
{ {
to: { to: {
name: 'open-live-song-request', name: 'open-live-live-request',
query: route.query, query: route.query,
}, },
}, },
{ default: () => '点歌' }, { default: () => '点歌' },
), ),
key: 'open-live-song-request', key: 'open-live-live-request',
icon: renderIcon(MusicalNote), icon: renderIcon(MusicalNote),
}, },
{ {

View File

@@ -190,7 +190,7 @@ onMounted(async () => {
<NIcon :component="Moon" /> <NIcon :component="Moon" />
</template> </template>
</NSwitch> </NSwitch>
<template v-if="accountInfo"> <template v-if="accountInfo.id">
<NSpace> <NSpace>
<NButton <NButton
v-if="useAuth.isAuthed || accountInfo.biliUserAuthInfo" v-if="useAuth.isAuthed || accountInfo.biliUserAuthInfo"

View File

@@ -394,7 +394,7 @@ onUnmounted(() => {
<template #trigger> <template #trigger>
<NIcon :component="Info24Filled" /> <NIcon :component="Info24Filled" />
</template> </template>
用于进行积分兑换等操作 用于进行积分兑换等操作, 如果你是主播可以不用管
</NTooltip> </NTooltip>
</NTag> </NTag>
<NDivider vertical /> <NDivider vertical />

View File

@@ -15,15 +15,19 @@ import {
NCard, NCard,
NCheckbox, NCheckbox,
NDivider, NDivider,
NEmpty,
NFlex, NFlex,
NIcon, NIcon,
NImage, NImage,
NInput, NInput,
NInputGroup, NInputGroup,
NInputGroupLabel,
NList, NList,
NListItem, NListItem,
NModal, NModal,
NPopconfirm,
NScrollbar, NScrollbar,
NSelect,
NSpace, NSpace,
NSpin, NSpin,
NSplit, NSplit,
@@ -39,10 +43,8 @@ import {
import QrcodeVue from 'qrcode.vue' import QrcodeVue from 'qrcode.vue'
import { computed, onMounted, ref } from 'vue' import { computed, onMounted, ref } from 'vue'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import QuestionDisplay from './QuestionDisplaySettings.vue'
import { useElementSize } from '@vueuse/core'
import QuestionItem from '@/components/QuestionItems.vue' import QuestionItem from '@/components/QuestionItems.vue'
import { ArrowCircleRight12Filled } from '@vicons/fluent' import { ArrowCircleRight12Filled, Delete24Regular, Eye24Filled, EyeOff24Filled, Info24Filled } from '@vicons/fluent'
import { useQuestionBox } from '@/store/useQuestionBox' import { useQuestionBox } from '@/store/useQuestionBox'
const accountInfo = useAccount() const accountInfo = useAccount()
@@ -56,6 +58,7 @@ const selectedTabItem = ref(route.query.send ? '1' : '0')
const replyModalVisiable = ref(false) const replyModalVisiable = ref(false)
const shareModalVisiable = ref(false) const shareModalVisiable = ref(false)
const replyMessage = ref() const replyMessage = ref()
const addTagName = ref('')
const showSettingCard = ref(true) const showSettingCard = ref(true)
@@ -65,6 +68,8 @@ const shareUrl = computed(() => 'https://vtsuru.live/@' + accountInfo.value?.nam
let isRevieveGetted = false let isRevieveGetted = false
let isSendGetted = false let isSendGetted = false
async function onTabChange(value: string) { async function onTabChange(value: string) {
return
if (value == '0' && !isRevieveGetted) { if (value == '0' && !isRevieveGetted) {
await useQB.GetRecieveQAInfo() await useQB.GetRecieveQAInfo()
isRevieveGetted = true isRevieveGetted = true
@@ -81,7 +86,11 @@ function onOpenModal(question: QAInfo) {
function refresh() { function refresh() {
isSendGetted = false isSendGetted = false
isRevieveGetted = false isRevieveGetted = false
onTabChange(selectedTabItem.value) if (selectedTabItem.value == '0') {
useQB.GetRecieveQAInfo()
} else if (selectedTabItem.value == '1') {
useQB.GetSendQAInfo()
}
} }
function saveShareImage() { function saveShareImage() {
html2canvas(shareCardRef.value, { html2canvas(shareCardRef.value, {
@@ -139,11 +148,9 @@ async function setFunctionEnable(enable: boolean) {
} }
onMounted(() => { onMounted(() => {
if (selectedTabItem.value == '0') { useQB.GetTags()
useQB.GetRecieveQAInfo() useQB.GetRecieveQAInfo()
} else { useQB.GetSendQAInfo()
useQB.GetSendQAInfo()
}
useQB.displayQuestion = useQB.recieveQuestions.find( useQB.displayQuestion = useQB.recieveQuestions.find(
(s) => s.id == accountInfo.value?.settings.questionDisplay.currentQuestion, (s) => s.id == accountInfo.value?.settings.questionDisplay.currentQuestion,
@@ -167,30 +174,27 @@ onMounted(() => {
<NDivider style="margin: 10px 0 10px 0" /> <NDivider style="margin: 10px 0 10px 0" />
<NSpin v-if="useQB.isLoading" show /> <NSpin v-if="useQB.isLoading" show />
<NTabs v-else animated @update:value="onTabChange" v-model:value="selectedTabItem"> <NTabs v-else animated @update:value="onTabChange" v-model:value="selectedTabItem">
<NTabPane tab="我收到的" name="0"> <NTabPane tab="我收到的" name="0" display-directive="show:lazy">
<NButton @click="$router.push({ name: 'question-display' })" type="primary"> 打开展示页 </NButton>
<NDivider vertical /> <NDivider vertical />
<NCheckbox v-model:checked="useQB.onlyFavorite"> 只显示收藏 </NCheckbox> <NFlex align="center">
<NCheckbox v-model:checked="useQB.onlyPublic"> 只显示公开 </NCheckbox> <NButton @click="$router.push({ name: 'question-display' })" type="primary"> 打开展示页 </NButton>
<NCheckbox v-model:checked="useQB.onlyUnread"> 只显示未读 </NCheckbox> <NSelect
v-model:value="useQB.displayTag"
placeholder="选择当前话题"
filterable
clearable
:options="useQB.tags.map((s) => ({ label: s.name, value: s.name }))"
style="width: 200px"
/>
<NCheckbox v-model:checked="useQB.onlyFavorite"> 只显示收藏 </NCheckbox>
<NCheckbox v-model:checked="useQB.onlyPublic"> 只显示公开 </NCheckbox>
<NCheckbox v-model:checked="useQB.onlyUnread"> 只显示未读 </NCheckbox>
</NFlex>
<NDivider style="margin: 10px 0 10px 0" /> <NDivider style="margin: 10px 0 10px 0" />
<QuestionItem :questions="useQB.recieveQuestionsFiltered"> <NEmpty v-if="useQB.recieveQuestionsFiltered.length == 0" description="暂无收到的提问" />
<QuestionItem v-else :questions="useQB.recieveQuestionsFiltered">
<template #footer="{ item }"> <template #footer="{ item }">
<NSpace> <NSpace>
<NTooltip>
<template #trigger>
<NButton
@click="useQB.setCurrentQuestion(item)"
size="small"
:type="useQB.displayQuestion?.id == item.id ? 'primary' : 'default'"
>
<template #icon>
<NIcon :component="ArrowCircleRight12Filled" />
</template>
</NButton>
</template>
设为当前展示的提问
</NTooltip>
<NButton v-if="!item.isReaded" size="small" @click="useQB.read(item, true)" type="success"> <NButton v-if="!item.isReaded" size="small" @click="useQB.read(item, true)" type="success">
设为已读 设为已读
</NButton> </NButton>
@@ -217,8 +221,9 @@ onMounted(() => {
</template> </template>
</QuestionItem> </QuestionItem>
</NTabPane> </NTabPane>
<NTabPane ref="parentRef" tab="我发送的" name="1"> <NTabPane ref="parentRef" tab="我发送的" name="1" display-directive="show:lazy">
<NList> <NEmpty v-if="useQB.sendQuestions.length == 0" description="暂无发送的提问" />
<NList v-else>
<NListItem v-for="item in useQB.sendQuestions" :key="item.id"> <NListItem v-for="item in useQB.sendQuestions" :key="item.id">
<NCard hoverable size="small"> <NCard hoverable size="small">
<template #header> <template #header>
@@ -259,7 +264,8 @@ onMounted(() => {
</NListItem> </NListItem>
</NList> </NList>
</NTabPane> </NTabPane>
<NTabPane v-if="accountInfo" tab="设置" name="2"> <NTabPane tab="设置" name="2" display-directive="show:lazy">
<NDivider> 设定 </NDivider>
<NSpin :show="useQB.isLoading"> <NSpin :show="useQB.isLoading">
<NCheckbox <NCheckbox
v-model:checked="accountInfo.settings.questionBox.allowUnregistedUser" v-model:checked="accountInfo.settings.questionBox.allowUnregistedUser"
@@ -267,6 +273,59 @@ onMounted(() => {
> >
允许未注册用户进行提问 允许未注册用户进行提问
</NCheckbox> </NCheckbox>
<NDivider>
标签
<NTooltip>
<template #trigger>
<NIcon :component="Info24Filled" />
</template>
类似于话题, 可以在投稿时选择
</NTooltip>
</NDivider>
<NInputGroup>
<NInputGroupLabel> 标签名称 </NInputGroupLabel>
<NInput v-model:value="addTagName" placeholder="就是名称" maxlength="30" show-count clearable />
<NButton type="primary" @click="useQB.addTag(addTagName)"> 添加 </NButton>
</NInputGroup>
<NDivider style="margin: 15px 0 15px 0" />
<NEmpty v-if="useQB.tags.length == 0" description="暂无标签" />
<NFlex v-else justify="center">
<NList bordered>
<NListItem v-for="item in useQB.tags.sort((a, b) => b.createAt - a.createAt)" :key="item.name">
<NFlex align="center">
<NTag :bordered="false" size="small" :type="item.visiable ? 'success' : 'error'">
{{ item.name }}
</NTag>
<NTooltip>
<template #trigger>
<NPopconfirm @positive-click="useQB.updateTagVisiable(item.name, !item.visiable)">
<template #trigger>
<NButton :type="item.visiable ? 'success' : 'error'" text>
<template #icon>
<NIcon v-if="item.visiable" :component="Eye24Filled" />
<NIcon v-else :component="EyeOff24Filled" />
</template>
</NButton>
</template>
确定要{{ item.visiable ? '隐藏' : '显示' }}这个标签吗?
</NPopconfirm>
</template>
{{ item.visiable ? '隐藏' : '显示' }}
</NTooltip>
<NPopconfirm @positive-click="useQB.delTag(item.name)">
<template #trigger>
<NButton type="error" text>
<template #icon>
<NIcon :component="Delete24Regular" />
</template>
</NButton>
</template>
确定要删除这个标签吗?
</NPopconfirm>
</NFlex>
</NListItem>
</NList>
</NFlex>
<NDivider> 通知 </NDivider> <NDivider> 通知 </NDivider>
<NCheckbox v-model:checked="accountInfo.settings.sendEmail.recieveQA" @update:checked="saveSettings"> <NCheckbox v-model:checked="accountInfo.settings.sendEmail.recieveQA" @update:checked="saveSettings">
收到新提问时发送邮件 收到新提问时发送邮件

View File

@@ -52,12 +52,12 @@ onUnmounted(() => {
backgroundColor: '#' + setting.borderColor, backgroundColor: '#' + setting.borderColor,
borderColor: setting.borderColor ? '#' + setting.borderColor : undefined, borderColor: setting.borderColor ? '#' + setting.borderColor : undefined,
borderWidth: setting.borderWidth ? setting.borderWidth + 'px' : undefined, borderWidth: setting.borderWidth ? setting.borderWidth + 'px' : undefined,
borderTopWidth: setting.showUserName ? 0 : setting.borderWidth, borderTopWidth: setting.showUserName && question ? 0 : setting.borderWidth,
}" }"
:display="question ? 1 : 0" :display="question ? 1 : 0"
> >
<div <div
v-if="setting.showUserName" v-if="setting.showUserName && question"
class="question-display-user-name" class="question-display-user-name"
:style="{ :style="{
color: '#' + setting.nameFontColor, color: '#' + setting.nameFontColor,
@@ -79,7 +79,7 @@ onUnmounted(() => {
fontFamily: setting.font, fontFamily: setting.font,
}" }"
> >
<div class="question-display-text"> <div class="question-display-text" :is-empty="question ? 0 : 1">
{{ question?.question.message }} {{ question?.question.message }}
</div> </div>
<img <img

View File

@@ -369,7 +369,7 @@ onMounted(async () => {
</script> </script>
<template> <template>
<NCard v-if="accountInfo" title="设置" :style="`${selectedTab === 'general' ? '' : 'min-height: 800px;'}`"> <NCard title="设置" :style="`${selectedTab === 'general' ? '' : 'min-height: 800px;'}`">
<NSpin :show="isSaving"> <NSpin :show="isSaving">
<NTabs v-model:value="selectedTab"> <NTabs v-model:value="selectedTab">
<NTabPane tab="常规" name="general"> <NTabPane tab="常规" name="general">

View File

@@ -581,7 +581,7 @@ onMounted(async () => {
</NAlert> </NAlert>
<NButton @click="showModal = true" type="primary"> 添加歌曲 </NButton> <NButton @click="showModal = true" type="primary"> 添加歌曲 </NButton>
<NButton @click="exportData" type="primary" secondary> 导出为 CSV </NButton> <NButton @click="exportData" type="primary" secondary> 导出为 CSV </NButton>
<NButton @click="$router.push({ name: 'manage-songRequest' })" secondary> 前往点歌页 </NButton> <NButton @click="$router.push({ name: 'manage-liveRequest' })" secondary> 前往点歌页 </NButton>
<NButton @click="$router.push({ name: 'user-songList', params: { id: accountInfo?.name } })" secondary> <NButton @click="$router.push({ name: 'user-songList', params: { id: accountInfo?.name } })" secondary>
前往展示页 前往展示页
</NButton> </NButton>

View File

@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { Setting_SongRequest, SongRequestFrom, SongRequestInfo, SongRequestStatus } from '@/api/api-models' import { Setting_LiveRequest, SongRequestFrom, SongRequestInfo, SongRequestStatus } from '@/api/api-models'
import { QueryGetAPI } from '@/api/query' import { QueryGetAPI } from '@/api/query'
import { AVATAR_URL, SONG_REQUEST_API_URL } from '@/data/constants' import { AVATAR_URL, SONG_REQUEST_API_URL } from '@/data/constants'
import { useElementSize } from '@vueuse/core' import { useElementSize } from '@vueuse/core'
@@ -37,7 +37,7 @@ const songs = computed(() => {
return originSongs.value return originSongs.value
} }
}) })
const settings = ref<Setting_SongRequest>({} as Setting_SongRequest) const settings = ref<Setting_LiveRequest>({} as Setting_LiveRequest)
const singing = computed(() => { const singing = computed(() => {
return originSongs.value.find((s) => s.status == SongRequestStatus.Singing) return originSongs.value.find((s) => s.status == SongRequestStatus.Singing)
}) })
@@ -47,7 +47,7 @@ const activeSongs = computed(() => {
async function get() { async function get() {
try { try {
const data = await QueryGetAPI<{ songs: SongRequestInfo[]; setting: Setting_SongRequest }>( const data = await QueryGetAPI<{ songs: SongRequestInfo[]; setting: Setting_LiveRequest }>(
SONG_REQUEST_API_URL + 'get-active-and-settings', SONG_REQUEST_API_URL + 'get-active-and-settings',
{ {
id: currentId.value, id: currentId.value,
@@ -57,7 +57,7 @@ async function get() {
return data.data return data.data
} }
} catch (err) {} } catch (err) {}
return {} as { songs: SongRequestInfo[]; setting: Setting_SongRequest } return {} as { songs: SongRequestInfo[]; setting: Setting_LiveRequest }
} }
const isMoreThanContainer = computed(() => { const isMoreThanContainer = computed(() => {
return originSongs.value.length * itemHeight > height.value return originSongs.value.length * itemHeight > height.value
@@ -92,14 +92,16 @@ let timer: any
onMounted(() => { onMounted(() => {
update() update()
timer = setInterval(update, 2000) timer = setInterval(update, 2000)
//@ts-expect-error //@ts-expect-error
window.obsstudio.onVisibilityChange = function (visibility: boolean) { if (window.obsstudio) {
visiable.value = visibility //@ts-expect-error
} window.obsstudio.onVisibilityChange = function (visibility: boolean) {
//@ts-expect-error visiable.value = visibility
window.obsstudio.onActiveChange = function (a: boolean) { }
active.value = a //@ts-expect-error
window.obsstudio.onActiveChange = function (a: boolean) {
active.value = a
}
} }
}) })
onUnmounted(() => { onUnmounted(() => {
@@ -108,30 +110,34 @@ onUnmounted(() => {
</script> </script>
<template> <template>
<div class="song-request-background" v-bind="$attrs"> <div class="live-request-background" v-bind="$attrs">
<p class="song-request-header">点歌</p> <p class="live-request-header">{{ settings.obsTitle ?? '点播' }}</p>
<NDivider class="song-request-divider"> <NDivider class="live-request-divider">
<p class="song-request-header-count">已有 {{ activeSongs.length ?? 0 }} </p> <p class="live-request-header-count">已有 {{ activeSongs.length ?? 0 }} </p>
</NDivider> </NDivider>
<div <div
class="song-request-singing-container" class="live-request-processing-container"
:singing="songs.findIndex((s) => s.status == SongRequestStatus.Singing) > -1" :singing="songs.findIndex((s) => s.status == SongRequestStatus.Singing) > -1"
:from="singing?.from as number" :from="singing?.from as number"
:status="singing?.status as number" :status="singing?.status as number"
> >
<div class="song-request-singing-prefix"></div> <div class="live-request-processing-prefix"></div>
<template v-if="singing"> <template v-if="singing">
<img class="song-request-singing-avatar" :src="AVATAR_URL + singing?.user?.uid" referrerpolicy="no-referrer" /> <img
<p class="song-request-singing-song-name">{{ singing?.songName }}</p> class="live-request-processing-avatar"
<p class="song-request-singing-name">{{ singing?.user?.name }}</p> :src="AVATAR_URL + singing?.user?.uid"
referrerpolicy="no-referrer"
/>
<p class="live-request-processing-song-name">{{ singing?.songName }}</p>
<p class="live-request-processing-name">{{ singing?.user?.name }}</p>
</template> </template>
<div v-else class="song-request-singing-empty">未演唱</div> <div v-else class="live-request-processing-empty"></div>
<div class="song-request-singing-suffix"></div> <div class="live-request-processing-suffix"></div>
</div> </div>
<div class="song-request-content" ref="listContainerRef"> <div class="live-request-content" ref="listContainerRef">
<template v-if="activeSongs.length > 0"> <template v-if="activeSongs.length > 0">
<Vue3Marquee <Vue3Marquee
class="song-request-list" class="live-request-list"
:key="key" :key="key"
vertical vertical
:pause="!isMoreThanContainer" :pause="!isMoreThanContainer"
@@ -139,25 +145,25 @@ onUnmounted(() => {
:style="`height: ${height}px;width: ${width}px;`" :style="`height: ${height}px;width: ${width}px;`"
> >
<span <span
class="song-request-list-item" class="live-request-list-item"
:from="song.from as number" :from="song.from as number"
:status="song.status as number" :status="song.status as number"
v-for="(song, index) in activeSongs" v-for="(song, index) in activeSongs"
:key="song.id" :key="song.id"
:style="`height: ${itemHeight}px`" :style="`height: ${itemHeight}px`"
> >
<div class="song-request-list-item-index" :index="index + 1"> <div class="live-request-list-item-index" :index="index + 1">
{{ index + 1 }} {{ index + 1 }}
</div> </div>
<div class="song-request-list-item-song-name"> <div class="live-request-list-item-song-name">
{{ song.songName }} {{ song.songName }}
</div> </div>
<p v-if="settings.showUserName" class="song-request-list-item-name"> <p v-if="settings.showUserName" class="live-request-list-item-name">
{{ song.from == SongRequestFrom.Manual ? '主播添加' : song.user?.name }} {{ song.from == SongRequestFrom.Manual ? '主播添加' : song.user?.name }}
</p> </p>
<div <div
v-if="settings.showFanMadelInfo" v-if="settings.showFanMadelInfo"
class="song-request-list-item-level" class="live-request-list-item-level"
:has-level="(song.user?.fans_medal_level ?? 0) > 0" :has-level="(song.user?.fans_medal_level ?? 0) > 0"
> >
{{ `${song.user?.fans_medal_name} ${song.user?.fans_medal_level}` }} {{ `${song.user?.fans_medal_name} ${song.user?.fans_medal_level}` }}
@@ -166,38 +172,38 @@ onUnmounted(() => {
</Vue3Marquee> </Vue3Marquee>
</template> </template>
<div v-else style="position: relative; top: 20%"> <div v-else style="position: relative; top: 20%">
<NEmpty class="song-request-empty" description="暂无人点歌" /> <NEmpty class="live-request-empty" description="暂无人点歌" />
</div> </div>
</div> </div>
<div class="song-request-footer" v-if="settings.showRequireInfo" ref="footerRef"> <div class="live-request-footer" v-if="settings.showRequireInfo" ref="footerRef">
<Vue3Marquee <Vue3Marquee
:key="key" :key="key"
ref="footerListRef" ref="footerListRef"
class="song-request-footer-marquee" class="live-request-footer-marquee"
:pause="footerSize.width < footerListSize.width" :pause="footerSize.width < footerListSize.width"
:duration="20" :duration="20"
> >
<span class="song-request-tag" type="prefix"> <span class="live-request-tag" type="prefix">
<div class="song-request-tag-key">前缀</div> <div class="live-request-tag-key">前缀</div>
<div class="song-request-tag-value"> <div class="live-request-tag-value">
{{ settings.orderPrefix }} {{ settings.orderPrefix }}
</div> </div>
</span> </span>
<span class="song-request-tag" type="prefix"> <span class="live-request-tag" type="prefix">
<div class="song-request-tag-key">允许</div> <div class="live-request-tag-key">允许</div>
<div class="song-request-tag-value"> <div class="live-request-tag-value">
{{ settings.allowAllDanmaku ? '所有弹幕' : allowGuardTypes.length > 0 ? allowGuardTypes.join(',') : '无' }} {{ settings.allowAllDanmaku ? '所有弹幕' : allowGuardTypes.length > 0 ? allowGuardTypes.join(',') : '无' }}
</div> </div>
</span> </span>
<span class="song-request-tag" type="sc"> <span class="live-request-tag" type="sc">
<div class="song-request-tag-key">SC点歌</div> <div class="live-request-tag-key">SC点歌</div>
<div class="song-request-tag-value"> <div class="live-request-tag-value">
{{ settings.allowSC ? '> ¥' + settings.scMinPrice : '不允许' }} {{ settings.allowSC ? '> ¥' + settings.scMinPrice : '不允许' }}
</div> </div>
</span> </span>
<span class="song-request-tag" type="fan-madel"> <span class="live-request-tag" type="fan-madel">
<div class="song-request-tag-key">粉丝牌</div> <div class="live-request-tag-key">粉丝牌</div>
<div class="song-request-tag-value"> <div class="live-request-tag-value">
{{ {{
settings.needWearFanMedal settings.needWearFanMedal
? settings.fanMedalMinLevel > 0 ? settings.fanMedalMinLevel > 0
@@ -213,7 +219,7 @@ onUnmounted(() => {
</template> </template>
<style scoped> <style scoped>
.song-request-background { .live-request-background {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
height: 100%; height: 100%;
@@ -224,7 +230,7 @@ onUnmounted(() => {
border-radius: 10px; border-radius: 10px;
color: white; color: white;
} }
.song-request-header { .live-request-header {
margin: 0; margin: 0;
color: #fff; color: #fff;
text-align: center; text-align: center;
@@ -236,60 +242,60 @@ onUnmounted(() => {
0 0 30px #61606086, 0 0 30px #61606086,
0 0 40px rgba(64, 156, 179, 0.555); 0 0 40px rgba(64, 156, 179, 0.555);
} }
.song-request-header-count { .live-request-header-count {
color: #ffffffbd; color: #ffffffbd;
text-align: center; text-align: center;
font-size: 14px; font-size: 14px;
} }
.song-request-divider { .live-request-divider {
margin: 0 auto; margin: 0 auto;
margin-top: -15px; margin-top: -15px;
margin-bottom: -15px; margin-bottom: -15px;
width: 90%; width: 90%;
} }
.song-request-singing-container { .live-request-processing-container {
height: 35px; height: 35px;
margin: 0 10px 0 10px; margin: 0 10px 0 10px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
} }
.song-request-singing-empty { .live-request-processing-empty {
font-weight: bold; font-weight: bold;
font-style: italic; font-style: italic;
color: #ffffffbe; color: #ffffffbe;
} }
.song-request-singing-prefix { .live-request-processing-prefix {
border: 2px solid rgb(231, 231, 231); border: 2px solid rgb(231, 231, 231);
height: 30px; height: 30px;
width: 10px; width: 10px;
border-radius: 10px; border-radius: 10px;
} }
.song-request-singing-container[singing='true'] .song-request-singing-prefix { .live-request-processing-container[singing='true'] .live-request-processing-prefix {
background-color: #75c37f; background-color: #75c37f;
animation: animated-border 3s linear infinite; animation: animated-border 3s linear infinite;
} }
.song-request-singing-container[singing='false'] .song-request-singing-prefix { .live-request-processing-container[singing='false'] .live-request-processing-prefix {
background-color: #c37575; background-color: #c37575;
} }
.song-request-singing-avatar { .live-request-processing-avatar {
height: 30px; height: 30px;
border-radius: 50%; border-radius: 50%;
/* 添加无限旋转动画 */ /* 添加无限旋转动画 */
animation: rotate 20s linear infinite; animation: rotate 20s linear infinite;
} }
/* 网页点歌 */ /* 网页点歌 */
.song-request-singing-container[from='3'] .song-request-singing-avatar { .live-request-processing-container[from='3'] .live-request-processing-avatar {
display: none; display: none;
} }
.song-request-singing-song-name { .live-request-processing-song-name {
font-size: large; font-size: large;
font-weight: bold; font-weight: bold;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
max-width: 80%; max-width: 80%;
} }
.song-request-singing-name { .live-request-processing-name {
font-size: 12px; font-size: 12px;
font-style: italic; font-style: italic;
} }
@@ -304,7 +310,7 @@ onUnmounted(() => {
.n-divider__line { .n-divider__line {
background-color: #ffffffd5; background-color: #ffffffd5;
} }
.song-request-content { .live-request-content {
background-color: #0f0f0f4f; background-color: #0f0f0f4f;
margin: 10px; margin: 10px;
padding: 10px; padding: 10px;
@@ -315,7 +321,7 @@ onUnmounted(() => {
.marquee { .marquee {
justify-items: left; justify-items: left;
} }
.song-request-list-item { .live-request-list-item {
display: flex; display: flex;
width: 100%; width: 100%;
align-self: flex-start; align-self: flex-start;
@@ -324,7 +330,7 @@ onUnmounted(() => {
justify-content: left; justify-content: left;
gap: 10px; gap: 10px;
} }
.song-request-list-item-song-name { .live-request-list-item-song-name {
font-size: 18px; font-size: 18px;
font-weight: bold; font-weight: bold;
overflow: hidden; overflow: hidden;
@@ -334,21 +340,21 @@ onUnmounted(() => {
} }
/* 手动添加 */ /* 手动添加 */
.song-request-list-item[from='0'] .song-request-list-item-name { .live-request-list-item[from='0'] .live-request-list-item-name {
font-style: italic; font-style: italic;
font-weight: bold; font-weight: bold;
color: #d2d8d6; color: #d2d8d6;
font-size: 12px; font-size: 12px;
} }
.song-request-list-item[from='0'] .song-request-list-item-avatar { .live-request-list-item[from='0'] .live-request-list-item-avatar {
display: none; display: none;
} }
/* 弹幕点歌 */ /* 弹幕点歌 */
.song-request-list-item[from='1'] { .live-request-list-item[from='1'] {
} }
.song-request-list-item-name { .live-request-list-item-name {
font-style: italic; font-style: italic;
font-size: 12px; font-size: 12px;
color: rgba(204, 204, 204, 0.993); color: rgba(204, 204, 204, 0.993);
@@ -357,7 +363,7 @@ onUnmounted(() => {
margin-left: auto; margin-left: auto;
} }
.song-request-list-item-index { .live-request-list-item-index {
text-align: center; text-align: center;
height: 18px; height: 18px;
padding: 2px; padding: 2px;
@@ -367,7 +373,7 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993); color: rgba(204, 204, 204, 0.993);
font-size: 12px; font-size: 12px;
} }
.song-request-list-item-level { .live-request-list-item-level {
text-align: center; text-align: center;
height: 18px; height: 18px;
padding: 2px; padding: 2px;
@@ -377,10 +383,10 @@ onUnmounted(() => {
color: rgba(204, 204, 204, 0.993); color: rgba(204, 204, 204, 0.993);
font-size: 12px; font-size: 12px;
} }
.song-request-list-item-level[has-level='false'] { .live-request-list-item-level[has-level='false'] {
display: none; display: none;
} }
.song-request-footer { .live-request-footer {
margin: 0 5px 5px 5px; margin: 0 5px 5px 5px;
height: 60px; height: 60px;
border-radius: 5px; border-radius: 5px;
@@ -388,7 +394,7 @@ onUnmounted(() => {
display: flex; display: flex;
align-items: center; align-items: center;
} }
.song-request-tag { .live-request-tag {
display: flex; display: flex;
margin: 5px 0 5px 5px; margin: 5px 0 5px 5px;
height: 40px; height: 40px;
@@ -400,12 +406,12 @@ onUnmounted(() => {
flex-direction: column; flex-direction: column;
justify-content: left; justify-content: left;
} }
.song-request-tag-key { .live-request-tag-key {
font-style: italic; font-style: italic;
color: rgb(211, 211, 211); color: rgb(211, 211, 211);
font-size: 12px; font-size: 12px;
} }
.song-request-tag-value { .live-request-tag-value {
font-size: 14px; font-size: 14px;
} }
@keyframes animated-border { @keyframes animated-border {

View File

@@ -4,7 +4,7 @@ import {
QueueSortType, QueueSortType,
ResponseQueueModel, ResponseQueueModel,
Setting_Queue, Setting_Queue,
Setting_SongRequest, Setting_LiveRequest,
SongRequestFrom, SongRequestFrom,
SongRequestInfo, SongRequestInfo,
QueueStatus, QueueStatus,

View File

@@ -5,7 +5,7 @@ import {
EventDataTypes, EventDataTypes,
EventModel, EventModel,
FunctionTypes, FunctionTypes,
Setting_SongRequest, Setting_LiveRequest,
SongRequestFrom, SongRequestFrom,
SongRequestInfo, SongRequestInfo,
SongRequestStatus, SongRequestStatus,
@@ -65,10 +65,10 @@ import {
} from 'naive-ui' } from 'naive-ui'
import { computed, h, onActivated, onDeactivated, onMounted, onUnmounted, ref } from 'vue' import { computed, h, onActivated, onDeactivated, onMounted, onUnmounted, ref } from 'vue'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import SongRequestOBS from '../obs/SongRequestOBS.vue' import SongRequestOBS from '../obs/LiveRequestOBS.vue'
const defaultSettings = { const defaultSettings = {
orderPrefix: '点', orderPrefix: '点',
onlyAllowSongList: false, onlyAllowSongList: false,
queueMaxSize: 10, queueMaxSize: 10,
allowAllDanmaku: true, allowAllDanmaku: true,
@@ -88,11 +88,11 @@ const defaultSettings = {
tiduCooldownSecond: 600, tiduCooldownSecond: 600,
jianzhangCooldownSecond: 900, jianzhangCooldownSecond: 900,
isReverse: false, isReverse: false,
} as Setting_SongRequest } as Setting_LiveRequest
const STATUS_MAP = { const STATUS_MAP = {
[SongRequestStatus.Waiting]: '等待中', [SongRequestStatus.Waiting]: '等待中',
[SongRequestStatus.Singing]: '演唱中', [SongRequestStatus.Singing]: '处理中',
[SongRequestStatus.Finish]: '已演唱', [SongRequestStatus.Finish]: '已处理',
[SongRequestStatus.Cancel]: '已取消', [SongRequestStatus.Cancel]: '已取消',
} }
@@ -194,7 +194,7 @@ async function getAllSong() {
id: accountInfo.value.id, id: accountInfo.value.id,
}) })
if (data.code == 200) { if (data.code == 200) {
console.log('[OPEN-LIVE-Song-Request] 已获取所有数据') console.log('[OPEN-LIVE-LIVE-REQUEST] 已获取所有数据')
return new List(data.data).OrderByDescending((s) => s.createAt).ToArray() return new List(data.data).OrderByDescending((s) => s.createAt).ToArray()
} else { } else {
message.error('无法获取数据: ' + data.message) message.error('无法获取数据: ' + data.message)
@@ -210,10 +210,10 @@ async function getAllSong() {
} }
async function addSong(danmaku: EventModel) { async function addSong(danmaku: EventModel) {
console.log( console.log(
`[OPEN-LIVE-Song-Request] 收到 [${danmaku.name}] 的点${danmaku.type == EventDataTypes.SC ? 'SC' : '弹幕'}: ${danmaku.msg}`, `[OPEN-LIVE-LIVE-REQUEST] 收到 [${danmaku.name}] 的点${danmaku.type == EventDataTypes.SC ? 'SC' : '弹幕'}: ${danmaku.msg}`,
) )
if (settings.value.enableOnStreaming && accountInfo.value?.streamerInfo?.isStreaming != true) { if (settings.value.enableOnStreaming && accountInfo.value?.streamerInfo?.isStreaming != true) {
message.info('当前未在直播中, 无法添加点请求. 或者关闭设置中的仅允许直播时加入') message.info('当前未在直播中, 无法添加点请求. 或者关闭设置中的仅允许直播时加入')
return return
} }
if (accountInfo.value) { if (accountInfo.value) {
@@ -225,12 +225,12 @@ async function addSong(danmaku: EventModel) {
//message.error(`[${danmaku.name}] : ${data.message}`) //message.error(`[${danmaku.name}] : ${data.message}`)
const time = Date.now() const time = Date.now()
notice.warning({ notice.warning({
title: danmaku.name + ' 点失败', title: danmaku.name + ' 点失败',
description: data.message, description: data.message,
duration: isWarnMessageAutoClose.value ? 3000 : 0, duration: isWarnMessageAutoClose.value ? 3000 : 0,
meta: () => h(NTime, { type: 'relative', time: time, key: updateKey.value }), meta: () => h(NTime, { type: 'relative', time: time, key: updateKey.value }),
}) })
console.log(`[OPEN-LIVE-Song-Request] [${danmaku.name}] 添加曲目失败: ${data.message}`) console.log(`[OPEN-LIVE-LIVE-REQUEST] [${danmaku.name}] 添加曲目失败: ${data.message}`)
} }
}) })
} else { } else {
@@ -253,12 +253,12 @@ async function addSong(danmaku: EventModel) {
id: songs.value.length == 0 ? 1 : new List(songs.value).Max((s) => s.id) + 1, id: songs.value.length == 0 ? 1 : new List(songs.value).Max((s) => s.id) + 1,
} as SongRequestInfo } as SongRequestInfo
localActiveSongs.value.unshift(songData) localActiveSongs.value.unshift(songData)
message.success(`[${danmaku.name}] 添加曲目: ${songData.songName}`) message.success(`[${danmaku.name}] 添加: ${songData.songName}`)
} }
} }
async function addSongManual() { async function addSongManual() {
if (!newSongName.value) { if (!newSongName.value) {
message.error('请输入曲目名') message.error('请输入名')
return return
} }
if (accountInfo.value) { if (accountInfo.value) {
@@ -266,12 +266,12 @@ async function addSongManual() {
name: newSongName.value, name: newSongName.value,
}).then((data) => { }).then((data) => {
if (data.code == 200) { if (data.code == 200) {
message.success(`已手动添加曲目: ${data.data.songName}`) message.success(`已手动添加: ${data.data.songName}`)
originSongs.value.unshift(data.data) originSongs.value.unshift(data.data)
newSongName.value = '' newSongName.value = ''
console.log(`[OPEN-LIVE-Song-Request] 已手动添加曲目: ${data.data.songName}`) console.log(`[OPEN-LIVE-LIVE-REQUEST] 已手动添加: ${data.data.songName}`)
} else { } else {
message.error(`手动添加曲目失败: ${data.message}`) message.error(`手动添加失败: ${data.message}`)
} }
}) })
} else { } else {
@@ -287,7 +287,7 @@ async function addSongManual() {
id: songs.value.length == 0 ? 1 : new List(songs.value).Max((s) => s.id) + 1, id: songs.value.length == 0 ? 1 : new List(songs.value).Max((s) => s.id) + 1,
} as SongRequestInfo } as SongRequestInfo
localActiveSongs.value.unshift(songData) localActiveSongs.value.unshift(songData)
message.success(`已手动添加曲目: ${songData.songName}`) message.success(`已手动添加: ${songData.songName}`)
} }
} }
async function updateSongStatus(song: SongRequestInfo, status: SongRequestStatus) { async function updateSongStatus(song: SongRequestInfo, status: SongRequestStatus) {
@@ -313,7 +313,7 @@ async function updateSongStatus(song: SongRequestInfo, status: SongRequestStatus
break break
case SongRequestStatus.Singing: case SongRequestStatus.Singing:
statusString = 'singing' statusString = 'singing'
statusString2 = '演唱中' statusString2 = '处理中'
break break
} }
await QueryGetAPI(SONG_REQUEST_API_URL + statusString, { await QueryGetAPI(SONG_REQUEST_API_URL + statusString, {
@@ -321,19 +321,19 @@ async function updateSongStatus(song: SongRequestInfo, status: SongRequestStatus
}) })
.then((data) => { .then((data) => {
if (data.code == 200) { if (data.code == 200) {
console.log(`[OPEN-LIVE-Song-Request] 更新曲目状态: ${song.songName} -> ${statusString}`) console.log(`[OPEN-LIVE-LIVE-REQUEST] 更新状态: ${song.songName} -> ${statusString}`)
song.status = status song.status = status
if (status > SongRequestStatus.Singing) { if (status > SongRequestStatus.Singing) {
song.finishAt = Date.now() song.finishAt = Date.now()
} }
message.success(`已更新曲目状态为: ${statusString2}`) message.success(`已更新状态为: ${statusString2}`)
} else { } else {
console.log(`[OPEN-LIVE-Song-Request] 更新曲目状态失败: ${data.message}`) console.log(`[OPEN-LIVE-LIVE-REQUEST] 更新状态失败: ${data.message}`)
message.error(`更新曲目状态失败: ${data.message}`) message.error(`更新状态失败: ${data.message}`)
} }
}) })
.catch((err) => { .catch((err) => {
message.error(`更新曲目状态失败`) message.error(`更新状态失败`)
}) })
.finally(() => { .finally(() => {
isLoading.value = false isLoading.value = false
@@ -376,20 +376,20 @@ async function onUpdateFunctionEnable() {
.then((data) => { .then((data) => {
if (data.code == 200) { if (data.code == 200) {
message.success( message.success(
`${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}功能`, `${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}功能`,
) )
} else { } else {
if (accountInfo.value) { if (accountInfo.value) {
accountInfo.value.settings.enableFunctions = oldValue accountInfo.value.settings.enableFunctions = oldValue
} }
message.error( message.error(
`功能${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}失败: ${data.message}`, `功能${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}失败: ${data.message}`,
) )
} }
}) })
.catch((err) => { .catch((err) => {
message.error( message.error(
`功能${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}失败: ${err}`, `功能${accountInfo.value?.settings.enableFunctions.includes(FunctionTypes.SongRequest) ? '启用' : '禁用'}失败: ${err}`,
) )
}) })
} }
@@ -677,12 +677,12 @@ async function updateActive() {
} else { } else {
originSongs.value.unshift(item) originSongs.value.unshift(item)
if (item.from == SongRequestFrom.Web) { if (item.from == SongRequestFrom.Web) {
message.success(`[${item.user?.name}] 直接从网页歌单点: ${item.songName}`) message.success(`[${item.user?.name}] 直接从网页歌单点: ${item.songName}`)
} }
} }
}) })
} else { } else {
message.error('无法获取点队列: ' + data.message) message.error('无法获取点队列: ' + data.message)
return [] return []
} }
} catch (err) {} } catch (err) {}
@@ -747,8 +747,8 @@ onUnmounted(() => {
</script> </script>
<template> <template>
<NAlert type="info" v-if="accountInfo"> <NAlert type="info" v-if="accountInfo.id">
启用弹幕点功能 启用弹幕点功能
<NSwitch <NSwitch
:value="accountInfo?.settings.enableFunctions.includes(FunctionTypes.SongRequest)" :value="accountInfo?.settings.enableFunctions.includes(FunctionTypes.SongRequest)"
@update:value="onUpdateFunctionEnable" @update:value="onUpdateFunctionEnable"
@@ -760,7 +760,7 @@ onUnmounted(() => {
<NButton text type="primary" tag="a" href="https://www.yuque.com/megghy/dez70g/vfvcyv3024xvaa1p" target="_blank"> <NButton text type="primary" tag="a" href="https://www.yuque.com/megghy/dez70g/vfvcyv3024xvaa1p" target="_blank">
VtsuruEventFetcher VtsuruEventFetcher
</NButton> </NButton>
则其需要保持此页面开启才能点, 也不要同时开多个页面, 会导致点重复 !(部署了则不影响) 则其需要保持此页面开启才能点, 也不要同时开多个页面, 会导致点重复 !(部署了则不影响)
</NText> </NText>
</NAlert> </NAlert>
<NAlert <NAlert
@@ -801,12 +801,12 @@ onUnmounted(() => {
<template #icon> <template #icon>
<NIcon :component="Checkmark12Regular" /> <NIcon :component="Checkmark12Regular" />
</template> </template>
今日已演唱 | 今日已处理 |
{{ {{
songs.filter((s) => s.status != SongRequestStatus.Cancel && isSameDay(s.finishAt ?? 0, Date.now())) songs.filter((s) => s.status != SongRequestStatus.Cancel && isSameDay(s.finishAt ?? 0, Date.now()))
.length .length
}} }}
</NTag> </NTag>
<NInputGroup> <NInputGroup>
<NInput placeholder="手动添加" v-model:value="newSongName" /> <NInput placeholder="手动添加" v-model:value="newSongName" />
@@ -1049,7 +1049,7 @@ onUnmounted(() => {
<NDivider> 规则 </NDivider> <NDivider> 规则 </NDivider>
<NSpace vertical> <NSpace vertical>
<NInputGroup style="width: 250px"> <NInputGroup style="width: 250px">
<NInputGroupLabel> 弹幕前缀 </NInputGroupLabel> <NInputGroupLabel> 弹幕前缀 </NInputGroupLabel>
<template v-if="configCanEdit"> <template v-if="configCanEdit">
<NInput v-model:value="settings.orderPrefix" /> <NInput v-model:value="settings.orderPrefix" />
<NButton @click="updateSettings" type="primary">确定</NButton> <NButton @click="updateSettings" type="primary">确定</NButton>
@@ -1075,7 +1075,7 @@ onUnmounted(() => {
@update:checked="updateSettings" @update:checked="updateSettings"
:disabled="!configCanEdit" :disabled="!configCanEdit"
> >
允许所有弹幕点 允许所有弹幕点
</NCheckbox> </NCheckbox>
<template v-if="!settings.allowAllDanmaku"> <template v-if="!settings.allowAllDanmaku">
<NCheckbox <NCheckbox
@@ -1118,7 +1118,7 @@ onUnmounted(() => {
</NSpace> </NSpace>
<NSpace align="center"> <NSpace align="center">
<NCheckbox v-model:checked="settings.allowSC" @update:checked="updateSettings" :disabled="!configCanEdit"> <NCheckbox v-model:checked="settings.allowSC" @update:checked="updateSettings" :disabled="!configCanEdit">
允许通过 SuperChat 允许通过 SuperChat
</NCheckbox> </NCheckbox>
<span v-if="settings.allowSC"> <span v-if="settings.allowSC">
<NCheckbox <NCheckbox
@@ -1126,13 +1126,13 @@ onUnmounted(() => {
@update:checked="updateSettings" @update:checked="updateSettings"
:disabled="!configCanEdit" :disabled="!configCanEdit"
> >
SC点歌无视限制 SC 点播无视限制
</NCheckbox> </NCheckbox>
<NTooltip> <NTooltip>
<template #trigger> <template #trigger>
<NIcon :component="Info24Filled" /> <NIcon :component="Info24Filled" />
</template> </template>
包含冷却时间, 队列长度, 重复点 包含冷却时间, 队列长度, 重复点
</NTooltip> </NTooltip>
</span> </span>
<NInputGroup v-if="settings.allowSC" style="width: 250px"> <NInputGroup v-if="settings.allowSC" style="width: 250px">
@@ -1141,6 +1141,7 @@ onUnmounted(() => {
<NButton @click="updateSettings" type="info" :disabled="!configCanEdit">确定</NButton> <NButton @click="updateSettings" type="info" :disabled="!configCanEdit">确定</NButton>
</NInputGroup> </NInputGroup>
</NSpace> </NSpace>
<NDivider> 点歌 </NDivider>
<NSpace> <NSpace>
<NCheckbox <NCheckbox
v-model:checked="settings.onlyAllowSongList" v-model:checked="settings.onlyAllowSongList"
@@ -1165,7 +1166,7 @@ onUnmounted(() => {
@update:checked="updateSettings" @update:checked="updateSettings"
:disabled="!configCanEdit" :disabled="!configCanEdit"
> >
启用点冷却 启用点冷却
</NCheckbox> </NCheckbox>
<NSpace v-if="settings.enableCooldown"> <NSpace v-if="settings.enableCooldown">
<NInputGroup style="width: 250px"> <NInputGroup style="width: 250px">
@@ -1190,7 +1191,14 @@ onUnmounted(() => {
</NInputGroup> </NInputGroup>
</NSpace> </NSpace>
<NDivider> OBS </NDivider> <NDivider> OBS </NDivider>
<NSpace> <NSpace align="center">
<NInputGroup style="width: 220px">
<NInputGroupLabel> 标题 </NInputGroupLabel>
<template v-if="configCanEdit">
<NInput v-model:value="settings.obsTitle" placeholder="默认为 点播" />
<NButton @click="updateSettings" type="primary">确定</NButton>
</template>
</NInputGroup>
<NCheckbox <NCheckbox
v-model:checked="settings.showRequireInfo" v-model:checked="settings.showRequireInfo"
:disabled="!configCanEdit" :disabled="!configCanEdit"
@@ -1203,24 +1211,24 @@ onUnmounted(() => {
:disabled="!configCanEdit" :disabled="!configCanEdit"
@update:checked="updateSettings" @update:checked="updateSettings"
> >
显示点用户名 显示点用户名
</NCheckbox> </NCheckbox>
<NCheckbox <NCheckbox
v-model:checked="settings.showFanMadelInfo" v-model:checked="settings.showFanMadelInfo"
:disabled="!configCanEdit" :disabled="!configCanEdit"
@update:checked="updateSettings" @update:checked="updateSettings"
> >
显示点用户粉丝牌 显示点用户粉丝牌
</NCheckbox> </NCheckbox>
</NSpace> </NSpace>
<NDivider> 其他 </NDivider> <NDivider> 其他 </NDivider>
<NCheckbox v-model:checked="isWarnMessageAutoClose"> 自动关闭点失败时的提示消息 </NCheckbox> <NCheckbox v-model:checked="isWarnMessageAutoClose"> 自动关闭点失败时的提示消息 </NCheckbox>
</NSpace> </NSpace>
</NSpin> </NSpin>
</NTabPane> </NTabPane>
</NTabs> </NTabs>
<template v-else> <template v-else>
<NAlert title="未启用" type="error"> 请先启用弹幕点功能 </NAlert> <NAlert title="未启用" type="error"> 请先启用弹幕点功能 </NAlert>
</template> </template>
</NCard> </NCard>
<NModal v-model:show="showOBSModal" title="OBS组件" preset="card" style="width: 800px"> <NModal v-model:show="showOBSModal" title="OBS组件" preset="card" style="width: 800px">
@@ -1230,7 +1238,7 @@ onUnmounted(() => {
<SongRequestOBS :id="accountInfo?.id" /> <SongRequestOBS :id="accountInfo?.id" />
</div> </div>
<br /> <br />
<NInput :value="'https://vtsuru.live/obs/song-request?id=' + accountInfo?.id" /> <NInput :value="'https://vtsuru.live/obs/live-request?id=' + accountInfo?.id" />
<NDivider /> <NDivider />
<NCollapse> <NCollapse>
<NCollapseItem title="使用说明"> <NCollapseItem title="使用说明">

View File

@@ -26,7 +26,7 @@ const accountInfo = useAccount()
<NCard hoverable embedded size="small" title="弹幕点歌" style="width: 300px"> <NCard hoverable embedded size="small" title="弹幕点歌" style="width: 300px">
通过弹幕或者SC进行点歌, 注册后可以保存和导出 (这个是歌势用的点歌, 不是拿来放歌的那种!) 通过弹幕或者SC进行点歌, 注册后可以保存和导出 (这个是歌势用的点歌, 不是拿来放歌的那种!)
<template #footer> <template #footer>
<NButton @click="$router.push({ name: 'open-live-song-request', query: $route.query })" type="primary"> <NButton @click="$router.push({ name: 'open-live-live-request', query: $route.query })" type="primary">
前往使用 前往使用
</NButton> </NButton>
</template> </template>

View File

@@ -749,7 +749,7 @@ onUnmounted(() => {
</script> </script>
<template> <template>
<NAlert type="info" v-if="accountInfo"> <NAlert type="info" v-if="accountInfo.id">
启用弹幕队列功能 启用弹幕队列功能
<NSwitch <NSwitch
:value="accountInfo?.settings.enableFunctions.includes(FunctionTypes.Queue)" :value="accountInfo?.settings.enableFunctions.includes(FunctionTypes.Queue)"

View File

View File

@@ -145,6 +145,14 @@ onMounted(() => {
<NButton @click="$router.push({ name: 'manage-questionBox' })" size="tiny" secondary> 回到控制台 </NButton> <NButton @click="$router.push({ name: 'manage-questionBox' })" size="tiny" secondary> 回到控制台 </NButton>
</template> </template>
<NFlex align="center"> <NFlex align="center">
<NSelect
v-model:value="useQB.displayTag"
placeholder="选择当前话题"
filterable
clearable
:options="useQB.tags.map((s) => ({ label: s.name, value: s.name }))"
style="width: 200px"
/>
<NButton @click="useQB.GetRecieveQAInfo" type="primary"> 刷新 </NButton> <NButton @click="useQB.GetRecieveQAInfo" type="primary"> 刷新 </NButton>
<NCheckbox v-model:checked="useQB.onlyFavorite"> 只显示收藏 </NCheckbox> <NCheckbox v-model:checked="useQB.onlyFavorite"> 只显示收藏 </NCheckbox>
<NCheckbox v-model:checked="useQB.onlyUnread"> 只显示未读 </NCheckbox> <NCheckbox v-model:checked="useQB.onlyUnread"> 只显示未读 </NCheckbox>

View File

@@ -16,6 +16,7 @@ import {
NInput, NInput,
NList, NList,
NListItem, NListItem,
NSelect,
NSpace, NSpace,
NText, NText,
NTime, NTime,
@@ -47,6 +48,8 @@ const isSelf = computed(() => {
const questionMessage = ref('') const questionMessage = ref('')
const fileList = ref<UploadFileInfo[]>([]) const fileList = ref<UploadFileInfo[]>([])
const publicQuestions = ref<QAInfo[]>([]) const publicQuestions = ref<QAInfo[]>([])
const tags = ref<string[]>([])
const selectedTag = ref()
const isAnonymous = ref(true) const isAnonymous = ref(true)
const isSending = ref(false) const isSending = ref(false)
@@ -57,7 +60,7 @@ function countGraphemes(value: string) {
} }
async function SendQuestion() { async function SendQuestion() {
if (countGraphemes(questionMessage.value) < 3) { if (countGraphemes(questionMessage.value) < 3) {
message.error('内容最少需要10个字') message.error('内容最少需要3个字')
return return
} }
isSending.value = true isSending.value = true
@@ -68,6 +71,7 @@ async function SendQuestion() {
IsAnonymous: !accountInfo.value || isAnonymous.value, IsAnonymous: !accountInfo.value || isAnonymous.value,
Message: questionMessage.value, Message: questionMessage.value,
ImageBase64: fileList.value?.length > 0 ? await getBase64(fileList.value[0].file) : undefined, ImageBase64: fileList.value?.length > 0 ? await getBase64(fileList.value[0].file) : undefined,
Tag: selectedTag.value,
}, },
[['Turnstile', token.value]], [['Turnstile', token.value]],
) )
@@ -125,9 +129,29 @@ function getPublicQuestions() {
isGetting.value = false isGetting.value = false
}) })
} }
function getTags() {
isGetting.value = true
QueryGetAPI<string[]>(QUESTION_API_URL + 'get-tags', {
id: userInfo?.id,
})
.then((data) => {
if (data.code == 200) {
tags.value = data.data
} else {
message.error('获取标签失败:' + data.message)
}
})
.catch((err) => {
message.error('获取标签失败: ' + err)
})
.finally(() => {
isGetting.value = false
})
}
onMounted(() => { onMounted(() => {
getPublicQuestions() getPublicQuestions()
getTags()
}) })
onUnmounted(() => { onUnmounted(() => {
@@ -140,6 +164,16 @@ onUnmounted(() => {
<NCard embedded> <NCard embedded>
<NSpace vertical> <NSpace vertical>
<NSpace align="center" justify="center"> <NSpace align="center" justify="center">
<NSelect
v-model:value="selectedTag"
placeholder="(可选) 要提问的话题"
filterable
clearable
:options="tags.map((s) => ({ label: s, value: s }))"
style="width: 200px"
>
<template #header> 不选的话则是默认话题 </template>
</NSelect>
<NInput <NInput
:disabled="isSelf" :disabled="isSelf"
show-count show-count
@@ -153,7 +187,7 @@ onUnmounted(() => {
:max="1" :max="1"
accept=".png,.jpg,.jpeg,.gif,.svg,.webp,.ico" accept=".png,.jpg,.jpeg,.gif,.svg,.webp,.ico"
list-type="image-card" list-type="image-card"
:disabled="!accountInfo || isSelf" :disabled="!accountInfo.id || isSelf"
:default-upload="false" :default-upload="false"
v-model:file-list="fileList" v-model:file-list="fileList"
@update:file-list="OnFileListChange" @update:file-list="OnFileListChange"
@@ -163,19 +197,18 @@ onUnmounted(() => {
</NSpace> </NSpace>
<NDivider style="margin: 10px 0 10px 0" /> <NDivider style="margin: 10px 0 10px 0" />
<NSpace align="center"> <NSpace align="center">
<NAlert v-if="!accountInfo && !isSelf" type="warning"> 只有注册用户才能够上传图片 </NAlert> <NAlert v-if="!accountInfo.id && !isSelf" type="warning"> 只有注册用户才能够上传图片 </NAlert>
</NSpace> </NSpace>
<NSpace vertical> <NSpace v-if="accountInfo.id" vertical>
<NCheckbox v-if="accountInfo" :disabled="isSelf" v-model:checked="isAnonymous" label="匿名提问" /> <NCheckbox :disabled="isSelf" v-model:checked="isAnonymous" label="匿名提问" />
<NDivider style="margin: 10px 0 10px 0" />
</NSpace> </NSpace>
<NDivider style="margin: 10px 0 10px 0" />
<NSpace justify="center"> <NSpace justify="center">
<NButton :disabled="isSelf" type="primary" :loading="isSending || !token" @click="SendQuestion"> <NButton :disabled="isSelf" type="primary" :loading="isSending || !token" @click="SendQuestion">
发送 发送
</NButton> </NButton>
<NButton <NButton
v-if="accountInfo" :disabled="isSelf || !accountInfo.id"
:disabled="isSelf"
type="info" type="info"
@click="$router.push({ name: 'manage-questionBox', query: { send: '1' } })" @click="$router.push({ name: 'manage-questionBox', query: { send: '1' } })"
> >

View File

@@ -6,8 +6,8 @@
:user-info="userInfo" :user-info="userInfo"
:bili-info="biliInfo" :bili-info="biliInfo"
:currentData="currentData" :currentData="currentData"
:song-request-settings="settings" :live-request-settings="settings"
:song-request-active="songsActive" :live-request-active="songsActive"
@request-song="requestSong" @request-song="requestSong"
v-bind="$attrs" v-bind="$attrs"
/> />
@@ -15,7 +15,7 @@
<script lang="ts" setup> <script lang="ts" setup>
import { useAccount } from '@/api/account' import { useAccount } from '@/api/account'
import { Setting_SongRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models' import { Setting_LiveRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models'
import { QueryGetAPI, QueryPostAPIWithParams } from '@/api/query' import { QueryGetAPI, QueryPostAPIWithParams } from '@/api/query'
import { SONG_API_URL, SONG_REQUEST_API_URL, SongListTemplateMap } from '@/data/constants' import { SONG_API_URL, SONG_REQUEST_API_URL, SongListTemplateMap } from '@/data/constants'
import { NSpin, useMessage } from 'naive-ui' import { NSpin, useMessage } from 'naive-ui'
@@ -40,11 +40,11 @@ const message = useMessage()
const errMessage = ref('') const errMessage = ref('')
const songsActive = ref<SongRequestInfo[]>([]) const songsActive = ref<SongRequestInfo[]>([])
const settings = ref<Setting_SongRequest>({} as Setting_SongRequest) const settings = ref<Setting_LiveRequest>({} as Setting_LiveRequest)
async function getSongRequestInfo() { async function getSongRequestInfo() {
try { try {
const data = await QueryGetAPI<{ songs: SongRequestInfo[]; setting: Setting_SongRequest }>( const data = await QueryGetAPI<{ songs: SongRequestInfo[]; setting: Setting_LiveRequest }>(
SONG_REQUEST_API_URL + 'get-active-and-settings', SONG_REQUEST_API_URL + 'get-active-and-settings',
{ {
id: props.userInfo?.id, id: props.userInfo?.id,
@@ -54,7 +54,7 @@ async function getSongRequestInfo() {
return data.data return data.data
} }
} catch (err) {} } catch (err) {}
return {} as { songs: SongRequestInfo[]; setting: Setting_SongRequest } return {} as { songs: SongRequestInfo[]; setting: Setting_LiveRequest }
} }
async function getSongs() { async function getSongs() {
isLoading.value = true isLoading.value = true

View File

@@ -0,0 +1,15 @@
<script lang="ts" setup>
import { UserInfo } from '@/api/api-models'
const props = defineProps<{
// eslint-disable-next-line @typescript-eslint/no-explicit-any
biliInfo: any | undefined
userInfo: UserInfo | undefined
template?: string | undefined
}>()
</script>
<template>
1
</template>

View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { useAccount } from '@/api/account' import { useAccount } from '@/api/account'
import { Setting_SongRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models' import { Setting_LiveRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models'
import SongList from '@/components/SongList.vue' import SongList from '@/components/SongList.vue'
import SongRequestOBS from '@/views/obs/SongRequestOBS.vue' import SongRequestOBS from '@/views/obs/SongRequestOBS.vue'
import { CloudAdd20Filled } from '@vicons/fluent' import { CloudAdd20Filled } from '@vicons/fluent'
@@ -13,7 +13,7 @@ const accountInfo = useAccount()
const props = defineProps<{ const props = defineProps<{
userInfo: UserInfo | undefined userInfo: UserInfo | undefined
biliInfo: any | undefined biliInfo: any | undefined
songRequestSettings: Setting_SongRequest songRequestSettings: Setting_LiveRequest
songRequestActive: SongRequestInfo[] songRequestActive: SongRequestInfo[]
currentData?: SongsInfo[] | undefined currentData?: SongsInfo[] | undefined
}>() }>()
@@ -48,7 +48,11 @@ const buttoms = (song: SongsInfo) => [
}, },
), ),
default: () => default: () =>
!props.songRequestSettings.allowFromWeb || song.options ? '点歌 | 用户不允许从网页点歌, 点击后将复制点歌内容到剪切板' : !accountInfo ? '点歌 | 你需要登录后才能点歌' : '点歌', !props.songRequestSettings.allowFromWeb || song.options
? '点歌 | 用户不允许从网页点歌, 点击后将复制点歌内容到剪切板'
: !accountInfo
? '点歌 | 你需要登录后才能点歌'
: '点歌',
}, },
) )
: undefined, : undefined,
@@ -57,7 +61,13 @@ const buttoms = (song: SongsInfo) => [
<template> <template>
<NDivider style="margin-top: 10px" /> <NDivider style="margin-top: 10px" />
<SongList v-if="currentData" :songs="currentData ?? []" :is-self="accountInfo?.id == userInfo?.id" :extra-buttom="buttoms" v-bind="$attrs" /> <SongList
v-if="currentData"
:songs="currentData ?? []"
:is-self="accountInfo?.id == userInfo?.id"
:extra-buttom="buttoms"
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>

View File

@@ -1,19 +1,37 @@
<script setup lang="ts"> <script setup lang="ts">
import { GetGuardColor } from '@/Utils' import { GetGuardColor } from '@/Utils'
import { useAccount } from '@/api/account' import { useAccount } from '@/api/account'
import { FunctionTypes, Setting_SongRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models' import { FunctionTypes, Setting_LiveRequest, SongRequestInfo, SongsInfo, UserInfo } from '@/api/api-models'
import SongPlayer from '@/components/SongPlayer.vue' import SongPlayer from '@/components/SongPlayer.vue'
import SongRequestOBS from '@/views/obs/SongRequestOBS.vue' import SongRequestOBS from '@/views/obs/SongRequestOBS.vue'
import { CloudAdd20Filled, Play24Filled } from '@vicons/fluent' import { CloudAdd20Filled, Play24Filled } from '@vicons/fluent'
import { useWindowSize } from '@vueuse/core' import { useWindowSize } from '@vueuse/core'
import { throttle } from 'lodash' import { throttle } from 'lodash'
import { NButton, NCard, NCollapseTransition, NDivider, NEllipsis, NEmpty, NGrid, NGridItem, NIcon, NInput, NPopover, NScrollbar, NSelect, NSpace, NTag, NText, NTooltip } from 'naive-ui' import {
NButton,
NCard,
NCollapseTransition,
NDivider,
NEllipsis,
NEmpty,
NGrid,
NGridItem,
NIcon,
NInput,
NPopover,
NScrollbar,
NSelect,
NSpace,
NTag,
NText,
NTooltip,
} from 'naive-ui'
import { computed, ref } from 'vue' import { computed, ref } from 'vue'
const props = defineProps<{ const props = defineProps<{
userInfo: UserInfo | undefined userInfo: UserInfo | undefined
biliInfo: any | undefined biliInfo: any | undefined
songRequestSettings: Setting_SongRequest songRequestSettings: Setting_LiveRequest
songRequestActive: SongRequestInfo[] songRequestActive: SongRequestInfo[]
currentData: SongsInfo[] | undefined currentData: SongsInfo[] | undefined
}>() }>()
@@ -86,14 +104,28 @@ function loadMore() {
} }
</script> </script>
<template> <template>
<div :style="{ display: 'flex', justifyContent: 'center', flexDirection: windowSize.width.value > 900 ? 'row' : 'column', gap: '10px', width: '100%' }"> <div
:style="{
display: 'flex',
justifyContent: 'center',
flexDirection: windowSize.width.value > 900 ? 'row' : 'column',
gap: '10px',
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 v-for="tag in tags" size="small" secondary :type="selectedTag == tag ? 'primary' : 'default'" @click="selectedTag == tag ? (selectedTag = '') : (selectedTag = tag)"> <NButton
v-for="tag in tags"
size="small"
secondary
:type="selectedTag == tag ? 'primary' : 'default'"
@click="selectedTag == tag ? (selectedTag = '') : (selectedTag = tag)"
>
{{ tag }} {{ tag }}
</NButton> </NButton>
</NSpace> </NSpace>
@@ -111,17 +143,32 @@ function loadMore() {
clearable clearable
/> />
<NDivider /> <NDivider />
<SongRequestOBS v-if="userInfo?.extra?.enableFunctions.includes(FunctionTypes.SongRequest)" :id="userInfo?.id" /> <SongRequestOBS
v-if="userInfo?.extra?.enableFunctions.includes(FunctionTypes.SongRequest)"
:id="userInfo?.id"
/>
</NSpace> </NSpace>
</NCard> </NCard>
<NEmpty v-if="!currentData || songs?.length == 0" description="暂无曲目" style="max-width: 0 auto" /> <NEmpty v-if="!currentData || songs?.length == 0" description="暂无曲目" style="max-width: 0 auto" />
<NScrollbar v-else ref="container" :style="{ flexGrow: 1, height: windowSize.width.value > 900 ? '90vh' : '800px', overflowY: 'auto', overflowX: 'hidden' }" @scroll="onScroll"> <NScrollbar
v-else
ref="container"
:style="{
flexGrow: 1,
height: windowSize.width.value > 900 ? '90vh' : '800px',
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 :style="`border-radius: 4px; background-color: ${item.options ? '#bd5757' : '#577fb8'}; width: 7px; height: 20px`"></div> <div
:style="`border-radius: 4px; background-color: ${item.options ? '#bd5757' : '#577fb8'}; width: 7px; height: 20px`"
></div>
<NEllipsis> <NEllipsis>
{{ item.name }} {{ item.name }}
</NEllipsis> </NEllipsis>
@@ -130,7 +177,11 @@ 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 size="small" text @click="selectedAuthor == author ? (selectedAuthor = undefined) : (selectedAuthor = author)"> <NButton
size="small"
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>
@@ -146,11 +197,19 @@ function loadMore() {
</NEllipsis> </NEllipsis>
<template v-if="item.options"> <template v-if="item.options">
<NSpace> <NSpace>
<NTag v-if="item.options?.scMinPrice" size="small" type="error" :bordered="false"> SC | {{ item.options?.scMinPrice }}</NTag> <NTag v-if="item.options?.scMinPrice" size="small" type="error" :bordered="false">
<NTag v-if="item.options?.fanMedalMinLevel" size="small" type="info" :bordered="false"> 粉丝牌 | {{ item.options?.fanMedalMinLevel }}</NTag> SC | {{ item.options?.scMinPrice }}</NTag
<NTag v-if="item.options?.needZongdu" size="small" :color="{ color: GetGuardColor(1) }"> 总督 </NTag> >
<NTag v-if="item.options?.fanMedalMinLevel" size="small" type="info" :bordered="false">
粉丝牌 | {{ item.options?.fanMedalMinLevel }}</NTag
>
<NTag v-if="item.options?.needZongdu" size="small" :color="{ color: GetGuardColor(1) }">
总督
</NTag>
<NTag v-if="item.options?.needTidu" size="small" :color="{ color: GetGuardColor(2) }"> 提督 </NTag> <NTag v-if="item.options?.needTidu" size="small" :color="{ color: GetGuardColor(2) }"> 提督 </NTag>
<NTag v-if="item.options?.needJianzhang" size="small" :color="{ color: GetGuardColor(3) }"> 舰长 </NTag> <NTag v-if="item.options?.needJianzhang" size="small" :color="{ color: GetGuardColor(3) }">
舰长
</NTag>
</NSpace> </NSpace>
</template> </template>
</NSpace> </NSpace>
@@ -159,7 +218,12 @@ 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 size="small" @click="selectedSong = item" type="success" :loading="isLrcLoading == item.key"> <NButton
size="small"
@click="selectedSong = item"
type="success"
:loading="isLrcLoading == item.key"
>
<template #icon> <template #icon>
<NIcon :component="Play24Filled" /> <NIcon :component="Play24Filled" />
</template> </template>
@@ -197,7 +261,9 @@ function loadMore() {
<NPopover v-if="(item.tags?.length ?? 0) > 3" trigger="hover"> <NPopover v-if="(item.tags?.length ?? 0) > 3" trigger="hover">
<template #trigger> <template #trigger>
<NButton size="small" secondary :type="item.tags?.includes(selectedTag) ? 'primary' : 'default'"> 标签 </NButton> <NButton size="small" secondary :type="item.tags?.includes(selectedTag) ? 'primary' : 'default'">
标签
</NButton>
</template> </template>
<NSpace :wrap="false"> <NSpace :wrap="false">
<NButton <NButton