@extends('backend.layouts.app')
@section('content')
<div class="container-fluid">

    <div class="row">
        <div class="col-xl-12">
            <div class="breadcrumb-holder">
                <h1 class="main-title float-left">
                	Create Flight Schedule
            	</h1>
                <ol class="breadcrumb float-right">
                    <li class="breadcrumb-item"><a href="{{ route('dashboard') }}">Dashboard</a> </li>
                    <li class="breadcrumb-item"><a href="{{ route('tournaments') }}">Tournament</a> </li>
                    <li class="breadcrumb-item active">
                    	Create Flight Schedule
                    </li>
                </ol>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
    @php
        
        if(isset($tournaments) && $tournaments->count() > 0){
            $selected_tour = request()->tour?request()->tour:$tournaments->last()->id;
        }else{
            $selected_tour = null;
        }

        if(count($slot_dates) > 0){
            $selected_date = request()->date?request()->date:$slot_dates[0];
        }else{
            $selected_date = null;
        }
    @endphp
    <div class="row">
    	<div class="col-sm-12">
    		<div class="card">                
                <div class="card-body" style="padding: 0px;">
                    <form method="get" action="{{route('tournaments.flight-schedule.index')}}">
                        <div class="row justify-content-center">                                                        
                            <div class="col-sm-4">
                                <div class="form-group">
                                    <label>Tournament</label>
                                    <select class="form-control select2 tournament-select" name="tour">
                                        <option value="">Select Tournament</option>
                                        @foreach($tournaments as $tournament)
                                        <option value="{{$tournament->id}}" @if($tournament->id == $selected_tour) selected @endif>{{$tournament->tour_name}}</option>
                                        @endforeach
                                    </select>
                                </div>
                            </div>
                            <div class="col-sm-2">
                                <label>Slot Date</label>
                                <select class="form-control select2 date-select" name="date">
                                    <option value="">Select Date</option>
                                    @foreach($slot_dates as $slot_date)
                                    <option value="{{$slot_date}}" @if($slot_date == $selected_date) selected @endif>{{$slot_date}}</option>
                                    @endforeach
                                </select>
                            </div>                            
                        </div>
                    </form>
                </div>
            </div>
            
            @if($selected_tour && $selected_date)
            <div class="card">
                <form method="post" action="{{ route('tournaments.flight-schedule.store') }}">
                    @csrf
                    <input type="hidden" name="tournament_id" value="{{ $selected_tour }}">
                    <input type="hidden" name="flight_date" value="{{ $selected_date }}">

                    @if($editData)
                        <input type="hidden" name="schedule_id" value="{{ $editData->id }}">
                        @php
                            $schedule_id = $editData->id;
                            
                            $start_tee = $editData->start_tee;
                            $start_time = $editData->start_time;
                            $end_time = $editData->end_time;
                        @endphp
                    @else
                        @php
                            $schedule_id = null;
                           
                            $start_tee = null;
                            $start_time = null;
                            $end_time = null;
                        @endphp
                    @endif
                    
                    <div class="card-body">
                        <div class="form-group">
                            <select class="search-multiselect" multiple="multiple" name="flight_member[]" required="">
                                {!! tour_player_dropdown_options($selected_tour, $selected_date, $schedule_id) !!}
                            </select>                            
                        </div>
                         <div class="row">                                                                
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <label>Start Time</label>
                                        <input type="text" name="slot_start" value="{{ $start_time }}" class="form-control timepicker" required="" />
                                    </div>
                                </div>
                                                                
                            </div>
                    </div>
                    <div class="card-footer text-right">
                        <button class="btn btn-info" type="submit">Submit</button>
                    </div>
                </form>
            </div>

            <div class="card mt-2">
                <div class="card-header">
                    <h3 class="card-title float-left">Schedule</h3>                    
                    <div class="float-right">
                        <form method="post" action="{{ route('tournaments.flight-schedule.change-status') }}">
                            @csrf
                            <input type="hidden" name="status_tour_id" value="{{ $selected_tour }}">
                            <input type="hidden" name="status_date" value="{{ $selected_date }}">
                            <select class="form-control" name="show_status">
                                <option value="0" @if(flight_schedule_show_status($selected_tour, $selected_date) == false) selected @endif>Off</option>
                                <option value="1" @if(flight_schedule_show_status($selected_tour, $selected_date) == true) selected @endif>On</option>
                            </select>
                        </form>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="card-body">
                    @if(count($flight_schedules) > 0)
                    <table class="table table-bordered table-sm">
                        <thead>
                            <tr>
                                <td rowspan="2" class="text-center">Flight No</td>
                                <td rowspan="2" class="text-center">Start Time</td>
                                <td colspan="3" class="text-center">Players</td>
                                <td rowspan="2" class="text-center">Action</td>
                            </tr>
                            <tr>
                                <td class="text-center">Membership No</td>
                                <td class="text-center">Tee Category</td>
                                <td class="text-center">Name</td>                                
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($flight_schedules as $schedule)
                            <tr>
                                <td class="text-center" rowspan="{{ $schedule->members->count() }}">{{ $loop->iteration }}</td>                                                                
                                <td class="text-center" rowspan="{{ $schedule->members->count() }}">{{ $schedule->start_time }}</td>
                                @if($schedule->members && $schedule->members->count() > 0)
                                    <td class="text-center">{{ $schedule->members->first()->tour_registration?$schedule->members->first()->tour_registration->membership_no:'' }}</td>
                                    <td class="text-center">{{ $schedule->members->first()->tour_registration?($schedule->members->first()->tour_registration->tee_category?$schedule->members->first()->tour_registration->tee_category->name:''):'' }}</td>
                                    <td class="text-center">{{ $schedule->members->first()->tour_registration?$schedule->members->first()->tour_registration->golfer_name:'' }}</td>                                            
                                @else
                                    <td></td>
                                    <td></td>
                                    <td></td>
                                @endif
                                <td class="text-center" rowspan="{{ $schedule->members->count() }}">
                                    <a href="{{ route('tournaments.flight-schedule.index', $schedule->id) }}" class="btn btn-sm btn-info"><i class="fa fa-edit"></i></a>
                                    <a href="{{ route('tournaments.flight-schedule.delete', $schedule->id) }}" class="btn btn-sm btn-danger item-delete-btn" data-reload="true"><i class="fa fa-times"></i></a>
                                </td>
                            </tr>
                                @if($schedule->members)
                                    @foreach($schedule->members as $registration)
                                        @if(!$loop->first)
                                        <tr>
                                            <td class="text-center">{{ $registration->tour_registration?$registration->tour_registration->membership_no:'' }}</td>
                                            <td class="text-center">{{ $registration->tour_registration?($registration->tour_registration->tee_category?$registration->tour_registration->tee_category->name:''):'' }}</td>
                                            <td class="text-center">{{ $registration->tour_registration?$registration->tour_registration->golfer_name:'' }}</td>                                            
                                        </tr>
                                        @endif
                                    @endforeach
                                @endif
                            @endforeach
                        </tbody>
                    </table>
                    @else
                    <p class="text-danger">No Schedule has been found!</p>
                    @endif
                </div>
            </div>
            @endif            
    	</div>
    </div>   
    
