From 1fb8a53bcdadd293faed4737606e520a376f9cf0 Mon Sep 17 00:00:00 2001
From: Tim <135014430+nagisa77@users.noreply.github.com>
Date: Fri, 4 Jul 2025 16:18:50 +0800
Subject: [PATCH] feat: add link copy and comment anchor

---
 open-isle-cli/src/components/CommentItem.vue | 18 ++++++++++++++++--
 open-isle-cli/src/views/PostPageView.vue     | 16 +++++++++++++++-
 2 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/open-isle-cli/src/components/CommentItem.vue b/open-isle-cli/src/components/CommentItem.vue
index d785ec2fb..4a7d720b1 100644
--- a/open-isle-cli/src/components/CommentItem.vue
+++ b/open-isle-cli/src/components/CommentItem.vue
@@ -1,6 +1,7 @@
 <template>
   <div
     class="info-content-container"
+    :id="'comment-' + comment.id"
     :style="{
       ...(level > 0 ? { /*borderLeft: '1px solid #e0e0e0', */borderBottom: 'none' } : {})
     }"
@@ -33,7 +34,7 @@
             <div class="make-reaction-item like-reaction">
               <i class="far fa-heart"></i>
             </div>
-            <div class="make-reaction-item copy-link">
+            <div class="make-reaction-item copy-link" @click="copyCommentLink">
               <i class="fas fa-link"></i>
             </div>
           </div>
@@ -93,7 +94,11 @@ const CommentItem = {
       })
       showEditor.value = false
     }
-    return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, renderMarkdown }
+    const copyCommentLink = () => {
+      const link = `${location.origin}${location.pathname}#comment-${props.comment.id}`
+      navigator.clipboard.writeText(link)
+    }
+    return { showReplies, toggleReplies, showEditor, toggleEditor, submitReply, copyCommentLink, renderMarkdown }
   }
 }
 CommentItem.components = { CommentItem, CommentEditor }
@@ -118,4 +123,13 @@ export default CommentItem
   background-color: lightgray;
 }
 
+.comment-highlight {
+  animation: highlight 2s;
+}
+
+@keyframes highlight {
+  from { background-color: yellow; }
+  to { background-color: transparent; }
+}
+
 </style>
diff --git a/open-isle-cli/src/views/PostPageView.vue b/open-isle-cli/src/views/PostPageView.vue
index cdb23c69b..9eb627cb5 100644
--- a/open-isle-cli/src/views/PostPageView.vue
+++ b/open-isle-cli/src/views/PostPageView.vue
@@ -53,7 +53,7 @@
                 <div class="make-reaction-item like-reaction">
                   <i class="far fa-heart"></i>
                 </div>
-                <div class="make-reaction-item copy-link">
+                <div class="make-reaction-item copy-link" @click="copyPostLink">
                   <i class="fas fa-link"></i>
                 </div>
               </div>
@@ -236,8 +236,21 @@ L 站的愿景是成为新的**理想型社区**，让每一个一身疲惫的
         reply: []
       })
     }
+    const copyPostLink = () => {
+      navigator.clipboard.writeText(location.href.split('#')[0])
+    }
     onMounted(() => {
       updateCurrentIndex()
+      const hash = location.hash
+      if (hash.startsWith('#comment-')) {
+        const id = hash.substring('#comment-'.length)
+        const el = document.getElementById('comment-' + id)
+        if (el && mainContainer.value) {
+          mainContainer.value.scrollTo({ top: el.offsetTop, behavior: 'instant' })
+          el.classList.add('comment-highlight')
+          setTimeout(() => el.classList.remove('comment-highlight'), 2000)
+        }
+      }
     })
 
     return {
@@ -253,6 +266,7 @@ L 站的愿景是成为新的**理想型社区**，让每一个一身疲惫的
       postComment,
       onSliderInput,
       onScroll: updateCurrentIndex,
+      copyPostLink,
       renderMarkdown
     }
   }