@extends('layouts.main', ['title' => 'Inventory Items | ' . config('app.name')])
@section('navigation')
	<ul class="breadcrumb">
		<li><a href="{{route('home')}}">Dashboard</a> <span class="divider">/</span></li>
		<li class="active">Inventory Items</li>
	</ul>
@stop
@section('title')
	Inventory Items
@endsection
{{--@section('msghead_menu')--}}
	{{----}}
{{--@endsection--}}
@section('contentinner')

	@include('errors.errors-list')

	@include('stores.inventories.items.includes.tabs')


    <div id="item_filters" class="sidenav">
        <a href="javascript:void(0)" class="closebtn"
           onclick="closeAdvancedSearch('item_filters')">&times;</a>

        <form target="_blank" class="form-inline form-filter" method="get"
              action="#">

            <label class="control-label" for="item_name">Name</label>
            <select name="select" width="100%" id="item_id" class="searchable">
                <option value="">All</option>
                @foreach($items as $item)
                    <option value="{{$item->id}}">{{$item->name}}</option>
                @endforeach
            </select>

            <label class="control-label" for="item_type">Type</label>
            <select name="select" width="100%" id="item_type" class="searchable">
                <option value="">All</option>
                <option value="TEMPLATED">TEMPLATED</option>
                <option value="VARIANTS">VARRIANTS</option>
            </select>

       <label class="control-label" for="item_type">Template</label>
            <select name="select" width="100%" id="template_id" class="searchable">
                <option value="" selected>All</option>
                 @foreach($item_templates as $item_template)
                    <option value="{{$item_template->id}}">{{$item_template->name}}</option>
                @endforeach
            </select>

            <label class="control-label" for="item_group">Group</label>
            <select name="select" width="100%" id="item_group_id" class="searchable">
                <option value="">All</option>
                @foreach($groups as $group)
                    <option value="{{$group->id}}">{{$group->name}}</option>
                @endforeach
            </select>
            <button class="btn" style="margin-top: 5px" id="filter_items">FILTER</button>
        </form>
    </div>



	<li class="right btn-group" style="float: right; margin: 10px; margin-top: -10px">
		<div class="btn-group">
            <button class="btn" onclick="openAdvancedSearch('item_filters')" style="margin-right: 5px">
                <i class="icon-search"></i> &nbsp; FILTER
            </button>

		@if(auth()->user()->can('MODIFY ITEMS'))

			<button onclick="create('{{ route("inventories_managements.items_masters.items.create") }}')" class="btn">
				<i class="icon-th"></i> &nbsp;CREATE ITEM
			</button>

			<button style="margin-left: 5px" onclick="create('{{ route("item_replacement_create") }}')" class="btn">
                ITEM REPLACEMENT
			</button>
		@endif

		</div><!--btn-group-->
	</li>

	<!-- Main Table -->
	<div class="row-fluid">
		<div class="span12">
			<table class="table table-bordered table-condensed" id="main_table">
				<thead>

				<tr>
					<th style="width: 10%" class="head1">Item-Code:</th>
					<th class="head1">Item:</th>
					<th class="head1">Group :</th>
					<th class="head1">unit :</th>
					<th style="width: 60px"></th>
				</tr>

				</thead>
			</table>
		</div><!--span12-->
	</div><!--row-fluid-->


	<script>

        jQuery('.searchable').select2();

		var oTable = jQuery('#main_table').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({
                "searching": false,
				"oLanguage": {
					"sLoadingRecords": startSpinner(),
					"sZeroRecords": "No store records to display.",
					"sProcessing": "Please wait - loading records...",
					"sInfoEmpty": "No entries to display."
				},
				"initComplete": function (settings, json) {
					stopSpinner();
				},
				ajax: {
					url: '{{ route("inventories_managements.items_masters.datatable") }}',
					data: function (d) {
                        d.item_id = $('#item_id').val();
                        d.item_type = $('#item_type').val();
                        d.item_group_id = $('#item_group_id').val();
                        d.template_id = $('#template_id').val();

                    }
				},
				scrollCollapse: true,
				"sPaginationType": "full_numbers",
				processing: true,
				serverSide: true,
				"order":[[1,'asc']],
                "lengthMenu": [50, 100, 500, 1000, 3000, 5000],
				"columns": [
					{"class": "link", data: 'id'},
					{"class": "link", data: 'name'},
					{"class": "link", data: 'item_group'},
					{"class": "link", data: 'unit_of_measurement'},
					{"class": "link", data: 'action'}
				],
				"bStateSave": true
			});

        $('#filter_items').on('click', function (e) {
            e.preventDefault();
            oTable.draw();
        });

	</script>

@stop