@extends('layouts.app', [
    'title' => __('User Management'),
    'parentSection' => 'laravel',
    'elementName' => 'user-management'
])

@section('title', 'Assinaturas |')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" integrity="sha512-KfkfwYDsLkIlwQp6LFnl8zNdLGxu9YAA1QvwINks4PhcElQSvqcyVLLD9aMhXd13uQjoXtEKNosOWaZqXgel0g==" crossorigin="anonymous" referrerpolicy="no-referrer" />


@section('content')
    @component('layouts.headers.auth')
        @component('layouts.headers.breadcrumbs')
            @slot('title')
            Assinaturas
            @endslot

            <li class="breadcrumb-item"><a class="text-default" href="{{ route('clients.index') }}">Assinaturas</a></li>
        @endcomponent
    @endcomponent

    <div class="container-fluid mt--6">
        <div class="row">
            <div class="col">
                <div class="card">
                    <div class="card-header">
                        <div class="row align-items-center">
                            <div class="col-8">
                                <h3 class="mb-0">Assinaturas de {{$client->first_name ." ". $client->last_name}}</h3>
                                <p class="text-sm mb-0">
                                        Abaixo você encontra a lista de assinaturas vinculadas ao cliente.
                                    </p>
                            </div>
                            <div class="col-4 text-right">
                                <a href="{{ route('clients.index') }}" class="btn btn-sm btn-primary">Voltar</a>
                                <button type="button" class="btn btn-sm btn-success" data-toggle="modal" data-target="#modal-default">Nova Assinatura</button>
                                    <div class="modal fade" id="modal-default" tabindex="-1" role="dialog" aria-labelledby="modal-default" aria-hidden="true">
                                        <div class="modal-dialog modal-lg modal-dialog-centered modal-" role="document">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <h6 class="modal-title" id="modal-title-default">Nova Assinatura para {{$client->first_name." ". $client->last_name}}</h6>
                                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                                                        <span aria-hidden="true">×</span>
                                                    </button>
                                                </div>
                                                <div class="modal-body">
                                                    <form action="{{route('signatures.store')}}" method="POST" enctype="multipart/form-data">
                                                    @csrf
                                                        <div class="tab-content">
                                                            <div id="input-groups-component" class="tab-pane tab-example-result fade active show" role="tabpanel" aria-labelledby="input-groups-component-tab">
                                                                <div class="row">
                                                                    <div class="col-6">
                                                                        <div class="form-group">
                                                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Data de Início</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                                                </div>
                                                                                <input type="text" class="form-control" value="{{$client->id}}" name="client_id" hidden>
                                                                                <input type="date" class="form-control" name="start_date" value="{{ old('start_date') }}">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-6">
                                                                        <div class="form-group">
                                                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Data de Fim</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-calendar-grid-58"></i></span>
                                                                                </div>
                                                                                <input type="date" class="form-control" name="end_date" value="{{ old('end_date') }}">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="row">
                                                                    <div class="col-6">
                                                                        <div class="form-group">
                                                                            <label class="form-control-label text-left" style="float:left"  for="input-name">Forma de Pagamento</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-briefcase-24"></i></span>
                                                                                </div>
                                                                                <select name="payment_method" id="payment_method" value="{{old('payment_method')}}" class="form-control" @error('payment_method') is-invalid @enderror>
                                                                                    <option value=""> -- Selecione --</option>
                                                                                    <option value="Parcelado"> Parcelado</option>
                                                                                    <option value="PIX/Transferência">PIX/Transferência</option>
                                                                                </select>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-6">
                                                                        <div class="form-group">
                                                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Preço</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1">R$</span>
                                                                                </div>
                                                                                <input type="text" class="form-control" name="price">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                <div class="row">
                                                                    <div class="col-12" id="lead-div">
                                                                        <div class="form-group">
                                                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Origem do Lead</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-send"></i></span>
                                                                                </div>
                                                                                <select name="origin_lead" id="origin_lead" value="{{old('origin_lead')}}" class="form-control" @error('origin_lead') is-invalid @enderror>
                                                                                    <option value="" selected> -- Selecione --</option>
                                                                                    <option value="Indicação de Cliente">Indicação de Cliente</option>
                                                                                    <option value="Outras Indicações">Outras Indicações</option>
                                                                                    <option value="Orgânico">Orgânico</option>
                                                                                </select>
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                    <div class="col-6" id="name_reference" style="display: none;">
                                                                        <div class="form-group">
                                                                        <label class="form-control-label text-left" style="float:left" for="basic-url">Quem Indicou?</label>
                                                                            <div class="input-group">
                                                                                <div class="input-group-prepend">
                                                                                    <span class="input-group-text" id="basic-addon1"><i class="ni ni-single-02"></i></span>
                                                                                </div>
                                                                                <input type="text" name="name_reference" class="form-control" placeholder="Quem Indicou?">
                                                                            </div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-link  ml-auto" data-dismiss="modal">Sair</button>
                                                            <button type="submit" class="btn btn-success btn-sm">Cadastrar</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                            </div>

                    <div class="col-12 mt-2">
                        @include('alerts.success')
                        @include('alerts.errors')
                    </div>

                    <div class="table-responsive py-4" id="users-table">
                        <table class="table align-items-center table-flush"  id="datatable-basic">
                            <thead class="thead-light">
                                <tr>
                                    <th scope="col">Dt. de Início</th>
                                    <th scope="col">Dt. de Fim</th>
                                    <th scope="col">Vence em:</th>
                                    <th scope="col">Forma de Pagamento</th>
                                    <th scope="col">Valor</th>
                                    <th scope="col">Ações</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($signatures as $signature)
                                    <tr>
                                        <td>{{ date('d/m/Y', strtotime($signature->start_date)) }}</td>
                                        <td>{{ date('d/m/Y', strtotime($signature->end_date)) }}</td>
                                        <td>@if(round( (strtotime($signature->end_date) - time()) / 86400) + 1 == 0) Hoje @elseif(round( (strtotime($signature->end_date) - time()) / 86400) + 1 == 1) Amanhã @else {{round( (strtotime($signature->end_date) - time()) / 86400) + 1}} dias @endif</td>
                                        <td>{{ $signature->payment_method }}</td>
                                        <td>R$ {{ $signature->price }}</td>
                                        <td class="text-right">
                                            <div class="dropdown">
                                                <a class="btn btn-sm btn-icon-only text-light" href="#" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                                    <i class="fas fa-ellipsis-v"></i>
                                                </a>
                                                <div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
                                                    <a class="dropdown-item" href="{{ route('signatures.edit', $signature->id) }}"><i class="ni ni-ruler-pencil text-dark text-sm opacity-10"></i> Editar</a>
                                                    <form action="{{ route('signatures.destroy', $signature->id) }}" method="post">
                                                        @csrf
                                                        @method('delete')
                                                        <input type="text" value="{{$signature->client_id}}" name="client_id" hidden>
                                                        <button type="button" class="dropdown-item" onclick="confirm('Tem certeza que deseja excluir essa assinatura?') ? this.parentElement.submit() : ''">
                                                        <i class="ni ni-basket text-dark text-sm opacity-10"></i> Excluir
                                                        </button>
                                                    </form>
                                                </div>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        @include('layouts.footers.auth')
    </div>
