@@ -101,7 +101,7 @@
|
||||
<img src="{{ listing.image.url }}" alt="Listing Image" style="width: 50px; height: 70px; object-fit: cover; border-radius: 4px; border: 1px solid #444;">
|
||||
{% endif %}
|
||||
<span style="font-weight: 700; font-size: 1.25rem;">
|
||||
{{ listing.condition }}</span>
|
||||
{{ listing.get_condition_display }}</span>
|
||||
<div>
|
||||
<div style="font-size: 0.875rem; color: var(--muted-text-color);">Condition</div>
|
||||
{% if listing.is_foil %}
|
||||
|
||||
@@ -146,7 +146,11 @@
|
||||
<span style="color: #64748b;">Out of Stock</span>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
<span id="stock-{{ card.uuid }}" class="stock-counter" data-card-id="{{ card.uuid }}" style="font-size: 0.75rem; color: #94a3b8; margin-left: auto;">...</span>
|
||||
{% if card.total_quantity > 0 %}
|
||||
<span style="font-size: 0.75rem; color: #10b981; margin-left: auto;">{{ card.total_quantity }} in stock</span>
|
||||
{% else %}
|
||||
<span style="font-size: 0.75rem; color: #ef4444; margin-left: auto;">Out of Stock</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
@@ -178,26 +182,5 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
const stockCounters = document.querySelectorAll('.stock-counter');
|
||||
stockCounters.forEach(counter => {
|
||||
const cardId = counter.getAttribute('data-card-id');
|
||||
fetch(`/store/api/stock/${cardId}/`)
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
if (data.total_stock > 0) {
|
||||
counter.textContent = `${data.total_stock} in stock`;
|
||||
counter.style.color = '#10b981'; // green
|
||||
} else {
|
||||
counter.textContent = 'Out of Stock';
|
||||
counter.style.color = '#ef4444'; // red
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
counter.textContent = 'Stock unknown';
|
||||
});
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user