91 lines
4.2 KiB
PHP
91 lines
4.2 KiB
PHP
<flux:main>
|
|
<flux:heading size="xl" level="1">{{ $pageTitle }}</flux:heading>
|
|
<flux:text class="mb-6 mt-2 text-base">{{ $pageDescription }}</flux:text>
|
|
|
|
@if (empty($myVouchers))
|
|
<flux:card class="text-center py-12">
|
|
<div class="flex flex-col items-center justify-center">
|
|
<flux:icon.ticket variant="outline" class="size-16 text-zinc-400 mb-4" />
|
|
<flux:heading size="lg" class="mb-2">Belum Ada Voucher</flux:heading>
|
|
<flux:text class="text-zinc-500 mb-6">
|
|
Anda belum memiliki voucher. Klaim voucher di halaman utama untuk mendapatkan diskon menarik!
|
|
</flux:text>
|
|
<flux:button href="{{ route('homepage') }}" wire:navigate>
|
|
Klaim Voucher Sekarang
|
|
</flux:button>
|
|
</div>
|
|
</flux:card>
|
|
@else
|
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
|
|
@foreach ($myVouchers as $voucher)
|
|
<flux:card class="relative overflow-hidden">
|
|
{{-- Badge Status --}}
|
|
<div class="absolute top-4 right-4">
|
|
@if ($voucher['status'] === 'active')
|
|
<flux:badge color="emerald" size="sm">Aktif</flux:badge>
|
|
@elseif ($voucher['status'] === 'expired')
|
|
<flux:badge color="red" size="sm">Kadaluarsa</flux:badge>
|
|
@elseif ($voucher['status'] === 'upcoming')
|
|
<flux:badge color="blue" size="sm">Segera</flux:badge>
|
|
@endif
|
|
</div>
|
|
|
|
{{-- Voucher Content --}}
|
|
<div class="mb-4">
|
|
<flux:heading size="lg" class="mb-2">{{ $voucher['name'] }}</flux:heading>
|
|
|
|
{{-- Voucher Code --}}
|
|
<div class="flex items-center gap-2 mb-3">
|
|
<flux:badge color="zinc" size="lg" class="font-mono text-lg">
|
|
{{ $voucher['code'] }}
|
|
</flux:badge>
|
|
@if ($voucher['quantity'] > 1)
|
|
<flux:badge color="blue" size="sm">
|
|
{{ $voucher['quantity'] }}x
|
|
</flux:badge>
|
|
@endif
|
|
</div>
|
|
|
|
{{-- Summary --}}
|
|
<flux:text class="text-sm mb-3">
|
|
{{ $voucher['summary'] }}
|
|
</flux:text>
|
|
|
|
{{-- Discount Info --}}
|
|
<div class="flex items-center gap-2 mb-2">
|
|
<flux:icon.tag class="size-4 text-emerald-600" />
|
|
<flux:text class="text-sm font-semibold text-emerald-600">
|
|
{{ $voucher['discount_display'] }}
|
|
</flux:text>
|
|
</div>
|
|
|
|
{{-- Min Purchase --}}
|
|
@if ($voucher['min_purchase_display'])
|
|
<div class="flex items-center gap-2 mb-2">
|
|
<flux:icon.shopping-cart class="size-4" />
|
|
<flux:text class="text-sm">
|
|
{{ $voucher['min_purchase_display'] }}
|
|
</flux:text>
|
|
</div>
|
|
@endif
|
|
|
|
{{-- Valid Period --}}
|
|
<div class="flex items-center gap-2">
|
|
<flux:icon.calendar class="size-4" />
|
|
<flux:text class="text-sm">
|
|
{{ $voucher['date_display'] }}
|
|
</flux:text>
|
|
</div>
|
|
</div>
|
|
|
|
{{-- Claimed Date --}}
|
|
<flux:separator class="my-4" />
|
|
<flux:text class="text-xs">
|
|
Diklaim pada: {{ $voucher['claimed_at_display'] }}
|
|
</flux:text>
|
|
</flux:card>
|
|
@endforeach
|
|
</div>
|
|
@endif
|
|
</flux:main>
|