const entradas = {
  id: '#entradas',
  modal: null,
  fuente: null,
  entradas: [],
  getEntradas: function() {
    return $.ajax({
      url: _urls.api + '/fuente/' + this.fuente + '/entradas',
      method: 'GET',
      dataType: 'json'
    }).then((data) => {
      if (data.fuente === null) {
        return
      }
      $('#fuente').html(data.fuente.tipo.descripcion + ' - ' + data.fuente.banco.nombre + ' (' + data.fuente.saldoFormateado + ')')
      if (data.entradas == null || data.entradas.length == 0) {
        return
      }
      this.entradas = data.entradas
    }).then(() => {
      this.draw()
    })
  },
  draw: function() {
    const table = $(this.id)
    table.html('')
    $.each(this.entradas, (i, el) => {
      table.append(
        $('<tr></tr>').append(
          $('<td></td>').html(el.fechaFormateada)
        ).append(
          $('<td></td>').html(el.cuenta.nombre + ' (' + el.cuenta.categoria.nombre + ')')
        ).append(
          $('<td></td>').html(el.glosa)
        ).append(
          $('<td></td>').html(el.detalle)
        ).append(
          $('<td></td>').attr('class', 'right aligned').html(el.valorFormateado)
        )
      )
    })
  },
  getCuentas: function() {
    return $.ajax({
      url: _urls.api + '/cuentas',
      method: 'GET',
      dataType: 'json'
    }).then((data) => {
      if (data.cuentas === null || data.cuentas.length == 0) {
        return
      }
      this.cuentas = data.cuentas
    }).then(() => {
      const select = $("select[name='cuenta']")
      $.each(this.cuentas, (i, el) => {
        select.append(
          $('<option></option>').attr('value', el.id).html(el.nombre + ' (' + el.categoria.nombre + ')')
        )
      })
    })
  },
  add: function() {
    this.modal.find('form').trigger('reset')
    this.modal.modal('show')
  },
  doAdd: function() {
    const data = JSON.stringify({
      fecha: $("[name='fecha']").val(),
      fuente_id: this.fuente,
      glosa: $("[name='glosa']").val(),
      detalle: $("[name='detalle']").val(),
      cuenta_id: $("[name='cuenta']").val(),
      valor: $("[name='valor']").val()
    })
    return $.ajax({
      url: _urls.api + '/entradas/add',
      method: 'POST',
      data: data,
      dataType: 'json'
    }).then((data) => {
      this.modal.modal('hide')
      this.getEntradas()
    })
  },
  setupModal: function() {
    this.modal = $('.ui.modal')
    this.modal.modal()
    this.modal.find('.ui.calendar').calendar({
      type: 'date',
      formatter: {
        date: function(date, settings) {
          if (!date) return ''
          let day = date.getDate()
          let month = ('00' + (date.getMonth() + 1)).slice(-2)
          let year = date.getFullYear()
          return year + '/' + month + '/' + day
        }
      },
      maxDate: new Date()
    })
    this.modal.find('.close.icon').css('cursor', 'pointer').click(() => {
      this.modal.modal('hide')
    })
    this.modal.find('form').submit((e) => {
      e.preventDefault()
      this.doAdd()
      return false
    })
  },
  setup: function() {
    this.setupModal()
    this.getEntradas().then(() => {
      this.getCuentas()
    })
    $(this.id).parent().find('.ui.button').click((e) => {
      e.preventDefault()
      this.add()
      return false
    })
  }
}