Poder editar propietario de ventas, cambiando el propietario en si
This commit is contained in:
Juan Pablo Vial
@ -39,6 +39,9 @@ $app->group('/venta/{venta_id}', function($app) {
|
||||
$app->get('/eliminar[/]', [Ventas::class, 'insistir']);
|
||||
$app->post('[/]', [Ventas::class, 'desistir']);
|
||||
});
|
||||
$app->group('/propietario', function($app) {
|
||||
$app->put('/edit[/]', [Ventas::class, 'propietario']);
|
||||
});
|
||||
$app->post('[/]', [Ventas::class, 'edit']);
|
||||
$app->get('[/]', [Ventas::class, 'get']);
|
||||
});
|
||||
|
||||
@ -9,9 +9,12 @@ Editar Propietario
|
||||
<h2 class="ui header">Editar Propietario</h2>
|
||||
<form class="ui form" id="edit_form">
|
||||
<input type="hidden" name="venta_id" value="{{$venta_id}}" />
|
||||
<div class="field">
|
||||
<div class="two wide field">
|
||||
<label for="rut">RUT</label>
|
||||
{{$propietario->rut()}}
|
||||
<div class="ui right labeled input" id="rut">
|
||||
<input type="text" name="rut" value="{{number_format($propietario->rut, 0, ',', '.')}}" />
|
||||
<div class="ui basic label">-<span id="digito">{{$propietario->dv}}</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="fields">
|
||||
<div class="field">
|
||||
@ -62,165 +65,460 @@ Editar Propietario
|
||||
|
||||
@push('page_scripts')
|
||||
<script type="text/javascript">
|
||||
function drawComunas({parent, comunas}) {
|
||||
parent.html('')
|
||||
comunas.forEach(comuna => {
|
||||
const option = $('<option></option>')
|
||||
option.attr('value', comuna.id).html(comuna.descripcion)
|
||||
if (comuna.id === {{$propietario->datos->direccion->comuna->id}}) {
|
||||
option.prop('selected', true)
|
||||
class Propietario {
|
||||
props
|
||||
constructor({rut, digito, nombres, apellidos: {paterno, materno}, direccion: {calle, numero, extra, comuna, region}}) {
|
||||
this.props = {
|
||||
rut,
|
||||
digito,
|
||||
nombres,
|
||||
apellidos: {
|
||||
paterno,
|
||||
materno
|
||||
},
|
||||
direccion: {
|
||||
calle,
|
||||
numero,
|
||||
extra,
|
||||
comuna,
|
||||
region
|
||||
},
|
||||
}
|
||||
parent.append(option)
|
||||
})
|
||||
parent.show()
|
||||
parent.dropdown()
|
||||
}
|
||||
function findComunas(direccion) {
|
||||
const original_id = $("[name='comuna']").val()
|
||||
const uri = '{{$urls->api}}/direcciones/comunas/find'
|
||||
const data = {direccion}
|
||||
return fetchAPI(uri,
|
||||
{method: 'post', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data)}
|
||||
).then(response => {
|
||||
if (response.ok) {
|
||||
return response.json()
|
||||
}
|
||||
|
||||
digito() {
|
||||
const cleanRut = this.props.rut.replace(/\D/g, ''); // Removes non-digit characters more efficiently
|
||||
let sum = 0;
|
||||
const factors = [2, 3, 4, 5, 6, 7, 2, 3, 4, 5];
|
||||
for (let i = 0; i < cleanRut.length; i++) {
|
||||
const digit = parseInt(cleanRut[cleanRut.length - 1 - i], 10);
|
||||
sum += digit * factors[i % factors.length];
|
||||
}
|
||||
}).then(data => {
|
||||
if (data.total === 0) {
|
||||
const dv = 11 - (sum % 11);
|
||||
return dv === 10 ? 'K' : dv === 11 ? '0' : dv.toString();
|
||||
}
|
||||
update() {
|
||||
return {
|
||||
rut: rut => {
|
||||
this.props.rut = rut
|
||||
this.update().digito(this.digito())
|
||||
},
|
||||
digito: digito => {
|
||||
this.props.digito = digito
|
||||
},
|
||||
nombres: nombres => {
|
||||
this.props.nombres = nombres
|
||||
},
|
||||
apellidos: () => {
|
||||
return {
|
||||
paterno: paterno => {
|
||||
this.props.apellidos.paterno = paterno
|
||||
},
|
||||
materno: materno => {
|
||||
this.props.apellidos.materno = materno
|
||||
}
|
||||
}
|
||||
},
|
||||
direccion: () => {
|
||||
return {
|
||||
calle: calle => {
|
||||
this.props.direccion.calle = calle
|
||||
},
|
||||
numero: numero => {
|
||||
this.props.direccion.numero = numero
|
||||
},
|
||||
extra: extra => {
|
||||
this.props.direccion.extra = extra
|
||||
},
|
||||
comuna: comuna => {
|
||||
this.props.direccion.comuna = comuna
|
||||
},
|
||||
region: region => {
|
||||
this.props.direccion.region = region
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
edit() {
|
||||
const uri = '{{$urls->api}}/venta/{{$venta_id}}/propietario/edit'
|
||||
const originales = {
|
||||
rut: '{{trim($propietario->rut)}}',
|
||||
nombres: '{{trim($propietario->nombres)}}',
|
||||
apellidos: {
|
||||
paterno: '{{trim($propietario->apellidos['paterno'])}}',
|
||||
materno: '{{trim($propietario->apellidos['materno'])}}'
|
||||
},
|
||||
direccion: {
|
||||
calle: '{{trim($propietario->datos->direccion->calle)}}',
|
||||
numero: '{{$propietario->datos->direccion->numero}}',
|
||||
extra: '{{trim($propietario->datos->direccion->extra)}}',
|
||||
comuna: '{{$propietario->datos->direccion->comuna->id}}'
|
||||
}
|
||||
}
|
||||
const data = {}
|
||||
const collator = new Intl.Collator('es')
|
||||
Object.entries(originales).forEach(([key, value]) => {
|
||||
if (key === 'apellidos') {
|
||||
Object.entries(value).forEach(([k, v]) => {
|
||||
const val = this.props[key][k]
|
||||
if (collator.compare(val, v) !== 0) {
|
||||
data[`apellido_${k}`] = val
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
if (key === 'direccion') {
|
||||
Object.entries(value).forEach(([k, v]) => {
|
||||
const val = this.props[key][k]
|
||||
if (collator.compare(val, v) !== 0) {
|
||||
data[k] = val
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
const val = this.props[key]
|
||||
if (collator.compare(val, value) !== 0) {
|
||||
data[key] = val
|
||||
}
|
||||
})
|
||||
if (Object.keys(data).length === 0) {
|
||||
// No changes
|
||||
propietario.redirect()
|
||||
return
|
||||
}
|
||||
const comuna_id = data.comunas[0].id
|
||||
if (comuna_id === original_id) {
|
||||
return
|
||||
if ('rut' in data) {
|
||||
data['dv'] = this.digito(data['rut'])
|
||||
}
|
||||
const parent = $('#comunas')
|
||||
parent.dropdown('set selected', comuna_id)
|
||||
})
|
||||
}
|
||||
function getComunas(region_id) {
|
||||
const parent = $('#comunas')
|
||||
parent.hide()
|
||||
const uri = '{{$urls->api}}/direcciones/region/' + region_id + '/comunas'
|
||||
return fetchAPI(uri).then(response => {
|
||||
if (response.ok) {
|
||||
return response.json()
|
||||
}
|
||||
}).then(data => {
|
||||
if (data.total === 0) {
|
||||
return
|
||||
}
|
||||
drawComunas({parent, comunas: data.comunas})
|
||||
})
|
||||
}
|
||||
function redirect() {
|
||||
window.location = '{{$urls->base}}/venta/{{$venta_id}}'
|
||||
}
|
||||
function changeDireccion() {
|
||||
const names = [
|
||||
'calle',
|
||||
'numero',
|
||||
'extra'
|
||||
]
|
||||
const originals = [
|
||||
'{{trim($propietario->datos->direccion->calle)}}',
|
||||
'{{trim($propietario->datos->direccion->numero)}}',
|
||||
'{{trim($propietario->datos->direccion->extra)}}'
|
||||
]
|
||||
const values = []
|
||||
names.forEach(name => {
|
||||
const val = $("[name='" + name + "']").val()
|
||||
values.push(val)
|
||||
})
|
||||
const collator = new Intl.Collator('es')
|
||||
if (collator.compare(originals.join(' '), values.join(' ')) !== 0) {
|
||||
findComunas(values.join(' ').trim())
|
||||
return fetchAPI(uri,
|
||||
{method: 'put', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data)}
|
||||
).then(response => {
|
||||
if (!response) {
|
||||
return
|
||||
}
|
||||
return response.json().then(data => {
|
||||
if (data.edited) {
|
||||
propietario.redirect()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
function watchChangeDireccion() {
|
||||
const watched = [
|
||||
'calle',
|
||||
'numero',
|
||||
'extra'
|
||||
]
|
||||
watched.forEach(name => {
|
||||
$("[name='" + name + "']").change(event => {
|
||||
changeDireccion()
|
||||
class Region {
|
||||
props
|
||||
comunas
|
||||
|
||||
constructor({id, descripcion, selected = false}) {
|
||||
this.props = {
|
||||
id,
|
||||
descripcion,
|
||||
selected
|
||||
}
|
||||
this.comunas = []
|
||||
}
|
||||
get() {
|
||||
return {
|
||||
comunas: () => {
|
||||
if (this.comunas.length > 0) {
|
||||
return new Promise(resolve => resolve())
|
||||
}
|
||||
const uri = '{{$urls->api}}/direcciones/region/' + this.props.id + '/comunas'
|
||||
return fetchAPI(uri).then(response => {
|
||||
if (!response) {
|
||||
return
|
||||
}
|
||||
return response.json().then(data => {
|
||||
if (data.total === 0) {
|
||||
return
|
||||
}
|
||||
this.comunas = data.comunas.map(comuna => {
|
||||
let selected = false
|
||||
if (comuna.id === {{$propietario->datos->direccion->comuna->id}}) {
|
||||
selected = true
|
||||
}
|
||||
return {
|
||||
id: comuna.id,
|
||||
descripcion: comuna.descripcion,
|
||||
selected
|
||||
}
|
||||
})
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
const propietario = {
|
||||
props: {
|
||||
ids: {},
|
||||
data: {},
|
||||
regiones: []
|
||||
},
|
||||
rut() {
|
||||
return {
|
||||
format: rut => {
|
||||
return Intl.NumberFormat('es-CL', {maximumFractionDigits: 0}).format(rut)
|
||||
},
|
||||
update: () => {
|
||||
const input = $("[name='rut']")
|
||||
const rut = input.val().replace(/\D/g, '')
|
||||
this.props.data.update().rut(rut)
|
||||
input.val(this.rut().format(rut))
|
||||
$('#digito').html(this.props.data.props.digito)
|
||||
}
|
||||
}
|
||||
},
|
||||
update() {
|
||||
return {
|
||||
propietario: () => {
|
||||
$("[name='rut']").val(this.rut().format(this.props.data.props.rut))
|
||||
$('#digito').html(this.props.data.props.digito)
|
||||
$("[name='nombres']").val(this.props.data.props.nombres)
|
||||
$("[name='apellido_paterno']").val(this.props.data.props.apellidos.paterno)
|
||||
$("[name='apellido_materno']").val(this.props.data.props.apellidos.materno)
|
||||
$("[name='calle']").val(this.props.data.props.direccion.calle)
|
||||
$("[name='numero']").val(this.props.data.props.direccion.numero)
|
||||
$("[name='extra']").val(this.props.data.props.direccion.extra)
|
||||
$('#region').val(this.props.data.props.direccion.region)
|
||||
this.update().region()
|
||||
},
|
||||
rut: () => {
|
||||
const input = $("[name='rut']")
|
||||
const rut = input.val().replace(/\D/g, '')
|
||||
this.props.data.update().rut(rut)
|
||||
input.val(this.rut().format(rut))
|
||||
$('#digito').html(this.props.data.props.digito)
|
||||
},
|
||||
region: () => {
|
||||
this.props.regiones.forEach(region => {
|
||||
region.props.selected = false
|
||||
})
|
||||
this.props.regiones.filter(region => region.props.id === this.props.data.props.direccion.region).forEach(region => {
|
||||
region.props.selected = true
|
||||
})
|
||||
const promises = []
|
||||
this.props.regiones.filter(region => region.props.selected).forEach(region => {
|
||||
promises.push(region.get().comunas())
|
||||
})
|
||||
Promise.all(promises).then(() => {
|
||||
this.draw().comunas()
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
change() {
|
||||
return {
|
||||
rut: () => {
|
||||
const rut = $("[name='rut']").val().replace(/\D/g, '')
|
||||
this.find().propietario(rut)
|
||||
},
|
||||
direccion: () => {
|
||||
const names = [
|
||||
'calle',
|
||||
'numero',
|
||||
'extra'
|
||||
]
|
||||
const originals = [
|
||||
'{{trim($propietario->datos->direccion->calle)}}',
|
||||
'{{trim($propietario->datos->direccion->numero)}}',
|
||||
'{{trim($propietario->datos->direccion->extra)}}'
|
||||
]
|
||||
const values = []
|
||||
names.forEach(name => {
|
||||
const val = $("[name='" + name + "']").val()
|
||||
values.push(val)
|
||||
})
|
||||
const collator = new Intl.Collator('es')
|
||||
if (collator.compare(originals.join(' '), values.join(' ')) !== 0) {
|
||||
this.find.comuna(values.join(' ').trim())
|
||||
}
|
||||
},
|
||||
region: event => {
|
||||
const region_id = $(event.currentTarget).val()
|
||||
propietario.props.regiones.forEach(region => {
|
||||
region.props.selected = false
|
||||
})
|
||||
const region = propietario.props.regiones.find(region => region.props.id === region_id)
|
||||
region.props.selected = true
|
||||
region.get().comunas().then(() => {
|
||||
propietario.draw().comunas()
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
find() {
|
||||
return {
|
||||
propietario: rut => {
|
||||
const uri = '{{$urls->api}}/ventas/propietario/' + rut
|
||||
return fetchAPI(uri).then(response => {
|
||||
if (!response) {
|
||||
this.draw().reset()
|
||||
return
|
||||
}
|
||||
return response.json().then(data => {
|
||||
if (data.propietario === null) {
|
||||
this.draw().reset()
|
||||
return
|
||||
}
|
||||
/*this.props.data.update().rut(data.propietario.rut)
|
||||
this.props.data.update().digito(data.propietario.dv)*/
|
||||
this.props.data.update().nombres(data.propietario.nombres)
|
||||
this.props.data.update().apellidos().paterno(data.propietario.apellidos.paterno)
|
||||
this.props.data.update().apellidos().materno(data.propietario.apellidos.materno)
|
||||
this.props.data.update().direccion().calle(data.propietario.direccion.calle)
|
||||
this.props.data.update().direccion().numero(data.propietario.direccion.numero)
|
||||
this.props.data.update().direccion().extra(data.propietario.direccion.extra)
|
||||
this.props.data.update().direccion().comuna(data.propietario.direccion.comuna.id)
|
||||
this.props.data.update().direccion().region(data.propietario.direccion.comuna.provincia.region.id)
|
||||
this.update().propietario()
|
||||
})
|
||||
})
|
||||
},
|
||||
comuna: direccion => {
|
||||
const original_id = $("[name='comuna']").val()
|
||||
const uri = '{{$urls->api}}/direcciones/comunas/find'
|
||||
const data = {direccion}
|
||||
return fetchAPI(uri,
|
||||
{method: 'post', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data)}
|
||||
).then(response => {
|
||||
if (!response) {
|
||||
return
|
||||
}
|
||||
return response.json().then(data => {
|
||||
if (data.total === 0) {
|
||||
return
|
||||
}
|
||||
const comuna_id = data.comunas[0].id
|
||||
if (comuna_id === original_id) {
|
||||
return
|
||||
}
|
||||
const parent = $('#comunas')
|
||||
parent.dropdown('set selected', comuna_id)
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
draw() {
|
||||
return {
|
||||
comunas: () => {
|
||||
const parent = $(this.props.ids.comuna)
|
||||
parent.html('')
|
||||
const region_id = $(this.props.ids.region).val()
|
||||
const comunas = this.props.regiones.find(region => region.props.id === region_id).comunas
|
||||
comunas.forEach(comuna => {
|
||||
const option = $('<option></option>')
|
||||
option.attr('value', comuna.id).html(comuna.descripcion)
|
||||
if (parseInt(comuna.id) === parseInt(this.props.data.props.direccion.comuna)) {
|
||||
option.prop('selected', true)
|
||||
}
|
||||
parent.append(option)
|
||||
})
|
||||
parent.show()
|
||||
parent.dropdown()
|
||||
},
|
||||
reset: () => {
|
||||
$("[name='nombres']").val('')
|
||||
$("[name='apellido_paterno']").val('')
|
||||
$("[name='apellido_materno']").val('')
|
||||
$("[name='calle']").val('')
|
||||
$("[name='numero']").val('')
|
||||
$("[name='extra']").val('')
|
||||
}
|
||||
}
|
||||
},
|
||||
form() {
|
||||
return {
|
||||
submit: event => {
|
||||
event.preventDefault()
|
||||
propietario.props.data.edit()
|
||||
return false
|
||||
}
|
||||
}
|
||||
},
|
||||
watch() {
|
||||
return {
|
||||
rut: () => {
|
||||
const rut = $("[name='rut']")
|
||||
rut.on('input', event => {
|
||||
propietario.rut().update()
|
||||
})
|
||||
rut.on('blur', event => {
|
||||
if (rut.val().length < 9) {
|
||||
return
|
||||
}
|
||||
propietario.change().rut()
|
||||
})
|
||||
},
|
||||
direccion: () => {
|
||||
const watched = [
|
||||
'calle',
|
||||
'numero',
|
||||
'extra'
|
||||
]
|
||||
watched.forEach(name => {
|
||||
$("[name='" + name + "']").change(event => {
|
||||
propietario.change().direccion()
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
},
|
||||
redirect() {
|
||||
console.debug('Redirecting')
|
||||
//window.location = '{{$urls->base}}/venta/{{$venta_id}}'
|
||||
},
|
||||
setup({ids, propietario}) {
|
||||
this.props.ids = ids
|
||||
this.props.data = propietario
|
||||
|
||||
$(this.props.ids.region).dropdown()
|
||||
$(this.props.ids.region).change(this.change().region)
|
||||
|
||||
$(this.props.ids.comuna).hide()
|
||||
$(this.props.ids.region).find('option').each((index, element) => {
|
||||
const id = $(element).val()
|
||||
const descripcion = $(element).text()
|
||||
const selected = $(element).prop('selected')
|
||||
this.props.regiones.push(new Region({id, descripcion, selected}))
|
||||
})
|
||||
this.update().region()
|
||||
|
||||
$(this.props.ids.forms.edit).submit(this.form().submit)
|
||||
this.watch().direccion()
|
||||
this.watch().rut()
|
||||
}
|
||||
}
|
||||
|
||||
$(document).ready(() => {
|
||||
propietario.setup({
|
||||
ids: {
|
||||
region: '#region',
|
||||
comuna: '#comunas',
|
||||
forms: {
|
||||
edit: '#edit_form'
|
||||
},
|
||||
buttons: {
|
||||
guardar: '#guardar_button'
|
||||
}
|
||||
},
|
||||
propietario: new Propietario({
|
||||
rut: '{{$propietario->rut}}',
|
||||
digito: '{{$propietario->dv}}',
|
||||
nombres: '{{$propietario->nombres}}',
|
||||
apellidos: {
|
||||
paterno: '{{$propietario->apellidos['paterno']}}',
|
||||
materno: '{{$propietario->apellidos['materno']}}'
|
||||
},
|
||||
direccion: {
|
||||
calle: '{{$propietario->datos->direccion->calle}}',
|
||||
numero: '{{$propietario->datos->direccion->numero}}',
|
||||
extra: '{{$propietario->datos->direccion->extra}}',
|
||||
comuna: '{{$propietario->datos->direccion->comuna->id}}',
|
||||
region: '{{$propietario->datos->direccion->comuna->provincia->region->id}}',
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
function editPropietario() {
|
||||
const uri = '{{$urls->api}}/ventas/propietario/{{$propietario->rut}}'
|
||||
const names = [
|
||||
'nombres',
|
||||
'apellido_paterno',
|
||||
'apellido_materno'
|
||||
]
|
||||
const values = [
|
||||
'{{trim($propietario->nombres)}}',
|
||||
'{{trim($propietario->apellidos['paterno'])}}',
|
||||
'{{trim($propietario->apellidos['materno'])}}'
|
||||
]
|
||||
const direccion_names = [
|
||||
'calle',
|
||||
'numero',
|
||||
'extra',
|
||||
'comuna'
|
||||
]
|
||||
const direccion_values = [
|
||||
'{{trim($propietario->datos->direccion->calle)}}',
|
||||
'{{$propietario->datos->direccion->numero}}',
|
||||
'{{trim($propietario->datos->direccion->extra)}}',
|
||||
'{{$propietario->datos->direccion->comuna->id}}'
|
||||
]
|
||||
const data = {}
|
||||
const collator = new Intl.Collator('es')
|
||||
names.forEach((name, index) => {
|
||||
const val = $("[name='" + name + "']").val()
|
||||
if (collator.compare(val, values[index]) !== 0) {
|
||||
console.debug(name, val, values[index], collator.compare(val, values[index]))
|
||||
data[name] = val
|
||||
}
|
||||
})
|
||||
direccion_names.forEach((name, index) => {
|
||||
const val = $("[name='" + name + "']").val()
|
||||
if (collator.compare(val, direccion_values[index]) !== 0) {
|
||||
if (typeof data['direccion'] === 'undefined') {
|
||||
data['direccion'] = {}
|
||||
}
|
||||
console.debug(name, val, direccion_values[index])
|
||||
data['direccion'][name] = val
|
||||
}
|
||||
})
|
||||
if (Object.keys(data).length === 0) {
|
||||
redirect()
|
||||
return
|
||||
}
|
||||
return fetchAPI(uri,
|
||||
{method: 'put', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(data)}
|
||||
).then(response => {
|
||||
if (response.ok) {
|
||||
redirect()
|
||||
}
|
||||
})
|
||||
}
|
||||
$(document).ready(() => {
|
||||
const regiones = $("select[name='region']")
|
||||
regiones.dropdown()
|
||||
regiones.change(event => {
|
||||
const region_id = $(event.currentTarget).val()
|
||||
getComunas(region_id)
|
||||
})
|
||||
$('#comunas').hide()
|
||||
getComunas({{$propietario->datos->direccion->comuna->provincia->region->id}})
|
||||
$('#edit_form').submit(event => {
|
||||
event.preventDefault()
|
||||
editPropietario({{$propietario->rut}})
|
||||
return false
|
||||
})
|
||||
$('#guardar_button').click(event => {
|
||||
editPropietario({{$propietario->rut}})
|
||||
})
|
||||
watchChangeDireccion()
|
||||
})
|
||||
</script>
|
||||
@endpush
|
||||
|
||||
Reference in New Issue
Block a user