@php($title='تعديل الرحلة')
@extends('adminLayouts.app')
@section('title')
    {{$title}}
@endsection
@section('header')
    <!--begin::Page Custom Styles(used by this page)-->
    <link href="{{url('/')}}/assets/css/pages/wizard/wizard-4.css" rel="stylesheet" type="text/css"/>
    <!--end::Page Custom Styles-->
@endsection
@section('breadcrumb')
    <div class="d-flex align-items-baseline flex-wrap mr-5">
        <!--begin::Breadcrumb-->
        <h5 class="text-warning font-weight-bold my-1 mr-5">تعديل</h5>
        <div class="subheader-separator subheader-separator-ver mt-2 mb-2 mr-4 bg-gray-200"></div>
        <ul class="breadcrumb breadcrumb-transparent breadcrumb-dot font-weight-bold p-0 my-2 font-size-sm">
            <li class="breadcrumb-item">
                <a href="{{route('trips')}}"
                   class="text-muted">الرحلات</a>
            </li>
            <li class="breadcrumb-item">
                <a href="{{route('admin')}}"
                   class="text-muted">الصفحة الرئيسية</a>
            </li>
        </ul>
        <!--end::Breadcrumb-->
    </div>
@endsection
@section('content')@section('content')
    <!--begin: Wizard Form-->
    <form method="post" action="{{route('trips.update',$data->id)}}" enctype="multipart/form-data" class="form mt-0 mt-lg-10"
          id="trip">
        @csrf
        @include('dashboard.trip.form')
    </form>
    <!--end::Wizard Form -->
