@extends('layouts.app')

<!-- Scripts -->
<!-- Main Content -->
@section('content')
<!-- Your Settings Dashboard -->
<!-- Main content -->
    <div class="row">
        @include('proedge.admin.adminPanel')
        <div class="col-md-12">
            <div class="panel panel-success panel-border">
                <div class="panel-heading">
                    <h3 class="panel-title">
                        <i class="livicon" data-name="doc-portrait" data-size="16" data-loop="true" data-c="#fff" data-hc="#fff"></i> Selections
                    </h3>
                    <span class="pull-right">
                        <i class="glyphicon glyphicon-chevron-up showhide clickable"></i>
                        <i class="glyphicon glyphicon-remove removepanel clickable"></i>
                    </span>
                </div>
                <div class="panel-body">
                    <div>
                        <span class="col-md-11">
                            Selection Types are used to define details about the contract. Selections indicated with * are inactive.
                        </span>
                        <div class="col-md-1">
                            <a><i class="livicon" data-name="info" data-size="35" data-loop="true" data-c="#fc3" data-hc="#fc3"></i></a>
                        </div>
                    </div>
                    <div class="selections">
                        <div data-node="1" class="col-md-2 form-horizontal scrollbar node node1" style="border: solid black 1px; height: 600px;">
                            <form action="{{route('admin.selections.add')}}" class="ajaxSubmit" id="node_1">
                                <label class="control-label">Primary Feature</label>
                                <input type="text" name="Name" class="form-control">
                                <input type="text" name="NodeNum" value="1" hidden>
                                <button type="submit" class="form-control submit_add" id="submit_1">ADD</button>
                            </form>
                            <div class="content">
                                @foreach($selections as $selection)
                                    <div style='margin-top: 5px;'>
                                        <a class="pointer" onclick="sendModalAjax('{{route('admin.selection.get')}}',{id: '{{$selection->id}}'},'selection_edit')"><i class='glyphicon glyphicon-edit' style='color: blue;'></i></a>
                                        <a class='selection pointer {{($selection->IsActive == 0)? "disabled":''}}' data-id="{{$selection->id}}">{{$selection->Name}}</a>
                                    </div>
                                @endforeach
                            </div>
                        </div>
                        <div data-node="2" class="col-md-2 form-horizontal scrollbar node node2" style="border: solid black 1px; height: 600px;">
                            <form action="{{route('admin.selections.add')}}" id="node_2" class="ajaxSubmit" hidden>
                                <label class="control-label" id="node_2">Primary Feature</label>
                                <input type="text" name="Name" class="form-control">
                                <input type="text" name="NodeNum" value="2" hidden>
                                <input type="text" name="ParentNum" hidden>
                                <button type="submit" class="form-control submit_add" id="submit_2">ADD</button>
                            </form>
                            <div class="content"></div>
                        </div>
                        <div data-node="3" class="col-md-2 form-horizontal scrollbar node node3" style="border: solid black 1px; height: 600px;" id="node_3">
                            <form action="{{route('admin.selections.add')}}" id="node_3" class="ajaxSubmit" hidden>
                                <label class="control-label" id="node_3">Primary Feature</label>
                                <input type="text" name="Name" class="form-control">
                                <input type="text" name="NodeNum" value="3" hidden>
                                <input type="text" name="ParentNum" hidden>
                                <button type="submit" class="form-control submit_add" id="submit_3">ADD</button>
                            </form>
                            <div class="content"></div>
                        </div>
                        <div data-node="4" class="col-md-2 form-horizontal scrollbar node node4" style="border: solid black 1px; height: 600px;" id="node_4">
                            <form action="{{route('admin.selections.add')}}" id="node_4" class="ajaxSubmit" hidden>
                                <label class="control-label" id="node_4">Primary Feature</label>
                                <input type="text" name="Name" class="form-control">
                                <input type="text" name="NodeNum" value="4" hidden>
                                <input type="text" name="ParentNum" hidden>
                                <button type="submit" class="form-control submit_add" id="submit_4">ADD</button>
                            </form>
                            <div class="content"></div>
                        </div>
                        <div data-node="5" class="col-md-2 form-horizontal scrollbar node node5" style="border: solid black 1px; height: 600px;" id="node_5">
                            <form action="{{route('admin.selections.add')}}" id="node_5" class="ajaxSubmit" hidden>
                                <label class="control-label" id="node_5">Primary Feature</label>
                                <input type="text" name="Name" class="form-control">
                                <input type="text" name="NodeNum" value="5" hidden>
                                <input type="text" name="ParentNum" hidden>
                                <button type="submit" class="form-control submit_add" id="submit_5">ADD</button>
                            </form>
                            <div class="content"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            var selection = @json($json);
        </script>
        <div class="modals" id="selection_edit"></div>
    </div>
<script src="{{ asset('include-js/admin/selection/selection.js') }}" type="text/javascript"></script>
@endsection