2024-06-18
This commit is contained in:
Juan Pablo Vial
@ -71,7 +71,7 @@
|
||||
<tbody id="movimientos"></tbody>
|
||||
</table>
|
||||
</div>
|
||||
<div class="ui modal" id="movimientos_modal">
|
||||
<div class="ui fluid modal" id="movimientos_modal">
|
||||
<div class="content">
|
||||
<h3 class="header">
|
||||
Editar Movimiento
|
||||
@ -92,30 +92,66 @@
|
||||
<form class="ui form" id="movimientos_edit">
|
||||
<input type="hidden" name="index"/>
|
||||
<input type="hidden" name="id"/>
|
||||
<div class="field">
|
||||
<label for="centro_costo">Centro de Costo</label>
|
||||
<div class="ui selection search dropdown" id="centro_costo">
|
||||
<input type="hidden" name="centro_id"/>
|
||||
<i class="dropdown icon"></i>
|
||||
<div class="default text">Centro de Costo</div>
|
||||
<div class="menu">
|
||||
@foreach($centros as $centroCosto)
|
||||
<div class="item" data-value="{{$centroCosto->id}}">{{$centroCosto->id}} - {{$centroCosto->descripcion}}</div>
|
||||
@endforeach
|
||||
<div class="fields" id="movimiento_data">
|
||||
<div class="field">
|
||||
<label for="centro_costo">Centro de Costo</label>
|
||||
<div class="ui selection search dropdown" id="centro_costo">
|
||||
<input type="hidden" name="centro_id"/>
|
||||
<i class="dropdown icon"></i>
|
||||
<div class="default text">Centro de Costo</div>
|
||||
<div class="menu">
|
||||
@foreach($centros as $centroCosto)
|
||||
<div class="item" data-value="{{$centroCosto->id}}">{{$centroCosto->id}} - {{$centroCosto->descripcion}}</div>
|
||||
@endforeach
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>RUT</label>
|
||||
<div class="ui right labeled input">
|
||||
<input type="text" name="rut" placeholder="RUT" />
|
||||
<div class="ui basic label">-<span id="digito"></span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Nombre</label>
|
||||
<input type="text" name="nombre" placeholder="Nombre" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<label>Categoría</label>
|
||||
<input type="text" name="categoria" placeholder="Categoría" />
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="detalle">Detalle</label>
|
||||
<div class="ui input">
|
||||
<textarea id="detalle" name="detalle"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<label for="detalle">Detalle</label>
|
||||
<div class="ui input">
|
||||
<textarea id="detalle" name="detalle"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<table class="ui table" id="auxiliares">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>Cargo</th>
|
||||
<th>Abono</th>
|
||||
<th>Centro Costo</th>
|
||||
<th>RUT</th>
|
||||
<th>Nombre</th>
|
||||
<th>Categoría</th>
|
||||
<th>Detalle</th>
|
||||
<th class="right aligned">
|
||||
<button class="ui green icon button" type="button" id="add_auxiliar">
|
||||
<i class="plus icon"></i>
|
||||
</button>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody></tbody>
|
||||
</table>
|
||||
</form>
|
||||
</div>
|
||||
<div class="actions">
|
||||
<div class="ui cancel button">Cancelar</div>
|
||||
<div class="ui approve success button">Guardar</div>
|
||||
<div class="ui red cancel button">Cancelar</div>
|
||||
<div class="ui green approve success button">Guardar</div>
|
||||
</div>
|
||||
</div>
|
||||
@endsection
|
||||
@ -123,10 +159,573 @@
|
||||
@include('layout.body.scripts.datatables')
|
||||
@include('layout.body.scripts.datatables.searchbuilder')
|
||||
@include('layout.body.scripts.datatables.buttons')
|
||||
@include('layout.body.scripts.rut')
|
||||
|
||||
@push('page_scripts')
|
||||
<script>
|
||||
const movimientos = {
|
||||
class CentrosCostos {
|
||||
static data = []
|
||||
static get() {
|
||||
if (this.data.length === 0) {
|
||||
this.data = JSON.parse('{!! json_encode($centros) !!}')
|
||||
}
|
||||
return this.data
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@endpush
|
||||
@push('page_scripts')
|
||||
<script>
|
||||
class EventHandler {
|
||||
props
|
||||
constructor({movimientosHandler, modalHandler}) {
|
||||
this.props = {
|
||||
movimientosHandler,
|
||||
modalHandler
|
||||
}
|
||||
}
|
||||
get() {
|
||||
return {
|
||||
movimientos: submitEvent => {
|
||||
submitEvent.preventDefault()
|
||||
submitEvent.data.handler.props.movimientosHandler.get().movimientos({
|
||||
sociedades_ruts: $(submitEvent.data.sociedades_id).dropdown('get values'),
|
||||
mes: $(submitEvent.data.mes_id).calendar('get date')
|
||||
}).then(() => {
|
||||
app.handlers.table.draw().table(app.handlers.results.props.parsed)
|
||||
})
|
||||
return false
|
||||
}
|
||||
}
|
||||
}
|
||||
edit() {
|
||||
return {
|
||||
movimiento: clickEvent => {
|
||||
const id = $(clickEvent.currentTarget).data('id')
|
||||
const index = $(clickEvent.currentTarget).data('index')
|
||||
const type = $(clickEvent.currentTarget).data('type')
|
||||
const movimiento = this.props.movimientosHandler.find().id(id)
|
||||
clickEvent.data.handler.props.modalHandler.show({movimiento, type})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
class LoadingHandler {
|
||||
props
|
||||
constructor({ids}) {
|
||||
this.props = {
|
||||
ids
|
||||
}
|
||||
}
|
||||
show() {
|
||||
$(this.props.id).addClass('loading')
|
||||
}
|
||||
hide() {
|
||||
$(this.props.id).removeClass('loading')
|
||||
}
|
||||
}
|
||||
class ControlForm {
|
||||
props
|
||||
constructor({ids,}) {
|
||||
this.props = {
|
||||
ids,
|
||||
}
|
||||
}
|
||||
setup() {
|
||||
$(this.props.ids.sociedades).dropdown()
|
||||
|
||||
const cdo = structuredClone(calendar_date_options)
|
||||
cdo['type'] = 'month'
|
||||
cdo['maxDate'] = new Date()
|
||||
$(this.props.ids.mes).calendar(cdo)
|
||||
|
||||
$(this.props.ids.form).on('submit', {
|
||||
sociedades_id: this.props.ids.sociedades,
|
||||
mes_id: this.props.ids.mes,
|
||||
handler: app.handlers.event
|
||||
}, app.handlers.event.get().movimientos)
|
||||
}
|
||||
}
|
||||
class MovimientosTable {
|
||||
props
|
||||
constructor({ids, eventHandler}) {
|
||||
this.props = {
|
||||
ids,
|
||||
eventHandler,
|
||||
movimientos: [],
|
||||
formatters: {
|
||||
number: new Intl.NumberFormat('es-CL'),
|
||||
date: new Intl.DateTimeFormat('es-CL', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric'
|
||||
}),
|
||||
},
|
||||
}
|
||||
}
|
||||
draw() {
|
||||
return {
|
||||
table: (movimientos) => {
|
||||
this.props.table.clear().rows.add(this.draw().movimientos(movimientos)).draw()
|
||||
$(this.props.ids.buttons.edit).on('click', {handler: this.props.eventHandler}, this.props.eventHandler.edit().movimiento)
|
||||
},
|
||||
movimientos: (movimientos) => {
|
||||
const output = []
|
||||
movimientos.forEach(movimiento => {
|
||||
this.draw().movimiento({movimiento, output})
|
||||
})
|
||||
return output
|
||||
},
|
||||
movimiento: ({movimiento, output}) => {
|
||||
const valor = movimiento.abono - movimiento.cargo
|
||||
const fecha = movimiento.fecha
|
||||
output.push([
|
||||
movimiento.cuenta.inmobiliaria.sigla,//0
|
||||
movimiento.cuenta.banco.nombre,//1
|
||||
movimiento.cuenta.cuenta,//2
|
||||
this.props.formatters.date.format(fecha),//3
|
||||
[fecha.getFullYear(), fecha.getMonth() + 1, fecha.getDate()].join('-'),//4
|
||||
fecha.getMonth() + 1,//5
|
||||
fecha.getFullYear(),//6
|
||||
this.props.formatters.number.format(valor),//7
|
||||
valor,//8
|
||||
(movimiento.detalles) ? movimiento.detalles.centro_costo.id : '',//9
|
||||
movimiento.glosa,//10
|
||||
(movimiento.detalles) ? movimiento.detalles.detalle : '',//11
|
||||
'<button class="ui icon button edit_button" data-id="' + movimiento.id + '" data-index="' + movimiento.index + '" data-type="movimiento"><i class="edit icon"></i></button>',//12
|
||||
])
|
||||
}
|
||||
}
|
||||
}
|
||||
setup() {
|
||||
let dtD = structuredClone(datatables_defaults)
|
||||
dtD = Object.assign(dtD, {
|
||||
columnDefs: [
|
||||
{targets: [0, 5, 9, 12], width: '5%', type: 'string'},
|
||||
{targets: [1, 2, 3, 6, 10], width: '10%', type: 'string'},
|
||||
{targets: [11], width: '20%', type: 'string'},
|
||||
{targets: 4, visible: false},
|
||||
{targets: 7, className: 'dt-right', width: '10%'},
|
||||
{targets: 8, visible: false, type: 'num'}
|
||||
],
|
||||
order: [[4, 'asc']],
|
||||
language: Object.assign(dtD.language, {
|
||||
searchBuilder: {
|
||||
add: 'Filtrar',
|
||||
condition: 'Comparador',
|
||||
clearAll: 'Resetear',
|
||||
delete: 'Eliminar',
|
||||
deleteTitle: 'Eliminar Titulo',
|
||||
data: 'Columna',
|
||||
left: 'Izquierda',
|
||||
leftTitle: 'Titulo Izquierdo',
|
||||
logicAnd: 'Y',
|
||||
logicOr: 'O',
|
||||
right: 'Derecha',
|
||||
rightTitle: 'Titulo Derecho',
|
||||
title: {
|
||||
0: 'Filtros',
|
||||
_: 'Filtros (%d)'
|
||||
},
|
||||
value: 'Opciones',
|
||||
valueJoiner: 'y'
|
||||
}
|
||||
}),
|
||||
layout: {
|
||||
top1: {
|
||||
searchBuilder: {
|
||||
columns: [0, 1, 2, 4, 6, 7, 8]
|
||||
}
|
||||
},
|
||||
top1End: {
|
||||
buttons: [
|
||||
{
|
||||
extend: 'excelHtml5',
|
||||
className: 'green',
|
||||
text: 'Exportar a Excel <i class="file excel icon"></i>',
|
||||
title: 'Movimientos Contables',
|
||||
download: 'open',
|
||||
exportOptions: {
|
||||
columns: [0, 1, 2, 3, 5, 6, 8, 9, 10, 11],
|
||||
format: {
|
||||
body: (data, row, column, node) => {
|
||||
if (column === 3) {
|
||||
return data.split('-').reverse().join('-')
|
||||
}
|
||||
return data
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
},
|
||||
data: this.props.movimientos,
|
||||
})
|
||||
this.props.table = new DataTable(this.props.ids.table, dtD)
|
||||
}
|
||||
}
|
||||
class EditModal {
|
||||
props
|
||||
constructor({ids, editForm}) {
|
||||
this.props = {
|
||||
ids,
|
||||
editForm,
|
||||
movimientos: []
|
||||
}
|
||||
}
|
||||
reset() {
|
||||
$(this.props.ids.modal).find('.sociedad').text('')
|
||||
$(this.props.ids.modal).find('.banco').text('')
|
||||
$(this.props.ids.modal).find('.cuenta').text('')
|
||||
$(this.props.ids.modal).find('.fecha').text('')
|
||||
$(this.props.ids.modal).find('.valor').text('')
|
||||
this.props.editForm.reset()
|
||||
}
|
||||
show({movimiento, type}) {
|
||||
$(this.props.ids.modal).modal('show')
|
||||
$(this.props.ids.modal).find('.sociedad').text('Sociedad: ' + movimiento.cuenta.inmobiliaria.sigla)
|
||||
$(this.props.ids.modal).find('.banco').text('Banco: ' + movimiento.cuenta.banco.nombre)
|
||||
$(this.props.ids.modal).find('.cuenta').text('Cuenta: ' + movimiento.cuenta.cuenta)
|
||||
$(this.props.ids.modal).find('.fecha').text('Fecha: ' + movimiento.fecha)
|
||||
$(this.props.ids.modal).find('.valor').text('Valor: ' + (movimiento.abono - movimiento.cargo))
|
||||
this.props.editForm.show({modal: $(this.props.ids.modal), movimiento, type})
|
||||
}
|
||||
hide() {
|
||||
$(this.props.ids.modal).modal('hide')
|
||||
this.reset()
|
||||
}
|
||||
}
|
||||
class EditForm {
|
||||
props
|
||||
constructor({ids}) {
|
||||
this.props = {
|
||||
ids,
|
||||
movimientos: []
|
||||
}
|
||||
}
|
||||
reset() {
|
||||
$(this.props.ids.form).form('reset')
|
||||
}
|
||||
show({modal, movimiento, type}) {
|
||||
if (movimiento.detalles) {
|
||||
modal.find('#movimiento_data').show()
|
||||
modal.find('#auxiliares').hide()
|
||||
modal.find("[name='centro_id']").dropdown('set selected', movimiento.detalles.centro_costo.id)
|
||||
modal.find("[name='rut']").val(movimiento.detalles.rut)
|
||||
modal.find("#digito").text(Rut.digitoVerificador(movimiento.detalles.rut))
|
||||
modal.find("[name='nombre']").val(movimiento.detalles.nombre)
|
||||
modal.find("[name='categoria']").val(movimiento.detalles.categoria)
|
||||
modal.find("[name='detalle']").val(movimiento.detalles.detalle)
|
||||
} else {
|
||||
modal.find('#movimiento_data').hide()
|
||||
modal.find('#auxiliares').show()
|
||||
const tbody = modal.find('#auxiliares tbody')
|
||||
tbody.empty()
|
||||
movimiento.auxiliares.forEach((auxiliar, i) => {
|
||||
tbody.append(`<tr>
|
||||
<td><input type="text" name="cargo${i}" value="${auxiliar.cargo}" /></td>
|
||||
<td><input type="text" name="abono${i}" value="${auxiliar.abono}" /></td>
|
||||
<td>
|
||||
<div class="ui selection search dropdown">
|
||||
<input type="hidden" name="centro_costo${i}" />
|
||||
<i class="dropdown icon"></i>
|
||||
<div class="default text">Centro de Costo</div>
|
||||
<div class="menu">
|
||||
${CentrosCostos.get().map(centroCosto => `<div class="item" data-value="${centroCosto.id}">${centroCosto.id} - ${centroCosto.descripcion}</div>`).join('')}
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div class="ui right labeled input">
|
||||
<input type="text" name="rut${i}" value="${auxiliar.detalles.rut}" />
|
||||
<div class="ui basic label">-<span class="digito" data-index="${i}">${Rut.digitoVerificador(auxiliar.detalles.rut)}</span></div>
|
||||
</div>
|
||||
</td>
|
||||
<td><input type="text" name="nombre${i}" value="${auxiliar.detalles.nombre}" /></td>
|
||||
<td><input type="text" name="categoria${i}" value="${auxiliar.detalles.categoria}" /></td>
|
||||
<td><input type="text" name="detalle${i}" value="${auxiliar.detalles.detalle}" /></td>
|
||||
<td><button class="ui red icon button" type="button"><i class="trash icon"></i></button></td>
|
||||
</tr>`)
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
class MovimientosHandler {
|
||||
props
|
||||
constructor({urls, loadingHandler, resultsHandler}) {
|
||||
this.props = {
|
||||
urls,
|
||||
loadingHandler,
|
||||
resultsHandler
|
||||
}
|
||||
}
|
||||
get() {
|
||||
return {
|
||||
movimientos: ({sociedades_ruts, mes}) => {
|
||||
this.props.loadingHandler.show()
|
||||
const method = 'post'
|
||||
const body = new FormData()
|
||||
sociedades_ruts.forEach(sociedad_rut => {
|
||||
body.append('sociedades_ruts[]', sociedad_rut)
|
||||
})
|
||||
body.set('mes', [mes.getFullYear(), mes.getMonth() + 1, mes.getDate()].join('-'))
|
||||
return APIClient.fetch(this.props.urls.get, {method, body}).then(response => {
|
||||
if (!response) {
|
||||
throw new Error('No se pudo obtener los movimientos')
|
||||
}
|
||||
return response.json().then(json => {
|
||||
this.movimientos = json.movimientos
|
||||
this.props.resultsHandler.props.movimientos = json.movimientos
|
||||
this.props.resultsHandler.parse().movimientos()
|
||||
return json.movimientos
|
||||
})
|
||||
}).catch(error => {
|
||||
console.error(error)
|
||||
}).finally(() => {
|
||||
this.props.loadingHandler.hide()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
edit() {
|
||||
return {
|
||||
movimiento: ({id, index, type, data}) => {
|
||||
/*this.props.resultsHandler.parse().movimientos()
|
||||
this.props.resultsHandler.props.movimientos.forEach((movimiento, i) => {
|
||||
if (movimiento.id === id && movimiento.index === index) {
|
||||
this.props.editModal.show({id, index, type})
|
||||
}
|
||||
})*/
|
||||
}
|
||||
}
|
||||
}
|
||||
find() {
|
||||
return {
|
||||
id: id => {
|
||||
return this.props.resultsHandler.props.movimientos.find(movimiento => movimiento.id === id)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
class ResultsHandler {
|
||||
props
|
||||
constructor() {
|
||||
this.props = {
|
||||
movimientos: [],
|
||||
timezone: ((new Date()).getTimezoneOffset()) / -60
|
||||
}
|
||||
}
|
||||
parse() {
|
||||
return {
|
||||
movimientos: () => {
|
||||
const movimientos = this.props.movimientos
|
||||
const data = []
|
||||
movimientos.forEach((movimiento, index) => {
|
||||
this.parse().movimiento({data, movimiento, index})
|
||||
})
|
||||
this.props.parsed = data
|
||||
},
|
||||
movimiento: ({data, movimiento, index}) => {
|
||||
const fecha = new Date(movimiento.fecha + 'Z' + this.props.timezone)
|
||||
if (movimiento.auxiliares.length > 0) {
|
||||
movimiento.auxiliares.forEach((auxiliar, indexAuxiliar) => {
|
||||
data.push({
|
||||
tipo: 'auxiliar',
|
||||
id: auxiliar.id,
|
||||
index: index * 100000 + indexAuxiliar,
|
||||
cuenta: movimiento.cuenta,
|
||||
fecha,
|
||||
cargo: auxiliar.cargo,
|
||||
abono: auxiliar.abono,
|
||||
detalles: auxiliar.detalles,
|
||||
glosa: movimiento.glosa,
|
||||
})
|
||||
})
|
||||
return
|
||||
}
|
||||
data.push({
|
||||
tipo: 'movimiento',
|
||||
id: movimiento.id,
|
||||
index,
|
||||
cuenta: movimiento.cuenta,
|
||||
fecha,
|
||||
cargo: movimiento.cargo,
|
||||
abono: movimiento.abono,
|
||||
glosa: movimiento.glosa,
|
||||
detalles: movimiento.detalles,
|
||||
auxiliares: movimiento.auxiliares,
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/*const editForm = {
|
||||
id: '',
|
||||
data: {
|
||||
index: 0,
|
||||
id: 0,
|
||||
sociedad: '',
|
||||
banco: '',
|
||||
fecha: '',
|
||||
valor: 0,
|
||||
glosa: '',
|
||||
},
|
||||
fields: {
|
||||
centro_costo: '',
|
||||
rut: '',
|
||||
nombre: '',
|
||||
categoria: '',
|
||||
detalle: '',
|
||||
},
|
||||
auxiliares: [],
|
||||
show({type, index, id, sociedad, banco, cuenta, fecha, valor, glosa, centro_costo = '', rut = '', nombre = '', categoria = '', detalle = '', auxiliares = []}) {
|
||||
this.data = {
|
||||
index,
|
||||
id,
|
||||
sociedad,
|
||||
banco,
|
||||
cuenta,
|
||||
fecha,
|
||||
valor,
|
||||
glosa,
|
||||
}
|
||||
this.auxiliares = auxiliares
|
||||
$(this.id).find('.sociedad').text('Sociedad: ' + sociedad)
|
||||
$(this.id).find('.banco').text('Banco: ' + banco)
|
||||
$(this.id).find('.cuenta').text('Cuenta: ' + cuenta)
|
||||
$(this.id).find('.fecha').text('Fecha: ' + fecha)
|
||||
$(this.id).find('.valor').text('Valor: ' + valor)
|
||||
$(this.id).find('.glosa').text('Glosa: ' + glosa)
|
||||
if (auxiliares.length > 0) {
|
||||
this.auxiliares = auxiliares
|
||||
$(this.id).find('#movimiento_data').hide()
|
||||
$(this.id).find('#auxiliares').show()
|
||||
const tbody = $(this.id).find('#auxiliares tbody')
|
||||
tbody.empty()
|
||||
auxiliares.forEach((auxiliar, i) => {
|
||||
this.draw().auxiliar({auxiliar, i})
|
||||
})
|
||||
} else {
|
||||
$(this.id).find('#movimiento_data').show()
|
||||
if (type === 'auxiliar') {
|
||||
$(this.id).find('#auxiliares').hide()
|
||||
}
|
||||
if (centro_costo !== '') {
|
||||
$(this.id).find("[name='centro_costo']").dropdown('set selected', centro_costo)
|
||||
}
|
||||
$(this.id).find("[name='rut']").val(rut)
|
||||
$(this.id).find("#digito").text(Rut.digitoVerificador(rut))
|
||||
$(this.id).find("[name='nombre']").val(nombre)
|
||||
$(this.id).find("[name='categoria']").val(categoria)
|
||||
$(this.id).find("[name='detalle']").val(detalle)
|
||||
}
|
||||
$(this.id).modal('show')
|
||||
},
|
||||
draw() {
|
||||
return {
|
||||
auxiliar: ({auxiliar, i}) => {
|
||||
const tbody = $(this.id).find('#auxiliares tbody')
|
||||
const menu = $('<div></div>').addClass('menu')
|
||||
CentrosCostos.get().forEach(centroCosto => {
|
||||
menu.append(`<div class="item" data-value="${centroCosto.id}">${centroCosto.id} - ${centroCosto.descripcion}</div>`)
|
||||
})
|
||||
const tr = $('<tr>')
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('cargo')) {
|
||||
tr.append(`<td><input type="text" name="cargo${i}" value="${auxiliar.cargo}" /></td>`)
|
||||
} else {
|
||||
tr.append(`<td><input type="text" name="cargo${i}" /></td>`)
|
||||
}
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('abono')) {
|
||||
tr.append(`<td><input type="text" name="abono${i}" value="${auxiliar.abono}" /></td>`)
|
||||
} else {
|
||||
tr.append(`<td><input type="text" name="abono${i}" /></td>`)
|
||||
}
|
||||
tr.append(
|
||||
$('<td>').append($('<div>').addClass('ui selection search dropdown').attr('data-index', i).append(
|
||||
`<input type="hidden" name="centro_costo${i} />`
|
||||
).append(
|
||||
`<i class="dropdown icon"></i>`
|
||||
).append(
|
||||
`<div class="default text">Centro de Costo</div>`
|
||||
).append(menu)
|
||||
)
|
||||
)
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('detalles') && auxiliar.detalles.includes('rut')) {
|
||||
tr.append(`<td>
|
||||
<div class="ui right labeled input">
|
||||
<input type="text" name="rut${i}" value="${auxiliar.detalles.rut}" />
|
||||
<div class="ui basic label">-<span class="digito" data-index="${i}">${Rut.digitoVerificador(auxiliar.detalles.rut)}</span></div>
|
||||
</div>
|
||||
</td>`)
|
||||
} else {
|
||||
tr.append(`<td>
|
||||
<div class="ui right labeled input">
|
||||
<input type="text" name="rut${i}" />
|
||||
<div class="ui basic label">-<span class="digito" data-index="${i}"></span></div>
|
||||
</div>
|
||||
</td>`)
|
||||
}
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('nombre')) {
|
||||
tr.append(`<td><input type="text" name="nombre${i}" value="${auxiliar.nombre}" /></td>`)
|
||||
} else {
|
||||
tr.append(`<td><input type="text" name="nombre${i}" /></td>`)
|
||||
}
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('categoria')) {
|
||||
tr.append(`<td><input type="text" name="categoria${i}" value="${auxiliar.categoria}" /></td>`)
|
||||
} else {
|
||||
tr.append(`<td><input type="text" name="categoria${i}" /></td>`)
|
||||
}
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.includes('detalle')) {
|
||||
tr.append(`<td><input type="text" name="detalle${i}" value="${auxiliar.detalle}" /></td>`)
|
||||
} else {
|
||||
tr.append(`<td><input type="text" name="detalle${i}" /></td>`)
|
||||
}
|
||||
tbody.append(tr)
|
||||
$(this.id).find(`.dropdown[data-index='${i}']`).dropdown()
|
||||
if (typeof auxiliar !== 'undefined' && auxiliar.detalles && auxiliar.detalles.centro_costo && auxiliar.detalles.centro_costo.id) {
|
||||
$(this.id).find(`[name='centro_costo${i}']`).val(auxiliar.detalles.centro_costo.id)
|
||||
}
|
||||
$(this.id).find(`[name='rut${i}']`).on('input', inputEvent => {
|
||||
inputEvent.currentTarget.value = Rut.format(inputEvent.currentTarget.value)
|
||||
const index = $(inputEvent.currentTarget).data('index')
|
||||
$(this.id).find(`.digito[data-index='${index}']`).text(Rut.digitoVerificador($(inputEvent.currentTarget).val()))
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
submit() {
|
||||
const url = ''
|
||||
const method = 'post'
|
||||
const body = new FormData()
|
||||
const data = this.data
|
||||
data.centro_costo = $(this.id).find("[name='centro_costo']").dropdown('get value')
|
||||
data.rut = $(this.id).find("[name='rut']").val()
|
||||
data.nombre = $(this.id).find("[name='nombre']").val()
|
||||
data.categoria = $(this.id).find("[name='categoria']").val()
|
||||
data.detalle = $(this.id).find("[name='detalle']").val()
|
||||
console.debug(data)
|
||||
},
|
||||
setup(id) {
|
||||
this.id = id
|
||||
$(this.id).modal({
|
||||
onApprove: $element => {
|
||||
this.submit()
|
||||
}
|
||||
})
|
||||
$(this.id).find('#centro_costo').dropdown()
|
||||
$(this.id).find("[name='rut']").on('input', inputEvent => {
|
||||
$(this.id).find('#digito').text(Rut.digitoVerificador($(inputEvent.currentTarget).val()))
|
||||
})
|
||||
$(this.id).find('#digito').text(Rut.digitoVerificador($("[name='rut']").val()))
|
||||
$(this.id).find('#add_auxiliar').click(clickEvent => {
|
||||
const i = this.auxiliares.length + 1
|
||||
this.draw().auxiliar({i})
|
||||
})
|
||||
}
|
||||
}*/
|
||||
/*const movimientos = {
|
||||
ids: {
|
||||
form: {
|
||||
id: '',
|
||||
@ -144,7 +743,7 @@
|
||||
const sociedades_ruts = $(this.ids.forms.search.sociedades).dropdown('get values')
|
||||
const mes = $(this.ids.forms.search.mes).calendar('get date')
|
||||
|
||||
const url = '{{$urls->api}}/contabilidad/movimientos/sociedad/mes'
|
||||
const url = '/contabilidad/movimientos/sociedad/mes'
|
||||
const method = 'post'
|
||||
const body = new FormData()
|
||||
sociedades_ruts.forEach(sociedad_rut => {
|
||||
@ -175,31 +774,37 @@
|
||||
if (data.length === 0) {
|
||||
return
|
||||
}
|
||||
const formatter = new Intl.NumberFormat('es-CL')
|
||||
const dateFormatter = new Intl.DateTimeFormat('es-CL', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric'
|
||||
})
|
||||
const tz = ((new Date()).getTimezoneOffset()) / -60
|
||||
data.forEach((movimiento, index) => {
|
||||
const fecha = new Date(movimiento.fecha + 'Z' + tz)
|
||||
const valor = movimiento.abono - movimiento.cargo
|
||||
this.movimientos.push([
|
||||
movimiento.cuenta.inmobiliaria.sigla,//0
|
||||
movimiento.cuenta.banco.nombre,//1
|
||||
movimiento.cuenta.cuenta,//2
|
||||
dateFormatter.format(fecha),//3
|
||||
[fecha.getFullYear(), fecha.getMonth() + 1, fecha.getDate()].join('-'),//4
|
||||
fecha.getMonth() + 1,//5
|
||||
fecha.getFullYear(),//6
|
||||
formatter.format(valor),//7
|
||||
valor,//8
|
||||
(movimiento.detalles) ? movimiento.detalles.centro_costo.id : '',//9
|
||||
movimiento.glosa,//10
|
||||
(movimiento.detalles) ? movimiento.detalles.detalle : '',//11
|
||||
'<button class="ui icon button edit_button" data-id="' + movimiento.id + '" data-index="' + index + '"><i class="edit icon"></i></button>',//12
|
||||
])
|
||||
if (movimiento.auxiliares.length > 0) {
|
||||
movimiento.auxiliares.forEach((auxiliar, indexAuxiliar) => {
|
||||
this.movimientos.push({
|
||||
tipo: 'auxiliar',
|
||||
id: auxiliar.id,
|
||||
index: index * 100 + indexAuxiliar,
|
||||
cuenta: movimiento.cuenta,
|
||||
fecha,
|
||||
cargo: auxiliar.cargo,
|
||||
abono: auxiliar.abono,
|
||||
detalles: auxiliar.detalles,
|
||||
glosa: movimiento.glosa,
|
||||
})
|
||||
})
|
||||
return
|
||||
}
|
||||
this.movimientos.push({
|
||||
tipo: 'movimiento',
|
||||
id: movimiento.id,
|
||||
index,
|
||||
cuenta: movimiento.cuenta,
|
||||
fecha,
|
||||
cargo: movimiento.cargo,
|
||||
abono: movimiento.abono,
|
||||
glosa: movimiento.glosa,
|
||||
detalles: movimiento.detalles,
|
||||
auxiliares: movimiento.auxiliares,
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -238,27 +843,64 @@
|
||||
draw() {
|
||||
return {
|
||||
table: () => {
|
||||
this.table.clear().rows.add(this.movimientos).draw()
|
||||
this.table.clear().rows.add(this.draw().movimientos()).draw()
|
||||
$(this.ids.buttons.edit).click(clickEvent => {
|
||||
const id = $(clickEvent.currentTarget).data('id')
|
||||
const index = $(clickEvent.currentTarget).data('index')
|
||||
this.draw().edit({id, index})
|
||||
})
|
||||
},
|
||||
edit: ({id, index}) => {
|
||||
const form = $('#' + this.ids.forms.edit.id)
|
||||
form.find("[name='id']").val(id)
|
||||
form.find("[name='index']").val(index)
|
||||
$(this.ids.modals.edit).find('.sociedad').text('Sociedad: ' + this.movimientos[index][0])
|
||||
$(this.ids.modals.edit).find('.banco').text('Banco: ' + this.movimientos[index][1])
|
||||
$(this.ids.modals.edit).find('.cuenta').text('Cuenta: ' + this.movimientos[index][2])
|
||||
$(this.ids.modals.edit).find('.fecha').text('Fecha: ' + this.movimientos[index][3])
|
||||
$(this.ids.modals.edit).find('.valor').text('Valor: ' + this.movimientos[index][7])
|
||||
$(this.ids.modals.edit).find('.glosa').text('Glosa: ' + this.movimientos[index][10])
|
||||
form.find("[name='centro_costo']").dropdown('set selected', this.movimientos[index][9])
|
||||
form.find("[name='detalle']").val(this.movimientos[index][11])
|
||||
|
||||
$(this.ids.modals.edit).modal('show')
|
||||
movimientos: () => {
|
||||
const output = []
|
||||
this.movimientos.forEach(movimiento => {
|
||||
this.draw().movimiento({movimiento, output})
|
||||
})
|
||||
return output
|
||||
},
|
||||
movimiento: ({movimiento, output}) => {
|
||||
const formatter = new Intl.NumberFormat('es-CL')
|
||||
const dateFormatter = new Intl.DateTimeFormat('es-CL', {
|
||||
day: '2-digit',
|
||||
month: '2-digit',
|
||||
year: 'numeric'
|
||||
})
|
||||
const valor = movimiento.abono - movimiento.cargo
|
||||
const fecha = movimiento.fecha
|
||||
output.push([
|
||||
movimiento.cuenta.inmobiliaria.sigla,//0
|
||||
movimiento.cuenta.banco.nombre,//1
|
||||
movimiento.cuenta.cuenta,//2
|
||||
dateFormatter.format(fecha),//3
|
||||
[fecha.getFullYear(), fecha.getMonth() + 1, fecha.getDate()].join('-'),//4
|
||||
fecha.getMonth() + 1,//5
|
||||
fecha.getFullYear(),//6
|
||||
formatter.format(valor),//7
|
||||
valor,//8
|
||||
(movimiento.detalles) ? movimiento.detalles.centro_costo.id : '',//9
|
||||
movimiento.glosa,//10
|
||||
(movimiento.detalles) ? movimiento.detalles.detalle : '',//11
|
||||
'<button class="ui icon button edit_button" data-id="' + movimiento.id + '" data-index="' + movimiento.index + '" data-type="movimiento"><i class="edit icon"></i></button>',//12
|
||||
])
|
||||
},
|
||||
edit: ({id, index, type}) => {
|
||||
const idx = this.movimientos.findIndex(movimiento => movimiento.index === index)
|
||||
editForm.show({
|
||||
type,
|
||||
id,
|
||||
index,
|
||||
sociedad: this.movimientos[idx].cuenta.inmobiliaria.sigla,
|
||||
banco: this.movimientos[idx].cuenta.banco.nombre,
|
||||
cuenta: this.movimientos[idx].cuenta.cuenta,
|
||||
fecha: this.movimientos[idx].fecha,
|
||||
valor: this.movimientos[idx].abono - this.movimientos[idx].cargo,
|
||||
glosa: this.movimientos[idx].glosa,
|
||||
centro_costo: (this.movimientos[idx].detalles !== null && typeof this.movimientos[idx].detalles.centro_costo) ? this.movimientos[idx].detalles.centro_costo.id : '',
|
||||
rut: (this.movimientos[idx].detalles !== null) ? this.movimientos[idx].detalles.rut : '',
|
||||
nombre: (this.movimientos[idx].detalles !== null) ? this.movimientos[idx].detalles.nombre : '',
|
||||
categoria: (this.movimientos[idx].detalles !== null) ? this.movimientos[idx].detalles.categoria : '',
|
||||
detalle: (this.movimientos[idx].detalles !== null) ? this.movimientos[idx].detalles.detalle : '',
|
||||
auxiliares: this.movimientos[idx].auxiliares,
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -274,7 +916,7 @@
|
||||
const index = body.get('index')
|
||||
body.delete('id')
|
||||
body.delete('index')
|
||||
const url = '{{$urls->api}}/contabilidad/movimiento/' + id + '/detalles'
|
||||
const url = '/contabilidad/movimiento/' + id + '/detalles'
|
||||
const method = 'post'
|
||||
return fetchAPI(url, {method, body}).then(response => {
|
||||
if (!response) {
|
||||
@ -363,17 +1005,38 @@
|
||||
})
|
||||
this.table = new DataTable(this.ids.table, dtD)
|
||||
|
||||
$(this.ids.modals.edit).modal({
|
||||
/!*$(this.ids.modals.edit).modal({
|
||||
onApprove: $element => {
|
||||
this.edit()
|
||||
}
|
||||
})*!/
|
||||
editForm.setup(this.ids.modals.edit)
|
||||
//$('#' + this.ids.forms.edit.id).find('#centro_costo').dropdown()
|
||||
}
|
||||
}*/
|
||||
|
||||
const app = {
|
||||
handlers: {},
|
||||
setup() {
|
||||
this.handlers.results = new ResultsHandler()
|
||||
this.handlers.loading = new LoadingHandler({id: '#movimientos_form'})
|
||||
this.handlers.movimientos = new MovimientosHandler({urls: {get: '{{$urls->api}}/contabilidad/movimientos/sociedad/mes', edit: '{{$urls->api}}/contabilidad/movimientos/edit'}, loadingHandler: this.handlers.loading, resultsHandler: this.handlers.results})
|
||||
this.handlers.forms = {}
|
||||
this.handlers.forms.edit = new EditForm({ids: {modal: '#movimientos_modal', form: '#movimientos_edit',}})
|
||||
this.handlers.modals = {}
|
||||
this.handlers.modals.edit = new EditModal({ids: {modal: '#movimientos_modal'}, editForm: this.handlers.forms.edit})
|
||||
this.handlers.events = new EventHandler({movimientosHandler: this.handlers.movimientos, modalHandler: this.handlers.modals.edit})
|
||||
this.handlers.table = new MovimientosTable({ids: {table: '#tabla_movimientos', buttons: {edit: '.edit_button'}}, eventHandler: this.handlers.events})
|
||||
this.handlers.forms.control = new ControlForm({
|
||||
ids: {form: '#movimientos_form', sociedades: '#sociedades', mes: '#mes',},
|
||||
})
|
||||
$('#' + this.ids.forms.edit.id).find('#centro_costo').dropdown()
|
||||
this.handlers.table.setup()
|
||||
this.handlers.forms.control.setup()
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(() => {
|
||||
movimientos.setup({
|
||||
app.setup()
|
||||
/*movimientos.setup({
|
||||
forms: {
|
||||
search: {
|
||||
id: '#movimientos_form',
|
||||
@ -391,7 +1054,7 @@
|
||||
buttons: {
|
||||
edit: '.edit_button'
|
||||
}
|
||||
})
|
||||
})*/
|
||||
})
|
||||
</script>
|
||||
@endpush
|
||||
|
||||
Reference in New Issue
Block a user