{% extends "base.html" %}

{% block title %}申诉详情 - #{{ appeal.id }}{% endblock %}

{% block content %}
<div class="row">
    <!-- 左侧信息栏 -->
    <div class="col-lg-4">
        <div class="card shadow-sm mb-4">
            <div class="card-header"><h5 class="mb-0">申诉信息</h5></div>
            <div class="card-body">
                <p><strong>申诉ID:</strong> #{{ appeal.id }}</p>
                <p><strong>申诉人:</strong> {{ appeal.appealer.username }}</p>
                <p><strong>状态:</strong>
                    <span class="badge
                        {% if appeal.status in ['approved', 'rejected'] %} bg-secondary
                        {% elif 'user' in appeal.status %} bg-warning text-dark
                        {% else %} bg-info text-dark {% endif %}">
                        {{ appeal.status }}
                    </span>
                </p>
                <hr>
                <h6>针对黑名单记录</h6>
                {% if appeal.blacklist_entry %}
                <p class="mb-0"><strong>站点:</strong> {{ appeal.blacklist_entry.pt_site }}</p>
                <p class="mb-0"><strong>UID:</strong> {{ appeal.blacklist_entry.uid }}</p>
                {% else %}
                <p class="mb-0 text-muted">黑名单记录已删除</p>
                {% endif %}
            </div>
        </div>
        
        {% if current_user.role=='admin' and appeal.status not in ['approved', 'rejected'] %}
        <div class="card shadow-sm mb-4">
            <div class="card-header"><h5 class="mb-0">管理员操作</h5></div>
            <div class="card-body text-center d-grid gap-2">
                 <form action="{{ url_for('main.decide_appeal', appeal_id=appeal.id) }}" method="POST" class="d-grid">
                    <input type="hidden" name="action" value="approve">
                    <button type="submit" class="btn btn-success" onclick="return confirm('确定批准申诉并将该用户移出黑名单吗？')">批准申诉</button>
                </form>
                <form action="{{ url_for('main.decide_appeal', appeal_id=appeal.id) }}" method="POST" class="d-grid">
                    <input type="hidden" name="action" value="reject">
                    <button type="submit" class="btn btn-danger" onclick="return confirm('确定驳回此申诉吗？')">驳回申诉</button>
                </form>
            </div>
        </div>
        {% endif %}
    </div>

    <!-- 右侧对话框 -->
    <div class="col-lg-8">
        <div class="card shadow-sm">
            <div class="card-header"><h5 class="mb-0">对话历史</h5></div>
            <div class="card-body chat-box" style="height: 500px; overflow-y: auto;">
                <!-- 初始申诉理由 -->
                <div class="message user-message mb-3">
                    <div class="message-header">
                        <strong>{{ appeal.appealer.username }}</strong>
                        <small>{{ appeal.created_at.strftime('%Y-%m-%d %H:%M') }}</small>
                    </div>
                    <div class="message-body">
                        <p class="fw-bold">[初始申诉理由]</p>
                        <p class="mb-0" style="white-space: pre-wrap;">{{ appeal.reason }}</p>
                    </div>
                </div>
                
                <!-- 后续对话 -->
                {% for message in messages %}
                <div class="message mb-3 {% if message.author_id == appeal.appealer_id %}user-message{% else %}admin-message{% endif %}">
                    <div class="message-header">
                        {% if message.author.role == 'admin' %}
                            <strong>{{ message.author.username }} (管理员)</strong>
                            <small>{{ message.created_at.strftime('%Y-%m-%d %H:%M') }}</small>
                        {% else %}
                            <strong>{{ message.author.username }}</strong>
                            <small>{{ message.created_at.strftime('%Y-%m-%d %H:%M') }}</small>
                        {% endif %}
                    </div>
                    <div class="message-body">
                        <p class="mb-0" style="white-space: pre-wrap;">{{ message.body }}</p>
                    </div>
                </div>
                {% endfor %}
            </div>

            {% if appeal.status not in ['approved', 'rejected'] %}
            <div class="card-footer">
                <form method="POST">
                    {{ form.hidden_tag() }}
                    <div class="input-group">
                        {{ form.body(class="form-control", placeholder="输入回复内容...", rows="2") }}
                        {{ form.submit(class="btn btn-primary") }}
                    </div>
                    {% for error in form.body.errors %}<div class="invalid-feedback d-block">{{ error }}</div>{% endfor %}
                </form>
            </div>
            {% else %}
            <div class="card-footer text-center bg-light">
                <p class="mb-0 text-muted">该申诉已关闭，无法回复。</p>
            </div>
            {% endif %}
        </div>
    </div>
</div>
{% endblock %}