@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">{{__($namespaceName.'/'.$modelName.'.subscription_details').': '}} <strong>{{$data->subscription_name}}</strong></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">{{__($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.'.main_regular_package_name')}}</span> : {{$data->regularPackage->package_name}}</li>
                                {{-- <li class="list-group-item"><span style="font-weight: bold" >{{__($namespaceName.'/'.$modelName.'.QrCode')}}</span> : {{$qrCode}}</li> --}}
                            </ul>
                            {{-- {!!$qrCode!!} --}}
                            {{-- <a href="data:image/png;base64, {!! $qrCode !!}" download></a> --}}
                        </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>
                        </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="activate_devices" class="table table-striped table-bordered text-center activate_devices">
                                <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.'.'.'price')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'interval')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'interval_type')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'start_date')}}</th>
                                    <th>{{trans($namespaceName.'/'.$modelName.'.'.'end_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 id="example2" 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>
        </div>
    </div>
@endsection