203 lines
9.7 KiB
PHP
203 lines
9.7 KiB
PHP
@extends('layouts.vending')
|
|
|
|
@section('title', $product->name . ' - LMIV Informationen')
|
|
|
|
@section('content')
|
|
<div class="max-w-4xl mx-auto px-4">
|
|
<!-- Back Button -->
|
|
<div class="mb-6">
|
|
<a href="javascript:history.back()" class="inline-flex items-center text-blue-600 hover:text-blue-800">
|
|
<svg class="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18"></path>
|
|
</svg>
|
|
Zurück zur Auswahl
|
|
</a>
|
|
</div>
|
|
|
|
<!-- Product Header -->
|
|
<div class="bg-white rounded-lg shadow-lg p-6 mb-6">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
|
<!-- Product Image -->
|
|
<div class="text-center">
|
|
@if($product->image)
|
|
<img src="{{ asset('storage/' . $product->image) }}"
|
|
alt="{{ $product->name }}"
|
|
class="w-full max-w-sm mx-auto rounded-lg shadow">
|
|
@else
|
|
<div class="w-full max-w-sm mx-auto h-64 bg-gray-200 rounded-lg flex items-center justify-center">
|
|
<span class="text-gray-400">Kein Produktbild verfügbar</span>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<!-- Product Info -->
|
|
<div>
|
|
<h1 class="text-3xl font-bold mb-4">{{ $product->name }}</h1>
|
|
|
|
@if($product->description)
|
|
<p class="text-gray-700 mb-4">{{ $product->description }}</p>
|
|
@endif
|
|
|
|
@if(isset($tenant) && $tenant->show_prices)
|
|
<div class="mb-4">
|
|
<span class="text-2xl font-bold text-green-600">{{ number_format($product->price, 2) }}€</span>
|
|
</div>
|
|
@elseif(!isset($tenant))
|
|
<!-- Wenn kein Mandant gesetzt ist, Preis anzeigen -->
|
|
<div class="mb-4">
|
|
<span class="text-2xl font-bold text-green-600">{{ number_format($product->price, 2) }}€</span>
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->net_weight)
|
|
<p class="text-gray-600 mb-2"><strong>Nettofüllmenge:</strong> {{ $product->net_weight }}</p>
|
|
@endif
|
|
|
|
@if($product->manufacturer)
|
|
<p class="text-gray-600 mb-2"><strong>Hersteller:</strong> {{ $product->manufacturer }}</p>
|
|
@endif
|
|
|
|
@if($product->origin)
|
|
<p class="text-gray-600 mb-2"><strong>Herkunft:</strong> {{ $product->origin }}</p>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- LMIV Information Tabs -->
|
|
<div class="bg-white rounded-lg shadow-lg">
|
|
<div x-data="{ activeTab: 'nutrition' }" class="w-full">
|
|
<!-- Tab Navigation -->
|
|
<div class="border-b border-gray-200">
|
|
<nav class="-mb-px flex space-x-8 px-6" aria-label="Tabs">
|
|
<button @click="activeTab = 'nutrition'"
|
|
:class="activeTab === 'nutrition' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'"
|
|
class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
|
|
Nährwerte
|
|
</button>
|
|
<button @click="activeTab = 'ingredients'"
|
|
:class="activeTab === 'ingredients' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'"
|
|
class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
|
|
Zutaten & Allergene
|
|
</button>
|
|
<button @click="activeTab = 'additional'"
|
|
:class="activeTab === 'additional' ? 'border-blue-500 text-blue-600' : 'border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300'"
|
|
class="whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm">
|
|
Weitere Informationen
|
|
</button>
|
|
</nav>
|
|
</div>
|
|
|
|
<!-- Tab Content -->
|
|
<div class="p-6">
|
|
<!-- Nutrition Tab -->
|
|
<div x-show="activeTab === 'nutrition'" class="space-y-4">
|
|
<h3 class="text-xl font-semibold mb-4">Nährwerte pro 100g</h3>
|
|
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-4">
|
|
@if($product->energy_kj || $product->energy_kcal)
|
|
<div class="border rounded p-4">
|
|
<h4 class="font-semibold mb-2">Brennwert</h4>
|
|
@if($product->energy_kj)
|
|
<p>{{ $product->energy_kj }} kJ</p>
|
|
@endif
|
|
@if($product->energy_kcal)
|
|
<p>{{ $product->energy_kcal }} kcal</p>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->fat)
|
|
<div class="border rounded p-4">
|
|
<h4 class="font-semibold mb-2">Fett</h4>
|
|
<p>{{ $product->fat }}g</p>
|
|
@if($product->saturated_fat)
|
|
<p class="text-sm text-gray-600">davon gesättigte Fettsäuren: {{ $product->saturated_fat }}g</p>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->carbohydrates)
|
|
<div class="border rounded p-4">
|
|
<h4 class="font-semibold mb-2">Kohlenhydrate</h4>
|
|
<p>{{ $product->carbohydrates }}g</p>
|
|
@if($product->sugars)
|
|
<p class="text-sm text-gray-600">davon Zucker: {{ $product->sugars }}g</p>
|
|
@endif
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->protein)
|
|
<div class="border rounded p-4">
|
|
<h4 class="font-semibold mb-2">Eiweiß</h4>
|
|
<p>{{ $product->protein }}g</p>
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->salt)
|
|
<div class="border rounded p-4">
|
|
<h4 class="font-semibold mb-2">Salz</h4>
|
|
<p>{{ $product->salt }}g</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Ingredients Tab -->
|
|
<div x-show="activeTab === 'ingredients'" class="space-y-4">
|
|
@if($product->ingredients)
|
|
<div>
|
|
<h3 class="text-xl font-semibold mb-4">Zutaten</h3>
|
|
<div class="bg-gray-50 rounded p-4">
|
|
<p class="text-gray-800">{{ $product->ingredients }}</p>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->allergens)
|
|
<div>
|
|
<h3 class="text-xl font-semibold mb-4">Allergene</h3>
|
|
<div class="bg-yellow-50 border border-yellow-200 rounded p-4">
|
|
<p class="text-yellow-800"><strong>Achtung:</strong> {{ $product->allergens }}</p>
|
|
</div>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
|
|
<!-- Additional Information Tab -->
|
|
<div x-show="activeTab === 'additional'" class="space-y-4">
|
|
@if($product->best_before)
|
|
<div>
|
|
<h4 class="font-semibold mb-2">Mindesthaltbarkeitsdatum</h4>
|
|
<p class="text-gray-700">{{ $product->best_before }}</p>
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->storage_conditions)
|
|
<div>
|
|
<h4 class="font-semibold mb-2">Aufbewahrungshinweise</h4>
|
|
<p class="text-gray-700">{{ $product->storage_conditions }}</p>
|
|
</div>
|
|
@endif
|
|
|
|
@if($product->usage_instructions)
|
|
<div>
|
|
<h4 class="font-semibold mb-2">Verwendungshinweise</h4>
|
|
<p class="text-gray-700">{{ $product->usage_instructions }}</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- LMIV Notice -->
|
|
<div class="mt-6 bg-blue-50 border border-blue-200 rounded-lg p-4">
|
|
<h3 class="font-semibold text-blue-900 mb-2">Hinweis zur LMIV</h3>
|
|
<p class="text-blue-800 text-sm">
|
|
Die angezeigten Informationen entsprechen der Lebensmittelinformationsverordnung (LMIV) der EU.
|
|
Alle Angaben ohne Gewähr. Bei Allergien oder Unverträglichkeiten wenden Sie sich bitte an den Betreiber.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
@endsection |