@extends('admin.layout')
@section('content')
    <!-- Content Header (Page header) -->
    @php
    $rtl = App\Language::where('code', App::getLocale())->first()->rtl;
    @endphp

    <!-- Start Css Code custem  -->

    <div class="content-header">
        <div class="d-flex align-items-center">
            <div class="mr-auto">
                <h3 class="page-title">
                    {{ $rtl == true ? $module['module']['title_ar'] : $module['module']['title_en'] }}</h3>
                <div class="d-inline-block align-items-center">
                    <nav>
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item">
                                <a href="{{ route('dashboard') }}">
                                    <i class="fa fa-home"></i>
                                </a>
                            </li>

                            <li class="breadcrumb-item" aria-current="page">
                                <a href="{{ route('Addon.AddHook') }}">
                                    {{ translate('Apps and Services') }}
                                </a>
                            </li>


                            <li class="breadcrumb-item" aria-current="page">
                                <a href="{{ route('Addon.modules') }}">
                                    {{ translate('Modules') }}
                                </a>
                            </li>
                            <li class="breadcrumb-item" aria-current="page">
                                {{ $rtl == true ? $module['module']['title_ar'] : $module['module']['title_en'] }}
                            </li>

                        </ol>
                    </nav>
                </div>
            </div>

        </div>
    </div>

    <!-- Main content -->
    <section class="content">


        <div class="row">
            <div class=" col-xl-1 col-12 ">

            </div>
            <div class="col-xl-10 col-12">
                <div class="row">
                    <div class=" col-xl-8 col-12 ">
                        <div class="box">

                            <div class="box-body">
                                <div class="flexslider2">
                                    <ul class="slides">
                                        {{-- {{ getExternalRouts()['mangerRout'] }}{{ $moduleSliderImage['file_path'] }} --}}
                                        @foreach ($module['module']['option_attach'] as $moduleSliderImage)
                                            <li
                                                data-thumb="{{ getExternalRouts()['mangerRout'] }}{{ $moduleSliderImage['file_path'] }}">
                                                <img src="{{ getExternalRouts()['mangerRout'] }}{{ $moduleSliderImage['file_path'] }}"
                                                    alt="{{ $moduleSliderImage['name'] }}" style="width: 100%;" />
                                            </li>
                                        @endforeach
                                    </ul>
                                </div>
                            </div>

                            <hr />

                            <div class=" b-1 m-10 p-10">
                                <h4 class="page-title orang"> {{ translate('Details') }}</h4>
                                <p class="b-solid ">
                                    {{ $rtl == true ? $module['module']['description_ar'] : $module['module']['description_en'] }}
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class=" col-xl-4 col-12 ">
                        <div class="box">

                            <div class="box-body text-center">

                                <h3 style="margin-bottom: 1px;"> {{ $module['module']['price'] }} $</h3>
                                <p> {{ translate('for one time') }}</p>


                                <div class="row">
                                    <div class="col-xl-12 col-12 ">
                                        @if ($module['module']['from_subscribtion'] != null)
                                            <span>{{ translate('Free from') }}</span> <a
                                                href="{{ route('subscribions') }}"><span style="color: #fb763d">
                                                    {{ $rtl == true? $module['module']['from_subscribtion']['title_ar']: $module['module']['from_subscribtion']['title_en'] }}
                                                    <img src="{{ getExternalRouts()['mangerRout'] }}/{{ $module['module']['from_subscribtion']['icon'] }} "
                                                        style="max-width: 30px;" />
                                                </span></a>

                                        @endif
                                    </div>
                                </div>
                                <br>

                                @if (Session::get('tenant_subscribtion_data')[$module['module']['type']]['belongs_to_subscribtion'] == true)
                                    <div class="row">
                                        <div class="col-xl-3 col-12"></div>
                                        <div style="background-color: #fb763d"
                                            class="btn btn-rounded btn-dark padding-label-dashbord  template-buttons col-xl-6 col-12">
                                            {{ translate('Purchased') }}</div>

                                    </div>
                                    <hr>
                                    <div class="checkbox">
                                        <input type="checkbox" id="Checkbox_active" @if ($controle_module->enable == 1) checked @endif
                                            onchange="update_enablity(this)" value="{{ $controle_module->type }}" />
                                        <label for="Checkbox_active">{{ translate('Active') }}</label>
                                    </div>
                                @else
                                    <div class="row">
                                        <div class=" col-xl-6 col-12 ">
                                            <a href="#" style="background-color: #fb763d"
                                                class="btn btn-rounded btn-dark padding-label-dashbord  template-buttons"
                                                onclick="addToCart({{ $module['module']['id'] }},'module')">{{ translate('Add to cart') }}</a>
                                        </div>
                                        <div class=" col-xl-6 col-12 ">
                                            <a href="{{ route('Addon.purchaseCart') }}"
                                                class="btn btn-rounded btn-dark padding-label-dashbord  template-buttons">
                                                {{ translate('Follow up on the purchase') }}</a>
                                        </div>
                                    </div>
                                @endif




                            </div>
                        </div>

                        <h4 class="page-title">{{ translate('Products we recommend to you') }} </h4>



                        @foreach ($module['related_modules'] as $val)

                            <div class="box box-link-pop text-center module-page">
                                <h5>
                                    {{ $rtl == true ? $val['title_ar'] : $val['title_en'] }}
                                </h5>
                                <div class="bg-img"
                                    style="background-image: url('{{ getExternalRouts()['mangerRout'] }}{{ $val['image'] }}');">
                                    <div class="shopen-card-module">
                                        <a href="#" style="background-color: #fb763d"
                                            class="btn btn-rounded btn-dark padding-label-dashbord  template-buttons"
                                            onclick="addToCart({{ $val['id'] }},'module')">{{ translate('Buy now') }}</a>
                                        <p class="clear" style="margin-top: 20px;">
                                            <a href="{{ route('Addon.singleModules', encrypt($val['id'])) }}"
                                                class="btn btn-rounded btn-dark padding-label-dashbord  template-buttons">
                                                {{ translate('More details') }}</a>

                                        </p>
                                    </div>
                                </div>


                                <div class="row footer-buttons">
                                    <div class="col-md-4 col-4 col-xl-4" style="text-align: initial">
                                        <span>
                                            {{ translate('price') }} :
                                            {{ $val['price'] }} $</span>

                                    </div>
                                    <div class="col-md-8 col-8 col-xl-8" style="text-align: end">
                                        @if ($val['from_subscribtion'] != null)
                                            <span>{{ translate('Free from') }}</span> <a
                                                href="{{ route('subscribions') }}"><span style="color: #fb763d">
                                                    {{ $rtl == true ? $val['from_subscribtion']['title_ar'] : $val['from_subscribtion']['title_en'] }}
                                                    <img src="{{ getExternalRouts()['mangerRout'] }}/{{ $val['from_subscribtion']['icon'] }} "
                                                        style="max-width: 30px;" />
                                                </span></a>

                                        @endif
                                    </div>
                                </div>
                            </div>
                        @endforeach
                    </div>


                </div>
            </div>
            <div class="col-xl-1 col-12">
            </div>
        </div>




    </section>
@endsection

@section('script')
    <!-- Import Slider library -->
    <script src="{{ url('Panel/assets/vendor_plugins/bootstrap-slider/bootstrap-slider.js') }}"></script>
    <script src="{{ url('Panel/assets/vendor_components/flexslider/jquery.flexslider.js') }}"></script>
    <script src="{{ url('Panel/main-semidark/js/pages/slider.js') }}"></script>
    <!-- End Import Slider libary-->
    <script type="text/javascript">
        function update_enablity(el) {
            if (el.checked) {
                var enable = 1;
            } else {
                var enable = 0;
            }
            $.post(`{{ route('Module.update_module_enablity') }}`, {
                _token: '{{ csrf_token() }}',
                type: el.value,
                enable: enable
            }, function(data) {
                showAjaxsToast(data);
                location.reload();
            });
        }
    </script>

@endsection