parfum/resources/views/livewire/studio/loyalty/redemption.blade.php

115 lines
6.1 KiB
PHP

<flux:main>
<div class="flex justify-between items-center">
<div>
<flux:heading size="xl">{{ $pageTitle }}</flux:heading>
</div>
</div>
<div class="mt-6">
<flux:card>
<div class="flex gap-4">
<flux:input label="Masukkan Kode Penukaran" placeholder="Contoh: RD-ABC12345" wire:model="searchCode"
autofocus autocomplete="off" wire:keydown.enter="search" class="flex-1" />
<div class="flex items-end">
<flux:button wire:click="search" variant="primary">Cari</flux:button>
</div>
</div>
</flux:card>
@if ($foundRedemption)
<flux:card class="mt-6">
<div class="space-y-6">
<div class="flex justify-between items-start">
<div>
<flux:heading size="lg">Detail Penukaran</flux:heading>
<flux:subheading>Informasi lengkap terkait kode <span
class="font-bold uppercase">{{ $foundRedemption->code }}</span></flux:subheading>
</div>
<flux:badge color="{{ $foundRedemption->status->color() }}" variant="solid" size="lg">
{{ $foundRedemption->status->label() }}
</flux:badge>
</div>
<div class="grid grid-cols-2 gap-4">
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">Member
</div>
<div class="flex items-center gap-3">
<flux:avatar :name="$foundRedemption?->user?->customer?->name" size="sm" />
<div>
<div class="text-sm font-medium">{{ $foundRedemption?->user?->customer?->name }}
</div>
<div class="text-xs text-zinc-500">{{ $foundRedemption?->user?->customer?->email }}
</div>
</div>
</div>
</div>
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">Hadiah</div>
<div class="text-sm font-medium text-primary-600">{{ $foundRedemption->reward->name }}</div>
<div class="text-xs text-zinc-500">{{ $foundRedemption->points_spent }} Poin</div>
</div>
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">Waktu
Penukaran</div>
<div class="text-sm">{{ formatDateLocalized($foundRedemption->created_at, 'l, d M Y H:i') }}
</div>
</div>
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">Batas Waktu
</div>
<div class="text-sm {{ $foundRedemption->isExpired() ? 'text-red-500 font-bold' : '' }}">
{{ formatDateLocalized($foundRedemption->expires_at, 'l, d M Y H:i') }}
@if ($foundRedemption->isExpired())
(Kadaluarsa)
@endif
</div>
</div>
</div>
@if ($foundRedemption->status === \App\Enums\RedemptionStatus::VERIFIED)
<div
class="p-4 bg-zinc-50 dark:bg-zinc-800/50 rounded-lg border border-zinc-200 dark:border-zinc-700">
<div class="grid grid-cols-2 gap-4">
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">
Diverifikasi Oleh</div>
<div class="text-sm">{{ $foundRedemption->verifier?->employee?->full_name ?? 'Sistem' }}</div>
</div>
<div>
<div class="text-xs font-semibold text-zinc-500 uppercase tracking-wider mb-1">Waktu
Verifikasi</div>
<div class="text-sm">
{{ formatDateLocalized($foundRedemption->verified_at, 'l, d M Y H:i') ?? '-' }}
</div>
</div>
</div>
</div>
@endif
@if ($foundRedemption->status === \App\Enums\RedemptionStatus::WAITING_PICKUP && !$foundRedemption->isExpired())
<div class="pt-4 border-t border-zinc-100 dark:border-zinc-800">
<flux:modal.trigger name="verify-confirmation">
<flux:button
wire:click="$dispatch('fn:confirmAction', { id: '{{ $foundRedemption->id }}', target: 'verify' })"
variant="primary" icon="check-badge">
Verifikasi Sekarang
</flux:button>
</flux:modal.trigger>
</div>
@endif
</div>
</flux:card>
@endif
</div>
@include('components.modals.confirmation', [
'modalName' => 'verify-confirmation',
'modalTitle' => 'Verifikasi Penukaran?',
'modalMessage' => 'Apakah Anda yakin ingin memverifikasi penukaran hadiah ini?',
'buttonVariant' => 'primary',
'buttonColor' => 'zinc',
'buttonText' => 'Ya, Verifikasi',
])
</flux:main>