Separacion de objetos
This commit is contained in:
Juan Pablo Vial
@ -0,0 +1,189 @@
|
||||
<script>
|
||||
class Propietario {
|
||||
props = {
|
||||
index: 0,
|
||||
proporcion: 0,
|
||||
rut: '',
|
||||
nombre: '',
|
||||
direccion: '',
|
||||
comuna: ''
|
||||
}
|
||||
|
||||
constructor(props) {
|
||||
this.props = props
|
||||
}
|
||||
|
||||
get comuna() {
|
||||
return $('#comuna_propietario'+this.props.index).dropdown('get text') ?? this.props.comuna
|
||||
}
|
||||
update() {
|
||||
return {
|
||||
proporcion: (valor) => {
|
||||
this.props.proporcion = valor
|
||||
facturas.venta.update().totalPropietarios()
|
||||
facturas.draw().facturas()
|
||||
},
|
||||
rut: rut => {
|
||||
this.props.rut = rut
|
||||
facturas.venta.update().totalPropietarios()
|
||||
facturas.draw().facturas()
|
||||
},
|
||||
nombre: nombre => {
|
||||
this.props.nombre = nombre
|
||||
facturas.venta.update().totalPropietarios()
|
||||
facturas.draw().facturas()
|
||||
},
|
||||
direccion: direccion => {
|
||||
this.props.direccion = direccion
|
||||
facturas.venta.update().totalPropietarios()
|
||||
facturas.draw().facturas()
|
||||
},
|
||||
comuna: comuna => {
|
||||
this.props.comuna = comuna
|
||||
facturas.venta.update().totalPropietarios()
|
||||
facturas.draw().facturas()
|
||||
},
|
||||
}
|
||||
}
|
||||
watch() {
|
||||
return {
|
||||
propietario: () => {
|
||||
this.watch().proporcion()
|
||||
this.watch().rut()
|
||||
this.watch().nombre()
|
||||
this.watch().direccion()
|
||||
this.watch().comuna()
|
||||
},
|
||||
proporcion: () => {
|
||||
document.getElementById('proporcion'+this.props.index).addEventListener('input', inputEvent => {
|
||||
const newValue = inputEvent.currentTarget.value / 100
|
||||
if (newValue === this.props.proporcion) {
|
||||
return
|
||||
}
|
||||
const saldo = facturas.venta.props.propietarios.reduce((sum, propietario) => sum + propietario.props.proporcion, 0) - this.props.proporcion
|
||||
if (saldo + newValue > 1) {
|
||||
return
|
||||
}
|
||||
this.update().proporcion(newValue)
|
||||
})
|
||||
},
|
||||
rut: () => {
|
||||
document.getElementById('rut'+this.props.index).addEventListener('input', inputEvent => {
|
||||
const rut = inputEvent.currentTarget.value
|
||||
if (rut === this.props.rut) {
|
||||
return
|
||||
}
|
||||
this.update().rut(rut)
|
||||
})
|
||||
},
|
||||
nombre: () => {
|
||||
document.getElementById('propietario'+this.props.index).addEventListener('input', inputEvent => {
|
||||
const nombre = inputEvent.currentTarget.value
|
||||
if (nombre === this.props.nombre) {
|
||||
return
|
||||
}
|
||||
this.update().nombre(nombre)
|
||||
})
|
||||
},
|
||||
direccion: () => {
|
||||
document.getElementById('direccion_propietario'+this.props.index).addEventListener('input', inputEvent => {
|
||||
const direccion = inputEvent.currentTarget.value
|
||||
if (direccion === this.props.direccion) {
|
||||
return
|
||||
}
|
||||
this.update().direccion(direccion)
|
||||
})
|
||||
},
|
||||
comuna: () => {
|
||||
if ($('#comuna_propietario'+this.props.index).dropdown('get value')) {
|
||||
return
|
||||
}
|
||||
$('#comuna_propietario'+this.props.index).dropdown({
|
||||
fireOnInit: true,
|
||||
forceSelection: true,
|
||||
onChange: (value, text) => {
|
||||
this.update().comuna(value)
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
draw() {
|
||||
return {
|
||||
propietario: () => {
|
||||
const output = [`<div class="fields" data-index="${this.props.index}">`]
|
||||
output.push(this.draw().proporcion())
|
||||
output.push(this.draw().rut())
|
||||
output.push(this.draw().nombre())
|
||||
output.push('</div>')
|
||||
output.push(`<div class="fields" data-index="${this.props.index}">`)
|
||||
output.push('<div class="three wide field"></div>')
|
||||
output.push(this.draw().direccion())
|
||||
output.push(this.draw().comuna())
|
||||
output.push('</div>')
|
||||
return output.join("\n")
|
||||
},
|
||||
proporcion: () => {
|
||||
return [
|
||||
'<div class="two wide field">',
|
||||
`<label for="proporcion${this.props.index}">Proporción Factura</label>`,
|
||||
'<div class="ui right labeled input">',
|
||||
`<input type="number" name="proporcion${this.props.index}" id="proporcion${this.props.index}" value="${this.props.proporcion*100}" max="100" min="0" />`,
|
||||
'<div class="ui basic icon label">',
|
||||
'<i class="percent icon"></i>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
].join("\n")
|
||||
},
|
||||
rut: () => {
|
||||
return [
|
||||
'<div class="three wide field">',
|
||||
`<label for="rut${this.props.index}">RUT</label>`,
|
||||
'<div class="ui input">',
|
||||
`<input type="text" name="rut${this.props.index}" id="rut${this.props.index}" value="${this.props.rut.toUpperCase()}" />`,
|
||||
'</div>',
|
||||
'</div>',
|
||||
].join("\n")
|
||||
},
|
||||
nombre: () => {
|
||||
return [
|
||||
'<div class="six wide field">',
|
||||
`<label for="propietario${this.props.index}">Propietario</label>`,
|
||||
'<div class="ui input">',
|
||||
`<input type="text" name="propietario${this.props.index}" id="propietario${this.props.index}" value="${this.props.nombre}" />`,
|
||||
'</div>',
|
||||
'</div>',
|
||||
].join("\n")
|
||||
},
|
||||
direccion: () => {
|
||||
return [
|
||||
'<div class="six wide field">',
|
||||
`<label for="direccion_propietario${this.props.index}">Dirección</label>`,
|
||||
'<div class="ui input">',
|
||||
`<input type="text" name="direccion_propietario${this.props.index}" id="direccion_propietario${this.props.index}" value="${this.props.direccion}" />`,
|
||||
'</div>',
|
||||
'</div>',
|
||||
].join("\n")
|
||||
},
|
||||
comuna: () => {
|
||||
return [
|
||||
'<div class="three wide field">',
|
||||
`<label for="comuna_propietario${this.props.index}">Comuna</label>`,
|
||||
`<div class="ui search selection dropdown" id="comuna_propietario${this.props.index}">`,
|
||||
`<input type="hidden" name="comuna_propietario${this.props.index}" value="${this.props.comuna}" />`,
|
||||
'<i class="dropdown icon"></i>',
|
||||
'<div class="default text">Comuna</div>',
|
||||
'<div class="menu">',
|
||||
@foreach ($comunas as $comuna)
|
||||
'<div class="item" data-value="{{ $comuna->id }}">{{ $comuna->descripcion }}</div>',
|
||||
@endforeach
|
||||
'</div>',
|
||||
'</div>',
|
||||
'</div>',
|
||||
].join("\n")
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user