{% extends "admin/base.html" %}

{% block title %}个人资料 - 太白购物商城管理后台{% endblock %}

{% block page_title %}个人资料{% endblock %}
{% block page_description %}管理员个人信息设置{% endblock %}

{% block extra_css %}
<link rel="stylesheet" href="{{ url_for('static', filename='css/admin_profile.css') }}">
{% endblock %}

{% block content %}
<div class="profile-container">
    <div class="row">
        <div class="col-md-8">
            <div class="card profile-card">
                <div class="card-header">
                    <h5 class="mb-0">
                        <i class="bi bi-person-gear"></i>
                        基本信息
                    </h5>
                </div>
                <div class="card-body">
                    <form method="POST" action="{{ url_for('admin.edit_profile') }}">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="username" class="form-label">用户名</label>
                                    <input type="text" class="form-control" id="username"
                                           value="{{ admin.username }}" readonly>
                                    <div class="form-text">用户名不可修改</div>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="real_name" class="form-label">真实姓名</label>
                                    <input type="text" class="form-control" id="real_name" name="real_name"
                                           value="{{ admin.real_name or '' }}">
                                </div>
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="email" class="form-label">邮箱地址</label>
                                    <input type="email" class="form-control" id="email" name="email"
                                           value="{{ admin.email or '' }}">
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label for="phone" class="form-label">手机号</label>
                                    <input type="tel" class="form-control" id="phone" name="phone"
                                           value="{{ admin.phone or '' }}">
                                </div>
                            </div>
                        </div>

                        <button type="submit" class="btn btn-primary">
                            <i class="bi bi-check-lg"></i> 保存修改
                        </button>
                    </form>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card info-card">
                <div class="card-header">
                    <h5 class="mb-0">
                        <i class="bi bi-info-circle"></i>
                        账号信息
                    </h5>
                </div>
                <div class="card-body">
                    <div class="info-item">
                        <strong>角色：</strong>
                        <span class="badge bg-success">{{ admin.role }}</span>
                    </div>
                    <div class="info-item">
                        <strong>状态：</strong>
                        {% if admin.status == 1 %}
                            <span class="badge bg-success">正常</span>
                        {% else %}
                            <span class="badge bg-danger">禁用</span>
                        {% endif %}
                    </div>
                    <div class="info-item">
                        <strong>创建时间：</strong><br>
                        {{ admin.created_at.strftime('%Y-%m-%d %H:%M:%S') if admin.created_at else '' }}
                    </div>
                    <div class="info-item">
                        <strong>最后登录：</strong><br>
                        {{ admin.last_login_at.strftime('%Y-%m-%d %H:%M:%S') if admin.last_login_at else '从未登录' }}
                    </div>
                </div>
            </div>

            <!-- 修改密码 -->
            <div class="card password-card">
                <div class="card-header">
                    <h5 class="mb-0">
                        <i class="bi bi-key"></i>
                        修改密码
                    </h5>
                </div>
                <div class="card-body">
                    <form method="POST" action="{{ url_for('admin.change_password') }}">
                        <div class="mb-3">
                            <label for="current_password" class="form-label">当前密码</label>
                            <input type="password" class="form-control" id="current_password"
                                   name="current_password" required>
                        </div>

                        <div class="mb-3">
                            <label for="new_password" class="form-label">新密码</label>
                            <input type="password" class="form-control" id="new_password"
                                   name="new_password" required>
                            <div class="form-text">密码长度至少6位，建议包含字母和数字</div>
                        </div>

                        <div class="mb-3">
                            <label for="confirm_password" class="form-label">确认新密码</label>
                            <input type="password" class="form-control" id="confirm_password"
                                   name="confirm_password" required>
                        </div>

                        <button type="submit" class="btn btn-warning">
                            <i class="bi bi-key"></i> 修改密码
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}