Add enums for ReviewStatus, TrackMaterial, LaunchType, RideCategory, and RollerCoasterType; implement Designer and RideModel models; create migrations for ride_models and helpful_votes tables; enhance RideGalleryComponent documentation

This commit is contained in:
pacnpal
2025-02-25 20:37:19 -05:00
parent 8951e59f49
commit 64b0e90a27
35 changed files with 3157 additions and 1 deletions

View File

@@ -0,0 +1,181 @@
{{-- Physical Dimensions --}}
<div class="space-y-6 sm:space-y-5">
<div class="sm:grid sm:grid-cols-2 sm:gap-4">
<div>
<label for="height_ft" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Height (feet)
</label>
<div class="mt-1">
<input type="number"
step="0.01"
id="height_ft"
wire:model="coasterStats.height_ft"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.height_ft') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="length_ft" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Length (feet)
</label>
<div class="mt-1">
<input type="number"
step="0.01"
id="length_ft"
wire:model="coasterStats.length_ft"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.length_ft') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
<div class="sm:grid sm:grid-cols-2 sm:gap-4">
<div>
<label for="speed_mph" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Speed (mph)
</label>
<div class="mt-1">
<input type="number"
step="0.01"
id="speed_mph"
wire:model="coasterStats.speed_mph"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.speed_mph') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="max_drop_height_ft" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Max Drop Height (feet)
</label>
<div class="mt-1">
<input type="number"
step="0.01"
id="max_drop_height_ft"
wire:model="coasterStats.max_drop_height_ft"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.max_drop_height_ft') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>
{{-- Track Configuration --}}
<div class="space-y-6 sm:space-y-5 mt-6">
<div class="sm:grid sm:grid-cols-2 sm:gap-4">
<div>
<label for="track_material" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Track Material
</label>
<div class="mt-1">
<select id="track_material"
wire:model="coasterStats.track_material"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@foreach(App\Enums\TrackMaterial::cases() as $material)
<option value="{{ $material->value }}">{{ $material->label() }}</option>
@endforeach
</select>
@error('coasterStats.track_material') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="roller_coaster_type" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Coaster Type
</label>
<div class="mt-1">
<select id="roller_coaster_type"
wire:model="coasterStats.roller_coaster_type"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@foreach(App\Enums\RollerCoasterType::cases() as $type)
<option value="{{ $type->value }}">{{ $type->label() }}</option>
@endforeach
</select>
@error('coasterStats.roller_coaster_type') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
<div class="sm:grid sm:grid-cols-2 sm:gap-4">
<div>
<label for="inversions" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Number of Inversions
</label>
<div class="mt-1">
<input type="number"
id="inversions"
wire:model="coasterStats.inversions"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.inversions') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="launch_type" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Launch Type
</label>
<div class="mt-1">
<select id="launch_type"
wire:model="coasterStats.launch_type"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@foreach(App\Enums\LaunchType::cases() as $type)
<option value="{{ $type->value }}">{{ $type->label() }}</option>
@endforeach
</select>
@error('coasterStats.launch_type') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>
{{-- Train Configuration --}}
<div class="space-y-6 sm:space-y-5 mt-6">
<div>
<label for="train_style" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Train Style
</label>
<div class="mt-1">
<input type="text"
id="train_style"
wire:model="coasterStats.train_style"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.train_style') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div class="sm:grid sm:grid-cols-3 sm:gap-4">
<div>
<label for="trains_count" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Number of Trains
</label>
<div class="mt-1">
<input type="number"
id="trains_count"
wire:model="coasterStats.trains_count"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.trains_count') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="cars_per_train" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Cars per Train
</label>
<div class="mt-1">
<input type="number"
id="cars_per_train"
wire:model="coasterStats.cars_per_train"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.cars_per_train') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="seats_per_car" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Seats per Car
</label>
<div class="mt-1">
<input type="number"
id="seats_per_car"
wire:model="coasterStats.seats_per_car"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('coasterStats.seats_per_car') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>

