添加分享人唯一ID,支持删除订阅分享功能,并优化相关组件的事件处理

This commit is contained in:
jxxghp
2025-01-15 13:31:50 +08:00
parent d65ed9725c
commit 9a4392eceb
4 changed files with 78 additions and 13 deletions

View File

@@ -88,6 +88,8 @@ export interface SubscribeShare {
share_comment?: string
// 分享人
share_user?: string
// 分享人唯一ID
share_uid?: string
// 订阅名称
name?: string
// 订阅年份

View File

@@ -10,6 +10,9 @@ const props = defineProps({
media: Object as PropType<SubscribeShare>,
})
// 定义删除事件
const emit = defineEmits(['delete'])
// 从 provide 中获取全局设置
const globalSettings: any = inject('globalSettings')
@@ -70,8 +73,18 @@ function showForkSubscribe() {
// 完成复用订阅
function finishForkSubscribe(subid: number) {
subscribeId.value = subid
forkSubscribeDialog.value=false
subscribeEditDialog.value = true
}
// 删除订阅分享时处理
function doDelete() {
forkSubscribeDialog.value=false
// 通知父组件刷新
emit('delete')
}
</script>
<template>
@@ -153,7 +166,8 @@ function finishForkSubscribe(subid: number) {
v-model="forkSubscribeDialog"
:media="props.media"
@close="forkSubscribeDialog = false"
@done="finishForkSubscribe"
@fork="finishForkSubscribe"
@delete="doDelete"
/>
</div>
</template>

View File

@@ -12,7 +12,7 @@ const props = defineProps({
})
// 定义事件
const emit = defineEmits(['close', 'done'])
const emit = defineEmits(['fork', 'delete', 'close'])
// 从 provide 中获取全局设置
const globalSettings: any = inject('globalSettings')
@@ -23,6 +23,9 @@ const $toast = useToast()
// 处理中
const processing = ref(false)
// 删除中
const deleting = ref(false)
// 计算海报图片地址
const posterUrl = computed(() => {
const url = props.media?.poster
@@ -55,7 +58,7 @@ async function doFork() {
if (result.success) {
$toast.success(`${props.media?.share_title} 添加订阅成功!`)
// 完成
emit('done', result.data.id)
emit('fork', result.data.id)
} else {
$toast.error(`${props.media?.share_title} 添加订阅失败:${result.message}`)
}
@@ -66,6 +69,34 @@ async function doFork() {
doneNProgress()
}
}
// 删除订阅分享
async function doDelete() {
// 开始处理
startNProgress()
try {
deleting.value = true
// 请求API
const result: { [key: string]: any } = await api.delete(`subscribe/share/${props.media?.id}`, {
params: {
share_uid: globalSettings.USER_UNIQUE_ID,
},
})
// 订阅状态
if (result.success) {
$toast.success(`${props.media?.share_title} 取消分享成功!`)
// 完成
emit('delete', result.data.id)
} else {
$toast.error(`${props.media?.share_title} 取消分享失败:${result.message}`)
}
} catch (error) {
console.error(error)
} finally {
deleting.value = false
doneNProgress()
}
}
</script>
<template>
<VDialog max-width="40rem">
@@ -123,15 +154,28 @@ async function doFork() {
</VListItem>
</VList>
<div class="text-center text-md-left">
<VBtn
color="primary"
:disabled="processing"
@click="doFork"
prepend-icon="mdi-heart"
:loading="processing"
>
添加到我的订阅
</VBtn>
<div>
<VBtn
color="primary"
:disabled="processing"
@click="doFork"
prepend-icon="mdi-heart"
:loading="processing"
>
添加到我的订阅
</VBtn>
<VBtn
v-if="props.media?.share_uid && props.media?.share_uid === globalSettings.USER_UNIQUE_ID"
color="error"
:disabled="deleting"
@click="doDelete"
prepend-icon="mdi-delete"
:loading="deleting"
class="ms-2"
>
取消分享
</VBtn>
</div>
<div class="text-xs mt-2" v-if="props.media?.count">
<VIcon icon="mdi-fire" /> {{ props.media?.count?.toLocaleString() }} 次复用
</div>

View File

@@ -97,6 +97,11 @@ async function fetchData({ done }: { done: any }) {
done('error')
}
}
// 将数据从列表中移除
function removeData(id: number) {
dataList.value = dataList.value.filter(item => item.id !== id)
}
</script>
<template>
@@ -106,7 +111,7 @@ async function fetchData({ done }: { done: any }) {
<template #empty />
<div v-if="dataList.length > 0" class="grid gap-4 grid-subscribe-card mx-3" tabindex="0">
<div v-for="data in dataList" :key="data.id">
<SubscribeShareCard :media="data" />
<SubscribeShareCard :media="data" @delete="removeData(data.id || 0)" />
</div>
</div>
<NoDataFound