{% 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-list-ul me-2"></i>资产列表</h4>
    <div>
        <a href="{% url 'asset_export' %}" class="btn btn-outline-success btn-sm me-2">
            <i class="bi bi-download me-1"></i>导出Excel
        </a>
        <a href="{% url 'asset_import' %}" class="btn btn-outline-info btn-sm me-2">
            <i class="bi bi-upload me-1"></i>导入Excel
        </a>
        <a href="{% url 'asset_create' %}" class="btn btn-primary btn-sm">
            <i class="bi bi-plus-circle me-1"></i>新增资产
        </a>
    </div>
</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-3">
                <label class="form-label text-muted small">搜索</label>
                <input type="text" name="search" class="form-control form-control-sm" 
                       placeholder="编号/名称/序列号/IP/BMC/品牌/型号/机柜/负责人/部门/维护人/业务类型..." value="{{ search }}">
            </div>
            <div class="col-md-2">
                <label class="form-label text-muted small">分类</label>
                <select name="category" class="form-select form-select-sm">
                    <option value="">全部分类</option>
                    {% for cat in categories %}
                    <option value="{{ cat.id }}" {% if current_category == cat.id|stringformat:"s" %}selected{% endif %}>{{ cat.name }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-md-2">
                <label class="form-label text-muted small">状态</label>
                <select name="status" class="form-select form-select-sm">
                    <option value="">全部状态</option>
                    {% for key, label in status_map.items %}
                    <option value="{{ key }}" {% if current_status == key %}selected{% endif %}>{{ label }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-md-2">
                <label class="form-label text-muted small">机柜</label>
                <select name="cabinet" class="form-select form-select-sm">
                    <option value="">全部机柜</option>
                    {% for cab in cabinets %}
                    <option value="{{ cab }}" {% if current_cabinet == cab %}selected{% endif %}>{{ cab }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-md-2">
                <label class="form-label text-muted small">业务类型</label>
                <select name="business_type" class="form-select form-select-sm">
                    <option value="">全部业务</option>
                    {% for bt in business_types %}
                    <option value="{{ bt }}" {% if current_business_type == bt %}selected{% endif %}>{{ bt }}</option>
                    {% endfor %}
                </select>
            </div>
            <div class="col-md-1">
                <button type="submit" class="btn btn-primary btn-sm me-1"><i class="bi bi-search"></i></button>
                <a href="{% url 'asset_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 table-striped mb-0">
                <thead>
                    <tr>
                        <th style="width:50px">ID</th>
                        <th style="width:100px">机房</th>
                        <th style="width:80px">机柜</th>
                        <th style="width:120px">机柜位置</th>
                        <th style="width:80px">资产编号</th>
                        <th>设备名称</th>
                        <th>分类</th>
                        <th>品牌/型号</th>
                        <th>资产面值</th>
                        <th>BMC地址</th>
                        <th>IP地址</th>
                        <th>显卡类型</th>
                        <th>卡数</th>
                        <th style="width:60px">负责人</th>
                        <th>使用部门</th>
                        <th style="width:60px">维护人</th>
                        <th>业务类型</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    {% for asset in page_obj %}
                    <tr>
                        <td class="text-muted small" title="{{ asset.id }}">{{ asset.id|stringformat:"s"|truncatechars:3 }}</td>
                        <td title="{{ asset.location }}">{{ asset.location|default:"-"|truncatechars:5 }}</td>
                        <td title="{{ asset.cabinet }}">{{ asset.cabinet|default:"-"|truncatechars:3 }}</td>
                        <td title="{{ asset.cabinet_position }}">{{ asset.cabinet_position|default:"-"|truncatechars:10 }}</td>
                        <td><a href="{% url 'asset_detail' asset.pk %}" class="text-info" title="{{ asset.asset_number }}">{{ asset.asset_number|truncatechars:3 }}</a></td>
                        <td>{{ asset.name }}</td>
                        <td><span class="badge bg-secondary">{{ asset.category.name }}</span></td>
                        <td>{{ asset.brand }} {% if asset.model %}{{ asset.model }}{% endif %}</td>
                        <td>{% if asset.asset_value %}¥{{ asset.asset_value }}{% else %}-{% endif %}</td>
                        <td><code>{{ asset.bmc_address|default:"-" }}</code></td>
                        <td><code>{{ asset.ip_address|default:"-" }}</code></td>
                        <td>{{ asset.gpu_type|default:"-" }}</td>
                        <td>{{ asset.gpu_count|default:"-" }}</td>
                        <td style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px" title="{{ asset.responsible_person }}">{{ asset.responsible_person|default:"-" }}</td>
                        <td>{{ asset.department|default:"-" }}</td>
                        <td style="white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:120px" title="{{ asset.user }}">{{ asset.user|default:"-" }}</td>
                        <td>{{ asset.business_type|default:"-" }}</td>
                        <td>
                            <span class="badge 
                                {% if asset.status == 'in_use' %}bg-success
                                {% elif asset.status == 'idle' %}bg-warning text-dark
                                {% elif asset.status == 'maintenance' %}bg-info
                                {% else %}bg-danger{% endif %}">
                                {{ asset.get_status_display }}
                            </span>
                        </td>
                        <td>
                            <a href="{% url 'asset_detail' asset.pk %}" class="btn btn-outline-info btn-xs" title="详情">
                                <i class="bi bi-eye"></i>
                            </a>
                            <a href="{% url 'asset_update' asset.pk %}" class="btn btn-outline-warning btn-xs" title="编辑">
                                <i class="bi bi-pencil"></i>
                            </a>
                            <a href="{% url 'asset_delete' asset.pk %}" class="btn btn-outline-danger btn-xs" title="删除">
                                <i class="bi bi-trash"></i>
                            </a>
                        </td>
                    </tr>
                    {% empty %}
                    <tr><td colspan="20" class="text-center text-light opacity-75 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 }}{% if search %}&search={{ search }}{% endif %}{% if current_category %}&category={{ current_category }}{% endif %}{% if current_status %}&status={{ current_status }}{% endif %}{% if current_cabinet %}&cabinet={{ current_cabinet }}{% endif %}{% if current_business_type %}&business_type={{ current_business_type }}{% endif %}"><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 }}{% if search %}&search={{ search }}{% endif %}{% if current_category %}&category={{ current_category }}{% endif %}{% if current_status %}&status={{ current_status }}{% endif %}{% if current_cabinet %}&cabinet={{ current_cabinet }}{% endif %}{% if current_business_type %}&business_type={{ current_business_type }}{% endif %}">{{ 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 }}{% if search %}&search={{ search }}{% endif %}{% if current_category %}&category={{ current_category }}{% endif %}{% if current_status %}&status={{ current_status }}{% endif %}{% if current_cabinet %}&cabinet={{ current_cabinet }}{% endif %}{% if current_business_type %}&business_type={{ current_business_type }}{% endif %}"><i class="bi bi-chevron-right"></i></a></li>
        {% endif %}
    </ul>
</nav>
{% endif %}

<div class="text-light opacity-75 small mt-2">
    共 {{ page_obj.paginator.count }} 条记录，第 {{ page_obj.number }}/{{ page_obj.paginator.num_pages }} 页
</div>
{% endblock %}