mirror of
https://github.com/Megghy/vtsuru.live.git
synced 2025-12-07 02:46:55 +08:00
97 lines
3.4 KiB
Vue
97 lines
3.4 KiB
Vue
<script setup lang="ts">
|
|
import { VideoCollectDetail, VideoCollectTable } from '@/api/api-models'
|
|
import { QueryGetAPI, QueryPostAPI } from '@/api/query'
|
|
import VideoCollectInfoCard from '@/components/VideoCollectInfoCard.vue'
|
|
import { TURNSTILE_KEY, VIDEO_COLLECT_API_URL } from '@/data/constants'
|
|
import { NAlert, NButton, NCard, NDivider, NInput, NInputNumber, NLayoutContent, NResult, NSpace, NText, useMessage } from 'naive-ui'
|
|
import { ref } from 'vue'
|
|
import { useRoute } from 'vue-router'
|
|
import VueTurnstile from 'vue-turnstile'
|
|
|
|
interface AddVideoModel {
|
|
id: string
|
|
video: string
|
|
name: string
|
|
uid: number
|
|
description: string
|
|
}
|
|
|
|
const message = useMessage()
|
|
const route = useRoute()
|
|
|
|
const token = ref('')
|
|
const turnstile = ref()
|
|
|
|
const table = ref<VideoCollectTable | null>(await get())
|
|
const addModel = ref({} as AddVideoModel)
|
|
const isLoading = ref(false)
|
|
|
|
async function get() {
|
|
try {
|
|
const data = await QueryGetAPI<VideoCollectDetail>(VIDEO_COLLECT_API_URL + 'get', { id: route.params.id })
|
|
if (data.code == 200) {
|
|
return data.data.table
|
|
}
|
|
} catch (err) {
|
|
console.error(err)
|
|
message.error('获取失败')
|
|
}
|
|
return null
|
|
}
|
|
async function add() {
|
|
if (!addModel.value.video) {
|
|
message.error('请输入视频')
|
|
return
|
|
}
|
|
isLoading.value = true
|
|
addModel.value.id = table.value?.id ?? route.params.id.toString()
|
|
await QueryPostAPI(VIDEO_COLLECT_API_URL + 'add', addModel.value, [['Turnstile', token.value]])
|
|
.then((data) => {
|
|
if (data.code == 200) {
|
|
message.success('已成功推荐视频')
|
|
setTimeout(() => {
|
|
location.reload()
|
|
}, 1000)
|
|
} else {
|
|
message.error('添加失败: ' + data.message)
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.error(err)
|
|
message.error('添加失败')
|
|
})
|
|
.finally(() => {
|
|
isLoading.value = false
|
|
turnstile.value?.reset()
|
|
})
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<NLayoutContent style="position: relative; height: 100vh">
|
|
<div style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%)">
|
|
<NResult v-if="!table" status="404" title="指定收集表不存在" description="检查一下你输入的链接吧" />
|
|
<NCard v-else style="width: 500px; max-width: 90vw">
|
|
<template #header>
|
|
视频征集
|
|
<NDivider vertical />
|
|
<NButton text @click="$router.push({ name: 'user-index', params: { id: table.owner?.name } })">
|
|
<NText depth="3" style="font-size: 14px">{{ table.owner?.name }}</NText>
|
|
</NButton>
|
|
</template>
|
|
<VideoCollectInfoCard :item="table" />
|
|
<NDivider />
|
|
<NAlert v-if="table.isFinish" type="error" title="该征集表已截止" />
|
|
<NSpace v-else vertical>
|
|
<NInput v-model:value="addModel.video" placeholder="B站视频链接或BVID" />
|
|
<NInput v-model:value="addModel.name" placeholder="(选填) 推荐人" />
|
|
<NInputNumber v-model:value="addModel.uid" placeholder="(选填) 推荐人UId" :show-button="false" />
|
|
<NInput v-model:value="addModel.description" placeholder="(选填) 推荐理由" />
|
|
<NButton @click="add" type="primary" :loading="isLoading || !token"> 推荐视频 </NButton>
|
|
</NSpace>
|
|
</NCard>
|
|
<VueTurnstile ref="turnstile" :site-key="TURNSTILE_KEY" v-model="token" theme="auto" style="text-align: center" />
|
|
</div>
|
|
</NLayoutContent>
|
|
</template>
|