@extends('fuentes.base')

@section('fuentes_title')
  <span id="fuente"></span>
@endsection

@section('fuentes_content')
  <table class="ui table">
    <thead>
      <tr>
        <th>
          Fecha
        </th>
        <th>
          Cuenta
        </th>
        <th>
          Glosa
        </th>
        <th>
          Detalle
        </th>
        <th class="right aligned">
          Valor
        </th>
        <th class="right aligned">
          <button class="ui tiny green circular icon button">
            <i class="plus icon"></i>
          </button>
        </th>
      </tr>
    </thead>
    <tbody id="entradas">
    </tbody>
  </table>
  <div class="ui modal">
    <i class="close icon"></i>
    <div class="content">
      <form class="ui form">
        <div class="field">
          <label>Fecha</label>
          <div class="ui calendar">
            <div class="ui input left icon">
              <i class="calendar icon"></i>
              <input type="text" name="fecha" placeholder="Fecha" />
            </div>
          </div>
        </div>
        <div class="field">
          <label>Cuenta</label>
          <select name="cuenta"></select>
        </div>
        <div class="field">
          <label>Glosa</label>
          <input type="text" name="glosa" />
        </div>
        <div class="field">
          <label>Detalle</label>
          <input type="text" name="detalle" />
        </div>
        <div class="field">
          <label>Valor</label>
          <input type="text" name="valor" />
        </div>
        <button class="ui icon button">
          <i class="plus icon"></i>
        </button>
      </form>
    </div>
  </div>
@endsection

@push('scripts')
  <script type="text/javascript" src="{{$urls->scripts}}/fuentes.show.js"></script>
  <script type="text/javascript">
    $(document).ready(() => {
      entradas.fuente = {{$fuente_id}}
      entradas.setup()
    })
  </script>
@endpush