{% extends 'base.html.twig' %}

{% block body %}

	<nav class="breadcrumb bg-white push">
		<span class="breadcrumb-item active">{{ 'Início'|trans }}</span>
	</nav>
    <div class="row js-appear-enabled animated fadeIn" data-toggle="appear">
        <div class="col-6 col-xl-3">
            <a class="block block-rounded block-bordered block-link-shadow" style="background-color:{{cor_espera}}" href="{{url('transporte_em_espera')}}">
                <div class="block-content block-content-full clearfix">
                    <div class="font-size-h3 font-w600 text-white">{{transportes_espera|length}}</div>
                    <div class="font-size-sm font-w600 text-uppercase text-white"> {{ 'Transp. Em Espera'|trans }}</div>
                </div>
            </a>
        </div>
        <div class="col-6 col-xl-3">
            <a class="block block-rounded block-bordered block-link-shadow" style="background-color:{{cor_transito}}" href="{{url('transporte_em_curso')}}">
                <div class="block-content block-content-full clearfix">
                    <div class="font-size-h3 font-w600 text-white">{{transportes_transito|length}}</div>
                    <div class="font-size-sm font-w600 text-uppercase text-white">{{ 'Transp. Em Trânsito'|trans }}</div>
                </div>
            </a>
        </div>
        <div class="col-6 col-xl-3">
            <a class="block block-rounded block-bordered block-link-shadow" style="background-color:{{cor_concluido}}" href="{{url('transporte_efetuados')}}">
                <div class="block-content block-content-full clearfix">
                    <div class="font-size-h3 font-w600 js-count-to-enabled text-white">{{transportes_concluidos|length}}</div>
                    <div class="font-size-sm font-w600 text-uppercase text-white">{{ 'Transp. Concluídos'|trans }}</div>
                </div>
            </a>
        </div>
        <div class="col-6 col-xl-3">
            <a class="block block-rounded block-bordered block-link-shadow" style="background-color:{{cor_cancelado}}" href="{{url('transporte_cancelados')}}">
                <div class="block-content block-content-full clearfix">
                    <div class="font-size-h3 font-w600 js-count-to-enabled text-white">{{transportes_cancelados|length}}</div>
                    <div class="font-size-sm font-w600 text-uppercase text-white">{{ 'Transp. Cancelados'|trans }}</div>
                </div>
            </a>
        </div>
    </div>
    
    <div class="block">
        <div class="block-header block-header-default">
            <h3 class="block-title">{{ 'Próximas Entregas'|trans }}</h3>
        </div>
        <div class="block-content block-content-full">
            <div class="dataTables_wrapper dt-bootstrap4 no-footer">
                <div class="row">
                    <div class="col-sm-12 table-responsive">
                        <table id="t_transportes" class="table table-bordered table-striped table-vcenter" role="grid" aria-describedby="DataTables_Table_1_info">
							<thead style="background-color:#ff9800;color:white;">
								<tr>
									<th>ID</th>
									<th></th>
									<th>{{ 'Ordem'|trans }}</th>
									<th>{{ 'Matrícula'|trans }}</th>
									<th>{{ 'Data de Descarga'|trans }}</th>
									<th>{{ 'Local de Carga'|trans }}</th>
									<th>{{ 'Local de Descarga'|trans }}</th>
									<th>{{ 'Fornecedor'|trans }}</th>
									<th>{{ 'Cliente'|trans }}</th>
									<th>{{ 'Opções'|trans }}</th>
								</tr>
							</thead>
							<tbody>
							{% for transporte in transportes_transito %}
								<tr>
									<td>{{ transporte.id }}</td>
									<td>
										<svg height="20" width="20">
											<circle cx="10" cy="10" r="8" fill="{{cor_transito}}" />
										</svg> 
									</td> 
									<td>{{ transporte.ordem }}</td>
									<td>{{ transporte.matricula.matricula }}</td>
									<td>{{ transporte.dataPrevista|date("Y-m-d H:i")}}</td>
            						<td>
            						{{ transporte.localCarga }}
            						{% if transporte.localCarga2 %}
            							<br>{{ transporte.localCarga2 }}
            						{% endif %}
            						</td>
            						<td>
            						{{ transporte.localDescarga }}
            						{% if transporte.localDescarga2 %}
            							<br>{{ transporte.localDescarga2 }}
            						{% endif %}
            						</td>
									<td><a class="text-muted" href="{{ path('fornecedor_show', {'token': transporte.fornecedor.token}) }}">{{ transporte.fornecedor.nome }}</a></td>
									<td><a class="text-muted" href="{{ path('cliente_show', {'token': transporte.cliente.token}) }}">{{ transporte.cliente.nome }}</a></td> 
									<td>
										<div class="btn-group" role="group" aria-label="btnGroup2"> 
											<a type="button" class="btn btn-sm btn-secondary" href="{{ path('transporte_show', {'token': transporte.token}) }}">{{ 'Abrir'|trans }}</a>						
										</div>
									</td>									
								</tr>
							{% endfor %}
							</tbody>
						</table>					
                    </div>
                </div>
            </div>
        </div>
    </div>
    
	{% if feed %}
    <div class="block">
        <div class="block-header block-header-default">
            <h3 class="block-title">{{ 'Atividades'|trans }}</h3>
        </div>
        <div class="block-content block-content-full">
            <div class="dataTables_wrapper dt-bootstrap4 no-footer">
                <div class="row">
                    <div class="col-sm-12 table-responsive">
                        <table id="t_feed" class="table table-bordered table-striped table-vcenter" role="grid" aria-describedby="DataTables_Table_1_info">
							<thead style="background-color:#ff9800;color:white;">
								<tr>
									<th>{{ 'Dia'|trans }}</th>
									<th>{{ 'Atividade'|trans }}</th>
								</tr>
							</thead>
							<tbody>
							{% for atividade in feed %}

								<tr>
									<td>{{ atividade.dia|date("Y-m-d H:i")}}</td>
									<td>
										<a class="text-primary" href="{{ path('funcionario_show', {'token': atividade.funcionario.token}) }}">{{ atividade.funcionario.nome }}</a> 
										{{atividade.atividade.nome|trans}}
										{% if atividade.transporte %}
											<a class="text-primary" href="{{ path('transporte_show', {'token': atividade.transporte.token}) }}">{{ atividade.transporte.ordem }}</a> 
										{% elseif atividade.cliente %}
											<a class="text-primary" href="{{ path('cliente_show', {'token': atividade.cliente.token}) }}">{{ atividade.cliente.nome }}</a>
										{% elseif atividade.fornecedor %}
											<a class="text-primary" href="{{ path('fornecedor_show', {'token': atividade.fornecedor.token}) }}">{{ atividade.fornecedor.nome }}</a>
										{% endif %}
									</td>								
								</tr>
							{% endfor %}
							</tbody>
						</table>					
                    </div>
                </div>
            </div>
        </div>
    </div>
	{% endif %}
{% endblock %}

{% block javascripts %}
<script>
$(document).ready(function() {	
	var table = $('#t_transportes').DataTable( {
		"language": {
            "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/{{'Linguagem'|trans}}.json"
        },
        "order": [[ 4, "asc" ]],
		"columns": [
			null,
			null,
			null,
			null,
			{ "width": "12%" },
			null,
			null,
			{ "width": "10%" },
			{ "width": "10%" },
			null,
		],
		pageLength: 5,
		"bLengthChange": false,
    });
	var table = $('#t_feed').DataTable( {
		"language": {
            "url": "//cdn.datatables.net/plug-ins/9dcbecd42ad/i18n/{{'Linguagem'|trans}}.json"
        },
        "order": [[ 0, "desc" ]]
    });
} );
</script>
{% endblock %}

{% block stylesheets %}
{% endblock %}