263 lines
18 KiB
HTML
263 lines
18 KiB
HTML
{% if not accounting_embed %}<div class="page-content" id="utilities-page"
|
|
{% if own_pharmacy_id %}data-own-pharmacy="{{ own_pharmacy_id }}"{% endif %}
|
|
data-meter-configs="{{ meter_configs_json|escape }}"
|
|
data-type-modes="{{ utility_type_modes_json|escape }}"
|
|
>{% else %}<div id="utilities-page"
|
|
{% if own_pharmacy_id %}data-own-pharmacy="{{ own_pharmacy_id }}"{% endif %}
|
|
data-meter-configs="{{ meter_configs_json|escape }}"
|
|
data-type-modes="{{ utility_type_modes_json|escape }}"
|
|
>{% endif %}
|
|
|
|
{% if not accounting_embed %}
|
|
<div style="margin-bottom:1.5rem;">
|
|
<h1 style="font-size:1.25rem; font-weight:500; color:var(--color-foreground);">Комунальні послуги</h1>
|
|
<p style="font-size:0.875rem; color:var(--color-muted-foreground); margin-top:0.25rem;">
|
|
{% if is_staff %}Показання лічильників доступних аптек{% else %}Показання лічильників доступних аптек{% endif %}
|
|
</p>
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if config_message %}
|
|
<div style="margin-bottom:1rem; padding:0.75rem 1rem; border-radius:0.5rem; border:1px solid hsl(152 40% 70%); background:color-mix(in srgb, var(--color-success) 12%, var(--color-card)); color:var(--color-foreground); font-size:0.875rem;">
|
|
{{ config_message }}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if pharmacies_for_form %}
|
|
<div style="background:var(--color-card); border:1px solid var(--color-border); border-radius:0.75rem; padding:1.25rem; margin-bottom:1.25rem;">
|
|
<h2 style="font-size:1rem; font-weight:600; color:var(--color-foreground); margin-bottom:0.875rem;">Налаштування лічильників</h2>
|
|
<p style="font-size:0.8125rem; color:var(--color-muted-foreground); margin-bottom:1rem;">
|
|
Для кожної аптеки можна вказати звичайний лічильник або режим «день / ніч» (наприклад, для електроенергії).
|
|
</p>
|
|
<form method="post" hx-post="/utilities/" hx-target="#main-content" hx-indicator="#loader" style="margin-bottom:1rem;">
|
|
{% csrf_token %}
|
|
<input type="hidden" name="form_kind" value="meter_config">
|
|
<div style="display:flex; align-items:flex-end; gap:0.75rem; flex-wrap:wrap;">
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Аптека</label>
|
|
<select name="config_pharmacy" class="input" style="min-width:14rem;" required>
|
|
<option value="">— оберіть —</option>
|
|
{% for p in all_pharmacies %}
|
|
<option value="{{ p.pk }}">{{ p.organization.name }} №{{ p.pharmacy_number }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Тип лічильника</label>
|
|
<select name="config_utility_type" class="input" required>
|
|
<option value="">— оберіть —</option>
|
|
{% for t in utility_types %}
|
|
<option value="{{ t.pk }}">{{ t.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Режим</label>
|
|
<select name="reading_mode" class="input" required>
|
|
{% for value, label in reading_mode_choices %}
|
|
<option value="{{ value }}">{{ label }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
<button type="submit" class="btn btn-secondary">Зберегти налаштування</button>
|
|
</div>
|
|
</form>
|
|
{% if meter_configs %}
|
|
<div style="overflow-x:auto;">
|
|
<table style="width:100%; border-collapse:collapse; font-size:0.8125rem;">
|
|
<thead>
|
|
<tr style="border-bottom:1px solid var(--color-border);">
|
|
<th style="padding:0.5rem 0.75rem; text-align:left; color:var(--color-muted-foreground);">Аптека</th>
|
|
<th style="padding:0.5rem 0.75rem; text-align:left; color:var(--color-muted-foreground);">Тип</th>
|
|
<th style="padding:0.5rem 0.75rem; text-align:left; color:var(--color-muted-foreground);">Режим</th>
|
|
<th style="width:2.5rem;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for cfg in meter_configs %}
|
|
<tr style="border-bottom:1px solid var(--color-border);">
|
|
<td style="padding:0.5rem 0.75rem;">{{ cfg.pharmacy.organization.name }} №{{ cfg.pharmacy.pharmacy_number }}</td>
|
|
<td style="padding:0.5rem 0.75rem;">{{ cfg.utility_type.name }}</td>
|
|
<td style="padding:0.5rem 0.75rem;">{{ cfg.get_reading_mode_display }}</td>
|
|
<td style="padding:0.5rem 0.75rem;">
|
|
<form method="post" hx-post="/utilities/meter-config/{{ cfg.pk }}/delete/" hx-target="#main-content" hx-indicator="#loader"
|
|
hx-confirm="Видалити налаштування?" style="margin:0;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn btn-ghost" style="padding:0.2rem 0.4rem; color:var(--color-destructive);">✕</button>
|
|
</form>
|
|
</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
{% endif %}
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if pharmacies_for_form %}
|
|
<div style="background:var(--color-card); border:1px solid var(--color-border); border-radius:0.75rem; padding:1.25rem; margin-bottom:1.25rem;">
|
|
<h2 style="font-size:1rem; font-weight:600; color:var(--color-foreground); margin-bottom:0.875rem;">Подати показання</h2>
|
|
|
|
{% if form_error %}
|
|
<div style="background:color-mix(in srgb, var(--color-destructive) 10%, transparent); color:var(--color-destructive); border-radius:0.5rem; padding:0.625rem 0.875rem; font-size:0.8125rem; margin-bottom:0.875rem;">{{ form_error }}</div>
|
|
{% endif %}
|
|
|
|
<form id="utilities-reading-form" method="post" hx-post="/utilities/" hx-target="#main-content" hx-indicator="#loader">
|
|
{% csrf_token %}
|
|
<div style="display:flex; align-items:flex-end; gap:0.75rem; flex-wrap:wrap;">
|
|
{% if pharmacies_for_form %}
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Аптека</label>
|
|
<select name="pharmacy" id="utilities-pharmacy-select" class="input" style="min-width:14rem;" required onchange="utilitiesFormModeUpdate()">
|
|
<option value="">— оберіть —</option>
|
|
{% for p in pharmacies_for_form %}
|
|
<option value="{{ p.pk }}">{{ p.organization.name }} №{{ p.pharmacy_number }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
{% else %}
|
|
<div style="font-size:0.8125rem; color:var(--color-muted-foreground);">
|
|
Аптека: <strong style="color:var(--color-foreground);">{{ own_pharmacy.organization.name }} №{{ own_pharmacy.pharmacy_number }}</strong>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Тип лічильника</label>
|
|
<select name="utility_type" id="utilities-type-select" class="input" required onchange="utilitiesFormModeUpdate()">
|
|
<option value="">— оберіть —</option>
|
|
{% for t in utility_types %}
|
|
<option value="{{ t.pk }}">{{ t.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</div>
|
|
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Дата</label>
|
|
<input type="date" name="reading_date" class="input" value="{% now 'Y-m-d' %}" required>
|
|
</div>
|
|
|
|
<div id="utilities-single-wrap">
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Показання</label>
|
|
<input type="number" name="value" step="0.01" min="0" class="input" style="width:9rem;">
|
|
</div>
|
|
|
|
<div id="utilities-daynight-wrap" style="display:none;">
|
|
<div style="display:flex; gap:0.5rem;">
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">День</label>
|
|
<input type="number" name="value_day" step="0.01" min="0" class="input" style="width:7rem;">
|
|
</div>
|
|
<div>
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Ніч</label>
|
|
<input type="number" name="value_night" step="0.01" min="0" class="input" style="width:7rem;">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="flex:1; min-width:12rem;">
|
|
<label style="display:block; font-size:0.75rem; color:var(--color-muted-foreground); margin-bottom:0.25rem;">Коментар</label>
|
|
<input type="text" name="comment" class="input" placeholder="необов'язково">
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary">Зберегти</button>
|
|
</div>
|
|
<p id="utilities-mode-hint" style="font-size:0.75rem; color:var(--color-muted-foreground); margin:0.75rem 0 0;"></p>
|
|
</form>
|
|
</div>
|
|
{% else %}
|
|
<div style="background:var(--color-card); border:1px solid var(--color-border); border-radius:0.75rem; padding:1.25rem; margin-bottom:1.25rem; font-size:0.8125rem; color:var(--color-muted-foreground);">
|
|
Подача показань доступна співробітникам аптек. Якщо ви працюєте в аптеці, а тут пусто — зверніться до HR: у вас не вказана аптека в профілі.
|
|
</div>
|
|
{% endif %}
|
|
|
|
{% if is_staff %}
|
|
<form method="get" hx-get="{{ accounting_base_url|default:'/utilities/' }}" hx-target="#main-content" hx-push-url="true" hx-indicator="#loader"
|
|
style="display:flex; align-items:center; gap:0.5rem; margin-bottom:1rem; flex-wrap:wrap;">
|
|
<select name="pharmacy" class="input" style="width:auto;" onchange="this.form.requestSubmit()">
|
|
<option value="">Всі аптеки</option>
|
|
{% for p in all_pharmacies %}
|
|
<option value="{{ p.pk }}" {% if filter_pharmacy == p.pk|stringformat:"s" %}selected{% endif %}>{{ p.organization.name }} №{{ p.pharmacy_number }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
<select name="utility_type" class="input" style="width:auto;" onchange="this.form.requestSubmit()">
|
|
<option value="">Всі типи</option>
|
|
{% for t in utility_types %}
|
|
<option value="{{ t.pk }}" {% if filter_type == t.pk|stringformat:"s" %}selected{% endif %}>{{ t.name }}</option>
|
|
{% endfor %}
|
|
</select>
|
|
</form>
|
|
{% endif %}
|
|
|
|
<div style="background:var(--color-card); border-radius:0.75rem; border:1px solid var(--color-border); box-shadow:0 1px 2px rgb(0 0 0/0.05);">
|
|
<div style="overflow-x:auto;">
|
|
<table style="width:100%; border-collapse:collapse; font-size:0.875rem;">
|
|
<thead>
|
|
<tr style="border-bottom:1px solid var(--color-border);">
|
|
{% if pharmacies_for_form %}<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Аптека</th>{% endif %}
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Тип</th>
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Дата</th>
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Показання</th>
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Витрата</th>
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Коментар</th>
|
|
<th style="padding:0.75rem 1rem; text-align:left; color:var(--color-muted-foreground); font-weight:600; font-size:0.8125rem;">Хто подав</th>
|
|
<th style="width:2.5rem;"></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
{% for r in readings %}
|
|
<tr style="border-bottom:1px solid var(--color-border);">
|
|
{% if pharmacies_for_form %}
|
|
<td style="padding:0.75rem 1rem; color:var(--color-foreground);">{{ r.pharmacy.organization.name }} №{{ r.pharmacy.pharmacy_number }}</td>
|
|
{% endif %}
|
|
<td style="padding:0.75rem 1rem; color:var(--color-foreground);">
|
|
{{ r.utility_type.name }}
|
|
{% if r.reading_mode == 'day_night' %}<span class="badge badge-info" style="font-size:0.6875rem; margin-left:0.25rem;">день/ніч</span>{% endif %}
|
|
</td>
|
|
<td style="padding:0.75rem 1rem; color:var(--color-foreground);">{{ r.reading_date|date:"d.m.Y" }}</td>
|
|
<td style="padding:0.75rem 1rem; color:var(--color-foreground); font-weight:500;">{{ r.value_display }}</td>
|
|
<td style="padding:0.75rem 1rem;">
|
|
{% if r.reading_mode == 'day_night' %}
|
|
{% if r.consumption_day is not None or r.consumption_night is not None %}
|
|
<span style="color:var(--color-muted-foreground); font-size:0.8125rem;">
|
|
день {% if r.consumption_day is not None %}{{ r.consumption_day }}{% else %}—{% endif %}
|
|
· ніч {% if r.consumption_night is not None %}{{ r.consumption_night }}{% else %}—{% endif %}
|
|
{% if r.consumption_total is not None %}<br><strong>Σ {{ r.consumption_total }}</strong>{% endif %}
|
|
</span>
|
|
{% else %}
|
|
<span style="color:var(--color-muted-foreground);">—</span>
|
|
{% endif %}
|
|
{% elif r.consumption is not None %}
|
|
{% if r.consumption < 0 %}
|
|
<span style="color:var(--color-destructive);" title="Показання менше за попереднє — перевірте">⚠ {{ r.consumption }}</span>
|
|
{% else %}
|
|
<span style="color:var(--color-muted-foreground);">{{ r.consumption }}</span>
|
|
{% endif %}
|
|
{% else %}
|
|
<span style="color:var(--color-muted-foreground);">—</span>
|
|
{% endif %}
|
|
</td>
|
|
<td style="padding:0.75rem 1rem; color:var(--color-muted-foreground); font-size:0.8125rem;">{{ r.comment|default:"—" }}</td>
|
|
<td style="padding:0.75rem 1rem; color:var(--color-muted-foreground); font-size:0.8125rem;">{{ r.submitted_by.get_full_name|default:"—" }}</td>
|
|
<td style="padding:0.75rem 1rem;">
|
|
{% if r.can_delete %}
|
|
<form method="post" action="/utilities/{{ r.pk }}/delete/" hx-post="/utilities/{{ r.pk }}/delete/" hx-target="#main-content" hx-indicator="#loader"
|
|
hx-confirm="Видалити це показання?" style="margin:0;">
|
|
{% csrf_token %}
|
|
<button type="submit" class="btn btn-ghost" style="padding:0.2rem 0.4rem; color:var(--color-destructive);">✕</button>
|
|
</form>
|
|
{% endif %}
|
|
</td>
|
|
</tr>
|
|
{% empty %}
|
|
<tr>
|
|
<td colspan="8" style="padding:2rem; text-align:center; color:var(--color-muted-foreground);">Показань поки немає</td>
|
|
</tr>
|
|
{% endfor %}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|