From 5559f2074aab64f9084f823a1ad53c7b22ffaf9d Mon Sep 17 00:00:00 2001
From: chenpei <chenpei@1080p.hk>
Date: Fri, 21 Aug 2026 13:41:49 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E8=A7=86=E9=A2=91=E7=AD=89?=
 =?UTF-8?q?=E5=BE=85=E6=8F=90=E7=A4=BA=E4=BD=8D=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/home/MaterialCard.test.tsx | 10 +++++++---
 components/home/MaterialCard.tsx      | 15 ++++++++-------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/components/home/MaterialCard.test.tsx b/components/home/MaterialCard.test.tsx
index 30ddc9f..166505d 100644
--- a/components/home/MaterialCard.test.tsx
+++ b/components/home/MaterialCard.test.tsx
@@ -119,8 +119,8 @@ describe('MaterialCard', () => {
     expect(screen.getByText('未设置')).toBeInTheDocument()
   })
 
-  test('15天策略隐藏源地址时仍显示视频转码进度', () => {
-    render(
+  test('15天策略隐藏源地址时仍显示视频转码进度，提示不遮挡预览', () => {
+    const { container } = render(
       <MaterialCard
         {...defaultProps}
         material={{
@@ -137,7 +137,11 @@ describe('MaterialCard', () => {
 
     expect(screen.getByRole('status')).toHaveTextContent('等待中')
     expect(screen.getByRole('progressbar')).toHaveAttribute('aria-valuenow', '5')
-    expect(screen.getByText('15天后可查看详情')).toBeInTheDocument()
+    const previewArea = container.querySelector('[data-material-link="true"]')
+    const notice = screen.getByText('15天后可查看详情')
+    expect(previewArea).not.toBeNull()
+    expect(previewArea).not.toContainElement(notice)
+    expect(notice).toHaveAttribute('data-video-preview-notice', 'true')
   })
 
   test('视频卡片初始只加载封面，悬停时才挂载视频预览', () => {
diff --git a/components/home/MaterialCard.tsx b/components/home/MaterialCard.tsx
index d6f085a..1d470a0 100644
--- a/components/home/MaterialCard.tsx
+++ b/components/home/MaterialCard.tsx
@@ -568,13 +568,6 @@ export default function MaterialCard({
             {Math.floor(material.videoDuration / 60)}:{(material.videoDuration % 60).toString().padStart(2, '0')}
           </div>
         )}
-        {isPreviewWaiting && (
-          <div className="absolute inset-0 z-30 flex items-center justify-center bg-[#fafafa]/55 px-4 text-center">
-            <div className="rounded-[8px] border border-[#e7e8ea] bg-white px-3 py-2 text-xs font-medium text-[#1a1c1d]">
-              {material.videoPreviewRemainingDays || videoDownloadAvailability.remainingDays || VIDEO_DOWNLOAD_WAIT_DAYS}天后可查看详情
-            </div>
-          </div>
-        )}
       </div>
 
       <div className="pt-4">
@@ -599,6 +592,14 @@ export default function MaterialCard({
         >
           ID {material.id}
         </p>
+        {isPreviewWaiting && (
+          <p
+            data-video-preview-notice="true"
+            className="mt-2 text-xs font-medium text-[#5f6469]"
+          >
+            {material.videoPreviewRemainingDays || videoDownloadAvailability.remainingDays || VIDEO_DOWNLOAD_WAIT_DAYS}天后可查看详情
+          </p>
+        )}
 
         <div className="mt-3 flex flex-wrap items-center gap-x-4 gap-y-1 text-[13px]">
           <button