Track Invoice Page
Bismillah...
unknown
php_laravel_blade
4 years ago
15 kB
9
Indexable
<div>
<div class="grid grid-cols-1 lg:grid-cols-3 gap-7 items-center justify-center px-7 py-10 rounded-2xl mb-10" style="background-color: rgba(115,103,240,.12)!important">
<div class="col-span-full lg:col-span-1 flex items-center justify-center">
<script src="https://unpkg.com/@lottiefiles/lottie-player@latest/dist/lottie-player.js"></script>
<lottie-player class="w-48 h-48" src="https://assets1.lottiefiles.com/packages/lf20_n2m0isqh.json" background="transparent" speed="1" loop autoplay></lottie-player>
</div>
<div class="col-span-full lg:col-span-2 pr-0 lg:pr-40">
<p class="text-theme-purple text-2xl font-medium mb-2">
Tracking Your Request
</p>
<p class="text-gray-500 mb-5">
Please use your unique number that we sent to you via email
</p>
<div class="relative mb-3">
<div class="absolute flex items-center h-full left-4">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 text-gray-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" />
</svg>
</div>
<input type="text" name="unique_number" class="w-full pl-10 pr-8 py-2 text-sm text-gray-600 placeholder-gray-400 border bg-white border-gray-300 focus:border-theme-purple outline-none focus:outline-none focus:ring-0 focus:ring-theme-purple rounded-lg" wire:model.defer="unique_number" placeholder="Unique number">
</div>
<x-jet-button class="ml-2 bg-theme-purple hover:bg-theme-purple hover:shadow-purple-2 text-white focus:outline-none" wire:click="$emitSelf('tracking')" wire:loading.attr="disabled">
Tracking
</x-jet-button>
</div>
</div>
@if($showingResult)
<div>
<p class="font-medium text-gray-700 text-2xl mb-4">Hasil Pencarian</p>
<div class="grid grid-cols-4 gap-7 items-start mb-16">
<div class="py-5 col-span-full lg:col-span-3 rounded-2xl bg-white shadow-white overflow-hidden">
<div class="px-5 md:px-9 grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-7">
<div class="flex flex-col">
<div class="h-16">
<div class="flex items-center gap-3">
<div class="text-4xl text-gray-700 font-extrabold text-center">
Go<span class="text-yellow-400">Fit</span>
</div>
</div>
</div>
<div class="flex flex-col">
@php
$companyProfile = \App\Models\CompanyProfile::first();
@endphp
<p class="text-gray-700 text-base font-semibold">{{ $companyProfile->name }}</p>
<p class="text-gray-700 text-sm w-full lg:w-3/4">{{ $companyProfile->address }}</p>
<p class="text-gray-700 text-sm">
{{ $companyProfile->phone.($companyProfile->phone && $companyProfile->email != null ? ', ' : '') }}
{{ $companyProfile->email }}
</p>
<p class="text-gray-700 text-sm">{{ $companyProfile->website }}</p>
</div>
</div>
<div class="flex flex-col">
<div class="h-10 md:h-16 font-semibold text-xl text-left md:text-right text-theme-gray-300">
{{ $invoice->invoice_number }}
</div>
<div class="flex text-sm text-gray-700 mb-0.5 justify-start md:justify-end">
<div style="min-width: 8rem!important">Date Issued :</div>
<div class="w-36 font-semibold text-left md:text-right">{{ $invoice->updated_at->format('d M Y') ?? '-' }}</div>
</div>
<div class="flex text-sm text-gray-700 justify-start md:justify-end">
<div style="min-width: 8rem!important">Payment Terms :</div>
<div class="w-36 font-semibold text-left md:text-right">Due Upon Invoice</div>
</div>
</div>
</div>
<hr class="my-10">
<div class="px-5 md:px-9 grid grid-cols-1 md:grid-cols-2 gap-7 mb-10">
<div class="border border-theme-gray-300 rounded-2xl overflow-hidden">
<div class="px-5 py-2 text-theme-gray-100 text-sm font-semibold bg-theme-gray-300 uppercase">
Agency
</div>
<div class="px-5 py-3">
<p class="text-gray-700 text-sm font-semibold mb-2">{{ $invoice->agency->ea_name }}</p>
<p class="text-gray-700 text-sm">{{ $invoice->agency->key_contact_person }}</p>
<p class="text-gray-700 text-sm">{{ $invoice->agency->address }}</p>
<p class="text-gray-700 text-sm">{{ ($invoice->agency->office_phone != null ? $invoice->agency->office_phone.', ' : '').$invoice->agency->mobile_phone }}</p>
</div>
</div>
<div class="border border-theme-gray-300 rounded-2xl overflow-hidden">
<div class="px-5 py-2 text-theme-gray-100 text-sm font-semibold bg-theme-gray-300 uppercase">
Payment Details
</div>
<div class="px-5 py-3 grid grid-cols-3 gap-7 items-start">
<div class="col-span-2">
<p class="text-gray-700 text-sm">Paynow To UEN :</p>
<p class="text-gray-700 text-sm font-semibold mb-2">{{ $companyProfile->uen ?? '-' }}</p>
<p class="text-gray-700 text-sm">Paynow Amount in SGD :</p>
<p class="text-gray-700 text-sm font-semibold mb-2">{{ $invoice->room_occupancy == 'Single' ? '$ 1050' : '$ 750' }}</p>
<p class="text-gray-700 text-sm">Paynow Bill Reference :</p>
<p class="text-gray-700 text-sm font-semibold mb-2">{{ $invoice->invoice_number }}</p>
</div>
<div class="w-full flex flex-col items-end">
<div class="w-28 flex justify-center mb-2">
<img src="{{ asset('img/logo/paynow-logo.png') }}" class="w-16">
</div>
<div class="w-28">
<img src="{{ asset('img/logo/paynow-qrcode.jpeg') }}">
</div>
</div>
</div>
</div>
</div>
<div class="px-5 md:px-9 overflow-hidden">
<div class="overflow-x-auto mb-5 rounded-2xl">
<table class="w-full border border-theme-gray-300" style="border-collapse: collapse">
<thead class="text-sm uppercase text-theme-gray-100" style="background-color: #283046">
<th class="px-5 md:px-9 py-2 font-semibold text-left border-r border-theme-gray-200" style="min-width: 14rem!important">Item</th>
<th class="px-5 md:px-9 py-2 font-semibold border-r border-theme-gray-200" style="width: 7rem!important; min-width: 4rem!important">QTY</th>
<th class="px-5 md:px-9 py-2 font-semibold border-r border-theme-gray-200" style="width: 11rem!important; min-width: 8rem!important">UNIT PRICE <br> $ (SGD)</th>
<th class="px-5 md:px-9 py-2 font-semibold" style="width: 11rem!important; min-width: 8rem!important">AMOUNT <br> $ (SGD)</th>
</thead>
<tbody>
<tr>
<td class="px-5 md:px-9 py-3 text-sm text-gray-700 border-r border-theme-gray-300">
<p class="font-semibold mb-2 uppercase">{{ $invoice->room_occupancy }} Occupancy</p>
<p class="font-semibold mb-0.5">The price are including :</p>
<table class="mb-4">
<tr>
<td class="w-3">*</td>
<td class="uppercase">SHN - 10 Nights</td>
</tr>
<tr>
<td class="w-3 align-top">*</td>
<td class="align-top">
3 Meals Provided <br> Breakfast Bread / Cup Noodle / Cake / Biscuit / Coffee / Tea
</td>
</tr>
<tr>
<td class="w-3">*</td>
<td class="uppercase">Airport Pickup</td>
</tr>
<tr>
<td class="w-3">*</td>
<td class="uppercase">ART Test Kits x2</td>
</tr>
<tr>
<td class="w-3">*</td>
<td class="uppercase">Transport Exit PCR (2-Way)</td>
</tr>
<tr>
<td class="w-3">*</td>
<td class="uppercase">Free Sim Card</td>
</tr>
<tr>
<td class="w-3">*</td>
<td class="uppercase">Termometer</td>
</tr>
</table>
<p><span class="font-semibold">Hotel :</span> {{ optional($invoice->hotel)->name ?? '-' }}</p>
<p class="mb-4">{{ optional($invoice->hotel)->address ?? '-' }}</p>
<p><span class="font-semibold">For MDW :</span> {{ $invoice->mdw_name }}</p>
</td>
@php
$price = ($invoice->room_occupancy == 'Single' ? 1050 : 750);
$qty = 1;
$totalPrice = $price * $qty;
$grandTotal = $totalPrice;
@endphp
<td class="px-5 md:px-9 py-3 text-sm text-gray-700 text-center align-text-top border-r border-theme-gray-300">{{ $qty }}</td>
<td class="px-5 md:px-9 py-3 text-sm text-gray-700 text-center align-text-top border-r border-theme-gray-300">{{ $price }}</td>
<td class="px-5 md:px-9 py-3 text-sm text-gray-700 text-center align-text-top">{{ $totalPrice }}</td>
</tr>
</tbody>
<tfoot>
<tr style="background-color: #283046">
<td colspan="3" class="px-5 md:px-9 py-3 text-sm text-theme-gray-100 font-bold text-right">
<p>GRAND TOTAL $ (SGD) :</p>
</td>
<td class="px-5 md:px-9 py-3 text-sm text-theme-gray-100 text-center font-bold">
<p>{{ $grandTotal }}</p>
</td>
</tr>
</tfoot>
</table>
</div>
</div>
<div class="px-5 md:px-9 text-sm text-gray-700">
<span class="font-semibold text-red-500">Important Note : </span>Cancellation before 48 hour refund 70%, within 48 hour refund 30%. Change name admin fee $100
</div>
</div>
<div class="px-5 py-5 col-span-full lg:col-span-1 rounded-2xl bg-white shadow-white">
<x-button-href href="{{ route('guest.invoices.download', $invoice->id) }}" class="flex items-center justify-center px-4 py-2 bg-theme-purple hover:shadow-purple-2 gap-1 w-full mb-3">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4" />
</svg> DOWNLOAD PDF
</x-button-href>
<x-button-href href="{{ route('guest.invoices.print', $invoice->id) }}" class="flex items-center justify-center px-4 py-2 bg-green-500 hover:shadow-purple-2 gap-1 w-full">
<svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 17h2a2 2 0 002-2v-4a2 2 0 00-2-2H5a2 2 0 00-2 2v4a2 2 0 002 2h2m2 4h6a2 2 0 002-2v-4a2 2 0 00-2-2H9a2 2 0 00-2 2v4a2 2 0 002 2zm8-12V5a2 2 0 00-2-2H9a2 2 0 00-2 2v4h10z" />
</svg> PRINT PDF
</x-button-href>
</div>
</div>
</div>
@endif
</div>
Editor is loading...