73 lines
2.4 KiB
HTML
73 lines
2.4 KiB
HTML
|
{% extends 'base.html' %}
|
||
|
|
||
|
{% block content %}
|
||
|
<!-- Page Title -->
|
||
|
<h1 class="mb-4 text-center">Assign NFC Tag to Spool</h1>
|
||
|
|
||
|
<!-- Empty State -->
|
||
|
{% if spools|length == 0 or not spools %}
|
||
|
<div class="alert alert-info text-center" role="alert">
|
||
|
No spools available to tag at the moment.
|
||
|
</div>
|
||
|
{% else %}
|
||
|
|
||
|
<!-- Spool List -->
|
||
|
<div class="list-group">
|
||
|
{% for spool in spools %}
|
||
|
{% if not spool.extra.get("tag") or spool.extra.get("tag") == "null" %}
|
||
|
<!-- Individual Spool Item -->
|
||
|
<a href="{{ url_for('write_tag', spool_id=spool.id) }}"
|
||
|
class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||
|
|
||
|
<!-- Left: Filament Color Badge -->
|
||
|
<div class="me-3">
|
||
|
<span class="badge d-inline-block"
|
||
|
style="background-color: #{{ spool.filament.color_hex }}; width: 20px; height: 50px;">
|
||
|
</span>
|
||
|
</div>
|
||
|
|
||
|
<!-- Middle: Filament Details -->
|
||
|
<div class="flex-grow-1">
|
||
|
<!-- Vendor Name and Material (Row 1) -->
|
||
|
<h6 class="mb-0">{{ spool.filament.vendor.name }} - {{ spool.filament.material }}</h6>
|
||
|
<!-- Filament Name (Row 2) -->
|
||
|
<small class="text-muted">{{ spool.filament.name }}</small>
|
||
|
</div>
|
||
|
|
||
|
<!-- Action Icon -->
|
||
|
<span class="badge bg-primary rounded-pill">
|
||
|
<i class="bi bi-plus-circle"></i> Assign
|
||
|
</span>
|
||
|
</a>
|
||
|
{% endif %}
|
||
|
{% endfor %}
|
||
|
{% for spool in spools %}
|
||
|
{% if spool.extra.get("tag") %}
|
||
|
<!-- Individual Spool Item -->
|
||
|
<a href="{{ url_for('write_tag', spool_id=spool.id) }}"
|
||
|
class="list-group-item list-group-item-action d-flex justify-content-between align-items-center">
|
||
|
<!-- Left: Filament Color Badge -->
|
||
|
<div class="me-3">
|
||
|
<span class="badge d-inline-block"
|
||
|
style="background-color: #{{ spool.filament.color_hex }}; width: 20px; height: 50px;">
|
||
|
</span>
|
||
|
</div>
|
||
|
|
||
|
<!-- Middle: Filament Details -->
|
||
|
<div class="flex-grow-1">
|
||
|
<!-- Vendor Name and Material (Row 1) -->
|
||
|
<h6 class="mb-0">{{ spool.filament.vendor.name }} - {{ spool.filament.material }}</h6>
|
||
|
<!-- Filament Name (Row 2) -->
|
||
|
<small class="text-muted">{{ spool.filament.name }}</small>
|
||
|
</div>
|
||
|
<!-- Action Icon -->
|
||
|
<span class="badge bg-secondary rounded-pill">
|
||
|
<i class="bi bi-plus-circle"></i> Reassign
|
||
|
</span>
|
||
|
</a>
|
||
|
{% endif %}
|
||
|
{% endfor %}
|
||
|
</div>
|
||
|
{% endif %}
|
||
|
{% endblock %}
|