@extends('partials.main')

@section('title')

Subscriptions

@endsection

@section('content')

<style>
    .modalb{
        background:#29aae3;
        color:white;
    }
    .modalb:hover{
        background:#0293d4;
        color:white;
    }
</style>

@php
    $login_user = auth()->user();
    $subscription_user = App\Models\User::where('id',$subscription->user_id)->first();
    $first_name = $subscription_user->first_name;
    $last_name = $subscription_user->last_name;
@endphp

<!-- breadcrumb -->

<div class="breadcrumb-header justify-content-between">

    <nav class="breadcrumb-4">

        <ol class="breadcrumb breadcrumb-style1">

            @if($login_user->roles[0]->name == 'Admin')

            <li class="breadcrumb-item">

                <a href="{{ route('dashboard') }}">Dashboard</a>

            </li>
            @elseif($login_user->roles[0]->name == 'Client')

              <li class="breadcrumb-item">

                <a href="{{ route('client-dashboard') }}">Dashboard</a>

            </li>

            @endif

            <li class="breadcrumb-item active">Subscriptions</li>

        </ol>

    </nav>

</div>

<!-- breadcrumb -->

<div class="row row-sm">
    <div class="col-xl-12">
        <div class="card">
            <div class="card-header pb-0">
                <div class="d-flex justify-content-between">
                    <h4 class="card-title mg-b-0">Subscriptions</h4>
                </div>
            </div>
            <div class="card-body">
                <div class="table-responsive">
                    <table class="table text-md-nowrap" id="example2">
                    <thead>
                            <tr>
                                <th class="wd-lg-8p"><span>S.NO</span></th>
                                <th class="wd-lg-8p"><span>Package Name</span></th>
                                <th class="wd-lg-8p"><span>Package Cycle</span></th>
                                <th class="wd-lg-8p"><span>Package Price</span></th>
                                <th class="wd-lg-8p"><span> Client</span></th>
                                <th class="wd-lg-8p">Action</th>
                            </tr>
                        </thead>
                        <tbody>
                                                         @foreach($subscriptions as $subscription)
                            <tr>
                                <td>{{$i++}}</td>
                                <td>{{$subscription->package_name}}</td>
                                <td>{{$subscription->package_type}}</td>
                                <td>{{$subscription->package_price}}</td>
                                <td>{{ucwords($first_name)}} {{$last_name}}</td>
                                <td>
                                    <a href="javascript:;" id="pdfDownload" db-id = "{{$subscription->id}}"><i class="fas fa-file-invoice"></i></a>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>


<a href="" id="downloadfile" fileName=""></a>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.1.10/dist/sweetalert2.all.min.js"></script>


<script type="text/javascript">
$(document).on('click', '#pdfDownload', function(e) {

    var  id = $(this).attr('db-id');


    $.ajax({
        url: "/api/Genereate/Invoice/"+ id,
        type: "POST",
        data:{id:id},
        dataType: "json",
        headers: {
            "X-CSRF-TOKEN": "{{ csrf_token() }}",
            "Content-Type": "application/json"
        },

        success: function(response) {
            console.log(response)
            if (response["status"] == "success") {

                $("#downloadfile").attr('href', '/uploads/' + response["filename"]);

                $("#downloadfile").attr('fileName', response['filename']);
                $("#downloadfile").click();

            }
        },
        error: function(error) {
            console.log(error)
        }
    });

})

$(document).on('click', '#downloadfile', function(e) {
    e.preventDefault(); //stop the browser from following
    var fileUrl = $(this).attr('href');

    fetch(fileUrl)
        .then(resp => resp.blob())
        .then(blob => {
            const url = window.URL.createObjectURL(blob);
            const a = document.createElement('a');
            a.style.display = 'none';
            a.href = url;
            // the filename you want
            a.download = $(this).attr('fileName');
            document.body.appendChild(a);
            a.click();
            window.URL.revokeObjectURL(url);

        })

});
</script>









@endsection