@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">
                        {{-- Coach Name --}}
                        <div class="col-md-4 pl-0">
                            <div class="form-group col-md-6 pl-0">
                                <label>Name</label>
                                <p>{{ $coach_details->user->full_name }}</p>
                            </div>
                        </div>

                        <div id="alert-container-coachee-bucket"></div>

                        {{-- Coachees Open Bucket --}}
                        <div class="col-md-3 pl-0">
                            <div class="form-group col-md-8 pl-0">
                                <label>Coachees</label>
                                @if(!empty($coachees))
                                    <select name="coachee" id="coachee" class="selectpicker show-tick form-control" data-count-selected-text="{0} Coachees Selected" data-selected-text-format="count > 1" data-live-search="true" title="Select Coachee" data-size="10" required onchange="usersPageFunctions.checkWayforwards('coachee',this.value);">
                                        @foreach($coachees as $key => $value)
                                    <option value="{{ $value->user_role_id }}" data-open-wayforwards="{{$value->pending_wayforwards}}" data-user-id="{{ $value->user_id }}">{{ $value->user->full_name }}</option>
                                        @endforeach
                                    </select>
                                @else
                                    <select name="coachee" id="coachee" class="selectpicker show-tick form-control" disabled data-live-search="true" title="No Coachees Available" data-size="10" required></select>
                                @endif
                            </div>
                        </div>

                        {{-- Effectivity Date --}}
                        <div class="col-md-3 pl-0">
                            <div class="form-group col-md-8 pl-0">
                                <label>Effectivity Date</label>
                                <input type="text" class="form-control datepicker" name="effectivity_date" id="effectivity_date" placeholder="Pick Date" data-date-format="YYYY-MM-DD" required>
                            </div>
                        </div>

                        {{-- Tag Request Reason --}}
                        <div class="col-md-3 pl-0">
                            <div class="form-group col-md-8 pl-0">
                                <label>Reason</label>
                                <select name="tag_reason" id="tag_reason" class="selectpicker show-tick form-control" title="Select Reason" required>
                                    <option value="NEW HIRE">New Hire</option>
                                    <option value="TRANSFERRED">Transferred</option>
                                    <option value="RESIGNED">Resigned</option>
                                    <option value="LONG TERM LEAVE">Long Term Leave</option>
                                    <option value="MATERNITY LEAVE">Maternity Leave</option>
                                    <option value="SUSPENSION">Suspension</option>
                                </select>
                            </div>
                        </div>

                        <form action="{{ url('create-tagging-effectivity') }}" method="POST">
                            @csrf
                            <input type="hidden" name="admin_id" value="{{ $user['admin_id'] }}">
                            <input type="hidden" name="admin_name" value="{{ $user['name'] }}">
                            <input type="hidden" name="coach_name" value="{{ $coach_details->user->full_name }}">
                            <input type="hidden" name="coach_id" value="{{ $coach_details->user_role_id }}">

                            <input type="hidden" id="counter" name="counter" value="0">
                            <div id="temp-form"></div>

                            {{-- <div class="custom-control custom-checkbox mb-3">
                                <input type="checkbox" class="custom-control-input" id="effective_immediately" name="effective_immediately">
                                <label class="custom-control-label text-danger" for="effective_immediately">Check this checkbox for tagging to be effective immediately</label>
                            </div> --}}

                            <div class="col-md-4 pl-0">
                                <button type="button" id="add-coachee" class="btn btn-sm btn-success" onclick="usersPageFunctions.checkIfRequirementsAreDone('coachee','effectivity_date','effective_immediately','tag_reason');"><i class="fas fa-user-plus"></i> ADD</button>
                            </div>

                            {{-- Coachees List --}}
                            <div class="col-md-10 pl-0 mt-5">

                                <div id="alert-container-current-coachees"></div>

                                <table class="table table-bordered" width="100%" data-paging="false" data-info="false" id="coachee-list">
                                    <thead>
                                        <th hidden>Date Created</th>
                                        <th>ID</th>
                                        <th>Coachee Name</th>
                                        <th class="text-center">Status</th>
                                        <th class="text-center">Created</th>
                                        <th class="text-center" width="25%">Action</th>
                                    </thead>
                                    @if(!empty($coach_details->coachees))
                                        <tbody>
                                            @foreach($coach_details->coachees as $key => $value)
                                                <tr id="{{ $key }}">
                                                    <td hidden>{{ date('Y-m-d', strtotime($value->created_at)) }}</td>
                                                    <td>{{ $value->user_id }}</td>
                                                    <td>{{ $value->user->full_name }}</td>
                                                    <td class="text-center">{{ $value->status }}</td>
                                                    <td class="text-center">{{ date('F d, Y', strtotime($value->created_at)) }}</td>
                                                    <td class="text-center d-flex vertical-align">
                                                        <div class="col-m-6 text-center">
                                                            <select name="untag_reason_{{ $key }}" id="untag_reason_{{ $key }}" class="selectpicker show-tick form-control" onchange="usersPageFunctions.enableUntagButton('untag_btn_{{ $key }}', this.value);">
                                                                <option value="">Select Reason</option>
                                                                <option value="NEW HIRE" data-user-id="{{ $value->user_id }}">New Hire</option>
                                                                <option value="TRANSFERRED" data-user-id="{{ $value->user_id }}">Transferred</option>
                                                                <option value="RESIGNED" data-user-id="{{ $value->user_id }}">Resigned</option>
                                                                <option value="LONG TERM LEAVE" data-user-id="{{ $value->user_id }}">Long Term Leave</option>
                                                                <option value="MATERNITY LEAVE" data-user-id="{{ $value->user_id }}">Maternity Leave</option>
                                                                <option value="SUSPENSION" data-user-id="{{ $value->user_id }}">Suspension</option>
                                                            </select>
                                                        </div>
                                                        <div class="col-md-6 text-center">
                                                        <button type="button" class="btn btn-sm btn-danger" id="untag_btn_{{ $key }}" disabled onclick="usersPageFunctions.untagCoachee('{{ $user["name"] }}','{{ $coach_details->user->full_name }}','{{ $value->user->full_name }}',{{ $value->user_role_id }},{{ $value->pending_wayforwards }},{{ $key }});"><i class="fas fa-user-minus"></i> Untag</button>
                                                        </div>
                                                    </td>
                                                </tr>
                                            @endforeach
                                        </tbody>
                                    @else
                                        <tbody></tbody>
                                    @endif
                                </table>
                            </div>

                            {{-- Division --}}
                            <div class="col-md-4 pl-0 mt-4">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Division</label>
                                    <p>{{ $coach_details->user->division->division_name }}</p>
                                </div>
                            </div>

                            {{-- Slug --}}
                            <div class="col-md-4 pl-0">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Slug</label>
                                    <p>{{ $coach_details->user->user_slug }}</p>
                                </div>
                            </div>

                            {{-- Email --}}
                            <div class="col-md-4 pl-0">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Email</label>
                                    <p>{{ $coach_details->user->email_address }}</p>
                                </div>
                            </div>

                            {{-- Contact --}}
                            <div class="col-md-4 pl-0">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Contact</label>
                                    <p>{{ $coach_details->user->contact }}</p>
                                </div>
                            </div>

                            {{-- Gender --}}
                            <div class="col-md-4 pl-0">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Gender</label>
                                    <p>{{ ($coach_details->user->gender == 'M') ? 'MALE' : 'FEMALE' }}</p>
                                </div>
                            </div>

                            {{-- Created --}}
                            <div class="col-md-4 pl-0">
                                <div class="form-group col-md-6 pl-0">
                                    <label>Created</label>
                                    <p>{{ date('F d, Y', strtotime($coach_details->created_at)) }}</p>
                                </div>
                            </div>

                            {{-- Logs --}}
                            <div class="col-md-12 pl-0">
                                <div class="form-group col-md-8 pl-0">
                                    <label>Logs</label>
                                    <p>Most Recent</p>
                                    <table class="table table-hover table-striped table-bordered" width="100%" data-paging="false" data-info="false" id="tag-logs">
                                        <thead>
                                            <th class="hidetd">Date Created</th>
                                            <th>Details</th>
                                            <th class="text-center">Action</th>
                                            <th class="text-center">Reason</th>
                                            <th class="text-center">Created</th>
                                        </thead>
                                        @if($tag_logs->responseCode == 800)
                                            @if(!empty($tag_logs->data))
                                                <tbody>
                                                    @foreach($tag_logs->data as $key => $value)
                                                        <tr class="{{ ($value->action == 'TAG' ? 'text-success' : 'text-danger') }}">
                                                            <td class="hidetd">{{ date('Y-m-d', strtotime($value->created_at)) }}</td>
                                                            <td><b>{{ $value->admin_name }}</b> {{ ($value->action == 'TAG' ? 'tagged' : 'untagged') }} <b>{{ $value->coachee_name }}</b> with <b>{{ $value->coach_name }}</b></td>
                                                            <td class="text-center">{{ $value->action }}</td>
                                                            <td class="text-center">{{ strtoupper($value->request_reason) }}</td>
                                                            <td class="text-center">{{ date('F d, Y', strtotime($value->created_at)) }}</td>
                                                        </tr>
                                                    @endforeach
                                                </tbody>
                                            @else
                                                <tbody></tbody>
                                            @endif
                                        @else
                                            <tbody></tbody>
                                        @endif
                                    </table>
                                </div>
                            </div>

                            {{-- Comment --}}
                            <div class="col-md-5 pl-0 pr-0 mb-3">
                                <div class="form-group">
                                    <label>Comment</label>
                                    <textarea class="form-control" rows="5" id="comment" name="comment" maxlength="500" required></textarea>
                                </div>
                            </div>

                            <div class="form-group">
                                <button type="submit" class="btn btn-sm btn-primary">Save Changes</button>
                                <a type="button" class="btn btn-sm btn-warning" href="{{ url('all-coachees') }}">Cancel</a>
                            </div>
                        </form>
                    </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') }}";

        $('#users-link').trigger('click');
        $('#all-coaches-link').addClass('active');

        usersPageFunctions.initializeDatePicker();
        generalUseFunctions.initializeDataTable('coachee-list',false,false,0);
        generalUseFunctions.initializeDataTable('tag-logs',false,false,0);
    </script>
@endsection