tabla clientes ejemplo
This commit is contained in:
JACS
parent
f06d22072e
commit
e4b0969ecf
5 changed files with 308 additions and 0 deletions
165
storage/templates/tabler/app/admin/apptabler_admincustomers.html
Normal file
165
storage/templates/tabler/app/admin/apptabler_admincustomers.html
Normal file
|
|
@ -0,0 +1,165 @@
|
|||
{{template "base_header" .}}
|
||||
{{$admin := .AdminCustomers}}
|
||||
<div class="page">
|
||||
{{if .ShowTopbar}}
|
||||
{{template "tabler_navbar" .}}
|
||||
{{end}}
|
||||
|
||||
<div class="page-wrapper">
|
||||
{{if .PageHeader}}
|
||||
<div class="page-header d-print-none">
|
||||
<div class="container-xl">
|
||||
<div class="row g-2 align-items-center">
|
||||
<div class="col">
|
||||
{{if .PagePretitle}}
|
||||
<div class="page-pretitle">
|
||||
{{.PagePretitle}}
|
||||
</div>
|
||||
{{end}}
|
||||
<h1 class="page-title">
|
||||
{{.PageHeader}}
|
||||
</h1>
|
||||
</div>
|
||||
<div class="col-auto ms-auto d-print-none">
|
||||
<div class="btn-list">
|
||||
<a href="#" class="btn btn-primary d-none d-sm-inline-block">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path d="M12 5l0 14"></path><path d="M5 12l14 0"></path></svg>
|
||||
Add customer
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{{end}}
|
||||
|
||||
<div class="page-body">
|
||||
<div class="container-xl">
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<div class="row w-full">
|
||||
<div class="col">
|
||||
<h3 class="card-title mb-0">Customers</h3>
|
||||
<p class="text-secondary m-0">Manage your customer relationships.</p>
|
||||
</div>
|
||||
<div class="col-md-auto col-sm-12">
|
||||
<div class="ms-auto d-flex flex-wrap btn-list">
|
||||
<div class="input-group input-group-flat w-auto">
|
||||
<span class="input-group-text">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path d="M10 10m-7 0a7 7 0 1 0 14 0a7 7 0 1 0 -14 0"></path><path d="M21 21l-6 -6"></path></svg>
|
||||
</span>
|
||||
<input type="text" class="form-control" placeholder="Search customers…">
|
||||
</div>
|
||||
<a href="#" class="btn btn-icon" aria-label="More options">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path d="M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="table-responsive">
|
||||
<table class="table table-vcenter card-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="w-1"><input class="form-check-input m-0 align-middle" type="checkbox" aria-label="Select all"></th>
|
||||
<th>Name</th>
|
||||
<th>Location</th>
|
||||
<th>Status</th>
|
||||
<th>Start date</th>
|
||||
<th>Tags</th>
|
||||
<th>Department</th>
|
||||
<th class="w-1"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{{range $i, $customer := $admin.Customers}}
|
||||
<tr>
|
||||
<td><input class="form-check-input m-0 align-middle" type="checkbox" aria-label="Select customer {{$i}}"></td>
|
||||
<td>
|
||||
<div class="d-flex py-1 align-items-center">
|
||||
<span class="avatar avatar-sm me-2" style="background-image: url(/static/avatars/{{.AvatarID}}.jpg)"></span>
|
||||
<div class="flex-fill">
|
||||
<div class="font-weight-medium">{{.FullName}}</div>
|
||||
<div class="text-secondary"><a href="#" class="text-reset">{{.Email}}</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div>{{.City}}</div>
|
||||
<div class="text-secondary">{{.Country}}</div>
|
||||
</td>
|
||||
<td>
|
||||
{{if eq .Status "VIP"}}
|
||||
<span class="badge bg-blue-lt text-uppercase">{{.Status}}</span>
|
||||
{{else if eq .Status "New"}}
|
||||
<span class="badge bg-green-lt text-uppercase">{{.Status}}</span>
|
||||
{{else}}
|
||||
<span class="badge bg-muted-lt text-uppercase">{{.Status}}</span>
|
||||
{{end}}
|
||||
</td>
|
||||
<td class="text-secondary">{{.Date}}</td>
|
||||
<td>
|
||||
<div class="row g-1">
|
||||
{{range .Tags}}
|
||||
<div class="col-auto">
|
||||
<span class="badge bg-green-lt text-uppercase">{{.}}</span>
|
||||
</div>
|
||||
{{end}}
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<span class="badge bg-muted-lt text-uppercase">{{.Department}}</span>
|
||||
</td>
|
||||
<td>
|
||||
<div class="btn-list flex-nowrap">
|
||||
<a href="#" class="btn btn-ghost btn-sm">Edit</a>
|
||||
<div class="dropdown">
|
||||
<button class="btn btn-ghost btn-icon btn-sm" data-bs-toggle="dropdown">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon"><path d="M5 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M12 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path><path d="M19 12m-1 0a1 1 0 1 0 2 0a1 1 0 1 0 -2 0"></path></svg>
|
||||
</button>
|
||||
<div class="dropdown-menu">
|
||||
<a class="dropdown-item" href="#">Edit</a>
|
||||
<a class="dropdown-item" href="#">Duplicate</a>
|
||||
<a class="dropdown-item text-danger" href="#">Delete</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
{{end}}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<div class="card-footer d-flex align-items-center">
|
||||
<div class="dropdown">
|
||||
<a class="btn dropdown-toggle" data-bs-toggle="dropdown">
|
||||
<span class="me-1">20</span>
|
||||
<span>records</span>
|
||||
</a>
|
||||
<div class="dropdown-menu">
|
||||
<a class="dropdown-item">10 records</a>
|
||||
<a class="dropdown-item active">20 records</a>
|
||||
<a class="dropdown-item">50 records</a>
|
||||
<a class="dropdown-item">100 records</a>
|
||||
</div>
|
||||
</div>
|
||||
<ul class="pagination ms-auto mb-0">
|
||||
<li class="page-item disabled"><a class="page-link">‹</a></li>
|
||||
<li class="page-item active"><a class="page-link">1</a></li>
|
||||
<li class="page-item"><a class="page-link">2</a></li>
|
||||
<li class="page-item"><a class="page-link">3</a></li>
|
||||
<li class="page-item"><a class="page-link">4</a></li>
|
||||
<li class="page-item"><a class="page-link">5</a></li>
|
||||
<li class="page-item"><a class="page-link">›</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{{template "tabler_footer" .}}
|
||||
</div>
|
||||
</div>
|
||||
{{template "base_footer" .}}
|
||||
Loading…
Add table
Add a link
Reference in a new issue