@extends('sysadmin.layouts.app')
@section('custom-css')

    <link rel="stylesheet" href="{{ asset('admin/css/data-table/bootstrap-editable.css') }}">
@endsection
@section('post-header')
    <div class="breadcome-area">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="breadcome-list">
                        <div class="row">
                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                <div class="breadcome-heading">
                                    <form role="search" class="sr-input-func">
                                        <input type="text" placeholder="Search..." class="search-int form-control">
                                        <a href="#"><i class="fa fa-search"></i></a>
                                    </form>
                                </div>
                            </div>
                            <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12">
                                <ul class="breadcome-menu">
                                    <li><a href="#">Dashboard</a> <span class="bread-slash">/</span>
                                    </li>
                                    <li><span class="bread-blod"> User List</span>
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

@endsection
@section('content')
    <div class="data-table-area mg-b-15">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                    <div class="sparkline13-list">
                        <div class="sparkline13-hd">
                            <div class="main-sparkline13-hd">
                                <h1>System <span class="table-project-n">Users</span> List</h1>
                            </div>
                        </div>
                        <div class="sparkline13-graph">
                            <div class="datatable-dashv1-list custom-datatable-overright">
                                <div id="toolbar">
                                    <select class="form-control dt-tb">
                                        <option value="">Export Basic</option>
                                        <option value="all">Export All</option>
                                        <option value="selected">Export Selected</option>
                                    </select>
                                </div>
                                <table id="table" data-toggle="table" data-pagination="true" data-search="true" data-show-columns="true" data-show-pagination-switch="true" data-show-refresh="true" data-key-events="true" data-show-toggle="true" data-resizable="true" data-cookie="true"
                                       data-cookie-id-table="saveId" data-show-export="true" data-click-to-select="true" data-toolbar="#toolbar">
                                    <thead>
                                    <tr>
                                        <th data-field="state" data-checkbox="true"></th>
                                        <th data-field="id">ID</th>
                                        <th data-field="name">Name</th>
                                        <th data-field="surname" >Surname</th>
                                        <th data-field="email" >Email</th>
                                        <th data-field="phone" >Phone</th>
                                        <th data-field="address"  >Address</th>
                                        <th data-field="addressDetails"  >Address Details</th>
                                        <th data-field="registrationDate"  >Registration Date</th>
                                        <th data-field="active" >Status</th>
                                        <th data-field="edit" >Edit</th>
                                    </tr>
                                    </thead>
                                    <tbody>
                                    @if(count($users) != 0)
                                    @foreach($users as $user)
                                    <tr>
                                        <td></td>
                                        <td>{{ $user->id }}</td>
                                        <td>{{ $user->name }}</td>
                                        <td>{{ $user->surname }}</td>
                                        <td>{{ $user->email }}</td>
                                        <td>{{ $user->phone }}</td>
                                        <td>{{ $user->address ? $user->address : "-" }}</td>
                                        <td>{{ $user->addressdetails ? $user->addressdetails : "-" }}</td>
                                        <td>{{ $user->registrationtime }}</td>
                                        <td class="datatable-ct"><label class="btn btn-{{ $user->active == 1 ? "success btn-active-driver" : "danger" }}"><i class="fa fa-{{ $user->active == 1 ? "check" : "times" }}"></i>
                                            {{ $user->active == 1 ? "Active" : "Not Active" }}
                                            </label>
                                        </td>
                                        <td class="datatable-ct">
                                            <a href="{{route('sysadmin.users.edit',$user->id)}}" >
                                                <i class="fa fa-pencil driver-module-pencil"></i>
                                            </a>

                                        </td>
                                    </tr>
                                    @endforeach
                                   @endif

                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection
@section('section-js')


    <script>
        $(document).ready(function() {
            $('#table').DataTable();
        } );
    </script>

@endsection