feat(blog,comment): add post comment panel and optimize tips

1. 新增文章评论弹窗组件uh-post-comment-panel
2. 给文章详情页评论按钮绑定打开评论面板事件
3. 优化图片画廊和评论加载失败的提示文案与样式
4. 修复评论列表接口返回类型适配问题

src/components/post-detail/uh-post-comment-panel.vue

@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import { listComments } from '@/api/halo-base/comment'
+import { completeUrl } from '@/utils/url'
+import { useHaloScroll } from '@/hooks/useHaloScroll'
+import type { CommentV1alpha1PublicApiListComments1Request, CommentWithReplyVo, PostVo } from '@halo-dev/api-client'
+
+interface IProps {
+  post: PostVo | undefined
+}
+
+const props = defineProps<IProps>()
+
+const emits = defineEmits<{
+  (e: 'close'): void
+}>()
+
+const {
+  response, // 响应式的原始数据响应
+  list, // 响应式的数据列表
+  loading, // 是否加载中
+  finished, // 是否已全部加载
+  error, // 是否加载失败
+  refresh, // 刷新数据的函数
+  loadMore, // 加载更多数据的函数
+} = useHaloScroll<CommentWithReplyVo, CommentV1alpha1PublicApiListComments1Request>({
+  fetchData: listComments,
+  params: {
+    version: 'v1alpha1',
+    kind: 'Comment',
+    page: 1,
+    size: 12,
+    name: props.post?.metadata?.name ?? undefined,
+  },
+})
+</script>
+
+<template>
+  <!-- 评论面板：根据分组显示 -->
+  <view
+    class="uh-backdrop-blur-xs fixed inset-0 z-110 flex items-end justify-center bg-black/20"
+    @click.stop="emits('close')"
+  >
+    <wd-transition :show="true" :lazy-render="true" :duration="150" name="fade-up">
+      <view class="box-border w-screen rounded-2xl bg-white p-4" @click.stop>
+        <view class="box-border w-full flex shrink-0 items-center justify-between gap-x-4">
+          <view class="text-gray-900 font-bold">
+            记录点什么
+          </view>
+          <view class="shrink-0">
+            <wd-icon name="close-circle" size="24px" color="#1A1A1A" @click="emits('close')" />
+          </view>
+        </view>
+
+        <view class="mt-2 w-full">
+          <scroll-view
+            v-if="list.length > 0" class="h-[60vh] w-full" scroll-y :refresher-enabled="true"
+            :refresher-triggered="loading" @scrolltolower="loadMore" @refresherrefresh="refresh"
+          >
+            <view class="box-border w-full">
+              这里是评论记录
+            </view>
+          </scroll-view>
+          <view v-else class="h-[60vh] flex items-center justify-center">
+            <wd-empty tip="暂无数据">
+              <template #image>
+                <wd-icon name="empty" color="#1A1A1A" :size="52" />
+              </template>
+            </wd-empty>
+          </view>
+          <view class="mt-4 w-full flex flex-col items-center justify-center gap-y-2 text-xs text-gray-900">
+            <view class="text-xs text-gray-900">
+              共 {{ response?.total || 0 }} 条记录 已加载 {{ list.length }} 条记录
+            </view>
+            <view v-if="loading || error || finished">
+              <wd-loading v-if="loading" text="加载中..." direction="horizontal" color="#1A1A1A" :size="16" />
+              <view v-else-if="error" class="w-full rounded-lg bg-gray-900 px-2 py-1.5 text-center text-xs text-white">
+                <wd-icon name="refresh" :size="14" /> 加载失败，点击重试
+              </view>
+              <view v-else-if="finished" class="text-xs text-gray-900">
+                数据已全部加载
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </wd-transition>
+  </view>
+</template>