{% extends 'base.html.twig' %}
{% block body_id 'supports' %}
{% block body_class 'bg-1' %}
{% block title %}
	{{ "Supports"|trans }}
{% endblock %}

{% block stylesheets %}
	{{ parent() }}
	<link rel="stylesheet" href="{{ asset('static/c4rg0_themes/assets/css/buttonstyle_modal.css') }}">

{% endblock %}

{% block body %}

	<div id="content" class="col-md-12" style="margin-top: 40px">
		<div class="main">
			<div class="row">

				<div class="col-md-12">
					<section
						class="tile transparent" id="id-search-block" style="margin-top: 55px;">
						<!-- tile widget -->
						<div class="tile-widget color transparent-black rounded-top-corners">
							<div class="block-menu-filter menu-start">
								<div class="btn-group btn-w100" style="padding-right: 20px; width: unset; display: inline-block;">
									<a href="{{ path('managment_pannel_page') }}">
										<h1>
											<i class="fa fa-briefcase"></i>
											{{ 'Management'|trans }}
										</h1>
									</a>
								</div>

							</div>
							<div class="block-menu-filter menu-center">
								<div class="btn-group btn-w100"></div>
							</div>
							<div class="block-menu-filter menu-end">
								<div class="btn-group">
									<a class="on-close-btn" href="javascript:window.history.back();" title="Back">
										<div class="user-close">
											<i class="fas fa-chevron-circle-left"></i>
										</div>
									</a>
								</div>
							</div>
						</div>

					</section>
				</div>
				<div class="col-md-12">
					<section
						class="tile transparent" id="id-search-block" style="margin-top: 55px;">
						<!-- tile widget -->


						<div class="tile-widget color transparent-black rounded-top-corners">
							<div class="block-menu-filter menu-start">
								<div class="btn-group btn-w100">
									<a class="supportadd-btn" href="{{ path('supports_create', {'op':'new'}) }}" title="{{ 'Add support'|trans }}">
										<div class="support-add">
											<i class="fas fa-plus-circle"></i>
										</div>
									</a>
								</div>
							</div>

						</div>

					</section>
				</div>

				<div class="col-md-12">
					<section class="tile color transparent-white">


						<div id="users-tab" class="pallet-list tab-pane fade in">

							<ul class="search-results files all-pallet-list">
								{% for pallet in palletlist %}
									{%  if pallet.bc == "CUSTOM00000001" %}
										{% else %}

											<li id="id-pallet-dlg-li-{{ pallet.id }}" data-pallet-id="{{ pallet.id }}" data-pos="{{ loop.index }}" class="search-result" data-pallet-description="{{ pallet.description }}" data-pallet-bc="{{ pallet.bc }}" data-pallet-h="{{ pallet.h }}" data-pallet-p="{{ pallet.p }}">
												<div class="media cover">
													<a href="#" class="pull-left" style="vertical-align: middle;">
														{% if pallet.immagini|length > 0 %}
															<img src="{{ asset('static/c4rg0_themes/assets/images/pallets/' ~ pallet.immagini|first) }}" alt="{{ pallet.nome }}" width="130">
														{% else %}
															<img src="{{ asset('static/images/no-images.png') }}" alt="{{ pallet.nome }}" width="130">
														{% endif %}
													</a>
													<div class="media-body">
														<input type="hidden" class="form-control input-height">
														<input
														type="hidden" class="form-control input-weight">
														<!--  RIGA  2 LOOP PALLET -->
														<div
															class="row">
															<!-- col 12 -->
															<div
																class="col-md-4">
																<!--  RIGA 2 / 1^ Blocco  SIGLA & BARCODE PALLET -->
																<section class="tile color transparent">
																	<div class="media-body" align="left">
																		{% if pallet.pdf|length > 0 %}
																			<h2>
																				<a href="{{ asset('static/c4rg0_themes/assets/images/pallets/' ~ pallet.pdf|first) }}" target="_blank">{{ pallet.nome }}</a>
																			</h2>
																			<h4>
																				<a href="{{ asset('static/c4rg0_themes/assets/images/pallets/' ~ pallet.pdf|first) }}" target="_blank">{{ pallet.bc }}</a>
																				{% for pdf in pallet.pdf %}
																					<a href="{{ asset('static/c4rg0_themes/assets/images/pallets/' ~ pdf) }}" class="pull-left info-pallet-bc-pdf" target="_blank">
																						<i class="fas fa-file-pdf"></i>
																					</a>
																				{% endfor %}
																			</h4>
																		{% else %}
																			<h2>{{ pallet.nome }}&nbsp;</h2>
																			<h4>{{ pallet.bc }}&nbsp;</h4>
																		{% endif %}

																	</div>
																</section>
															</div>
															<div
																class="col-md-5">
																<!--  RIGA 2 / 2^ Blocco  DESCRIZIONE E DIMENSIONI PALLET-->
																<section class="tile color transparent pallet-info">
																	<div class="media-body" align="left">
																		<h2>{{ pallet.label }}</h2>
																		<h4>
																			<i class="fas fa-weight-hanging"></i>&nbsp;
																			{{ 'Kg'|trans }}
																			{{ pallet.pkg }}
																			&nbsp; | &nbsp;&nbsp;
																			{{ pallet.l_cm }}
																			x
																			{{ pallet.w_cm }}
																			- H
																			{{ pallet.h_cm }}{{ '[cm]'|trans }}</h4>
																	</div>
																</section>
															</div>
															<div
																class="col-md-3 op-depallet">
																<!--  RIGA 2 / 3^ Blocco  BTN DEPALLET-->
																<section
																	class="text-center">
																	<!-- tile header -->
																	<div class="tile-header">
																		<a href="{{ path('supports_update', {'op':'edit', 'id': pallet.id}) }}">
																			<span class="text-info glyphicon glyphicon-pencil" style="font-size: 28px"></span>
																			<span class="sr-only">Edit</span>
																		</a>
																		<a href="{{ path('supports_update', {'op':'del', 'id': pallet.id}) }}" >
																			<span class="text-danger glyphicon glyphicon-trash" style="font-size: 28px"></span>
																			<span class="sr-only">Delete</span>
																		</a>
																		<span class="docck">
																			<input type="checkbox" data-id="{{ pallet.id }}" id="select-support-{{ pallet.id }}" {% if pallet.aziende|length > 0 %} checked="checked" {% endif %}/>
																			<label for="select-support-{{ pallet.id }}" class="check-box"></label>
																		</span>

																	</div>
																</section>
															</div>
														</div>
													</div>
												</div>
											</li>

									{% endif %}
								{% endfor %}

							</ul>
						</div>
					</section>
				</div>
			</div>
		</div>
	</div>


{% endblock %}

{% block javascripts %}
	{{ parent() }}
	<script>
		$(document).ready(function () {
$('.pallet-list').on('click', 'input[type="checkbox"]', function () {
var stato = ($(this).is(":checked")) ? 1 : 0;
var id = $(this).data("id");

$.ajax({
type: "POST",
url: "{{ path('api_assign_pallet') }}",
data: {
"id": id,
"stato": stato
}
}).done(function (v) {}).fail(function (err) {}).always(function () {});
});
});
	</script>
{% endblock %}