@extends('layouts.app')
@section('content')

    <script type="text/javascript">
        $(document).ready(function(){
            $('#btn-document').click(function(){
                var document = $('#document').val();
                var number = $('#number').val();
                $('#m_document').val(document);
                $('#m_number').val(number);
                $('.confirm-text').text('Da li ste sigurni da želite grupno da dodate uređaje?');
            });
        });
    </script>

    <section class="panel">
        <div class="panel-heading">
            <h2 class="panel-title">{{__("Group entry")}}</h2>
        </div>
        <div class="panel-body">
            <div class="form-group">
                <div class="col-md-2">
                    <p>{{__("Serials in session")}}:</p>
                </div>
                <div class="col-md-8">
                    @if($serials)
                        <p class="highlight">
                            @foreach($serials as $br=>$serial)
                                @if(count($serials)-1 == $br)
                                    {{$serial.'. '}}
                                @else
                                    {{$serial.', '}}
                                @endif
                            @endforeach
                        </p>
                    @endif
                </div>
                <div class="col-sm-2">
                    <a href="{{route('clear_device_session')}}"><button type="button" class="btn btn-sm btn-danger"
                                                                 data-toggle="tooltip" data-placement="top"
                                                                 data-original-title="{{__('Clear session')}}"><i class="fa fa-fire"></i></button></a>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">{{__("Document")}}: </label>
                <div class="col-sm-4">
                    <select class="form-control populate status-select"  name="document" id="document">
                        <option value="">-- {{__("Document")}} --</option>
                        @foreach($documents as $doc)
                            <option value="{{$doc}}">{{$doc}}</option>
                        @endforeach
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-2 control-label">{{__("Number")}}: </label>
                <div class="col-sm-4">
                    <input type="text" name="number" id="number" class="form-control">
                </div>
                <div class="col-sm-2">
                    <a href="#confirmModal" class="modal-basic" id="btn-document" param="status"><button type="button" class="btn btn-primary"><i class="fa fa-plus"></i></button></a>
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-6">
                    <p><small>*{{__("Serials are added to session via filters. Click on the cloud icon after applying filters. After that, serials will be visible on this page")}}.</small></p>
                </div>
            </div>
        </div>

    </section>

    <div id="confirmModal" class="modal-block modal-header-color modal-block-warning mfp-hide">
        <form name="groupActionForm" method="post" action="{{route('add_devices_to_document')}}">
            <input type="hidden" name="m_document" id="m_document">
            <input type="hidden" name="m_number" id="m_number">
            @csrf
            <section class="panel">
                <header class="panel-heading">
                    <h2 class="panel-title">{{__("Warning")}}!</h2>
                </header>
                <div class="panel-body">
                    <div class="modal-wrapper">
                        <div class="modal-icon">
                            <i class="fa fa-exclamation"></i>
                        </div>
                        <div class="modal-text">
                            <h4>{{__("Group entry")}}!</h4>
                            <p class="confirm-text"></p>
                        </div>
                    </div>
                </div>
                <footer class="panel-footer">
                    <div class="row">
                        <div class="col-md-12 text-right">
                            <button class="btn btn-warning" type="submit">{{__("YES")}}</button>
                            <button class="btn btn-default modal-dismiss">{{__('NO')}}</button>
                        </div>
                    </div>
                </footer>
            </section>
        </form>
    </div>

@endsection