diff --git a/src/pages/AftersalesDetail.tsx b/src/pages/AftersalesDetail.tsx index f420195..6ee8a4a 100644 --- a/src/pages/AftersalesDetail.tsx +++ b/src/pages/AftersalesDetail.tsx @@ -251,10 +251,6 @@ function AftersalesDetailPage() { .electronic-form-signature-title { flex: 0 0 auto; margin: 0 10px 0 0; font-weight: 600; white-space: nowrap; } .electronic-form-signature-stage { flex: 1; height: 72px; min-width: 160px; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid #1f2937; } .electronic-form-signature-img { max-width: 180px; max-height: 68px; object-fit: contain; } - .electronic-form-site-images { margin-top: 18px; } - .electronic-form-site-images-title { margin: 0 0 10px; font-weight: 600; } - .electronic-form-site-images-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; } - .electronic-form-site-images-grid img { width: 100%; height: 150px; object-fit: cover; border: 1px solid #1f2937; } ${formNode.outerHTML} @@ -405,30 +401,41 @@ function AftersalesDetailPage() { - {order.authorizationStatus === 'authorized' && order.signature && ( -
-
+ {order.authorizationStatus === 'authorized' && (order.signature || order.responsibleSignature) && ( +
+
客户确认签名 {order.confirmedAt && ( - - 签署时间：{new Date(order.confirmedAt).toLocaleString('zh-CN')} - + 签署时间：{new Date(order.confirmedAt).toLocaleString('zh-CN')} )}
- 客户确认签名 +
+ {order.responsibleSignature && ( +
+
处理人签名
+ 处理人签名 +
+ )} + {order.signature && ( +
+
客户签名
+ 客户签名 +
+ )} +
+
+ )} + + {order.siteImages && order.siteImages.length > 0 && ( +
+
现场图片
+
+ {order.siteImages.map((url) => ( + + 现场图片 + + ))} +
)} @@ -622,16 +629,6 @@ function AftersalesDetailPage() { - {order.siteImages && order.siteImages.length > 0 && ( -
-

现场图片

-
- {order.siteImages.map((url) => ( - 现场图片 - ))} -
-
- )}

处理人签名：

diff --git a/src/pages/styles/AftersalesDetail.css b/src/pages/styles/AftersalesDetail.css index f8be27d..f508f08 100644 --- a/src/pages/styles/AftersalesDetail.css +++ b/src/pages/styles/AftersalesDetail.css @@ -115,26 +115,71 @@ object-fit: contain; } -.electronic-form-site-images { - margin-top: 18px; +.aftersales-detail-signatures, +.aftersales-detail-site-images { + margin-bottom: 24px; } -.electronic-form-site-images-title { - margin: 0 0 10px; - font-weight: 600; +.aftersales-detail-section-title { + margin-bottom: 10px; + color: #595959; + font-size: 13px; + font-weight: 500; } -.electronic-form-site-images-grid { +.aftersales-detail-section-title span { + margin-left: 12px; + color: #8c8c8c; + font-size: 12px; + font-weight: 400; +} + +.aftersales-detail-signature-grid { display: grid; - grid-template-columns: repeat(3, 1fr); - gap: 10px; + grid-template-columns: repeat(2, minmax(0, 1fr)); + gap: 16px; + max-width: 760px; } -.electronic-form-site-images-grid img { +.aftersales-detail-signature-card { + padding: 12px; + border: 1px solid #f0f0f0; + border-radius: 6px; + background: #fff; +} + +.aftersales-detail-signature-label { + margin-bottom: 8px; + color: #595959; + font-size: 13px; +} + +.aftersales-detail-signature-card img { width: 100%; - height: 150px; + height: 160px; + object-fit: contain; +} + +.aftersales-detail-site-image-grid { + display: grid; + grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); + gap: 12px; +} + +.aftersales-detail-site-image-grid a { + display: block; + aspect-ratio: 1; + overflow: hidden; + border: 1px solid #f0f0f0; + border-radius: 6px; + background: #fff; +} + +.aftersales-detail-site-image-grid img { + width: 100%; + height: 100%; object-fit: cover; - border: 1px solid #1f2937; + display: block; } @media (max-width: 720px) { @@ -167,4 +212,8 @@ .electronic-form-signatures { gap: 16px; } + + .aftersales-detail-signature-grid { + grid-template-columns: 1fr; + } }