@extends('laundry::layouts/contentLayoutMaster')

@section('title', __('Lost Damage Report') )

@section('vendor-style')
  {{-- vendor css files --}}
  <link rel="stylesheet" href="{{ asset(('laundry-files/vendors/css/tables/datatable/dataTables.bootstrap4.min.css')) }}">
  <link rel="stylesheet" href="{{ asset(('laundry-files/vendors/css/tables/datatable/responsive.bootstrap4.min.css')) }}">
  <link rel="stylesheet" href="{{ asset(('laundry-files/vendors/css/tables/datatable/buttons.bootstrap4.min.css')) }}">
  <link rel="stylesheet" href="{{ asset(('laundry-files/vendors/css/tables/datatable/rowGroup.bootstrap4.min.css')) }}">
  <link rel="stylesheet" href="{{ asset(('laundry-files/vendors/css/pickers/flatpickr/flatpickr.min.css')) }}">
  <link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/>
  
  @livewireStyles
@endsection
@section('page-style')
  <!-- Page css files -->
  <style>
    .dataTables_info{
      padding-left: 15px;
    }
    .dataTables_length{
      padding-left: 15px;
    }
    .pagination{
      padding-right: 15px;
    }
    .dataTables_filter{
      padding-right: 15px;
    }
  
  .buttons-copy{
    margin-left: 15px;
  }
  .buttons-html5{
    margin-top: 15px;
    box-shadow: none;
    display: inline-block;
    font-weight: 400;
    color: #6e6b7b;
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
    padding: 0.786rem 1.5rem;
    font-size: 1rem;
    line-height: 1;
    border-radius: 0.358rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, background 0s, border 0s;
    border-color: #7367f0 !important;
    background-color: #7367f0 !important;
    color: #fff !important;
  }
    </style>
  @endsection

  

@section('content')
@if(session()->has('message'))
    <div class="alert alert-success p-2" role="alert">
        {{ session()->get('message') }}
    </div>
@endif

@if($errors->any())
    {!! implode('', $errors->all('<div class="alert alert-danger p-2" role="alert">:message</div>')) !!}
@endif

<!-- Basic table -->
<section id="basic-datatable">
  <div class="row">
    <div class="col-12">
      <div class="card">

        <div class="card-body">

            <div class="modal-body flex-grow-1 row">
              <div class="form-group col-md-5">
                  <label class="form-label" for="basic-icon-default-fullname">{{ __('Category') }}</label>
                  <select class="form-control"
                    id="category"
                    name="category_id"
                    onchange="getSubCat()"
                    required>
                    <option value="">{{ __('Select Category') }}</option>
                    @foreach($categories as $category)
                      <option value="{{$category->id}}" @if(isset($_GET['cat'])) {{ $_GET['cat'] == $category->id ? 'selected' : '' }} @endif >{{$category->name}}</option>
                    @endforeach
                    required
                  </select>
              </div>
              <div class="form-group col-md-5">
                  <label class="form-label" for="basic-icon-default-fullname">{{ __('Sub Category') }}</label>
                  <select class="form-control"
                    id="subcategory"
                    name="subcategory_id"
                    required
                    disabled>
                    <option value="">{{ __('Select Sub Category') }}</option>
                  </select>
              </div>
              <div class="form-group col-md-2">
              <label class="form-label" for="basic-icon-default-fullname"> </label>
                  <button onclick="reloadWithParams()" class="btn btn-primary form-control">{{ __('Search') }}</button>
              </div>
             

              <div class="form-group col-md-6">
                <br/>
                <h5>{{ __('Quantity') }}: <span id="totalTags">{{ count($items) }}</span></h5>
              </div>
              
            </div>
          
        </div>

        <table id="rfidtable" class="table" style="width:100%">
          <thead>
              <tr>
                <th>#</th>
                <th>{{ __('Sub Category') }}</th>
                <th>{{ __('RFID') }}</th>
                <th>{{ __('Status') }}</th>
                <th>{{ __('Repot Date') }}</th>
                <th>{{ __('Reason') }}</th>
              </tr>
          </thead>
          <tbody>
                            @foreach($items as $item)