From d5a351285201a043e94a1a36083333b9fc7bded5 Mon Sep 17 00:00:00 2001
From: Juan Pablo Vial <jpvialb@incoviba.cl>
Date: Tue, 22 Apr 2025 11:35:56 -0400
Subject: [PATCH] Barras de progreso

---
 .../brokers/contracts/show.blade.php          | 58 +++++++++++++++----
 1 file changed, 46 insertions(+), 12 deletions(-)

diff --git a/app/resources/views/proyectos/brokers/contracts/show.blade.php b/app/resources/views/proyectos/brokers/contracts/show.blade.php
index 68af83e..25fb4cf 100644
--- a/app/resources/views/proyectos/brokers/contracts/show.blade.php
+++ b/app/resources/views/proyectos/brokers/contracts/show.blade.php
@@ -73,6 +73,11 @@
     </div>
     <div class="ui very basic segment">
         <div class="ui active inline loader"></div>
+        <div class="ui indicating progress" id="load_progress">
+            <div class="bar">
+                <div class="progress"></div>
+            </div>
+        </div>
     </div>
     <div id="results">
         <div class="ui top attached tabular menu">
@@ -80,6 +85,9 @@
             <a class="item" data-tab="lineas">Líneas</a>
             <a class="item" data-tab="unidades">Unidades</a>
         </div>
+        <div class="ui top attached indicating progress" id="values_progress">
+            <div class="bar"></div>
+        </div>
         <div class="ui bottom attached tab basic fitted segment active" data-tab="tipos">
             @include('proyectos.brokers.contracts.show.tipo')
         </div>
@@ -101,7 +109,9 @@
         const units = {
             ids: {
                 units: '',
-                loader: ''
+                loader: '',
+                progress: '',
+                load_progress: ''
             },
             data: {
                 project_id: {{ $contract->project->id }},
@@ -132,7 +142,7 @@
                             })
                         })
                     },
-                    promotions: () => {
+                    promotions: progress_bar => {
                         const chunkSize = 100
                         const chunks = []
                         for (let i = 0; i < units.data.units.length; i += chunkSize) {
@@ -145,6 +155,7 @@
                             const body = new FormData()
                             chunk.forEach(id => body.append('unidad_ids[]', id))
                             promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
+                                progress_bar.progress('increment', json.input.unidad_ids.length)
                                 if (json.unidades.length === 0) {
                                     return
                                 }
@@ -156,8 +167,11 @@
                         })
                         return Promise.all(promises)
                     },
-                    prices: () => {
+                    prices: progress_bar => {
                         const unsold = [...units.data.units.filter(unit => !unit.sold), ...units.data.units.filter(unit => unit.sold && unit.proyecto_tipo_unidad.tipo_unidad.descripcion !== 'departamento')]
+                        const current_total = progress_bar.progress('get total')
+                        progress_bar.progress('set total', current_total + unsold.length)
+
                         const chunkSize = 100
                         const chunks = []
                         for (let i = 0; i < unsold.length; i += chunkSize) {
@@ -170,6 +184,7 @@
                             const body = new FormData()
                             chunk.forEach(id => body.append('unidad_ids[]', id))
                             promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
+                                progress_bar.progress('increment', json.input.unidad_ids.length)
                                 if (json.precios.length === 0) {
                                     return
                                 }
@@ -181,8 +196,10 @@
                         })
                         return Promise.all(promises)
                     },
-                    values: () => {
+                    values: progress_bar => {
                         const sold = units.data.units.filter(unit => unit.sold && unit.proyecto_tipo_unidad.tipo_unidad.descripcion === 'departamento')
+                        progress_bar.progress('set total', sold.length)
+
                         const chunkSize = 10
                         const chunks = []
                         for (let i = 0; i < sold.length; i += chunkSize) {
@@ -195,6 +212,7 @@
                             const body = new FormData()
                             chunk.forEach(id => body.append('unidad_ids[]', id))
                             promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
+                                progress_bar.progress('increment', json.input.unidad_ids.length)
                                 if (json.ventas.length === 0) {
                                     return
                                 }
@@ -226,7 +244,7 @@
                         })
                         return Promise.all(promises)
                     },
-                    sold: () => {
+                    sold: progress_bar => {
                         const chunkSize = 100
                         const chunks = []
                         for (let i = 0; i < units.data.units.length; i += chunkSize) {
@@ -239,6 +257,7 @@
                             const body = new FormData()
                             chunk.forEach(id => body.append('unidad_ids[]', id))
                             promises.push(APIClient.fetch(url, {method, body}).then(response => response.json()).then(json => {
+                                progress_bar.progress('increment', json.input.unidad_ids.length)
                                 if (json.estados.length === 0) {
                                     return
                                 }
@@ -282,20 +301,35 @@
                     }
                 })
                 document.getElementById(units.ids.results).style.visibility = 'hidden'
+                document.getElementById(units.ids.progress).style.visibility = 'hidden'
+                document.getElementById(units.ids.load_progress).style.visibility = 'hidden'
 
                 units.get().units().then(() => {
-                    units.get().promotions().then(() => {
-                        units.get().sold().then(() => {
-                            units.get().prices().then(() => {
+                    document.getElementById(units.ids.load_progress).style.visibility = 'visible'
+
+                    const units_length = units.data.units.length
+                    const progress_bar = $(`#${units.ids.load_progress}`)
+                    progress_bar.progress({ total: units_length * 2 })
+
+                    $(units.ids.loader).hide()
+
+                    units.get().promotions(progress_bar).then(() => {
+                        units.get().sold(progress_bar).then(() => {
+                            units.get().prices(progress_bar).then(() => {
                                 document.getElementById(units.ids.results).style.visibility = 'visible'
 
+                                $(units.ids.loader).parent().remove()
+
                                 units.draw().units()
                                 units.draw().tipos()
                                 units.draw().lineas()
 
-                                units.get().values().then(() => {
-                                    $(units.ids.loader).hide()
-                                    $(units.ids.loader).parent().hide()
+                                document.getElementById(units.ids.progress).style.visibility = 'visible'
+                                const progress_bar = $(`#${units.ids.progress}`)
+                                progress_bar.progress()
+
+                                units.get().values(progress_bar).then(() => {
+                                    document.getElementById(units.ids.progress).remove()
 
                                     units.draw().units()
                                     units.draw().tipos()
@@ -308,7 +342,7 @@
             }
         }
         $(document).ready(function () {
-            units.setup({results: 'results', loader: '.ui.loader'})
+            units.setup({results: 'results', loader: '.ui.loader', progress: 'values_progress', load_progress: 'load_progress'})
         })
     </script>
 @endpush