Untitled
unknown
plain_text
11 days ago
34 kB
4
Indexable
<?php
use Livewire\Volt\Component;
new class extends Component {
public $isAuthorized = false;
public $branchId;
public $branchName;
// Order filter states
public $orderSearch = '';
public $orderStatus = 'All';
// Order details modal
public $selectedOrder = null;
public $showOrderDetails = false;
// Confirmation dialog
public $confirmingAction = null;
public $confirmingOrderId = null;
public $confirmingOrderNumber = null;
public function mount()
{
$user = auth()->user();
if (!$user || ($user->role !== 'coach' && $user->role !== 'admin')) {
$this->isAuthorized = false;
return;
}
$this->isAuthorized = true;
// Scoping local branch context
$this->branchId = $user->branch_id ?? \App\Models\Branch::first()?->id;
$branch = \App\Models\Branch::find($this->branchId);
$this->branchName = $branch ? $branch->name : 'Dojo Branch';
}
public function getOrders()
{
$query = \App\Models\Order::with('user', 'items.product')
->where('pickup_branch_id', $this->branchId)
->where('status', '!=', 'pending_payment')
->orderBy('created_at', 'desc');
if ($this->orderSearch) {
$query->where(function($q) {
$q->where('order_number', 'like', '%' . $this->orderSearch . '%')
->orWhereHas('user', function($uq) {
$uq->where('name', 'like', '%' . $this->orderSearch . '%');
});
});
}
if ($this->orderStatus !== 'All') {
$query->where('status', $this->orderStatus);
}
return $query->get();
}
public function viewOrderDetails($orderId)
{
$this->selectedOrder = \App\Models\Order::with(['user', 'pickupBranch', 'items.product'])
->findOrFail($orderId);
$this->showOrderDetails = true;
}
public function closeOrderDetails()
{
$this->showOrderDetails = false;
$this->selectedOrder = null;
}
public function initiateAction($action, $orderId)
{
$order = \App\Models\Order::where('id', $orderId)
->where('pickup_branch_id', $this->branchId)
->firstOrFail();
$this->confirmingAction = $action;
$this->confirmingOrderId = $order->id;
$this->confirmingOrderNumber = $order->order_number;
}
public function cancelAction()
{
$this->confirmingAction = null;
$this->confirmingOrderId = null;
$this->confirmingOrderNumber = null;
}
public function executeAction()
{
if (!$this->confirmingAction || !$this->confirmingOrderId) return;
$order = \App\Models\Order::where('id', $this->confirmingOrderId)
->where('pickup_branch_id', $this->branchId)
->firstOrFail();
if ($this->confirmingAction === 'receive_shipment' && $order->status === 'in_transit') {
$order->status = 'ready_for_pickup';
$order->save();
$this->dispatch('toast-notify', message: 'Shipment successfully received! Order #' . $order->order_number . ' is now marked as READY FOR PICKUP.', type: 'success');
} elseif ($this->confirmingAction === 'receive_backorder' && $order->status === 'backorder') {
$order->status = 'ready_for_pickup';
$order->save();
$this->dispatch('toast-notify', message: 'Backorder stock received! Order #' . $order->order_number . ' is now marked as READY FOR PICKUP.', type: 'success');
} elseif ($this->confirmingAction === 'fulfill' && $order->status === 'ready_for_pickup') {
$order->status = 'completed';
$order->save();
$this->dispatch('toast-notify', message: 'Order #' . $order->order_number . ' fulfilled! Payment collected and gear released.', type: 'success');
}
$this->cancelAction();
}
}; ?>
<div class="w-full">
<!-- Role Block State -->
@if(!$isAuthorized)
<div class="bg-white dark:bg-[#0A0A0A] rounded-[2.5rem] border border-red-500/30 p-10 lg:p-16 text-center space-y-6 shadow-xl shadow-red-500/5 animate-modal-scale-in">
<div class="w-24 h-24 bg-red-500/10 text-red-500 rounded-full flex items-center justify-center mx-auto shadow-inner border border-red-500/20">
<svg class="w-12 h-12" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z"></path></svg>
</div>
<div class="space-y-2">
<h3 class="text-2xl font-black text-brand-black dark:text-white tracking-tighter">Access Restricted</h3>
<p class="text-xs font-mono font-bold text-red-500 tracking-widest">TACTICAL ACCESS GATES SHIELDED</p>
<p class="text-sm font-medium text-gray-400 max-w-md mx-auto">This Dojo Logistics panel is reserved for Coaches and staff members assigned to this branch.</p>
</div>
<div class="pt-4">
<a href="{{ route('dashboard') }}" class="inline-block px-10 py-4 bg-brand text-white rounded-full text-xs font-black tracking-[0.2em] shadow-lg shadow-brand/20 hover:scale-105 active:scale-95 transition-all">
Return to Safety
</a>
</div>
</div>
@else
<div class="space-y-8">
<!-- Header -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-6 bg-white dark:bg-[#0A0A0A] border border-gray-100 dark:border-white/5 rounded-[2.5rem] p-8 shadow-sm">
<div class="space-y-1">
<p class="text-[11px] font-black text-brand tracking-widest font-mono">Dojo Logistics Hub</p>
<h3 class="text-3xl font-black text-brand-black dark:text-white tracking-tighter">{{ $branchName }}</h3>
<p class="text-xs font-bold text-gray-500 dark:text-gray-400 tracking-wider font-mono">Pickup & Shipment Tracking — Branch #{{ $branchId }}</p>
</div>
<!-- Quick Stats -->
@php
$totalActive = \App\Models\Order::where('pickup_branch_id', $branchId)->where('status', '!=', 'completed')->count();
$transitCount = \App\Models\Order::where('pickup_branch_id', $branchId)->where('status', 'in_transit')->count();
$backorderCount = \App\Models\Order::where('pickup_branch_id', $branchId)->where('status', 'backorder')->count();
$readyCount = \App\Models\Order::where('pickup_branch_id', $branchId)->where('status', 'ready_for_pickup')->count();
@endphp
<div class="flex items-center gap-3 flex-wrap">
<div class="px-4 py-2 bg-brand/5 border border-brand/10 rounded-2xl text-center">
<p class="text-lg font-black text-brand font-mono">{{ $totalActive }}</p>
<p class="text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">Active</p>
</div>
<div class="px-4 py-2 bg-blue-500/5 border border-blue-500/10 rounded-2xl text-center">
<p class="text-lg font-black text-blue-500 font-mono">{{ $transitCount }}</p>
<p class="text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">In Transit</p>
</div>
<div class="px-4 py-2 bg-amber-500/5 border border-amber-500/10 rounded-2xl text-center">
<p class="text-lg font-black text-amber-500 font-mono">{{ $backorderCount }}</p>
<p class="text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">Backorder</p>
</div>
<div class="px-4 py-2 bg-purple-500/5 border border-purple-500/10 rounded-2xl text-center">
<p class="text-lg font-black text-purple-500 font-mono">{{ $readyCount }}</p>
<p class="text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">Ready</p>
</div>
</div>
</div>
<!-- Search & Filters Row -->
<div class="flex flex-col lg:flex-row justify-between items-start lg:items-center gap-6 bg-white dark:bg-[#0A0A0A] border border-gray-100 dark:border-white/5 rounded-[2rem] p-6 lg:p-8 shadow-sm">
<!-- Search input -->
<div class="relative w-full lg:w-96">
<input wire:model.live.debounce.300ms="orderSearch" type="text" placeholder="Search orders by number or student..." class="w-full bg-gray-50 dark:bg-white/[0.02] border border-gray-200 dark:border-white/10 rounded-full py-4 pl-12 pr-6 text-xs font-black tracking-wider text-brand-black dark:text-white placeholder-gray-500 focus:outline-none focus:border-brand transition-all">
<svg class="absolute left-5 top-1/2 -translate-y-1/2 w-4 h-4 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z"></path></svg>
</div>
<!-- Status filter -->
<x-select model="orderStatus" :live="true" placeholder="All Statuses" :options="[
'All' => 'All Statuses',
'in_transit' => 'In Transit',
'ready_for_pickup' => 'Ready for Pickup',
'backorder' => 'Backorder',
'cancelled' => 'Cancelled',
'completed' => 'Completed',
]" class="w-full lg:w-56" />
</div>
<!-- Orders table -->
<div class="bg-white dark:bg-[#0A0A0A] border border-gray-100 dark:border-white/5 rounded-[2.5rem] shadow-sm overflow-hidden animate-modal-scale-in">
<div class="overflow-x-auto">
<table class="w-full text-left border-collapse">
<thead>
<tr class="bg-gray-50 dark:bg-white/[0.02] border-b border-gray-100 dark:border-white/5 text-[11px] font-black text-gray-500 dark:text-gray-400 tracking-widest">
<th class="p-6 pl-8">Order ID</th>
<th class="p-6">Student Name</th>
<th class="p-6 text-center">Placement Date</th>
<th class="p-6 text-right">Invoice Total</th>
<th class="p-6 text-center">Status</th>
<th class="p-6 text-center pr-8">Actions</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-100 dark:divide-white/5 text-xs">
@forelse($this->getOrders() as $order)
<tr class="hover:bg-gray-50/50 dark:hover:bg-white/[0.01] transition-all">
<!-- ID -->
<td class="p-6 pl-8 font-black text-brand-black dark:text-white font-mono">#{{ $order->order_number }}</td>
<!-- Student Name -->
<td class="p-6 font-bold text-brand-black dark:text-white">{{ $order->user->name }}</td>
<!-- Date -->
<td class="p-6 text-center text-gray-500 dark:text-gray-400 font-mono">{{ $order->created_at->format('M d, Y \a\t h:i A') }}</td>
<!-- Price -->
<td class="p-6 text-right font-black text-brand font-mono">₱{{ number_format($order->total_amount) }}</td>
<!-- Status Badge -->
<td class="p-6 text-center">
@if($order->status === 'completed')
<span class="px-3 py-1 bg-green-500/10 border border-green-500/20 text-green-500 rounded-full text-[10px] font-black tracking-widest">FULFILLED</span>
@elseif($order->status === 'in_transit')
<span class="px-3 py-1 bg-blue-500/10 border border-blue-500/20 text-blue-500 rounded-full text-[10px] font-black tracking-widest animate-pulse">IN TRANSIT</span>
@elseif($order->status === 'ready_for_pickup')
<span class="px-3 py-1 bg-purple-500/10 border border-purple-500/20 text-purple-500 rounded-full text-[10px] font-black tracking-widest">READY FOR PICKUP</span>
@elseif($order->status === 'backorder')
<span class="px-3 py-1 bg-amber-500/10 border border-amber-500/20 text-amber-500 rounded-full text-[10px] font-black tracking-widest animate-pulse">BACKORDER</span>
@elseif($order->status === 'cancelled')
<span class="px-3 py-1 bg-red-500/10 border border-red-500/20 text-red-500 rounded-full text-[10px] font-black tracking-widest">CANCELLED</span>
@else
<span class="px-3 py-1 bg-brand/10 border border-brand/20 text-brand rounded-full text-[10px] font-black tracking-widest">PENDING PAY</span>
@endif
</td>
<!-- Actions (Receive Shipment / Open Scanner) -->
<td class="p-6 text-center pr-8">
<div class="flex items-center justify-center gap-2">
@if($order->status === 'in_transit')
<button wire:click="initiateAction('receive_shipment', {{ $order->id }})" class="inline-flex items-center gap-2 px-4 py-2 bg-blue-500/10 hover:bg-blue-500 text-blue-500 hover:text-white border border-blue-500/20 rounded-xl text-[11px] font-black tracking-widest transition-all shadow-sm">
Receive Shipment
</button>
@endif
@if($order->status === 'backorder')
<button wire:click="initiateAction('receive_backorder', {{ $order->id }})" class="inline-flex items-center gap-2 px-4 py-2 bg-amber-500/10 hover:bg-amber-500 text-amber-500 hover:text-white border border-amber-500/20 rounded-xl text-[11px] font-black tracking-widest transition-all shadow-sm">
Receive Stock
</button>
@endif
@if($order->status === 'ready_for_pickup')
<button wire:click="initiateAction('fulfill', {{ $order->id }})" class="inline-flex items-center gap-2 px-4 py-2 bg-green-500/10 hover:bg-green-500 text-green-500 hover:text-white border border-green-500/20 rounded-xl text-[11px] font-black tracking-widest transition-all shadow-sm">
Fulfill
</button>
@endif
<button wire:click="viewOrderDetails({{ $order->id }})" class="inline-flex items-center gap-2 px-4 py-2 bg-gray-100 hover:bg-brand dark:bg-white/5 text-brand-black dark:text-white hover:text-white border border-transparent rounded-xl text-[11px] font-black tracking-widest transition-all shadow-sm">
View Order Details
</button>
</div>
</td>
</tr>
@empty
<tr>
<td colspan="6" class="p-12 text-center text-gray-500 dark:text-gray-400 font-mono">No pickup orders logged at this branch.</td>
</tr>
@endforelse
</tbody>
</table>
</div>
</div>
</div>
<!-- Confirmation Dialog -->
@if($confirmingAction && $confirmingOrderId)
<div class="fixed inset-0 z-[200] flex items-center justify-center p-4">
<div wire:click="cancelAction" class="fixed inset-0 bg-black/80 backdrop-blur-md animate-modal-fade-in"></div>
<div class="relative w-full max-w-md bg-white dark:bg-[#0A0A0A] rounded-[2.5rem] shadow-2xl border border-white/5 p-8 lg:p-10 animate-modal-scale-in">
<div class="text-center space-y-6">
<!-- Icon -->
<div class="w-16 h-16 mx-auto rounded-full flex items-center justify-center border-2
@if($confirmingAction === 'receive_shipment') bg-blue-500/10 text-blue-500 border-blue-500/30
@elseif($confirmingAction === 'receive_backorder') bg-amber-500/10 text-amber-500 border-amber-500/30
@elseif($confirmingAction === 'fulfill') bg-green-500/10 text-green-500 border-green-500/30
@endif">
<svg class="w-8 h-8" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@if($confirmingAction === 'fulfill')
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z"></path>
@else
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"></path>
@endif
</svg>
</div>
<!-- Title -->
<div class="space-y-2">
<p class="text-[10px] font-black text-brand tracking-[0.25em] font-mono">CONFIRM ACTION</p>
<h3 class="text-2xl font-black text-brand-black dark:text-white tracking-tight">
@if($confirmingAction === 'receive_shipment')
Receive Shipment
@elseif($confirmingAction === 'receive_backorder')
Receive Backorder Stock
@elseif($confirmingAction === 'fulfill')
Fulfill Order
@endif
</h3>
<p class="text-sm font-medium text-gray-500 dark:text-gray-400">
Order #{{ $confirmingOrderNumber }}
</p>
</div>
<!-- Description -->
<p class="text-xs font-bold text-gray-500 dark:text-gray-400 leading-relaxed">
@if($confirmingAction === 'receive_shipment')
This will mark the shipment as received and make the order Ready for Pickup. The student will be notified that their gear is ready to claim.
@elseif($confirmingAction === 'receive_backorder')
This will mark the backorder stock as received and make the order Ready for Pickup. The student will be notified that their gear is ready to claim.
@elseif($confirmingAction === 'fulfill')
This will mark the order as fulfilled. Confirm that the student has made payment and the gear has been released.
@endif
</p>
<!-- Buttons -->
<div class="flex gap-3 pt-2">
<button wire:click="cancelAction" class="flex-1 py-4 bg-gray-100 dark:bg-white/5 text-brand-black dark:text-white rounded-2xl text-xs font-black tracking-widest hover:bg-gray-200 dark:hover:bg-white/10 transition-all">
Cancel
</button>
<button wire:click="executeAction" class="flex-1 py-4 rounded-2xl text-xs font-black tracking-widest text-white shadow-lg transition-all hover:scale-[1.02] active:scale-95
@if($confirmingAction === 'receive_shipment') bg-blue-500 shadow-blue-500/20
@elseif($confirmingAction === 'receive_backorder') bg-amber-500 shadow-amber-500/20
@elseif($confirmingAction === 'fulfill') bg-green-500 shadow-green-500/20
@endif">
Confirm
</button>
</div>
</div>
</div>
</div>
@endif
<!-- Order Details Modal -->
@if($showOrderDetails && $selectedOrder)
<div class="fixed inset-0 z-[110] flex justify-center items-start lg:items-center p-4 lg:p-10 overflow-y-auto">
<div wire:click="closeOrderDetails" class="fixed inset-0 bg-gray-900/60 dark:bg-brand-black/95 backdrop-blur-md animate-modal-fade-in"></div>
<div class="relative w-full max-w-3xl my-auto bg-white dark:bg-[#0A0A0A] rounded-[3rem] shadow-2xl overflow-hidden border border-white/5 p-8 lg:p-12 animate-modal-scale-in">
<button wire:click="closeOrderDetails" class="absolute top-6 right-6 w-10 h-10 bg-gray-100 dark:bg-white/5 rounded-full flex items-center justify-center hover:bg-brand hover:text-white transition-all">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M6 18L18 6M6 6l12 12"></path></svg>
</button>
<div class="space-y-8">
<!-- Header -->
<div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-6 border-b border-gray-100 dark:border-white/5 pb-8">
<div class="space-y-1.5">
<p class="text-[9px] font-black text-brand tracking-widest font-mono">Order Details</p>
<h3 class="text-3xl font-black text-brand-black dark:text-white tracking-tighter">#{{ $selectedOrder->order_number }}</h3>
<p class="text-xs font-bold text-gray-500 dark:text-gray-400 tracking-wider font-mono">Placed on {{ $selectedOrder->created_at->format('M d, Y \a\t h:i A') }}</p>
</div>
<div>
@if($selectedOrder->status === 'completed')
<span class="inline-flex items-center gap-2 px-6 py-3 bg-green-500/10 text-green-500 border border-green-500/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-green-500 rounded-full"></span> FULFILLED
</span>
@elseif($selectedOrder->status === 'in_transit')
<span class="inline-flex items-center gap-2 px-6 py-3 bg-blue-500/10 text-blue-500 border border-blue-500/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-blue-500 rounded-full animate-ping"></span> IN TRANSIT
</span>
@elseif($selectedOrder->status === 'ready_for_pickup')
<span class="inline-flex items-center gap-2 px-6 py-3 bg-purple-500/10 text-purple-500 border border-purple-500/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-purple-500 rounded-full"></span> READY TO CLAIM
</span>
@elseif($selectedOrder->status === 'backorder')
<span class="inline-flex items-center gap-2 px-6 py-3 bg-amber-500/10 text-amber-500 border border-amber-500/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-amber-500 rounded-full"></span> BACKORDER
</span>
@elseif($selectedOrder->status === 'cancelled')
<span class="inline-flex items-center gap-2 px-6 py-3 bg-red-500/10 text-red-500 border border-red-500/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-red-500 rounded-full"></span> CANCELLED
</span>
@else
<span class="inline-flex items-center gap-2 px-6 py-3 bg-brand/10 text-brand border border-brand/25 rounded-full text-xs font-black tracking-widest">
<span class="w-2.5 h-2.5 bg-brand rounded-full"></span> PENDING PAY
</span>
@endif
</div>
</div>
<!-- Student & Branch Panels -->
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
<div class="p-6 rounded-3xl bg-gray-50 dark:bg-white/[0.02] border border-gray-100 dark:border-white/5 space-y-4">
<h4 class="text-xs font-black text-brand-black dark:text-white tracking-widest font-mono">Student Information</h4>
<div class="space-y-2">
<div class="flex justify-between items-center text-xs">
<span class="font-bold text-gray-500 dark:text-gray-400 tracking-wider">Name:</span>
<span class="font-black text-brand-black dark:text-white">{{ $selectedOrder->user->name }}</span>
</div>
<div class="flex justify-between items-center text-xs">
<span class="font-bold text-gray-500 dark:text-gray-400 tracking-wider">Email:</span>
<span class="font-black text-brand-black dark:text-white">{{ $selectedOrder->user->email }}</span>
</div>
</div>
</div>
<div class="p-6 rounded-3xl bg-gray-50 dark:bg-white/[0.02] border border-gray-100 dark:border-white/5 space-y-4">
<h4 class="text-xs font-black text-brand-black dark:text-white tracking-widest font-mono">Pickup Dojo</h4>
<div class="space-y-2">
<div class="flex justify-between items-center text-xs">
<span class="font-bold text-gray-500 dark:text-gray-400 tracking-wider">Branch:</span>
<span class="font-black text-brand-black dark:text-white">{{ $selectedOrder->pickupBranch->name }}</span>
</div>
<div class="flex justify-between items-center text-xs">
<span class="font-bold text-gray-500 dark:text-gray-400 tracking-wider">Address:</span>
<span class="font-black text-gray-500 dark:text-gray-400 truncate max-w-[200px]">{{ $selectedOrder->pickupBranch->address }}</span>
</div>
</div>
</div>
</div>
<!-- Items Table -->
<div class="space-y-4">
<h4 class="text-xs font-black text-brand-black dark:text-white tracking-widest font-mono">Invoice Line Items</h4>
<div class="overflow-x-auto border border-gray-100 dark:border-white/5 rounded-3xl">
<table class="w-full text-left border-collapse">
<thead>
<tr class="bg-gray-50 dark:bg-white/[0.02] border-b border-gray-100 dark:border-white/5 text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">
<th class="p-6">Product</th>
<th class="p-6 text-center">Qty</th>
<th class="p-6 text-right">Unit Price</th>
<th class="p-6 text-right">Total</th>
</tr>
</thead>
<tbody class="divide-y divide-gray-100 dark:divide-white/5 text-xs">
@foreach($selectedOrder->items as $item)
<tr class="hover:bg-gray-50/50 dark:hover:bg-white/[0.01] transition-all">
<td class="p-6">
<div class="flex items-center gap-4">
@if($item->product->image_url)
<img src="{{ $item->product->image_url }}" class="w-12 h-12 rounded-xl object-cover border border-gray-100 dark:border-white/5">
@endif
<div>
<p class="font-black text-brand-black dark:text-white leading-tight">{{ $item->product->name }}</p>
<p class="text-[9px] text-gray-500 dark:text-gray-400 font-mono font-bold tracking-wider mt-0.5">SKU: {{ $item->product->sku }}</p>
</div>
</div>
</td>
<td class="p-6 text-center font-black text-brand-black dark:text-white font-mono">{{ $item->quantity }}</td>
<td class="p-6 text-right font-bold text-gray-500 dark:text-gray-400 font-mono">₱{{ number_format($item->unit_price) }}</td>
<td class="p-6 text-right font-black text-brand font-mono">₱{{ number_format($item->unit_price * $item->quantity) }}</td>
</tr>
@endforeach
</tbody>
<tfoot>
<tr class="bg-gray-50/50 dark:bg-white/[0.01] border-t border-gray-100 dark:border-white/5">
<td colspan="3" class="p-6 text-right text-[10px] font-black text-gray-500 dark:text-gray-400 tracking-widest">Order Total</td>
<td class="p-6 text-right text-lg font-black text-brand font-mono">₱{{ number_format($selectedOrder->total_amount) }}</td>
</tr>
</tfoot>
</table>
</div>
</div>
<!-- Close button -->
<button wire:click="closeOrderDetails" class="w-full bg-brand text-white py-5 rounded-full font-black tracking-[0.2em] shadow-xl shadow-brand/20 hover:scale-[1.02] active:scale-95 transition-all">
Close
</button>
</div>
</div>
</div>
@endif
@endif
</div>
Editor is loading...
Leave a Comment