View File

@@ -0,0 +1,190 @@
<div class="bg-white dark:bg-gray-800 shadow overflow-hidden sm:rounded-lg">
{{-- Header --}}
<div class="px-4 py-5 sm:px-6 border-b border-gray-200 dark:border-gray-700">
<div class="flex justify-between items-start">
<div>
<h3 class="text-2xl font-bold leading-6 text-gray-900 dark:text-white">
{{ $ride->name }}
</h3>
<p class="mt-1 text-sm text-gray-500 dark:text-gray-400">
{{ $ride->park->name }}
@if($ride->parkArea)
<span class="px-2"></span>
{{ $ride->parkArea->name }}
@endif
</p>
</div>
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full {{ $this->getStatusColorClasses() }}">
{{ $ride->status->label() }}
</span>
</div>
</div>
{{-- Basic Information --}}
<div class="px-4 py-5 sm:p-6 border-b border-gray-200 dark:border-gray-700">
<dl class="grid grid-cols-1 md:grid-cols-2 gap-x-4 gap-y-8">
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Category</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->category->label() }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Operating Period</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $this->operatingPeriod }}</dd>
</div>
@if($ride->manufacturer)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Manufacturer</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->manufacturer->name }}</dd>
</div>
@endif
@if($ride->designer)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Designer</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->designer->name }}</dd>
</div>
@endif
@if($ride->rideModel)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Model</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->rideModel->name }}</dd>
</div>
@endif
</dl>
@if($ride->description)
<div class="mt-8">
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Description</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white whitespace-pre-line">{{ $ride->description }}</dd>
</div>
@endif
</div>
{{-- Technical Details --}}
<div class="px-4 py-5 sm:p-6 border-b border-gray-200 dark:border-gray-700">
<h4 class="text-lg font-medium text-gray-900 dark:text-white mb-4">Technical Specifications</h4>
<dl class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-4 gap-y-8">
@if($ride->min_height_in)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Minimum Height</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->min_height_in }} inches</dd>
</div>
@endif
@if($ride->max_height_in)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Maximum Height</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->max_height_in }} inches</dd>
</div>
@endif
@if($ride->capacity_per_hour)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Hourly Capacity</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ number_format($ride->capacity_per_hour) }} riders</dd>
</div>
@endif
@if($ride->ride_duration_seconds)
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Ride Duration</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->ride_duration_seconds }} seconds</dd>
</div>
@endif
</dl>
</div>
{{-- Roller Coaster Stats --}}
@if($ride->coasterStats)
<div class="px-4 py-5 sm:p-6">
<div class="flex items-center justify-between mb-4">
<h4 class="text-lg font-medium text-gray-900 dark:text-white">Roller Coaster Statistics</h4>
<button type="button"
wire:click="toggleCoasterStats"
class="inline-flex items-center px-3 py-1.5 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:bg-gray-600">
{{ $showCoasterStats ? 'Hide Details' : 'Show Details' }}
</button>
</div>
@if($showCoasterStats)
<dl class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-x-4 gap-y-8">
{{-- Track Details --}}
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Track Type</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->track_material->label() }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Coaster Type</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->roller_coaster_type->label() }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Launch Type</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->launch_type->label() }}</dd>
</div>
{{-- Physical Measurements --}}
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Height</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $this->formatMeasurement($ride->coasterStats->height_ft, 'ft') }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Length</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $this->formatMeasurement($ride->coasterStats->length_ft, 'ft') }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Speed</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $this->formatMeasurement($ride->coasterStats->speed_mph, 'mph') }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Max Drop</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $this->formatMeasurement($ride->coasterStats->max_drop_height_ft, 'ft') }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Inversions</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->inversions ?? 'N/A' }}</dd>
</div>
{{-- Train Configuration --}}
@if($ride->coasterStats->train_style)
<div class="col-span-full">
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Train Style</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->train_style }}</dd>
</div>
@endif
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Number of Trains</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->trains_count ?? 'N/A' }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Cars per Train</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->cars_per_train ?? 'N/A' }}</dd>
</div>
<div>
<dt class="text-sm font-medium text-gray-500 dark:text-gray-400">Seats per Car</dt>
<dd class="mt-1 text-sm text-gray-900 dark:text-white">{{ $ride->coasterStats->seats_per_car ?? 'N/A' }}</dd>
</div>
</dl>
@endif
</div>
@endif
{{-- Actions --}}
<div class="px-4 py-3 bg-gray-50 dark:bg-gray-700 text-right sm:px-6">
<a href="{{ route('rides.edit', $ride) }}"
class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
Edit Ride
</a>
</div>
</div>

