@extends('layout.base')

@section('content')
  <?php $cnt = []; $pisos = [] ?>
<div class="page-heading">
  <h2>Unidades - <a href="{{nUrl('proyectos', 'show', ['proyecto' => $proyecto->id])}}">{{$proyecto->descripcion}}</a></h2>
</div>
<table class="table table-striped">
  <thead>
    <tr>
      <th>Tipo</th>
      <th>Nombre</th>
      <th>Abreviaci&oacute;n</th>
      <th>#</th>
      <th>L&iacute;neas</th>
      <th>m&#0178; &Uacute;til</th>
      <th>m&#0178; Terraza</th>
      <th>m&#0178; Vendible</th>
      <th>m&#0178; Total</th>
      <th>Descripci&oacute;n</th>
      <th><a href="{{nUrl('proyectos', 'add_tipo_unidad', ['proyecto' => $proyecto->id])}}"><span class="glyphicon glyphicon-plus"></span></a></th>
    </tr>
  </thead>
  <tbody>
    @foreach ($proyecto->proyectoTipoUnidades() as $tipo)
    <tr class="show-unidades" data-status="closed" data-tipo="{{$tipo->id}}">
      <td>{{ucwords($tipo->tipo()->descripcion)}}</td>
      <td>{{$tipo->nombre}}</td>
      <td>
        @if ($tipo->tipologia())
          {{$tipo->tipologia()->descripcion}}
        @else
          {{$tipo->abreviacion}}
        @endif
      </td>
      <td>{{count($tipo->unidades())}}</td>
      <td>{{$tipo->lineas()}}</td>
      <td>{{format('m2', $tipo->m2 + $tipo->logia)}}</td>
      <td>{{format('m2', $tipo->terraza)}}</td>
      <td>{{format('m2', $tipo->m2())}}</td>
      <td>{{format('m2', $tipo->m2('total'))}}</td>
      <td>
        @if ($tipo->tipologia())
          {{$tipo->tipologia()->detalle}}
        @else
          {{$tipo->descripcion}}
        @endif
      </td>
      <td><a href="{{nUrl('proyecto_tipo_unidades', 'edit', ['tipo_unidad' => $tipo->id])}}"><span class="glyphicon glyphicon-edit"></span></a></td>
    </tr>
    <tr class="unidades" data-tipo="{{$tipo->id}}">
      <td></td>
      <td colspan="8">
        <table class="table table-striped">
          <thead>
            <tr>
              <th>Descripci&oacute;n</th>
              <th>#</th>
              <th>Piso</th>
              <th>L&iacute;nea</th>
              <th>Orientaci&oacute;n</th>
              <th class="text-right">
                <a href="{{nUrl('proyecto_tipo_unidades', 'add_unidad', ['tipo_unidad' => $tipo->id])}}">
                  <span class="glyphicon glyphicon-plus"></span>
                </a>
              </th>
            </tr>
          </thead>
          <tbody>
            <?php $subtipo = '' ?>
            @foreach ($tipo->unidades() as $unidad)
              @if ($subtipo != $unidad->subtipo)
                <?php $subtipo = $unidad->subtipo; $cnt[$tipo->nombre."-".$subtipo] = 0; $pisos[$tipo->nombre."-".$subtipo] = [] ?>
                <tr data-id="{{$tipo->nombre}}-{{$subtipo}}" data-status="closed" class="subtipo">
                  <th>L&iacute;nea {{$subtipo}}</th>
                  <th class="cantidad_subtipo" data-subtipo="{{$tipo->nombre}}-{{$subtipo}}"></th>
                  <th class="pisos_subtipo" data-subtipo="{{$tipo->nombre}}-{{$subtipo}}"></th>
                  <th>{{$subtipo}}</th>
                  <th>{{$unidad->orientacion}}</th>
                </tr>
              @endif
              <tr>
                <td>{{$unidad->descripcion}}</td>
                <td>{{$unidad->piso}}</td>
                <td>{{$unidad->subtipo}}</td>
                <td>{{$unidad->orientacion}}</td>
                <td class="text-right">
                  <a href="{{nUrl('unidades', 'edit', ['unidad' => $unidad->id])}}"><span class="glyphicon glyphicon-edit"></span></a>
                  <a href="{{nUrl('unidades', 'remove', ['unidad' => $unidad->id, 'proyecto' => $proyecto->id])}}"><span class="glyphicon glyphicon-remove"></span></a>
                </td>
              </tr>
              <?php
              if ($subtipo != '') {
                $cnt[$tipo->nombre."-".$subtipo] ++;
                $pisos[$tipo->nombre."-".$subtipo] []= $unidad->piso;
              }
              ?>
            @endforeach
          </tbody>
        </table>
      </td>
    </tr>
    @endforeach
    @if (count($libres) > 0)
    <tr class="show-unidades" data-status="closed" data-tipo="libres">
      <td>Libres</td>
      <td colspan="5"></td>
      <td><a href="{{nUrl('proyecto_tipo_unidades', 'assign', ['proyecto' => $proyecto->id])}}"><span class="glyphicon glyphicon-chevron-right"></span></a></td>
    </tr>
    <tr class="unidades" data-tipo="libres">
      <td></td>
      <td colspan="7">
        <table class="table table-striped">
          <thead>
            <tr>
              <th>Descripci&oacute;n</th>
                <th>Piso</th>
              <th>L&iacute;nea</th>
              <th>Orientaci&oacute;n</th>
              <th>Valor</th>
              <th></th>
            </tr>
          </thead>
          <tbody>
            @foreach ($libres as $unidad)
            <tr>
              <td>{{$unidad->descripcion}}</td>
              <td>{{$unidad->piso}}</td>
              <td>{{$unidad->subtipo}}</td>
              <td>{{$unidad->orientacion}}</td>
              <td>{{format('ufs', $unidad->valor, null, true)}}</td>
              <td>
                <a href="{{nUrl('unidades', 'edit', ['unidad' => $unidad->id])}}"><span class="glyphicon glyphicon-edit"></span></a>
                <a href="{{nUrl('unidades', 'remove', ['unidad' => $unidad->id, 'proyecto' => $proyecto->id])}}"><span class="glyphicon glyphicon-remove"></span></a>
              </td>
            </tr>
            @endforeach
          </tbody>
        </table>
      </td>
    </tr>
    @endif
  </tbody>
