Mercurial > borealpoint
comparison resources/views/clients/index.blade.php @ 2:90296614b7e2 default tip
Adding in the base for the clients table
| author | luka |
|---|---|
| date | Thu, 28 Aug 2025 20:55:40 -0400 |
| parents | |
| children |
comparison
equal
deleted
inserted
replaced
| 1:8971e685366b | 2:90296614b7e2 |
|---|---|
| 1 <x-app-layout> | |
| 2 <x-slot name="header"> | |
| 3 <h2 class="fw-semibold fs-4 text-dark"> | |
| 4 All {{ Str::plural(ucfirst('client')) }} | |
| 5 </h2> | |
| 6 </x-slot> | |
| 7 | |
| 8 <div class="py-5"> | |
| 9 <div class="container"> | |
| 10 <div class="bg-white shadow-sm rounded p-4"> | |
| 11 <div class="d-flex align-items-center justify-content-between mb-3"> | |
| 12 <a href="{{ route('clients.create') }}" class="btn btn-primary"> | |
| 13 + New {{ ucfirst('client') }} | |
| 14 </a> | |
| 15 </div> | |
| 16 <div id="my-table"></div> | |
| 17 </div> | |
| 18 </div> | |
| 19 </div> | |
| 20 | |
| 21 @include('includes.ServerTable') | |
| 22 @pushOnce('scripts') | |
| 23 <meta name="csrf-token" content="{{ csrf_token() }}"> | |
| 24 @endpushOnce | |
| 25 <script> | |
| 26 document.addEventListener('DOMContentLoaded', function() { | |
| 27 const el = document.getElementById('my-table'); | |
| 28 if (el) { | |
| 29 new ServerTable(el, { | |
| 30 endpoint: '/clients/get_data', | |
| 31 columns: [ | |
| 32 { | |
| 33 name: 'name', | |
| 34 label: 'Name', | |
| 35 class: 'p-2' | |
| 36 }, | |
| 37 | |
| 38 { | |
| 39 name: 'email', | |
| 40 label: 'Email', | |
| 41 class: 'p-2' | |
| 42 }, | |
| 43 | |
| 44 { | |
| 45 name: 'phone_number', | |
| 46 label: 'Phone Number', | |
| 47 class: 'p-2' | |
| 48 }, | |
| 49 | |
| 50 { | |
| 51 name: 'address', | |
| 52 label: 'Address', | |
| 53 class: 'p-2' | |
| 54 }, | |
| 55 | |
| 56 { | |
| 57 name: 'notes', | |
| 58 label: 'Notes', | |
| 59 class: 'p-2' | |
| 60 }, | |
| 61 | |
| 62 { | |
| 63 name: 'actions', | |
| 64 label: ' ', | |
| 65 render: function(row, col, i) { | |
| 66 let actions = ` | |
| 67 <div class="d-flex gap-2"> | |
| 68 <a href="{{ route('clients.show', 'PLACEHOLDER') }}" class="text-primary">View</a> | |
| 69 <a href="{{ route('clients.edit', 'PLACEHOLDER') }}" class="text-warning">Edit</a> | |
| 70 <form action="{{ route('clients.destroy', 'PLACEHOLDER') }}" method="POST" | |
| 71 class="d-inline"> | |
| 72 @csrf | |
| 73 @method('DELETE') | |
| 74 <button type="submit" class="btn btn-link text-danger p-0" | |
| 75 onclick="return confirm('Delete?')">Delete</button> | |
| 76 </form> | |
| 77 </div> | |
| 78 `; | |
| 79 actions = actions.split('PLACEHOLDER').join(row.id); | |
| 80 return actions; | |
| 81 } | |
| 82 } | |
| 83 ], | |
| 84 pageSize: 10, | |
| 85 initialSort: [{ | |
| 86 col: 'created_at', | |
| 87 dir: 'desc' | |
| 88 }], | |
| 89 headers: { | |
| 90 'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute( | |
| 91 'content') | |
| 92 }, | |
| 93 skeleton: ` | |
| 94 <div class="st-table-container"> | |
| 95 <table class="table table-hover"> | |
| 96 <thead> | |
| 97 </thead> | |
| 98 <tbody> | |
| 99 <!-- Data rows will go here --> | |
| 100 </tbody> | |
| 101 </table> | |
| 102 <div class="st-controls"> | |
| 103 <span class="st-pagination"></span> | |
| 104 <span class="st-status"></span> | |
| 105 </div> | |
| 106 </div> | |
| 107 ` | |
| 108 }); | |
| 109 } | |
| 110 }); | |
| 111 </script> | |
| 112 </x-app-layout> |
