@extends("layouts.admin.app")
@section("page-title")
    {{__("Dashboard")}}
@endSection
@section("page-nav-title")
    <div class="app-title">
        <div>
            <h1><i class="fa fa-dashboard"></i> {{__("Services")}}</h1>
            <p>{{__("All Services")}}</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.main_category.index")}}">{{__("Main Categories")}}</a></li>--}}
{{--            <li class="breadcrumb-item"><a href="#">{{$property->service->subCategory->mainCategory->name}}</a></li>--}}
{{--            <li class="breadcrumb-item"><a href="{{route("admin.sub_category.index", ["main_id" => $property->service->subCategory->mainCategory->id])}}">{{__("Sub Categories")}}</a></li>--}}
{{--            <li class="breadcrumb-item"><a href="#">{{$property->service->subCategory->name}}</a></li>--}}
            <li class="breadcrumb-item"><a href="{{route("admin.service.index", ["main_id" => $property->service->subCategory->mainCategory->id, "sub_id" => $property->service->subCategory->id])}}">{{__("Services")}}</a></li>
            <li class="breadcrumb-item"><a href="#">{{$property->service->name}}</a></li>

        </ul>
    </div>
@endsection

@section("content")

    <div class="mb-4">
        <div class="row">
            <div class="col-lg-12">
                <div class="card card-primary" style="margin-bottom: 0">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-lg-12">
                                <h4>{{$property->service->name_en}} </h4>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row">
        <div class="col-lg-10 m-auto">
            <div class="tile">
                <h3 class="tile-title">{{__("Edit Property")}}</h3>
                <div class="tile-body">
                    <form method="post" action="{{route("admin.service_property.update",  ["main_id" => $property->service->subCategory->mainCategory->id, "sub_id" => $property->service->subCategory->id, "service_id" => $property->service->id, "id" => $property->id])}}" enctype="multipart/form-data">
                        @csrf
                        @method("put")
                        <div class="row">
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("English Property Name")}}</label>
                                    <input class="form-control @if($errors->has('property_en_title')) is-invalid @endif" type="text" name="property_en_title" placeholder="" value="{{inputValue("property_en_title", $property, "name_en")}}">
                                </div>
                                @error("property_en_title")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Arabic Property Name")}}</label>
                                    <input class="form-control @if($errors->has('property_ar_title')) is-invalid @endif" type="text" name="property_ar_title" placeholder="" value="{{inputValue("property_ar_title", $property, "name_ar")}}">
                                </div>
                                @error("property_ar_title")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>

                            <div class="col-lg-6">
                                <div class="form-group">
                                    <label class="control-label">{{__("Urdu Property Name")}}</label>
                                    <input class="form-control @if($errors->has('property_ur_title')) is-invalid @endif" type="text" name="property_ur_title" placeholder="" value="{{inputValue("property_ur_title", $property, "name_ur")}}">
                                </div>
                                @error("property_ur_title")
                                <div class="input-error">{{$message}}</div>
                                @enderror
                            </div>
                        </div>

                        <hr>

                        @if($property->type == "DP" || $property->type == "SL" || $property->type == "QS")
                            <h3>Options</h3>
                            <hr>
                            @php $counter = 0; @endphp
                            @foreach($property->options as $option)
                                <div class="row option">
                                    <div class="col-lg-12 text-right">
                                        <span class="btn btn-danger remove-server"
                                              data-swal-title="{{__("Delete Option")}}"
                                              data-swal-text="{{__("Are Your Sure To Delete This Option ?")}}"
                                              data-swal-no="{{__("no")}}" data-swal-yes="{{__("yes")}}" data-swal-success-msg="option has been deleted successfully"
                                              data-swal-cant-delete-msg="{{('You Can\'t Delete This Option')}}"
                                              data-option-id="{{$option->id}}" data-property-id="{{$property->id}}">
                                            <i class="fas fa-times"></i></span>
                                    </div>
                                    <div class="col-lg-4 col-md-8">
                                        <div class="form-group">
                                            <label>{{__('Option English Title')}}</label>
                                            <input type="text" name="option_en_title[]"
                                                   class="form-control @if($errors->has("option_en_title." . $counter))is-invalid @endif"
                                                   value="{{inputValue("option_en_title." . $counter, $option, "name_en")}}">
                                            @error("option_en_title." . $counter)
                                            <div class="invalid-feedback">
                                                {{$message}}
                                            </div>
                                            @enderror

                                        </div>
                                    </div>
                                    <div class="col-lg-4 col-md-8">
                                        <div class="form-group">
                                            <label>{{__("Option Arabic Title")}}</label>
                                            <input type="text" name="option_ar_title[]"
                                                   class="form-control @if($errors->has("option_ar_title." . $counter))is-invalid @endif"
                                                   value="{{inputValue("option_ar_title." . $counter, $option, "name_ar")}}">
                                            @error("option_ar_title." . $counter)
                                            <div class="invalid-feedback">
                                                {{$message}}
                                            </div>
                                            @enderror

                                        </div>
                                    </div>
                                    <div class="col-lg-4 col-md-8">
                                        <div class="form-group">
                                            <label>{{__("Option Urdu Title")}}</label>
                                            <input type="text" name="option_ur_title[]"
                                                   class="form-control @if($errors->has("option_ur_title." . $counter))is-invalid @endif"
                                                   value="{{inputValue("option_ur_title." . $counter, $option, "name_ur")}}">
                                            @error("option_ur_title." . $counter)
                                            <div class="invalid-feedback">
                                                {{$message}}
                                            </div>
                                            @enderror

                                        </div>
                                    </div>
                                    <div class="col-lg-4 col-md-8">
                                        <div class="form-group">
                                            <label>Price</label>
                                            <input type="text" name="price[]"
                                                   class="form-control @if($errors->has("price." . $counter))is-invalid @endif"
                                                   value="{{inputValue("price." . $counter, $option, "price")}}">
                                            @error("price." . $counter)
                                            <div class="invalid-feedback">
                                                {{$message}}
                                            </div>
                                            @enderror
                                        </div>
                                    </div>
                                </div>
                                @php $counter++; @endphp
                            @endforeach
                            @if(isset($options_count))
                                @for($i = $counter; $i < $options_count; $i++)
                                    <div class="row option">
                                        <div class="col-lg-12 text-right">
                                            <span class="btn btn-danger remove"><i class="fas fa-times"></i></span>
                                        </div>
                                        <div class="col-lg-4 col-md-8">
                                            <div class="form-group">
                                                <label>{{__("Option Engligh Title")}}</label>
                                                <input type="text" name="option_en_title[]"
                                                       class="form-control @if($errors->has("option_en_title." . $i))is-invalid @endif"
                                                       value="{{inputValue("option_en_title." . $i)}}">
                                                @error("option_en_title." . $i)
                                                <div class="invalid-feedback">
                                                    {{$message}}
                                                </div>
                                                @enderror

                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-md-8">
                                            <div class="form-group">
                                                <label>Option Arabic Title</label>
                                                <input type="text" name="option_ar_title[]"
                                                       class="form-control @if($errors->has("option_ar_title." . $i))is-invalid @endif"
                                                       value="{{inputValue("option_ar_title." . $i, $option)}}">
                                                @error("option_ar_title." . $i)
                                                <div class="invalid-feedback">
                                                    {{$message}}
                                                </div>
                                                @enderror

                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-md-8">
                                            <div class="form-group">
                                                <label>Option Urdu Title</label>
                                                <input type="text" name="option_ur_title[]"
                                                       class="form-control @if($errors->has("option_ur_title." . $i))is-invalid @endif"
                                                       value="{{inputValue("option_ur_title." . $i, $option)}}">
                                                @error("option_ur_title." . $i)
                                                <div class="invalid-feedback">
                                                    {{$message}}
                                                </div>
                                                @enderror

                                            </div>
                                        </div>
                                        <div class="col-lg-4 col-md-8">
                                            <div class="form-group">
                                                <label>Price</label>
                                                <input type="text" name="price[]"
                                                       class="form-control @if($errors->has("price." . $i))is-invalid @endif"
                                                       value="{{inputValue("price." . $i, $option)}}">
                                                @error("price." . $i)
                                                <div class="invalid-feedback">
                                                    {{$message}}
                                                </div>
                                                @enderror
                                            </div>
                                        </div>
                                    </div>
                                @endfor
                            @endif
                            <div class="text-left">
                                <span class="btn btn-primary add-option">{{__('Add Option')}}</span>
                            </div>
                        @elseif($property->type == "SW")
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="form-group">
                                        <label class="control-label">{{__("Price")}}</label>
                                        <input class="form-control @if($errors->has('price')) is-invalid @endif" type="text" name="price" placeholder="" value="{{inputValue("price", $options, "price")}}">
                                    </div>
                                    @error("price")
                                    <div class="input-error">{{$message}}</div>
                                    @enderror
                                </div>
                            </div>
                        @endif


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

