refactor: 重构subscribe

Author: wenxig

src/layout/default/SubscribeList.vue

@@ -1,4 +1,15 @@
-<script setup lang="ts"></script>
+<script setup lang="ts">
+import type { uni } from '@delta-comic/model'
+import { shallowRef } from 'vue'
+
+import SubscribeRow from './SubscribeRow.vue'
+
+defineProps<{
+  union?: uni.item.Item
+  page: uni.content.ContentPage
+}>()
+const showDetailUsers = shallowRef(false)
+</script>
 
 <template>
   <div
@@ -9,7 +20,12 @@
     <span class="ml-3 font-bold">创作团队</span>
     <span class="absolute right-3 text-(--van-text-color-2)">共{{ union?.author.length }}位</span>
     <DcPopup v-model:show="showDetailUsers" position="bottom" round class="h-[50vh]">
-      <SubscribeRow :author v-for="author of union.author" class="van-hairline--bottom py-2" />
+      <SubscribeRow
+        :page
+        :author
+        v-for="author of union?.author"
+        class="van-hairline--bottom py-2"
+      />
     </DcPopup>
   </div>
   <div
@@ -18,7 +34,7 @@
     @click.stop
     @pointermove.stop
   >
-    <SubscribeRow :author="union.author[0]" v-if="union?.author.length === 1" class="mt-3" />
+    <SubscribeRow :page :author="union.author[0]" v-if="union?.author.length === 1" class="mt-3" />
     <div v-else class="scroll flex overflow-x-scroll overflow-y-hidden" @click.stop>
       <SubscribeSmallRow
         class="flex items-center gap-3 text-nowrap"

src/layout/default/SubscribeRow.vue

@@ -4,6 +4,7 @@ import type { uni } from '@delta-comic/model'
 import { Global } from '@delta-comic/plugin'
 import { createLoadingMessage } from '@delta-comic/ui'
 import { createReusableTemplate } from '@vueuse/core'
+import type { PopoverAction } from 'vant'
 
 const $props = defineProps<{
   page: uni.content.ContentPage
@@ -22,22 +23,28 @@ const getIsSubscribe = (author: uni.item.Author) =>
       .then(v => v.length != 0)
   )
 
+const { upsert } = SubscribeDB.useUpsert()
 const addSubscribe = (author: uni.item.Author) =>
   createLoadingMessage('关注中').bind(
-    SubscribeDB.upsert({
-      type: 'author',
-      author,
-      plugin: author.$$plugin,
-      key: SubscribeDB.key.toString([author.$$plugin, author.label]),
-      itemKey: null
+    upsert({
+      items: [
+        {
+          type: 'author',
+          author,
+          plugin: author.$$plugin,
+          key: SubscribeDB.key.toString([author.$$plugin, author.label]),
+          itemKey: null
+        }
+      ]
     })
   )
+
+const { remove } = SubscribeDB.useRemove()
 const removeSubscribe = (author: uni.item.Author) =>
   createLoadingMessage('取消中').bind(
-    db.value
-      .deleteFrom('subscribe')
-      .where('key', '=', SubscribeDB.key.toString([author.$$plugin, author.label]))
-      .execute()
+    remove({
+      keys: [SubscribeDB.key.toString([author.$$plugin, author.label])]
+    })
   )
 
 const getActionInfo = (key: string) => Global.userActions.get([$props.page.plugin, key])!