timekeeper/app/templates/dept_importer_map.html
2026-01-15 15:46:35 -05:00

94 lines
3.9 KiB
HTML

{% extends "layout.html" %}
{% block content %}
<div class="page-wide">
<div class="panel">
<div class="panel-title">Map Columns {% if kind == 'excel' %}& Select Sheet{% endif %}</div>
<form method="post" action="/import/department/preview-mapped" style="display:flex; flex-direction:column; gap:12px;">
<input type="hidden" name="map_slug" value="{{ map_slug }}">
<input type="hidden" name="timesheet_id" value="{{ timesheet_id }}">
<input type="hidden" name="mode" value="{{ mode|default('department') }}">
<div class="panel toolbar" style="gap:12px; flex-wrap:wrap; align-items:center;">
{% if kind == 'excel' and sheets_info|length > 1 %}
<label class="label">Sheet</label>
<select class="select" name="sheet_name" onchange="onSheetChange(this)" required>
{% for s in sheets_info %}
<option value="{{ s.sheet_name }}" {% if s.sheet_name == sheet_name %}selected{% endif %}>{{ s.sheet_name }}</option>
{% endfor %}
</select>
{% else %}
<input type="hidden" name="sheet_name" value="{{ sheet_name }}">
<div class="muted">Source: {{ sheet_name }}</div>
{% endif %}
<label class="checkbox" style="display:flex; gap:6px; align-items:center;">
<input type="checkbox" name="restrict_to_period" value="1" {% if restrict_to_period %}checked{% endif %}>
Only include rows within the selected time period
</label>
<a class="btn" href="/import/department?timesheet_id={{ timesheet_id }}">Start over</a>
<a class="btn" href="/viewer?timesheet_id={{ timesheet_id }}">Back to Viewer</a>
</div>
<div class="muted">
Choose which columns from the {{ 'sheet' if kind == 'excel' else 'file' }} map to your fields. Defaults are auto-detected.
</div>
{% set selected = (sheets_info | selectattr('sheet_name', 'equalto', sheet_name) | list | first) %}
{% set headers = selected.header_vals %}
{% set auto = selected.auto_map %}
<div class="table-wrap">
<table class="table">
<thead>
<tr>
<th>Field</th>
<th>Column</th>
</tr>
</thead>
<tbody>
{% for key, label, required in target_fields %}
<tr>
<td>
{{ label }}
{% if required %}<span class="badge warn" title="Required field">Required</span>{% endif %}
</td>
<td>
<select class="select" name="{{ key }}" {% if required %}required{% endif %}>
<option value="None">— None —</option>
{% for i in range(headers|length) %}
{% set hv = headers[i] %}
{% set hv_disp = (hv|string) if hv is not none else '' %}
<option value="{{ i }}"
{% if auto and auto.get(key) is not none and auto.get(key) == i %}selected{% endif %}>
{{ i }} — {{ hv_disp }}
</option>
{% endfor %}
</select>
</td>
</tr>
{% endfor %}
</tbody>
</table>
</div>
<div style="display:flex; gap:8px; align-items:center; flex-wrap:wrap;">
<button class="btn primary" type="submit">Build Preview</button>
<button class="btn" type="button" onclick="window.location.href='/import/department/map?map_slug={{ map_slug }}&sheet_name={{ sheet_name }}'">Reset defaults</button>
</div>
</form>
<div class="muted" style="margin-top:8px;">
</div>
</div>
</div>
<script>
function onSheetChange(sel) {
const sheet = sel && sel.value ? sel.value : '';
const params = new URLSearchParams({ map_slug: '{{ map_slug }}', sheet_name: sheet });
window.location.href = '/import/department/map?' + params.toString();
}
</script>
{% endblock %}