{% extends 'base.html' %}

{% block title %}ZFSAFE{% endblock %}

{% block style %}
        .note {
            color: red;
            font-size: 0.9rem;
        }
        .btn-blue {
            background-color: #007bff;
            color: white;
        }
        .btn-blue:hover {
            background-color: #0056b3;
        }
{% endblock %}

{% block content %}
<div class="container d-flex flex-column" >
    <div class="row  justify-content-center align-items-center mb-2">
        <div class="col-md-2 text-end"><label class="col-form-label form-label">用户名:</label></div>
        <div class="col-md-7"><p class="form-control-plaintext" id="system_version">zfadmin</p></div>
    </div>
    <div class="row  justify-content-center align-items-center mb-2">
        <div class="col-md-2 text-end"><label class="col-form-label form-label">原密码:</label></div>
        <div class="col-md-7"><input type="password" class="form-control" id="source_passwd"></div>
    </div>
    <div class="row  justify-content-center align-items-center mb-2">
        <div class="col-md-2 text-end"><label class="col-form-label form-label">新密码:</label></div>
        <div class="col-md-7"><input type="password" class="form-control" id="new_passwd"></div>
    </div>
    <div class="row  justify-content-center align-items-center mb-2">
        <div class="col-md-2 text-end"><label class="col-form-label form-label">确认密码:</label></div>
        <div class="col-md-7"><input type="password" class="form-control" id="again_passwd"></div>
    </div>
    <div class="row  justify-content-center align-items-center mb-2">
        <div class="col-md-6 text-end"></div>
        <div class="col-md-3"><button class="btn btn-blue w-100" id="changePasswd">修改密码</button></div>
    </div>


</div>
{% endblock %}

{% block script %}
<script src="{{ url_for('main.static', filename='scripts/user_manager.js') }}"></script>
{% endblock %}