Incoviba/operadores
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

UI

Browse Source
This commit is contained in:
Aldarien
2021-08-10 15:52:03 -04:00
parent ed28bf360b
commit 740de41139
59 changed files with 3860 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

255
ui/resources/views/operadores/list.blade.php Normal file
View File

@ -0,0 +1,255 @@
@extends('layout.base')
@section('content')
<h1 class="header">
Operadores
</h1>
<table class="table">
<thead>
<tr>
<th>
Operador
</th>
<th>
Proyectos
</th>
<th class="text-right">
<button class="btn btn-success" data-toggle="modal" data-target="#modal_general">
<span class="glyphicon glyphicon-plus"></span>
</button>
</th>
</tr>
</thead>
<tbody id="operadores">
</tbody>
</table>
<div class="modal fade" id="modal_general" tabindex="-1" role="dialog" aria-labelledby="Agregar Operador">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Agregar Operador</h4>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="rut" class="control-label">Rut</label>
<div class="input-group">
<input type="text" name="rut" class="form-control" maxlength="8" />
<div class="input-group-addon">
-
</div>
<input type="text" name="dv" class="form-control" maxlength="1" size="1" />
</div>
</div>
<div class="form-group">
<label for="descripcion" class="control-label">Descripci&oacute;n</label>
<input type="text" name="descripcion" class="form-control" />
</div>
<div class="form-group">
<label for="abreviacion" class="control-label">Abreviaci&oacute;n</label>
<input type="text" name="abreviacion" class="form-control" />
</div>
<div class="form-group">
<label for="representante" class="control-label">Representante</label>
<input type="text" name="representante" class="form-control" />
</div>
<div class="form-group">
<label for="telefono" class="control-label">Telefono</label>
<input type="text" name="telefono" class="form-control" />
</div>
<div class="form-group">
<label for="correo" class="control-label">Correo</label>
<input type="text" name="correo" class="form-control" />
</div>
<button class="btn btn-default" data-dismiss="modal" id="cerrar_general">Agregar</button>
</form>
</div>
</div>
</div>
</div>
<div class="modal fade" id="modal_proyecto" tabindex="-1" role="dialog" aria-labelledby="Asignar Proyecto">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
<h4 class="modal-title">Asignar Proyecto</h4>
</div>
<div class="modal-body">
<form>
<input type="hidden" name="operador" />
<div class="form-group">
<label for="proyecto" class="control-label">Proyecto</label>
<select class="form-control" name="proyecto"></select>
</div>
<button class="btn btn-default" data-dismiss="modal" id="cerrar_proyecto">Asignar</button>
</form>
</div>
</div>
</div>
</div>
@endsection
@push('scripts')
<script type="text/javascript">
const operadores = {
id: '#operadores',
data: [],
get: function() {
return {
operadores: () => {
return $.ajax({
url: '{{$urls->api}}/operadores',
method: 'get',
dataType: 'json'
}).then((data) => {
if (data.operadores === null || data.operadores.length == 0) {
return
}
this.data = data.operadores
}).then(() => {
this.draw()
})
},
proyectos: () => {
return $.ajax({
url: '{{$urls->api}}/proyectos',
method: 'get',
dataType: 'json'
}).then((data) => {
if (data.proyectos === null || data.proyectos.length == 0) {
return
}
const select = $("select[name='proyecto']")
$.each(data.proyectos, (i, el) => {
select.append(
$('<option></option>').attr('value', el.id).html(el.descripcion + ' - ' + el.inmobiliaria.abreviacion)
)
})
})
}
}
},
draw: function() {
const parent = $(this.id)
$.each(this.data, (i, el) => {
const row = $('<tr></tr>').append(
$('<td></td>').html(el.descripcion)
)
const proyectos = $('<tbody></tbody>')
row.append(
$('<td></td>').append(
$('<table></table>').attr('class', 'table').append(
$('<thead></thead>').append(
$('<tr></tr>').append(
$('<th></th>').html('Proyecto')
).append(
$('<th></th>').html('Comisión')
).append(
$('<th></th>').attr('class', 'text-right').append(
$('<button></button>').attr('class', 'btn btn-success').attr('data-toggle', 'modal').attr('data-target', '#modal_proyecto').attr('data-operador', el.id).append(
$('<span></span>').attr('class', 'glyphicon glyphicon-plus')
)
)
)
)
).append(proyectos)
)
).append(
$('<td></td>').attr('class', 'text-right').append(
$('<button></button>').attr('class', 'btn btn-info').attr('data-toggle', 'modal').attr('data-target', '#modal_edit').attr('data-operador', el.id).append(
$('<span></span>').attr('class', 'glyphicon glyphicon-pencil')
)
).append(
$('<button></button>').attr('class', 'btn btn-info').attr('data-toggle', 'modal').attr('data-target', '#modal_remove').attr('data-operador', el.id).append(
$('<span></span>').attr('class', 'glyphicon glyphicon-remove')
)
)
)
if (el.comisiones.length > 0) {
$.each(el.comisiones, (k, pe) => {
proyectos.append(
$('<tr></tr>').append(
$('<td></td>').html(pe.proyecto.descripcion)
).append(
$('<td></td>').html(pe.comision + '%')
)
)
})
}
parent.append(row)
})
},
add: function() {
return {
operador: () => {
const parent = $('#modal_general').find('form')
const data = {
rut: parent.find("[name='rut']").val(),
descripcion: parent.find("[name='descripcion']").val(),
abreviacion: parent.find("[name='abreviacion']").val(),
representante: parent.find("[name='representante']").val(),
telefono: parent.find("[name='telefono']").val(),
correo: parent.find("[name='correo']").val()
}
return $.ajax({
url: '{{$urls->api}}/operadores/add',
method: 'post',
data: data,
dataType: 'json'
}).then(() => {
this.get().operadores()
})
},
proyecto: () => {
const parent = $('#modal_proyecto').find('form')
const data = {
operador: parent.find("[name='operador']").val(),
proyecto: parent.find("[name='proyecto']").val()
}
console.debug(data)
}
}
},
setup: function() {
this.get().operadores()
this.get().proyectos()
$('#modal_general').find('#cerrar_general').click((e) => {
$('#modal_general').find('form').trigger('submit')
})
$('#modal_general').find('form').submit((e) => {
e.preventDefault()
this.add().operador().then(() => {
$(e.target).trigger('reset')
$('#modal_general').modal('toggle')
})
return false
})
$('#modal_proyecto').on('show.bs.modal', function(e) {
const btn = $(e.relatedTarget)
const operador = btn.data('operador')
const modal = $(this)
modal.find("[name='operador']").val(operador)
})
$('#modal_proyecto').find('#cerrar_proyecto').click((e) => {
$('#modal_proyecto').find('form').trigger('submit')
})
$('#modal_proyecto').find('form').submit((e) => {
e.preventDefault()
this.add().proyecto().then(() => {
$(e.target).trigger('reset')
$('#modal_proyecto').modal('toggle')
})
return false
})
}
}
$(document).ready(() => {
operadores.setup()
})
</script>
@endpush