User edit and delete
This commit is contained in:
@ -2,5 +2,9 @@
|
||||
use Incoviba\Controller\API\Admin\Users;
|
||||
|
||||
$app->group('/users', function($app) {
|
||||
$app->post('/add[/]', Users::class . ':add');
|
||||
$app->post('/add[/]', [Users::class, 'add']);
|
||||
});
|
||||
$app->group('/user/{user_id}', function($app) {
|
||||
$app->post('/edit[/]', [Users::class, 'edit']);
|
||||
$app->delete('[/]', [Users::class, 'delete']);
|
||||
});
|
||||
|
@ -14,15 +14,15 @@
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tbody id="users">
|
||||
@foreach($users as $user)
|
||||
<tr>
|
||||
<tr data-user="{{ $user->id }}">
|
||||
<td>{{ $user->name }}</td>
|
||||
<td class="right aligned">
|
||||
<button class="ui mini blue icon button">
|
||||
<button class="ui mini blue icon button edit" data-user="{{ $user->id }}">
|
||||
<i class="edit icon"></i>
|
||||
</button>
|
||||
<button class="ui mini red icon button">
|
||||
<button class="ui mini red icon button remove" data-user="{{ $user->id }}">
|
||||
<i class="trash icon"></i>
|
||||
</button>
|
||||
</td>
|
||||
@ -50,6 +50,10 @@
|
||||
<label>Contraseña</label>
|
||||
<input type="password" name="password" placeholder="Contraseña">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Confirmar contraseña</label>
|
||||
<input type="password" name="password_confirmation" placeholder="Confirmar contraseña">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="actions">
|
||||
@ -62,6 +66,45 @@
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="ui modal" id="edit-user-modal">
|
||||
<i class="close icon"></i>
|
||||
<div class="header">
|
||||
Editar usuario
|
||||
</div>
|
||||
<div class="content">
|
||||
<form class="ui form">
|
||||
<input type="hidden" name="id" />
|
||||
<div class="field">
|
||||
<label>Contraseña Antigua</label>
|
||||
<input type="password" name="old_password" placeholder="Contraseña Antigua">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Force Change?</label>
|
||||
<div class="ui checkbox">
|
||||
<input type="checkbox" name="force" >
|
||||
<label>Yes</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Contraseña</label>
|
||||
<input type="password" name="password" placeholder="Contraseña">
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Confirmar contraseña</label>
|
||||
<input type="password" name="password_confirmation" placeholder="Confirmar contraseña">
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<div class="ui black deny button">
|
||||
Cancelar
|
||||
</div>
|
||||
<div class="ui positive right labeled icon button">
|
||||
Guardar
|
||||
<i class="checkmark icon"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
|
||||
@include('layout.body.scripts.cryptojs')
|
||||
@ -74,12 +117,20 @@
|
||||
return [passphrase, encrypted.toString()].join('')
|
||||
}
|
||||
$(document).ready(function () {
|
||||
$('#create-user-modal').modal({
|
||||
const $createUserModal = $('#create-user-modal')
|
||||
$createUserModal.modal({
|
||||
onApprove: function() {
|
||||
const form = document.querySelector('#create-user-modal form')
|
||||
const password = form.querySelector('[name="password"]').value
|
||||
const password_confirmation = form.querySelector('[name="password_confirmation"]').value
|
||||
if (password !== password_confirmation) {
|
||||
alert('Las contraseñas no coinciden')
|
||||
return
|
||||
}
|
||||
const url = '{{$urls->api}}/admin/users/add'
|
||||
const method = 'post'
|
||||
const body = new FormData(document.querySelector('#create-user-modal form'))
|
||||
body.set('password', encryptPassword(body.get('password')))
|
||||
const body = new FormData(form)
|
||||
body.set('password', encryptPassword(password))
|
||||
fetchAPI(url, {method, body}).then(response => {
|
||||
if (!response) {
|
||||
return;
|
||||
@ -92,8 +143,64 @@
|
||||
})
|
||||
}
|
||||
})
|
||||
$('#create-user-button').on('click', function () {
|
||||
$('#create-user-modal').modal('show')
|
||||
const $editUserModal = $('#edit-user-modal')
|
||||
$editUserModal.modal({
|
||||
onApprove: function() {
|
||||
const form = document.querySelector('#edit-user-modal form')
|
||||
const user_id = form.querySelector('[name="id"]').value
|
||||
const old_password = form.querySelector('[name="old_password"]').value
|
||||
const password = form.querySelector('[name="password"]').value
|
||||
const password_confirmation = form.querySelector('[name="password_confirmation"]').value
|
||||
if (password !== password_confirmation) {
|
||||
alert('Las nuevas contraseñas no coinciden')
|
||||
return
|
||||
}
|
||||
const url = `{{$urls->api}}/admin/user/${user_id}/edit`
|
||||
const method = 'post'
|
||||
const body = new FormData(form)
|
||||
body.set('old_password', encryptPassword(old_password))
|
||||
body.set('password', encryptPassword(password))
|
||||
if (form.querySelector('[name="force"]').checked) {
|
||||
body.set('force', 'true')
|
||||
}
|
||||
fetchAPI(url, {method, body}).then(response => {
|
||||
if (!response) {
|
||||
return;
|
||||
}
|
||||
response.json().then(result => {
|
||||
if (result.success) {
|
||||
location.reload()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
})
|
||||
document.getElementById('create-user-modal').addEventListener('submit', event => {
|
||||
$createUserModal.modal('show')
|
||||
})
|
||||
document.querySelectorAll('.button.edit').forEach(button => {
|
||||
button.addEventListener('click', clickEvent => {
|
||||
const user_id = clickEvent.currentTarget.dataset.user
|
||||
$editUserModal.find('input[name="id"]').val(user_id)
|
||||
$editUserModal.modal('show')
|
||||
})
|
||||
})
|
||||
document.querySelectorAll('.button.remove').forEach(button => {
|
||||
button.addEventListener('click', clickEvent => {
|
||||
const user_id = clickEvent.currentTarget.dataset.user
|
||||
const url = `{{$urls->api}}/admin/user/${user_id}`
|
||||
const method = 'delete'
|
||||
fetchAPI(url, {method}).then(response => {
|
||||
if (!response) {
|
||||
return;
|
||||
}
|
||||
response.json().then(result => {
|
||||
if (result.success) {
|
||||
location.reload()
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
})
|
||||
});
|
||||
</script>
|
||||
|
Reference in New Issue
Block a user