@extends('layout.master')
@section('content')
<meta name="csrf-token" content="{{ csrf_token() }}">

<style>
     .table-responsive>nav>.flex{
        display: flex !important;
        justify-content: end !important;
     }
    .table-responsive>nav>.flex>span,.table-responsive>nav>.flex>a{
        background: #007bff !important;
        display: none !important;
    }

    .hidden>div>p{
        color: black !important;
    }

    .leading-5>svg{
        width: 20px !important;
        color: #007bff !important;
    }
    .leading-5{
        color: #007bff !important;
    }
</style>

    <div class="section-body">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header row">
                        <div class="col-md-10">
                            <h4>QR CODES</h4>
                        </div>
                        <div class="col-md-2">
                            <a href="{{route('qrcode.create')}}" class="btn btn-primary"><i
                                    class="fas fa-plus"></i></a>
                        </div>
                        <div class="col-md-6">
                            <form action="{{ route('qrcode.search') }}" class="d-flex align-items-center " method="GET">
                            @csrf
                            <input type="text" value="{{ $query }}" name="search" placeholder="Search" class="form-control">
                            <input type="submit"  placeholder="Search" style="margin-left: 10px;" value="Submit" class="form-control ms-3 btn btn-primary">
                            </form>
                        </div>
                        <div class="col-md-6 d-flex align-items-center  justify-content-end">

                           <input type="checkbox" id="expire" onchange="javascript:getExpire();">
                           <label for="expire" style="margin-left: 10px;margin-top:10px;" ><b>Expired</b></label>
                        </div>
                    </div>
                    <div class="card-body">
                        <div class="table-responsive" id="">
                        <form action="{{ route('qrcode.multidelete') }}" method="post">
                        @csrf
                            <table class=""  style="width:100%;">
                                <thead>
                                    <tr>
                                    <th class="wd-20p">
                                            <input type="checkbox"
                                                   name="checkall" id="checkall">
                                        </th>
                                        <th witdh="10%">ID</th>
                                        <!--<th witdh="10%">Label Name</th>-->
                                        <th witdh="10%">Calibration Date</th>
                                        <th witdh="10%">Recalibration Date</th>
                                        {{-- <th witdh="10%">Equipment_name</th> --}}
                                        <th witdh="10%">ID No.</th>
                                        <!--<th witdh="20%">Url</th>-->
                                        <th witdh="20%">Action</th>
                                </tr>
                                </thead>
                                @forelse ($qrs as $key => $qr)
                                <tr>
                                <td><input type="checkbox" id="checkall" value="{{ $qr->id }}" name="id[]"></td>
                                    <td>{{$qr->id}}</td>
                                    <!--<td>{{$qr->label_id}}</td>-->
                                    <td>{{$qr->calibration_date}}</td>
                                    <td>{{$qr->recalibration_date}}</td>
                                    {{-- <td>{{$qr->equipment_name}}</td> --}}
                                    <td>{{$qr->serial_number}}</td>
                                    <!--<td>{{\URL::to('/').'/pdf/show_by_label/'.$qr->id}}</td>-->
                                      <td>
                                          <div class="row">
                                              <div class="col-md-3">
                                                  <a href="{{route('qrcode.edit', ['qrcode' => $qr->id])}}" class="btn btn-primary"><i
                                                          class="fas fa-edit"></i></a>
                                              </div>

                                              <div class="col-md-3">
                                                <a target="_blank" href="{{route('qrcode.show', ['qrcode' => $qr->id])}}" class="btn btn-secondry"><i
                                                        class="fas fa-print"></i></a>
                                            </div>
                                            <div class="col-md-3">
                                                <a target="_blank" href="{{route('qrcode.renew', ['qrcode' => $qr->id])}}" class="btn btn-info"><i
                                                        class="fas fa-arrow-up"></i></a>
                                            </div>

                                              <div class="col-md-3">
                                              <a href="{{route('qrcode.destroy',$qr->id)}}"
                                              class="btn btn-sm btn-danger">Delete</a>
                                                <!-- <form action="{{route('qrcode.destroy', $qr->id)}}" method="post">
                                                    @csrf
                                                    @method('DELETE')
                                                    <button class="btn btn-danger" type="submit" class="fas fa-delete">D</button>
                                                </form> -->
                                              </div>

                                             

                                          </div>
                                      </td>
                                  </tr>
                                @empty
                                    
                                @endforelse
                            </table>
                            <button type="submit" class="btn btn-danger">Delete</button>

                        </form>
                            {{ $qrs->links() }}
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@push('scripts')
<script>
    $(document).ready(function() {
        $("#checkall").click(function() {
            $('input:checkbox').not(this).prop('checked', this.checked);
        });
    });
</script>
<script>

$(document).ready(function() {
$('#save-stage2').DataTable( {
"lengthMenu": [[100,500,1000], [100,500,1000]]
} );
} );
   

function getExpire() {

if (document.getElementById('expire').checked) {
            $.ajax({
               type:'GET',
               url:"{{ route('qrcode.expire') }}",
               data:'_token =