@extends("layouts.admin.app")
@section("page-title")
    {{__("Dashboard")}}
@endSection
@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1> {{__("Specialist")}}</h1>
            <p>{{__("Create Specialist")}}</p>
        </div>
        <ul class="app-breadcrumb breadcrumb">
            <li class="breadcrumb-item"><i class="fa fa-home fa-lg"></i></li>
            <li class="breadcrumb-item"><a href="#">{{__("Dashboard")}}</a></li>
            <li class="breadcrumb-item"><a href="{{route("admin.specialist.index")}}">{{__("specialist")}}</a></li>
            <li class="breadcrumb-item"><a href="#">{{__("Create")}}</a></li>
        </ul>
    </div>
@endsection

@section("content")

    <div class="row">
        <div class="col-lg-10 m-auto">
            <div class="tile">
                <h3 class="tile-title">{{__("Edit Schedule")}}</h3>

                <h4>Working Time Agenda</h4>

                        <hr style="height:2px;border-width:0;color:gray;background-color:gray">

                        <div class="container">
                            <form method="post" action="{{route("admin.specialist.admin.single.schedule.update", $schedule->id)}}" enctype="multipart/form-data">
                                @csrf
                            <div class="row">
                                <div class="col">
                                    <div name="week" class="week">
                                        <div class="row">
                                            <div class="col">
                                                <label class="control-label">{{__("Date Work From")}}</label>

                                                <input type="date" style="height: 40px"
                                                       class="form-control @if($errors->has('date_from')) is-invalid @endif"
                                                       name="date_from" value="{{$schedule->date_from}}">
                                            </div>
                                            <div class="col">
                                                <label class="control-label">{{__("Date Work To")}}</label>
                                                <input type="date" style="height: 40px"
                                                       class="form-control @if($errors->has('date_to')) is-invalid @endif"
                                                       name="date_to"value="{{$schedule->date_to}}">
                                            </div>
                                        </div>
                                        <div class="container mt-3">
                                            <div class="row">
                                                <div class="col">
                                                    <label class="control-label">{{__("slot Duration")}}</label>
                                                    <input style="height: 40px"
                                                           class="form-control @if($errors->has('slot_duration')) is-invalid @endif"
                                                           type="number"  min="1"  name="slot_duration"
                                                           placeholder="{{__("enter time in min")}}" value="{{$schedule->slot_duration}}">
                                                </div>
                                                <div class="col">
                                                    <label class="control-label">{{__("Wating Duration")}}</label>
                                                    <input style="height: 40px"
                                                           class="form-control @if($errors->has('wating_time')) is-invalid @endif"
                                                           type="number"   name="waiting_time" min="1"
                                                           placeholder="{{__("enter time in min")}}" value="{{$schedule->wating_time}}">
                                                </div>
                                            </div>
                                        </div>


                                        @foreach($schedule->object_week_days as $key=>$single_object_week)
                                        <div class="row">
                                            <input type="hidden" id="number_of_days" value="{{$count}}">
                                                <div class="col-6 mt-4">
                                                    <label class="control-label required ">{{__("Day")}}</label>


                                                    <select  class="form-control @if($errors->has('day')) is-invalid @endif dates"
                                                              id="week_day_en_name{{$key}}" name="days[]" value="week_day_en_name">
                                                        <label class="control-label required">{{__("Day")}}</label>
                                                        <option value="{{$single_object_week->week_day_en_name}}">{{$single_object_week->week_day_en_name}}</option>
                                                        <option value="sunday" name="week_day_en_name">{{"Sunday"}}</option>
                                                        <option value="monday" name="week_day_en_name">{{"Monday"}}</option>
                                                        <option value="tuesday" name="week_day_en_name">{{"Tuesday"}}</option>
                                                        <option value="wednesday" name="week_day_en_name">{{"Wednesday"}}</option>
                                                        <option value="thursday" name="week_day_en_name">{{"Thursday"}}</option>
                                                        <option value="friday" name="week_day_en_name">{{"Friday"}}</option>
                                                        <option value="saturday" name="week_day_en_name">{{"Saturday"}}</option>



                                                    </select>


                                                </div>
                                                <div class="col mt-4">
                                                    <label class="control-label">{{__("Time From")}}</label>
                                                    <input
                                                            class="form-control @if($errors->has('time_from')) is-invalid @endif "
                                                            type="time" name="period[]" value="{{$single_object_week->time_from}}" required>
                                                </div>
                                                <div class="col mt-4">
                                                    <label class="control-label">{{__("Time To")}}</label>
                                                    <input style="height: 40px"
                                                           class="form-control @if($errors->has('time_to')) is-invalid @endif "
                                                           type="time" name="period[]" value="{{$single_object_week->time_to}}">


                                                </div>
                                                <a style="margin-bottom: auto; margin-top: 2rem" class="removeRow" >
                                                    <i class="fa fa-fw fa-lg fa-minus-circle" style="font-size: 18px; color: red; cursor: pointer"></i>
                                                </a>
                                        </div>
                                        @endforeach
                                        </div>
                                        <div id="text"></div>



                                </div>
                            </div>



                            <a class="add"><i class="fa fa-fw fa-lg fa-plus-circle mt-3"
                                                                               style="font-size: 18px; color: green; cursor: pointer"
                                ></i></a>
                                <div class="tile-footer">

                                </div>
                                <button  type="submit" class="btn btn-primary">
                                    <i class="fa fa-fw fa-lg fa-check-circle"></i> {{__("Edit")}}
                                </button>
                            </form>

                        </div>

                </div>


            </div>
        </div>



