{% extends('index.html') %}

{% block css %}
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/list.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/pages/workers.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/user.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/nametag.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/user_add.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/work_alt.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/home.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/timer.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/shopping_cart.css">
<link type="text/css" rel="stylesheet" data-reinitializer-once="true" href="/css/icons/search.css">
{% endblock %}

{% block body %}
<section id="workers" class="panel medium list">
	<form id="actions" class="row menu separated" onsubmit="return false">
		<label for="actions">
			{% if account.type == 'administrator' or account.type == 'operator' or account.type == 'market' %}
			<button class="grass dense" onclick="workers.create()">Создать</button>
			{% endif %}
		</label>
	</form>
	<form id="filters" class="row menu stretched" onsubmit="return false">
		<label for="filters">
			<button class="{{ active ?? 'earth' }}" onclick="workers.filter('active', null, this); workers.reinit()" {% if
				active=='sand' %}title="... и активные" {% elseif active=='river' %}title="... или активные" {% endif
				%}>Активный</button>
			<button class="{{ inactive ?? 'earth' }}" onclick="workers.filter('inactive', null, this); workers.reinit()" {% if
				inactive=='sand' %}title="... и неактивные" {% elseif inactive=='river' %}title="... или неактивные" {% endif
				%}>Неактивный</button>
			<button class="{{ fined ?? 'earth' }} separated" onclick="workers.filter('fined', null, this); workers.reinit()" {% if
				fined=='sand' %}title="... и имеющие штрафы" {% elseif fined=='river' %}title="... или имеющие штрафы" {% endif
				%}>Штраф</button>
			<button class="{{ decent ?? 'earth' }}" onclick="workers.filter('decent', null, this); workers.reinit()" {% if
				decent=='sand' %}title="... и не имеющие штрафы" {% elseif decent=='river' %}title="... или не имеющие штрафы"
				{% endif %}>Нет штрафов</button>
			<button class="{{ hided ?? 'earth' }}" onclick="workers.filter('hided', null, this); workers.reinit()" {% if
				hided=='sand' %}title="... и скрытые" {% elseif hided=='river' %}title="... или скрытые" {% endif
				%}>Скрыт</button>
			<button class="{{ fired ?? 'earth' }}" onclick="workers.filter('fired', null, this); workers.reinit()" {% if
				fired=='sand' %}title="... и уволенные" {% elseif fired=='river' %}title="... или уволенные" {% endif
				%}>Уволен</button>
		</label>
	</form>
	<search class="row menu wide stretched"">
		<label class="solid">
			<i class="icon search"></i>
			<input id="search" type="search" name="search" class="snow merged right" 
			onkeydown="if (event.keyCode === 13) this.nextElementSibling.click()" value="{{ cookies.workers_filter_search ?? buffer.workers.filters.search }}"
				placeholder="Глобальный поиск по сотрудникам" />
			<button class="sea merged left" onclick="workers.search(this.previousElementSibling, this)">Поиск</button>
		</label>
	</search>
	<div id="title" class="row unselectable">
		<span data-column="account" class="button" title="Аккаунт"><i class="icon bold nametag"></i></span>
		<span data-column="worker" class="button" title="Сотрудник"><i class="icon bold user"></i></span>
		<span data-column="name" class="button">ФИО</span>
		<span data-column="number" class="button">Номер</span>
		<span data-column="work" class="button">Работа</span>
		<span data-column="address" class="button">Адрес</span>
		<span data-column="passport" class="button">Паспорт</span>
		<span data-column="tax" class="button">ИНН</span>
		<span data-column="requisites" class="button">Реквизиты</span>
		<span data-column="commentary" class="button">Комментарий</span>
	</div>
</section>
<script data-reinitializer-once="true">
	if (typeof window.workers_main_initialized === 'undefined') {
	  // Не выполнялся скрипт

	  document.addEventListener('workers.initialized', (e) => {
      // Инициализированы сотрудники

			// Инициализация допустимой страницы для выполнения
			e.detail.workers.page = 'workers';

			// Инициализация страниц
			e.detail.workers.init();

			// Блокировка от повторного выполнения
			window.workers_main_initialized = true;
		});
	}
</script>
<script data-reinitializer-once="true">
	if (typeof window.workers_scroll_initialized === 'undefined') {
	  // Не выполнялся скрипт

		window.onscroll = function(e) {
			// Инициализация чтения новых задач при достижения конца страницы

			if (core.page === 'workers') {
				// Инициализирована требуемая для выполнения страница

				if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) workers.read();
			}
		};

		// Блокировка от повторного выполнения
		window.workers_scroll_initialized = true;
	}
</script>
{% endblock %}

{% block js %}
<script type="text/javascript" data-reinitializer-once="true" src="/js/imask-7.1.0-alpha.js" defer></script>
<script type="text/javascript" src="/js/workers.js" defer></script>
{% endblock %}
