Editar estado cuota

This commit is contained in:
Juan Pablo Vial
2024-11-06 21:28:36 -03:00
parent d154212732
commit 37c28c3080
6 changed files with 155 additions and 10 deletions

View File

@ -7,6 +7,7 @@
@push('page_scripts')
<script>
const bancos = JSON.parse('{!! json_encode($bancos) !!}')
const estados = JSON.parse('{!! json_encode($estados) !!}')
</script>
@endpush
@ -89,6 +90,11 @@
($cuota->pago->currentEstado->tipoEstadoPago->descripcion === 'depositado' ? ' class="yellow"' :
($cuota->pago->currentEstado->tipoEstadoPago->activo !== 1 ? ' class="red"' : ''))) !!}>
{{ucwords($cuota->pago->currentEstado->tipoEstadoPago->descripcion)}}
<button class="ui mini tertiary icon button edit_estado_cuota" data-cuota="{{$cuota->pago->id}}"
data-estado="{{$cuota->pago->currentEstado->tipoEstadoPago->id}}"
data-fecha="{{$cuota->pago->currentEstado->fecha->format('Y-m-d')}}">
<i class="edit icon"></i>
</button>
</td>
<td>
@if (in_array($cuota->pago->currentEstado->tipoEstadoPago->descripcion, ['abonado', 'anulado', 'reemplazado']))
@ -185,6 +191,7 @@
</div>
@include('ventas.pies.cuotas.edit')
@include('ventas.pies.cuotas.estados.edit')
@endsection
@include('layout.head.styles.datatables')
@ -329,6 +336,27 @@
editModal.open({id, number, fecha, banco_id, identificador, valor})
})
const editCuotaModal = new EditEstadoModal({id: '#edit_estado_cuota_modal', approve: ({id, data}) => {
const url = '{{$urls->api}}/ventas/pago/' + id + '/estado'
return fetchAPI(url, {method: 'post', body: data}).then(response => {
if (!response) {
return
}
return response.json().then(json => {
if (!json.editado) {
return
}
window.location.reload()
})
})
}})
$('.edit_estado_cuota').on('click', clickEvent => {
const id = $(clickEvent.currentTarget).data('cuota')
const estado_id = $(clickEvent.currentTarget).data('estado')
const fecha = $(clickEvent.currentTarget).data('fecha')
editCuotaModal.open({id, estado_id, fecha})
})
$('.fecha_estado').calendar({
type: 'date',
formatter: {

View File

@ -0,0 +1,93 @@
<div class="ui mini modal" id="edit_estado_cuota_modal">
<div class="header">Editar Estado Cuota <span class="numero"></span></div>
<div class="content">
<form class="ui form" id="edit_estado_cuota_form">
<input type="hidden" name="id" />
<div class="field">
<label>Estado</label>
<div class="ui search selection dropdown" id="edit_estado_estado">
<i class="dropdown icon"></i>
<input type="hidden" name="estado" />
<div class="default text">Estado</div>
<div class="menu">
@foreach($estados as $estado)
<div class="item" data-value="{{ $estado->id }}">{{ ucwords($estado->descripcion) }}</div>
@endforeach
</div>
</div>
</div>
<div class="field">
<label>Fecha Estado</label>
<div class="ui calendar" id="edit_estado_fecha">
<div class="ui icon input">
<input type="text" name="fecha" />
<i class="calendar icon"></i>
</div>
</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 EditEstadoModal {
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_estado_estado').dropdown()
$(this.id).find('#edit_estado_fecha').calendar(calendar_date_options)
}
open({id, estado_id, fecha}) {
this.data = {id, fecha: fecha, estado: estado_id}
$(this.id).find('input[name="id"]').val(id)
$(this.id).find('#edit_estado_estado').dropdown('set selected', estado_id)
const dateParts = fecha.split('-')
const date = new Date(dateParts[0], dateParts[1] - 1, dateParts[2])
$(this.id).find('#edit_estado_fecha').calendar('set date', date)
$(this.id).modal('show')
}
approve($element) {
const $form = $(this.id).find('#edit_estado_cuota_form')
const temp = new FormData(document.getElementById('edit_estado_cuota_form'))
const date = $form.find('#edit_estado_fecha').calendar('get date')
temp.set('estado', $form.find('#edit_estado_estado').dropdown('get value'))
temp.set('fecha', date.getFullYear() + '-' + (date.getMonth() + 1).toString().padStart(2, '0') + '-' + date.getDate().toString().padStart(2, '0'))
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