View File

@@ -0,0 +1,249 @@
<div class="space-y-6">
<form wire:submit="save" class="space-y-8 divide-y divide-gray-200 dark:divide-gray-700">
{{-- Basic Information --}}
<div class="space-y-6 sm:space-y-5">
<div>
<h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">Basic Information</h3>
<p class="mt-1 max-w-2xl text-sm text-gray-500 dark:text-gray-400">
Provide the basic details about this ride.
</p>
</div>
<div class="space-y-6 sm:space-y-5">
{{-- Name --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="name" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Name
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<input type="text"
id="name"
wire:model="state.name"
class="max-w-lg block w-full shadow-sm focus:ring-primary-500 focus:border-primary-500 sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('state.name') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Park --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="park_id" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Park
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="park_id"
wire:model.live="state.park_id"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
<option value="">Select a park</option>
@foreach($this->parks as $park)
<option value="{{ $park->id }}">{{ $park->name }}</option>
@endforeach
</select>
@error('state.park_id') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Park Area --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="park_area_id" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Park Area
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="park_area_id"
wire:model="state.park_area_id"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
<option value="">Select an area</option>
@foreach($this->parkAreas as $area)
<option value="{{ $area->id }}">{{ $area->name }}</option>
@endforeach
</select>
@error('state.park_area_id') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Category --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="category" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Category
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="category"
wire:model.live="state.category"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@foreach(App\Enums\RideCategory::cases() as $category)
<option value="{{ $category->value }}">{{ $category->label() }}</option>
@endforeach
</select>
@error('state.category') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Status --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="status" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Status
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="status"
wire:model="state.status"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@foreach(App\Enums\RideStatus::cases() as $status)
<option value="{{ $status->value }}">{{ $status->label() }}</option>
@endforeach
</select>
@error('state.status') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Description --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="description" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Description
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<textarea id="description"
wire:model="state.description"
rows="3"
class="max-w-lg shadow-sm block w-full focus:ring-primary-500 focus:border-primary-500 sm:text-sm border border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white"></textarea>
@error('state.description') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>
{{-- Technical Details --}}
<div class="pt-8 space-y-6 sm:space-y-5">
<div>
<h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">Technical Details</h3>
<p class="mt-1 max-w-2xl text-sm text-gray-500 dark:text-gray-400">
Specify the technical specifications and requirements.
</p>
</div>
<div class="space-y-6 sm:space-y-5">
{{-- Manufacturer --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="manufacturer_id" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Manufacturer
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="manufacturer_id"
wire:model="state.manufacturer_id"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
<option value="">Select a manufacturer</option>
@foreach($this->manufacturers as $manufacturer)
<option value="{{ $manufacturer->id }}">{{ $manufacturer->name }}</option>
@endforeach
</select>
@error('state.manufacturer_id') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Designer --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<label for="designer_id" class="block text-sm font-medium text-gray-700 dark:text-gray-300 sm:mt-px sm:pt-2">
Designer
</label>
<div class="mt-1 sm:mt-0 sm:col-span-2">
<select id="designer_id"
wire:model="state.designer_id"
class="max-w-lg block focus:ring-primary-500 focus:border-primary-500 w-full shadow-sm sm:max-w-xs sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
<option value="">Select a designer</option>
@foreach($this->designers as $designer)
<option value="{{ $designer->id }}">{{ $designer->name }}</option>
@endforeach
</select>
@error('state.designer_id') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
{{-- Height Requirements --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<div class="col-span-3 grid grid-cols-2 gap-4">
<div>
<label for="min_height_in" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Minimum Height (inches)
</label>
<div class="mt-1">
<input type="number"
id="min_height_in"
wire:model="state.min_height_in"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('state.min_height_in') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="max_height_in" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Maximum Height (inches)
</label>
<div class="mt-1">
<input type="number"
id="max_height_in"
wire:model="state.max_height_in"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('state.max_height_in') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>
{{-- Capacity and Duration --}}
<div class="sm:grid sm:grid-cols-3 sm:gap-4 sm:items-start sm:pt-5">
<div class="col-span-3 grid grid-cols-2 gap-4">
<div>
<label for="capacity_per_hour" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Capacity (per hour)
</label>
<div class="mt-1">
<input type="number"
id="capacity_per_hour"
wire:model="state.capacity_per_hour"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('state.capacity_per_hour') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
<div>
<label for="ride_duration_seconds" class="block text-sm font-medium text-gray-700 dark:text-gray-300">
Duration (seconds)
</label>
<div class="mt-1">
<input type="number"
id="ride_duration_seconds"
wire:model="state.ride_duration_seconds"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('state.ride_duration_seconds') <span class="text-red-500 text-sm">{{ $message }}</span> @enderror
</div>
</div>
</div>
</div>
</div>
</div>
{{-- Coaster Stats (if applicable) --}}
@if($state['category'] === App\Enums\RideCategory::ROLLER_COASTER->value)
<div class="pt-8 space-y-6 sm:space-y-5">
<div>
<h3 class="text-lg font-medium leading-6 text-gray-900 dark:text-white">Roller Coaster Details</h3>
<p class="mt-1 max-w-2xl text-sm text-gray-500 dark:text-gray-400">
Additional specifications for roller coasters.
</p>
</div>
@include('livewire.partials._coaster-stats-form')
</div>
@endif
{{-- Form Actions --}}
<div class="pt-5">
<div class="flex justify-end">
<a href="{{ route('rides.index') }}"
class="bg-white py-2 px-4 border border-gray-300 rounded-md shadow-sm text-sm font-medium text-gray-700 hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:bg-gray-600">
Cancel
</a>
<button type="submit"
class="ml-3 inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:hover:bg-primary-500">
Save
</button>
</div>
</div>
</form>
</div>

View File

@@ -0,0 +1,121 @@
<div class="space-y-6">
{{-- Upload Area --}}
<div class="flex justify-end">
<button type="button"
wire:click="toggleUploadForm"
class="inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:bg-gray-600">
{{ $showUploadForm ? 'Cancel Upload' : 'Upload Photo' }}
</button>
</div>
{{-- Upload Form --}}
@if($showUploadForm)
<div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-6">
<form wire:submit="save">
<div class="space-y-4">
{{-- Photo Upload --}}
<div>
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Photo</label>
<div class="mt-1 flex items-center">
<input type="file"
wire:model="photo"
accept="image/*"
class="sr-only"
id="photo-upload">
<label for="photo-upload"
class="cursor-pointer inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:bg-gray-600">
Choose File
</label>
@if($photo)
<span class="ml-3 text-sm text-gray-500 dark:text-gray-400">{{ $photo->getClientOriginalName() }}</span>
@endif
</div>
@error('photo') <span class="mt-1 text-sm text-red-500">{{ $message }}</span> @enderror
</div>
{{-- Caption --}}
<div>
<label for="caption" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Caption</label>
<div class="mt-1">
<input type="text"
id="caption"
wire:model="caption"
class="shadow-sm focus:ring-primary-500 focus:border-primary-500 block w-full sm:text-sm border-gray-300 rounded-md dark:bg-gray-700 dark:border-gray-600 dark:text-white">
@error('caption') <span class="mt-1 text-sm text-red-500">{{ $message }}</span> @enderror
</div>
</div>
{{-- Submit Button --}}
<div class="flex justify-end">
<button type="submit"
class="inline-flex justify-center py-2 px-4 border border-transparent shadow-sm text-sm font-medium rounded-md text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
Upload Photo
</button>
</div>
</div>
</form>
</div>
@endif
{{-- Photo Grid --}}
@if($photos->count() > 0)
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
@foreach($photos as $photo)
<div class="relative group bg-white dark:bg-gray-800 p-2 rounded-lg shadow hover:shadow-lg transition-shadow">
<div class="aspect-w-16 aspect-h-9">
<img src="{{ Storage::url($photo->path) }}"
alt="{{ $photo->caption }}"
class="object-cover rounded">
</div>
{{-- Caption --}}
@if($photo->caption)
<p class="mt-2 text-sm text-gray-500 dark:text-gray-400">{{ $photo->caption }}</p>
@endif
{{-- Actions --}}
<div class="absolute top-2 right-2 space-x-2 opacity-0 group-hover:opacity-100 transition-opacity">
{{-- Set as Featured --}}
@if($ride->featured_photo_id !== $photo->id)
<button type="button"
wire:click="setFeaturedPhoto({{ $photo->id }})"
class="inline-flex items-center p-1 border border-transparent rounded-md shadow-sm text-white bg-primary-600 hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 3l14 9-14 9V3z"/>
</svg>
</button>
@endif
{{-- Delete --}}
<button type="button"
wire:click="deletePhoto({{ $photo->id }})"
wire:confirm="Are you sure you want to delete this photo?"
class="inline-flex items-center p-1 border border-transparent rounded-md shadow-sm text-white bg-red-600 hover:bg-red-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-red-500">
<svg class="h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16"/>
</svg>
</button>
</div>
{{-- Featured Badge --}}
@if($ride->featured_photo_id === $photo->id)
<div class="absolute top-2 left-2">
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-primary-100 text-primary-800">
Featured
</span>
</div>
@endif
</div>
@endforeach
</div>
{{-- Pagination --}}
<div class="mt-4">
{{ $photos->links() }}
</div>
@else
<div class="text-center py-12">
<p class="text-gray-500 dark:text-gray-400">No photos uploaded yet.</p>
</div>
@endif
</div>

View File

@@ -0,0 +1,127 @@
<div class="space-y-4">
{{-- Control Panel --}}
<div class="bg-white dark:bg-gray-800 shadow sm:rounded-lg p-4">
<div class="grid grid-cols-1 md:grid-cols-3 gap-4">
{{-- Search --}}
<div>
<label for="search" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Search</label>
<input type="search"
id="search"
wire:model.live="search"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white sm:text-sm"
placeholder="Search rides...">
</div>
{{-- Category Filter --}}
<div>
<label for="category" class="block text-sm font-medium text-gray-700 dark:text-gray-300">Category</label>
<select id="category"
wire:model.live="category"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-500 focus:ring-primary-500 dark:bg-gray-700 dark:border-gray-600 dark:text-white sm:text-sm">
<option value="">All Categories</option>
@foreach($this->categories as $value => $label)
<option value="{{ $value }}">{{ $label }}</option>
@endforeach
</select>
</div>
{{-- View Toggle --}}
<div class="flex items-end justify-end">
<button type="button"
wire:click="toggleView"
class="inline-flex items-center px-4 py-2 border border-gray-300 shadow-sm text-sm font-medium rounded-md text-gray-700 bg-white hover:bg-gray-50 dark:bg-gray-700 dark:border-gray-600 dark:text-white dark:hover:bg-gray-600">
<span>{{ $viewMode === 'grid' ? 'Switch to List' : 'Switch to Grid' }}</span>
</button>
</div>
</div>
</div>
{{-- Rides List/Grid --}}
<div>
@if($viewMode === 'grid')
{{-- Grid View --}}
<div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3">
@foreach($rides as $ride)
<div class="bg-white dark:bg-gray-800 shadow overflow-hidden sm:rounded-lg">
<div class="px-4 py-5 sm:p-6">
<div class="flex justify-between items-start">
<h3 class="text-lg leading-6 font-medium text-gray-900 dark:text-white">
<a href="{{ route('rides.show', $ride) }}" class="hover:text-primary-600 dark:hover:text-primary-400">
{{ $ride->name }}
</a>
</h3>
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-{{ $ride->status === 'OPERATING' ? 'green' : 'red' }}-100 text-{{ $ride->status === 'OPERATING' ? 'green' : 'red' }}-800">
{{ $ride->status->label() }}
</span>
</div>
<div class="mt-2">
<p class="text-sm text-gray-500 dark:text-gray-400">
{{ $ride->park->name }}
</p>
@if($ride->parkArea)
<p class="text-sm text-gray-500 dark:text-gray-400">
{{ $ride->parkArea->name }}
</p>
@endif
</div>
<div class="mt-3 flex justify-between items-center">
<span class="inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
{{ $ride->category->label() }}
</span>
@if($ride->average_rating)
<span class="inline-flex items-center text-sm text-yellow-500">
<svg class="h-5 w-5 mr-1" fill="currentColor" viewBox="0 0 20 20">
<path d="M9.049 2.927c.3-.921 1.603-.921 1.902 0l1.07 3.292a1 1 0 00.95.69h3.462c.969 0 1.371 1.24.588 1.81l-2.8 2.034a1 1 0 00-.364 1.118l1.07 3.292c.3.921-.755 1.688-1.54 1.118l-2.8-2.034a1 1 0 00-1.175 0l-2.8 2.034c-.784.57-1.838-.197-1.539-1.118l1.07-3.292a1 1 0 00-.364-1.118L2.98 8.72c-.783-.57-.38-1.81.588-1.81h3.461a1 1 0 00.951-.69l1.07-3.292z"/>
</svg>
{{ number_format($ride->average_rating, 1) }}
</span>
@endif
</div>
</div>
</div>
@endforeach
</div>
@else
{{-- List View --}}
<div class="bg-white dark:bg-gray-800 shadow overflow-hidden sm:rounded-lg">
<ul class="divide-y divide-gray-200 dark:divide-gray-700">
@foreach($rides as $ride)
<li class="px-4 py-4 sm:px-6 hover:bg-gray-50 dark:hover:bg-gray-700">
<div class="flex items-center justify-between">
<div class="flex-1 min-w-0">
<h3 class="text-sm font-medium text-gray-900 dark:text-white truncate">
<a href="{{ route('rides.show', $ride) }}" class="hover:text-primary-600 dark:hover:text-primary-400">
{{ $ride->name }}
</a>
</h3>
<div class="mt-2 flex">
<div class="flex items-center text-sm text-gray-500 dark:text-gray-400">
{{ $ride->park->name }}
@if($ride->parkArea)
<span class="px-2"></span>
{{ $ride->parkArea->name }}
@endif
</div>
</div>
</div>
<div class="flex flex-col items-end">
<span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full bg-{{ $ride->status === 'OPERATING' ? 'green' : 'red' }}-100 text-{{ $ride->status === 'OPERATING' ? 'green' : 'red' }}-800">
{{ $ride->status->label() }}
</span>
<span class="mt-2 inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800">
{{ $ride->category->label() }}
</span>
</div>
</div>
</li>
@endforeach
</ul>
</div>
@endif
</div>
{{-- Pagination --}}
<div class="mt-4">
{{ $rides->links() }}
</div>
</div>