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

@include('boilerplate::load.select2')

@section('content')

	<nav>
		<div class="nav nav-tabs">
			<a href="#families" data-toggle="tab" class="nav-item nav-link" role="tab" aria-controls="families" aria-selected="true">
				{{ __('Shop.article_attribute_families.title') }}
			</a>
			<a href="#values" data-toggle="tab" class="nav-item nav-link active" role="tab" aria-controls="values" aria-selected="false">
				{{ __('Shop.article_attribute_values.title') }}
			</a>
		</div>
	</nav>

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

		<div class="tab-pane fade" id="families">
			@component('components.card')
				@include('components.datatable', ['route' => route('Shop.Admin.ArticleAttributeFamilies.index'), 'model' => 'ArticleAttributeFamilies'])
			@endcomponent
		</div>

		<div class="tab-pane fade show active" id="values">
			@component('components.card')
				@include('components.datatable', ['route' => route('Shop.Admin.ArticleAttributeValues.index'), 'model' => 'ArticleAttributeValues'])
			@endcomponent

		</div>

	</div>

@endsection