update style

This commit is contained in:
2023-11-30 13:05:44 +08:00
parent 1c0f21044e
commit cfbfaf7938
6 changed files with 80 additions and 23 deletions

View File

@@ -33,6 +33,7 @@ import { NButton, NCard, NDivider, NLayoutContent, NSpace, NText, NTimeline, NTi
</NSpace>
<NDivider title-placement="left"> 更新日志 </NDivider>
<NTimeline>
<NTimelineItem type="info" title="功能更新" content="歌单添加 '简单' 模板" time="2023-11-30" />
<NTimelineItem type="success" title="功能添加" content="排队" time="2023-11-25" />
<NTimelineItem type="success" title="功能添加" content="点歌" time="2023-11-20" />
<NTimelineItem type="success" title="上架幻星平台" content="如题" time="2023-11-4" />

View File

@@ -10,17 +10,17 @@ const { width } = useWindowSize()
const functions = [
{
name: '直播事件记录',
desc: '能够记录并查询上舰和SC记录 (需要另外部署脚本',
desc: '能够记录并查询上舰和SC记录',
icon: VehicleShip24Filled,
},
{
name: '日程表',
desc: '提供多种样式的日程表 (样式还没做完',
desc: '提供多种样式的日程表',
icon: Calendar,
},
{
name: '歌单',
desc: '可以放自己的歌单或者能唱的歌, 支持多种样式 (样式也还没做完',
desc: '可以放自己的歌单或者能唱的歌, 支持多种样式',
icon: MusicalNote,
},
{

View File

@@ -2,7 +2,7 @@
import { SaveAccountSettings, SaveEnableFunctions, useAccount } from '@/api/account'
import { NButton, NCard, NCheckbox, NCheckboxGroup, NDivider, NForm, NModal, NSelect, NSpace, NSpin, NSwitch, NTabPane, NTabs, SelectOption, useMessage } from 'naive-ui'
import { Ref, computed, h, onMounted, ref, defineAsyncComponent, onActivated } from 'vue'
import { FunctionTypes, ScheduleWeekInfo, SongFrom, SongLanguage, SongsInfo } from '@/api/api-models'
import { FunctionTypes, ScheduleWeekInfo, SongFrom, SongLanguage, SongRequestOption, SongsInfo } from '@/api/api-models'
import { QueryPostAPI } from '@/api/query'
import { ACCOUNT_API_URL, FETCH_API, IndexTemplateMap, ScheduleTemplateMap, SongListTemplateMap } from '@/data/constants'
import { useRoute } from 'vue-router'
@@ -100,6 +100,8 @@ const templates = {
key: 'song1',
name: '歌曲1',
author: ['作者1'],
tags: ['标签1', '标签2'],
description: '这是一段描述',
url: 'https://example.com/song1.mp3',
from: SongFrom.Custom,
language: [SongLanguage.Chinese],
@@ -110,20 +112,29 @@ const templates = {
id: 2,
key: 'song2',
name: '歌曲2',
author: ['作者2'],
author: ['作者1'],
tags: ['标签1', '标签2'],
url: 'https://example.com/song2.mp3',
from: SongFrom.Custom,
language: [SongLanguage.Chinese],
createTime: Date.now(),
updateTime: Date.now(),
description: '这还是一段描述',
options: {
scMinPrice: 30,
fanMedalMinLevel: 5,
needJianzhang: true,
} as SongRequestOption
},
{
id: 3,
key: 'song3',
name: '歌曲3',
tags: ['标签3', '很长很长很长很长很长很长很长很长很长很长的标签'],
author: ['作者3'],
url: 'https://example.com/song3.mp3',
from: SongFrom.Custom,
description: '这是一段很长很长很长很长很长很长很长很长很长很长的描述',
language: [SongLanguage.Chinese],
createTime: Date.now(),
updateTime: Date.now(),
@@ -144,6 +155,7 @@ const templates = {
key: 'song5',
name: '歌曲5',
author: ['作者5'],
tags: ['标签1', '标签5', '标签6', '标签7', '标签8', '标签9', '标签10'],
url: 'https://example.com/song5.mp3',
from: SongFrom.Custom,
language: [SongLanguage.Chinese],

View File

@@ -379,6 +379,7 @@ onMounted(async () => {
>
刷新
</NButton>
<NButton @click="$router.push({ name: 'manage-index', query: { tab: 'template', template: 'songlist' } })"> 修改模板 </NButton>
</NSpace>
<NDivider style="margin: 16px 0 16px 0" />
<NModal v-model:show="showModal" style="max-width: 1000px" preset="card">

View File

@@ -49,6 +49,9 @@ const accountInfo = useAccount()
<p>
详见
<NButton text tag="a" href="/" target="_blank" type="primary"> VTsuru.live </NButton>
<NDivider vertical />
<NButton text tag="a" href="/about" target="_blank" type="info"> 关于本站 </NButton>
</p>
</NSpace>
</template>

View File

@@ -7,7 +7,7 @@ import SongRequestOBS from '@/views/obs/SongRequestOBS.vue'
import { CloudAdd20Filled, Play24Filled } from '@vicons/fluent'
import { useDebounceFn, useElementSize, useInfiniteScroll, useWindowSize } from '@vueuse/core'
import { debounce, throttle } from 'lodash'
import { NGridItem, NGrid, NCard, NSpace, NDivider, NButton, NCollapseTransition, NInput, NText, NEllipsis, NSelect, NEmpty, NIcon, NTag, NScrollbar, NTooltip } from 'naive-ui'
import { NGridItem, NGrid, NCard, NSpace, NDivider, NButton, NCollapseTransition, NInput, NText, NEllipsis, NSelect, NEmpty, NIcon, NTag, NScrollbar, NTooltip, NPopover } from 'naive-ui'
import { computed, ref } from 'vue'
const props = defineProps<{
@@ -127,7 +127,7 @@ function loadMore() {
</NEllipsis>
</NSpace>
</template>
<NText depth="3">
<NSpace vertical>
<NSpace v-if="(item.author?.length ?? 0) > 0" :size="0">
<div v-for="(author, index) in item.author" v-bind:key="author">
<NButton size="small" text @click="selectedAuthor == author ? (selectedAuthor = undefined) : (selectedAuthor = author)">
@@ -138,8 +138,9 @@ function loadMore() {
</NButton>
</div>
</NSpace>
</NText>
</NSpace>
<template #footer>
<NSpace vertical>
<NEllipsis>
{{ item.description }}
</NEllipsis>
@@ -152,9 +153,10 @@ function loadMore() {
<NTag v-if="item.options?.needJianzhang" size="small" :color="{ color: GetGuardColor(3) }"> 舰长 </NTag>
</NSpace>
</template>
</NSpace>
</template>
<template #action>
<NSpace>
<NSpace align="center" :wrap="false">
<NTooltip v-if="item.url">
<template #trigger>
<NButton size="small" @click="selectedSong = item" type="success" :loading="isLrcLoading == item.key">
@@ -176,7 +178,7 @@ function loadMore() {
isLoading = ''
}
"
:type="!songRequestSettings.allowFromWeb || item.options ? 'warning' : 'info'"
:type="songRequestSettings?.allowFromWeb == false || item.options ? 'warning' : 'info'"
:loading="isLoading == item.key"
>
<template #icon>
@@ -184,8 +186,46 @@ function loadMore() {
</template>
</NButton>
</template>
{{ !songRequestSettings.allowFromWeb || item.options ? '点歌 | 用户或此歌曲不允许从网页点歌, 点击后将复制点歌内容到剪切板' : !accountInfo ? '点歌 | 你需要登录后才能点歌' : '点歌' }}
{{
songRequestSettings?.allowFromWeb == false || item.options
? '点歌 | 用户或此歌曲不允许从网页点歌, 点击后将复制点歌内容到剪切板'
: !accountInfo
? '点歌 | 你需要登录后才能点歌'
: '点歌'
}}
</NTooltip>
<NPopover v-if="(item.tags?.length ?? 0) > 3" trigger="hover">
<template #trigger>
<NButton size="small" secondary :type="item.tags?.includes(selectedTag) ? 'primary' : 'default'"> 标签 </NButton>
</template>
<NSpace :wrap="false">
<NButton
v-for="tag in item.tags"
size="tiny"
:key="tag"
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
:type="selectedTag == tag ? 'primary' : 'default'"
>
<NEllipsis style="max-width: 50px">
{{ tag }}
</NEllipsis>
</NButton>
</NSpace>
</NPopover>
<NSpace v-else :wrap="false">
<NButton
v-for="tag in item.tags"
size="tiny"
:key="tag"
@click="() => (selectedTag == tag ? (selectedTag = '') : (selectedTag = tag))"
:type="selectedTag == tag ? 'primary' : 'default'"
>
<NEllipsis style="max-width: 50px">
{{ tag }}
</NEllipsis>
</NButton>
</NSpace>
</NSpace>
</template>
</NCard>