@extends('admin.layouts.admin')
@section('title', 'الفاتورة')

@section('content')
    <section class=" main-side">
        @php
            use SimpleSoftwareIO\QrCode\Facades\QrCode;
        @endphp
        <div id="html2pdf">
            <div id="prt-content" class="shadow-sm prt-none-shadow">
                <div class="box-shadow invoice-container">
                    @if ($client_invoice?->type == 'invoice')
                        @if ($client_invoice?->paid)
                            <div class="status-invoice paid ">
                                مدفوعة
                            </div>
                        @elseif('unpaid')
                            <div class="status-invoice ">
                                غير مدفوعة
                            </div>
                        @else
                            <div class="status-invoice ">
                                مدفوعة جزئيا
                            </div>
                        @endif
                    @endif
                    <img class="bg-img" src="{{ setting('logo') ? display_file(setting('logo')) : asset('admin-asset/img/login/logo-icon.png') }}" alt="const tech">
                    <div class="p-3 pt-2 pt-md-0 ps-5">
                        <div>
                            <div class="header-invoice py-4 mb-3">
                                <div class="row align-items-center g-3">
                                    <div class="col-lg-4 text-center text-lg-start">
                                        <div class="name">
                                            {{ setting('website_name') }}
                                        </div>
                                        <div class="">
                                            الرقم الضريبي: {{ setting('tax_number') ?? 'لم يحدد' }}
                                        </div>
                                        <div class="">
                                            العنوان: {{ setting('address') ?? 'لم يحدد' }}
                                        </div>
                                        <div class="">
                                            رقم الجوال: {{ setting('phone') ?? 'لم يحدد' }}
                                        </div>
                                    </div>
                                    <div class="col-lg-4 text-center">
                                        @if ($client_invoice?->type == 'invoice')
                                            <h4 class="mb-2 fw-bold">
                                                فاتورة مبيعات
                                            </h4>
                                        @else
                                            <h4 class="mb-2 fw-bold">
                                                عرض سعر
                                            </h4>
                                        @endif
                                        <span class="fw-bold text-danger">
                                            ( <i class="fas fa-file-invoice-dollar"></i> رقم الفاتورة:
                                            {{ $client_invoice?->id }})
                                        </span>
                                    </div>
                                    <div class="col-lg-4 text-center text-lg-start">
                                        <div class="img-holder text-lg-end">
                                            <img src="{{ setting('logo') ? display_file(setting('logo')) : asset('admin-asset/img/login/logo-icon.png') }}"
                                                alt="const tech" width="100">
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <h5 class="black mb-2 text-center fw-600">
                                السَّلاَمُ عَلَيْكُمْ وَرَحْمَةُ اللهِ وَبَرَكَاتُهُ <span class="me-1">وبعد</span>
                            </h5>
                            <div class="d-flex align-items-center flex-wrap gap-2 mb-3 justify-content-between">
                                <h6 class="black mb-0 fs-15px fw-600"><i class="fas fa-user-tie"></i> المكرم / <span
                                        class="text-danger">
                                        {{ $client_invoice?->client?->name }}</span></h6>
                                <div class="date fw-500 mb-0 ">{{ date('Y-m-d ') }} <i class="fas fa-calendar-week"></i>
                                </div>
                            </div>
                            @if ($client_invoice?->items->count() > 0)
                                <table class="table table-hover table-bordered">
                                    <thead>
                                        <tr>
                                            <th>المنتج</th>
                                            <th>الكمية</th>
                                            <th>سعر المنتج</th>
                                            <th>الإجمالي</th>
                                        </tr>
                                    </thead>
                                    <tbody>

                                        @forelse ($client_invoice->items as $product)
                                            <tr>
                                                <td>{{ $product->medical_clinic?->name }}</td>
                                                <td>{{ $product->quantity }}</td>
                                                <td>{{ $product->price }}</td>
                                                <td class="text-center fw-bold">
                                                    {{ number_format($product->price * $product->quantity, 2) }}
                                                </td>
                                            </tr>
                                        @empty
                                        @endforelse

                                    </tbody>
                                </table>
                            @endif
                            <div class="box-services mb-4">
                                <h6 class="title">
                                    <i class="fas fa-file-signature"></i>
                                    الخدمة
                                </h6>
                                <div class="des">
                                    {!! $client_invoice->services !!}
                                </div>
                            </div>
                            <div class="box-services mb-4">
                                <h6 class="title">
                                    <i class="fas fa-money-bill-transfer"></i>
                                    المبالغ المستحقة
                                </h6>
                                <div class="bar-price">
                                    <div class="holder">
                                        <th>مبلغ الفاتورة :</th>
                                        @php
                                            $totalSum = $client_invoice->items->sum(function ($item) {
                                                return $item->price * $item->quantity;
                                            });
                                        @endphp
                                        <td>{{ number_format($client_invoice->subtotal, 2) }}</td>
                                    </div>
                                    <div class="holder">
                                        <th>الخصم :</th>
                                        <td>{{ $client_invoice->discount ?? 0 }}</td>
                                    </div>
                                    <div class="holder">
                                        <th>المدفوع :</th>
                                        <td>{{ $client_invoice->paid }}</td>
                                    </div>
                                    <div class="holder">
                                        <th>المتبقي :</th>
                                        <td>{{ $client_invoice->rest }}</td>
                                    </div>
                                    <div class="holder">
                                        <th>اجمالي المبلغ :</th>
                                        <td>{{ $client_invoice->price }}</td>
                                    </div>
                                </div>
                            </div>

                            @if ($client_invoice->type === 'invoice')
                                <div class="md-4">
                                    {!! $client_invoice->description !!}
                                </div>
                            @else
                                <div class="md-4">
                                    {!! $client_invoice->price_conditions !!}
                                </div>
                            @endif

                            @if ($client_invoice->bank_account_id)
                                <div class="box-bank mb-1">
                                    <div class="item">
                                        <div class="title">
                                            أسم الحساب:
                                        </div>
                                        <div class="content">
                                            {{ $client_invoice->bank?->account_name }}
                                        </div>
                                    </div>
                                    <div class="item">
                                        <div class="title">
                                            أسم البنك:
                                        </div>
                                        <div class="content">
                                            {{ $client_invoice->bank?->bank_name }}
                                        </div>
                                    </div>
                                    <div class="item">
                                        <div class="title">
                                            رقم الحساب:
                                        </div>
                                        <div class="content">
                                            {{ $client_invoice->bank?->account_number }}
                                        </div>
                                    </div>
                                    <div class="item">
                                        <div class="title">
                                            رقم الـIPN:
                                        </div>
                                        <div class="content">
                                            {{ $client_invoice->bank?->ipn_number }}
                                        </div>
                                    </div>
                                </div>
                            @else
                                <p class="text-center mt-5">لا توجد بيانات حساب بنكي.</p>
                            @endif

                            <div class="box-information">
                                <div class="box-qr">
                                    <div class="text">
                                        سياسه الاتفاق
                                    </div>

                                    <div class="visible-print text-center">
                                        {!! QrCode::size(100)->generate(route('admin.privacy.policy')) !!}
                                        {{-- <p class="qr-description text-dark">اسكان لعرض سياسة الخصوصية</p> --}}
                                    </div>
                                </div>
                                <div class="content">
                                    <div
                                        class="d-flex justify-content-center justify-content-md-start align-items-center gap-2 flex-wrap">
                                        <a href="#" class="badge-footer text-light " target="_blank">
                                            {{ setting('website_name') }}
                                            <i class="icon fas fa-globe"></i>
                                        </a>
                                        <div class="badge-footer">
                                            {{ setting('company_email') }}
                                            <i class="icon fas fa-envelope"></i>
                                        </div>
                                        <div class="badge-footer">
                                            {{ setting('phone') }}
                                            <i class="icon fas fa-phone"></i>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="d-flex align-items-center gap-2 justify-content-center mt-3 mb-4 pb-2">
            <a class="btn btn-sm btn-danger" href="javascript:generateHTML2PDF()">
                <i class="fa-solid fa-file-pdf"></i>
            </a>
            <button class="btn btn-warning btn-sm text-white" id="btn-prt-content">
                <i class="fas fa-print"></i>
            </button>
        </div>
    </section>
    @push('js')
        <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.debug.js"></script>
        <script src="https://html2canvas.hertzen.com/dist/html2canvas.js"></script>
        <script>
            function generateHTML2PDF() {
                var element = document.getElementById('html2pdf');

                html2canvas(element, {
                    scale: 2
                }).then(function(canvas) {
                    var imgData = canvas.toDataURL('image/jpeg', 0.7);
                    var pdf = new jsPDF();

                    // Set the width and height of the PDF page to match the element's dimensions
                    var imgWidth = pdf.internal.pageSize.getWidth();
                    var imgHeight = (canvas.height * imgWidth) / canvas.width;

                    pdf.addImage(imgData, 'JPEG', 0, 0, imgWidth, imgHeight);
                    pdf.save(`فاتورة رقم {{ $client_invoice->id }} - {{ $client_invoice->client?->name }}.pdf`);
                });
            }
        </script>

        <script>
            document.getElementById('copy-link-btn').addEventListener('click', function(e) {
                e.preventDefault();
                var text = this.getAttribute('data-clipboard-text');
                navigator.clipboard.writeText(text).then(function() {
                    alert('تم نسخ الرابط بنجاح');
                });
            });
        </script>
    @endpush
@endsection