Mejora al cargar las transacciones por tramos

api/common/Controller/Cuentas.php

@@ -90,25 +90,11 @@ class Cuentas {
     ];
     return $this->withJson($response, $output);
   }
-  public function transacciones(Request $request, Response $response, Factory $factory, $cuenta_id): Response {
+  public function transacciones(Request $request, Response $response, Factory $factory, $cuenta_id, $limit = null, $start = 0): Response {
     $cuenta = $factory->find(Cuenta::class)->one($cuenta_id);
-    $cargos = null;
-    $abonos = null;
     $transacciones = null;
     if ($cuenta !== null) {
-      $cargos = $cuenta->cargos();
+      $transacciones = $cuenta->transacciones($limit, $start);
-      if ($cargos !== null) {
-        array_walk($cargos, function(&$item) {
-          $item = $item->toArray();
-        });
-      }
-      $abonos = $cuenta->abonos();
-      if ($abonos !== null) {
-        array_walk($abonos, function(&$item) {
-          $item = $item->toArray();
-        });
-      }
-      $transacciones = $cuenta->transacciones();
       if (count($transacciones)) {
         array_walk($transacciones, function(&$item) {
           $item = $item->toArray();
@@ -118,8 +104,19 @@ class Cuentas {
     $output = [
       'input' => $cuenta_id,
       'cuenta' => $cuenta?->toArray(),
-      'cargos' => $cargos,
+      'transacciones' => $transacciones
-      'abonos' => $abonos,
+    ];
+    return $this->withJson($response, $output);
+  }
+  public function transaccionesAmount(Request $request, Response $response, Factory $factory, $cuenta_id): Response {
+    $cuenta = $factory->find(Cuenta::class)->one($cuenta_id);
+    $transacciones = 0;
+    if ($cuenta !== null) {
+      $transacciones = count($cuenta->transacciones());
+    }
+    $output = [
+      'input' => $cuenta_id,
+      'cuenta' => $cuenta?->toArray(),
       'transacciones' => $transacciones
     ];
     return $this->withJson($response, $output);

api/composer.json

@@ -9,7 +9,7 @@
         "nyholm/psr7-server": "^1.0",
         "zeuxisoo/slim-whoops": "^0.7.3",
         "provm/controller": "^1.0",
-        "provm/models": "1.0.0-rc2",
+        "provm/models": "^1.0.0-rc3",
         "nesbot/carbon": "^2.50"
     },
     "require-dev": {

api/resources/routes/cuentas.php

@@ -7,7 +7,10 @@ $app->group('/cuentas', function($app) {
 });
 $app->group('/cuenta/{cuenta_id}', function($app) {
   $app->get('/entradas', [Cuentas::class, 'entradas']);
-  $app->get('/transacciones', [Cuentas::class, 'transacciones']);
+  $app->group('/transacciones', function($app) {
+    $app->get('/amount', [Cuentas::class, 'transaccionesAmount']);
+    $app->get('[/{limit:[0-9]+}[/{start:[0-9]+}]]', [Cuentas::class, 'transacciones']);
+  });
   $app->put('/edit', [Cuentas::class, 'edit']);
   $app->delete('/delete', [Cuentas::class, 'delete']);
   $app->get('[/]', [Cuentas::class, 'show']);

api/src/Cuenta.php

@@ -43,25 +43,23 @@ class Cuenta extends Model {
     return $this->abonos;
   }
   protected $transacciones;
-  public function transacciones() {
+  public function transacciones($limit = null, $start = 0) {
     if ($this->transacciones === null) {
-      $this->transacciones = [];
+      $transacciones = Model::factory(Transaccion::class)
-      if ($this->abonos() !== null) {
+        ->join('cuentas', 'cuentas.id = transacciones.desde_id OR cuentas.id = transacciones.hasta_id')
-        $this->transacciones = array_merge($this->transacciones, $this->abonos());
+        ->whereEqual('cuentas.id', $this->id)
+        ->orderByAsc('transacciones.fecha');
+      if ($limit !== null) {
+        $transacciones = $transacciones->limit($limit)
+          ->offset($start);
       }
-      if ($this->cargos() !== null) {
+      $this->transacciones = $transacciones->findMany();
-        $this->transacciones = array_merge($this->transacciones, array_map(function($item) {
+      foreach ($this->transacciones as &$transaccion) {
-          $item->valor = - $item->valor;
+        $transaccion->setFactory($this->factory);
-          return $item;
+        if ($transaccion->desde_id === $this->id) {
-        }, $this->cargos()));
+          $transaccion->valor = - $transaccion->valor;
         }
-      usort($this->transacciones, function($a, $b) {
-        $d = $a->fecha()->diffInDays($b->fecha(), false);
-        if ($d === 0) {
-          return $a->valor - $b->valor;
       }
-        return $d;
-      });
     }
     return $this->transacciones;
   }

ui/public/assets/scripts/cuentas.show.js

@@ -8,24 +8,42 @@ const transacciones = {
   get: function() {
     return {
       transacciones: () => {
-        return $.ajax({
+        let promises = []
-          url: _urls.api + '/cuenta/' + this.cuenta_id + '/transacciones',
+        $.ajax({
+          url: _urls.api + '/cuenta/' + this.cuenta_id + '/transacciones/amount',
           method: 'GET',
           dataType: 'json'
         }).then((data) => {
-          if (data.cuenta === null) {
+          const amount = data.transacciones
+          const step = 100
+          for (let i = 0; i < amount; i += step) {
+            promises.push($.ajax({
+              url: _urls.api + '/cuenta/' + this.cuenta_id + '/transacciones/' + step + '/' + i,
+              method: 'GET',
+              dataType: 'json'
+            }))
+          }
+          Promise.all(promises).then((data_arr) => {
+            if (data_arr[0].cuenta === null) {
               return
             }
-          this.cuenta = data.cuenta
+            this.cuenta = data_arr[0].cuenta
             this.saldo = this.cuenta.saldo
             $('#cuenta').html(this.cuenta.nombre + ' (' + this.cuenta.categoria.nombre + ')')
+            this.transacciones = []
+            data_arr.forEach(data => {
               if (data.transacciones === null || data.transacciones.length == 0) {
                 return
               }
-          this.transacciones = data.transacciones
+              this.transacciones.push(...data.transacciones)
+            })
+            this.transacciones.sort((a, b) => {
+              return (new Date(b.fecha)) - (new Date(a.fecha))
+            })
           }).then(() => {
             this.draw()
           })
+        })
       },
       cuentas: () => {
         return $.ajax({
@@ -53,7 +71,7 @@ const transacciones = {
     const parent = $(this.id)
     parent.html('')
     $.each(this.transacciones, (i, el) => {
-      const fuente = (el.valor < 0) ? el.desde : el.hasta
+      const fuente = (el.valor < 0) ? el.hasta : el.desde
       parent.append(
         $('<tr></tr>').append(
           $('<td></td>').html(el.fechaFormateada)
@@ -64,9 +82,9 @@ const transacciones = {
         ).append(
           $('<td></td>').html(el.glosa + '<br />' + el.detalle)
         ).append(
-          $('<td></td>').attr('class', 'right aligned').html((el.valor < 0) ? el.valorFormateado.replace('-', '') : '')
+          $('<td></td>').attr('class', 'right aligned').html((el.valor < 0) ? '' : el.valorFormateado.replace('-', ''))
         ).append(
-          $('<td></td>').attr('class', 'right aligned').html((el.valor < 0) ? '' : el.valorFormateado)
+          $('<td></td>').attr('class', 'right aligned').html((el.valor < 0) ? el.valorFormateado.replace('-', '') : '')
         ).append(
           $('<td></td>').attr('class', 'right aligned').html(format.format(this.saldo))
         )

ui/public/assets/scripts/home.js

@@ -6,7 +6,7 @@ const cuentas = {
       parent: () => {
         let parent = $(this.id)
         if (parent.length === 0) {
-          const table = $('<table></table>').attr('class', 'ui table').append(
+          const table = $('<table></table>').attr('class', 'ui striped table').append(
             $('<thead></thead>').append(
               $('<tr></tr>').append(
                 $('<th></th>').html('Cuenta')

ui/resources/views/cuentas/show.blade.php

@@ -34,6 +34,15 @@
       </tr>
     </thead>
     <tbody id="transacciones">
+      <tr>
+        <td colspan="7">
+          <div class="ui active dimmer">
+            <div class="ui indeterminate elastic text loader">
+              Buscando los datos
+            </div>
+          </div>
+        </td>
+      </tr>
     </tbody>
   </table>