@extends('layouts.admin')

@section('title' , 'Employees')

@section('breadcrumb-item')
    <li class="breadcrumb-item active">Employees</li>
@endsection

@section('content')
    <div class="card">
        <div class="card-header bg-theme">
            <p class="h5 pt-2 mb-0 float-left"><i class="fa fa-list pr-1"></i>Employees List</p>
            <a href="{{route('admin.employee.create')}}" data-toggle="tooltip" data-placement="bottom"
               title="Add New Record" class="btn btn-info float-right ml-2">
                <i class="fa fa-plus"></i>
            </a>
            <form action="{{route('admin.employees')}}" method="get" class="form-inline float-right">
                <div class="form-group mr-1">
                    <select class="form-control" id="employee_type">
                        <option value="">All</option>
                        @foreach($employee_types as $type)
                            <option value="{{ $type['value'] }}"
                                    {{ request()->query('type') == $type['value'] ? "selected":"" }}>
                                {{ $type['name'] }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="form-group">
                    <div class="input-group">
                        <input class="form-control" type="text" name="q" value="{{ request()->query('q') }}"
                               placeholder="Search in Employees">
                        <div class="input-group-append">
                            <button class="btn btn-success" type="submit"><i class="fa fa-search"></i></button>
                        </div>
                        <div class="input-group-append">
                            <a class="btn btn-danger{{ request()->query('q') ? '' : ' disabled' }}"
                               href="{{route('admin.employees')}}">
                                <i class="fa fa-eraser"></i></a>
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="card-body" style="overflow-x:auto;">
            <table class="table table-hover table-c">
                <thead>
                <tr>
                    <th>#</th>
                    <th>Name</th>
                    <th>Email</th>
                    <th>Mobile</th>
                    <th>Roles</th>
                    <th>Status</th>
                    <th>Actions</th>
                </tr>
                </thead>
                <tbody>
                @forelse($employees as $key => $employee)
                    <tr>
                        <td>{{ $employees->firstItem() + $key }}</td>
                        <td>{{$employee->name ?? ''}}</td>
                        <td>{{$employee->email ?? ''}}</td>
                        <td>{{$employee->mobile ?? ''}}</td>
                        <td>
                            @forelse($employee->roles as $role)
                                <span class="badge badge-success p-2" style="margin: 1px">{{ $role->name  ?? ''}}</span>
                            @empty
                                <span class="badge badge-warning p-2">No Roles</span>
                            @endforelse
                        </td>
                        <td>
                        <span class="badge {{ $employee->status == 'active' ? 'badge-success' : 'badge-danger' }}">
                            {{ $employee->status }}
                        </span>
                        </td>
                        <td>
                            <div class="btn-group">
                                <a href="{{route('admin.employee.show', ['id' => $employee->id])}}"
                                   data-toggle="tooltip" title="View"
                                   class="btn btn-sm btn-outline-primary"><i class="fa fa-eye"></i></a>
                                <a href="{{route('admin.employee.edit', ['id' => $employee->id, 'page' => request()->get('page', 1)])}}"
                                   data-toggle="tooltip" title="Edit"
                                   class="btn btn-sm btn-outline-success"><i class="fa fa-pencil"></i></a>
                                @if($employee->hasAnyRole(['Supplier', 'Sales Officer']))
                                <a href="{{route('admin.employee.assignOrders', ['id' => $employee->id])}}"
                                   data-toggle="tooltip" title="Assign Orders"
                                   class="btn btn-sm btn-outline-info"><i class="fa fa-tag"></i></a>
                                @endif
                                @include('includes.modals.delete', ['model' => 'employee', 'route' => 'admin.employee.delete'])
                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <th colspan="5" class="text-center">No Employees Found</th>
                    </tr>
                @endforelse
                </tbody>
            </table>
        </div>
        <div class="pagination justify-content-center mb-4">
            {{ $employees->links() }}
        </div>
    </div>
@endsection

@section('scripts')
    <script>
        $(function(){
            $('#employee_type').on('change', function () {
                let base_url = $("meta[name=base-url]").attr("content")+'/employees';
                let url = base_url+'?type=' + $(this).val();
                if ($(this).val()) window.location = url;
                else window.location = base_url;
                return false;
            });
        });
    </script>
@endsection