@extends('adminlte::page')

@section('title_postfix', ' - Sve pod kategorije')

@section('content')

    
    <div class="box">
        <div class="box-header">
            <h3>Sve pod kategorije <a href="{{ route($route.'.create') }}" class="btn btn-primary">Dodaj pod kategoriju</a></h3>
            <div class="box-tools">
                <a href="#" class="btn btn-warning btn-positions">Spremi pozicije</a>
            </div>
        </div>
        <!-- /.box-header -->
        <div class="box-body">
            <table id="main_table" class="display responsive table table-striped" cellspacing="0" width="100%">
                <thead>
                <tr>
                    <th>R.br.</th>
                    <th>Naslov</th>
                    <th>Kategorija</th>
                    <th style="width: 150px;">Slika</th>
                    <th style="width: 180px;"></th>
                </tr>
                </thead>
                <tbody>
                                @foreach($tableModel as $item)
                    <tr data-id="{{ $item->id }}">
                        <td class="post-position">{{ $count }}</td>
                        <td>{{ $item->title }}</td>
                        <td>{{ $item->category->title ?? '' }}</td>
                        <td>
                            @if($item->file_name)
                                <div class="image-container">
                                    <img src="/storage/ec/images/thumb/{{ $item->file_name }}">
                                </div>
                            @endif
                        </td>
                        <td class="datatable-controls">
                            <a href="{{ route($route.'.edit', $item->id) }}"><i class="fa fa-edit"></i></a>
                            {{ Form::open(['route' => [$route.'.destroy', $item->id], 'method' => 'delete', 'class'=>'table-controls-button']) }}
                            <button type="submit" class="strip-button" onclick="return confirm('@lang('common.confirm')')"><i class="fa fa-remove"></i></button>
                            {{ Form::close() }}
                        </td>
                    </tr>
                                    @endforeach

                </tbody>

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

@stop

@section('js')

    <script>
        $(document).ready(function() {
            $('tbody').sortable();
            var body = $('body');


            body.on('click', '.btn-positions', function (e) {
                e.preventDefault();

                var data = [], index = 1, row;

                $.each($('tbody tr'), function (key, value) {
                    row = {
                        id : $(this).attr('data-id'),
                        position : key
                    };
                    data[$(this).attr('data-id')] = key;
                });

                console.log('click', data);

                $.ajax({
                    url : '/api/e-commerce/sub-category-positions',
                    method : 'POST',
                    data : {
                        positions : data
                    }
                })
                    .done(function(data){
                        window.display_msg_box(data.msg, true)
                    })
                    .fail(function(data){
                        window.display_msg_box('Greška', false)
                    });
            })
        })
    </script>
@stop