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

{% block body %}

	<nav class="breadcrumb bg-white push">
		<span class="breadcrumb-item active">Início</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</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</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</div>
                </div>
            </a>
        </div>
		{% if app.user.grupo.id < 3 %}
        <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</div>
                </div>
            </a>
        </div>
		{% endif %}
    </div>
    
    <div class="block">
        <div class="block-header block-header-default">
            <h3 class="block-title">PRÓXIMAS ENTREGAS</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</th>
									<th>Matrícula</th>
									<th>Data Descarga</th>
									<th>Local Carga</th>
									<th>Local Descarga</th>
									<th>Fornecedor</th>
									<th>Cliente</th>
									<th>Opções</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>
									{% if app.user.grupo.id == 4 %}
										<td>Encontro de Margens</td>
									{% else %}
										<td><a class="text-muted" href="{{ path('fornecedor_show', {'token': transporte.fornecedor.token}) }}">{{ transporte.fornecedor.nome }}</a></td>
									{% endif %}
									{% if app.user.grupo.id == 3 %}
										<td>Encontro de Margens</td>
									{% else %}
										<td><a class="text-muted" href="{{ path('cliente_show', {'token': transporte.cliente.token}) }}">{{ transporte.cliente.nome }}</a></td> 
									{% endif %}
									<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</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</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</th>
									<th>Atividade</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( {
        "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( {
        "order": [[ 0, "desc" ]]
    });
} );
</script>
{% endblock %}

{% block stylesheets %}
{% endblock %}