first commit

2025-06-26 06:59:59 +03:00
commit d44874775c
450 changed files with 76635 additions and 0 deletions
--- a/src/components/card/ProductCharacteristics.tsx
+++ b/src/components/card/ProductCharacteristics.tsx
@ -0,0 +1,139 @@
+import React from "react";
+
+interface ProductCharacteristicsProps {
+  result?: any;
+}
+
+const ProductCharacteristics = ({ result }: ProductCharacteristicsProps) => {
+
+  // Функция для рендеринга характеристик из нашей базы данных
+  const renderInternalCharacteristics = () => {
+    if (!result?.characteristics || result.characteristics.length === 0) return null;
+
+    return (
+      <div className="w-layout-vflex flex-block-53">
+        <div className="w-layout-hflex flex-block-55">
+          <span className="text-block-29" style={{ fontWeight: 'bold', color: '#333' }}>
+            Характеристики товара:
+          </span>
+        </div>
+        {result.characteristics.map((char: any, index: number) => (
+          <div key={index} className="w-layout-hflex flex-block-55">
+            <span className="text-block-29">{char.characteristic.name}:</span>
+            <span className="text-block-28">{char.value}</span>
+          </div>
+        ))}
+      </div>
+    );
+  };
+
+  // Функция для рендеринга характеристик из Parts Index
+  const renderPartsIndexCharacteristics = () => {
+    if (!result?.partsIndexCharacteristics || result.partsIndexCharacteristics.length === 0) return null;
+
+    return (
+      <div className="w-layout-vflex flex-block-53">
+        <div className="w-layout-hflex flex-block-55">
+          <span className="text-block-29" style={{ fontWeight: 'bold', color: '#333' }}>
+            Дополнительные характеристики:
+          </span>
+        </div>
+        {result.partsIndexCharacteristics.map((char: any, index: number) => (
+          <div key={index} className="w-layout-hflex flex-block-55">
+            <span className="text-block-29">{char.name}:</span>
+            <span className="text-block-28">{char.value}</span>
+          </div>
+        ))}
+      </div>
+    );
+  };
+
+  // Функция для рендеринга изображений из нашей базы данных
+  const renderInternalImages = () => {
+    if (!result?.images || result.images.length === 0) return null;
+
+    return (
+      <div className="w-layout-vflex flex-block-53" style={{ marginTop: '20px' }}>
+        <div className="w-layout-hflex flex-block-55">
+          <span className="text-block-29" style={{ fontWeight: 'bold', color: '#333' }}>
+            Изображения товара:
+          </span>
+        </div>
+        <div className="w-layout-hflex" style={{ flexWrap: 'wrap', gap: '10px', marginTop: '10px' }}>
+          {result.images.slice(0, 6).map((image: any, index: number) => (
+            <div key={image.id || index} style={{ 
+              border: '1px solid #e0e0e0', 
+              borderRadius: '8px', 
+              overflow: 'hidden',
+              width: '120px',
+              height: '120px',
+              display: 'flex',
+              alignItems: 'center',
+              justifyContent: 'center',
+              backgroundColor: '#f9f9f9'
+            }}>
+              <img 
+                src={image.url} 
+                alt={image.alt || `${result?.brand} ${result?.articleNumber} - изображение ${index + 1}`}
+                style={{ 
+                  maxWidth: '100%', 
+                  maxHeight: '100%', 
+                  objectFit: 'contain',
+                  cursor: 'pointer'
+                }}
+                onError={(e) => {
+                  (e.target as HTMLImageElement).style.display = 'none';
+                }}
+                onClick={() => window.open(image.url, '_blank')}
+              />
+            </div>
+          ))}
+        </div>
+      </div>
+    );
+  };
+
+  return (
+    <>
+      <div className="w-layout-hflex flex-block-52">
+        {result && (
+          <>
+            <div className="w-layout-vflex flex-block-53">
+              <div className="w-layout-hflex flex-block-55">
+                <span className="text-block-29">Бренд:</span>
+                <span className="text-block-28">{result.brand}</span>
+              </div>
+              <div className="w-layout-hflex flex-block-55">
+                <span className="text-block-29">Артикул:</span>
+                <span className="text-block-28">{result.articleNumber}</span>
+              </div>
+              <div className="w-layout-hflex flex-block-55">
+                <span className="text-block-29">Название:</span>
+                <span className="text-block-28">{result.name}</span>
+              </div>
+              {result?.description && (
+                <div className="w-layout-hflex flex-block-55">
+                  <span className="text-block-29">Описание:</span>
+                  <span className="text-block-28" style={{ maxWidth: '400px', wordWrap: 'break-word' }}>
+                    {result.description}
+                  </span>
+                </div>
+              )}
+            </div>
+            
+            {/* Характеристики из нашей базы данных */}
+            {renderInternalCharacteristics()}
+            
+            {/* Дополнительные характеристики из Parts Index */}
+            {renderPartsIndexCharacteristics()}
+          </>
+        )}
+      </div>
+      
+      {/* Изображения из нашей базы данных */}
+      {renderInternalImages()}
+    </>
+  );
+};
+
+export default ProductCharacteristics;