add questionbox setting

This commit is contained in:
2024-02-14 18:34:07 +08:00
parent 87ec4e824e
commit d5ff8e7320

View File

@@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import { copyToClipboard, downloadImage } from '@/Utils' import { copyToClipboard, downloadImage } from '@/Utils'
import { useAccount } from '@/api/account' import { SaveAccountSettings, useAccount } from '@/api/account'
import { QAInfo } from '@/api/api-models' import { QAInfo } from '@/api/api-models'
import { QueryGetAPI, QueryPostAPI } from '@/api/query' import { QueryGetAPI, QueryPostAPI } from '@/api/query'
import { ACCOUNT_API_URL, QUESTION_API_URL } from '@/data/constants' import { ACCOUNT_API_URL, QUESTION_API_URL } from '@/data/constants'
@@ -42,7 +42,9 @@ const route = useRoute()
const recieveQuestions = ref<QAInfo[]>([]) const recieveQuestions = ref<QAInfo[]>([])
const recieveQuestionsFiltered = computed(() => { const recieveQuestionsFiltered = computed(() => {
return recieveQuestions.value.filter((q) => { return recieveQuestions.value.filter((q) => {
return (q.isFavorite || !onlyFavorite.value) && (q.isPublic || !onlyPublic.value) return (
(q.isFavorite || !onlyFavorite.value) && (q.isPublic || !onlyPublic.value) && (!q.isReaded || !onlyUnread.value)
)
}) })
}) })
const sendQuestions = ref<QAInfo[]>([]) const sendQuestions = ref<QAInfo[]>([])
@@ -52,6 +54,7 @@ const selectedTabItem = ref(route.query.send ? '1' : '0')
const isRepling = ref(false) const isRepling = ref(false)
const onlyFavorite = ref(false) const onlyFavorite = ref(false)
const onlyPublic = ref(false) const onlyPublic = ref(false)
const onlyUnread = ref(false)
const isLoading = ref(true) const isLoading = ref(true)
const isChangingPublic = ref(false) const isChangingPublic = ref(false)
@@ -251,7 +254,21 @@ function saveShareImage() {
}) })
} }
function saveQRCode() { function saveQRCode() {
downloadImage(`https://api.qrserver.com/v1/create-qr-code/?data=${shareUrl.value}`, 'vtsuru-提问箱二维码.png'); downloadImage(`https://api.qrserver.com/v1/create-qr-code/?data=${shareUrl.value}`, 'vtsuru-提问箱二维码.png')
}
async function saveSettings() {
try {
isLoading.value = true
const data = await SaveAccountSettings()
if (data.code == 200) {
message.success('保存成功')
} else {
message.error('保存失败: ' + data.message)
}
} catch (error) {
message.error('保存失败:' + error)
}
isLoading.value = false
} }
onMounted(() => { onMounted(() => {
@@ -272,7 +289,9 @@ onMounted(() => {
<NSpin v-if="isLoading" show /> <NSpin v-if="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">
只显示收藏 <NSwitch v-model:value="onlyFavorite" /> 只显示公开 <NSwitch v-model:value="onlyPublic" /> <NCheckbox v-model:checked="onlyFavorite"> 只显示收藏 </NCheckbox>
<NCheckbox v-model:checked="onlyPublic"> 只显示公开 </NCheckbox>
<NCheckbox v-model:checked="onlyUnread"> 只显示未读 </NCheckbox>
<NList :bordered="false"> <NList :bordered="false">
<NListItem v-for="item in recieveQuestionsFiltered" :key="item.id"> <NListItem v-for="item in recieveQuestionsFiltered" :key="item.id">
<NCard :embedded="!item.isReaded" hoverable size="small"> <NCard :embedded="!item.isReaded" hoverable size="small">
@@ -285,8 +304,12 @@ onMounted(() => {
<NText :depth="item.isAnonymous ? 3 : 1" style="margin-top: 3px"> <NText :depth="item.isAnonymous ? 3 : 1" style="margin-top: 3px">
{{ item.isAnonymous ? '匿名用户' : item.sender?.name }} {{ item.isAnonymous ? '匿名用户' : item.sender?.name }}
</NText> </NText>
<NTag v-if="item.isSenderRegisted" size="small" type="info" :bordered="false" style="margin-left: 5px"> 已注册 </NTag> <NTag v-if="item.isSenderRegisted" size="small" type="info" :bordered="false" style="margin-left: 5px">
<NTag v-if="item.isPublic" size="small" type="success" :bordered="false" style="margin-left: 5px"> 公开 </NTag> 已注册
</NTag>
<NTag v-if="item.isPublic" size="small" type="success" :bordered="false" style="margin-left: 5px">
公开
</NTag>
<NDivider vertical /> <NDivider vertical />
<NText depth="3" style="font-size: small"> <NText depth="3" style="font-size: small">
<NTooltip> <NTooltip>
@@ -300,10 +323,15 @@ onMounted(() => {
</template> </template>
<template #footer> <template #footer>
<NSpace> <NSpace>
<NButton v-if="!item.isReaded" size="small" @click="read(item, true)" type="success"> 设为已读 </NButton> <NButton v-if="!item.isReaded" size="small" @click="read(item, true)" type="success">
设为已读
</NButton>
<NButton size="small" @click="favorite(item, !item.isFavorite)"> <NButton size="small" @click="favorite(item, !item.isFavorite)">
<template #icon> <template #icon>
<NIcon :component="item.isFavorite ? Heart : HeartOutline" :color="item.isFavorite ? '#dd484f' : ''" /> <NIcon
:component="item.isFavorite ? Heart : HeartOutline"
:color="item.isFavorite ? '#dd484f' : ''"
/>
</template> </template>
收藏 收藏
</NButton> </NButton>
@@ -317,7 +345,13 @@ onMounted(() => {
</NSpace> </NSpace>
</template> </template>
<template #header-extra> <template #header-extra>
<NButton @click="onOpenModal(item)" :type="item.isReaded ? 'default' : 'primary'" :secondary="item.isReaded"> {{ item.answer ? '查看回复' : '回复' }} </NButton> <NButton
@click="onOpenModal(item)"
:type="item.isReaded ? 'default' : 'primary'"
:secondary="item.isReaded"
>
{{ item.answer ? '查看回复' : '回复' }}
</NButton>
</template> </template>
<template v-if="item.question?.image"> <template v-if="item.question?.image">
<NImage v-if="item.question?.image" :src="item.question.image" height="100" lazy /> <NImage v-if="item.question?.image" :src="item.question.image" height="100" lazy />
@@ -374,17 +408,38 @@ onMounted(() => {
</NListItem> </NListItem>
</NList> </NList>
</NTabPane> </NTabPane>
<NTabPane v-if="accountInfo" tab="设置" name="2">
<NSpin :show="isLoading">
<NCheckbox
v-model:checked="accountInfo.settings.questionBox.allowUnregistedUser"
@update:checked="saveSettings"
>
允许未注册用户进行提问
</NCheckbox>
</NSpin>
</NTabPane>
</NTabs> </NTabs>
<NModal preset="card" v-model:show="replyModalVisiable" style="max-width: 90vw; width: 500px"> <NModal preset="card" v-model:show="replyModalVisiable" style="max-width: 90vw; width: 500px">
<template #header> 回复 </template> <template #header> 回复 </template>
<NSpace vertical> <NSpace vertical>
<NInput placeholder="请输入回复" type="textarea" v-model:value="replyMessage" maxlength="1000" show-count clearable /> <NInput
placeholder="请输入回复"
type="textarea"
v-model:value="replyMessage"
maxlength="1000"
show-count
clearable
/>
<NSpin :show="isChangingPublic"> <NSpin :show="isChangingPublic">
<NCheckbox @update:checked="(v) => setPublic(v)" :default-checked="currentQuestion?.isPublic"> 公开可见 </NCheckbox> <NCheckbox @update:checked="(v) => setPublic(v)" :default-checked="currentQuestion?.isPublic">
公开可见
</NCheckbox>
</NSpin> </NSpin>
</NSpace> </NSpace>
<NDivider style="margin: 10px 0 10px 0" /> <NDivider style="margin: 10px 0 10px 0" />
<NButton :loading="isRepling" @click="reply" type="primary" :secondary="currentQuestion?.answer ? true : false"> {{ currentQuestion?.answer ? '修改' : '发送' }} </NButton> <NButton :loading="isRepling" @click="reply" type="primary" :secondary="currentQuestion?.answer ? true : false">
{{ currentQuestion?.answer ? '修改' : '发送' }}
</NButton>
</NModal> </NModal>
<NModal v-model:show="shareModalVisiable" preset="card" title="分享" style="width: 600px"> <NModal v-model:show="shareModalVisiable" preset="card" title="分享" style="width: 600px">
<div ref="shareCardRef" class="share-card container"> <div ref="shareCardRef" class="share-card container">
@@ -395,7 +450,15 @@ onMounted(() => {
</NText> </NText>
<NDivider class="share-card divider-1" /> <NDivider class="share-card divider-1" />
<NText class="share-card site"> VTSURU.LIVE </NText> <NText class="share-card site"> VTSURU.LIVE </NText>
<QrcodeVue class="share-card qrcode" :value="shareUrl" level="Q" :size="100" background="#00000000" foreground="#ffffff" :margin="1" /> <QrcodeVue
class="share-card qrcode"
:value="shareUrl"
level="Q"
:size="100"
background="#00000000"
foreground="#ffffff"
:margin="1"
/>
</div> </div>
<NDivider style="margin: 10px" /> <NDivider style="margin: 10px" />
<NInputGroup> <NInputGroup>