@extends('layouts.app')

@section('template_title')
    Лицензия {{ Auth::user()->name }}
@endsection

@section('template_fastload_css')
@endsection

@section('content')

    <div class="container">
        <div class="row">
            <div class="col-12 col-lg-12">

                <div class="mb-5 p-4 bg-white shadow-sm">
                    <h3 class="mb-3">Ключи</h3>
                    <div class="row">
                        <div class="col-sm-12 text-center mb-3">
                            <a href="https://asccrm.ru/#asc-pricing" class="btn btn-success">Купить ключ</a>
                        </div>
                    </div>

                    @if(count($keys) > 0 )
                        @foreach($keys as $key)
                            <div class="card mb-3 rounded-0">
                                <div class="card-body p-0">
                                    <ul class="list-group list-group-flush mb-4">
                                        <li class="list-group-item">
                                            <i class="fa fa-clock-o font-weight-bold {{ (time()-(60*60*24)) < strtotime($key->expiration) ? 'text-success':'text-danger' }}"></i>
                                            До: {{ $key->expiration }}</li>
                                        <li class="list-group-item">Рабочих мест: {{ $key->quantity }}</li>
                                        <li class="list-group-item">{{ $key->invoice }}</li>
                                        <li class="list-group-item"> Стоимость: {{ $key->price }}</li>
                                        <li class="list-group-item license-key d-none">
                                            <pre>{{ $key->license }}</pre>
                                        </li>
                                    </ul>
                                    <a href="#" class="btn btn-primary mx-3 mb-3 display-key">Показать</a>
                                    <a href="#" class="btn btn-secondary mx-3 mb-3 hide-key d-none">Скрыть</a>
                                </div>
                            </div>

                        @endforeach
                    @else
                        <p class="text-center">У вас еще нет ключей</p>
                        <p class="text-center font-italic small">Если вы только что оплатили счёт, обновите страницу через минуту</p>
                    @endif

                </div>
            </div>
        </div>
    </div>

@endsection

@section('footer_scripts')
    <script>
        $(document).ready(function () {
            $('.display-key').click(function (event) {
                event.preventDefault();
                $(this).closest('.card-body').find('.license-key').removeClass('d-none');
                $(this).addClass('d-none');
                $(this).closest('.card-body').find('.hide-key').removeClass('d-none');
            });

            $('.hide-key').click(function (event) {
                event.preventDefault();
                $(this).closest('.card-body').find('.license-key').addClass('d-none');
                $(this).addClass('d-none');
                $(this).closest('.card-body').find('.display-key').removeClass('d-none');
            });


        });
    </script>
@endsection