{% extends "main/layout.html" %}
{% load humanize %}
{% block content %}
<div class="breadcrumb-holder">
	<div class="container-fluid">
		<ul class="breadcrumb">
			<li class="breadcrumb-item"><a href="{% url 'cont-list' %}">LISTA KONTRATU</a></li>
			<li class="breadcrumb-item active">{{ legend|upper }}</li>
		</ul>
	</div>
</div>
<div class="container-fluid"><br/>
	<div class="row">
		<div class="col-sm-12">
			<div class="card shadow-lg border-info rounded">
				<div class="card-header border-primary">
					<center>
						<h4 class="mb-0">{{legend|upper}}</h4>
					</center>
				</div>
				<div class="card-body">
					<table class="table table-sm table-striped table-bordered " id="example2" width="100%" cellspacing="0">
						<thead>
                            <tr>
                                <th colspan="5" class="text-center">INFORMASAUN CONTRATO</th>
                            </tr>
							<tr>
								<th>Naran</th>
								<th>Tipu Kontratu</th>
								<th>Pojisaun</th>
								<th>Data Hahu</th>
								<th>Data Remata</th>
							</tr>
						</thead>
						<tbody>
							<tr>
								<td>{{ contract.employee }}</td>
								<td>{{ contract.contract_type }}</td>
								<td>{% if contract.position %}{{ contract.position }}{% else %}{{ contract.category }}{% endif %}</td>
								<td>{{contract.start_date|date:"d-m-Y"}}</td>
								<td>
									{% if contract.end_date %}
									  {{contract.end_date|date:"d-m-Y"}}
									{% else %}
										<span class="badge bg-success text-white"> <i class="fa fa-triangle-exclamation"></i> Undeterminable</span>
									{% endif %}
								</td>
							</tr>
						</tbody>
					</table>
                    <br>
                    <hr class="border-primary">
                        <a href="{% url 'tor-add' contract.hashed employee.hashed %}" class="btn btn-sm btn-success mb-2">Kria ToR <i class="fa fa-plus"></i></a>
                    {% if checktor  %}
                        <a href="{% url 'tor-lock' contract.hashed employee.hashed %}" class="btn btn-sm btn-danger mb-2">Chave <i class="fa fa-lock"></i></a>              
                    {% endif %}
					<table class="table table-sm table-striped table-bordered " id="example2" width="100%" cellspacing="0">
						<thead>
							<tr>
								<th>Nu.</th>
								<th>ToR</th>
								<th class="text-center">#</th>
							</tr>
						</thead>
						<tbody>
                            {% if tor %}
                              
                            {% for obj in tor  %}
                            <tr>
                                <td>{{ forloop.counter }}</td>
                                <td>{{ obj.tor }}</td>
                                <td align="center">
                                    {% if obj.is_lock == False %}                                  
                                        <a href="{% url 'tor-update' contract.hashed employee.hashed obj.hashed %}" class="btn btn-sm btn-success"><i class="fa fa-pen-to-square"></i></a>
                                        <a href="{% url 'tor-delete' contract.hashed employee.hashed obj.hashed %}" class="btn btn-sm btn-danger"><i class="fa fa-trash"></i></a>
                                    {% else %}
                                        <span class="text-white badge bg-success">Chave Ona <i class="fa fa-check"></i></span>
                                    {% endif %}
                                </td>
                            </tr>
                            {% endfor %}
                            {% else %}
                            <tr align="center">
                                <td colspan="3">
                                    <span class="text-danger">
                                        <i>ToR Seidauk Kria  <i class="fa fa-warning"></i> </i>
                                    </span>
                                </td>
                            </tr>
                            {% endif %}
						</tbody>
					</table>
				</div> <!--end card-body-->
			</div> <!--end card-->
		</div> <!--end col-->
	</div> <!--end row-->
</div>
{% endblock %}
{% block scripts %}
	<script type="text/javascript">
		$(document).ready(function() {
			$('#example').DataTable();
		} );
	</script>
{% endblock %}