fix: 弹幕点赞

src/core/main/custom/danmaku.ts

@@ -26,6 +26,7 @@ interface DanmakuInfo {
     comment: string;
     tags: string;
     love: number;
+    my_love_type: boolean;
 }
 
 interface DanmakuPostInfo extends Partial<DanmakuContentInfo> {
@@ -379,7 +380,11 @@ export class Danmaku extends EventEmitter<DanmakuEvent> {
             id: this.id
         };
 
-        const res = await axios.post<PostLikeResponse>(Danmaku.backend, post);
+        const form = toFormData(post);
+        /* @__PURE__ */ form.append('userid', id);
+        /* @__PURE__ */ form.append('password', password);
+
+        const res = await axios.post<PostLikeResponse>(Danmaku.backend, form);
         if (res.data.code !== 0) {
             logger.severe(
                 2,
@@ -451,6 +456,8 @@ export class Danmaku extends EventEmitter<DanmakuEvent> {
      * 拉取本塔所有弹幕
      */
     static async fetch() {
+        Danmaku.all.clear();
+        Danmaku.allInPos = {};
         const form = toFormData({
             type: 1,
             towername: 'HumanBreak'
@@ -463,6 +470,7 @@ export class Danmaku extends EventEmitter<DanmakuEvent> {
             const dan = new Danmaku();
             dan.id = v.id;
             dan.likedNum = v.love;
+            dan.liked = v.my_love_type;
             dan.decode(v);
             dan.posted = true;
             dan.addToList();

src/ui/danmaku.vue

@@ -12,10 +12,12 @@
             <span class="danmaku-info">
                 <like-filled
                     class="danmaku-like-icon"
-                    :liked="one.liked"
-                    @click="one.triggerLike()"
+                    :liked="likedMap[one.id] < 0"
+                    @click="postLike(one)"
                 />
-                <span class="danmaku-like-num">{{ one.likedNum }}</span>
+                <span class="danmaku-like-num">{{
+                    Math.abs(likedMap[one.id])
+                }}</span>
             </span>
             <component :is="one.getVNode()"></component>
         </div>
@@ -26,7 +28,6 @@
 import { nextTick, onUnmounted, reactive, watch } from 'vue';
 import { Danmaku } from '../core/main/custom/danmaku';
 import { LikeFilled } from '@ant-design/icons-vue';
-import { Ticker } from 'mutate-animate';
 import { mainSetting } from '@/core/main/setting';
 import { debounce } from 'lodash-es';
 
@@ -38,6 +39,8 @@ interface ElementMap {
     style: CSSStyleDeclaration;
 }
 
+const likedMap: Record<number, number> = reactive({});
+
 const map = Danmaku.showMap;
 const eleMap: Map<number, ElementMap> = new Map();
 const liked = reactive<Record<number, boolean>>({});
@@ -79,15 +82,18 @@ function addElement(id: number) {
     div.style.setProperty('--end', `${-div.scrollWidth}px`);
     div.style.setProperty(
         '--duration',
-        `${Math.floor((window.innerWidth + div.scrollWidth) / speed)}s`
+        `${Math.floor((window.innerWidth + div.scrollWidth + 100) / speed)}s`
     );
     div.style.setProperty('left', ele.style.left);
     div.addEventListener('animationend', () => {
         danmaku.showEnd();
         eleMap.delete(id);
+        delete likedMap[id];
     });
 
     eleMap.set(id, ele);
+    likedMap[id] = danmaku.liked ? -danmaku.likedNum : danmaku.likedNum;
+
     calTop(id);
 }
 
@@ -137,6 +143,13 @@ function calTop(id: number) {
     }
 }
 
+async function postLike(danmaku: Danmaku) {
+    const res = await danmaku.triggerLike();
+
+    const liked = res.data.liked;
+    likedMap[danmaku.id] = liked ? -danmaku.likedNum : danmaku.likedNum;
+}
+
 onUnmounted(() => {});
 </script>
 
@@ -200,6 +213,7 @@ onUnmounted(() => {});
 
 .danmaku-like-icon {
     transition: color 0.1s linear;
+    color: white;
 }
 
 .danmaku-like-icon[liked='true'],