@extends('adminlte::page')


@section('content_header')
    <div class="d-flex justify-content-between">
        <h1>Activador: {{$activator->name}}</h1>
        <a href="{{route('activator.single.export', ['type' => $type, 'activator' => $activator->id])}}" class="btn btn-primary">Descargar  <i class="fas fa-download"></i></a>
    </div>
@stop

@section('content')
    @if (session('status'))
        <div class="alert alert-success" role="alert">
            {{session('status')}}
        </div>
    @endif
    <div class="row">
        <div class="col-md-4">
            <a href="{{route('activator.show', ['activator'=>$activator->id])}}">
                <x-infoBox title="Lineas Activadas" icon="fas fa-sd-card" number="{{$activator->lines->count()}}"/>
            </a>
        </div>
        <div class="col-md-4">
            <a href="{{isset($activator->parent->id) ? route('activator.show', ['activator'=>$activator->id, 'type' => 'Lineas menores a 30 días']) : '#'}}">
                <x-infoBox title="Lineas menores a 30 días" icon="fas fa-phone-slash" :number="$countLinesMinus30Days"/>
            </a>
        </div>
        <div class="col-md-4">
            <a href="{{route('activator.show', ['activator'=>$activator->id, 'type' => 'Lineas portadas'])}}">
                <x-infoBox title="Líneas portadas" icon="fas fa-phone-slash" :number="$countPortLines"/>
            </a>
        </div>
        <div class="col-md-4">
            <a href="{{isset($activator->parent->parent->id) ? route('activator.show', ['activator'=>$activator->parent->parent->id]) : '#'}}">
                <x-infoBox title="Abuelo" icon="fas fa-user" number="{{isset($activator->parent->parent->name) ? $activator->parent->parent->name : 'Sin abuelo'}}"/>
            </a>
        </div>
        <div class="col-md-4">
            <a href="{{isset($activator->parent->id) ? route('activator.show', ['activator'=>$activator->parent->id]) : '#'}}">
                <x-infoBox title="Padre" icon="fas fa-user" number="{{isset($activator->parent->name) ? $activator->parent->name : 'Sin padre'}}"/>
            </a>
        </div>
        <div class="col-md-4">
            <a href="{{route('activator.show', ['activator'=>$activator->id, 'type' => 'hijos'])}}">
                <x-infoBox title="Hijos" icon="fas fa-user-friends" number="{{$activator->children->count()}}"/>
            </a>
        </div>
    </div>
    <div class="row">
        <div class="col-md-4">
            <x-infoBox title="Retención 30" icon="fas fa-save" number="{{$activator->retentionReport->retention_30}}%"/>
        </div>
        <div class="col-md-4">
            <x-infoBox title="Retención 60" icon="fas fa-save" number="{{$activator->retentionReport->retention_60}}%"/>
        </div>
        <div class="col-md-4">
            <x-infoBox title="Retención 90" icon="fas fa-save" number="{{$activator->retentionReport->retention_90}}%"/>
        </div>
    </div>
    @if ($type == 'Lineas portadas')
        <x-form :action="route('activator.show', ['activator' => $activator->id, 'type' =>'Lineas portadas'])" method="GET">
            <x-card title="Filtros" class="card-primary">
                <x-slot name="tools">
                    <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-plus"></i></button>
                </x-slot>

                <div class="row">
                    <div class="col-md-6">
                        <div class="form-group">
                            <label>Rango de fecha de portación</label>
                            <div class="input-group">
                                <div class="input-group-prepend">
                                        <span class="input-group-text">
                                            <i class="far fa-calendar-alt"></i>
                                        </span>
                                </div>
                                <input type="hidden" name="type" value="Lineas portadas">
                                <input type="text" name="daterange" class="form-control float-right" id="reservation" value="@isset($filters['daterange']){{$filters['daterange']}} @endisset">
                            </div>
                        </div>
                    </div>
                </div>

                <x-slot name="footer">
                    <div class="fa-pull-right">
                        <button class="btn btn-success">Filtrar</button>
                    </div>
                </x-slot>
            </x-card>
        </x-form>
    @endif
{{--    <x-card title="Información del activador">
        TODO: INFORMACIÓN RELEVANTE DEL ACTIVADOR...
    </x-card>--}}

    <x-card title="{{!$type?'Lineas':ucfirst($type)}}" class="card-primary">
        <div class="table-responsive">
            {{$dataTable->table()}}
        </div>
    </x-card>

{{--    <x-card title="Lineas" class="collapsed-card card-primary" >
        <x-slot name="tools">
            <button type="button" class="btn btn-tool" data-card-widget="collapse"><i class="fas fa-plus"></i></button>
        </x-slot>
        {{$dataTableLines->table()}}
    </x-card>--}}
@stop

@section('js')
    <script type="text/javascript" src="{{asset('libs/DataTables/datatables.min.js')}}"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
    <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.min.js"></script>
    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/daterangepicker/daterangepicker.css" />
    {{$dataTable->scripts()}}
    <script>
        $(function() {
            $('input[name="daterange"]').daterangepicker();
            $('input[name="daterange"]').val('')
        });
    </script>
@endsection