@extends('layouts.adminapp')

@section('content')

<div class="card mb-4" >
           
    <div id="printableArea" style="height: 100%;" >
        <style>
            body
            {
                font-size:15px;
                font-family: 'Roboto', sans-serif;
            }
            .table1 {
              border-collapse: collapse;
            }
            
            .table1, .th1, .td1 {
              border: 1px solid black;
            }
        
            h1,h2,h3,h4,h5,h6,p {
                margin: 5;
            }
        
            .result-table {
                width: 100%;
                margin-top: 10px;
            }
        
            .result-table th {
                height: 50px;
                border-bottom: 1px solid #ddd;
                border-left: 1px solid #ddd;
            }
        
             .result-table td {
                border-bottom: 1px solid #ddd;
                border-left: 1px solid #ddd;
                padding: 5px;
            }
            
            .btn-part {
                
            }
        
            .btn-print{
               padding:18px 30px;
               border-color:black;
               background-color:inherit;
               border-radius:40px;
               margin-top: 10px;
           }
           .btn-print:hover{
               padding:18px 30px;
               color:white;
               background-color:black;
               border-radius:40px;
               cursor: pointer;
           }
            
            
           @page {
        }
        </style>
        <script>
        function printDiv(divName) {
         var printContents = document.getElementById(divName).innerHTML;
         var originalContents = document.body.innerHTML;
        
         document.body.innerHTML = printContents;
        
         window.print();
        
         document.body.innerHTML = originalContents;
         
        }
        </script> 
        <div style="padding:5px;" >
   
            <!-------------------  HEAD  -------------------------------------->
            <div style="border:double; padding: 10px; width: 100%; float: left;">

                <div style="padding:20px 0; text-align:center;"><h4>{{ __('lng.MemberShipCardReport') }}</h4></div>
                
               @php
               $Company=PBFunc::GetCompany();
               @endphp
               @foreach ($Members as $Member)
                  {{--STRAT MEMBER SHIP CARD PRINT AREA --}}

                  <div class="card-body" >
                     <table style="padding-top:0; width: 100%; color:#000;">
                        <td style="width: 50%;">
                           <div class="card shadow" >
                                 <div class="card-body MemberShipCard">
                                    <div class="table-responsive">
                                       <table style="padding-top:0;  padding-bottom:5px; color:#000;">
                                             <tr>
                                                <td style="width: 24%;">
                                                      <img class="CompanyImage" src="{{PBFunc::ImageLink(PBCon::STORAGE_LOCATION_IMAGE_CompanyLogo,$Company->logo)}}"/>
                                                </td>
                                                <td style="width: 76%; text-align:center;">
                                                   <h5 class="CompanyHead">{{$Company->title}} </h5>
                                                   <h6 class="CompanyDetails">{{$Company->place}}, {{$Company->district}},<br>
                                                         {{$Company->state}}{{$Company->email}},{{$Company->contact}}</h6>
                                                </td>
                                             </tr>
                                       </table>
                                 <hr>
                                 <table style="padding-top:0; width: 100%; padding-bottom:5px; color:#000;">
                                    <td >
                                       <span class="MemberDetails" >{{__('lng.Name')}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: &nbsp; {{$Member->name}} </span> <br>
                                       <span class="MemberDetails" >{{__('lng.Phone')}} &nbsp;&nbsp;&nbsp;&nbsp;: &nbsp; {{$Member->contact}} </span><br>
                                       @php $Birth =  date("d-M-Y",strtotime($Member->dob)); @endphp
                                       @if ($Member->dob)
                                       <span class="MemberDetails" >{{__('lng.Birth')}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : &nbsp; {{$Birth}}</span>
                                       @else
                                       <span class="MemberDetails" >{{__('lng.Birth')}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : &nbsp; </span>
                                       @endif
                                    </td>
                                    <td > 
                                       {{-- <img class="QRCode" src="https://barcode.tec-it.com/barcode.ashx?data={{$Member->house->name}}{{$Member->name}}&code=QRCode&translate-esc=true&dmsize=Default&eclevel=L"/> --}}
                                       {{-- <img class="Barcode"  src="https://barcode.tec-it.com/barcode.ashx?data={{$Member->id}}&code=Code39&dmsize=Default"/> --}}
                                       
                                       <h1 class="Barcode" >*{{$Member->id}}*</h1>
                                    </td>
                                    <td style="">
                                       <img width="50px" src="{{PBFunc::ImageLink(PBCon::STORAGE_LOCATION_IMAGE_Member,$Member->photo)}}"/>
                                    </td>
                                 </table>
                                 </div>
                           </div>
                           </div>
                        </td>
                        <td style="width: 50%;">
                           <div class="card shadow" >
                                 <div class="card-body MemberShipCard">
                                    <table style="padding-top:0; width: 100%; color:#000;">
                                       <td >
                                             <span class="HouseDetails" >{{__('lng.House')}}  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: &nbsp; {{$Member->house->name}} </span> <br>
                                             <span class="HouseDetails" >{{__('lng.RegisterNo')}} &nbsp;&nbsp;&nbsp;&nbsp;: &nbsp; #{{$Member->house->registernumber}} </span><br>
                                             <span class="HouseDetails" >{{__('lng.TotalMembers')}} &nbsp;&nbsp;&nbsp;&nbsp;: &nbsp;{{App\Models\Member::where('house_id',$Member->house->id)->where('isCancelled',0)->count()}} </span><br>
                                             <span class="HouseDetails" >{{__('lng.Place')}}&nbsp;&nbsp;&nbsp;&nbsp; : &nbsp; {{$Member->house->place}}</span><br>
                                             <span class="HouseDetails MobileRes" >{{__('lng.Post')}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : &nbsp; {{$Member->house->post}}</span><br>
                                             <span class="HouseDetails MobileRes" >{{__('lng.District')}}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; : &nbsp; {{$Member->house->district}},{{$Member->house->state}}</span>
                                       </td>
                                       <td > 
                                             {{-- <img class="QRCode" src="https://barcode.tec-it.com/barcode.ashx?data={{$Member->house->name}}{{$Member->name}}{{$Member->contact}}{{$Member->house->registernumber}}{{$Member->house->place}}{{$Member->house->post}}{{$Member->house->district}}{{$Member->house->state}}&code=QRCode&translate-esc=true&dmsize=Default&eclevel=L"/> --}}
                                             <img class="QRCode"   src="https://api.qrserver.com/v1/create-qr-code/?size=150x150&data={{$Member->house->name}}{{$Member->name}}{{$Member->contact}}{{$Member->house->registernumber}}{{$Member->house->place}}{{$Member->house->post}}{{$Member->house->district}}{{$Member->house->state}}"/>
                                       </td>
                                    </table>
                                    <table  style=" width: 100%; color:#000;">
                                       <td style="text-align: center" >
                                             <h1 class="Barcode" >*{{$Member->house->registernumber}}*</h1>
                                             {{-- <img  width="150px" src="{{asset('assets/images/barcode.png')}}"/> --}}
                                       </td>
                                    </table>
                                 </div>
                           </div>
                        </td>
                     </table>
                        </div>
               {{--STRAT MEMBER SHIP CARD PRINT AREA --}}
                
            @endforeach
                
            </div>
        </div>
    </div>
    <div class="btn-part" style="text-align: center;">
        <button type="button" onclick="history.back()" class="btn  btn-primary m-3 btn-icon-split" >
            <span class="icon text-white-50">
                <i class="fas fa-arrow-left"></i>
            </span>
            <span class="text">{{__('lng.Back')}}</span>
        </button>
        <button type="button" onclick="printDiv('printableArea')" class="btn  btn-info m-3 btn-icon-split" >
            <span class="icon text-white-50">
                <i class="fas fa-print"></i>
            </span>
            <span class="text">{{__('lng.PrintForm')}}</span>
        </button>
    </div>
</div>
@endsection