develop (#45)

Co-authored-by: Juan Pablo Vial <jpvialb@incoviba.cl>
Reviewed-on: #45

app/resources/views/contabilidad/movimientos.blade.php

@@ -0,0 +1,140 @@
+@extends('layout.base')
+
+@include('layout.head.styles.datatables')
+@include('layout.head.styles.datatables.searchbuilder')
+@include('layout.head.styles.datatables.buttons')
+
+@push('page_styles')
+    <style>
+        #table_container {
+            margin-left: 1rem;
+            margin-right: 1rem;
+        }
+    </style>
+@endpush
+
+@section('page_content')
+    <div class="ui container">
+        <h1 class="ui header">Movimientos Contables</h1>
+        <form class="ui form" id="movimientos_form">
+            <div class="fields">
+                <div class="six wide field">
+                    <label for="sociedad">Sociedad</label>
+                    <div class="ui selection search multiple dropdown" id="sociedades">
+                        <input type="hidden" name="sociedad[]"/>
+                        <i class="dropdown icon"></i>
+                        <div class="default text">Sociedad</div>
+                        <div class="menu">
+                            @foreach($sociedades as $sociedad)
+                                <div class="item" data-value="{{$sociedad->rut}}">{{$sociedad->razon}}</div>
+                            @endforeach
+                        </div>
+                    </div>
+                </div>
+                <div class="three wide field">
+                    <label for="mes">Mes</label>
+                    <div class="ui calendar" id="mes">
+                        <div class="ui right icon input">
+                            <input type="text" name="mes"/>
+                            <i class="calendar icon"></i>
+                        </div>
+                    </div>
+                </div>
+                <div class="field">
+                    <label></label>
+                    <button class="ui circular icon button">
+                        <i class="sync alternate icon"></i>
+                    </button>
+                </div>
+            </div>
+        </form>
+    </div>
+    <div id="table_container">
+        <table id="tabla_movimientos" class="ui compact table">
+            <thead>
+            <tr>
+                <th>Sigla</th>
+                <th>Banco</th>
+                <th>Cuenta</th>
+                <th>Fecha</th>
+                <th>ISO Fecha</th>
+                <th>Mes</th>
+                <th>Año</th>
+                <th class="right aligned">Valor</th>
+                <th>Valor</th>
+                <th>Glosa</th>
+                <th>Centro de Costo</th>
+                <th>Categoría</th>
+                <th>Detalle</th>
+                <th>RUT</th>
+                <th>Nombre</th>
+                <th>Identificador</th>
+                <th>Editar</th>
+            </tr>
+            </thead>
+            <tbody id="movimientos"></tbody>
+        </table>
+    </div>
+    @include('contabilidad.movimientos.edit_modal')
+@endsection
+
+@include('layout.body.scripts.datatables')
+@include('layout.body.scripts.datatables.searchbuilder')
+@include('layout.body.scripts.datatables.buttons')
+@include('layout.body.scripts.rut')
+
+@push('page_scripts')
+    <script>
+        class CentrosCostos {
+            static data = []
+            static get() {
+                if (this.data.length === 0) {
+                    this.data = JSON.parse('{!! json_encode($centros) !!}')
+                }
+                return this.data
+            }
+        }
+    </script>
+@endpush
+@push('page_scripts')
+    @include('contabilidad.movimientos.scripts.event_handler')
+    @include('contabilidad.movimientos.scripts.loading_handler')
+    @include('contabilidad.movimientos.scripts.control_form')
+    @include('contabilidad.movimientos.scripts.movimientos_table')
+    @include('contabilidad.movimientos.scripts.edit_modal')
+    @include('contabilidad.movimientos.scripts.edit_form')
+    @include('contabilidad.movimientos.scripts.movimientos_handler')
+    @include('contabilidad.movimientos.scripts.results_handler')
+    <script>
+        const app = {
+            handlers: {},
+            setup() {
+                this.handlers.results = new ResultsHandler()
+                this.handlers.loading = new LoadingHandler({id: '#movimientos_form'})
+                this.handlers.movimientos = new MovimientosHandler({
+                    urls: {
+                        get: '{{$urls->api}}/contabilidad/movimientos/sociedad/mes',
+                        edit: '{{$urls->api}}/contabilidad/movimientos/edit',
+                        remove: '{{$urls->api}}/contabilidad/movimiento',
+                    },
+                    loadingHandler: this.handlers.loading,
+                    resultsHandler: this.handlers.results
+                })
+                this.handlers.forms = {
+                    edit: new EditForm({ids: {modal: '#movimientos_modal', data: '#movimientos_data', form: '#movimientos_edit',}})
+                }
+                this.handlers.modals = {
+                    edit: new EditModal({ids: {modal: '#movimientos_modal'}, editForm: this.handlers.forms.edit})
+                }
+                this.handlers.events = new EventHandler({movimientosHandler: this.handlers.movimientos, modalHandler: this.handlers.modals.edit})
+                this.handlers.table = new MovimientosTable({ids: {table: '#tabla_movimientos', buttons: {edit: '.edit_button', remove: '.remove_button'}}, eventHandler: this.handlers.events})
+                this.handlers.forms.control = new ControlForm({ids: {form: '#movimientos_form', sociedades: '#sociedades', mes: '#mes',},})
+
+                this.handlers.forms.edit.setup()
+            }
+        }
+        $(document).ready(() => {
+            app.setup()
+        })
+    </script>
+@endpush