mein-sterntours/resources/views/cms/booking/content/detail.blade.php

@extends('layouts.layout-2')

@section('content')

    <style>
     /*   body {
            -webkit-touch-callout: none;
            -webkit-user-select: none;
            -khtml-user-select: none;
            -moz-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }*/
        .btn-xs {
            line-height: 1.3em;
        }
        .table tbody + tbody {
            border-top: 1px solid #9c9c9c;
        }
        .table th, .table td {
            border-top: none;
        }
        .table tr.border-none td, .table tr.border-none th  {
            border-top: none;
        }
        .table .thead-dark th {
            color: #4E5155;
            background-color: rgba(24, 28, 33, 0.1);
            border-color: rgba(63, 69, 74, 0.1);
        }

        .input-group-text {
            padding: 0.438rem 0.475rem;
        }

        .note-editing-area {
            border-radius: 0.25rem;
            border: 1px solid rgba(24, 28, 33, 0.1);
            padding: 0.438rem 0.875rem;
            color: #4E5155;
            -webkit-transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
            transition: border-color 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
            transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, -webkit-box-shadow 0.15s ease-in-out;
        }

        .note-editor.note-frame .note-editing-area .note-editable, .note-editor.note-airframe .note-editing-area .note-editable {
            color: #000;
        }

         .note-editor.note-frame .note-editing-area:focus-within  , .note-editor.note-airframe .note-editing-area:focus-within   {
             border-color: #648859;
         }
         .note-editing-area .note-editable li {
             margin-bottom:0.5rem;
         }
        .note-editor.note-airframe .note-placeholder {
            padding: 0;
        }
         .draft_item_tbody .form-control {
             color: #000;
         }
    </style>

    <h4 class="font-weight-bold py-3 mb-1">
        Buchnungen PDF Inhalte / {{ $content_name->name }}
        <div class="float-right">
            <a href="{{ route('cms_booking_content') }}" class="btn btn-default btn-sm">zurück</a>
        </div>
    </h4>


        <div class="card">
            {!! Form::open(['url' => route('cms_booking_content_detail', [$content_name->id]), 'class' => 'form-horizontal',  'id'=>'booking-content-detail-form']) !!}
            {{ Form::hidden('content_pos_id', '') }}
            {{ Form::hidden('action', '') }}
            
            @if(count($contents))
                @php($i = 1)

                <div class="table-responsive mb-4">
                    <table class="table mb-0" id="table_dragula_tbody" style="min-width: 1080px">
                        <thead class="thead-dark">
                        <tr>
                            <th style="width: 1em"></th>
                            <th style="width: 1em">#</th>
                            <th>Abschnitte</th>
                            <th style="width: 8em">#</th>
                        </tr>
                        </thead>
                        @foreach($contents as $content)
                            @if($content->decimal > 0)
                            <tbody class="draft_item_tbody">
                                <tr>
                                    <td>
                                        <span class="ion ion-ios-lock d-inline-block bg-dark text-white p-1 px-2"></span>
                                        {{-- <span class="handle ion ion-ios-move d-inline-block bg-primary text-white p-1"></span>  --}}
                                    </td>
                                    <td><span class="item_pos_number">{{ $i++ }}</span></td>
                                    <td>
                                        {{ Form::text('contents['.$content->id.'][name]', $content->getNameWithEmpty(),  array('placeholder'=>__('Abschnitt'), 'class'=>'form-control', 'id'=>'contents_'.$content->id.'_name', 'readonly')) }}
                                        {{ Form::hidden('contents['.$content->id.'][identifier]', $identifier_general) }}
                                    </td>
                                    <td>
                                        {{--
                                        <button type="button" name="" value="up_{{$content->id}}" class="btn btn-xs btn-default move-up-btn"><i class="fa fa-arrow-up"></i> </button>
                                        <button type="button" name="" value="down_{{$content->id}}" class="btn btn-xs btn-default mr-2 move-down-btn"><i class="fa fa-arrow-down"></i> </button>
                                        <a class="text-danger" href="{{ route('cms_fewo_all_delete', [$content->id]) }}"  onclick="return confirm('{{__('Wirklich löschen?')}}');"><i class="fa fa-trash-alt"></i></a>
                                        --}}
                                    </td>
                                </tr>
                                <tr class="border-none">
                                    <td colspan="2" style="vertical-align: bottom">
                                        <button type="button" name="action" value="addItem" class="btn btn-xs btn-primary btn-add-item" title="Abschnitt hinzufügen" data-pos-id="{{$content->id}}"><i class="fa fa-plus"></i> <i class="fa fa-arrow-down"></i></button>
                                    </td>
                                    <td>
                                        <div class="note-editing-area readonly">
                                            {!! $content->getContent() !!}
                                        </div>
                                    </td>
                                    <td>
                                        {{-- --}}
                                        <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                            {!! Form::checkbox('contents['.$content->id.'][in_pdf]', 1, ($content->decimal > 0), ['class'=>'custom-control-input', 'disabled']) !!}
                                            <span class="custom-control-label">{{__('in PDF')}}</span>
                                        </label>
                                        <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                            {!! Form::checkbox('contents['.$content->id.'][page-break]', 1, ($content->getObjectBy('page-break') > 0), ['class'=>'custom-control-input', 'disabled']) !!}
                                            <span class="custom-control-label" style="white-space: nowrap;">{{__('Neue Seite')}}</span>
                                        </label>
                                        <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                            {!! Form::checkbox('contents['.$content->id.'][repeat-country]', 1, ($content->getObjectBy('repeat-country') > 0), ['class'=>'custom-control-input', 'disabled']) !!}
                                            <span class="custom-control-label" style="white-space: nowrap;"><i class="ion ion-ios-repeat"></i> {{ __('Länder')}}</span>
                                        </label>
                                        <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                            {!! Form::checkbox('contents['.$content->id.'][repeat-airline]', 1, ($content->getObjectBy('repeat-airline') > 0), ['class'=>'custom-control-input', 'disabled']) !!}
                                            <span class="custom-control-label" style="white-space: nowrap;"><i class="ion ion-ios-repeat"></i> {{__('Airline')}}</span>
                                        </label>
                                    </td>
                                </tr>

                            </tbody>
                            @endif
                            @if($booking_contents = \App\Services\Booking::getBookingCMSContent($content, $identifier_content))
                                @foreach($booking_contents as $content)
                                    <tbody class="draft_item_tbody">
                                    <tr>
                                        <td>
                                            <span class="handle ion ion-ios-move d-inline-block bg-primary text-white p-1"></span>
                                        </td>
                                        <td><span class="item_pos_number">{{ $i++ }}</span></td>
                                        <td>
                                            {{ Form::text('contents['.$content->id.'][name]', $content->getNameWithEmpty(),  array('placeholder'=>__('Abschnitt'), 'class'=>'form-control', 'id'=>'contents_'.$content->id.'_name', 'required')) }}
                                            {{ Form::hidden('contents['.$content->id.'][identifier]', $identifier_content) }}
                                        </td>
                                        <td>
                                            <button type="button" name="" value="up_{{$content->id}}" class="btn btn-xs btn-default move-up-btn"><i class="fa fa-arrow-up"></i> </button>
                                            <button type="button" name="" value="down_{{$content->id}}" class="btn btn-xs btn-default mr-2 move-down-btn"><i class="fa fa-arrow-down"></i> </button>
                                            <a class="text-danger" href="{{ route('cms_booking_content_delete', [$content->id, 'item']) }}"  onclick="return confirm('{{__('Wirklich löschen?')}}');"><i class="fa fa-trash-alt"></i></a>
                                        </td>
                                    </tr>
                                    <tr class="border-none">
                                        <td colspan="2" style="vertical-align: top">
                                            <button type="button" class="btn btn-default btn-sm mb-2 openSummernoteAir" data-id="#contents_{{ $content->id }}_text"><i class="ion ion-md-color-palette"></i></button>&nbsp;
                                            <button type="submit" name="action" value="saveAll" class="btn btn-secondary btn-sm mt-2" title="speichern"><i class="ion ion-ios-save"></i></button>&nbsp;
                                        </td>
                                        <td>
                                            {{ Form::textarea('contents['.$content->id.'][full_text]', $content->getContent(),  array('class'=>'form-control autoExpand summernote-air-placeholder', 'id'=>'contents_'.$content->id.'_text', 'rows'=>'1', 'data-min-rows'=>'1')) }}
                                        </td>
                                        <td>
                                            <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                                {!! Form::checkbox('contents['.$content->id.'][in_pdf]', 1, ($content->decimal > 0), ['class'=>'custom-control-input']) !!}
                                                <span class="custom-control-label">{{__('in PDF')}}</span>
                                            </label>
                                            <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                                {!! Form::checkbox('contents['.$content->id.'][page-break]', 1, ($content->getObjectBy('page-break') > 0), ['class'=>'custom-control-input']) !!}
                                                <span class="custom-control-label" style="white-space: nowrap;">{{__('Neue Seite')}}</span>
                                            </label>
                                            <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                                {!! Form::checkbox('contents['.$content->id.'][repeat-country]', 1, ($content->getObjectBy('repeat-country') > 0), ['class'=>'custom-control-input']) !!}
                                                <span class="custom-control-label" style="white-space: nowrap;"><i class="ion ion-ios-repeat"></i> {{ __('Länder')}}</span>
                                            </label>
                                            <label class="custom-control custom-checkbox mt-2" style="margin-right: 20px;">
                                                {!! Form::checkbox('contents['.$content->id.'][repeat-airline]', 1, ($content->getObjectBy('repeat-airline') > 0), ['class'=>'custom-control-input']) !!}
                                                <span class="custom-control-label" style="white-space: nowrap;"><i class="ion ion-ios-repeat"></i> {{__('Airline')}}</span>
                                            </label>
                                        </td>
                                    </tr>
                                    </tbody>
                                @endforeach

                            @endif
                        @endforeach
                        <tfoot>
                        <tr>
                            <td colspan="4"></td>
                        </tr>
                        </tfoot>
                    </table>
                </div>
            @endif

            <div class="text-left mt-3 m-2">
                <button type="submit" name="action" value="saveAll" class="btn btn-submit btn-sm">{{ __('save changes') }}</button>&nbsp;

                <div class="float-right">
                    <button type="submit" name="action" value="previewPDF" class="btn btn-sm btn-info"><i class="fa fa-file-pdf"></i> Vorschau PDF</button>
                </div>
            </div>
            {!! Form::close() !!}
        </div>

