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

<div class="row mt-3">
	<div class="col-12">
		<div class="card card-primary card-outline card-outline-tabs">
			<div class="card-header p-0 border-bottom-0">
				
				<ul class="card-title nav nav-tabs ml-auto" role="tablist">
					<li class="nav-item">
						<a href="#characteristics" class="nav-link active" data-toggle="tab" aria-expanded="true">
							Caractéristiques
						</a>
					</li>
					<li class="nav-item">
						<a href="#prices" class="nav-link" data-toggle="tab" aria-expanded="true">
							Tarifs
							@if(isset($prices_count))<span class="badge">{{ $prices_count }}</span>@endif
						</a>
					</li>
					<li class="nav-item">
						<a href="#shipping" class="nav-link" data-toggle="tab" aria-expanded="true">
							Livraison
							@if(isset($shipping_count))<span class="badge">{{ $shipping_count }}</span>@endif
						</a>
					</li>
					<li class="nav-item">
						<a href="#stock" class="nav-link" data-toggle="tab" aria-expanded="true">
							Stock
							@if(isset($stock_count))<span class="badge">{{ $stock_count }}</span>@endif
						</a>
					</li>
					<li class="nav-item">
						<a href="#seo" class="nav-link" data-toggle="tab" aria-expanded="true">
							Référencement
						</a>
					</li>
				</ul>

				<div class="card-tools">
					Actif
					<input type="checkbox" name="active" class="active-checkbox" data-toggle="toggle" data-size="mini" data-width="50" data-height="25" data-onstyle="success" data-offstyle="danger">
				</div>

			</div>

			<div class="card-body">
				<div class="tab-content">
					<div class="tab-pane active" id="characteristics">
						@include('Shop.Admin.Articles.partials.characteristics')
					</div>

					<div class="tab-pane" id="prices">
						@include('Shop.Admin.Articles.partials.prices', ['prices' => $prices['prices'] ?? null])
						@include('Shop.Admin.Articles.partials.generic_prices', ['generics' => $prices['generics'] ?? null])
					</div>

					<div class="tab-pane" id="shipping">
						@include('Shop.Admin.Articles.partials.shipping')
					</div>

					<div class="tab-pane" id="stock">
						@include('Shop.Admin.Articles.partials.stock')
					</div>

					<div class="tab-pane" id="seo">
						@include('Shop.Admin.Articles.partials.seo')
					</div>
				</div>

			</div>

		</div>
	</div>
</div>


@include('components.save')

@push('js')
<script>
	$(function() {

		$('.select2').select2({ width: '100%' });
		$('.editor').tinymce({});

		$('.active-checkbox').bootstrapToggle();
		$('.active-checkbox').off('change').on('change', function(e) {
			var id = $('#id').val();
			// handleAdmin.toggle(id, $(this).prop('checked'));
		});

	});
</script>
@endpush