<div class="card mb-2">
    <h6 class="card-header">
        {{__('Produktliste')}} / {{ $category->name  }}
    </h6>
    <div class="mt-3 ml-3">
        <button type="button" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#modals-categorie-products"
            data-id="new"
            data-pos="0"
            data-produkt_id=""
        >{{__('Produkt hinzufügen')}}</button>
    </div>
    <div class="card-datatable table-responsive">
        <table class="datatables-style table table-striped table-bordered">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Pos</th>
                    <th>Produkt</th>
                    <th>#</th>
                </tr>
            </thead>
            <tbody>
            @foreach($category->product_categories as $product_category)
                <tr>
                    <td>
                        <button type="button" class="btn icon-btn btn-sm btn-primary" data-toggle="modal" data-target="#modals-categorie-products"
                            data-id="{{ $product_category->id }}"
                            data-pos="{{ $product_category->pos }}"
                            data-product_id="{{ $product_category->product_id }}">
                            <span class="far fa-edit"></span>
                        </button>
                    </td>
                    <td>
                        {{ $product_category->pos }}
                    </td>
                    <td>
                        @if($product_category->product)
                         {{ $product_category->product->name }}
                            @if($product_category->product->active) 
                                &nbsp; | &nbsp;<span class="badge badge-pill badge-success"><i class="fa fa-check"></i></span>
                            @else
                                &nbsp; | &nbsp;<span class="badge badge-pill badge-danger"><i class="fa fa-times"></i></span>
                            @endif
                            &nbsp; | &nbsp;<span class="small">{!! $product_category->product->getShowOnTypes(' / ') !!}</span>
                            &nbsp; | &nbsp;<a href="{{ route('admin_product_edit', [$product_category->product->id]) }}" class="btn btn-xs btn-secondary"><i class="fa fa-eye"></i></a>
                         @else
                         -
                        @endif
                    </td>
                    <td>
                       <a class="text-danger" href="{{ route('admin_product_category_delete', ['product_category', $product_category->id]) }}"  onclick="return confirm('{{__('Really delete entry?')}}');"><i class="far fa-trash-alt"></i></a>
                    </td>
                </tr>
            @endforeach
            </tbody>
        </table>
        <div class="mt-3 ml-3">
            <button type="button" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#modals-categorie-products"
                    data-id="new"
                    data-pos="0"
                    data-produkt_id=""
            >{{__('Produkt hinzufügen')}}</button>

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


<!-- Modal template -->
<div class="modal fade" id="modals-categorie-products">
    <div class="modal-dialog">
        <form class="modal-content" action="{{ route('admin_product_category_store') }}" method="post">
            @csrf
            <input type="hidden" name="id">
            <input type="hidden" name="category_id" value="{{ $category->id }}">

            <div class="modal-header">
                <h5 class="modal-title"> {{__('Produkt')}} <span class="font-weight-light">{{__('create/edit')}}</span></h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">×</button>
            </div>
            <div class="modal-body">
                <div class="form-row">

                    <div class="form-group col-md-12">
                        <label class="form-label" for="pos">{{ __('pos') }}</label>
                        {{ Form::text('pos', $category->pos,  array('placeholder'=>__('pos'), 'class'=>'form-control')) }}
                    </div>
                    <div class="form-group col-md-12">
                        <label for="country_ids" class="form-label">{{__('Produkt')}}</label>
                        <select class="selectpicker" name="product_id" id="product_id"  data-style="btn-light" data-live-search="true" required>                          
                          {!! HTMLHelper::getProductsOptions() !!}
                        </select>
                    </div>
                </div>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">{{__('close')}}</button>
                <button type="submit" class="btn btn-primary" name="action" value="save-product_category">{{__('save')}}</button>
            </div>
        </form>
    </div>
</div>


<script>
    $( document ).ready(function() {

        $('#modals-categorie-products').on('show.bs.modal', function (event) {
            var button = $(event.relatedTarget);
            $(this).find(".modal-content input[name='id']").val(button.data('id'));
            $(this).find(".modal-body input[name='pos']").val(button.data('pos'));
            $(this).find(".modal-body select[name='product_id']").val(button.data('product_id'));
            $('.selectpicker').selectpicker('refresh');
        });

    });
</script>