Separacion de objetos

2025-01-17 00:07:45 -03:00
parent 055bf6ab20
commit d74beb5518
5 changed files with 1199 additions and 1027 deletions
--- a/app/resources/views/ventas/facturacion/show/unidad.blade.php
+++ b/app/resources/views/ventas/facturacion/show/unidad.blade.php
@ -0,0 +1,125 @@
+<script>
+    class Unidad {
+        props = {
+            id: 0,
+            tipo: '',
+            descripcion: '',
+            prorrateo: 0,
+            propiedad_unidad_id: 0,
+            valor: 0
+        }
+
+        constructor(props) {
+            this.props = props
+        }
+
+        descripcion(proporcion = 1) {
+            return [this.props.tipo, this.props.descripcion, `[UF ${facturas.formatters.ufs.format(this.props.valor * proporcion)}]`].join(' ')
+        }
+        update() {
+            return {
+                precio: newValue => {
+                    const url = '{{$urls->api}}/ventas/propiedades/unidad/' + this.props.propiedad_unidad_id + '/edit'
+                    const method = 'post'
+                    const body = new FormData()
+                    body.set('valor', newValue)
+                    return fetchAPI(url, {method, body}).then(response => {
+                        if (!response) {
+                            return
+                        }
+                        return response.json().then(json => {
+                            if (!json.edited) {
+                                return
+                            }
+                            this.props.valor = parseFloat(json.input.valor)
+                        })
+                    })
+                },
+                prorrateo: newValue => {
+                    const url = '{{$urls->api}}/ventas/unidad/' + this.props.id + '/prorrateo'
+                    const method = 'post'
+                    const body = new FormData()
+                    body.set('prorrateo', newValue)
+                    return fetchAPI(url, {method, body}).then(response => {
+                        if (!response) {
+                            return
+                        }
+                        return response.json().then(json => {
+                            if (!json.edited) {
+                                return
+                            }
+                            this.props.prorrateo = json.input.prorrateo
+                            document.getElementById('prorrateo'+this.props.id).parentElement.parentElement.innerHTML = ''
+                        })
+                    })
+                }
+            }
+        }
+        watch() {
+            return {
+                unidad: () => {
+                    this.watch().precio()
+                    this.watch().prorrateo()
+                },
+                precio: () => {
+                    document.getElementById('precio'+this.props.propiedad_unidad_id).addEventListener('change', changeEvent => {
+                        const newValue = changeEvent.currentTarget.value
+                        if (newValue === this.props.valor) {
+                            return
+                        }
+                        this.update().precio(newValue).then(() => {
+                            facturas.venta.update().totalUnidades()
+                            facturas.draw().facturas()
+                        })
+                    })
+                },
+                prorrateo: () => {
+                    const input = document.getElementById('prorrateo'+this.props.id)
+                    if (input === null) {
+                        return
+                    }
+                    input.addEventListener('change', changeEvent => {
+                        const newValue = changeEvent.currentTarget.value
+                        if (newValue === this.props.prorrateo) {
+                            return
+                        }
+                        this.update().prorrateo(newValue).then(() => {
+                            facturas.venta.update().totalUnidades()
+                            facturas.draw().facturas()
+                        })
+                    })
+                }
+            }
+        }
+        draw() {
+            return {
+                precio: () => {
+                    return [
+                        '<div class="three wide field">',
+                        '<label for="precio'+this.props.propiedad_unidad_id+'">Precio<br /> '+this.props.tipo+' '+this.props.descripcion+'</label>',
+                        '<div class="ui left labeled input" id="input'+this.props.propiedad_unidad_id+'">',
+                        '<div class="ui basic label">UF</div>',
+                        '<input class="price" type="text" name="precio'+this.props.propiedad_unidad_id+'" id="precio'+this.props.propiedad_unidad_id+'" data-id="'+this.props.propiedad_unidad_id+'" value="'+this.props.valor+'" />',
+                        '</div>',
+                        '</div>'
+                    ].join("\n")
+                },
+                prorrateo: () => {
+                    const output = []
+                    output.push('<div class="three wide field">')
+                    if (this.props.prorrateo === 0) {
+                        output.push(...[
+                            '<label for="prorrateo'+this.props.id+'">Prorrateo<br /> '+this.props.tipo+' '+this.props.descripcion+'</label>',
+                            '<div class="ui right labeled input">',
+                            '<input class="prorrateo" type="text" id="prorrateo'+this.props.id+'" value="'+this.props.prorrateo+'" />',
+                            '<div class="ui basic label">%</div>',
+                            '</div>'
+                        ])
+                    }
+                    output.push('</div>')
+                    return output.join("\n")
+                }
+            }
+        }
+    }
+</script>