109 lines
4.3 KiB
PHP
109 lines
4.3 KiB
PHP
<div class="ui mini modal" id="edit_cuota_modal">
|
|
<div class="header">Editar Cuota <span class="numero"></span></div>
|
|
<div class="content">
|
|
<form class="ui form" id="edit_cuota_form">
|
|
<input type="hidden" name="id" />
|
|
<div class="field">
|
|
<label>Fecha de Pago</label>
|
|
<div class="ui calendar" id="edit_fecha">
|
|
<div class="ui icon input">
|
|
<input type="text" name="fecha" />
|
|
<i class="calendar icon"></i>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label>Banco</label>
|
|
<div class="ui search selection dropdown" id="edit_banco">
|
|
<i class="dropdown icon"></i>
|
|
<input type="hidden" name="banco" />
|
|
<div class="default text">Banco</div>
|
|
<div class="menu">
|
|
@foreach($bancos as $banco)
|
|
<div class="item" data-value="{{ $banco->id }}">{{ $banco->nombre }}</div>
|
|
@endforeach
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="field">
|
|
<label>Identificador</label>
|
|
<input type="text" name="identificador" />
|
|
</div>
|
|
<div class="field">
|
|
<label>Valor</label>
|
|
<div class="ui labeled input">
|
|
<div class="ui label">$</div>
|
|
<input type="text" name="valor" />
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<div class="actions">
|
|
<button class="ui positive approve icon button">
|
|
<i class="check icon"></i>
|
|
</button>
|
|
<button class="ui negative cancel icon button">
|
|
<i class="times icon"></i>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
@push('page_scripts')
|
|
<script>
|
|
class EditModal {
|
|
id
|
|
approveCallback
|
|
data
|
|
|
|
constructor({id, approve}) {
|
|
this.id = id
|
|
|
|
this.approveCallback = approve;
|
|
|
|
$(this.id).modal({
|
|
onApprove: $element => {
|
|
return this.approve($element)
|
|
}
|
|
})
|
|
$(this.id).find('#edit_fecha').calendar(calendar_date_options)
|
|
$(this.id).find('#edit_banco').dropdown()
|
|
}
|
|
open({id, number, fecha, banco_id, identificador, valor}) {
|
|
this.data = {id, fecha: fecha.split('-').reverse().join('-'), banco: banco_id, identificador, valor}
|
|
$(this.id).find('.numero').text(number)
|
|
$(this.id).find('input[name="id"]').val(id)
|
|
const dateParts = fecha.split('-')
|
|
const date = new Date(dateParts[2], dateParts[1] - 1, dateParts[0])
|
|
$(this.id).find('#edit_fecha').calendar('set date', date)
|
|
$(this.id).find('#edit_banco').dropdown('set selected', banco_id)
|
|
$(this.id).find('input[name="identificador"]').val(identificador)
|
|
$(this.id).find('input[name="valor"]').val(valor)
|
|
|
|
$(this.id).modal('show')
|
|
}
|
|
approve($element) {
|
|
const $form = $(this.id).find('#edit_cuota_form')
|
|
const temp = new FormData(document.getElementById('edit_cuota_form'))
|
|
const date = $form.find('#edit_fecha').calendar('get date')
|
|
|
|
temp.set('fecha', date.getFullYear() + '-' + (date.getMonth() + 1).toString().padStart(2, '0') + '-' + date.getDate().toString().padStart(2, '0'))
|
|
temp.set('banco', $form.find('#edit_banco').dropdown('get value'))
|
|
temp.set('valor', temp.get('valor'))
|
|
|
|
const data = new FormData()
|
|
Object.entries(this.data).forEach(([key, value]) => {
|
|
if (key === 'id') {
|
|
return;
|
|
}
|
|
if (temp.get(key) === value.toString()) {
|
|
return;
|
|
}
|
|
data.set(key, temp.get(key))
|
|
})
|
|
|
|
return this.approveCallback({id: this.data.id, data})
|
|
}
|
|
}
|
|
</script>
|
|
@endpush
|