{% extends 'base.html' %}
{% load crispy_forms_tags %}
{% load static %}

{% block modals%}
<div class="modal" id="mo_get_info" tabindex="-1" role="dialog"></div>
<div class="modal" id="mo_edit_info" data-backdrop="static" tabindex="-1" role="dialog"></div>
<div class="modal" id="mo_edit_port" data-backdrop="static" tabindex="-1" role="dialog"></div>
{% endblock %}

{% block script %}
<script type="text/javascript">
function get_list() {
	var $list_get_list = $('#get_list');
	var get_search = document.getElementById("id_PSearch").value
	
	if (get_search.length >= 3) {
		$list_get_list.html('<h3> <i class="fas fa-spinner fa-pulse fa-fw"></i> Loading...</h3>');
		$.ajax({
			type : 'GET',
			url: '/user/api/get_list?get_search='+get_search,
			success: function(feeds) { 
				$list_get_list.html(feeds);
			}
		});
	}

	if (get_search.length == "") {
		$list_get_list.html('<h3> <i class="fas fa-spinner fa-pulse fa-fw"></i> Loading...</h3>');
		$.ajax({
			type : 'GET',
			url: '/user/api/get_list',
			success: function(feeds) {
				$list_get_list.html(feeds);
			}
		});
	}
};

function bt_get_info(id){
	$.ajax({
			type : 'GET',
			url: '/user/api/get/'+id,
			success: function(data) {
				$('#mo_get_info').html(data).modal('toggle');
			},
	});
};

function bt_edit_info(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/edit/'+id+'?get_search='+get_search,
			success: function(data) {
				$('#mo_edit_info').html(data).modal('toggle');
			},
	});
};

function bt_edit_app_info(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/app/edit/'+id+'?get_search='+get_search,
			success: function(data) {
				$('#mo_edit_info').html(data).modal('toggle');
			},
	});
};
function bt_app_remove(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/app/remove/'+id,
			success: function(data) {
				window.open("/user/liste?get_id="+data+"&get_search="+get_search, "_self" );
			},
	});
};
function bt_app_add(user_id){
	var get_search = document.getElementById("id_PSearch").value;
	var app_id = document.getElementById("id_GES_APPLink_APP").options[document.getElementById("id_GES_APPLink_APP").selectedIndex].value;
	$.ajax({
			type : 'GET',
			url: '/user/api/app/add/'+user_id+'/'+app_id,
			success: function(data) {
				window.open("/user/liste?get_id="+data+"&get_search="+get_search, "_self" );
			},
	});
}

function bt_switch_app_status(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/app/switch/'+id,
			success: function(data) {
				window.open("/user/liste?get_id="+data+"&get_search="+get_search, "_self" );
			},
	});
};

function bt_edit_complete(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/complete/'+id,
			success: function(data) {
				window.open("/user/liste?get_id="+data+"&get_search="+get_search, "_self" );
			},
	});
};

function bt_edit_close(id){
	var get_search = document.getElementById("id_PSearch").value
	$.ajax({
			type : 'GET',
			url: '/user/api/close/'+id,
			success: function(data) {
				window.open("/user/liste?get_id="+data+"&get_search="+get_search, "_self" );
			},
	});
};

function bt_send_edit(){
	document.getElementById("form_edit").submit();
};

function onloading() {
 	get_list();
	{% if page.item_id %}bt_get_info({{page.item_id}});{% endif %}
};

$(document).ready(function(){ onloading(); });


</script>
{% endblock %}

{% block main %}
<div class="card-body">
{% if not page.output or page.err %}
	{{page.p_contenu|safe}}
{% else %}
	{% if page.err %}{{page.err|safe}}{% endif %}
	{% if page.output and page.err %}<hr>{% endif %}
	{% if page.output %}{{page.output|safe|urlize}}{% endif %}
{% endif %}
</div>

<div id="get_list" style="user-select : text;"><h3><i class="fas fa-spinner fa-pulse fa-fw"></i> Loading...</h3></div>
{% endblock %}

{% block right_panel %}
<div class="card-body">
	<div id="div_id_PSearch" class="form-group">
		<label for="id_PSearch" class=" requiredField">Recherche d'un Utilisateur (min 3 caractères) </label>
		<div class=""><input type="text" name="PSearch" maxlength="128" class="textinput textInput form-control" required="" id="id_PSearch" oninput="get_list()" value="{{page.search}}"></div>
	</div>
	<p>{{page.p_right|safe}}</p>
	<p>Dernier matricule APTA : {{page.lastapta}}</p>
	<div class="d-grid gap-2 mb-2"><a class="btn btn-success" href="#" onclick="bt_edit_info(0)" role="button"><i class="fas fa-user-plus"></i> Ajouter un utilisateur</a></div>

	{% if planning_query %}
		<p>Agenda des comptes à crée :</p>
		<table class="table table-hover">
			<thead class="thead-dark">
				<tr>
					<th scope="col">&nbsp;</th>
					<th scope="col">Service</th>
					<th scope="col">Nom - Prénom</th>
					<th scope="col">Date d'arrivée</th>
				</tr>
			</thead>
			<tbody>
			{% for item in planning_query%}
			<tr>
				<td onmouseover="this.style.cursor='pointer';"><i class="fas fa-search-plus" onclick="bt_get_info({{item.id}})"></i></td>
				<td>{{item.GES_Service}}</td>
				<td>{{item.GES_Nom}} {{item.GES_Prenom}}</td>
				<td>{{item.GES_Date}}</td>
			</tr>
			{% endfor %}
			</tbody>
		</table>
	{% endif %}
	{% if planning_query_clos %}
	<p>Agenda des comptes à cloturé :</p>
	<table class="table table-hover">
		<thead class="thead-dark">
			<tr>
				<th scope="col">&nbsp;</th>
				<th scope="col">Service</th>
				<th scope="col">Nom - Prénom</th>
				<th scope="col">Date de départ</th>
			</tr>
		</thead>
		<tbody>
		{% for item in planning_query_clos%}
		<tr>
			<td onmouseover="this.style.cursor='pointer';"><i class="fas fa-search-plus" onclick="bt_get_info({{item.id}})"></i></td>
			<td>{{item.GES_Service}}</td>
			<td>{{item.GES_Nom}} {{item.GES_Prenom}}</td>
			<td>{{item.GES_Date}}</td>
		</tr>
		{% endfor %}
		</tbody>
	</table>
	{% endif %}

</div>
{% endblock %}