92 lines
3.2 KiB
Plaintext
92 lines
3.2 KiB
Plaintext
@page
|
|
@model Workshop8.Pages.IndexModel
|
|
@{
|
|
ViewData["Title"] = "Clientes";
|
|
}
|
|
<div class="d-flex justify-content-between align-items-center my-3">
|
|
<h2>Clientes</h2>
|
|
<button class="btn btn-primary" type="button" id="createClientBtn">Adicionar Cliente</button>
|
|
</div>
|
|
<table class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Id</th><th>Nome</th><th>Email</th><th>Criado Em</th><th>Ações</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
@foreach(var client in Model.Clientes)
|
|
{
|
|
<tr>
|
|
<td>@client.Id</td>
|
|
<td>@client.Nome</td>
|
|
<td>@client.Email</td>
|
|
<td>@client.CriadoEm</td>
|
|
<td>
|
|
<button class="btn btn-sm btn-primary"
|
|
onclick="openEditModal(@client.Id,'@client.Nome','@client.Email')">
|
|
Editar
|
|
</button>
|
|
<form method="post" asp-page-handler="Delete" asp-route-id="@client.Id"
|
|
style="display:inline;">
|
|
<button type="submit" class="btn btn-sm btn-danger">Excluir</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
}
|
|
</tbody>
|
|
</table>
|
|
|
|
<!-- Modal -->
|
|
<div class="modal fade" id="clientModal" tabindex="-1" aria-hidden="true">
|
|
<div class="modal-dialog">
|
|
<div class="modal-content">
|
|
<form id="clientForm" method="post" action="?handler=Create">
|
|
@Html.AntiForgeryToken()
|
|
<div class="modal-header">
|
|
<h5 class="modal-title" id="modalTitle">Adicionar Cliente</h5>
|
|
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
|
|
</div>
|
|
<div class="modal-body">
|
|
<input type="hidden" asp-for="Input.Id" />
|
|
<div class="mb-3">
|
|
<label asp-for="Input.Nome" class="form-label"></label>
|
|
<input asp-for="Input.Nome" class="form-control" />
|
|
</div>
|
|
<div class="mb-3">
|
|
<label asp-for="Input.Email" class="form-label"></label>
|
|
<input asp-for="Input.Email" class="form-control" />
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="submit" class="btn btn-success">Salvar</button>
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Cancelar</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
@section Scripts {
|
|
<script>
|
|
var clientModal = new bootstrap.Modal(document.getElementById('clientModal'));
|
|
document.getElementById('createClientBtn').addEventListener('click', function () {
|
|
document.getElementById('modalTitle').innerText = 'Adicionar Cliente';
|
|
var form = document.getElementById('clientForm');
|
|
form.action = '?handler=Create';
|
|
form.querySelector('input[name="Input.Id"]').value = 0;
|
|
form.querySelector('input[name="Input.Nome"]').value = '';
|
|
form.querySelector('input[name="Input.Email"]').value = '';
|
|
clientModal.show();
|
|
});
|
|
function openEditModal(id, nome, email) {
|
|
document.getElementById('modalTitle').innerText = 'Editar Cliente';
|
|
var form = document.getElementById('clientForm');
|
|
form.action = '?handler=Edit';
|
|
form.querySelector('input[name="Input.Id"]').value = id;
|
|
form.querySelector('input[name="Input.Nome"]').value = nome;
|
|
form.querySelector('input[name="Input.Email"]').value = email;
|
|
clientModal.show();
|
|
}
|
|
</script>
|
|
}
|