From cefe8b003aa423dab75c93b8b467a0438b690cff Mon Sep 17 00:00:00 2001
From: chenpei <chenpei@1080p.hk>
Date: Fri, 21 Aug 2026 14:12:02 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=9D=E7=95=99=E8=A7=86=E9=A2=91=E7=AD=89?=
 =?UTF-8?q?=E5=BE=85=E6=8F=90=E7=A4=BA=E5=B9=B6=E7=A7=BB=E9=99=A4=E8=92=99?=
 =?UTF-8?q?=E7=89=88?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/home/MaterialCard.test.tsx |  5 +++--
 components/home/MaterialCard.tsx      | 19 ++++++++++---------
 2 files changed, 13 insertions(+), 11 deletions(-)

diff --git a/components/home/MaterialCard.test.tsx b/components/home/MaterialCard.test.tsx
index 166505d..aa14c69 100644
--- a/components/home/MaterialCard.test.tsx
+++ b/components/home/MaterialCard.test.tsx
@@ -119,7 +119,7 @@ describe('MaterialCard', () => {
     expect(screen.getByText('未设置')).toBeInTheDocument()
   })
 
-  test('15天策略隐藏源地址时仍显示视频转码进度，提示不遮挡预览', () => {
+  test('15天策略隐藏源地址时仍显示视频转码进度，提示保留且没有整图蒙版', () => {
     const { container } = render(
       <MaterialCard
         {...defaultProps}
@@ -140,8 +140,9 @@ describe('MaterialCard', () => {
     const previewArea = container.querySelector('[data-material-link="true"]')
     const notice = screen.getByText('15天后可查看详情')
     expect(previewArea).not.toBeNull()
-    expect(previewArea).not.toContainElement(notice)
+    expect(previewArea).toContainElement(notice)
     expect(notice).toHaveAttribute('data-video-preview-notice', 'true')
+    expect(notice.parentElement).not.toHaveClass('bg-[#fafafa]/55')
   })
 
   test('视频卡片初始只加载封面，悬停时才挂载视频预览', () => {
diff --git a/components/home/MaterialCard.tsx b/components/home/MaterialCard.tsx
index 1d470a0..4a2e598 100644
--- a/components/home/MaterialCard.tsx
+++ b/components/home/MaterialCard.tsx
@@ -568,6 +568,16 @@ export default function MaterialCard({
             {Math.floor(material.videoDuration / 60)}:{(material.videoDuration % 60).toString().padStart(2, '0')}
           </div>
         )}
+        {isPreviewWaiting && (
+          <div className="pointer-events-none absolute inset-0 z-30 flex items-center justify-center px-4 text-center">
+            <div
+              data-video-preview-notice="true"
+              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">
@@ -592,15 +602,6 @@ 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
             type="button"