From 6b4383643fb9a91aed9ea95512ee8539144b1ef1 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Wed, 22 Jan 2025 13:19:09 +0800
Subject: [PATCH] =?UTF-8?q?=E4=B8=BA=20ForkSubscribeDialog=20=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E6=B7=BB=E5=8A=A0=E7=94=A8=E6=88=B7=E5=85=B3=E6=B3=A8?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=EF=BC=8C=E5=B9=B6=E5=9C=A8=20DashboardRender?=
 =?UTF-8?q?=20=E7=BB=84=E4=BB=B6=E4=B8=AD=E5=AE=9E=E7=8E=B0=E7=BB=84?=
 =?UTF-8?q?=E4=BB=B6=E9=87=8D=E6=B8=B2=E6=9F=93?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/dialog/ForkSubscribeDialog.vue | 83 ++++++++++++++++++-
 src/components/render/DashboardRender.vue     |  7 ++
 2 files changed, 87 insertions(+), 3 deletions(-)

diff --git a/src/components/dialog/ForkSubscribeDialog.vue b/src/components/dialog/ForkSubscribeDialog.vue
index 5f695397..cbdb9ae7 100644
--- a/src/components/dialog/ForkSubscribeDialog.vue
+++ b/src/components/dialog/ForkSubscribeDialog.vue
@@ -26,6 +26,58 @@ const processing = ref(false)
 // 删除中
 const deleting = ref(false)
 
+// 是否折叠
+const isExpanded = ref(false)
+
+// follow用户列表
+const followUsers = ref<string[]>([])
+
+// 当前用户是否已follow
+const isFollowed = computed(() => followUsers.value.includes(props.media?.share_uid || ''))
+
+// 折叠展开
+function toggleExpand() {
+  isExpanded.value = !isExpanded.value
+}
+
+// 加载follow用户列表
+async function queryFollowUsers() {
+  try {
+    const result: { [key: string]: any } = await api.get('system/setting/FollowSubscribers')
+    followUsers.value = result.data?.value ?? []
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// follow用户
+async function followUser() {
+  try {
+    const result: { [key: string]: any } = await api.post(`subscribe/follow?share_uid=${props.media?.share_uid}`)
+    if (result.success) {
+      queryFollowUsers()
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
+// unfollow用户
+async function unfollowUser() {
+  try {
+    const result: { [key: string]: any } = await api.delete('subscribe/follow', {
+      params: {
+        share_uid: props.media?.share_uid,
+      },
+    })
+    if (result.success) {
+      queryFollowUsers()
+    }
+  } catch (error) {
+    console.log(error)
+  }
+}
+
 // 计算海报图片地址
 const posterUrl = computed(() => {
   const url = props.media?.poster
@@ -97,6 +149,10 @@ async function doDelete() {
     doneNProgress()
   }
 }
+
+onMounted(() => {
+  queryFollowUsers()
+})
 </script>
 <template>
   <VDialog max-width="40rem" scrollable>
@@ -144,9 +200,12 @@ async function doDelete() {
                       <span class="text-body-1"> {{ media?.keyword }}</span>
                     </VListItemTitle>
                   </VListItem>
-                  <VListItem class="ps-0" v-if="media?.custom_words">
+                  <VListItem class="ps-0" v-if="media?.custom_words" @click.stop="toggleExpand">
                     <VListItemTitle
-                      class="text-center text-md-left break-words whitespace-break-spaces line-clamp-10 overflow-hidden text-ellipsis ..."
+                      class="text-center text-md-left break-words whitespace-break-spaces"
+                      :class="{
+                        'line-clamp-4 overflow-hidden text-ellipsis': !isExpanded,
+                      }"
                     >
                       <span class="font-weight-medium">识别词：</span>
                       <span class="text-body-1"> {{ media?.custom_words }}</span>
@@ -162,7 +221,7 @@ async function doDelete() {
                       prepend-icon="mdi-heart"
                       :loading="processing"
                     >
-                      添加到我的订阅
+                      订阅
                     </VBtn>
                     <VBtn
                       v-if="props.media?.share_uid && props.media?.share_uid === globalSettings.USER_UNIQUE_ID"
@@ -175,6 +234,24 @@ async function doDelete() {
                     >
                       取消分享
                     </VBtn>
+                    <VBtn
+                      v-else-if="isFollowed && props.media?.share_uid"
+                      color="warning"
+                      @click="unfollowUser"
+                      prepend-icon="mdi-account-remove"
+                      class="ms-2"
+                    >
+                      UnFollow
+                    </VBtn>
+                    <VBtn
+                      v-else-if="props.media?.share_uid"
+                      @click="followUser"
+                      color="info"
+                      prepend-icon="mdi-account-plus"
+                      class="ms-2"
+                    >
+                      follow
+                    </VBtn>
                   </div>
                   <div class="text-xs mt-2" v-if="props.media?.count">
                     <VIcon icon="mdi-fire" />共 {{ props.media?.count?.toLocaleString() }} 次复用
diff --git a/src/components/render/DashboardRender.vue b/src/components/render/DashboardRender.vue
index e3733a15..77bc9c2a 100644
--- a/src/components/render/DashboardRender.vue
+++ b/src/components/render/DashboardRender.vue
@@ -6,6 +6,12 @@ import { type PropType } from 'vue'
 const elementProps = defineProps({
   config: Object as PropType<RenderProps>,
 })
+// key
+const componentKey = ref(0)
+
+onActivated(() => {
+  componentKey.value++
+})
 </script>
 
 <template>
@@ -23,6 +29,7 @@ const elementProps = defineProps({
     />
   </Component>
   <Component
+    :key="componentKey"
     :is="elementProps.config?.component"
     v-if="elementProps.config?.html"
     v-bind="elementProps.config?.props"