@extends('layouts.main_without_top_button')
@section('title')
    Settings
@stop
@section('navigation')
    <ul class="breadcrumb">
        <li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
        <li><a href="">Settings</a> <span class="divider">/</span></li>
        <li><a href="{{route('settings.trucks.maintenance-category')}}">Truck Maintenance Categories</a> <span
                    class="divider">/</span></li>
        <li class="active">Inspection Parameters</li>
    </ul>
@stop
@section('inspection_parameters')
    current
@stop
@section('contentinner')
    <style type="text/css">
        input.invalid, textarea.invalid {
            border: 2px solid red;
        }

        input.valid, textarea.valid {
            border: 2px solid green;
        }
    </style>
    <div class="tabbable">
        <div class="tab-content">
            <div class="tab-pane active">
                <div class="row-fluid">
                    <div class="span12">

                        <div class="mediamgr">
                            <div class="mediamgr_left">
                                @include('settings.maintenance.trucks.includes.mediamgr_category_2')

                                <h4 class="widgettitle form-inline">
                                    <form method="POST" ACTION="{{ route('trucks.maintenance-parameter.store',['categories'=>$category->id]) }}">
                                        {{ csrf_field() }}
                                        <a href="javascript:;">Truck Inspection Parameters</a>
                                    <button type="submit"  class="add_category1 btn pull-right"><span class="icon-plus"></span> Add
                                        Parameter</button>
                                    <input value="{{$category->name}}" disabled>
                                    <input type="hidden" value="{{$category->id}}" id="category" name="category_id">
                                    <input type="text" required name="new_parameter" id="new_parameter" value=""
                                           placeholder="New Truck Parameter" class="span2"/>
                                        <select style="width: 20%" required name="question_type" id="question_type" class="searchable_select">
                                            <option value="&nbsp;">Select Question type</option>
                                            <option value="YES/NO">YES/NO</option>
                                            <option value="EXPLANATION">EXPLANATION</option>
                                            <option value="MULTIPLE CHOICE">MULTIPLE CHOICE</option>
                                        </select>
                                    </form>
                                </h4>
                                <table class="table table-striped" id="parameter_category_list">
                                    <colgroup>
                                        <col class="con0" style="align: center; width: 4%"/>
                                        <col class="con1"/>
                                        <col class="con0"/>
                                        <col class="con1"/>
                                        <col class="con0"/>
                                        <col class="con1"/>
                                    </colgroup>
                                    <thead>
                                    <tr>
                                        <th class="head0 nosort">S/N</th>
                                        <th class="head0">Parameter</th>
                                        <th class="head0">Category</th>
                                        <th class="head1" width="20">Action</th>
                                        {{--<th class="head1">Recent Location</th>--}}
                                    </tr>
                                    </thead>
                                </table>


                            </div><!--mediamgr_left -->

                        </div><!--mediamgr-->
                    </div><!--span12-->
                </div><!--row-fluid-->
            </div><!--row-fluid-->
        </div><!--row-fluid-->
    </div><!--tabbable-->

    <script>

        var oTable = jQuery('#parameter_category_list').on('error.dt', function (e, settings, techNote, message) {
            console.log('An error has been reported by DataTables: ', message);
            $.jGrowl("ERROR LOADING DATA!", {header: 'Important'});
            stopSpinner();
        })
            .DataTable({
                "oLanguage": {
                    "sLoadingRecords": startSpinner(),
                    "sZeroRecords": "No any oarameter records to display.",
                    "sProcessing": "Please wait - loading records...",
                    "sInfoEmpty": "No entries to display."
                },
                "initComplete": function (settings, json) {
                    stopSpinner();
                },
                ajax: {
                    url: '{{route('trucks.maintenance-parameter.datatble',['categories'=>$category->id])}}',
                    data: function (d) {}
                },
                scrollCollapse: true,
                "sPaginationType": "full_numbers",
                processing: true,
                serverSide: true,
                "order":[[0,'asc']],
                "columns": [

                    {"class": "link", data: 'id'},
                    {"class": "link", data: 'parameter'},
                    {"class": "link", data: 'category'},
                    {"class": "link", data: 'action'}
                ],
                "bStateSave": true
            });



    </script>

@stop