</table>
@endsection

@push('scripts')
<script type="text/javascript">
$(document).ready(function() {
  var cnt = {
    @foreach ($cnt as $subtipo => $c)
    "{{$subtipo}}": {{$c}},
    @endforeach
  }
  var pisos = {
    @foreach ($pisos as $subtipo => $piso)
    "{{$subtipo}}": "{{min($piso)}} - {{max($piso)}}",
    @endforeach
  }
  console.debug(pisos)
  $('.unidades').hide()
  $('.cantidad_subtipo').each(function(i, el) {
    var id = $(this).attr('data-subtipo')
    $(this).html(cnt[id])
  })
  $('.pisos_subtipo').each(function(i, el) {
    var id = $(this).attr('data-subtipo')
    $(this).html(pisos[id])
  })
  $('.show-unidades').css('cursor', 'pointer').click(function(e) {
    var id = $(this).attr('data-tipo')
    var status = $(this).attr('data-status')
    if (status == 'open') {
      $(".unidades[data-tipo='" + id + "']").hide()
      $(this).attr('data-status', 'closed')
    } else {
      $(".unidades[data-tipo='" + id + "']").show()
      if ($(".unidades[data-tipo='" + id + "']").find('.subtipo').length > 0) {
        $(".unidades[data-tipo='" + id + "']").find('tbody tr').hide()
        $(".unidades[data-tipo='" + id + "']").find('.subtipo').show()
      }
      $(this).attr('data-status', 'open')
    }
  })
  $('.subtipo').css('cursor', 'pointer').click(function(e) {
    var id = $(this).attr('data-id')
    var status = $(this).attr('data-status')
    if (status == 'open') {
      $(this).nextUntil('.subtipo').hide()
      $(this).attr('data-status', 'closed')
    } else {
      $(this).nextUntil('.subtipo').show()
      $(this).attr('data-status', 'open')
    }
  })
})
</script>
@endpush