@endsection
@section("scripts")
    <script type="text/javascript">
        $(document).ready(function() {
            let filteredArray =[];
            let countener = $('#number_of_days').val();
            let allDays = ['sunday', 'monday', 'tuesday', 'wednesday', 'thursday', 'friday', 'saturday'];
            let availableDays = [...allDays];
            let selectedDay = [];
            $('.add').click(function() {
                countener++;
                console.log(countener)
                        if (availableDays.length === 1) {
                            alert('No more days left to select!');
                            return;
                        }
                        for(let i=0 ;i<7 ;i++){
                            selectedDay.push($(`#week_day_en_name${i}`).val());
                        }
                        filteredArray = Array.from(selectedDay).filter(item => item !== undefined);

                        availableDays = availableDays.filter(day => !selectedDay.includes(
                            day));
                        const dayOptions = availableDays.map(day => `<option value="${day}">${day}</option>`).join('');
                        const newRow = `
                    <div id="object${countener}">
                        <div class="row">
                            <div class="col-6">
                                <label class="control-label required">{{__("Day")}}</label>
                                <select class="form-control dates" id="week_day_en_name${countener}" name="days[]">
                                ${availableDays.map(day => `<option value="${day}">${day}</option>`).join('')}
                                </select>
                            </div>
                            <div class="col">
                                <label class="control-label">{{__("Time From")}}</label>
                                <input class="form-control" type="time" name="period[]" required>
                            </div>
                            <div class="col">
                                <label class="control-label">{{__("Time Into")}}</label>
                                <input style="height: 40px" class="form-control" type="time" name="period[]">
                            </div>
                            <a style="margin-bottom: auto; margin-top: 2rem" class="removeRow">
                                <i class="fa fa-fw fa-lg fa-minus-circle" style="font-size: 18px; color: red; cursor: pointer"></i>
                            </a>
                        </div>
                    </div>
                `;
                        $("#text").append(newRow);
                        selectedDay.push($(`#week_day_en_name${countener}`).val());

                        $('.removeRow').click(function() {
                            $(this).parent().parent().remove();
                        });

                $('.dates').change(function(){
                    let weekdays = [];
                    for(let i=0 ;i<7 ;i++){
                        weekdays.push($(`#week_day_en_name${i}`).val());
                    }
                    filteredArray = Array.from(weekdays).filter(item => item !== undefined);
                    checkForDuplicates(filteredArray);


                });
            });

            $('.removeRow').click(function() {
                $(this).parent().remove();
            });
            $('.dates').change(function(){
                let weekdays = [];
                for(let i=0 ;i<7 ;i++){
                    weekdays.push($(`#week_day_en_name${i}`).val());
                }
                filteredArray = Array.from(weekdays).filter(item => item !== undefined);
                checkForDuplicates(filteredArray);

            });
            function checkForDuplicates(arr) {
                const occurrences = {};
                let hasDuplicates = false;
                arr.forEach((item) => {
                    occurrences[item] = (occurrences[item] || 0) + 1;
                    if (occurrences[item] > 1) {
                        hasDuplicates = true;
                    }
                });

                if (hasDuplicates) {
                    alert('Duplicate elements found in the array!');
                }
            }
        });
    </script>


@endsection