Add all files
This commit is contained in:
root
89
themes/lucentui/views/invoices/index.blade.php
Normal file
89
themes/lucentui/views/invoices/index.blade.php
Normal file
@@ -0,0 +1,89 @@
|
||||
<div class="container mx-auto px-4 py-8 sm:px-6 lg:px-8">
|
||||
|
||||
<h1 class="text-3xl lg:text-4xl font-extrabold text-color-base mt-4 mb-8">
|
||||
{{ __('navigation.invoices') }}
|
||||
</h1>
|
||||
|
||||
<div class="grid grid-cols-3 md:grid-cols-3 gap-4 mb-12 bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 border border-neutral/50 p-2 rounded-xl">
|
||||
<div class="bg-success/10 border border-success/50 rounded-xl p-4 text-center">
|
||||
<div class="flex items-center justify-center mb-2">
|
||||
<x-ri-checkbox-circle-fill class="size-6 text-success mr-2" />
|
||||
<span class="text-2xl font-bold text-success">{{ $invoices->where('status', 'paid')->count() }}</span>
|
||||
</div>
|
||||
<p class="text-sm font-medium text-success">{{ __('Paid') }}</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-warning/10 border border-warning/50 rounded-xl p-4 text-center">
|
||||
<div class="flex items-center justify-center mb-2">
|
||||
<x-ri-error-warning-fill class="size-6 text-warning mr-2" />
|
||||
<span class="text-2xl font-bold text-warning">{{ $invoices->where('status', 'pending')->count() }}</span>
|
||||
</div>
|
||||
<p class="text-sm font-medium text-warning">{{ __('Pending') }}</p>
|
||||
</div>
|
||||
|
||||
<div class="bg-inactive/10 border border-inactive/50 rounded-xl p-4 text-center">
|
||||
<div class="flex items-center justify-center mb-2">
|
||||
<x-ri-close-circle-fill class="size-6 text-inactive mr-2" />
|
||||
<span class="text-2xl font-bold text-inactive">{{ $invoices->where('status', 'cancelled')->count() }}</span>
|
||||
</div>
|
||||
<p class="text-sm font-medium text-inactive">{{ __('Cancelled') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 gap-3 md:gap-5">
|
||||
@forelse ($invoices as $invoice)
|
||||
<a href="{{ route('invoices.show', $invoice) }}" wire:navigate class="block">
|
||||
<div class="bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 hover:bg-secondary/25 border border-neutral/50 p-6 rounded-xl shadow-lg
|
||||
transition-all duration-300 hover:scale-[1.01] hover:shadow-xl hover:border-primary/50
|
||||
flex flex-col md:flex-row items-start md:items-center justify-between gap-4">
|
||||
|
||||
<div class="flex items-start md:items-center gap-4 flex-grow">
|
||||
<div class="bg-blue-500/10 p-3 rounded-full flex-shrink-0 shadow-sm">
|
||||
<x-ri-bill-line class="size-6 text-blue-500" />
|
||||
</div>
|
||||
<div class="flex flex-col">
|
||||
<span class="text-xl font-bold text-color-base leading-tight">{{ __('Invoice') }} #{{ $invoice->number }}</span>
|
||||
<p class="text-color-muted text-sm mt-1">
|
||||
{{ __('Total') }}: <span class="font-bold text-primary">{{ $invoice->formattedTotal }}</span>
|
||||
<span class="mx-2 text-color-muted/50">•</span>
|
||||
{{ __('invoices.invoice_date') }}: {{ $invoice->created_at->format('d M Y') }}
|
||||
</p>
|
||||
@if($invoice->due_date)
|
||||
<p class="text-color-muted text-xs mt-1">
|
||||
{{ __('Jatuh Tempo') }}: {{ $invoice->due_date->format('d M Y') }}
|
||||
</p>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex items-center gap-3 flex-shrink-0 mt-3 md:mt-0">
|
||||
<div class="text-sm font-semibold px-3 py-1 rounded-full flex items-center gap-1.5
|
||||
@if ($invoice->status == 'paid') text-success bg-success/20
|
||||
@elseif($invoice->status == 'cancelled') text-inactive bg-inactive/20
|
||||
@else text-warning bg-warning/20
|
||||
@endif">
|
||||
@if ($invoice->status == 'paid')
|
||||
<x-ri-checkbox-circle-fill class="size-4" />
|
||||
{{ __('Paid') }}
|
||||
@elseif($invoice->status == 'cancelled')
|
||||
<x-ri-close-circle-fill class="size-4" />
|
||||
{{ __('Cancelled') }}
|
||||
@elseif($invoice->status == 'pending')
|
||||
<x-ri-error-warning-fill class="size-4" />
|
||||
{{ __('Pending') }}
|
||||
@endif
|
||||
</div>
|
||||
<x-ri-arrow-right-s-line class="size-6 text-color-muted group-hover:text-primary transition-colors duration-200" />
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@empty
|
||||
<div class="bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 rounded-xl shadow-lg p-6 lg:p-8 border border-neutral/50 text-center">
|
||||
<x-ri-file-info-line class="size-16 text-color-muted mx-auto mb-4 opacity-60" />
|
||||
<h3 class="text-xl font-bold text-color-base mb-2">No invoices yet.</h3>
|
||||
</div>
|
||||
@endforelse
|
||||
|
||||
{{ $invoices->links() }}
|
||||
</div>
|
||||
</div>
|
||||
318
themes/lucentui/views/invoices/show.blade.php
Normal file
318
themes/lucentui/views/invoices/show.blade.php
Normal file
@@ -0,0 +1,318 @@
|
||||
<div class="container mx-auto px-4 py-8 sm:px-6 lg:px-8">
|
||||
|
||||
<div @if ($checkPayment) wire:poll="checkPaymentStatus" @endif>
|
||||
@if ($this->pay)
|
||||
<x-modal title="{{ __('invoices.payment_pending') }} #{{ $invoice->number }}" open>
|
||||
<div class="mt-8">
|
||||
{{ $this->pay }}
|
||||
</div>
|
||||
<x-slot name="closeTrigger">
|
||||
<div class="flex items-center gap-4">
|
||||
<span class="text-color-muted text-lg">{{ __('invoices.amount') }}: <span class="font-bold text-color-base">{{ $invoice->formattedRemaining }}</span></span>
|
||||
<button wire:confirm="{{ __('Are you sure you want to exit payment?') }}" wire:click="exitPay" @click="open = false"
|
||||
class="text-color-muted hover:text-color-base transition-colors duration-200 p-2 rounded-full">
|
||||
<x-ri-close-fill class="size-6" />
|
||||
</button>
|
||||
</div>
|
||||
</x-slot>
|
||||
</x-modal>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="relative overflow-hidden bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 border border-neutral/30 rounded-xl shadow-2xl backdrop-blur-sm mt-4 mb-8">
|
||||
|
||||
<div class="absolute top-0 right-0 w-96 h-96 bg-gradient-to-bl from-primary/10 via-primary/5 to-transparent rounded-full blur-3xl opacity-60"></div>
|
||||
<div class="absolute -bottom-24 -left-24 w-72 h-72 bg-gradient-to-tr from-primary/8 via-primary/4 to-transparent rounded-full blur-2xl opacity-40"></div>
|
||||
|
||||
<div class="relative z-10 p-8 lg:p-12">
|
||||
|
||||
<div class="flex flex-col lg:flex-row justify-between items-start lg:items-center mb-12">
|
||||
<div class="mb-6 lg:mb-0">
|
||||
<h1 class="text-4xl lg:text-4xl font-black text-color-base leading-tight mb-2 bg-gradient-to-r from-color-base via-color-base to-primary bg-clip-text">
|
||||
{{ __('invoices.invoice', ['id' => $invoice->number]) }}
|
||||
</h1>
|
||||
<div class="w-24 h-1 bg-gradient-to-r from-primary to-primary/60 rounded-full"></div>
|
||||
</div>
|
||||
<div class="flex items-center gap-4">
|
||||
@if ($invoice->status == 'paid')
|
||||
<div class="flex items-center gap-3 px-6 py-3 bg-gradient-to-r from-success/20 to-success/10 border border-success/30 rounded-2xl backdrop-blur-sm">
|
||||
<x-ri-checkbox-circle-fill class="size-6 text-success" />
|
||||
<span class="text-success font-bold text-lg">{{ __('invoices.paid') }}</span>
|
||||
</div>
|
||||
@elseif ($invoice->status == 'pending')
|
||||
<div class="flex items-center gap-3 px-6 py-3 bg-gradient-to-r from-warning/20 to-warning/10 border border-warning/30 rounded-2xl backdrop-blur-sm">
|
||||
<x-ri-error-warning-fill class="size-6 text-warning" />
|
||||
<span class="text-warning font-bold text-lg">{{ __('invoices.payment_pending') }}</span>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<!--<button wire:click="downloadPDF" class="group flex items-center gap-2 px-6 py-3 bg-gradient-to-r from-primary to-primary/80 text-white font-semibold rounded-2xl transition-all duration-300 transform hover:scale-105 hover:shadow-xl">
|
||||
<x-ri-download-line class="size-5 transition-transform group-hover:scale-110" />
|
||||
<span>Download</span>
|
||||
</button>-->
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 xl:grid-cols-3 gap-8 mb-12">
|
||||
|
||||
<div class="bg-gradient-to-br from-background/80 to-background/60 border border-neutral/20 rounded-2xl p-6 backdrop-blur-sm hover:shadow-lg transition-all duration-300">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<x-ri-user-line class="size-6 text-primary" />
|
||||
<h3 class="uppercase font-black text-color-base text-sm tracking-wider">{{ __('invoices.issued_to') }}</h3>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<p class="text-color-base text-xl font-bold mb-2">{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'Company Name (Include Registration Number)')
|
||||
->first()?->value }}</p>
|
||||
<p class="text-color-base text-m font-bold mb-2">Attention: {{ Auth::user()->first_name }} {{ Auth::user()->last_name }}</p>
|
||||
<p class="text-color-muted text-sm leading-relaxed">{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'Property Number/House Name')
|
||||
->first()?->value }} {{ $invoice->user->properties
|
||||
->where('parent_property.name', 'Street Name')
|
||||
->first()?->value }}</p>
|
||||
<p class="text-color-muted text-sm">{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'City')
|
||||
->first()?->value }}
|
||||
{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'State/Province/Region')
|
||||
->first()?->value }}
|
||||
{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'Full Postal Code')
|
||||
->first()?->value }}</p>
|
||||
<p class="text-color-muted text-sm">{{ $invoice->user->properties
|
||||
->where('parent_property.name', 'Country')
|
||||
->first()?->value }}</p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-background/80 to-background/60 border border-neutral/20 rounded-2xl p-6 backdrop-blur-sm hover:shadow-lg transition-all duration-300">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<x-ri-building-line class="size-6 text-primary" />
|
||||
<h3 class="uppercase font-black text-color-base text-sm tracking-wider">{{ __('invoices.bill_to') }}</h3>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
<p class="text-color-base text-xl font-bold mb-2">{{ config('settings.company_name') }}</p>
|
||||
<p class="text-color-muted text-sm leading-relaxed">{{ config('settings.company_address') }} {{ config('settings.company_address2') }}</p>
|
||||
<p class="text-color-muted text-sm">{{ config('settings.company_city') }} {{ config('settings.company_state') }} {{ config('settings.company_zip') }}</p>
|
||||
<p class="text-color-muted text-sm">{{ \Locale::getDisplayRegion('-' . config('settings.company_country')) }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="bg-gradient-to-br from-background/80 to-background/60 border border-neutral/20 rounded-2xl p-6 backdrop-blur-sm hover:shadow-lg transition-all duration-300">
|
||||
<div class="flex items-center gap-3 mb-4">
|
||||
<x-ri-file-list-3-line class="size-6 text-primary" />
|
||||
<h3 class="uppercase font-black text-color-base text-sm tracking-wider">Invoice Details</h3>
|
||||
</div>
|
||||
<div class="space-y-3">
|
||||
<div class="flex items-center justify-between py-2 px-3 bg-background/50 rounded-xl">
|
||||
<span class="text-color-muted text-sm font-medium">{{ __('invoices.invoice_date')}}</span>
|
||||
<span class="font-bold text-color-base">{{ $invoice->created_at->format('d M Y') }}</span>
|
||||
</div>
|
||||
<div class="flex items-center justify-between py-2 px-3 bg-background/50 rounded-xl">
|
||||
<span class="text-color-muted text-sm font-medium">{{ __('invoices.invoice_no')}}</span>
|
||||
<span class="font-bold text-color-base">#{{ $invoice->number }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if ($invoice->status == 'pending')
|
||||
<div class="bg-gradient-to-r from-background/60 to-background/40 border border-neutral/20 rounded-2xl p-8 mb-12 backdrop-blur-sm">
|
||||
<h3 class="text-2xl font-bold text-color-base mb-6 flex items-center gap-3">
|
||||
<x-ri-wallet-3-line class="size-6 text-primary" />
|
||||
Payment Options
|
||||
</h3>
|
||||
|
||||
<div class="grid grid-cols-1 lg:grid-cols-2 gap-6 items-end">
|
||||
<div class="space-y-4">
|
||||
@if(Auth::user()->credits()->where('currency_code', $invoice->currency_code)->exists() && Auth::user()->credits()->where('currency_code', $invoice->currency_code)->first()->amount > 0)
|
||||
@php
|
||||
$credit = Auth::user()->credits()
|
||||
->where('currency_code', $invoice->currency_code)
|
||||
->where('amount', '>', 0)
|
||||
->first();
|
||||
$itemHasCredit = $invoice->items()->where('reference_type', App\Models\Credit::class)->exists();
|
||||
@endphp
|
||||
@if($credit && !$itemHasCredit)
|
||||
<div class="p-4 bg-primary/5 border border-primary/20 rounded-xl">
|
||||
<x-form.checkbox wire:model="use_credits" name="use_credits" :label="__('product.use_credits')" />
|
||||
</div>
|
||||
@endif
|
||||
@endif
|
||||
|
||||
@if(count($gateways) > 1)
|
||||
<x-form.select wire:model.live="gateway" :label="__('product.payment_method')" class="w-full" name="gateway">
|
||||
@foreach ($gateways as $gateway)
|
||||
<option value="{{ $gateway->id }}">{{ $gateway->name }}</option>
|
||||
@endforeach
|
||||
</x-form.select>
|
||||
@endif
|
||||
</div>
|
||||
|
||||
<div class="flex flex-col gap-4">
|
||||
<div class="text-right">
|
||||
<p class="text-color-muted text-lg mb-1">Amount Due</p>
|
||||
<p class="text-3xl font-black text-primary">{{ $invoice->formattedRemaining }}</p>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<x-button.primary
|
||||
wire:click="pay"
|
||||
wire:loading.attr="disabled"
|
||||
wire:target="pay"
|
||||
class="!w-auto inline-flex py-2 px-10 text-sm font-bold rounded-lg transition-all duration-300 transform hover:scale-105"
|
||||
>
|
||||
<span wire:loading wire:target="pay" class="flex items-center justify-center gap-2">
|
||||
|
||||
Processing...
|
||||
</span>
|
||||
<span wire:loading.remove wire:target="pay">{{ __('product.checkout') }}</span>
|
||||
</x-button.primary>
|
||||
|
||||
@if ($checkPayment)
|
||||
<button wire:click="checkPaymentStatus" wire:loading.attr="disabled" wire:target="checkPaymentStatus"
|
||||
class="px-4 py-2 bg-background border border-neutral/30 hover:bg-background-secondary text-color-base rounded-lg transition-all duration-300 flex items-center gap-2">
|
||||
<x-ri-refresh-line class="size-4" wire:loading.remove wire:target="checkPaymentStatus" />
|
||||
<x-ri-loader-5-fill class="size-4 " wire:loading wire:target="checkPaymentStatus" />
|
||||
<span wire:loading.remove wire:target="checkPaymentStatus" class="font-medium">Check Status</span>
|
||||
<span wire:loading wire:target="checkPaymentStatus">{{ __('invoices.checking_payment') }}</span>
|
||||
</button>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div class="mb-12">
|
||||
<h3 class="text-2xl font-bold text-color-base mb-6 flex items-center gap-3">
|
||||
<x-ri-file-list-3-line class="size-6 text-primary" />
|
||||
Invoice Items
|
||||
</h3>
|
||||
|
||||
<div class="overflow-hidden border border-neutral/20 rounded-2xl backdrop-blur-sm">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full">
|
||||
<thead>
|
||||
<tr class="bg-gradient-to-r from-background to-background/80 border-b border-neutral/20">
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.item') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.price') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.quantity') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-right text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.total') }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-neutral/10">
|
||||
@foreach ($invoice->items as $item)
|
||||
<tr class="bg-background-secondary/40 hover:bg-background-secondary/60 transition-all duration-300 group">
|
||||
<td class="px-8 py-6">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="w-1 h-8 bg-gradient-to-b from-primary to-primary/40 rounded-full opacity-0 group-hover:opacity-100 transition-all duration-300"></div>
|
||||
@if(in_array($item->reference_type, ['App\Models\Service', 'App\Models\ServiceUpgrade']))
|
||||
<a href="{{ route('services.show', $item->reference_type == 'App\Models\Service' ? $item->reference_id : $item->reference->service_id) }}"
|
||||
class="text-color-base font-bold hover:text-primary transition-colors duration-200 hover:underline underline-offset-2">
|
||||
{{ $item->description }}
|
||||
</a>
|
||||
@else
|
||||
<span class="text-color-base font-bold">{{ $item->description }}</span>
|
||||
@endif
|
||||
</div>
|
||||
</td>
|
||||
<td class="px-8 py-6 text-color-base font-semibold">{{ $item->formattedPrice }}</td>
|
||||
<td class="px-8 py-6 text-color-base font-semibold">{{ $item->quantity }}</td>
|
||||
<td class="px-8 py-6 text-right text-color-base font-bold text-lg">{{ $item->formattedTotal }}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="flex justify-end mb-12">
|
||||
<div class="w-full sm:w-96">
|
||||
<div class="space-y-4">
|
||||
@if ($invoice->formattedTotal->tax > 0)
|
||||
<div class="flex justify-between items-center py-3 px-4 bg-background/40 rounded-xl">
|
||||
<span class="text-color-muted font-bold uppercase text-sm tracking-wider">{{ __('invoices.subtotal') }}</span>
|
||||
<span class="text-color-base font-bold text-lg">
|
||||
{{ $invoice->formattedTotal->format($invoice->formattedTotal->price - $invoice->formattedTotal->tax) }}
|
||||
</span>
|
||||
</div>
|
||||
<div class="flex justify-between items-center py-3 px-4 bg-background/40 rounded-xl">
|
||||
<span class="text-color-muted font-bold uppercase text-sm tracking-wider">
|
||||
{{ \App\Classes\Settings::tax()->name }}
|
||||
</span>
|
||||
<span class="text-color-base font-bold text-lg">
|
||||
{{ $invoice->formattedTotal->formatted->tax }}
|
||||
</span>
|
||||
</div>
|
||||
@endif
|
||||
<div class="border-t border-neutral/20 pt-4">
|
||||
<div class="flex justify-between items-center py-4 px-4 bg-gradient-to-r from-primary/10 to-primary/5 rounded-xl border border-primary/20">
|
||||
<span class="text-color-base font-black uppercase text-lg tracking-wider">{{ __('invoices.total') }}</span>
|
||||
<span class="text-primary font-black text-3xl">
|
||||
{{ $invoice->formattedTotal }}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@if ($invoice->transactions->isNotEmpty())
|
||||
<div class="mb-8">
|
||||
<h3 class="text-2xl font-bold text-color-base mb-6 flex items-center gap-3">
|
||||
<x-ri-exchange-dollar-line class="size-6 text-primary" />
|
||||
{{ __('invoices.transactions') }}
|
||||
</h3>
|
||||
|
||||
<div class="overflow-hidden border border-neutral/20 rounded-2xl backdrop-blur-sm">
|
||||
<div class="overflow-x-auto">
|
||||
<table class="min-w-full">
|
||||
<thead>
|
||||
<tr class="bg-gradient-to-r from-background to-background/80 border-b border-neutral/20">
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.date') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.transaction_id') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-left text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.gateway') }}
|
||||
</th>
|
||||
<th scope="col" class="px-8 py-6 text-right text-xs font-black text-color-base uppercase tracking-wider">
|
||||
{{ __('invoices.amount') }}
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="divide-y divide-neutral/10">
|
||||
@foreach ($invoice->transactions as $transaction)
|
||||
<tr class="bg-background-secondary/40 hover:bg-background-secondary/60 transition-all duration-300 group">
|
||||
<td class="px-8 py-6 flex items-center gap-3">
|
||||
<div class="w-1 h-8 bg-gradient-to-b from-success to-success/40 rounded-full opacity-0 group-hover:opacity-100 transition-all duration-300"></div>
|
||||
<span class="text-color-base font-bold">{{ $transaction->created_at->format('d M Y H:i') }}</span>
|
||||
</td>
|
||||
<td class="px-8 py-6 text-color-base font-semibold">{{ $transaction->transaction_id }}</td>
|
||||
<td class="px-8 py-6 text-color-base font-semibold">{{ $transaction->gateway?->name }}</td>
|
||||
<td class="px-8 py-6 text-right text-color-base font-bold text-lg">{{ $transaction->formattedAmount }}</td>
|
||||
</tr>
|
||||
@endforeach
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
46
themes/lucentui/views/invoices/widget.blade.php
Normal file
46
themes/lucentui/views/invoices/widget.blade.php
Normal file
@@ -0,0 +1,46 @@
|
||||
<div class="space-y-4">
|
||||
@foreach ($invoices as $invoice)
|
||||
<a href="{{ route('invoices.show', $invoice) }}" wire:navigate>
|
||||
<div class="bg-gradient-to-br from-background-secondary/50 to-background-secondary/30 border border-neutral/50 p-4 rounded-lg mb-4">
|
||||
<div class="flex items-center justify-between mb-2">
|
||||
<div class="flex items-center gap-3">
|
||||
<div class="bg-secondary/10 p-2 rounded-full">
|
||||
<x-ri-bill-line class="size-5 text-secondary" />
|
||||
</div>
|
||||
<span class="font-medium">Invoice #{{$invoice->number }}</span>
|
||||
<span class="text-base/50 font-semibold">
|
||||
<x-ri-circle-fill class="size-1 text-base/20" />
|
||||
</span>
|
||||
<span class="text-base text-sm">{{ $invoice->formattedTotal }}</span>
|
||||
</div>
|
||||
<div class="size-5 rounded-full p-0.5
|
||||
@if ($invoice->status == 'paid') text-success bg-success/20
|
||||
@elseif($invoice->status == 'cancelled') text-info bg-info/20
|
||||
@else text-warning bg-warning/20
|
||||
@endif">
|
||||
@if ($invoice->status == 'paid')
|
||||
<x-ri-checkbox-circle-fill />
|
||||
@elseif($invoice->status == 'cancelled')
|
||||
<x-ri-forbid-fill />
|
||||
@elseif($invoice->status == 'pending')
|
||||
<x-ri-error-warning-fill />
|
||||
@endif
|
||||
</div>
|
||||
</div>
|
||||
<div class="space-y-2">
|
||||
@foreach ($invoice->items as $item)
|
||||
<div class="flex items-start gap-3">
|
||||
<div>
|
||||
<p class="text-base font-medium">{{ $item->description }}</p>
|
||||
|
||||
<p class="text-sm text-base/50">
|
||||
{{ __('invoices.invoice_date') }}: {{ $invoice->created_at->format('d M Y') }}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
Reference in New Issue
Block a user