@extends('layouts.app')
@section('title') {{'Create Category'}} @endsection
@section('content')

    <div class="col-md-12">
        <div class="panel panel-default">
            <div class="panel-heading"> Create Category </div>

            <div class="panel-body">

                @if (Session::has('msg'))
                    <div class="alert alert-info">{{ Session::get('msg') }}</div>
                @endif
                <div class="form-group">
                    <form method="get" action="" >
                    <div class="col-md-3">
                        Search By Value Name
                        <select name="id" class="form-control selectpicker" onchange="this.form.submit()" data-live-search="true" >
                            <option value=""> All </option>
                            @if(isset($value_name_list))
                                @foreach($value_name_list as $val)
                                    <option value="{{ $val->id }}"  @if(isset($_GET['id']) && $_GET['id'] == $val->id) selected="selected" @endif >{{ $val->values }}</option>
                                @endforeach
                            @endif
                        </select>
                    </div> 
                    </form>                 
                </div>


                <a class="pull-right btn btn-info" href="{{ url('/items/create') }}" >Create New</a><br>

                <div class="panel-body" id="myTablePrint"> 

                <div class="form-group mt-1" style="width:100%; height:700px; overflow: scroll;" >


                <table id="myTable" class="table table-striped table-hover">
                    <thead  class="header" id="myHeader">
                    <tr>
                        <th> S.N.</th>
                        <th> Category Types </th>
                        <th> Value Name </th>
                        <th> Action </th>
                    </tr>
                    </thead>
                    <tbody>
                    @php $i=0; @endphp

                   @foreach($items_list as $row)
                       @php $i++; @endphp
                        <tr>
                            <td>{{$i}}</td>
                            <td>{{$row->types}}</td>
                            <td>{{$row->values}}</td>
                            <td style="width: 70px;">
                                <a href="{{ url('/items/'.$row->id.'/edit') }}"> 
                                  <i class="fa fa-edit" style="color:green"></i> </a>
                                  @if (Auth::user()->parent_id == "0" )

                                   | 
                                 
                                <form  class="pull-right delete" action="{{ url('/items/'.$row->id) }}" method="post" onsubmit="return confirm('Are you sure you want to delete?')" >
                                     {{method_field('DELETE')}}
                                    <input type="hidden" name="_token" value="{{ csrf_token() }}">
                                    <button type="submit"><i class="fa fa-remove" style="color:red"></i></button>
                                </form>
                                @endif
                            </td>
                        </tr>
                   @endforeach
                    </tbody>
                </table>
                </div>
            </div>
            </div>
        </div>
        <style type="text/css">
            section.content.clearfix {
                padding: 0 !important;
                padding-top: 15px !important;
            }
            table.table.text-center.table-striped.table-hover.fixedHeader .header tr th {
                position: sticky;
                top: 0;
                /* width: 109%; */
                background: #D9E5D8;
            }

            table#myTable thead#myHeader{
                position: sticky;
                top: 0;
                /* width: 109%; */
                background: #D9E5D8;
            }
            table.table.text-center.table-striped.table-hover.fixedHeader .header tr:last-child th{
                top: 32px;
            }
        </style>

    </div>
    

@endsection