94 lines
5.0 KiB
HTML
94 lines
5.0 KiB
HTML
{% extends "base.html" %}
|
|
{% block title %}My Profile{% endblock %}
|
|
{% block page_title %}My Profile{% endblock %}
|
|
|
|
{% block content %}
|
|
<div class="row justify-content-center">
|
|
<div class="col-lg-7">
|
|
<div class="card">
|
|
<div class="card-header"><i class="bi bi-person-circle me-2"></i>Account Settings</div>
|
|
<div class="card-body">
|
|
<form method="POST" enctype="multipart/form-data">
|
|
<input type="hidden" name="csrf_token" value="{{ csrf_token() }}"/>
|
|
<!-- Avatar -->
|
|
<div class="text-center mb-4">
|
|
{% if current_user.avatar_url %}
|
|
<img src="{{ url_for('auth.serve_avatar', filename=current_user.avatar_url) }}"
|
|
alt="Avatar"
|
|
style="width:80px;height:80px;border-radius:50%;object-fit:cover;border:2px solid var(--border);margin:0 auto 10px;display:block;"/>
|
|
{% else %}
|
|
<div style="width:80px;height:80px;border-radius:50%;background:var(--accent2);display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:700;color:#fff;margin:0 auto 10px;">
|
|
{{ current_user.full_name[0].upper() }}
|
|
</div>
|
|
{% endif %}
|
|
<div style="font-size:12px;color:var(--muted);">{{ current_user.email }}</div>
|
|
<div style="font-size:11px;background:rgba(0,180,216,.1);color:var(--accent3);display:inline-block;padding:2px 10px;border-radius:12px;margin-top:4px;">
|
|
{{ current_user.role.replace('_',' ').upper() }}
|
|
</div>
|
|
<div class="mt-3">
|
|
<label class="form-label" style="font-size:12px;">Profile Picture
|
|
<span style="color:var(--muted);font-weight:400;">(PNG, JPG, GIF, WebP — max 5 MB)</span>
|
|
</label>
|
|
<input type="file" class="form-control form-control-sm" name="avatar"
|
|
accept=".png,.jpg,.jpeg,.gif,.webp" style="max-width:300px;margin:0 auto;"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="row g-3">
|
|
<div class="col-md-6">
|
|
<label class="form-label">Full Name</label>
|
|
<input type="text" class="form-control" name="full_name" value="{{ current_user.full_name }}" required/>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Department</label>
|
|
<input type="text" class="form-control" name="department" value="{{ current_user.department or '' }}"/>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Phone</label>
|
|
<input type="text" class="form-control" name="phone" value="{{ current_user.phone or '' }}"/>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Username</label>
|
|
<input type="text" class="form-control" value="{{ current_user.username }}" disabled/>
|
|
</div>
|
|
</div>
|
|
|
|
<hr style="border-color:var(--border);margin:24px 0;"/>
|
|
<h6 style="font-size:14px;font-weight:700;margin-bottom:16px;">Notification Preferences</h6>
|
|
<div class="d-flex flex-column gap-2 mb-4">
|
|
<label style="display:flex;align-items:center;gap:10px;cursor:pointer;">
|
|
<input type="checkbox" name="email_notif" {% if current_user.email_notif %}checked{% endif %}
|
|
style="accent-color:var(--accent3);width:16px;height:16px;"/>
|
|
<span style="font-size:14px;"><i class="bi bi-envelope me-2" style="color:var(--accent3);"></i>Email Notifications</span>
|
|
</label>
|
|
<label style="display:flex;align-items:center;gap:10px;cursor:pointer;">
|
|
<input type="checkbox" name="web_notif" {% if current_user.web_notif %}checked{% endif %}
|
|
style="accent-color:var(--accent3);width:16px;height:16px;"/>
|
|
<span style="font-size:14px;"><i class="bi bi-bell me-2" style="color:var(--accent3);"></i>In-App Notifications</span>
|
|
</label>
|
|
</div>
|
|
|
|
<hr style="border-color:var(--border);margin:24px 0;"/>
|
|
<h6 style="font-size:14px;font-weight:700;margin-bottom:16px;">Change Password <span style="font-size:12px;color:var(--muted);font-weight:400;">(leave blank to keep current)</span></h6>
|
|
<div class="row g-3 mb-4">
|
|
<div class="col-md-6">
|
|
<label class="form-label">New Password</label>
|
|
<input type="password" class="form-control" name="new_password" placeholder="Min. 8 characters"/>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<label class="form-label">Confirm Password</label>
|
|
<input type="password" class="form-control" name="confirm_password" placeholder="Repeat password"/>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="d-flex gap-2">
|
|
<button type="submit" class="btn btn-primary"><i class="bi bi-check2 me-2"></i>Save Changes</button>
|
|
<a href="{{ url_for('tickets.dashboard') }}" class="btn btn-secondary">Cancel</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|