@extends('layouts.app')

@section('styles')
    <!-- INTERNAl Forn-wizard css-->
    <link href="{{ asset('assets/plugins/forn-wizard/css/forn-wizard.css') }}" rel="stylesheet" />
    <link href="{{ asset('assets/plugins/formwizard/smart_wizard.css') }}" rel="stylesheet">
    <link href="{{ asset('assets/plugins/formwizard/smart_wizard_theme_dots.css') }}" rel="stylesheet">

    <!-- INTERNAL File Uploads css -->
    <link href="{{ asset('assets/plugins/fancyuploder/fancy_fileupload.css') }}" rel="stylesheet" />

    <!-- INTERNAL File Uploads css-->
    <link href="{{ asset('assets/plugins/fileupload/css/fileupload.css') }}" rel="stylesheet" type="text/css" />

    <link href="{{ asset('assets/plugins/select2/select2.min.css') }}" rel="stylesheet" />
@endsection



@section('content')
    <!--Page header-->
    <div class="page-header">
        <div class="page-leftheader">
            <h4 class="page-title mb-0 text-primary">إعدادات صفحة العرض</h4>
        </div>
    </div>
    <!--End Page header-->

    <!-- Row -->
    <x-form.form title="الإعدادات" method="put" action="{{ route('admin.landingpage.update') }}">




        <div class=" tab-menu-heading p-0 bg-light">
            <div class="tabs-menu1 ">
                <!-- Tabs -->
                <ul class="nav panel-tabs">
                    <li class=""><a href="#tab5" class="active" data-bs-toggle="tab">السكشن الاول</a></li>
                    <li><a href="#tab6" data-bs-toggle="tab">المميزات</a></li>
                    <li><a href="#tab7" data-bs-toggle="tab">معرض الصور</a></li>
                </ul>
            </div>
        </div>
        <div class="panel-body tabs-menu-body">
            <div class="tab-content">
                <div class="tab-pane active " id="tab5">
                    @include('landingpage::includes._hero')
                </div>

                <div class="tab-pane " id="tab6">
                    @include('landingpage::includes._sections')
                </div>

                <div class="tab-pane " id="tab7">
                    @include('landingpage::includes._gallary')
                </div>

            </div>
        </div>













        <button type="submit" class="btn btn-primary mt-4 mb-0">حفظ</button>

    </x-form.form>
    <!-- /Row -->
@endsection('content')


@section('scripts')
    <!-- INTERNAl Jquery.steps js -->
    <script src="{{ asset('assets/plugins/jquery-steps/jquery.steps.min.js') }}"></script>
    <script src="{{ asset('assets/plugins/parsleyjs/parsley.min.js') }}"></script>

    <!-- INTERNAl Forn-wizard js-->
    <script src="{{ asset('assets/plugins/formwizard/jquery.smartWizard.js') }}"></script>
    <script src="{{ asset('assets/plugins/formwizard/fromwizard.js') }}"></script>

    <!-- INTERNAl Accordion-Wizard-Form js-->
    <script src="{{ asset('assets/plugins/accordion-Wizard-Form/jquery.accordion-wizard.min.js') }}"></script>
    <script src="{{ asset('assets/js/form-wizard.js') }}"></script>
    <script src="{{ asset('assets/js/form-wizard2.js') }}"></script>


    <!-- INTERNAL File uploads js -->
    <script src="{{ asset('assets/plugins/fileupload/js/dropify.js') }}"></script>
    <script src="{{ asset('assets/js/filupload.js') }}"></script>

    <script src="{{ asset('assets/plugins/select2/select2.full.min.js') }}"></script>
    <script src="{{ asset('assets/js/select2.js') }}"></script>

    <script>
        var drEvent = $('.dropify').dropify();

        drEvent.on('dropify.afterClear', function(event, element) {
            console.log(element.element.name)
            $.ajax({
                type: 'POST',
                url: "{{ route('admin.landingpage.deleteFile') }}",
                data: {
                    _token: "{{ csrf_token() }}",
                    inputname: element.element.name,
                    filepath: element.settings.defaultFile
                },
                success: function(data) {
                    console.log(data);
                }
            });
            alert('File deleted');
        });
    </script>
@endsection