{% extends "admin/base_site.html" %}
{% load i18n static admin_urls %}

{% block title %}{% if form.errors %}{% translate "Error:" %} {% endif %}{{ block.super }}{% endblock %}

{% block extrastyle %}
{{ block.super }}
<link rel="stylesheet" href="{% static 'admin/css/unusable_password_field.css' %}">
<link rel="stylesheet" href="{% static 'yanleafadmin/css/password-form.css' %}">
{% endblock %}

{% block bodyclass %}{{ block.super }} {{ opts.app_label }}-{{ opts.model_name }} change-form{% endblock %}

{% block breadcrumbs %}
<nav class="yanleaf-breadcrumbs">
    <a href="{% url 'admin:index' %}">{% translate '首页' %}</a>
    <span class="separator">&rsaquo;</span>
    <a href="{% url 'admin:app_list' app_label=opts.app_label %}">{{ opts.app_config.verbose_name }}</a>
    <span class="separator">&rsaquo;</span>
    <a href="{% url opts|admin_urlname:'changelist' %}">{{ opts.verbose_name_plural|capfirst }}</a>
    <span class="separator">&rsaquo;</span>
    <a href="{% url opts|admin_urlname:'change' original.pk|admin_urlquote %}">{{ original|truncatewords:"18" }}</a>
    <span class="separator">&rsaquo;</span>
    <span>{% if form.user.has_usable_password %}{% translate '修改密码' %}{% else %}{% translate '设置密码' %}{% endif %}</span>
</nav>
{% endblock %}

{% block content_title %}{% endblock %}

{% block content %}
<div id="content-main">

    <form{% if form_url %} action="{{ form_url }}"{% endif %} method="post" id="{{ opts.model_name }}_form">
    {% csrf_token %}
    <input type="text" name="username" value="{{ original.get_username }}" style="position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;opacity:0;" aria-hidden="true" tabindex="-1" autocomplete="username">

    {% if is_popup %}<input type="hidden" name="{{ is_popup_var }}" value="1">{% endif %}

    {% if form.errors %}
    <p class="errornote">
        <i class="fas fa-exclamation-triangle"></i>
        {% blocktranslate count counter=form.errors.items|length %}请修正以下错误。{% plural %}请修正以下错误。{% endblocktranslate %}
    </p>
    {% endif %}

    <div class="pwd-card">
        <div class="pwd-card-header">
            <div class="pwd-card-icon"><i class="fas fa-user-lock"></i></div>
            <div>
                <h2>正在为用户 {{ original }} 重置登录密码</h2>
                {% if not form.user.has_usable_password %}
                <p>此操作将为该用户<strong>启用</strong>密码认证。</p>
                {% endif %}
            </div>
        </div>
        <div class="pwd-card-body">

            <div class="form-row" style="display:none;">
                {{ form.usable_password.errors }}
                {{ form.usable_password }}
                {% if form.usable_password.help_text %}
                <div class="help">{{ form.usable_password.help_text|safe }}</div>
                {% endif %}
            </div>

            <div class="form-row">
                {{ form.password1.errors }}
                <label for="{{ form.password1.id_for_label }}" class="required">新密码</label>
                <div class="pwd-input-wrap">{{ form.password1 }}</div>
                {% if form.password1.help_text %}
                <div class="help">{{ form.password1.help_text|safe }}</div>
                {% endif %}
            </div>

            <div class="form-row">
                {{ form.password2.errors }}
                <label for="{{ form.password2.id_for_label }}" class="required">确认新密码</label>
                <div class="pwd-input-wrap">{{ form.password2 }}</div>
                {% if form.password2.help_text %}
                <div class="help">{{ form.password2.help_text|safe }}</div>
                {% endif %}
            </div>

            <div class="form-row" style="display:flex;align-items:center;justify-content:space-between;gap:0.5rem;flex-wrap:wrap;">
                {% if form.user.has_usable_password %}
                <div style="display:flex;align-items:center;gap:0.5rem;flex-wrap:wrap;">
                    <input type="submit" name="set-password" value="重置密码" class="default set-password" style="background:var(--yla-text-primary);color:var(--yla-bg-card);border:none;border-radius:var(--yla-radius-sm);padding:0.55rem 1.5rem;font-size:0.85rem;font-weight:600;cursor:pointer;">
                    <input type="submit" name="unset-password" value="禁用密码认证" class="unset-password" style="background:transparent;color:#dc2626;border:1px solid #fecaca;border-radius:var(--yla-radius-sm);padding:0.55rem 1.2rem;font-size:0.78rem;font-weight:600;cursor:pointer;">
                </div>
                {% else %}
                <input type="submit" name="set-password" value="启用密码认证" class="default set-password" style="background:var(--yla-text-primary);color:var(--yla-bg-card);border:none;border-radius:var(--yla-radius-sm);padding:0.55rem 1.5rem;font-size:0.85rem;font-weight:600;cursor:pointer;">
                {% endif %}
                <a href="{% url opts|admin_urlname:'change' original.pk|admin_urlquote %}" style="display:inline-flex;align-items:center;gap:0.3rem;color:var(--yla-text-muted);font-size:0.8rem;text-decoration:none;">
                    <i class="fas fa-arrow-left"></i> 返回用户编辑
                </a>
            </div>

        </div>
    </div>

    </form>
</div>

<script src="{% static 'admin/js/unusable_password_field.js' %}" defer></script>
{% endblock %}