
<div class="card mb-2">
    <h5 class="card-header">
        {{ __('Promotion') }}
    </h5>
    <div class="card-body">
        <div class="form-row">
            <div class="form-group col-md-12 {{ $errors->has('name') ? 'has-error' : '' }}">
                <label class="custom-control custom-checkbox float-right">
                    {!! Form::checkbox('active', 1, $user_promotion->active, ['class' => 'custom-control-input']) !!}
                    <span class="custom-control-label">{{ __('Promotion aktiv') }}</span>
                </label>
                <label class="form-label" for="name">Promotion Name vergeben*</label>
                {{ Form::text('name', $user_promotion->name, ['placeholder' => __('Promotion Name'), 'class' => 'form-control', 'id' => 'name', 'required' => true]) }}
                @if ($errors->has('name'))
                    <span class="help-block">
                        <strong>{{ $errors->first('name') }}</strong>
                    </span>
                @endif
            </div>
            <div class="form-group col-12">
                <label class="form-label" for="description">Kurzbeschreibung (optional)</label>
                {{ Form::textarea('description', $user_promotion->description, ['placeholder' => __('Kurzbeschreibung'), 'class' => 'form-control', 'rows' => 2, 'id' => 'description']) }}
            </div>
        </div>

        <p>Text...</p>
        <div class="form-row">
            <div class="form-group col-md-8">
                <div class="input-group mt-2 mb-2 ">
                    <span class="input-group-prepend">
                        <div class="py-2 px-1">
                            <strong>www.testemicht.jetzt/ &nbsp;</strong>
                        </div>
                    </span>
                    {{ Form::text('user_promotion_url', $user_promotion->url, ['placeholder' => 'z.B. "thomas" oder "dani21" o.ä.', 'class' => 'form-control' . ($errors->has('user_promotion_url') ? ' is-invalid' : ''), 'id' => 'user_promotion_url', 'required' => true]) }}
                </div>
                @if ($errors->has('user_promotion_url'))
                    <span class="invalid-feedback" style="display: inline-block;">
                        <strong>{{ $errors->first('user_promotion_url') }}</strong>
                    </span>
                @endif
            </div>
            <div class="form-group col-md-4">
                <div class="px-3 py-0 py-md-3">
                    <div class="badge badge-success" style="display: none" id="user_promotion_url_success"><i
                            class="fa fa-check"></i> ist noch frei</div>
                    <div class="badge badge-danger" style="display: none" id="user_promotion_url_error"><i
                            class="fa fa-times"></i> nicht verfügbar/Fehler</div>
                </div>
            </div>
            <div class="from-group mb-2 col-md-8">
                <label class="form-label">Vorschau Domain</label>
                {{ Form::text('preview_user_promotion_url', $user_promotion->getUrlPreview(), ['placeholder' => __('Vorschau Shop-Internet Adresse'), 'class' => 'form-control', 'id' => 'preview_user_promotion_url', 'readonly']) }}
            </div>

        </div>

        <div class="form-row">
            <div class="form-group col-sm-12">
                <hr>
                <label class="custom-control custom-checkbox mt-2">
                    {!! Form::checkbox('pick_up', 1, $user_promotion->pick_up, ['class' => 'custom-control-input']) !!}
                    <span class="custom-control-label">Kunden können bei mir persönlich abholen.</span>
                </label>
            </div>
        </div>



    </div>
    <hr class="m-0">
    <div class="card-body">
        <p>Text ...</p>
        <h5>
            Aktuelles Guthaben: {{ Auth::user()->getFormattedPaymentCredit() }} &euro; 
            <span class="text-muted small">(Guthaben aufladen unter: <a
                    href="{{ route('user_order_my_delivery', ['me']) }}">Bestellungen aufgeben</a> -> Produkt
                Guthaben aufladen)</span>
        </h5>
        <style>
            table.table-product,
            table.table-product tr td,
            table.table-product tr th {
                border: none;
            }

            table.table-product tr.border-top td {
                border-top: 1px solid #b8b8b9;
            }

            table.table-product tr.border-bottom td,
            table.table-product tr.border-bottom th {
                border-bottom: 1px solid #b8b8b9;
            }
           

                .btn-md-extra {
                    padding: 0.3rem 0.6rem;
                    font-size: 0.8rem;
                    line-height: 1.5;
                    border-radius: 0.25rem;
                }

                .md-btn-extra {
                    width: calc(1.7rem + 2px) !important;
                    line-height: 1.5rem;
                }

                .form-control.input-extra {
                    padding: 0.28rem 0.6rem;
                    font-size: 0.8rem;
                    font-weight: 500;
                    min-height: calc(1.8rem + 2px);
                    height: calc(1.8rem + 2px);
                    width: 44px;
                }

                .input-group-min-w {
                    min-width: 102px;
                }

                .img-extra {
                    min-width: 55px;
                    max-height: 160px;
                }

                @media (max-width: 767px) {
                    .default-style:not([dir=rtl]) div.card-datatable table.dataTable thead th:first-child, .default-style:not([dir=rtl]) div.card-datatable table.dataTable tbody td:first-child, .default-style:not([dir=rtl]) div.card-datatable table.dataTable tfoot th:first-child {
                        padding-left: 0.6rem !important;
                    }

                    .img-extra {
                        min-width: 35px;
                        max-height: 160px;
                    }
                }

        </style>

        <div class="table-responsive">
            <table class="table table-product table-striped m-0" id="datatables-promotion-list" data-url="{{ route('user_promotion_load') }}" data-action="updateCart" data-user_promotion_id="{{ $user_promotion->id }}">
                <thead>
                    <tr class="border-bottom">
                        <th style="max-width: 60px;">Aktiv</th>
                        <th>{{ __('Anzahl') }}</th>
                        <th>{{ __('Produkt') }}</th>
                        <th class="text-right">{{ __('Mein Preis netto') }}</th>
                        <th class="text-right">{{ __('Mein Preis brutto') }}</th>
                        <th class="text-right">{{ __('geordert') }}</th>

                    </tr>
                </thead>
                    <tbody>
                    @foreach ($user_promotion->promotion_admin->promotion_admin_products_active as $promotion_admin_product)
                        <tr class="border-bottom">
                            <td class="align-middle">
                                <label class="custom-control custom-checkbox mt-2">
                                    {!! Form::checkbox('products_active['.$promotion_admin_product->id.']', 1, $promotion_admin_product->getPromotionUserProducts($user_promotion, 'active'), 
                                     ['class' => 'custom-control-input check-event-promotion-onchange', 'id'=>'product_check_'.$promotion_admin_product->id]) !!}
                                    <span class="custom-control-label"></span>
                                </label>
                            </td>
                            <td class="align-middle">
                                <div class="no-line-break input-group-min-w">
                                    <div class="input-group d-inline-flex w-auto">
                                        <span class="input-group-prepend">
                                          <button type="button" class="btn btn-secondary icon-btn md-btn-extra remove-product-promotion" data-product-id="{{ $promotion_admin_product->id }}">-</button>
                                        </span>
                                        <input type="text" class="form-control text-center input-extra input-event-promotion-onchange" 
                                            name="products_qty[{{ $promotion_admin_product->id }}]" 
                                            id="product_qty_{{ $promotion_admin_product->id }}" data-product-id="{{ $promotion_admin_product->id }}" 
                                            value="{{ $promotion_admin_product->getPromotionUserProducts($user_promotion, 'open_items') }}">
                                        <input type="hidden" name="products_user[{{ $promotion_admin_product->id }}]" value="{{ $promotion_admin_product->getPromotionUserProducts($user_promotion, 'id') }}">
                                        <span class="input-group-append">
                                          <button type="button" class="btn btn-secondary icon-btn md-btn-extra add-product-promotion" data-product-id="{{ $promotion_admin_product->id }}">+</button>
                                        </span>
                                    </div>
                                </div>
                            </td>
                            <td class="px-3 py-2 align-middle">
                                <div class="media align-items-center">
                                    @if ($promotion_admin_product->product)
                                        @if ($promotion_admin_product->product->images)
                                            @if ($image = $promotion_admin_product->product->images->first())
                                                <img src="{{ route('product_image', [$image->slug]) }}"
                                                    class="d-block ui-w-80 mr-4" alt>
                                            @endif
                                        @endif
                                        <div class="media-body">
                                            <a href="{{ route('admin_product_edit', [$promotion_admin_product->product->id]) }}"
                                                class="d-block">{{ $promotion_admin_product->product->name }}
                                                <span
                                                    class="text-muted">#{{ $promotion_admin_product->product->number }}</span></a>
                                            <small>
                                                <span class="text-muted">Inhalt: </span>
                                                {{ $promotion_admin_product->product->contents }}<br>
                                                <span class="text-muted">Gewicht: </span>
                                                {{ $promotion_admin_product->product->weight }} g<br>
                                            </small>
                                            <a href="" class="" data-modal="modal-lg" data-toggle="modal" data-target="#modals-load-content" 
                                            data-id="{{ $promotion_admin_product->product->id }}" 
                                            data-route="{{ route('modal_load') }}" 
                                            data-action="user-order-show-product" data-view="customer">
                                            <div class=""><i class="ion ion-md-eye"></i></div></a>
                                        </div>
                                    @endif
                                </div>
                            </td>
                            <td class="align-middle px-3 py-2 nowrap text-right" style="">
                                {{ $promotion_admin_product->getFormattedPriceWith(true) }} &euro; 
                            </td>
                            <td class="align-middle px-3 py-2 text-right" style="">
                                {{ $promotion_admin_product->getFormattedPriceWith(false) }} &euro; 
                            </td>
                            <td class="align-middle px-3 py-2 text-right" style="">
                                {{ $promotion_admin_product->getPromotionUserProducts($user_promotion, 'sell_items') }}
                            </td>

                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    </div>
    <hr class="m-0">
    <div class="card-body" id="holder_html_view_cart">
         @include('user.promotion.cart', ['user_promotion_cart'=> $user_promotion_cart, 'checkPaymentCredit' => $checkPaymentCredit] )
    </div>
