@extends('app')


@section('content')

<div class="container">
  <div class="row">
    <div class="col-xs-12">
      <h1 class="h1">Cash Operacional / {{ $account->name }}</h1>
    </div>
  </div>
  {!! Form::open([
    'class' => 'form-datos',
    'action' => ['OperationalCashController@store', $account],
  ]) !!}
    <div class="row">
      <div class="col-sm-6">
        @if($account->periodicity === 'daily')
          <div class="form-group {{ $errors->has('date') ? ' has-error' : '' }}">
            {!! Form::label('date', 'Fecha', ['class' => 'control-label']) !!}
            {!! Form::date('date', Carbon\Carbon::today()->format('Y-m-d'), ['class' => 'form-control', 'required' => 'required', 'autofocus' => 'autofocus']) !!}
            <small class="text-danger">{{ $errors->first('date') }}</small>
          </div>
        @else
          @php
            $months = [];
            $date = \Carbon\Carbon::today()->startOfMonth();
            while(count($months) < 18) {
              $months[$date->format('Y-m')] = ucfirst($date->formatLocalized('%B %Y'));
              $date->subMonth();
            }
          @endphp

          <div class="form-group">
            {!! Form::label('date', 'Mostrar información del mes') !!}
            {!! Form::select('date', $months, \Carbon\Carbon::today()->format('Y-m'), ['class' => 'form-control']) !!}
          </div>
        @endif
      </div>
    @foreach($categories as $category)
      @if($category->formula)
      <div class="col-sm-12">
        <div class="form-group {{ $errors->first($category->slug) ? 'has-error' : '' }}">
          {!! Form::label($category->slug, $category->name, ['class' => 'control-label']) !!}
          <div class="input-group">
            <div class="input-group-addon">$</div>
            {!! Form::text($category->slug, null, ['class' => 'form-control js-calculated', 'readonly' => 'readonly', 'data-formula' => $category->formula ]) !!}
          </div>
          <p class="help-text hidden">
            DELETEME: Campo calculado con {{ $category->formula }}
          </p>
        </div>
      </div>
      @else
      <div class="col-sm-6">
        <div class="form-group {{ $errors->first($category->slug) ? 'has-error' : '' }}">
          {!! Form::label($category->slug, $category->name, ['class' => 'control-label']) !!}
          <div class="input-group">
            <div class="input-group-addon">$</div>
            {!! Form::text($category->slug, null, ['class' => 'form-control', 'required' => 'required']) !!}
          </div>
          <small class="text-danger">{{ $errors->first($category->slug) }}</small>
        </div>
      </div>
      @endif
    @endforeach
    </div>
    <div class="form-group">
      <div class="col-xs-12 col-sm-2 col-sm-offset-5 text-center">
        <button type="submit" class="btn btn-primary btn-block btn-lg">
          Enviar
        </button>
      </div>
    </div>
    <div id="js-hidden-data"></div>
  {!! Form::close() !!}
</div>

@endsection

@section('script')

<script type="text/javascript">
  $(function() {
    console.log('hey there!');

    $('.js-calculated').each(function() {
      var $this = $(this);
      var formula = $this.data('formula');
      var tokens = formula.split(' ');
      console.log('tokens', tokens);
      var operation = 1;
      var suma = [];
      var resta = [];
      for (var i = 0; i < tokens.length; i++) {
        switch(tokens[i]) {
          case '+':
            operation = 1;
            break;
          case '-':
            operation = 0;
            break;
          case '':
            break;
          default:
            $('#'+tokens[i]).data('belongs', $this.attr('id'));
            if (operation == 1) {
              suma.push(tokens[i]);
            } else {
              resta.push(tokens[i]);
            }
            break;
        }
      }
      console.log('suma', suma);
      console.log('resta', resta);
      $this.data('suma', suma);
      $this.data('resta', resta);
    });

    $.ajax({
      method: 'get',
      url: '/api/operational-cash/{{ $account->name }}',
      data: { until: $('#date').val() }
    })
    .done(function( data ) {
      var hidden_inputs = [];
      $.each( data, function( k, v ) {
        var id = 'previous_' + k;
        hidden_inputs.push($('<input type="hidden" id="'+id+'" value="'+v+'">'));
      });
      $('#js-hidden-data').html(hidden_inputs);
      console.log('ajax', data);
      saldoInit();
    });

    $.ajax({
      method: 'get',
      url: '/api/operational-cash/{{ $account->name }}',
      data: { date: $('#date').val() }
    })
    .done(function( data ) {
      $.each( data, function( k, v ) {
        $('#'+k).val(v);
      });
      console.log('date', data);
    });

    function saldoInit() {
      var $this = $('#saldo_inicial');
      var suma = 0;
      for (var i = 0; i < $this.data('suma').length; i++) {
        suma += parseInt($('#'+$this.data('suma')[i]).val());
      }
      var resta = 0;
      for (var i = 0; i < $this.data('resta').length; i++) {
        resta += parseInt($('#'+$this.data('resta')[i]).val());
      }
      $this.val(suma-resta);
    }

    $('body').on('change', '.form-control:not(#date)', function() {
      console.log('changed!');
      var $this = $(this);
      var belongs = $this.data('belongs');
      console.log('belongs', belongs);
      if (typeof belongs != 'undefined') {
        var $parent = $('#'+belongs);
        var suma = 0;
        for (var i = 0; i < $parent.data('suma').length; i++) {
          suma += parseInt($('#'+$parent.data('suma')[i]).val());
        }
        var resta = 0;
        for (var i = 0; i < $parent.data('resta').length; i++) {
          resta += parseInt($('#'+$parent.data('resta')[i]).val());
        }
        $parent.val(suma-resta);
      }
    });

    $('input#date').on('focusout', function() {
      console.log('date!!!!', $(this).val());
      $.ajax({
        method: 'get',
        url: '/api/operational-cash/{{ $account->name }}',
        data: { until: $(this).val() }
      })
      .done(function( data ) {
        var hidden_inputs = [];
        $.each( data, function( k, v ) {
          var id = 'previous_' + k;
          hidden_inputs.push($('<input type="hidden" id="'+id+'" value="'+v+'">'));
        });
        $('#js-hidden-data').html(hidden_inputs);
        saldoInit();
      });

      $.ajax({
        method: 'get',
        url: '/api/operational-cash/{{ $account->name }}',
        data: { date: $(this).val() }
      })
      .done(function( data ) {
        $.each( data, function( k, v ) {
          $('#'+k).val(v);
        });
        console.log('date on date change', data);
      });
    })


    $('select#date').on('change', function() {
      console.log('date!!!!', $(this).val());
      $.ajax({
        method: 'get',
        url: '/api/operational-cash/{{ $account->name }}',
        data: { until: $(this).val() }
      })
        .done(function( data ) {
          var hidden_inputs = [];
          $.each( data, function( k, v ) {
            var id = 'previous_' + k;
            hidden_inputs.push($('<input type="hidden" id="'+id+'" value="'+v+'">'));
          });
          $('#js-hidden-data').html(hidden_inputs);
          saldoInit();
        });

      $.ajax({
        method: 'get',
        url: '/api/operational-cash/{{ $account->name }}',
        data: { date: $(this).val() }
      })
        .done(function( data ) {
          $.each( data, function( k, v ) {
            $('#'+k).val(v);
          });
          console.log('date on date change', data);
        });
    })

  });
</script>

@endsection