67 lines
3.2 KiB
PHP
67 lines
3.2 KiB
PHP
<div>
|
|
<div class="flex items-center justify-between mb-6">
|
|
<h1 class="text-2xl font-bold">Links</h1>
|
|
<a href="#" class="px-4 py-2 bg-blue-600 text-white rounded-lg text-sm font-medium hover:bg-blue-700 transition-colors">
|
|
+ New Link
|
|
</a>
|
|
</div>
|
|
|
|
<div class="flex gap-3 mb-4">
|
|
<input wire:model.live.debounce.300ms="search"
|
|
type="text" placeholder="Search links..."
|
|
class="flex-1 px-3 py-2 rounded-lg bg-gray-800 border border-gray-700 text-gray-100 text-sm focus:outline-none focus:border-blue-500" />
|
|
<select wire:model.live="statusFilter"
|
|
class="px-3 py-2 rounded-lg bg-gray-800 border border-gray-700 text-gray-100 text-sm focus:outline-none">
|
|
<option value="">All status</option>
|
|
<option value="active">Active</option>
|
|
<option value="disabled">Disabled</option>
|
|
<option value="expired">Expired</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="bg-gray-900 rounded-xl border border-gray-800 overflow-hidden">
|
|
<table class="w-full text-sm">
|
|
<thead class="border-b border-gray-800">
|
|
<tr class="text-gray-500 text-xs uppercase tracking-wider">
|
|
<th class="px-4 py-3 text-left">Link</th>
|
|
<th class="px-4 py-3 text-left">Target</th>
|
|
<th class="px-4 py-3 text-right">Clicks</th>
|
|
<th class="px-4 py-3 text-center">Status</th>
|
|
<th class="px-4 py-3"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody class="divide-y divide-gray-800">
|
|
@forelse($links as $link)
|
|
<tr class="hover:bg-gray-800/50 transition-colors">
|
|
<td class="px-4 py-3">
|
|
<div class="font-mono text-blue-400 text-sm">{{ $link->slug }}</div>
|
|
@if($link->title)
|
|
<div class="text-gray-500 text-xs mt-0.5">{{ $link->title }}</div>
|
|
@endif
|
|
</td>
|
|
<td class="px-4 py-3 text-gray-400 truncate max-w-xs">{{ $link->target_url }}</td>
|
|
<td class="px-4 py-3 text-right font-mono text-gray-100">0</td>
|
|
<td class="px-4 py-3 text-center">
|
|
<span class="px-2 py-0.5 rounded-full text-xs font-medium
|
|
{{ $link->status === 'active' ? 'bg-green-500/10 text-green-400' : 'bg-gray-700 text-gray-400' }}">
|
|
{{ $link->status }}
|
|
</span>
|
|
</td>
|
|
<td class="px-4 py-3 text-right">
|
|
<button wire:click="deleteLink({{ $link->id }})"
|
|
wire:confirm="Delete this link?"
|
|
class="text-red-400 text-xs hover:opacity-80">Delete</button>
|
|
</td>
|
|
</tr>
|
|
@empty
|
|
<tr>
|
|
<td colspan="5" class="px-4 py-12 text-center text-gray-500">No links yet. Create your first link.</td>
|
|
</tr>
|
|
@endforelse
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="mt-4">{{ $links->links() }}</div>
|
|
</div>
|