From 2482b2d1a5caaa821dc5a0c60eca0f648131948e Mon Sep 17 00:00:00 2001
From: tony.cheng <chengmingwei_1984122@126.com>
Date: Wed, 04 Mar 2026 10:29:13 +0800
Subject: [PATCH] feat: 优化TabContainer组件,增强标签页功能和用户体验

---
 web-app/src/components/dashboard/TabContainer.jsx |   50 ++++++++++++++++++++++++++++++++++++++++++++++++--
 1 files changed, 48 insertions(+), 2 deletions(-)

diff --git a/web-app/src/components/dashboard/TabContainer.jsx b/web-app/src/components/dashboard/TabContainer.jsx
index c9e448b..9a009f6 100644
--- a/web-app/src/components/dashboard/TabContainer.jsx
+++ b/web-app/src/components/dashboard/TabContainer.jsx
@@ -1093,6 +1093,45 @@
                                   const imgUrl = img.show_url 
                                     ? (platformUrl ? `${platformUrl}/${img.show_url}` : img.show_url)
                                     : '';
+                                  // 获取文件名:true_name 为空时取 file_name
+                                  const fileName = img.true_name || img.file_name || `材料${index + 1}`;
+                                  // 获取文件类型后缀
+                                  const suffix = img.suffix || '';
+                                  const isPdf = suffix.toLowerCase() === 'pdf';
+                                  
+                                  if (isPdf) {
+                                    // PDF文件:直接打开PDF链接
+                                    return (
+                                      <div 
+                                        key={img.file_id || img.id || index}
+                                        style={{
+                                          width: 100,
+                                          height: 80,
+                                          borderRadius: 4,
+                                          overflow: 'hidden',
+                                          border: '1px solid #e8e8e8',
+                                          cursor: 'pointer',
+                                          transition: 'all 0.2s',
+                                          background: '#f5f5f5',
+                                          display: 'flex',
+                                          flexDirection: 'column',
+                                          alignItems: 'center',
+                                          justifyContent: 'center',
+                                        }}
+                                        onClick={() => {
+                                          // 直接打开PDF
+                                          window.open(imgUrl, '_blank');
+                                        }}
+                                      >
+                                        <i className="fas fa-file-pdf" style={{ fontSize: 32, color: '#ff4d4f' }} />
+                                        <span style={{ fontSize: 10, color: '#666', marginTop: 4, maxWidth: 90, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                                          {fileName}.{suffix}
+                                        </span>
+                                      </div>
+                                    );
+                                  }
+                                  
+                                  // 图片文件:使用图片预览
                                   return (
                                     <div 
                                       key={img.file_id || img.id || index}
@@ -1108,11 +1147,18 @@
                                     >
                                       <Image
                                         src={imgUrl}
-                                        alt={img.file_name || `材料${index + 1}`}
+                                        alt={fileName}
                                         style={{ width: '100%', height: '100%', objectFit: 'cover' }}
                                         fallback="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAwIiBoZWlnaHQ9IjgwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxyZWN0IHdpZHRoPSIxMDAiIGhlaWdodD0iODAiIGZpbGw9IiNmNWY1ZjUiLz48dGV4dCB4PSI1MCIgeT0iNDAiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxMCIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZmlsbD0iIzk5OSI+5Zu+54mH6aKE6KeIPC90ZXh0Pjwvc3ZnPg=="
                                         preview={{
-                                          mask: <span style={{ fontSize: 12 }}>预览</span>
+                                          mask: (
+                                            <span style={{ fontSize: 12, display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', height: '100%' }}>
+                                              <span>预览</span>
+                                              <span style={{ fontSize: 10, marginTop: 2, maxWidth: 80, overflow: 'hidden', textOverflow: 'ellipsis', whiteSpace: 'nowrap' }}>
+                                                {fileName}
+                                              </span>
+                                            </span>
+                                          )
                                         }}
                                       />
                                     </div>

--
Gitblit v1.8.0