From 31af6ce1ad36815d11da42585e58c7f039d868fa Mon Sep 17 00:00:00 2001
From: Hakadao <a578457889743@gmail.com>
Date: Fri, 22 Mar 2024 00:58:10 +0800
Subject: [PATCH] chore: i just wanna push some code

---
 src/background/messageListeners/video.ts      |  7 +++++
 src/components/VideoCard/VideoCard.vue        | 13 ++++++++--
 .../views/Home/components/ForYou.vue          | 26 +++++++++++++++----
 src/styles/main.scss                          |  2 +-
 4 files changed, 40 insertions(+), 8 deletions(-)

diff --git a/src/background/messageListeners/video.ts b/src/background/messageListeners/video.ts
index 2d73043b..51d0d733 100644
--- a/src/background/messageListeners/video.ts
+++ b/src/background/messageListeners/video.ts
@@ -69,6 +69,13 @@ function handleMessage(message: any) {
       .then(data => data)
       .catch(error => console.error(error))
   }
+  else if (message.contentScriptQuery === 'dislikeVideo') {
+    const url = `https://api.bilibili.com/x/feed/dislike?access_key=${message.accessKey}&appkey=${message.appkey}&feedback_id=${message.feedbackId}&reason_id=${message.reasonId}`
+    return fetch(url)
+      .then(response => response.json())
+      .then(data => data)
+      .catch(error => console.error(error))
+  }
   // https://github.com/SocialSisterYi/bilibili-API-collect/blob/master/docs/video/info.md#%E8%8E%B7%E5%8F%96%E8%A7%86%E9%A2%91%E8%B6%85%E8%AF%A6%E7%BB%86%E4%BF%A1%E6%81%AFweb%E7%AB%AF
   else if (message.contentScriptQuery === 'getVideoInfo') {
     const url = `https://api.bilibili.com/x/web-interface/view/detail?${
diff --git a/src/components/VideoCard/VideoCard.vue b/src/components/VideoCard/VideoCard.vue
index f28334dd..276ada4e 100644
--- a/src/components/VideoCard/VideoCard.vue
+++ b/src/components/VideoCard/VideoCard.vue
@@ -36,6 +36,10 @@ interface Props {
   showPreview?: boolean
   moreBtn?: boolean
   moreBtnActive?: boolean
+  removed?: boolean
+  showDislikeOptions?: boolean
+  feedbackReason?: { id: number, name: string }
+  dislikeReason?: { id: number, name: string }
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -166,7 +170,11 @@ function handleMoreBtnClick(event: MouseEvent) {
       bg="hover:$bew-fill-2 active:$bew-fill-3" hover:ring="8 $bew-fill-2" active:ring="8 $bew-fill-3"
       :style="{ contentVisibility }"
     >
+      <template v-if="showDislikeOptions">
+        fdsflsd
+      </template>
       <a
+        v-else
         :style="{ display: horizontal ? 'flex' : 'block', gap: horizontal ? '1.5rem' : '0' }"
         :href="videoUrl" target="_blank" rel="noopener noreferrer"
       >
@@ -298,7 +306,7 @@ function handleMoreBtnClick(event: MouseEvent) {
             </a>
           </div>
           <div class="group/desc" flex="~ col" w="full" align="items-start">
-            <div flex="~ gap-2 justify-between items-start" w="full" pos="relative">
+            <div flex="~ gap-1 justify-between items-start" w="full" pos="relative">
               <h3
                 class="keep-two-lines"
                 text="lg overflow-ellipsis $bew-text-1" h-14 overflow-hidden
@@ -313,7 +321,8 @@ function handleMoreBtnClick(event: MouseEvent) {
                 v-if="moreBtn"
                 class="opacity-0 group-hover/desc:opacity-100"
                 :class="{ 'more-active': moreBtnActive }"
-                shrink-0 w-24px h-24px grid place-items-center
+                shrink-0 w-30px h-30px m="t--3px r--8px" translate-x--8px
+                grid place-items-center
                 pointer="auto" rounded="50%" duration-300
                 @click.prevent="handleMoreBtnClick"
               >
diff --git a/src/contentScripts/views/Home/components/ForYou.vue b/src/contentScripts/views/Home/components/ForYou.vue
index e7bcd64e..312747e7 100644
--- a/src/contentScripts/views/Home/components/ForYou.vue
+++ b/src/contentScripts/views/Home/components/ForYou.vue
@@ -36,8 +36,10 @@ const { handleReachBottom, handlePageRefresh, scrollbarRef } = useBewlyApp()
 const showVideoOptions = ref<boolean>(false)
 const videoOptions = ref<ThreePointV2[] | undefined>([])
 const videoOptionsPosition = reactive<{ top: string, left: string }>({ top: '0', left: '0' })
-const activatedVideoId = ref<number>(0)
+// const activatedVideoId = ref<number>(0)
+const activatedVideo = ref<AppVideoItem | null>()
 const videoCardRef = ref(null)
+const dislikedVideoIds = ref<number[]>([])
 
 watch(() => settings.value.recommendationMode, (newValue) => {
   videoList.length = 0
@@ -191,12 +193,13 @@ async function getAppRecommendVideos() {
 }
 
 function handleMoreClick(e: MouseEvent, data: AppVideoItem) {
-  if (activatedVideoId.value === data.idx) {
+  if (activatedVideo.value && activatedVideo.value.idx === data.idx) {
     closeVideoOptions()
     return
   }
   showVideoOptions.value = true
-  activatedVideoId.value = data.idx
+  // activatedVideo.value.idx = data.idx
+  activatedVideo.value = data
   const osInstance = scrollbarRef.value?.osInstance()
   const scrollTop = osInstance.elements().viewport.scrollTop || 0
   videoOptions.value = data.three_point_v2
@@ -204,9 +207,20 @@ function handleMoreClick(e: MouseEvent, data: AppVideoItem) {
   videoOptionsPosition.left = `${e.clientX}px`
 }
 
+function handleMoreCommand(command: string) {
+  if (activatedVideo.value)
+    dislikedVideoIds.value.push(activatedVideo.value.idx)
+
+  // eslint-disable-next-line no-empty
+  switch (command) {}
+
+  // if (command === 'close')
+  //   closeVideoOptions()
+}
+
 function closeVideoOptions() {
   showVideoOptions.value = false
-  activatedVideoId.value = 0
+  activatedVideo.value = null
 }
 
 // function handleVideoOptionsCommand(command: string) {
@@ -239,6 +253,7 @@ function jumpToLoginPage() {
           <li
             v-for="option in videoOptions" :key="option.type"
             bg="hover:$bew-fill-2" p="x-4 y-2" rounded="$bew-radius-half" cursor-pointer
+            @click="handleMoreCommand('')"
           >
             {{ option.title }}
           </li>
@@ -300,7 +315,8 @@ function jumpToLoginPage() {
           show-preview
           :horizontal="gridLayout !== 'adaptive'"
           more-btn
-          :more-btn-active="video.idx === activatedVideoId"
+          :more-btn-active="video.idx === activatedVideo?.idx"
+          :show-dislike-options="dislikedVideoIds.includes(video.idx)"
           @more-click="(e) => handleMoreClick(e, video)"
         />
       </template>
diff --git a/src/styles/main.scss b/src/styles/main.scss
index 6b9791d7..2e4b6d78 100644
--- a/src/styles/main.scss
+++ b/src/styles/main.scss
@@ -30,7 +30,7 @@ html.bewly-design > ::-webkit-scrollbar-track {
   background: transparent;
 }
 
-.bewly-design *::selection {
+::selection {
   background: var(--bew-fill-3);
   color: revert;
 }