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

{% block title %}变更记录{% endblock %}

{% block content %}
<div class="d-flex justify-content-between align-items-center mb-4">
    <h4 class="mb-0"><i class="bi bi-clock-history me-2"></i>变更记录</h4>
</div>

<!-- 筛选 -->
<div class="card card-dark mb-3">
    <div class="card-body">
        <form method="get" class="row g-2 align-items-end">
            <div class="col-md-4">
                <label class="form-label text-muted small">资产编号</label>
                <input type="text" name="asset_number" class="form-control form-control-sm" 
                       placeholder="输入资产编号搜索" value="{{ asset_number }}">
            </div>
            <div class="col-md-3">
                <label class="form-label text-muted small">操作类型</label>
                <select name="action" class="form-select form-select-sm">
                    <option value="">全部</option>
                    <option value="create" {% if current_action == 'create' %}selected{% endif %}>创建</option>
                    <option value="update" {% if current_action == 'update' %}selected{% endif %}>更新</option>
                    <option value="delete" {% if current_action == 'delete' %}selected{% endif %}>删除</option>
                    <option value="import" {% if current_action == 'import' %}selected{% endif %}>导入</option>
                    <option value="export" {% if current_action == 'export' %}selected{% endif %}>导出</option>
                    <option value="status_change" {% if current_action == 'status_change' %}selected{% endif %}>状态变更</option>
                </select>
            </div>
            <div class="col-md-2">
                <button type="submit" class="btn btn-primary btn-sm"><i class="bi bi-search"></i> 搜索</button>
                <a href="{% url 'change_log_list' %}" class="btn btn-outline-secondary btn-sm"><i class="bi bi-arrow-counterclockwise"></i></a>
            </div>
        </form>
    </div>
</div>

<!-- 记录表 -->
<div class="card card-dark">
    <div class="card-body p-0">
        <div class="table-responsive">
            <table class="table table-dark table-hover mb-0">
                <thead>
                    <tr>
                        <th>时间</th>
                        <th>资产编号</th>
                        <th>操作</th>
                        <th>变更字段</th>
                        <th>旧值</th>
                        <th>新值</th>
                        <th>描述</th>
                        <th>操作人</th>
                    </tr>
                </thead>
                <tbody>
                    {% for log in page_obj %}
                    <tr>
                        <td>{{ log.created_at|date:"Y-m-d H:i:s" }}</td>
                        <td>
                            {% if log.asset %}
                            <a href="{% url 'asset_detail' log.asset.pk %}" class="text-info">{{ log.asset_number }}</a>
                            {% else %}
                            {{ log.asset_number }}
                            {% endif %}
                        </td>
                        <td><span class="badge 
                            {% if log.action == 'create' %}bg-success
                            {% elif log.action == 'update' %}bg-primary
                            {% elif log.action == 'delete' %}bg-danger
                            {% elif log.action == 'import' %}bg-info
                            {% elif log.action == 'export' %}bg-secondary
                            {% else %}bg-warning{% endif %}">
                            {{ log.get_action_display }}</span></td>
                        <td>{{ log.field_name|default:"-" }}</td>
                        <td><code class="small">{{ log.old_value|default:"-"|truncatechars:30 }}</code></td>
                        <td><code class="small">{{ log.new_value|default:"-"|truncatechars:30 }}</code></td>
                        <td>{{ log.description|default:"-" }}</td>
                        <td>{{ log.operator|default:"-" }}</td>
                    </tr>
                    {% empty %}
                    <tr><td colspan="8" class="text-center text-muted py-4">暂无变更记录</td></tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
</div>

<!-- 分页 -->
{% if page_obj.has_other_pages %}
<nav class="mt-3">
    <ul class="pagination pagination-sm justify-content-center">
        {% if page_obj.has_previous %}
        <li class="page-item"><a class="page-link" href="?page={{ page_obj.previous_page_number }}&asset_number={{ asset_number }}&action={{ current_action }}"><i class="bi bi-chevron-left"></i></a></li>
        {% endif %}
        {% for num in page_obj.paginator.page_range %}
            {% if page_obj.number == num %}
            <li class="page-item active"><span class="page-link">{{ num }}</span></li>
            {% elif num > page_obj.number|add:'-3' and num < page_obj.number|add:'3' %}
            <li class="page-item"><a class="page-link" href="?page={{ num }}&asset_number={{ asset_number }}&action={{ current_action }}">{{ num }}</a></li>
            {% endif %}
        {% endfor %}
        {% if page_obj.has_next %}
        <li class="page-item"><a class="page-link" href="?page={{ page_obj.next_page_number }}&asset_number={{ asset_number }}&action={{ current_action }}"><i class="bi bi-chevron-right"></i></a></li>
        {% endif %}
    </ul>
</nav>
{% endif %}
{% endblock %}