mirror of
https://github.com/Megghy/vtsuru.live.git
synced 2025-12-06 18:36:55 +08:00
merge to bun
This commit is contained in:
67
src/App.vue
67
src/App.vue
@@ -1,11 +1,6 @@
|
||||
<template>
|
||||
<NConfigProvider
|
||||
:theme-overrides="themeOverrides"
|
||||
:theme="theme"
|
||||
style="height: 100vh"
|
||||
:locale="zhCN"
|
||||
:date-locale="dateZhCN"
|
||||
>
|
||||
<NConfigProvider :theme-overrides="themeOverrides" :theme="theme" style="height: 100vh" :locale="zhCN"
|
||||
:date-locale="dateZhCN">
|
||||
<NMessageProvider>
|
||||
<NNotificationProvider>
|
||||
<NDialogProvider>
|
||||
@@ -36,10 +31,8 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useLoadingBarStore } from '@/store/useLoadingBarStore'
|
||||
import ManageLayout from '@/views/ManageLayout.vue'
|
||||
import ViewerLayout from '@/views/ViewerLayout.vue'
|
||||
import { useStorage } from '@vueuse/core'
|
||||
import {
|
||||
NConfigProvider,
|
||||
NDialogProvider,
|
||||
@@ -49,17 +42,14 @@ import {
|
||||
NMessageProvider,
|
||||
NNotificationProvider,
|
||||
NSpin,
|
||||
darkTheme,
|
||||
dateZhCN,
|
||||
useLoadingBar,
|
||||
useOsTheme,
|
||||
zhCN,
|
||||
zhCN
|
||||
} from 'naive-ui'
|
||||
import { computed, defineComponent, onMounted } from 'vue'
|
||||
import { computed } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { ThemeType } from './api/api-models'
|
||||
import OpenLiveLayout from './views/OpenLiveLayout.vue'
|
||||
import TempComponent from './components/TempComponent.vue'
|
||||
import { theme } from './Utils'
|
||||
import OpenLiveLayout from './views/OpenLiveLayout.vue'
|
||||
|
||||
const route = useRoute()
|
||||
|
||||
@@ -82,45 +72,52 @@ const layout = computed(() => {
|
||||
}
|
||||
})
|
||||
|
||||
const themeType = useStorage('Settings.Theme', ThemeType.Auto)
|
||||
const theme = computed(() => {
|
||||
if (themeType.value == ThemeType.Auto) {
|
||||
var osThemeRef = useOsTheme() //获取当前系统主题
|
||||
return osThemeRef.value === 'dark' ? darkTheme : null
|
||||
} else {
|
||||
return themeType.value == ThemeType.Dark ? darkTheme : null
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
const themeOverrides = {
|
||||
common: {
|
||||
//primaryColor: '#9ddddc',
|
||||
fontFamily:
|
||||
'"Noto Sans SC",-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important',
|
||||
'Inter ,"Noto Sans SC",-apple-system,blinkmacsystemfont,"Segoe UI",roboto,"Helvetica Neue",arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji"!important',
|
||||
},
|
||||
// ...
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="stylus">
|
||||
<style>
|
||||
:root {
|
||||
font-feature-settings: 'liga' 1, 'calt' 1;
|
||||
}
|
||||
|
||||
@supports (font-variation-settings: normal) {
|
||||
:root {
|
||||
font-family: InterVariable, sans-serif;
|
||||
}
|
||||
}
|
||||
|
||||
/* 进入和离开过渡的样式 */
|
||||
.v-enter-from,
|
||||
.v-leave-to {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
/* 离开和进入过程中的样式 */
|
||||
.v-enter-active,
|
||||
.v-leave-active {
|
||||
/* 添加过渡动画 */
|
||||
transition: opacity 0.5s ease;
|
||||
}
|
||||
|
||||
/* 进入之后和离开之前的样式 */
|
||||
.v-enter-to,
|
||||
.v-leave-from {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.bounce-enter-active {
|
||||
animation: bounce 0.3s;
|
||||
}
|
||||
|
||||
.bounce-leave-active {
|
||||
animation: bounce 0.3s reverse;
|
||||
}
|
||||
@@ -130,14 +127,17 @@ const themeOverrides = {
|
||||
transform: scale(1);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
60% {
|
||||
transform: scale(1.1);
|
||||
}
|
||||
|
||||
100% {
|
||||
transform: scale(1);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.fade-enter-active,
|
||||
.fade-leave-active {
|
||||
transition: opacity 0.3s ease;
|
||||
@@ -152,6 +152,7 @@ const themeOverrides = {
|
||||
.scale-leave-active {
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.scale-enter-from,
|
||||
.scale-leave-to {
|
||||
opacity: 0;
|
||||
@@ -162,18 +163,22 @@ const themeOverrides = {
|
||||
.slide-leave-active {
|
||||
transition: all 0.5s ease-out;
|
||||
}
|
||||
|
||||
.slide-enter-to {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.slide-enter-from {
|
||||
position: absolute;
|
||||
right: -100%;
|
||||
}
|
||||
|
||||
.slide-leave-to {
|
||||
position: absolute;
|
||||
left: -100%;
|
||||
}
|
||||
|
||||
.slide-leave-from {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
@@ -183,20 +188,24 @@ const themeOverrides = {
|
||||
.slide-up-leave-active {
|
||||
transition: all 0.5s ease-out;
|
||||
}
|
||||
|
||||
.slide-up-enter-to {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.slide-up-enter-from {
|
||||
position: absolute;
|
||||
top: -100%;
|
||||
}
|
||||
|
||||
.slide-up-leave-to {
|
||||
position: absolute;
|
||||
bottom : -100%;
|
||||
bottom: -100%;
|
||||
}
|
||||
|
||||
.slide-up-leave-from {
|
||||
position: absolute;
|
||||
bottom : 0;
|
||||
bottom: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
49
src/Utils.ts
49
src/Utils.ts
@@ -1,16 +1,44 @@
|
||||
import { useStorage } from '@vueuse/core'
|
||||
import { UploadFileInfo, createDiscreteApi, useOsTheme } from 'naive-ui'
|
||||
import {
|
||||
ConfigProviderProps,
|
||||
UploadFileInfo,
|
||||
createDiscreteApi,
|
||||
darkTheme,
|
||||
dateZhCN,
|
||||
useOsTheme,
|
||||
zhCN
|
||||
} from 'naive-ui'
|
||||
import { ThemeType } from './api/api-models'
|
||||
import { computed } from 'vue'
|
||||
import { VTSURU_API_URL } from './data/constants'
|
||||
import { DiscreteApiType } from 'naive-ui/es/discrete/src/interface'
|
||||
|
||||
const { message } = createDiscreteApi(['message'])
|
||||
|
||||
const osThemeRef = useOsTheme() //获取当前系统主题
|
||||
const themeType = useStorage('Settings.Theme', ThemeType.Auto)
|
||||
export const theme = computed(() => {
|
||||
if (themeType.value == ThemeType.Auto) {
|
||||
var osThemeRef = useOsTheme() //获取当前系统主题
|
||||
return osThemeRef.value === 'dark' ? darkTheme : null
|
||||
} else {
|
||||
return themeType.value == ThemeType.Dark ? darkTheme : null
|
||||
}
|
||||
})
|
||||
export const configProviderPropsRef = computed<ConfigProviderProps>(() => ({
|
||||
theme: theme.value,
|
||||
locale: zhCN,
|
||||
dateLocale: dateZhCN,
|
||||
|
||||
}))
|
||||
export function createNaiveUIApi(types: DiscreteApiType[]) {
|
||||
return createDiscreteApi(types, {
|
||||
configProviderProps: configProviderPropsRef
|
||||
})
|
||||
}
|
||||
export function NavigateToNewTab(url: string) {
|
||||
window.open(url, '_blank')
|
||||
}
|
||||
const themeType = useStorage('Settings.Theme', ThemeType.Auto)
|
||||
export const isDarkMode = computed(() => {
|
||||
if (themeType.value == ThemeType.Auto) return osThemeRef.value === 'dark'
|
||||
else return themeType.value == ThemeType.Dark
|
||||
@@ -73,22 +101,25 @@ export function downloadImage(imageSrc: string, filename: string) {
|
||||
}
|
||||
image.src = imageSrc
|
||||
}
|
||||
export function getBase64(file: File | undefined | null): Promise<string | undefined> {
|
||||
export function getBase64(
|
||||
file: File | undefined | null
|
||||
): Promise<string | undefined> {
|
||||
if (!file) return new Promise((resolve) => resolve(undefined))
|
||||
return new Promise((resolve, reject) => {
|
||||
const reader = new FileReader()
|
||||
reader.readAsDataURL(file)
|
||||
reader.onload = () => resolve(reader.result?.toString().split(',')[1] || undefined)
|
||||
reader.onload = () =>
|
||||
resolve(reader.result?.toString().split(',')[1] || undefined)
|
||||
reader.onerror = (error) => reject(error)
|
||||
})
|
||||
}
|
||||
export async function getImageUploadModel(
|
||||
files: UploadFileInfo[] | undefined | null,
|
||||
maxSize: number = 10 * 1024 * 1024,
|
||||
maxSize: number = 10 * 1024 * 1024
|
||||
) {
|
||||
const result = {
|
||||
existImages: [],
|
||||
newImagesBase64: [],
|
||||
newImagesBase64: []
|
||||
} as { existImages: string[]; newImagesBase64: string[] }
|
||||
if (!files) return result
|
||||
for (let i = 0; i < files.length; i++) {
|
||||
@@ -146,7 +177,11 @@ export class GuidUtils {
|
||||
const bytes = new Uint8Array(buffer)
|
||||
const guid = bytes.reduce((str, byte, idx) => {
|
||||
const pair = byte.toString(16).padStart(2, '0')
|
||||
return str + pair + (idx === 3 || idx === 5 || idx === 7 || idx === 9 ? '-' : '')
|
||||
return (
|
||||
str +
|
||||
pair +
|
||||
(idx === 3 || idx === 5 || idx === 7 || idx === 9 ? '-' : '')
|
||||
)
|
||||
}, '')
|
||||
return guid
|
||||
}
|
||||
|
||||
@@ -135,7 +135,7 @@ defineEmits<{
|
||||
<template #trigger>
|
||||
<img :src="'https://' + danmaku.msg + `@22h`" referrerpolicy="no-referrer" :style="`max-height: ${height}px;display:inline-flex;`" />
|
||||
</template>
|
||||
<img :src="'https://' + danmaku.msg ?? ''" referrerpolicy="no-referrer" />
|
||||
<img :src="'https://' + danmaku.msg" referrerpolicy="no-referrer" />
|
||||
</NTooltip>
|
||||
</template>
|
||||
<template v-else>
|
||||
|
||||
@@ -1,13 +1,14 @@
|
||||
<script setup lang="ts">
|
||||
import { useLoadingBarStore } from '@/store/useLoadingBarStore'
|
||||
import { useLoadingBar } from 'naive-ui'
|
||||
import { useLoadingBar, useMessage } from 'naive-ui'
|
||||
import { onMounted } from 'vue'
|
||||
|
||||
// Setup code
|
||||
onMounted(() => {
|
||||
window.$loadingBar = useLoadingBar()
|
||||
window.$message = useMessage()
|
||||
const providerStore = useLoadingBarStore()
|
||||
const loadingBar = useLoadingBar()
|
||||
providerStore.setLoadingBar(loadingBar)
|
||||
providerStore.setLoadingBar(window.$loadingBar)
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
@@ -13,7 +13,8 @@ export type TemplateConfig<T> = {
|
||||
onConfirm?: (arg0: T) => void
|
||||
}
|
||||
interface TemplateConfigBase {
|
||||
name: string
|
||||
name: string | VNode
|
||||
key: string //将被保存到指定key中
|
||||
}
|
||||
|
||||
type CommonProps = TemplateConfigBase
|
||||
@@ -27,7 +28,6 @@ export type TemplateConfigItemWithType<T, V> = CommonProps & { data?: DataAccess
|
||||
|
||||
export type TemplateConfigStringItem<T> = TemplateConfigItemWithType<T, string> & {
|
||||
type: 'string'
|
||||
key: string //将被保存到指定key中
|
||||
}
|
||||
export type TemplateConfigStringArrayItem<T> = TemplateConfigItemWithType<T, string[]> & {
|
||||
type: 'stringArray'
|
||||
@@ -51,7 +51,6 @@ export type TemplateConfigRenderItem<T> = TemplateConfigBase & {
|
||||
export type TemplateConfigImageItem<T> = TemplateConfigBase & {
|
||||
type: 'image' // Specifies the type of configuration item as 'image'.
|
||||
imageLimit: number // The maximum number of images allowed.
|
||||
key: string //图片将被保存到指定key中, 类型为字符串数组
|
||||
/**
|
||||
* Callback function triggered upon image upload.
|
||||
* @param {string[]} uploadedImages - The uploaded image or array of images.
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
import { DanmakuUserInfo, SongFrom, SongsInfo } from '@/api/api-models'
|
||||
import { createNaiveUIApi, theme } from '@/Utils'
|
||||
import { useStorage } from '@vueuse/core'
|
||||
import { useMessage } from 'naive-ui'
|
||||
import { ConfigProviderProps, createDiscreteApi, zhCN } from 'naive-ui'
|
||||
import { defineStore } from 'pinia'
|
||||
import { computed, ref } from 'vue'
|
||||
|
||||
@@ -34,16 +35,21 @@ export type MusicRequestSettings = {
|
||||
}
|
||||
|
||||
export const useMusicRequestProvider = defineStore('MusicRequest', () => {
|
||||
const waitingMusics = useStorage<WaitMusicInfo[]>('Setting.MusicRequest.Waiting', [])
|
||||
const waitingMusics = useStorage<WaitMusicInfo[]>(
|
||||
'Setting.MusicRequest.Waiting',
|
||||
[]
|
||||
)
|
||||
const originMusics = ref<SongsInfo[]>([])
|
||||
const aplayerMusics = computed(() => originMusics.value.map((m) => songToMusic(m)))
|
||||
const aplayerMusics = computed(() =>
|
||||
originMusics.value.map((m) => songToMusic(m))
|
||||
)
|
||||
const currentMusic = ref<Music>({
|
||||
id: -1,
|
||||
title: '',
|
||||
artist: '',
|
||||
src: '',
|
||||
pic: '',
|
||||
lrc: '',
|
||||
lrc: ''
|
||||
} as Music)
|
||||
const currentOriginMusic = ref<WaitMusicInfo>()
|
||||
const isPlayingOrderMusic = ref(false)
|
||||
@@ -60,20 +66,29 @@ export const useMusicRequestProvider = defineStore('MusicRequest', () => {
|
||||
orderMusicFirst: true,
|
||||
platform: 'netease',
|
||||
|
||||
blacklist: [],
|
||||
blacklist: []
|
||||
})
|
||||
|
||||
const message = useMessage()
|
||||
const message = window.$message
|
||||
|
||||
function addWaitingMusic(info: WaitMusicInfo) {
|
||||
if ((settings.value.orderMusicFirst && !isPlayingOrderMusic.value) || aplayerRef.value?.audio.paused == true) {
|
||||
if (
|
||||
(settings.value.orderMusicFirst && !isPlayingOrderMusic.value) ||
|
||||
aplayerRef.value?.audio.paused == true
|
||||
) {
|
||||
playMusic(info.music)
|
||||
isPlayingOrderMusic.value = true
|
||||
console.log(`正在播放 [${info.from.name}] 点的 ${info.music.name} - ${info.music.author?.join('/')}`)
|
||||
message.success(`正在播放 [${info.from.name}] 点的 ${info.music.name} - ${info.music.author?.join('/')}`)
|
||||
console.log(
|
||||
`正在播放 [${info.from.name}] 点的 ${info.music.name} - ${info.music.author?.join('/')}`
|
||||
)
|
||||
message.success(
|
||||
`正在播放 [${info.from.name}] 点的 ${info.music.name} - ${info.music.author?.join('/')}`
|
||||
)
|
||||
} else {
|
||||
waitingMusics.value.push(info)
|
||||
message.success(`[${info.from.name}] 点了一首 ${info.music.name} - ${info.music.author?.join('/')}`)
|
||||
message.success(
|
||||
`[${info.from.name}] 点了一首 ${info.music.name} - ${info.music.author?.join('/')}`
|
||||
)
|
||||
}
|
||||
}
|
||||
function onMusicEnd() {
|
||||
@@ -127,9 +142,12 @@ export const useMusicRequestProvider = defineStore('MusicRequest', () => {
|
||||
id: s.id,
|
||||
title: s.name,
|
||||
artist: s.author?.join('/'),
|
||||
src: s.from == SongFrom.Netease ? `https://music.163.com/song/media/outer/url?id=${s.id}.mp3` : s.url,
|
||||
src:
|
||||
s.from == SongFrom.Netease
|
||||
? `https://music.163.com/song/media/outer/url?id=${s.id}.mp3`
|
||||
: s.url,
|
||||
pic: s.cover ?? '',
|
||||
lrc: '',
|
||||
lrc: ''
|
||||
} as Music
|
||||
}
|
||||
function setSinkId() {
|
||||
@@ -166,6 +184,6 @@ export const useMusicRequestProvider = defineStore('MusicRequest', () => {
|
||||
onMusicPlay,
|
||||
pauseMusic,
|
||||
nextMusic,
|
||||
aplayerRef,
|
||||
aplayerRef
|
||||
}
|
||||
})
|
||||
|
||||
@@ -4,6 +4,7 @@ import { BiliAuthCodeStatusType, BiliAuthModel } from '@/api/api-models'
|
||||
import { QueryGetAPI, QueryPostAPI } from '@/api/query'
|
||||
import EventFetcherStatusCard from '@/components/EventFetcherStatusCard.vue'
|
||||
import { ACCOUNT_API_URL, TURNSTILE_KEY } from '@/data/constants'
|
||||
import { useAuthStore } from '@/store/useAuthStore'
|
||||
import { Info24Filled, Mic24Filled, Question24Regular } from '@vicons/fluent'
|
||||
import { useLocalStorage } from '@vueuse/core'
|
||||
import {
|
||||
@@ -14,23 +15,25 @@ import {
|
||||
NCountdown,
|
||||
NDivider,
|
||||
NEllipsis,
|
||||
NFlex,
|
||||
NIcon,
|
||||
NInput,
|
||||
NInputGroup,
|
||||
NModal,
|
||||
NPopconfirm,
|
||||
NSpace,
|
||||
NTabPane,
|
||||
NTabs,
|
||||
NTag,
|
||||
NText,
|
||||
NTime,
|
||||
NTooltip,
|
||||
useLoadingBar,
|
||||
useMessage,
|
||||
useMessage
|
||||
} from 'naive-ui'
|
||||
import { onUnmounted, ref } from 'vue'
|
||||
import VueTurnstile from 'vue-turnstile'
|
||||
import SettingsManageView from './SettingsManageView.vue'
|
||||
import { useAuthStore } from '@/store/useAuthStore'
|
||||
import Setting_PaymentView from './Setting_PaymentView.vue'
|
||||
|
||||
const token = ref('')
|
||||
const turnstile = ref()
|
||||
@@ -283,7 +286,7 @@ onUnmounted(() => {
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<NSpace justify="center" align="center" vertical style="width: 100%">
|
||||
<NFlex justify="center" align="center" vertical>
|
||||
<NAlert type="warning" title="2024.2.26">
|
||||
近期逸站对开放平台直播弹幕流进行了极为严格的限制, 目前本站服务器只能连接个位数的直播间, 这使得在不使用
|
||||
<NButton tag="a" href="https://www.yuque.com/megghy/dez70g/vfvcyv3024xvaa1p" target="_blank" type="primary" text>
|
||||
@@ -297,169 +300,162 @@ onUnmounted(() => {
|
||||
</NButton>
|
||||
以获得完整的功能体验
|
||||
</NAlert>
|
||||
<NCard embedded style="width: 100%">
|
||||
<NSpace align="center" justify="center" vertical>
|
||||
<NText style="font-size: 3rem">
|
||||
{{ accountInfo?.name }}
|
||||
</NText>
|
||||
<NText style="color: gray">
|
||||
于
|
||||
<NTime :time="accountInfo?.createAt" />
|
||||
注册
|
||||
</NText>
|
||||
</NSpace>
|
||||
<NDivider>
|
||||
<NText depth="3" style="font-size: 18px"> {{ accountInfo?.id }} </NText>
|
||||
</NDivider>
|
||||
<NSpace vertical>
|
||||
<NCard size="small">
|
||||
<NSpace :size="5">
|
||||
邮箱:
|
||||
<NEllipsis v-if="accountInfo?.isEmailVerified" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)"> 已认证 | {{ accountInfo?.bindEmail }} </NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small"> 未认证 </NTag>
|
||||
</template>
|
||||
<NButton
|
||||
v-if="accountInfo?.isEmailVerified"
|
||||
type="warning"
|
||||
size="tiny"
|
||||
@click="resetEmailModalVisiable = true"
|
||||
>
|
||||
修改邮箱
|
||||
</NButton>
|
||||
</NSpace>
|
||||
</NCard>
|
||||
<NCard size="small">
|
||||
主播 Bilibili 账户:
|
||||
<NEllipsis v-if="accountInfo?.isBiliVerified" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)">
|
||||
<NSpace :size="5" align="center">
|
||||
已认证 | {{ accountInfo?.biliId }}
|
||||
<NTag
|
||||
v-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Active"
|
||||
type="success"
|
||||
size="small"
|
||||
:bordered="false"
|
||||
>
|
||||
身份码: 有效
|
||||
</NTag>
|
||||
<NTag
|
||||
v-else-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Inactive"
|
||||
type="error"
|
||||
size="small"
|
||||
:bordered="false"
|
||||
>
|
||||
身份码: 需更新
|
||||
</NTag>
|
||||
<NTag
|
||||
v-else-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Notfound"
|
||||
type="warning"
|
||||
size="small"
|
||||
:bordered="false"
|
||||
>
|
||||
身份码: 需绑定
|
||||
<NTooltip>
|
||||
<NTabs type="segment" animated v-if="accountInfo" style="width: 100%;">
|
||||
<NTabPane name="info" tab="个人信息" style="width: 100%;" display-directive="show:lazy">
|
||||
<NFlex justify="center" align="center">
|
||||
<NCard embedded style="width: 100%;max-width: 800px;">
|
||||
<NSpace align="center" justify="center" vertical>
|
||||
<NText style="font-size: 3rem">
|
||||
{{ accountInfo?.name }}
|
||||
</NText>
|
||||
<NText style="color: gray">
|
||||
于
|
||||
<NTime :time="accountInfo?.createAt" />
|
||||
注册
|
||||
</NText>
|
||||
</NSpace>
|
||||
<NDivider>
|
||||
<NText depth="3" style="font-size: 18px"> {{ accountInfo?.id }} </NText>
|
||||
</NDivider>
|
||||
<NSpace vertical>
|
||||
<NCard size="small">
|
||||
<NSpace :size="5">
|
||||
邮箱:
|
||||
<NEllipsis v-if="accountInfo?.isEmailVerified" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)"> 已认证 | {{ accountInfo?.bindEmail }} </NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small"> 未认证 </NTag>
|
||||
</template>
|
||||
<NButton v-if="accountInfo?.isEmailVerified" type="warning" size="tiny"
|
||||
@click="resetEmailModalVisiable = true">
|
||||
修改邮箱
|
||||
</NButton>
|
||||
</NSpace>
|
||||
</NCard>
|
||||
<NCard size="small">
|
||||
主播 Bilibili 账户:
|
||||
<NEllipsis v-if="accountInfo?.isBiliVerified" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)">
|
||||
<NSpace :size="5" align="center">
|
||||
已认证 | {{ accountInfo?.biliId }}
|
||||
<NTag v-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Active" type="success"
|
||||
size="small" :bordered="false">
|
||||
身份码: 有效
|
||||
</NTag>
|
||||
<NTag v-else-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Inactive" type="error"
|
||||
size="small" :bordered="false">
|
||||
身份码: 需更新
|
||||
</NTag>
|
||||
<NTag v-else-if="accountInfo.biliAuthCodeStatus == BiliAuthCodeStatusType.Notfound" type="warning"
|
||||
size="small" :bordered="false">
|
||||
身份码: 需绑定
|
||||
<NTooltip>
|
||||
<template #trigger>
|
||||
<NIcon :component="Mic24Filled" />
|
||||
</template>
|
||||
如果你不是主播的话则不需要在意这个提示
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NButton size="tiny" type="info" @click="bindBiliCodeModalVisiable = true"> 更新身份码 </NButton>
|
||||
<NPopconfirm @positive-click="resetBili">
|
||||
<template #trigger>
|
||||
<NButton size="tiny" type="error"> 解除认证 </NButton>
|
||||
</template>
|
||||
确定解除认证吗? 解除后现有的数据跟踪数据将被删除并且无法恢复
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small">
|
||||
未绑定
|
||||
<NTooltip>
|
||||
<template #trigger>
|
||||
<NIcon :component="Info24Filled" />
|
||||
</template>
|
||||
如果你不是主播的话则不需要在意这个
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NDivider vertical />
|
||||
<NButton size="small" @click="bindBiliCodeModalVisiable = true" type="info"> 进行绑定 </NButton>
|
||||
</template>
|
||||
</NCard>
|
||||
<NCard size="small">
|
||||
用户 Bilibili 账户:
|
||||
<NEllipsis v-if="accountInfo?.biliUserAuthInfo" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)">
|
||||
<NSpace :size="5" align="center">
|
||||
已绑定 | {{ accountInfo?.biliUserAuthInfo?.name }} [{{ accountInfo?.biliUserAuthInfo?.userId }}]
|
||||
<NPopconfirm @positive-click="resetBiliAuthBind">
|
||||
<template #trigger>
|
||||
<NButton size="tiny" type="error"> 解除绑定 </NButton>
|
||||
</template>
|
||||
确定解除绑定吗?
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small">
|
||||
未认证
|
||||
<NTooltip>
|
||||
<template #trigger>
|
||||
<NIcon :component="Info24Filled" />
|
||||
</template>
|
||||
用于进行积分兑换等操作, 如果你是主播可以不用管,
|
||||
并且即使不绑定也可以直接用认证完成给出的链接查看和使用积分
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NDivider vertical />
|
||||
<NButton size="small" @click="bindBiliAuthModalVisiable = true" type="info"> 进行认证 </NButton>
|
||||
</template>
|
||||
</NCard>
|
||||
<EventFetcherStatusCard />
|
||||
<NAlert title="Token" type="info">
|
||||
请注意保管, 这个东西可以完全操作你的账号
|
||||
<NInputGroup>
|
||||
<NInput type="password" :value="accountInfo?.token" show-password-on="click" status="error" />
|
||||
<NPopconfirm @positive-click="resetToken">
|
||||
<template #trigger>
|
||||
<NIcon :component="Mic24Filled" />
|
||||
<NButton type="error"> 重置 </NButton>
|
||||
</template>
|
||||
如果你不是主播的话则不需要在意这个提示
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NButton size="tiny" type="info" @click="bindBiliCodeModalVisiable = true"> 更新身份码 </NButton>
|
||||
<NPopconfirm @positive-click="resetBili">
|
||||
<template #trigger>
|
||||
<NButton size="tiny" type="error"> 解除认证 </NButton>
|
||||
</template>
|
||||
确定解除认证吗? 解除后现有的数据跟踪数据将被删除并且无法恢复
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small">
|
||||
未绑定
|
||||
<NTooltip>
|
||||
确定要重新生成 Token 吗? EventFetcher 等设施将需要重新部署
|
||||
</NPopconfirm>
|
||||
</NInputGroup>
|
||||
</NAlert>
|
||||
</NSpace>
|
||||
<NDivider />
|
||||
<NSpace justify="center">
|
||||
<NButton type="info" @click="resetNameModalVisiable = true"> 修改用户名 </NButton>
|
||||
<NButton type="warning" @click="resetPasswordModalVisiable = true"> 修改密码 </NButton>
|
||||
<NPopconfirm @positive-click="logout">
|
||||
<template #trigger>
|
||||
<NIcon :component="Info24Filled" />
|
||||
<NButton type="error"> 登出 </NButton>
|
||||
</template>
|
||||
如果你不是主播的话则不需要在意这个
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NDivider vertical />
|
||||
<NButton size="small" @click="bindBiliCodeModalVisiable = true" type="info"> 进行绑定 </NButton>
|
||||
</template>
|
||||
</NCard>
|
||||
<NCard size="small">
|
||||
用户 Bilibili 账户:
|
||||
<NEllipsis v-if="accountInfo?.biliUserAuthInfo" style="max-width: 100%">
|
||||
<NText style="color: var(--primary-color)">
|
||||
<NSpace :size="5" align="center">
|
||||
已绑定 | {{ accountInfo?.biliUserAuthInfo?.name }} [{{ accountInfo?.biliUserAuthInfo?.userId }}]
|
||||
<NPopconfirm @positive-click="resetBiliAuthBind">
|
||||
<template #trigger>
|
||||
<NButton size="tiny" type="error"> 解除绑定 </NButton>
|
||||
</template>
|
||||
确定解除绑定吗?
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NText>
|
||||
</NEllipsis>
|
||||
<template v-else>
|
||||
<NTag type="error" size="small">
|
||||
未认证
|
||||
<NTooltip>
|
||||
<template #trigger>
|
||||
<NIcon :component="Info24Filled" />
|
||||
</template>
|
||||
用于进行积分兑换等操作, 如果你是主播可以不用管,
|
||||
并且即使不绑定也可以直接用认证完成给出的链接查看和使用积分
|
||||
</NTooltip>
|
||||
</NTag>
|
||||
<NDivider vertical />
|
||||
<NButton size="small" @click="bindBiliAuthModalVisiable = true" type="info"> 进行认证 </NButton>
|
||||
</template>
|
||||
</NCard>
|
||||
<EventFetcherStatusCard />
|
||||
<NAlert title="Token" type="info">
|
||||
请注意保管, 这个东西可以完全操作你的账号
|
||||
<NInputGroup>
|
||||
<NInput type="password" :value="accountInfo?.token" show-password-on="click" status="error" />
|
||||
<NPopconfirm @positive-click="resetToken">
|
||||
<template #trigger>
|
||||
<NButton type="error"> 重置 </NButton>
|
||||
</template>
|
||||
确定要重新生成 Token 吗? EventFetcher 等设施将需要重新部署
|
||||
</NPopconfirm>
|
||||
</NInputGroup>
|
||||
</NAlert>
|
||||
</NSpace>
|
||||
<NDivider />
|
||||
<NSpace justify="center">
|
||||
<NButton type="info" @click="resetNameModalVisiable = true"> 修改用户名 </NButton>
|
||||
<NButton type="warning" @click="resetPasswordModalVisiable = true"> 修改密码 </NButton>
|
||||
<NPopconfirm @positive-click="logout">
|
||||
<template #trigger>
|
||||
<NButton type="error"> 登出 </NButton>
|
||||
</template>
|
||||
确定登出?
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NCard>
|
||||
</NSpace>
|
||||
<div>
|
||||
<NDivider />
|
||||
<SettingsManageView />
|
||||
<NDivider />
|
||||
</div>
|
||||
确定登出?
|
||||
</NPopconfirm>
|
||||
</NSpace>
|
||||
</NCard>
|
||||
</NFlex>
|
||||
</NTabPane>
|
||||
<NTabPane name="setting" tab="设置" display-directive="show:lazy">
|
||||
<SettingsManageView />
|
||||
</NTabPane>
|
||||
<NTabPane name="payment" tab="增值" display-directive="show:lazy">
|
||||
<Setting_PaymentView />
|
||||
</NTabPane>
|
||||
</NTabs>
|
||||
</NFlex>
|
||||
<NModal v-model:show="resetEmailModalVisiable" preset="card" title="改绑邮箱" style="width: 400px; max-width: 90%">
|
||||
<NSpace vertical>
|
||||
<NInput v-model:value="newEmailAddress" placeholder="新邮箱地址" />
|
||||
<NInputGroup>
|
||||
<NInput v-model:value="newEmailVerifyCode" placeholder="验证码" />
|
||||
<NButton type="primary" @click="sendEmailVerifyCode">
|
||||
发送验证码 <template v-if="!canSendEmailVerifyCode"> | <NCountdown :duration="60000" /> </template>
|
||||
发送验证码 <template v-if="!canSendEmailVerifyCode"> |
|
||||
<NCountdown :duration="60000" />
|
||||
</template>
|
||||
</NButton>
|
||||
</NInputGroup>
|
||||
</NSpace>
|
||||
@@ -484,12 +480,7 @@ onUnmounted(() => {
|
||||
<NButton @click="resetName" type="warning" :loading="isLoading"> 确定修改 </NButton>
|
||||
</template>
|
||||
</NModal>
|
||||
<NModal
|
||||
v-model:show="bindBiliCodeModalVisiable"
|
||||
preset="card"
|
||||
title="绑定/更新身份码"
|
||||
style="width: 400px; max-width: 90%"
|
||||
>
|
||||
<NModal v-model:show="bindBiliCodeModalVisiable" preset="card" title="绑定/更新身份码" style="width: 400px; max-width: 90%">
|
||||
<NSpace vertical>
|
||||
<NInputGroup>
|
||||
<NInput v-model:value="biliCode" placeholder="身份码" />
|
||||
@@ -509,21 +500,13 @@ onUnmounted(() => {
|
||||
</NInputGroup>
|
||||
</NSpace>
|
||||
<template #footer>
|
||||
<NButton
|
||||
@click="accountInfo?.isBiliVerified ? ChangeBili() : BindBili()"
|
||||
type="success"
|
||||
:loading="!token || isLoading"
|
||||
>
|
||||
<NButton @click="accountInfo?.isBiliVerified ? ChangeBili() : BindBili()" type="success"
|
||||
:loading="!token || isLoading">
|
||||
确定
|
||||
</NButton>
|
||||
</template>
|
||||
</NModal>
|
||||
<NModal
|
||||
v-model:show="bindBiliAuthModalVisiable"
|
||||
preset="card"
|
||||
title="绑定用户账户"
|
||||
style="width: 700px; max-width: 90%"
|
||||
>
|
||||
<NModal v-model:show="bindBiliAuthModalVisiable" preset="card" title="绑定用户账户" style="width: 700px; max-width: 90%">
|
||||
<NSpace vertical>
|
||||
<NAlert title="获取认证链接" type="info">
|
||||
因为部分功能如积分兑换等也需要对没有注册本站账户的用户开放, 所以需要现在另一个页面获取认证链接,
|
||||
|
||||
26
src/views/manage/Setting_PaymentView.vue
Normal file
26
src/views/manage/Setting_PaymentView.vue
Normal file
@@ -0,0 +1,26 @@
|
||||
<script setup lang="ts">
|
||||
import { useAccount } from '@/api/account';
|
||||
import { onMounted } from 'vue';
|
||||
|
||||
const accountInfo = useAccount()
|
||||
|
||||
const { } = defineProps<{
|
||||
|
||||
}>()
|
||||
|
||||
async function getAccountPaymentSettings() {
|
||||
try {
|
||||
|
||||
} catch (error) {
|
||||
console.error(error)
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
getAccountPaymentSettings()
|
||||
});
|
||||
</script>
|
||||
|
||||
<template>
|
||||
WIP...
|
||||
</template>
|
||||
@@ -35,7 +35,7 @@ function onDropdownSelect(key: string) {
|
||||
},
|
||||
})
|
||||
break
|
||||
case 'delete':
|
||||
case 'restore':
|
||||
dialog.warning({
|
||||
title: '问问',
|
||||
content: '确定要恢复这条话题吗?',
|
||||
|
||||
@@ -33,6 +33,7 @@ export const Config: TemplateConfig<ConfigType> = {
|
||||
},
|
||||
{
|
||||
name: 'test',
|
||||
key: 'test',
|
||||
type: 'render',
|
||||
render: (config) => h('div', '1'),
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user