@endsection

@section("scripts")
    <script src="{{asset("assets/js/pages/services_properties.js")}}"></script>


    <script type="text/javascript">
        $(document).on("click",".add-option",function (){
            let fields = `
       <div class="row option">
            <div class="col-lg-12 text-right">
                <button class="btn btn-danger remove"><i class="fas fa-times"></i></button>
            </div>
            <div class="col-lg-4 col-md-8">
                <div class="form-group">
                    <label>{{__("Option Engligh Title")}}</label>
                    <input type="text" name="option_en_title[]" class="form-control form-input">
                    <div class="invalid-feedback" style="display: none"></div>
                </div>
            </div>
            <div class="col-lg-4 col-md-8">
                <div class="form-group">
                    <label>{{__('Option Arabic Title')}}</label>
                    <input type="text" name="option_ar_title[]" class="form-control form-input">
                    <div class="invalid-feedback" style="display: none"></div>
                </div>
            </div>
            <div class="col-lg-4 col-md-8">
                <div class="form-group">
                    <label>{{__('Option Urdu Title')}}</label>
                    <input type="text" name="option_ur_title[]" class="form-control form-input">
                    <div class="invalid-feedback" style="display: none"></div>
                </div>
            </div>
             <div class="col-lg-4 col-md-8">
                <div class="form-group">
                    <label>{{__('Price')}}</label>
                    <input type="text" name="price[]" class="form-control form-input">
                    <div class="invalid-feedback" style="display: none"></div>
                </div>
            </div>
        </div>`;
            $(this).parent().prev().after(fields);
        });
        $(document).on("click",".option .remove", function (){
            $(this).parents(".option").remove();
        });

        $(".remove-server").on("click",function (){
            event.preventDefault();
            let title = $(this).data("swal-title"),
                text = $(this).data("swal-text"),
                optionId = $(this).data("option-id"),
                propertyId = $(this).data("property-id"),
                button = $(this);

            swal({
                title: title,
                text: text,
                icon: "warning",
                buttons: [$(this).data("swal-no"),$(this).data("swal-yes")],
                dangerMode: true,
            }).then((willDelete) => {
                    if (willDelete) {

                        $.ajaxSetup({
                            headers: {
                                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                            }
                        });
                        $.ajax({
                            type: "POST",
                            url: "{{  route("ajax.service.property.delete_option", ["service_id" => $property->service_id, "property_id" => $property->id])}}",
                            data: {"option_id":optionId},

                            success: function( response ) {

                                if(response.status_number === 'S201'){
                                    console.log($(this).data("swal-success-msg"));
                                    swal(button.data("swal-success-msg"), {
                                        icon: "success",
                                    });
                                    button.parents(".option").remove();
                                }else if(response.status_number === 'S405'){
                                    swal(button.data("swal-cant-delete-msg"), {
                                        icon: "error",
                                    });
                                }
                            }
                        });
                    } else {

                    }
                });
        });


    </script>

@endsection