203 lines
19 KiB
HTML
203 lines
19 KiB
HTML
{% load i18n %}
|
||
<div id="hr-hiring-modal" role="dialog" aria-modal="true" aria-labelledby="hr-hiring-modal-title"
|
||
style="display:none; position:fixed; inset:0; z-index:80; background:rgba(0,0,0,0.4); align-items:flex-start; justify-content:center; padding:1.5rem 1rem; overflow-y:auto;"
|
||
onclick="if(event.target===this) hrHiringClose()">
|
||
<div style="background:var(--color-card); border-radius:0.75rem; border:1px solid var(--color-border); box-shadow:0 20px 60px rgb(0 0 0/0.2); width:100%; max-width:36rem; margin:auto;">
|
||
<form id="hr-hiring-form" novalidate hx-post="/hiring/" hx-target="#main-content" hx-indicator="#loader, find .btn-label-loading" hx-disabled-elt="find button[type=submit]">
|
||
{% csrf_token %}
|
||
<div style="padding:1rem 1.25rem; border-bottom:1px solid var(--color-border); display:flex; align-items:flex-start; justify-content:space-between; gap:0.75rem;">
|
||
<div>
|
||
<div id="hr-hiring-modal-title" style="font-size:1rem; font-weight:600; color:var(--color-foreground);">{% trans "Новая заявка на найм" %}</div>
|
||
<p style="font-size:0.75rem; color:var(--color-muted-foreground); margin-top:0.25rem;">{% trans "Интерн-учётка и заявка IT на время испытания. Персональный аккаунт — после утверждения." %}</p>
|
||
<p style="font-size:0.75rem; margin-top:0.25rem; {% if intern_slots_free %}color:hsl(152 45% 32%);{% else %}color:hsl(0 55% 40%); font-weight:600;{% endif %}">
|
||
{% blocktrans with free=intern_slots_free total=intern_slots_total %}Свободных интерн-слотов: {{ free }} из {{ total }}{% endblocktrans %}
|
||
</p>
|
||
</div>
|
||
<button type="button" class="btn btn-ghost btn-icon" onclick="hrHiringClose()" aria-label="{% trans 'Закрыть' %}">
|
||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></svg>
|
||
</button>
|
||
</div>
|
||
|
||
<div style="display:flex; gap:0.5rem; padding:0.875rem 1.25rem 0;">
|
||
<button type="button" class="hr-hire-step-btn" data-step="1" onclick="hrHiringGo(1)" style="flex:1; border:none; background:transparent; cursor:pointer; padding:0;">
|
||
<div class="hr-hire-step-num" data-step="1" style="width:1.5rem; height:1.5rem; border-radius:999px; margin:0 auto 0.25rem; display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:600;">1</div>
|
||
<div style="font-size:0.75rem; color:var(--color-muted-foreground);">{% trans "Место" %}</div>
|
||
</button>
|
||
<button type="button" class="hr-hire-step-btn" data-step="2" onclick="hrHiringGo(2)" style="flex:1; border:none; background:transparent; cursor:pointer; padding:0;">
|
||
<div class="hr-hire-step-num" data-step="2" style="width:1.5rem; height:1.5rem; border-radius:999px; margin:0 auto 0.25rem; display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:600;">2</div>
|
||
<div style="font-size:0.75rem; color:var(--color-muted-foreground);">{% trans "Кандидат" %}</div>
|
||
</button>
|
||
<button type="button" class="hr-hire-step-btn" data-step="3" onclick="hrHiringGo(3)" style="flex:1; border:none; background:transparent; cursor:pointer; padding:0;">
|
||
<div class="hr-hire-step-num" data-step="3" style="width:1.5rem; height:1.5rem; border-radius:999px; margin:0 auto 0.25rem; display:flex; align-items:center; justify-content:center; font-size:0.75rem; font-weight:600;">3</div>
|
||
<div style="font-size:0.75rem; color:var(--color-muted-foreground);">{% trans "Доступы" %}</div>
|
||
</button>
|
||
</div>
|
||
|
||
<div id="hr-hire-step-error" style="display:none; margin:0.75rem 1.25rem 0; padding:0.5rem 0.75rem; border-radius:0.5rem; background:hsl(0 70% 96%); border:1px solid hsl(0 70% 85%); color:hsl(0 55% 35%); font-size:0.8125rem;"></div>
|
||
{% if hiring_form_errors %}
|
||
<div style="margin:0.75rem 1.25rem 0; padding:0.5rem 0.75rem; border-radius:0.5rem; background:hsl(0 70% 96%); border:1px solid hsl(0 70% 85%); color:hsl(0 55% 35%); font-size:0.8125rem;">
|
||
<div style="font-weight:600; margin-bottom:0.25rem;">{% trans "Не удалось создать заявку" %}</div>
|
||
<ul style="margin:0; padding-left:1.1rem;">
|
||
{% for field, messages in hiring_form_errors.items %}
|
||
{% for msg in messages %}<li>{{ msg }}</li>{% endfor %}
|
||
{% endfor %}
|
||
</ul>
|
||
</div>
|
||
{% endif %}
|
||
|
||
<div style="padding:1.25rem; display:flex; flex-direction:column; gap:0.75rem; min-height:14rem;">
|
||
<div class="hr-hire-step" data-step="2" style="display:none;">
|
||
<div style="display:grid; grid-template-columns:1fr 1fr; gap:0.75rem;">
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Фамилия " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<input type="text" name="last_name" class="input" style="width:100%;" autocomplete="family-name">
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Имя " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<input type="text" name="first_name" class="input" style="width:100%;" autocomplete="given-name">
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Отчество" %}</label>
|
||
<input type="text" name="middle_name" class="input" style="width:100%;">
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "ИНН " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<input type="text" name="inn_code" inputmode="numeric" maxlength="10" autocomplete="off"
|
||
class="input" style="width:100%;" placeholder="0000000000">
|
||
<p style="font-size:0.75rem; color:var(--color-muted-foreground); margin-top:0.25rem;">{% trans "10 цифр. Нужен фоторегистратору." %}</p>
|
||
</div>
|
||
<div style="display:grid; grid-template-columns:1fr 1fr; gap:0.75rem;">
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Email кандидата" %}</label>
|
||
<input type="email" name="candidate_email" class="input" style="width:100%;">
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Телефон" %}</label>
|
||
<input type="tel" name="candidate_phone" class="input js-phone" inputmode="tel" autocomplete="tel" placeholder="+380 (__) ___-__-__" style="width:100%;">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hr-hire-step" data-step="1">
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Оформление " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<div style="display:flex; gap:0.25rem; background:var(--color-muted); border-radius:var(--radius); padding:0.25rem;">
|
||
<label style="flex:1; display:flex; align-items:center; justify-content:center; gap:0.375rem; padding:0.375rem 0.5rem; border-radius:calc(var(--radius) - 2px); font-size:0.8125rem; cursor:pointer; background:var(--color-card); box-shadow:0 1px 2px rgb(0 0 0/0.08);">
|
||
<input type="radio" name="employment_type" value="staff" checked style="accent-color:var(--color-primary);">
|
||
{% trans "Официально" %}
|
||
</label>
|
||
<label style="flex:1; display:flex; align-items:center; justify-content:center; gap:0.375rem; padding:0.375rem 0.5rem; border-radius:calc(var(--radius) - 2px); font-size:0.8125rem; cursor:pointer;">
|
||
<input type="radio" name="employment_type" value="contract" style="accent-color:var(--color-primary);">
|
||
{% trans "По договору" %}
|
||
</label>
|
||
</div>
|
||
<p style="font-size:0.75rem; color:var(--color-muted-foreground); margin-top:0.25rem;">{% trans "Трудовой договор в штате или гражданско-правовой (ЦПХ)." %}</p>
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Тип локации " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<select name="user_location_type" id="hr-hiring-loc-type" class="input" style="width:100%;" onchange="hrHiringLocToggle(this.value)">
|
||
<option value="">{% trans "Выберите..." %}</option>
|
||
<option value="office">{% trans "Офис" %}</option>
|
||
<option value="pharmacy" selected>{% trans "Аптека" %}</option>
|
||
<option value="warehouse">{% trans "Склад" %}</option>
|
||
</select>
|
||
</div>
|
||
<div id="hr-hiring-department-field" style="display:none;">
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Отдел " %}<span class="hr-req-office" style="color:var(--color-destructive); display:none;">*</span></label>
|
||
<div class="hr-dept-picker" style="position:relative;">
|
||
<input type="hidden" name="department_id" id="hr-hiring-department-select" value="">
|
||
<button type="button" onclick="hrHiringDeptPickerToggle(event)" class="input"
|
||
style="display:flex; align-items:center; justify-content:space-between; gap:0.5rem; font-size:0.8125rem; padding:0.3rem 0.75rem; height:auto; width:100%; cursor:pointer; text-align:left;">
|
||
<span id="hr-hiring-dept-picker-label" data-empty-label="{% trans 'Выберите отдел' %}" style="overflow:hidden; text-overflow:ellipsis; white-space:nowrap;">{% trans "Выберите отдел" %}</span>
|
||
<svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="flex-shrink:0; color:var(--color-muted-foreground);"><path d="m6 9 6 6 6-6"/></svg>
|
||
</button>
|
||
<div id="hr-hiring-dept-picker-panel" style="display:none; position:absolute; top:calc(100% + 0.25rem); left:0; right:0; z-index:40; background:var(--color-card); border:1px solid var(--color-border); border-radius:0.625rem; box-shadow:0 4px 16px rgb(0 0 0/0.12); max-height:16rem; overflow-y:auto; padding:0.375rem;"></div>
|
||
</div>
|
||
</div>
|
||
<div id="hr-hiring-pharmacy-field">
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Аптека " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<select name="pharmacy_id" id="hr-hiring-pharmacy-select" class="input" style="width:100%;">
|
||
<option value="">—</option>
|
||
{% for pharmacy in hr_pharmacies %}
|
||
<option value="{{ pharmacy.id }}">{% trans "Аптека" %} №{{ pharmacy.pharmacy_number }} — {{ pharmacy.address }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div id="hr-hiring-location-field" style="display:none;">
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Офис / склад " %}<span style="color:var(--color-destructive);">*</span></label>
|
||
<select name="location_id" id="hr-hiring-location-select" class="input" style="width:100%;">
|
||
<option value="">—</option>
|
||
{% for loc in hr_locations %}
|
||
<option value="{{ loc.id }}" data-type="{{ loc.location_type }}">{{ loc.get_location_type_display }} — {{ loc.address|default:loc }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Должность" %}</label>
|
||
<select name="post_id" id="hr-hiring-post-select" class="input" style="width:100%;">
|
||
<option value="">—</option>
|
||
{% for post in hr_posts %}
|
||
<option value="{{ post.id }}">{{ post.name }}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
<div style="display:grid; grid-template-columns:1fr 1fr; gap:0.75rem;">
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Дата выхода" %}</label>
|
||
<input type="date" name="hire_date" value="{{ today|date:'Y-m-d' }}" class="input" style="width:100%;">
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Срок испытания" %}</label>
|
||
<select name="trial_days" class="input" style="width:100%;">
|
||
{% for n in hr_trial_days_choices %}
|
||
<option value="{{ n }}" {% if n == 3 %}selected{% endif %}>{{ n }} {% trans "дн." %}</option>
|
||
{% endfor %}
|
||
</select>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="hr-hire-step" data-step="3" style="display:none;">
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Требуются доступы" %}</label>
|
||
<p style="font-size:0.75rem; color:var(--color-muted-foreground); margin:0 0 0.5rem;">{% trans "IT подготовит рабочее место. Список зависит от типа локации." %}</p>
|
||
{{ hr_access_location_types|json_script:"hr-access-loc-types-data" }}
|
||
<div id="hr-hiring-access-list" style="display:flex; flex-wrap:wrap; gap:0.5rem 1.25rem;">
|
||
{% for access in hr_access_systems %}
|
||
<label class="hr-access-option" data-access-id="{{ access.id }}"
|
||
style="display:flex; align-items:center; gap:0.375rem; font-size:0.8125rem; color:var(--color-foreground); cursor:pointer;">
|
||
<input type="checkbox" name="requested_access" value="{{ access.id }}">
|
||
{{ access.name }}
|
||
</label>
|
||
{% endfor %}
|
||
</div>
|
||
</div>
|
||
<div>
|
||
<label style="display:block; font-size:0.8125rem; font-weight:500; margin-bottom:0.375rem;">{% trans "Примечание по доступам" %}</label>
|
||
<textarea name="access_note" placeholder="{% trans "Например: 1С Бухгалтерия — только просмотр" %}"
|
||
style="width:100%; min-height:4rem; resize:vertical; background:var(--color-card); border:1px solid var(--color-input); border-radius:var(--radius); padding:0.4375rem 0.75rem; font-size:0.875rem; color:var(--color-foreground); font-family:var(--font-sans); outline:none; box-sizing:border-box;"></textarea>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div style="padding:0.875rem 1.25rem; border-top:1px solid var(--color-border); display:flex; justify-content:space-between; gap:0.5rem;">
|
||
<button type="button" id="hr-hire-back" class="btn btn-secondary" style="border:1px solid var(--color-border);" onclick="hrHiringGo(hrHireStep - 1)">{% trans "Назад" %}</button>
|
||
<div style="display:flex; gap:0.5rem;">
|
||
<button type="button" class="btn btn-secondary" style="border:1px solid var(--color-border);" onclick="hrHiringClose()">{% trans "Отмена" %}</button>
|
||
<button type="button" id="hr-hire-next" class="btn btn-primary" onclick="hrHiringNext()">{% trans "Далее" %}</button>
|
||
<button type="submit" id="hr-hire-submit" class="btn btn-primary" style="display:none;" {% if not intern_slots_free %}disabled{% endif %}>
|
||
{% trans "Создать заявку" %}
|
||
<span class="btn-label-loading htmx-indicator">{% trans "Создание…" %}</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<style>
|
||
.hr-hire-step-num { background: var(--color-muted); color: var(--color-muted-foreground); }
|
||
.hr-hire-step-num.is-active { background: var(--color-primary); color: #fff; }
|
||
.hr-hire-step-num.is-done { background: hsl(152 45% 90%); color: hsl(152 45% 28%); }
|
||
</style>
|