From 2cba28d21dc6958b147a3b61c58c919aa5b65904 Mon Sep 17 00:00:00 2001
From: Ryan Wang <i@ryanc.cc>
Date: Tue, 10 Jun 2025 23:16:36 +0800
Subject: [PATCH] feat: add cover for post list in uc (#7534)

#### What type of PR is this?

/area ui
/kind improvement
/milestone 2.21.x

#### What this PR does / why we need it:

Add cover image display for the post list in the uc.

#### Does this PR introduce a user-facing change?

```release-note
None
```
---
 .../contents/posts/components/PostListItem.vue        | 11 +++++++++++
 1 file changed, 11 insertions(+)

diff --git a/ui/uc-src/modules/contents/posts/components/PostListItem.vue b/ui/uc-src/modules/contents/posts/components/PostListItem.vue
index 95b5ad781..effbc4d87 100644
--- a/ui/uc-src/modules/contents/posts/components/PostListItem.vue
+++ b/ui/uc-src/modules/contents/posts/components/PostListItem.vue
@@ -4,6 +4,7 @@ import HasPermission from "@/components/permission/HasPermission.vue";
 import PostContributorList from "@/components/user/PostContributorList.vue";
 import { postLabels } from "@/constants/labels";
 import { formatDatetime, relativeTimeTo } from "@/utils/date";
+import { generateThumbnailUrl } from "@/utils/thumbnail";
 import PostTag from "@console/modules/contents/posts/tags/components/PostTag.vue";
 import type { ListedPost } from "@halo-dev/api-client";
 import { ucApiClient } from "@halo-dev/api-client";
@@ -121,6 +122,16 @@ function handleDelete() {
 <template>
   <VEntity>
     <template #start>
+      <VEntityField v-if="post.post.spec.cover">
+        <template #description>
+          <div class="aspect-h-2 rounded-md overflow-hidden aspect-w-3 w-20">
+            <img
+              class="object-cover w-full h-full"
+              :src="generateThumbnailUrl(post.post.spec.cover, 's')"
+            />
+          </div>
+        </template>
+      </VEntityField>
       <VEntityField
         :title="post.post.spec.title"
         :route="{