233 lines
13 KiB
PHP
233 lines
13 KiB
PHP
@extends('layouts.vending')
|
|
|
|
@section('title', $vendingMachine->name)
|
|
|
|
@section('content')
|
|
<div class="max-w-6xl mx-auto px-4">
|
|
<div class="mb-8">
|
|
<div class="flex items-center space-x-4 mb-4">
|
|
<a href="{{ route('vending-machines.index') }}" class="text-blue-600 hover:text-blue-800">
|
|
← Zurück zur Übersicht
|
|
</a>
|
|
</div>
|
|
<div class="flex justify-between items-start">
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-gray-900">{{ $vendingMachine->name }}</h1>
|
|
<p class="text-xl text-gray-600 mt-2">{{ $vendingMachine->location }}</p>
|
|
@if($vendingMachine->serial_number)
|
|
<p class="text-sm text-gray-500 mt-1">S/N: {{ $vendingMachine->serial_number }}</p>
|
|
@endif
|
|
</div>
|
|
<div class="flex space-x-3">
|
|
@if($vendingMachine->tenant && $vendingMachine->tenant->public_slug && $vendingMachine->machine_number)
|
|
<a href="{{ route('vending.public.machine', ['publicSlug' => $vendingMachine->tenant->public_slug, 'machineNumber' => $vendingMachine->machine_number]) }}"
|
|
class="inline-flex items-center px-4 py-2 border border-blue-300 text-sm font-medium rounded-md text-blue-700 bg-white hover:bg-blue-50" target="_blank">
|
|
Öffentliche Ansicht
|
|
</a>
|
|
@endif
|
|
<a href="{{ route('vending-machines.edit', $vendingMachine) }}"
|
|
class="inline-flex items-center px-4 py-2 border border-gray-300 text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50">
|
|
Bearbeiten
|
|
</a>
|
|
<form action="{{ route('vending-machines.destroy', $vendingMachine) }}" method="POST" class="inline"
|
|
onsubmit="return confirm('Sind Sie sicher, dass Sie diesen Automaten löschen möchten?')">
|
|
@csrf
|
|
@method('DELETE')
|
|
<button type="submit"
|
|
class="inline-flex items-center px-4 py-2 border border-red-300 text-sm font-medium rounded-md text-red-700 bg-white hover:bg-red-50">
|
|
Löschen
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-8">
|
|
<!-- Automatinformationen -->
|
|
<div class="lg:col-span-1">
|
|
<div class="bg-white shadow rounded-lg p-6 mb-6">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-4 border-b border-gray-200 pb-2">
|
|
Automatinformationen
|
|
</h2>
|
|
|
|
<div class="space-y-4">
|
|
<div>
|
|
<h3 class="font-semibold text-gray-900 mb-1">Status</h3>
|
|
@if($vendingMachine->is_active)
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800">
|
|
Aktiv
|
|
</span>
|
|
@else
|
|
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800">
|
|
Inaktiv
|
|
</span>
|
|
@endif
|
|
</div>
|
|
|
|
@if($vendingMachine->description)
|
|
<div>
|
|
<h3 class="font-semibold text-gray-900 mb-1">Beschreibung</h3>
|
|
<p class="text-gray-600">{{ $vendingMachine->description }}</p>
|
|
</div>
|
|
@endif
|
|
|
|
<div>
|
|
<h3 class="font-semibold text-gray-900 mb-1">Erstellt</h3>
|
|
<p class="text-gray-600">{{ $vendingMachine->created_at->format('d.m.Y H:i') }}</p>
|
|
</div>
|
|
|
|
<div>
|
|
<h3 class="font-semibold text-gray-900 mb-1">Zuletzt bearbeitet</h3>
|
|
<p class="text-gray-600">{{ $vendingMachine->updated_at->format('d.m.Y H:i') }}</p>
|
|
</div>
|
|
|
|
<!-- QR-Code für Mandanten-URL -->
|
|
@if($vendingMachine->tenant && $vendingMachine->tenant->public_slug)
|
|
<div>
|
|
<h3 class="font-semibold text-gray-900 mb-3">QR-Code Download</h3>
|
|
<div class="p-4 bg-blue-50 rounded-lg">
|
|
<h4 class="text-sm font-medium text-gray-900 mb-2">Mandanten-spezifischer QR-Code</h4>
|
|
<p class="text-xs text-gray-600 mb-3">Nur für {{ $vendingMachine->tenant->name }}</p>
|
|
|
|
<!-- URL anzeigen -->
|
|
<div class="mb-3">
|
|
<div class="flex items-center space-x-2 mb-2">
|
|
<code class="text-xs bg-white px-2 py-1 rounded border flex-1">
|
|
{{ route('vending.public.machine', ['publicSlug' => $vendingMachine->tenant->public_slug, 'machineNumber' => $vendingMachine->machine_number]) }}
|
|
</code>
|
|
<button onclick="copyToClipboard('{{ route('vending.public.machine', ['publicSlug' => $vendingMachine->tenant->public_slug, 'machineNumber' => $vendingMachine->machine_number]) }}')"
|
|
class="text-blue-600 hover:text-blue-800 text-xs">
|
|
📋
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- QR-Code Download Button -->
|
|
<a href="{{ route('vending-machines.qr-code', $vendingMachine->id) }}"
|
|
class="inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500">
|
|
<svg class="w-4 h-4 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 10v6m0 0l-3-3m3 3l3-3m2 8H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
|
|
</svg>
|
|
QR-Code herunterladen
|
|
<span class="ml-1 text-xs opacity-75">(SVG/PNG)</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
@else
|
|
<div class="p-3 bg-yellow-50 rounded-lg">
|
|
<h4 class="text-sm font-medium text-gray-900 mb-1">QR-Code nicht verfügbar</h4>
|
|
<p class="text-xs text-gray-600">
|
|
@if(!$vendingMachine->tenant)
|
|
Kein Mandant zugewiesen.
|
|
@else
|
|
{{ $vendingMachine->tenant->name }} hat keinen öffentlichen Slug konfiguriert.
|
|
@endif
|
|
</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Statistiken -->
|
|
<div class="bg-white shadow rounded-lg p-6">
|
|
<h2 class="text-xl font-semibold text-gray-900 mb-4 border-b border-gray-200 pb-2">
|
|
Statistiken
|
|
</h2>
|
|
|
|
<div class="grid grid-cols-2 gap-4">
|
|
<div class="text-center p-3 bg-blue-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-blue-900">{{ $vendingMachine->slots->count() }}</div>
|
|
<div class="text-sm text-blue-600">Gesamte Slots</div>
|
|
</div>
|
|
<div class="text-center p-3 bg-green-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-green-900">{{ $vendingMachine->slots->whereNotNull('pivot.product_id')->count() }}</div>
|
|
<div class="text-sm text-green-600">Belegte Slots</div>
|
|
</div>
|
|
<div class="text-center p-3 bg-yellow-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-yellow-900">{{ $vendingMachine->slots->whereNull('pivot.product_id')->count() }}</div>
|
|
<div class="text-sm text-yellow-600">Freie Slots</div>
|
|
</div>
|
|
<div class="text-center p-3 bg-purple-50 rounded-lg">
|
|
<div class="text-2xl font-bold text-purple-900">{{ $vendingMachine->slots->pluck('products')->flatten()->unique('id')->count() }}</div>
|
|
<div class="text-sm text-purple-600">Verschiedene Produkte</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Slot-Übersicht -->
|
|
<div class="lg:col-span-2">
|
|
<div class="bg-white shadow rounded-lg p-6">
|
|
<div class="flex justify-between items-center mb-6 border-b border-gray-200 pb-2">
|
|
<h2 class="text-xl font-semibold text-gray-900">Slot-Übersicht</h2>
|
|
<a href="{{ route('slots.index') }}?machine={{ $vendingMachine->id }}"
|
|
class="inline-flex items-center px-4 py-2 border border-purple-300 text-sm font-medium rounded-md text-purple-700 bg-white hover:bg-purple-50">
|
|
Alle Slots verwalten
|
|
</a>
|
|
</div>
|
|
|
|
@if($vendingMachine->slots->count() > 0)
|
|
<div class="grid grid-cols-6 gap-2">
|
|
@foreach($vendingMachine->slots->sortBy('slot_number') as $slot)
|
|
<div class="border rounded-lg p-3 text-center {{ $slot->products->count() > 0 ? 'bg-green-50 border-green-200' : 'bg-gray-50 border-gray-200' }}">
|
|
<div class="font-semibold text-sm {{ $slot->products->count() > 0 ? 'text-green-900' : 'text-gray-600' }}">
|
|
{{ $slot->slot_number }}
|
|
</div>
|
|
@if($slot->products->count() > 0)
|
|
@php $product = $slot->products->first() @endphp
|
|
<div class="text-xs text-green-700 mt-1 truncate" title="{{ $product->name }}">
|
|
{{ Str::limit($product->name, 10) }}
|
|
</div>
|
|
<div class="text-xs text-green-600 mt-1">
|
|
{{ $product->pivot->stock_quantity ?? 0 }}x
|
|
</div>
|
|
@else
|
|
<div class="text-xs text-gray-500 mt-1">Leer</div>
|
|
@endif
|
|
</div>
|
|
@endforeach
|
|
</div>
|
|
|
|
<!-- Legende -->
|
|
<div class="mt-6 flex justify-center space-x-6 text-sm">
|
|
<div class="flex items-center">
|
|
<div class="w-4 h-4 bg-green-50 border border-green-200 rounded mr-2"></div>
|
|
<span class="text-gray-600">Belegt</span>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<div class="w-4 h-4 bg-gray-50 border border-gray-200 rounded mr-2"></div>
|
|
<span class="text-gray-600">Leer</span>
|
|
</div>
|
|
</div>
|
|
@else
|
|
<div class="text-center py-8">
|
|
<svg class="mx-auto h-12 w-12 text-gray-400" fill="none" viewBox="0 0 24 24" stroke="currentColor">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 17V7m0 10a2 2 0 01-2 2H5a2 2 0 01-2-2V7a2 2 0 012-2h2a2 2 0 012 2m0 10a2 2 0 002 2h2a2 2 0 002-2M9 7a2 2 0 012-2h2a2 2 0 012 2m0 10V7m0 10a2 2 0 002 2h2a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2h2a2 2 0 002-2z"/>
|
|
</svg>
|
|
<h3 class="mt-2 text-sm font-medium text-gray-900">Keine Slots</h3>
|
|
<p class="mt-1 text-sm text-gray-500">Für diesen Automaten wurden noch keine Slots erstellt.</p>
|
|
</div>
|
|
@endif
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
function copyToClipboard(text) {
|
|
navigator.clipboard.writeText(text).then(function() {
|
|
// Show a temporary notification
|
|
const originalText = event.target.textContent;
|
|
event.target.textContent = '✓';
|
|
event.target.style.color = 'green';
|
|
|
|
setTimeout(() => {
|
|
event.target.textContent = originalText;
|
|
event.target.style.color = '';
|
|
}, 1000);
|
|
}).catch(function(err) {
|
|
console.error('Could not copy text: ', err);
|
|
});
|
|
}
|
|
</script>
|
|
@endsection |