feat: add low-stock visual indicator to InventoryCard (#67)
Some checks failed
Deploy to Coolify / Code Quality (pull_request) Has been cancelled
Deploy to Coolify / Run Tests (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Development (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Production (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Test (pull_request) Has been cancelled
Pull Request Checks / Validate PR (pull_request) Has been cancelled
Some checks failed
Deploy to Coolify / Code Quality (pull_request) Has been cancelled
Deploy to Coolify / Run Tests (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Development (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Production (pull_request) Has been cancelled
Deploy to Coolify / Deploy to Test (pull_request) Has been cancelled
Pull Request Checks / Validate PR (pull_request) Has been cancelled
This commit is contained in:
@@ -72,6 +72,18 @@
|
|||||||
{{ expiryText }}
|
{{ expiryText }}
|
||||||
</UBadge>
|
</UBadge>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Low Stock Warning -->
|
||||||
|
<div v-if="isLowStock" class="text-xs">
|
||||||
|
<UBadge
|
||||||
|
color="orange"
|
||||||
|
variant="soft"
|
||||||
|
class="w-full justify-center"
|
||||||
|
>
|
||||||
|
<UIcon name="i-heroicons-exclamation-triangle" class="mr-1" />
|
||||||
|
Low stock ({{ item.quantity }}/{{ item.low_stock_threshold }})
|
||||||
|
</UBadge>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Action Buttons -->
|
<!-- Action Buttons -->
|
||||||
@@ -145,4 +157,10 @@ const expiryText = computed(() => {
|
|||||||
if (daysUntilExpiry.value === 1) return 'Expires tomorrow'
|
if (daysUntilExpiry.value === 1) return 'Expires tomorrow'
|
||||||
return `Expires in ${daysUntilExpiry.value} days`
|
return `Expires in ${daysUntilExpiry.value} days`
|
||||||
})
|
})
|
||||||
|
|
||||||
|
// Low stock detection
|
||||||
|
const isLowStock = computed(() => {
|
||||||
|
if (!props.item.low_stock_threshold) return false
|
||||||
|
return Number(props.item.quantity) <= Number(props.item.low_stock_threshold)
|
||||||
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user