fleetCatalogue/resources/views/components/vehicles/card.blade.php

64 lines
2.6 KiB
PHP

@props(['vehicle', 'fuelType', 'brand', 'class', 'vendor'])
@php
/** @var \App\Models\Vehicle $vehicle */
@endphp
<div
class="flex flex-col w-full max-w-[40rem] min-h-[40rem] p-6 space-y-6 overflow-hidden rounded-lg shadow-md bg-zinc-800 text-{{ env('ACCENT_COLOR') }} m-auto border border-{{ env('ACCENT_COLOR') }}">
<div>
<label for="image_modal_{{ 'img/vehicles/' . $vehicle->getVehicleId() . '.png' }}"><img src="{{ asset('img/vehicles/' . $vehicle->getVehicleId() . '.png') }}" alt="Photo of {{ $vehicle->getVehicleName() }}"
class="rounded-xl cursor-pointer" width="100%"></label>
<x-image-modal image="{{ 'img/vehicles/' . $vehicle->getVehicleId() . '.png' }}" id="image_modal_{{ 'img/vehicles/' . $vehicle->getVehicleId() . '.png' }}"/>
</div>
<div class="flex flex-col justify-between flex-1">
<header>
<div class="mt-4">
<h1 class="text-3xl clamp one-line">{{ $vehicle->getVehicleName() }}</h1>
@foreach(explode(',', env('FIELDS')) as $field)
@switch($field)
@case('brand')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Brand') }}: {{ $brand }}</span>
@break
@case('class')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Class') }}: {{ $class }}</span>
@break
@case('storage')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Storage') }}: {{ $vehicle->getVehicleStorage() }}</span>
@break
@case('fuel_type')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Fuel Type') }}: {{ $fuelType }}</span>
@break
@case('fuel_volume')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Fuel Volume') }}: {{ $vehicle->getVehicleFuelVolume() }}</span>
@break
@case('seats')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Seats') }}: {{ $vehicle->getVehicleSeats() }}</span>
@break
@case('price')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Price') }}: {{ $vehicle->getVehiclePrice() }}</span>
@break
@case('top_speed')
<span class="mt-2 block text-zinc-400 text-xs">{{ __('Top Speed') }}: {{ $vehicle->getVehicleTopSpeed() }}</span>
@break
@default
@endswitch
@endforeach
</div>
</header>
<footer class="flex justify-between items-center mt-8">
<div class="flex items-center text-sm">
<h5 class="font-bold mr-3">
<p>{{ __('Sold at') }}: {{ $vendor }}</p>
</h5>
</div>
<div class="flex items-center text-sm">
<h5 class="font-bold mr-3">
<p>{{ __('ID') }}: {{ $vehicle->getVehicleId() }}</p>
</h5>
</div>
</footer>
</div>
</div>