@endsection
@section('script')
    <script src="{{url('/')}}/assets/js/pages/crud/forms/widgets/select2.js"></script>
    <script>
        // tagging support
        $('#kt_select2_1_modal').select2({
            placeholder: "اختر المدينة",
            tags: true
        });
    </script>
    <!--begin::Page Vendors(used by this page)-->
    <script src="assets/plugins/custom/ckeditor/ckeditor-classic.bundle.js"></script>
    <!--end::Page Vendors-->
    <!--begin::Page Scripts(used by this page)-->
    <script src="assets/js/pages/crud/forms/editors/ckeditor-classic.js"></script>
    <!--end::Page Scripts-->
    <!--end::Page Scripts-->
    <script !src="">
        var avatar1 = new KTImageInput('kt_image_1');
    </script>

    <script src="assets/js/pages/crud/file-upload/dropzonejs.js"></script>
    <script type="text/javascript">
        $('#kt_dropzone_car').dropzone({
            paramName: "dzfile", // The name that will be used to transfer the file
            // autoProcessQueue: false,
            maxFilesize: 10, // MB
            clickable: true,
            addRemoveLinks: true,
            acceptedFiles: 'image/*',
            dictFallbackMessage: " المتصفح الخاص بكم لا يدعم خاصيه تعدد الصوره والسحب والافلات ",
            dictInvalidFileType: "لايمكنك رفع هذا النوع من الملفات ",
            dictCancelUpload: "الغاء الرفع ",
            dictCancelUploadConfirmation: " هل انت متاكد من الغاء رفع الملفات ؟ ",
            dictRemoveFile: "حذف الصوره",
            dictMaxFilesExceeded: "لايمكنك رفع عدد اكثر من هضا ",
            headers: {
                'X-CSRF-TOKEN':
                    "{{ csrf_token() }}"
            }
            ,
            url: "{{ route('trips.upload_images') }}", // Set the url
            success:
                function (file, response) {
                    $('form').append('<input type="hidden" name="images[]" value="' + response.name + '">')
                },

        });
    </script>
    <script>
        $(document).ready(function () {
            $(document).on('submit', 'form', function () {
                $('button').attr('disabled', 'disabled');
            });
        });

        function generate_days(el,trip_id) {
            var value = el.value;
            if (value == '') {
                value = 0;
            }
            $.ajax({
                url: "/trips/generate_days/" + value + "/" + trip_id ,
                dataType: 'html',
                type: 'get',
                success: function (data) {
                    $('#accordionExample1').html(data);
                }
            });
        }
    </script>
    <script>
        "use strict";

        // Class definition
        var KTWizard4 = function () {
            // Base elements
            var _wizardEl;
            var _formEl;
            var _wizardObj;
            var _validations = [];

            // Private functions
            var _initWizard = function () {
                // Initialize form wizard
                _wizardObj = new KTWizard(_wizardEl, {
                    startStep: 1, // initial active step number
                    clickableSteps: true  // allow step clicking
                });

                // Validation before going to next page
                _wizardObj.on('change', function (wizard) {
                    if (wizard.getStep() > wizard.getNewStep()) {
                        return; // Skip if stepped back
                    }

                    // Validate form before change wizard step
                    var validator = _validations[wizard.getStep() - 1]; // get validator for currnt step

                    if (validator) {
                        validator.validate().then(function (status) {
                            if (status == 'Valid') {
                                wizard.goTo(wizard.getNewStep());

                                KTUtil.scrollTop();
                            } else {
                                Swal.fire({
                                    text: "للاسف هناك حقول فارغه يجب ملئها",
                                    icon: "error",
                                    buttonsStyling: false,
                                    confirmButtonText: "Ok, got it!",
                                    customClass: {
                                        confirmButton: "btn font-weight-bold btn-light"
                                    }
                                }).then(function () {
                                    KTUtil.scrollTop();
                                });
                            }
                        });
                    }

                    return false;  // Do not change wizard step, further action will be handled by he validator
                });

                // Change event
                _wizardObj.on('changed', function (wizard) {
                    KTUtil.scrollTop();
                });

                // Submit event
                _wizardObj.on('submit', function (wizard) {
                    Swal.fire({
                        text: "كل شيئ بخير! يرجى التأكيد لتنفيذ الامر.",
                        icon: "success",
                        showCancelButton: true,
                        buttonsStyling: false,
                        confirmButtonText: "تأكيد!",
                        cancelButtonText: "الغاء",
                        customClass: {
                            confirmButton: "btn font-weight-bold btn-warning",
                            cancelButton: "btn font-weight-bold btn-default"
                        }
                    }).then(function (result) {
                        if (result.value) {
                            _formEl.submit(); // Submit form
                        } else if (result.dismiss === 'cancel') {
                            Swal.fire({
                                text: "تم الغاء اضافه رحله!.",
                                icon: "error",
                                buttonsStyling: false,
                                confirmButtonText: "تم !",
                                customClass: {
                                    confirmButton: "btn font-weight-bold btn-warning",
                                }
                            });
                        }
                    });
                });
            }

            var _initValidation = function () {
                // Init form validation rules. For more info check the FormValidation plugin's official documentation:https://formvalidation.io/
                // Step 1
                _validations.push(FormValidation.formValidation(
                    _formEl,
                    {
                        fields: {

                            name_ar: {
                                validators: {
                                    notEmpty: {
                                        message: 'اسم الرحلة بالعربية مطلوب'
                                    }
                                }
                            },
                            name_en: {
                                validators: {
                                    notEmpty: {
                                        message: 'اسم الرحلة بالانجليزية مطلوب'
                                    }
                                }
                            },
                            city_id: {
                                validators: {
                                    notEmpty: {
                                        message: 'المدينه مطلوبه'
                                    }
                                }
                            },


                        },
                        plugins: {
                            trigger: new FormValidation.plugins.Trigger(),
                            // Bootstrap Framework Integration
                            bootstrap: new FormValidation.plugins.Bootstrap({
                                //eleInvalidClass: '',
                                eleValidClass: '',
                            })
                        }
                    }
                ));

                // Step 2
                _validations.push(FormValidation.formValidation(
                    _formEl,
                    {
                        fields: {
                            business_price: {
                                validators: {
                                    notEmpty: {
                                        message: 'سعر باقه رجال الاعمال مطلوب'
                                    }
                                }
                            },
                            economical_price: {
                                validators: {
                                    notEmpty: {
                                        message: 'سعر الباقه الاقتصاديه مطلوبه'
                                    }
                                }
                            },
                        },
                        plugins: {
                            trigger: new FormValidation.plugins.Trigger(),
                            // Bootstrap Framework Integration
                            bootstrap: new FormValidation.plugins.Bootstrap({
                                //eleInvalidClass: '',
                                eleValidClass: '',
                            })
                        }
                    }
                ));

                // Step 3
                _validations.push(FormValidation.formValidation(
                    _formEl,
                    {
                        fields: {
                            days_count: {
                                validators: {
                                    notEmpty: {
                                        message: 'عدد ايام الرحله مطلوب'
                                    }
                                }
                            },

                        },
                        plugins: {
                            trigger: new FormValidation.plugins.Trigger(),
                            // Bootstrap Framework Integration
                            bootstrap: new FormValidation.plugins.Bootstrap({
                                //eleInvalidClass: '',
                                eleValidClass: '',
                            })
                        }
                    }
                ));
                // Step 4
                _validations.push(FormValidation.formValidation(
                    _formEl,
                    {
                        fields: {
                            notes: {
                                validators: {
                                    notEmpty: {
                                        message: ''
                                    }
                                }
                            },
                            images: {
                                validators: {
                                    notEmpty: {
                                        message: ''
                                    }
                                }
                            },
                        },
                        plugins: {
                            trigger: new FormValidation.plugins.Trigger(),
                            // Bootstrap Framework Integration
                            bootstrap: new FormValidation.plugins.Bootstrap({
                                //eleInvalidClass: '',
                                eleValidClass: '',
                            })
                        }
                    }
                ));
            }

            return {
                // public functions
                init: function () {
                    _wizardEl = KTUtil.getById('kt_wizard');
                    _formEl = KTUtil.getById('trip');

                    _initWizard();
                    _initValidation();
                }
            };
        }();

        jQuery(document).ready(function () {
            KTWizard4.init();
        });

    </script>
@endsection