</div>

<script type="application/javascript">
    $(document).ready(function() {
        $.extend($.validator.messages, {
            required: "Dieses Feld ist ein Pflichtfeld.",
            maxlength: $.validator.format("Gib bitte maximal {0} Zeichen ein."),
            minlength: $.validator.format("Gib bitte mindestens {0} Zeichen ein."),
            rangelength: $.validator.format("Gib bitte mindestens {0} und maximal {1} Zeichen ein."),
            email: "Gib bitte eine gültige E-Mail Adresse ein.",
            url: "Gib bitte eine gültige URL ein.",
            date: "Bitte gib ein gültiges Datum ein.",
            number: "Gib bitte eine Nummer ein.",
            digits: "Gib bitte nur Ziffern ein.",
            equalTo: "Bitte denselben Wert wiederholen.",
            range: $.validator.format("Gib bitte einen Wert zwischen {0} und {1} ein."),
            max: $.validator.format("Gib bitte einen Wert kleiner oder gleich {0} ein."),
            min: $.validator.format("Gib bitte einen Wert größer oder gleich {0} ein."),
            creditcard: "Gib bitte eine gültige Kreditkarten-Nummer ein."
        });
        // Set up validator
        var message = 'Default error message';
        $('#user-promotion-form-validations').validate({
            rules: {
                'user_promotion_url': {
                    required: true,
                    remote: {
                        url: "{{ route('user_promotion_load') }}",
                        type: "post",
                        data: {
                            user_promotion_url: function() {
                                return $(
                                    '#user-promotion-form-validations :input[name="user_promotion_url"]'
                                    ).val();
                            },
                            action: 'validate_url'
                        },
                        encode: true,
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        dataFilter: function(response) {
                            response = $.parseJSON(response);
                            console.log(response);
                            $('#user_promotion_url_success').hide();
                            $('#user_promotion_url_error').hide();
                            if (response.success === true) {
                                $('#user_promotion_url_success').show();
                                $('#preview_user_promotion_url').val(response
                                    .preview_user_promotion_url);
                                return true;
                            } else {
                                $('#user_promotion_url_error').show();
                                message = response.errors.user_promotion_url;
                                $('#preview_user_promotion_url').val('');
                                return false;
                            }
                        }
                    }
                },
            },
            errorPlacement: function errorPlacement(error, element) {
                $(element).parents('.form-group').find('.input-group').after(
                    error.addClass('invalid-feedback d-block font-weight-bold')
                )
            },
            highlight: function(element) {
                if($(element).attr('required')){
                    $(element).parent().find('button').removeClass('btn-success');
                    $(element).parent().find('button').addClass('btn-danger');
                    $(element).parent().find('button i').removeClass('fa-check');
                    $(element).parent().find('button i').addClass('fa-times');
                    $(element).removeClass('is-valid');
                    $(element).addClass('is-invalid');
                }
            },
            unhighlight: function(element) {
                if($(element).attr('required')){
                    $(element).removeClass('is-invalid');
                    $(element).addClass('is-valid');
                    $(element).parent().find('button').removeClass('btn-danger');
                    $(element).parent().find('button').addClass('btn-success');
                    $(element).parent().find('button i').removeClass('fa-times');
                    $(element).parent().find('button i').addClass('fa-check');
                    $(element).parents('.form-group').find('.is-invalid').removeClass('is-invalid');
                }

               
            },
            messages: {
                required: "{{ __('This field is required.') }}",
                user_promotion_url: {
                    email: "{{ __('Please enter a valid email address.') }}",
                    remote: function() {
                        return message;
                    }
                },
            },
            onkeyup: function(element) {
                $(element).valid()
            },
        });

        var iqPromotionCart = IqPromotionCart.init();

    });
</script>


@section('scripts')
    <script src="{{ asset('/js/iq-promotion-cart.js') }}?v=2{{ get_file_last_time('/js/iq-promotion-cart.js') }}"></script>
@endsection