seb/reactShop
1
0
Fork 0
Code Issues Pull Requests Activity

trnalsate

Browse Source
This commit is contained in:
sebseb7
2025-07-16 10:37:13 +02:00
parent a8c77e1107
commit 65611865c8
25 changed files with 254 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

39
src/components/ProductDetailPage.js
View File

@@ -4,6 +4,7 @@ import { Link } from "react-router-dom";
import parse from "html-react-parser";
import AddToCartButton from "./AddToCartButton.js";
import Images from "./Images.js";
import { withI18n } from "../i18n/withTranslation.js";
// Utility function to clean product names by removing trailing number in parentheses
const cleanProductName = (name) => {
@@ -692,7 +693,7 @@ class ProductDetailPage extends Component {
{product.weight > 0 && (
<Box sx={{ mb: 2 }}>
<Typography variant="body2" color="text.secondary">
Gewicht: {product.weight.toFixed(1).replace(".", ",")} kg
{this.props.t ? this.props.t('product.weight', { weight: product.weight.toFixed(1).replace(".", ",") }) : `Gewicht: ${product.weight.toFixed(1).replace(".", ",")} kg`}
</Typography>
</Box>
)}
@@ -724,7 +725,7 @@ class ProductDetailPage extends Component {
{priceWithTax}
</Typography>
<Typography variant="body2" color="text.secondary">
inkl. {product.vat}% MwSt.
{this.props.t ? this.props.t('product.inclVat', { vat: product.vat }) : `inkl. ${product.vat}% MwSt.`}
{product.cGrundEinheit && product.fGrundPreis && (
<>; {new Intl.NumberFormat('de-DE', {style: 'currency', currency: 'EUR'}).format(product.fGrundPreis)}/{product.cGrundEinheit}</>
)}
@@ -757,13 +758,18 @@ class ProductDetailPage extends Component {
color: "success.main"
}}
>
Sie sparen: {new Intl.NumberFormat("de-DE", {
{this.props.t ? this.props.t('product.youSave', {
amount: new Intl.NumberFormat("de-DE", {
style: "currency",
currency: "EUR",
}).format(totalKomponentenPrice - product.price)
}) : `Sie sparen: ${new Intl.NumberFormat("de-DE", {
style: "currency",
currency: "EUR",
}).format(totalKomponentenPrice - product.price)}
}).format(totalKomponentenPrice - product.price)}`}
</Typography>
<Typography variant="caption" color="text.secondary">
Günstiger als Einzelkauf
{this.props.t ? this.props.t('product.cheaperThanIndividual') : 'Günstiger als Einzelkauf'}
</Typography>
</Box>
</Box>
@@ -808,7 +814,7 @@ class ProductDetailPage extends Component {
mt: 1
}}
>
Abholpreis: 19,90 € pro Steckling.
{this.props.t ? this.props.t('product.pickupPrice') : 'Abholpreis: 19,90 € pro Steckling.'}
</Typography>
</Box>
)}
@@ -844,9 +850,12 @@ class ProductDetailPage extends Component {
mt: 1
}}
>
{product.id.toString().endsWith("steckling") ? "Lieferzeit: 14 Tage" :
product.available == 1 ? "Lieferzeit: 2-3 Tage" :
product.availableSupplier == 1 ? "Lieferzeit: 7-9 Tage" : ""}
{product.id.toString().endsWith("steckling") ?
(this.props.t ? this.props.t('delivery.times.cutting14Days') : "Lieferzeit: 14 Tage") :
product.available == 1 ?
(this.props.t ? this.props.t('delivery.times.standard2to3Days') : "Lieferzeit: 2-3 Tage") :
product.availableSupplier == 1 ?
(this.props.t ? this.props.t('delivery.times.supplier7to9Days') : "Lieferzeit: 7-9 Tage") : ""}
</Typography>
</Box>
</Box>
@@ -881,7 +890,7 @@ class ProductDetailPage extends Component {
{product.komponenten && product.komponenten.split(",").length > 0 && (
<Box sx={{ mt: 4, p: 4, background: "#fff", borderRadius: 2, boxShadow: "0 2px 8px rgba(0,0,0,0.08)" }}>
<Typography variant="h4" gutterBottom>Bestehend aus:</Typography>
<Typography variant="h4" gutterBottom>{this.props.t ? this.props.t('product.consistsOf') : 'Bestehend aus:'}</Typography>
<Box sx={{ maxWidth: 800, mx: "auto" }}>
{(console.log("komponentenLoaded:", komponentenLoaded), komponentenLoaded) ? (
@@ -1004,7 +1013,7 @@ class ProductDetailPage extends Component {
<Box sx={{ mt: 3, pt: 2, borderTop: "2px solid #eee" }}>
<Box sx={{ display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }}>
<Typography variant="h6">
Einzelpreis gesamt:
{this.props.t ? this.props.t('product.individualPriceTotal') : 'Einzelpreis gesamt:'}
</Typography>
<Typography variant="h6" sx={{ textDecoration: "line-through", color: "text.secondary" }}>
{new Intl.NumberFormat("de-DE", {
@@ -1015,7 +1024,7 @@ class ProductDetailPage extends Component {
</Box>
<Box sx={{ display: "flex", justifyContent: "space-between", alignItems: "center", mb: 1 }}>
<Typography variant="h6">
Set-Preis:
{this.props.t ? this.props.t('product.setPrice') : 'Set-Preis:'}
</Typography>
<Typography variant="h6" color="primary" sx={{ fontWeight: "bold" }}>
{new Intl.NumberFormat("de-DE", {
@@ -1027,7 +1036,7 @@ class ProductDetailPage extends Component {
{totalSavings > 0 && (
<Box sx={{ display: "flex", justifyContent: "space-between", alignItems: "center", mt: 2, p: 2, backgroundColor: "#e8f5e8", borderRadius: 1 }}>
<Typography variant="h6" color="success.main" sx={{ fontWeight: "bold" }}>
Ihre Ersparnis:
{this.props.t ? this.props.t('product.yourSavings') : 'Ihre Ersparnis:'}
</Typography>
<Typography variant="h6" color="success.main" sx={{ fontWeight: "bold" }}>
{new Intl.NumberFormat("de-DE", {
@@ -1060,7 +1069,7 @@ class ProductDetailPage extends Component {
</Box>
<Box>
<Typography variant="body1">
{index + 1}. Lädt Komponent-Details...
{this.props.t ? this.props.t('product.loadingComponentDetails', { index: index + 1 }) : `${index + 1}. Lädt Komponent-Details...`}
</Typography>
<Typography variant="body2" color="text.secondary">
{komponent.count}x
@@ -1083,4 +1092,4 @@ class ProductDetailPage extends Component {
}
}
export default ProductDetailPage;
export default withI18n()(ProductDetailPage);