@extends('layouts.print')


@section('content')

    <style>
        @font-face {
            font-family: 'Jameel Noori Nastaleeq';
            src: url('path/to/font-file.woff2') format('woff2'),
                url('path/to/font-file.woff') format('woff');
            /* Add more font formats if available, such as .ttf, .eot, etc. */
            /* Adjust the path to the actual location of the font files on your server */
        }

        .urdufont {
            font-family: 'Jameel Noori Nastaleeq', Arial, sans-serif;
            font-size: 16px;
            /* Add any other font-related properties you want */
        }
    </style>



    <main class="main-content urdufont mt-0">
        <div class="page-header align-items-start min-vh-50 pt-5 pb-11 m-3 border-radius-lg"
            style="background-image: url('https://raw.githubusercontent.com/creativetimofficial/public-assets/master/argon-dashboard-pro/assets/img/signup-cover.jpg'); background-position: top;">
            <span class="mask bg-gradient-dark opacity-6"></span>

        </div>
        <div class="container" id="reportPrinting">
            <div class="row mt-lg-n10 mt-md-n11 mt-n10 justify-content-center">
                <div class="col-xl-10 col-lg-5 col-md-7 mx-auto">
                    <div class="card z-index-0">
                        </br></br></br></br>
                        <div class="card-header text-center pt-4" style="text-align: center;">
                            <h5 style="float: left;margin-top: -40px;">{{ $efiles->uniquenumber }}</h5>
                            <!--<h4>Azad Government of the State of Jammu & Kashmir</h4>
                  <p>Law, Justice, Parliamentary Affairs and Human Rights Department</p>-->


                            <div class="row">
                                <div class="col-12">
                                    <div class="card mb-4">
                                        <div class="card-header pb-0">
                                            <h6 style="font-size: 24px !important;">Noting history</h6>
                                        </div>
                                        <div class="card-body px-0 pt-0 pb-2">
                                            <div class="table-responsive p-0">
                                                <table class="table align-items-center mb-0">
                                                    <tbody>
                                                        @php
                                                            $counter = 1;
                                                            $draftremarks = DB::table('draftremarks')
                                                                ->where('draft_id', $efiles->draft_id)
                                                                ->get();
                                                        @endphp
                                                        @foreach ($draftremarks as $draftremark)
                                                            @php
                                                                $getname = DB::table('users')
                                                                    ->where('id', $draftremark->user_id)
                                                                    ->first();
                                                            @endphp
                                                            <tr>
                                                                <td style="padding-top: 0rem;padding-bottom: 0rem;">
                                                                    <div class="d-flex px-2 py-1">
                                                                        <div
                                                                            class="d-flex flex-column justify-content-center">
                                                                            @if (str_contains($draftremark->remark, '.pdf'))
                                                                            @else
                                                                                @if (isset($getname->name))
                                                                                    <h6 class="urdufont"
                                                                                        style="font-size: 18px !important;">
                                                                                        {{ $getname->name }}
                                                                                        ({{ $draftremark->job_title }})
                                                                                        :
                                                                                        (<span style="font-size: smaller;"
                                                                                            class="urdufont">{{ \Carbon\Carbon::parse($draftremark->created_at)->format('d/m/y H:i') }}</span>)

                                                                                    </h6>
                                                                                @endif
                                                                            @endif

                                                                        </div>
                                                                    </div>
                                                                </td>
                                                                <td style="padding:0rem 0rem !important;">
                                                                    @if (isset($draftremark->remark))
                                                                        @if (isset($getname->name))
                                                                            @if (str_contains($draftremark->remark, '.pdf'))
                                                                            @else
                                                                                <h6 <span
                                                                                    class="text-xs font-weight-bold mb-0 urdufont"
                                                                                    style="font-size: 18px !important;font-weight: 300 !important;">
                                                                                    (@php echo $counter @endphp):
                                                                                    {!! nl2br($draftremark->remark) !!}</span>
                                                                                </h6>

                                                                                @php
                                                                                    $counter++;
                                                                                @endphp
                                                                            @endif
                                                                        @endif
                                                                    @endif
                                                                    @if (isset($draftremark->notify))
                                                                        <p class="text-xs font-weight-bold mb-0 urdufont">
                                                                            {{ $draftremark->notify }}</p>
                                                                    @endif
                                                                </td>


                                                                <td style="padding:0rem 0rem !important;">

                                                                    @if ($getname->signature)
                                                                        <img src="{{ asset($getname->signature) }}"
                                                                            alt="Member Signature"
                                                                            style="height: 50px; width: auto;">
                                                                    @endif

                                                                </td>



                                                            </tr>
                                                        @endforeach
                                                    </tbody>
                                                </table>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>


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




        </div>



        <div class="text-center">

            <button class="btn bg-gradient-dark w-100 my-4 mb-2" onclick="printReport();">Print</button>
        </div>


    </main>



    <script type="text/javascript">
        function printReport() {
    var prtContent = document.getElementById("reportPrinting").innerHTML;
    var WinPrint = window.open('', '', 'width=800,height=600');
    WinPrint.document.open();
    WinPrint.document.write('<html><head><title>Print</title>');
    WinPrint.document.write('</head><body>');
    WinPrint.document.write('<style type="text/css">');
    WinPrint.document.write(
        'body { font-family: "Jameel Noori Nastaleeq", Arial, sans-serif; font-size: 16px; line-height: 1; }');
    WinPrint.document.write('td { padding: 4px; vertical-align: middle; }');
    WinPrint.document.write('img { vertical-align: middle; }');
    WinPrint.document.write('@media print {'); // Start media query for printing
    WinPrint.document.write('  td.image-td { margin-bottom: 10px; }'); // Add margin to the third td for the image
    WinPrint.document.write('}');
    WinPrint.document.write('</style>');
    WinPrint.document.write(prtContent);
    WinPrint.document.write('</body></html>');
    WinPrint.document.close();
    
    // Wait for the image to load before printing
    var images = WinPrint.document.getElementsByTagName("img");
    var loadedImages = 0;
    for (var i = 0; i < images.length; i++) {
        images[i].onload = function() {
            loadedImages++;
            if (loadedImages === images.length) {
                // All images are loaded, so we can print now
                WinPrint.focus();
                WinPrint.print();
                WinPrint.close();
            }
        };
    }
}



    </script>










@endsection