@extends('layouts.'.$namespaceName.'.master')
@section('title')
{{$title}}
@endsection
@section('content')
<div class="page-wrapper">
    <div class="page-content m-2">
        @include('message')
        @include('breadcrumb')
        <div class="row row-cols-1 row-cols-lg-2 row-cols-xl-2">
            <div class="col">
                <h6 class="mb-0 text-uppercase"><i class='bx bxs-grid-alt'></i> {{__($namespaceName.'/'.$modelName.'.subscription_details')}}</h6>
                <hr/>
                <div class="card">
                    <div class="card-body">
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.subscription_name')}}</span> : {{$data->subscription_name}}</li>
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.subscription_code')}}</span> : {{$data->subscription_code}}</li>
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.start_date')}}</span> : {{date('d-m-Y', strtotime($data->start_date))}}</li>
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.end_date')}}</span> : {{date('d-m-Y', strtotime($data->end_date))}}</li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="col">
                <h6 class="mb-0 text-uppercase"><i class='bx bxs-grid-alt'></i> {{__($namespaceName.'/'.$modelName.'.other_details')}}</h6>
                <hr/>
                <div class="card">
                    <div class="card-body">
                        <ul class="list-group list-group-flush">
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.host_name')}}</span> : {{$data->consumer->name}}</li>
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.package_name')}}</span> : {{$data->regularPackage->package_name}}</li>
                            <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.subscription_status')}}</span> : {{$data->subscriptionStatus->display_value}}</li>
                            {{-- <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.qrCode')}}</span> :  {!!$qrCode!!}</li> --}}
                        </ul>

                    </div>
                </div>
            </div>
            <div class="col">
                <h6 class="mb-0 text-uppercase">{{__($namespaceName.'/'.$modelName.'.qrCode')}}</h6>
                <hr/>
                <div class="card col-8">
                    <div class="card-body">

                        <div class="mb-3">
                            <img src="data:image/png;base64,{!! base64_encode($qrCode) !!} ">
                        </div>
                         <span> <a class="btn btn-dark"  href="data:image/png;base64, {!! base64_encode($qrCode) !!}" download="subcscription_QrCode">{{ __('labels.download') }}</a></span>

                        {{-- <a href="data:image/png;base64, {!! $qrCode !!}" download></a> --}}
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <h6 class="mb-0 text-uppercase">{{__($namespaceName.'/'.$modelName.'.activated_devices')}}</h6>
            <hr/>
            <div class="card">
                <div class="card-body">
                    <div class="table-responsive">
                        <table id="example2" class="table table-striped table-bordered text-center">
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'device_title')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'activation_token')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'created_at')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'actions')}}</th>
                            </tr>
                            </thead>
                            <tbody>
                          
                            @foreach ($activated_devices as $device)
                                <tr id="row_{{$device->id}}">
                                    <td>{{ $loop->iteration }}</td>
                                    <td>{{$device->title}}</td>
                                    <td>{{$device->activation_token}}</td>
                                    <td>{{$device->created_at}}</td>
                                    <td>
                                        <button type="button" class="btn btn-dark btn-sm"
                                                onclick="delete_alert(
                                                      {{$device->id}},
                                                      'subscriptions/deactivate',
                                                      'activate_devices',
                                                      '{{__('messages.are you sure')}}',
                                                      '{{__('operator/subscriptions.once this device is deleted , you will not be able to use the service anymore')}}',
                                                    )">
                                            <i class='bx bx-exit'></i>
                                        </button>
                                    </td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-12">
            <h6 class="mb-0 text-uppercase">{{__($namespaceName.'/'.$modelName.'.extended_subscriptions')}}</h6>
            <hr/>
            <div class="card">
                <div class="card-body">
                    <div class="table-responsive">
                        <table id="example2" class="table table-striped table-bordered text-center">
                            <thead>
                            <tr>
                                <th>#</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'subscription_name')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'package_name')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'package_type')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'price')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'interval')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'interval_type')}}</th>
                                <th>{{trans($namespaceName.'/'.$modelName.'.'.'start_date')}}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach ($data->extendedPackages as $package)
                                <tr id="row_{{$data->id}}">
                                    <td>{{$loop->iteration}}</td>
                                    <td>{{$data->subscription_name}}</td>
                                    <td>{{$package->package->name}}</td>
                                    <td>{{$package->package->packageType->display_value}}</td>
                                    <td>{{$package->package->price}}</td>
                                    <td>{{$package->package->interval}}</td>
                                    <td>{{$package->package->interType->display_value}}</td>
                                    <td>{{$package->start_date}}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-md-12">
            <h6 class="mb-0 text-uppercase">{{__($namespaceName.'/'.$modelName.'.subscription_limits')}}</h6>
            <hr/>
            <div class="card">
                <div class="card-body">
                    <div class="table-responsive">

                        <table class="table table-striped table-bordered text-center">
                            <thead>
                                <tr>
                                    <th>#</th>
                                     <th>{{trans($namespaceName.'/'.$modelName.'.'.'limit_name')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'reserved')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'used')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'available')}}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($data->subscriptionBalance as $balance)
                                    <tr id="row_{{$balance->id}}">
                                        <td>{{$loop->iteration}}</td>
                                        <td>{{$balance->limit->display_value}}</td>
                                        <td>{{$balance->reserved}}</td>
                                        <td>{{$balance->used}}</td>
                                        <td>{{$balance->available}}</td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="card">
                <div class="card-body">
                    <div>
                        <h5 class="card-title"><i class='bx bxs-cog'></i> {{__($namespaceName.'/'.$modelName.'.subscription_options')}}</h5>
                    </div>
                    <hr>
                    <div class="row row-cols-auto g-3">
                        @if(!($data->isUpcoming()))
                        <div class="col">
                            <button type="button" class="btn btn-dark waves-effect waves-light"
                                    onclick="renewSubscription(
                                        {{$data->id}},
                                        '{{route('client.renewSubscription')}}',
                                        '{{trans($namespaceName.'/'.$modelName.'.'.'Renew subscription now ?')}}',
                                        '{{trans($namespaceName.'/'.$modelName.'.'.'In the event of confirmation, all remaining balance, if any, will be forfeited')}}',
                                        '{{trans($namespaceName.'/'.$modelName.'.'.'Subscription renewed successfully')}}',
                                    )">
                                <i class='bx bx-refresh'></i>
                                {{__($namespaceName.'/'.$modelName.'.renew_subscription')}}
                            </button>
                        </div>
                        @endif
                        @if(!($data->isExpired()) && !($data->isUpcoming()))
                        <div class="col">
                            @include('client.apps.includes.extended-modal')
                        </div>
                        <div class="col">
                            @include('client.apps.includes.extended-interval-model')
                        </div>
                        @endif
                    </div>
                    <!--end row-->
                </div>
            </div>
        </div>
    </div>
</div>
@endsection