@extends('layout.index', [
	'title' => __('application.title'),
	'subtitle' => __('application.list'),
	'breadcrumb' => [
	]
])

@include('load.form.select2')
@include('load.form.toggle')


@section('content')

	<nav>
		<div class="nav nav-tabs">
			<a href="#dashboard" data-toggle="tab" class="nav-item nav-link" role="tab" aria-controls="dashboard" aria-selected="true">
				{{ __('dashboard') }}
			</a>
			<a href="#list" data-toggle="tab" class="nav-item nav-link active" role="tab" aria-controls="list" aria-selected="false">
				{{ __('list') }}
			</a>
		</div>
	</nav>

	<div class="tab-content mb-0">

		<div class="tab-pane fade" id="dashboard">
			@component('components.card')
				@include('admin.Core.App.Application.partials.dashboard')
			@endcomponent
		</div>

		<div class="tab-pane fade  show active" id="list">
			@component('components.card')
				@include('components.datatable', ['route' => route('Admin.Core.App.Application.index'), 'model' => 'applications', 'with_filters' => true, 'with_exports' => true, 'callback' => 'handleApplication();'])
			@endcomponent

			@component('components.layout.modal-filters', ['title' => 'Filters', 'id' => 'modal-applications-filters'])
				@include('admin.Core.App.Application.partials.filters', ['model' => 'applications'])
			@endcomponent
		</div>

	</div>

@endsection

@push('js')
	<script>
		function handleApplication() {
			initToggle("{{ route('Admin.Core.App.Application.toggleActive') }}");
		}

		$(document).ready(function () {
			initSelect2();
		});
	</script>
@endpush
