93 lines
5.1 KiB
HTML
93 lines
5.1 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}{{ 'nav.profiles'|t(user.language) }} - {{ 'brand'|t(user.language) }}{% endblock %}
|
|
{% block content %}
|
|
<div class="section-header">
|
|
<h1>Profile</h1>
|
|
</div>
|
|
<div class="inline-form">
|
|
<form method="post" action="/profiles" class="form-row">
|
|
<input type="text" name="nickname" placeholder="{{ 'profiles.new_ph'|t(user.language) }}" required>
|
|
<input type="text" name="country" placeholder="{{ 'profiles.country_ph'|t(user.language) }}" maxlength="2" style="width:60px;text-transform:uppercase" oninput="this.value=this.value.toUpperCase()">
|
|
<button type="submit" class="btn btn-primary">{{ 'profiles.new_btn'|t(user.language) }}</button>
|
|
</form>
|
|
</div>
|
|
{% if profiles %}
|
|
<div class="profile-grid">
|
|
{% for p in profiles %}
|
|
{% set e = extras[p.id] %}
|
|
<div class="profile-card">
|
|
<div class="profile-card-header">
|
|
<h3 class="profile-card-name">
|
|
<span id="name-display-{{ p.id }}">{{ p.nickname }}</span>
|
|
{% if p.country %}<span style="font-size:.8rem;color:var(--text-muted);font-weight:400">{{ p.country|flag }} {{ p.country }}</span>{% endif %}
|
|
<button type="button" class="icon-btn" onclick="startRename({{ p.id }})" title="{{ 'profiles.rename'|t(user.language) }}">✏️</button>
|
|
</h3>
|
|
<form method="post" action="/profiles/{{ p.id }}/rename" class="rename-form" id="name-edit-{{ p.id }}" style="display:none">
|
|
<input type="text" name="nickname" value="{{ p.nickname }}" required>
|
|
<input type="text" name="country" value="{{ p.country or '' }}" maxlength="2" style="width:60px;text-transform:uppercase" oninput="this.value=this.value.toUpperCase()" placeholder="{{ 'profiles.country_ph'|t(user.language) }}">
|
|
<button type="submit" class="btn btn-primary btn-sm">✓</button>
|
|
<button type="button" class="btn btn-sm" onclick="cancelRename({{ p.id }})">✕</button>
|
|
</form>
|
|
</div>
|
|
<div class="profile-card-stats">
|
|
<div class="stat">
|
|
<span class="stat-value">{{ e.total }}</span>
|
|
<span class="stat-label">{{ 'profiles.total'|t(user.language) }}</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-value badge-sent-text">{{ e.sent }}</span>
|
|
<span class="stat-label">{{ 'dash.sent'|t(user.language) }}</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-value badge-delivered-text">{{ e.delivered }}</span>
|
|
<span class="stat-label">{{ 'dash.delivered'|t(user.language) }}</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-value badge-received-text">{{ e.received }}</span>
|
|
<span class="stat-label">{{ 'dash.received'|t(user.language) }}</span>
|
|
</div>
|
|
<div class="stat">
|
|
<span class="stat-value">{{ e.countries }}</span>
|
|
<span class="stat-label">{{ 'profiles.countries'|t(user.language) }}</span>
|
|
</div>
|
|
</div>
|
|
<div class="profile-card-notes" style="padding:.5rem .75rem">
|
|
<form method="post" action="/profiles/{{ p.id }}/notes" style="display:flex;align-items:center;gap:.4rem">
|
|
<textarea name="notes" rows="1" placeholder="{{ 'profiles.notes_ph'|t(user.language) }}" style="flex:1;padding:.3rem .5rem;border:1px solid var(--border);border-radius:6px;font-size:.8rem;resize:none;font-family:inherit;line-height:1.4;min-height:1.6rem">{{ p.notes }}</textarea>
|
|
<button type="submit" class="btn btn-sm" style="flex-shrink:0;margin-top:0">{{ 'profiles.save'|t(user.language) }}</button>
|
|
</form>
|
|
</div>
|
|
<div class="profile-card-footer">
|
|
<span class="profile-card-date">{{ 'profiles.created_at'|t(user.language) }} {{ p.created_at.strftime('%Y-%m-%d') }}</span>
|
|
<div class="profile-card-actions">
|
|
<a href="/profiles/{{ p.id }}/postcards" class="btn btn-primary btn-sm">{{ 'profiles.view'|t(user.language) }}</a>
|
|
<form method="post" action="/profiles/{{ p.id }}/delete" class="inline">
|
|
<button type="submit" class="btn btn-danger btn-sm" onclick="return confirm('{{ 'profiles.confirm_delete'|t(user.language) }}')">{{ 'profiles.delete'|t(user.language) }}</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
{% else %}
|
|
<div class="empty-state">
|
|
<div class="empty-icon">📮</div>
|
|
<p>还没有 Profile</p>
|
|
<p class="empty-sub">{{ 'profiles.new_ph'|t(user.language) }}</p>
|
|
</div>
|
|
{% endif %}
|
|
<script>
|
|
function startRename(id) {
|
|
document.getElementById('name-display-' + id).style.display = 'none';
|
|
var form = document.getElementById('name-edit-' + id);
|
|
form.style.display = 'inline-flex';
|
|
form.querySelector('input').focus();
|
|
}
|
|
function cancelRename(id) {
|
|
var form = document.getElementById('name-edit-' + id);
|
|
form.style.display = 'none';
|
|
document.getElementById('name-display-' + id).style.display = '';
|
|
}
|
|
</script>
|
|
{% endblock %}
|