@extends('layouts.app')

@section('content')
    <div class="col-lg-12">

        <div class="row">
                    <div class="col-sm-12">
                        <a href="{{route('generalsettings.templatecategorycreate')}}" class="btn btn-rounded btn-info pull-right">{{translate('Add New Template Category')}}</a>
                    </div>
                   
                </div>

                <br>


        <div class="panel">
            <div class="panel-heading">
                <h3 class="panel-title">{{translate('Template Category Settings')}}</h3>
            </div>

            <!--Horizontal Form-->
            <!--===================================================-->
           
            	
                <div class="panel-body">
                        <table class="table table-striped table-bordered demo-dt-basic" cellspacing="0" width="100%">
                            <thead>
                                <tr>
                                    <th>#</th>
                                    <th>{{translate('Template Category Name')}}</th>
                                    <th>{{translate('Published')}}</th>
                                    <th>{{translate('Sorting')}}</th>
                                    <th width="10%">{{translate('Options')}}</th>
                                </tr>
                            </thead>
                            <tbody>
                           
                                @foreach($homebanner as $key => $banner)
                                    <tr>
                                        <td>{{$key+1}}</td>
                                        <td>{{$banner->name}}</td>
                                        
                                        <td><label class="switch">
                                            <input onchange="update_banner_published(this)" value="{{ $banner->id }}" type="checkbox"  >
                                            <span class="slider round"></span></label></td>
                                        <td>
                                           
                                            <select class="mySelect form-control" onchange="update_multiplesorting_category($(this), this, 'Multipleslider', {{ $banner->id }})">
                                            <option value="">Select</option>
                                                                                        </select>
                                            
                                        </td>    
                                        <td>
                                            <div class="btn-group dropdown">
                                                <button class="btn btn-primary dropdown-toggle dropdown-toggle-icon" data-toggle="dropdown" type="button">
                                                    {{translate('Actions')}} <i class="dropdown-caret"></i>
                                                </button>
                                                <ul class="dropdown-menu dropdown-menu-right">
                                                    <li><a href="{{route('generalsettings.admin_tempcategory_edit', encrypt($banner->id))}}">{{translate('Edit')}}</a></li>
                                                    <li><a href="{{route('generalsettings.template_sorting', encrypt($banner->id))}}">{{translate('Template Sorting')}}</a></li>
                                                    <!-- <li><a onclick="edit_home_banner_1({{ $banner->id }})">{{translate('Edit')}}</a></li> -->
                                                    <!-- <li><a onclick="confirm_modal('{{route('home_banners.destroy', $banner->id)}}');">{{translate('Delete')}}</a></li> -->
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>
                        </table>

                    </div>
                
            
            <!--===================================================-->
            <!--End Horizontal Form-->

        </div>
    </div>

@endsection

@section('script')
<script type="text/javascript">
    function update_banner_published(el){
        if(el.checked){
            var status = 1;
        }
        else{
            var status = 0;
        }
        $.post('{{ route('generalsettings.update_categorystatus') }}', {_token:'{{ csrf_token() }}', id:el.value, status:status}, function(data){
            if(data == 1){
                showAlert('success', 'Status updated successfully');
                location.reload();
            }
            else{
                showAlert('danger', 'Something went wrong');
                location.reload();
            }
        });
    }

    function update_multiplesorting_category($obj, tl, md, el){
        // alert(md);
        $.post('{{ route('generalsettings.temcategorysorting') }}', {_token:'{{ csrf_token() }}', id:el, model:md, sort:tl.value }, function(data){
            // alert(data);
            if(data == 1){
                showAlert('success', 'Updated successfully');
                location.reload();
            }
            else{
                showAlert('danger', 'Something went wrong');
                location.reload();
            }
        });
    }

    // $('.mySelect').change(function () {
    //     var indexOfSelect = $(this).find('option:selected');
    //     $(this).find('option').removeAttr('disabled');
    //     // indexOfSelect.attr('disabled','disabled');
    //     indexOfSelect.prop('disabled', 'false');
    // });

</script>
<!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> -->
@endsection