</div>
@endsection
@section('page_script')
<script type="text/javascript">
	$(function(){								
	   $('.year-select').on('change', function(){
            $('.tournament-select').val('');
            $('.date-select').val('');
            $(this).closest('form').submit();
       });

       $('.tournament-select').on('change', function(){
            $('.date-select').val('');
            $(this).closest('form').submit();
       });

       $('.date-select').on('change', function(){
            $(this).closest('form').submit();
       });

        $('.tee-category-select').on('change', function(){
            $(this).closest('form').submit();
        });
       $('.search-multiselect').multiSelect({
            keepOrder: true,
            selectableHeader: "<input type='text' class='search-input form-control' autocomplete='off' placeholder='Search by Membership No or Name'>",
            selectionHeader: "<input type='text' class='search-input form-control' autocomplete='off' placeholder='Search by Membership No or Name'>",
            afterInit: function(ms){
            var that = this,
                $selectableSearch = that.$selectableUl.prev(),
                $selectionSearch = that.$selectionUl.prev(),
                selectableSearchString = '#'+that.$container.attr('id')+' .ms-elem-selectable:not(.ms-selected)',
                selectionSearchString = '#'+that.$container.attr('id')+' .ms-elem-selection.ms-selected';

            that.qs1 = $selectableSearch.quicksearch(selectableSearchString)
            .on('keydown', function(e){
              if (e.which === 40){
                that.$selectableUl.focus();
                return false;
              }
            });

            that.qs2 = $selectionSearch.quicksearch(selectionSearchString)
            .on('keydown', function(e){
              if (e.which == 40){
                that.$selectionUl.focus();
                return false;
              }
            });
          },
          afterSelect: function(value, text){
            var get_val = $("#multiple_value").val();
            var hidden_val = (get_val != "") ? get_val+"," : get_val;
            $("#multiple_value").val(hidden_val+""+value);
          },
          afterDeselect: function(value, text){
            var get_val = $("#multiple_value").val();
            var new_val = get_val.replace(value, "");
            $("#multiple_value").val(new_val);
          }
       });

       $(document).on('change', 'select[name="show_status"]', function(){
        $.ajax({
            url: $(this).closest('form').attr('action'),
            method: 'POST',
            datType: 'json',
            data: $(this).closest('form').serialize(),
            success: function(result){

            }
        });
       });
        
	});

    $(function() {
        $('.timepicker').daterangepicker({
            singleDatePicker: true,
            showDropdowns: true,
            autoUpdateInput: true,
            timePicker: true,
            // drops: "up",
            autoApply:true,
            locale: {
                format: 'hh:mm A',
                daysOfWeek: ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr','Sa'],
                firstDay: 0
            }
        }).on('show.daterangepicker', function(ev, picker) {
             picker.container.find(".calendar-table").hide();
        });
    });
</script>
<style type="text/css">
    .ms-container {
        width: 100%!important;
    }
</style>
@endsection