From 5948e2998d23742d5c4d8a1fbb143e6f4ef0308e Mon Sep 17 00:00:00 2001
From: xiaoma <maruijiang666@google.com>
Date: Mon, 9 Feb 2026 18:58:25 +0800
Subject: [PATCH] fix img dark

---
 backend/db.sqlite3                      | Bin 196608 -> 196608 bytes
 frontend/src/components/ModelViewer.jsx |  68 ++++++++++++++++++------
 frontend/src/pages/ProductDetail.jsx    |  25 ++++-----
 frontend/src/pages/ServiceDetail.jsx    |   6 ++-
 4 files changed, 66 insertions(+), 33 deletions(-)

diff --git a/backend/db.sqlite3 b/backend/db.sqlite3
index 1d3123d9ce4e02e563ea0535a90339446b5fa41d..6e2c1da30261adf668a0ad9d99645e143b1871a8 100644
GIT binary patch
delta 548
zcmZo@;Av>!nIO%$YNCuY<Eo7b2lN<uHY@5+a}cytFf_0-F|#tX)Uz-#H#aofd?MdQ
zfsd8TlY#Fx?{=Qa+<9D{n-vwzxip%TSXq6WgB=qMDwB&1GR!R!(=*d7EAx%Z3oA2=
zQwvQBii&g1Es7>jo4v);KR3$C%h0>bCqE-4%h%lBC(Xj$IX^x>H{adNHLNJn!p$_o
zxhTWE($F}*Fe%W;z{pJ3z)07~7~vjELjyw-gUxxfr?K#{@_R7w-{JS*-_AdYKX<cW
zff>K53bQXGA-Aw@&RswKgA5P<P6qz3{O|d%^IzmY&A*fXG5>G=m;876kMi#a8a9)k
zjg^^^k)3Dy{`HKmY&`tC82EQ>=h(owfuEIynUj%c`~Llmt^zVVTpA4g>-c^78hN+y
zX7j4@%;6E{?&D_V+Rvo{3?mLMo<<QKE(XDP#ztXA&gs4P7(J&yy2Gd;1@oQ(EVxZg
z^-L_yEX<9z@4v<9Dhl*p8Uz0${=@uB_*?nYfKCeGmzQI9WQ1wN3>Vhzt^XNo9Qb)J
zF|cr*Vc>qoFT_{Dbq45+JzT;~;#>j@zOsyroSf{9fxL~y3=GpJ++$Rj&f>>ZGCjzL
Ysd)P{Z>BelEc`PVmTkZ0%cQjl00umtCIA2c

delta 249
zcmV<V00#enfDC|u43HZErjZ;&0j9BFz%Bs`vmq~*KoK|~F)%taH99acE;2JUF*!A}
z$ZtF#3<L{q01n#?w+xdDZnGgEUJJ8so0bFy1P^Th58Sg1pga$epeM6!ub1!|3lF~l
z5A_f457!UT56chZ5Bm@458V&N55Kb!aG?*EzpnvB1Pc$p0JjRT0k98|PzSfazX3%M
z8Vd@)01vJYO%8z#v<+(wB@CPl6AO+D1q#2jAt0d&x4+r}MHLJL4}|~^;t#_Qqz{F&
z5pZ=6w}t-!d_WHmm;eL|<^T)k4-yV|4brnAAl3`F=1T(X0R({~3J<r|O#&*i!j@80

diff --git a/frontend/src/components/ModelViewer.jsx b/frontend/src/components/ModelViewer.jsx
index db7a4b4..969ae84 100644
--- a/frontend/src/components/ModelViewer.jsx
+++ b/frontend/src/components/ModelViewer.jsx
@@ -7,6 +7,42 @@ import { Spin } from 'antd';
 import JSZip from 'jszip';
 import * as THREE from 'three';
 
+class ErrorBoundary extends React.Component {
+  constructor(props) {
+    super(props);
+    this.state = { hasError: false };
+  }
+
+  static getDerivedStateFromError(error) {
+    return { hasError: true };
+  }
+
+  componentDidCatch(error, errorInfo) {
+    console.error("3D Model Viewer Error:", error, errorInfo);
+  }
+
+  render() {
+    if (this.state.hasError) {
+      return (
+        <div style={{ 
+          display: 'flex', 
+          alignItems: 'center', 
+          justifyContent: 'center', 
+          height: '100%', 
+          color: '#888',
+          padding: 20,
+          textAlign: 'center',
+          fontSize: '14px'
+        }}>
+          3D 模型加载失败
+        </div>
+      );
+    }
+
+    return this.props.children;
+  }
+}
+
 const Model = ({ objPath, mtlPath, scale = 1 }) => {
   // If mtlPath is provided, load materials first
   const materials = mtlPath ? useLoader(MTLLoader, mtlPath) : null;
@@ -158,21 +194,23 @@ const ModelViewer = ({ objPath, mtlPath, scale = 1, autoRotate = true }) => {
 
   return (
     <div style={{ position: 'relative', width: '100%', height: '100%' }}>
-      <LoadingOverlay />
-      <Canvas shadows dpr={[1, 2]} camera={{ fov: 45, position: [0, 0, 5] }} style={{ height: '100%', width: '100%' }}>
-        <ambientLight intensity={0.7} />
-        <pointLight position={[10, 10, 10]} intensity={1} />
-        <spotLight position={[-10, 10, 10]} angle={0.15} penumbra={1} intensity={1} />
-        
-        <Suspense fallback={null}>
-          <Stage environment="city" intensity={0.6} adjustCamera={true}>
-            <Model objPath={paths.obj} mtlPath={paths.mtl} scale={scale} />
-          </Stage>
-          <Environment preset="city" />
-          <ContactShadows position={[0, -0.8, 0]} opacity={0.4} scale={10} blur={2} far={0.8} />
-        </Suspense>
-        <OrbitControls autoRotate={autoRotate} makeDefault />
-      </Canvas>
+      <ErrorBoundary>
+        <LoadingOverlay />
+        <Canvas shadows dpr={[1, 2]} camera={{ fov: 45, position: [0, 0, 5] }} style={{ height: '100%', width: '100%' }}>
+          <ambientLight intensity={0.7} />
+          <pointLight position={[10, 10, 10]} intensity={1} />
+          <spotLight position={[-10, 10, 10]} angle={0.15} penumbra={1} intensity={1} />
+          
+          <Suspense fallback={null}>
+            <Stage environment="city" intensity={0.6} adjustCamera={true}>
+              <Model objPath={paths.obj} mtlPath={paths.mtl} scale={scale} />
+            </Stage>
+            <Environment preset="city" />
+            <ContactShadows position={[0, -0.8, 0]} opacity={0.4} scale={10} blur={2} far={0.8} />
+          </Suspense>
+          <OrbitControls autoRotate={autoRotate} makeDefault />
+        </Canvas>
+      </ErrorBoundary>
     </div>
   );
 };
diff --git a/frontend/src/pages/ProductDetail.jsx b/frontend/src/pages/ProductDetail.jsx
index 1f106f5..08de8b4 100644
--- a/frontend/src/pages/ProductDetail.jsx
+++ b/frontend/src/pages/ProductDetail.jsx
@@ -82,20 +82,6 @@ const ProductDetail = () => {
       return { obj: p.model_3d_url };
     }
 
-    // 如果有静态图，且没有特定的 3D 模型 URL，则优先显示静态图，不进入下方的通用 3D 模板匹配
-    if (p.static_image_url) {
-      return null;
-    }
-
-    const text = (p.name + p.description).toLowerCase();
-    
-    if (text.includes('mini')) {
-      return { obj: '/3dmimi/3D_PCB_V3-mini.obj', mtl: '/3dmimi/3D_PCB_V3-mini.mtl' };
-    } else if (text.includes('v2')) {
-      return { obj: '/3dV2/xiaoliangV2.obj', mtl: '/3dV2/xiaoliangV2.mtl' };
-    } else if (text.includes('vision') || text.includes('视觉') || text.includes('camera')) {
-      return { obj: '/3dmodo/xiaoliang1.obj', mtl: '/3dmodo/xiaoliang1.mtl' };
-    }
     return null;
   };
 
@@ -207,8 +193,15 @@ const ProductDetail = () => {
         )}
         
         {product.display_detail_image ? (
-            <div style={{ margin: '60px 0', width: '100%', overflow: 'hidden', borderRadius: 12 }}>
-                <img src={product.display_detail_image} alt="产品详情" style={{ width: '100%', display: 'block' }} />
+            <div style={{ 
+                margin: '60px auto', 
+                maxWidth: '900px', 
+                width: '100%',
+                overflow: 'hidden', 
+                borderRadius: 12,
+                boxShadow: '0 10px 40px rgba(0,0,0,0.5)'
+            }}>
+                <img src={product.display_detail_image} alt="产品详情" style={{ width: '100%', display: 'block', height: 'auto' }} />
             </div>
         ) : (
             <div style={{ margin: '60px 0', height: 800, background: '#111', display: 'flex', alignItems: 'center', justifyContent: 'center', color: '#333', fontSize: 24, border: '1px dashed #333' }}>
diff --git a/frontend/src/pages/ServiceDetail.jsx b/frontend/src/pages/ServiceDetail.jsx
index cd523bb..fcbc1da 100644
--- a/frontend/src/pages/ServiceDetail.jsx
+++ b/frontend/src/pages/ServiceDetail.jsx
@@ -132,16 +132,18 @@ const ServiceDetail = () => {
                 {service.display_detail_image ? (
                     <div style={{ 
                         width: '100%', 
+                        maxWidth: '900px',
+                        margin: '0 auto',
                         background: '#111', 
                         borderRadius: 12, 
                         overflow: 'hidden',
-                        boxShadow: `0 0 30px ${service.color}22`,
+                        boxShadow: `0 10px 40px ${service.color}22`,
                         border: `1px solid ${service.color}33`
                     }}>
                         <img 
                             src={service.display_detail_image} 
                             alt={service.title} 
-                            style={{ width: '100%', display: 'block' }} 
+                            style={{ width: '100%', display: 'block', height: 'auto' }} 
                         />
                     </div>
                 ) : (