@endsection


@section('scripts')
<script src="{{ asset('/js/summernote-placeholders.js?v=1') }}"></script>

    <script>
        $(document).ready(function() {
            $('.btn-add-item').on('click', function () {
                $('input[name=content_pos_id]').val($(this).data('pos-id'));
                $('input[name=action]').val('addItem');
                $("#booking-content-detail-form").submit();
            });
            $.dragYScroll();
            var sort_item_pos_number = function(){
                var index = 1;
                $('#table_dragula_tbody .draft_item_tbody').each(function () {
                    $(this).find('.item_pos_number').html(index);
                    $(this).data('rowPosition', index);
                    index++;
                });
            };
            $(function() {
                // Drag handle
                var sortableItems = dragula([$('#table_dragula_tbody')[0]], {
                    moves: function (el, container, handle) {
                        return handle.classList.contains('handle');
                    }
                });
                sortableItems.on('dragend', function() {
                    //sort new
                    sort_item_pos_number();
                });
            });
            $('table .move-up-btn').on('click', function () {
                var thisRow = $(this).closest('tbody');
                var prevRow = thisRow.prev();
                if (prevRow.length) {
                    prevRow.before(thisRow);
                    sort_item_pos_number()

                }
            });
            $('table .move-down-btn').on('click', function () {
                var thisRow = $(this).closest('tbody');
                var nextRow = thisRow.next();
                if (nextRow.length) {
                    nextRow.after(thisRow);
                    sort_item_pos_number()
                }
            });

            $('.summernote-air-placeholder').summernote({
                airMode: true,
                lang: 'de-DE',
                placeholder: 'Text ...',
                tabsize: 2,
                popover: { air:[
                        ['style', ['style']],
                        ['font', ['bold', 'italic', 'underline', 'clear']],
                        ['font', ['strikethrough']],
                        ['para', ['ul', 'ol', 'paragraph']],
                        ['insert', ['link']],
                        ['color', ['color']],
                        ['view', ['codeview']],
                        ['extensions', ['placeholders']]
                ] },
                placeholderList: 
                {
                    blockChar : '#',
                    items:  [{!! \App\Services\Placeholder::getOptionsSummernote('booking') !!}],
                },
                callbacks: {
                    onFocus: function(e) {
                    },
                    onBlur: function (e) {
                    },
                },
                cleaner:{
                    action: 'paste', // both|button|paste 'button' only cleans via toolbar button, 'paste' only clean when pasting content, both does both options.
                    newline: '<br>', // Summernote's default is to use '<p><br></p>'
                    notStyle: 'position:absolute;top:0;left:0;right:0', // Position of Notification
                    icon: '<i class="note-icon">[Your Button]</i>',
                    keepHtml: false, // Remove all Html formats
                    keepOnlyTags: ['<p>', '<br>', '<ul>', '<li>', '<b>', '<strong>','<i>', '<a>'], // If keepHtml is true, remove all tags except these
                    keepClasses: false, // Remove Classes
                    badTags: ['style', 'script', 'applet', 'embed', 'noframes', 'noscript', 'html'], // Remove full tags with contents
                    badAttributes: ['style', 'start'], // Remove attributes from remaining tags
                    limitChars: false, // 0/false|# 0/false disables option
                    limitDisplay: false, // text|html|both
                    limitStop: false // true/false
                }
            });

            $('.openSummernoteAir').on('click', function(){            
                $($(this).data('id')).parent().find('.note-editable').focus();
                    popover = $($(this).data('id')).parent().children('.note-editor').children('.note-popover');
                if(popover.css('display') == 'none'){
                    popover.css("display", "block");
                }else{
                    popover.css("display", "none");
                }
            });

        });
    </script>
@endsection