@extends('layouts.app')

@section('link')
    <link href="{{ asset('css/theme.default.css') }}" rel="stylesheet">
@endsection

@section('content')
<div class="row">
    <div class="col-xs-12 col-sm-12 col-md-12">
        <div class="panel panel-default">

            <div class="panel-heading">
                <h3 class="panel-title">{{__('texte.price_lists_arr.objects.objects')}}</h3>
                <div class="pull-right">
                    <button class="btn btn-primary back-btn" onclick="window.history.back()">{{__('texte.price_lists_arr.objects.price_lists')}}</button>
                </div>
            </div>

            <div class="panel-body">
                <form method="POST" action="{{route('price_lists.store_objects',$price_list->id)}}" role="form" class="form form-horizontal">
                    {{ csrf_field() }}

                    <fieldset>
                        <div class="form-group row">
                            <label for="type" class="col-sm-2 col-form-label">{{__('texte.price_lists_arr.objects.type')}}</label>
                            <div class="col-sm-8">
                                <select class="form-control" id="type" name="type">
                                    <option value="0">--- {{__('texte.price_lists_arr.objects.type')}} ---</option>
                                    @foreach ($types as $type)
                                        <option value="{{ $type->id }}" {{(old('type') == $type->id) ? "selected" : ""}}>{{ $type->name }}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="subtype" class="col-sm-2 col-form-label">{{__('texte.price_lists_arr.objects.subtype')}}</label>
                            <div class="col-sm-8">
                                <select class="form-control" id="subtype" name="subtype" disabled>
                                    <option value="0">--- {{__('texte.price_lists_arr.objects.subtype')}} ---</option>
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="client" class="col-sm-2 col-form-label">{{__('texte.price_lists_arr.objects.client')}}</label>
                            <div class="col-sm-8">
                                <select class="form-control" id="client" name="client">
                                    <option value="0">--- {{__('texte.price_lists_arr.objects.client')}} ---</option>
                                    @foreach ($clients as $client)
                                            <option value="{{ $client->id }}" {{(old('client') == $client->id) ? "selected" : ""}}>{{ $client->company_name!='' ? $client->company_name : $client->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>

                        <div class="form-group row">
                            <label for="object" class="col-sm-2 col-form-label">{{__('texte.price_lists_arr.objects.object')}}</label>
                            <div class="col-sm-8">
                                <select class="form-control" id="object" name="object">
                                    <option value="0">--- {{__('texte.price_lists_arr.objects.object')}} ---</option>
                                    @foreach ($objects as $object)
                                        <option value="{{ $object->id }}" {{(old('object') == $object->id) ? "selected" : ""}} data-price_list_id="{{$price_list->id}}" data-price_list_priority="{{$object->price_list_priority}}">{{ $object->name}}</option>
                                    @endforeach
                                </select>
                            </div>
                        </div>
                        
                        <div class="form-group row">
                            <div class="col-sm-12" style='text-align: center;'>
                                <button type="button" id="get_selected_objects" class="btn btn-success">{{__('texte.price_lists_arr.objects.show_selected')}}</button>
                                <button type="submit" class="btn btn-primary">{{__('texte.price_lists_arr.objects.add')}}</button>
                            </div>
                        </div>

                        <div class="form-group">
                            <label for="selected_objects_table" class="control-label col-xs-2 col-sm-2 col-md-2">{{__('texte.price_lists_arr.objects.selected_objects')}}</label>
                            <div class="input-group col-xs-8 col-sm-8 col-md-8">
                                <table class="table table-bordered table-hover table-stripped" id="selected_objects_table">
                                    <thead>
                                        <tr>
                                            <th>{{__('texte.price_lists_arr.objects.object')}}</th>
                                            <th>{{__('texte.price_lists_arr.objects.price_list')}}</th>
                                            <th>{{__('texte.price_lists_arr.objects.exclude')}}</th>
                                        </tr>
                                    </thead>
                                    <tbody>
                                        @if($price_list_objects)
                                            @foreach($price_list_objects as $price_list_object)
                                            <tr>
                                                <td>{{$price_list_object->name}}</td>
                                                <td>{{$price_list_object->price_list->title ?? ''}}</td>
                                                <td>
                                                    <input type='hidden' class="selected_objects" name='selected_objects_array[]' value='{{$price_list_object->id}}'/> 
                                                    <button type='button' class='btn btn-danger remove_object'><i class='glyphicon glyphicon-trash'></i></button>
                                                </td>
                                            </tr>
                                            @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </fieldset>                       
                </form>
            </div>
        </div>
    </div>
</div>

<script src="{{ asset('js/select2.min.js') }}"></script>
<script src="{{ asset('js/jquery.tablesorter.min.js') }}"></script>

<script type="text/javascript" charset="utf-8">
    $('#client,#object,#type,#subtype').select2();
            
    $('#selected_objects_table').tablesorter();
    
    $('#type').on('change',function(){
        if($(this).val()!=''){
            var type = $(this).val();
            $.ajax({
                headers: {
                        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                        },
                        url: '/get_subtypes',
                        type: 'POST',
                        async: false,
                data: { 'type' : type},
                success: function(response){
                            var options='<option value=""> --- Подтип --- </option>';
                            $('#subtype').find('option').remove().end();
                            if(response.length>0){
                                for (var i in response){
                                       options += '<option value="' + response[i].id + '">' + response[i].name + '</option>';
                                }
                                $('#subtype').attr('disabled',false);
                            }
                            else{
                                 $('#subtype').attr('disabled',true);
                            }
                            $('#subtype').html(options);
                            $('#subtype').trigger("updated");
                        }
            });
        }
        else{
            $('#subtype').attr('disabled',true);
            var options='<option value=""> --- Подтип --- </option>';
            $('#subtype').html(options);
            $('#subtype').trigger("updated");            
        }
    });
    
    $('#type,#subtype,#client').on('change', function(){
        var type = $('#type').val();;
        var subtype = $('#subtype').val();
        var client = $('#client').val();
        
        $('#selected_objects_table tbody tr').remove();
        
        $.ajax({
            headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url: '/get_filtered_objects',
            type: 'POST',
            data: { 'type' : type,
                    'subtype' : subtype,
                    'client' : client,
                    'with_price_lists' : 1},
            success: function(response){
                        var options='<option value="0"> --- Обект --- </option>';
                        $('#object').find('option').remove().end();
                        if(response.length>0){
                             for (var i in response){
                                   options += '<option value="' + response[i].id + '" name="'+ response[i].name + '" data-price_list="'+ response[i].title + '" data-price_list_priority="'+ response[i].price_list_priority + '">' + response[i].name + '</option>';
                             }
                             $(':button[type="submit"]').prop('disabled', false);
                        }
                        else{
                            alert('Не са намерени обекти по зададените критерии !');
                            $(':button[type="submit"]').prop('disabled', true);
                        }
                        $('#object').html(options);
                        $('#object').trigger("updated");
                    }
        });

    });
    
    $('#get_selected_objects').on('click', function(){        
        var selected_options;
        if($('#object').val()!=='0'){            
            selected_options = $('#object option:selected');
            
        }
        else{
            selected_options = $('#object option');
        }
        selected_options.each(function(){
            if($(this).val()!='0' && !$('.selected_objects[value="'+$(this).val()+'"]').length){
                $('#selected_objects_table tbody').append("<tr><td>"+$(this).text()+"</td><td>"+($(this).attr('data-price_list')!=='undefined' ? $(this).attr('data-price_list') : '')+"</td><td><input type='hidden' class='selected_objects' name='selected_objects_array[]' value='"+$(this).val()+"'/> <button type='button' class='btn btn-danger remove_object'><i class='glyphicon glyphicon-trash'></i></button></td></tr>") 
            }
        });
        $('#selected_objects_table').trigger("update").trigger("sorton",[ [[2,1],[0,0]] ]);
    });
    
    
    $(document).on('click','.remove_object',function(){
        $(this).closest('tr').remove();
    })
  
</script>
@endsection