@extends('layouts.app')

@section('page-css')

@endsection

@section('content')
    <div class="container-fluid d-block">
        <div id="all-items-page-container" class="py-4">
            <div class="card mb-4">
                <div class="card-header">
                    {{ $page_title }}
                </div>

                <div class="card-body">
                    @if(session()->has('success'))
                        <div class="alert alert-success">
                            {{ session()->get('success') }}
                        </div>
                    @endif
                    @if(session()->has('danger'))
                        <div class="alert alert-danger">
                            {{ session()->get('danger') }}
                        </div>
                    @endif

                    <div class="col-md-12 pl-0" id="grow-sheet-filter-container">
                        {{-- Name Filter --}}
                        <div class="col-md-2 pl-0" id="grow-sheet-name-filter-container">
                            <div class="form-group">
                                <label>Name</label>
                                @if($user_list->responseCode == 800)
                                    @if(!empty($user_list->data))
                                        <select name="name" id="name" class="form-control" onchange="growSheetsPageFunctions.filter_by_name(this.value);" data-live-search="true" title="Select Name" data-size="10">
                                            @foreach($user_list->data as $key => $value)
                                                <option value="{{ $value->user_id }}">{{ $value->first_name .' '. $value->last_name }}</option>
                                            @endforeach
                                        </select>
                                    @else
                                        <select name="name" id="name" class="form-control" disabled data-live-search="true" title="No Users Loaded"></select>
                                    @endif
                                @else
                                    <select name="name" id="name" class="form-control" disabled data-live-search="true" title="No Users Loaded"></select>
                                @endif
                            </div>
                        </div>

                        <label class="mt-3">Smart Search</label>
                        {{-- Other Filters --}}
                        <hr>
                        <div class="col-md-4 pl-0 mt-3 mb-3" id="grow-sheet-other-filter-container">
                            <form action="{{ url('filter-growsheets') }}" method="POST" id="filter-form-growsheets">
                                <div class="d-flex mt-2 mb-2">
                                    {{-- Division --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Division</label>
                                        @if($divisions->responseCode == 800)
                                            @if(!empty($divisions->data))
                                                <select name="division" id="division" class="form-control" data-live-search="true" title="Select Division" data-size="10" onchange="growSheetsPageFunctions.selectDivision(this.value);">
                                                    @foreach($divisions->data as $key => $value)
                                                        <option {{ (isset($value->group_name)) ? $value->group_name : '' }} value="{{ $value->division_id }}">{{ $value->division_name }}</option>
                                                    @endforeach
                                                </select>
                                            @else
                                                <select name="division" id="division" class="form-control" disabled title="No Divisions Loaded"></select>
                                            @endif
                                        @else
                                            <select name="division" id="division" class="form-control" disabled title="No Divisions Loaded"></select>
                                        @endif
                                    </div>
                                    {{-- Department --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Department</label>
                                        @if($departments->responseCode == 800)
                                            @if(!empty($departments->data))
                                                <select name="department" id="department" class="form-control" data-live-search="true" title="Select Department" data-size="10" onchange="growSheetsPageFunctions.selectDepartment(this.value);">
                                                    @foreach($departments->data as $key => $value)
                                                        <option {{ (isset($value->group_name)) ? $value->group_name : '' }} value="{{ $value->department_id }}">{{ $value->department_name }}</option>
                                                    @endforeach
                                                </select>
                                            @else
                                                <select name="department" id="department" class="form-control" disabled title="No Departments Loaded"></select>
                                            @endif
                                        @else
                                            <select name="department" id="department" class="form-control" disabled title="No Departments Loaded"></select>
                                        @endif
                                    </div>
                                </div>

                                <div class="d-flex mt-2 mb-2">
                                    {{-- Coach --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Coach</label>
                                        @if($coaches->responseCode == 800)
                                            @if(!empty($coaches->data))
                                                <select name="coach" id="coach" class="form-control" data-live-search="true" title="Select Coach" data-size="10" onchange="growSheetsPageFunctions.selectCoach(this.value);">
                                                    @foreach($coaches->data as $key => $value)
                                                        <option value="{{ $value->user_id }}">{{ $value->first_name . ' ' . $value->last_name }}</option>
                                                    @endforeach
                                                </select>
                                            @else
                                                <select name="coach" id="coach" class="form-control" disabled title="No Coaches Loaded"></select>
                                            @endif
                                        @else
                                            <select name="coach" id="coach" class="form-control" disabled title="No Coaches Loaded"></select>
                                        @endif
                                    </div>
                                    {{-- Coachee --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Coachee</label>
                                        @if($coaches->responseCode == 800)
                                            @if(!empty($coaches->data))
                                                <select name="coachee" id="coachee" class="form-control" data-live-search="true" title="Select Coachee" data-size="10" onchange="growSheetsPageFunctions.selectCoachee(this.value);">
                                                    @foreach($coachees->data as $key => $value)
                                                        <option value="{{ $value->user_id }}">{{ $value->first_name . ' ' . $value->last_name }}</option>
                                                    @endforeach
                                                </select>
                                            @else
                                                <select name="coachee" id="coachee" class="form-control" disabled title="No Coachees Loaded"></select>
                                            @endif
                                        @else
                                            <select name="coachee" id="coachee" class="form-control" disabled title="No Coachees Loaded"></select>
                                        @endif
                                    </div>
                                </div>

                                <div class="d-flex mt-2 mb-2">
                                    {{-- From --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>From</label>
                                        <input type="text" class="form-control datepicker" name="available_from" id="available_from" placeholder="Pick Date" required>
                                    </div>
                                    {{-- Until --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Until</label>
                                        <input type="text" class="form-control datepicker" name="available_until" id="available_until" placeholder="Pick Date" required>
                                    </div>
                                </div>

                                <div class="d-flex mt-2 mb-2">
                                    {{-- Request --}}
                                    <div class="form-group col-md-6 pl-0">
                                        <label>Request</label>
                                        <select name="request" id="request" class="form-control" title="Select Request">
                                            <option value="">Transfer</option>
                                            <option value="">Irrelevant</option>
                                            <option value="">Not Done</option>
                                            <option value="">Completed</option>
                                        </select>
                                    </div>
                                </div>
                            </form>
                        </div>
                        <hr>

                        <div class="col-md-4 pl-0 mt-3 mb-5" id="reset-filter-container">
                            <div class="form-group">
                                <button class="btn btn-sm btn-secondary" onclick="growSheetsPageFunctions.resetFilter();">Reset</button>
                                <button class="btn btn-sm btn-success" onclick="growSheetsPageFunctions.filter();">Search</button>
                            </div>
                        </div>
                    </div>

                    {{-- All GROW Sheets --}}
                    <div class="col-md-12 p-0">
                        <table class="table table-hovered table-striped table-bordered mt-3" width="100%" id="all-grow-sheets">
                            <thead>
                                <th>Coach Name</th>
                                <th>Coachee Name</th>
                                <th>Goal</th>
                                <th>Division</th>
                                <th>Department</th>
                                <th class="text-center">Created</th>
                                <th class="text-center">Action</th>
                            </thead>
                            @if($growsheet->responseCode == 800)
                                @if(!empty($growsheet->data))
                                    <tbody>
                                        @foreach($growsheet->data as $key => $value)
                                            <tr>
                                                <td><a target="_blank" href="{{ url('users/update') }}/{{ $value->coach_details->user_id }}" class="font-weight-bold">{{ $value->coach_details->full_name }}</a></td>
                                                <td><a target="_blank" href="{{ url('users/update') }}/{{ $value->coachee_details->user_id }}" class="font-weight-bold">{{ $value->coachee_details->full_name }}</a></td>
                                                <td>{{ $value->goal }}</td>
                                                <td>{{ $value->division_name }}</td>
                                                <td>{{ $value->department_name }}</td>
                                                <td class="text-center">{{  date('F d, Y', strtotime($value->created_at)) }}</td>
                                                <td class="text-center d-grid">
                                                    {{-- <div class="btn-group-vertical">
                                                        <button class="btn btn-sm btn-primary m-1">sadsa</button>
                                                        <button class="btn btn-sm btn-primary m-1">sadsa</button>
                                                        <button class="btn btn-sm btn-primary m-1">sadsa</button>
                                                        <button class="btn btn-sm btn-danger m-1">sadsa</button>
                                                    </div> --}}
                                                    <a href="{{ url('growsheet/view') }}/{{ $value->grow_session_id }}" class="font-weight-bold m-1 text-primary"><i class="fa fa-folder"></i> View</a>
                                                    <a href="#" class="font-weight-bold m-1 text-secondary"><i class="fas fa-star"></i> View Rating</a>
                                                    <a href="#" class="font-weight-bold m-1 text-success"><i class="fas fa-file-download"></i> Download</a>
                                                    <a href="#" class="font-weight-bold m-1 text-danger" data-id="2" data-toggle="modal" data-target="#delete_modal" onclick="generalUseFunctions.populateDeleteModal('delete_growsheet', {{ json_encode($value) }});"><i class="fa fa-trash"></i> Delete</a>
                                                </td>
                                            </tr>
                                        @endforeach
                                    </tbody>
                                @else
                                    <tbody></tbody>
                                @endif
                            @else
                                <tbody></tbody>
                            @endif
                        </table>
                    </div>
                </div>
            </div>
        @include('pages.includes.footer')
    </div>
@endsection

@section('page-js')
    <script type="text/javascript">
        $.csrf_token    =   $('meta[name="csrf-token"]').attr('content');
        $.backoffice_url  =   "{{ env('BACKOFFICE_URL') }}";
        $('#growsheet-link').addClass('active');

        generalUseFunctions.initializeDataTable('all-grow-sheets', true, true);
        growSheetsPageFunctions.onload();
    </script>
@endsection