59 lines
2.7 KiB
PHP
59 lines
2.7 KiB
PHP
<x-wireui:modal id="room-grid-modal" wire:model.defer="showModal" persistent>
|
|
<x-wireui:card class="border border-gray-200 w-full">
|
|
<x-slot name="action">
|
|
<button class="cursor-pointer p-1 rounded-full text-secondary-300 focus:ring-2 focus:ring-secondary-200" wire:click="closeModal">
|
|
<x-dynamic-component :component="WireUi::component('icon')" name="x-mark" class="w-5 h-5"/>
|
|
</button>
|
|
</x-slot>
|
|
<x-slot name="title">{{ $branchName }} - 包廂設定</x-slot>
|
|
|
|
<div x-data="{ floor: '{{ $floors[0] ?? 1 }}', type: 'all' }">
|
|
{{-- 樓層 Tab --}}
|
|
<div class="flex gap-2 mb-2">
|
|
@foreach($floors as $fl)
|
|
<button
|
|
class="px-3 py-1 rounded border"
|
|
:class="floor === '{{ $fl }}' ? 'bg-blue-500 text-white' : 'bg-white text-gray-700'"
|
|
x-on:click="floor = '{{ $fl }}'"
|
|
>
|
|
{{ $fl }}F
|
|
</button>
|
|
@endforeach
|
|
</div>
|
|
|
|
{{-- 類別 Tab --}}
|
|
<div class="flex gap-2 mb-4">
|
|
@foreach(['all' => '全部', 'pc' => 'PC', 'svr' => 'SVR'] as $value => $label)
|
|
<button
|
|
class="px-3 py-1 rounded border"
|
|
:class="type === '{{ $value }}' ? 'bg-green-500 text-white' : 'bg-white text-gray-700'"
|
|
x-on:click="type = '{{ $value }}'"
|
|
>
|
|
{{ $label }}
|
|
</button>
|
|
@endforeach
|
|
</div>
|
|
|
|
{{-- 房間卡片列表 --}}
|
|
<div @if($showModal) wire:poll.5s @endif>
|
|
<div class="grid grid-cols-3 md:grid-cols-4 lg:grid-cols-6 gap-4">
|
|
@forelse($rooms as $room)
|
|
<template x-if="floor == '{{ $room->floor }}' && (type == 'all' || type == '{{ $room->type }}')">
|
|
<div>
|
|
@if($room->type->value === \App\Enums\RoomType::SVR->value)
|
|
<x-room-card-svr :room="$room" />
|
|
@else
|
|
<x-room-card :room="$room" />
|
|
@endif
|
|
</div>
|
|
</template>
|
|
@empty
|
|
<div class="col-span-full text-center text-gray-500">尚無包廂資料</div>
|
|
@endforelse
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<livewire:admin.room-detail-modal />
|
|
</x-wireui:card>
|
|
</x-wireui:modal> |