@extends('influencer.master_layout')
@section('title')
<title>{{__('admin.Create Appointment Schedule')}}</title>
@endsection
@section('influencer-content')
<!-- Main Content -->
<div class="main-content">
    <section class="section">
      <div class="section-header">
        <h1>{{__('admin.Create Appointment Schedule')}}</h1>
      </div>

        <div class="section-body">
            <a href="{{ route('influencer.appointment-schedule.index') }}"  class="btn btn-primary"><i class="fas fa-list"></i> {{__('admin.Schedule List')}}</a>
            <div class="row mt-sm-4">
                <div class="col-12">
                    <div class="card ">
                        <div class="card-body">
                            <form action="{{ route('influencer.appointment-schedule.store') }}" method="POST" enctype="multipart/form-data">
                                @csrf
                                <div class="row">
                                    <div class="form-group col-md-12">
                                        <label for="">{{__('admin.Day')}} <span class="text-danger">*</span></label>
                                        <select name="day" id="" class="form-control">
                                            <option value="">{{__('admin.Select Day')}}</option>

                                            @foreach ($days as $day)
                                            <option {{ old('day') == $day ? 'selected' : '' }} value="{{ $day }}">{{ __('admin.' . $day) }}</option>
                                            @endforeach
                                        </select>
                                    </div>


                                    <div class="form-group col-12">
                                        <label for="start_time">{{__('admin.Start Time')}} <span class="text-danger">*</span></label>
                                        <input type="text" name="start_time" class="form-control clockpicker" data-align="top" data-autoclose="true" autocomplete="off" value="{{ old('start_time') }}">
                                    </div>

                                    <div class="form-group col-12">
                                        <label for="end_time">{{__('admin.End Time')}} <span class="text-danger">*</span></label>
                                        <input type="text" name="end_time" class="form-control clockpicker" data-align="top" data-autoclose="true" autocomplete="off" value="{{ old('end_time') }}">
                                    </div>

                                    <div class="form-group col-12">
                                        <label for="end_time">{{__('admin.Service')}} <span class="text-danger">*</span></label>
                                        <select name="service_id" id="" class="form-control">
                                            <option value="">{{ __('Select') }}</option>
                                            @foreach ($services as $service)
                                                <option {{ old('service_id') == $service->id ? 'selected' : '' }} value="{{ $service->id }}">{{ $service->title }}</option>
                                            @endforeach
                                        </select>
                                    </div>



                                    {{-- <div class="col-12" id="location_box">
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label for="">{{ __('admin.City') }}</label>
                                                    <select name="cities[]" id="" class="form-control" required>
                                                        <option value="">{{ __('admin.Select') }}</option>
                                                        @foreach ($cities as $city)
                                                            <option value="{{ $city->id }}">{{ $city->name }}</option>
                                                        @endforeach
                                                    </select>
                                                </div>
                                            </div>

                                            <div class="col-md-4">
                                                <div class="form-group">
                                                    <label for="price">{{__('admin.Price')}} <span class="text-danger">*</span></label>
                                                    <input type="text" name="prices[]" class="form-control price_input" value="{{ old('price') }}" autocomplete="off" required>
                                                </div>
                                            </div>

                                            <div class="col-md-2">
                                                <button type="button" type="button" id="addLocation" class="btn btn-success btn_mt_33"><i class="fa fa-plus" aria-hidden="true"></i> {{__('admin.Add New')}}</button>
                                            </div>


                                        </div>
                                    </div> --}}

                                    <div class="form-group col-12">
                                        <label for="price">{{__('admin.Price')}} <span class="text-danger">*</span></label>
                                        <input type="text" name="price" class="form-control" value="{{ old('price') }}" autocomplete="off">
                                    </div>

                                    <div class="form-group col-12">
                                        <label class="mt-2">
                                          <input type="checkbox" name="schedule_allows" class="custom-switch-input" {{ old('schedule_allows') ? 'checked' : '' }}>
                                          <span class="custom-switch-indicator"></span>
                                          <span class="custom-switch-description">{{__('admin.This schedule allows all days')}}</span>
                                        </label>
                                      </div>

                                    <div class="form-group col-12">
                                        <label>{{__('admin.Status')}} <span class="text-danger">*</span></label>
                                        <select name="status" id="" class="form-control">
                                            <option value="1">{{__('admin.Active')}}</option>
                                            <option value="0">{{__('admin.Inactive')}}</option>
                                        </select>
                                    </div>

                                </div>
                                <div class="row">
                                    <div class="col-12">
                                        <button class="btn btn-primary" type="submit">{{__('admin.Save')}}</button>
                                    </div>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
</div>


<div id="hidden_location_box" class="d-none">
    <div class="row location_row">
        <div class="col-md-6">
            <div class="form-group">
                <label for="">{{ __('admin.City') }}</label>
                <select name="cities[]" id="" class="form-control" required>
                    <option value="">{{ __('admin.Select') }}</option>
                    @foreach ($cities as $city)
                        <option value="{{ $city->id }}">{{ $city->name }}</option>
                    @endforeach
                </select>
            </div>
        </div>

        <div class="col-md-4">
            <div class="form-group">
                <label for="price">{{__('admin.Price')}} <span class="text-danger">*</span></label>
                <input type="text" name="prices[]" class="form-control price_input" value="" autocomplete="off" required>
            </div>
        </div>

        <div class="col-md-2">
            <button type="button" class="btn btn-danger btn_mt_33 delete_location"><i class="fa fa-trash" aria-hidden="true"></i> {{__('admin.Remove')}}</button>
        </div>


    </div>
</div>


<script>
    (function($) {
        "use strict";
        $(document).ready(function () {
            // start package feature section
            $("#addLocation").on("click", function(){
                let new_item = $("#hidden_location_box").html();
                $("#location_box").append(new_item)
            });

            $(document).on('click', '.delete_location', function () {
                $(this).closest('.location_row').remove();
            });

            // end package feature


            $(document).on('input', '.price_input', function () {
                var value = $(this).val();
                var isValidNumber = /^-?\d*\.?\d*$/.test(value);
                if (!isValidNumber) {
                    $(this).val(value.slice(0, -1));
                }

            });

        })
    })(jQuery);


</script>

@endsection