<!-- Scripts Section -->
<script src="https://code.jquery.com/jquery-3.6.0.js" integrity="sha256-H+K7U5CnXl1h5ywQfKtSj8PCmoN9aaq30gDh27Xc0jk=" crossorigin="anonymous"> </script>
<!-- Quem indicou? -->
<script>
    $(function(){
        $("#origin_lead").change(function(){
            var origin_lead = $("#origin_lead option:selected").val();
            if (origin_lead == "Indicação de Cliente" || origin_lead == "Outras Indicações") {
                console.log(origin_lead);
                $("#name_reference").show();
                $("#lead-div").removeClass().toggleClass('col-6');
            }
        });
        $("#origin_lead").change(function(){
            var origin_lead2 = $("#origin_lead option:selected").val();
            if (origin_lead2 == "Orgânico" || origin_lead2 == "") {
                console.log(origin_lead2);
                $("#name_reference").hide();
                $("#lead-div").removeClass().toggleClass('col-12');
            }
        });
    })
</script>
@endsection
@push('css')
    <link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-bs4/css/dataTables.bootstrap4.min.css">
    <link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-buttons-bs4/css/buttons.bootstrap4.min.css">
    <link rel="stylesheet" href="{{ asset('argon') }}/vendor/datatables.net-select-bs4/css/select.bootstrap4.min.css">
@endpush

@push('js')
    <script src="{{ asset('argon') }}/vendor/datatables.net/js/jquery.dataTables.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-bs4/js/dataTables.bootstrap4.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-buttons-bs4/js/buttons.bootstrap4.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-buttons/js/buttons.html5.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-buttons/js/buttons.flash.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-buttons/js/buttons.print.min.js"></script>
    <script src="{{ asset('argon') }}/vendor/datatables.net-select/js/dataTables.select.min.js"></script>
@endpush