feat: add search and filter UI for inventory (#66) #71
@@ -60,6 +60,7 @@ const { getInventory, deleteInventoryItem, updateQuantity } = useInventory()
|
||||
const props = defineProps<{
|
||||
refresh?: boolean
|
||||
tagFilters?: string[]
|
||||
searchQuery?: string
|
||||
}>()
|
||||
|
||||
const emit = defineEmits<{
|
||||
@@ -89,17 +90,27 @@ const loadInventory = async () => {
|
||||
|
||||
// Computed filtered items
|
||||
const filteredItems = computed(() => {
|
||||
if (!props.tagFilters || props.tagFilters.length === 0) {
|
||||
return items.value
|
||||
let result = items.value
|
||||
|
||||
// Filter by search query (case-insensitive)
|
||||
if (props.searchQuery && props.searchQuery.trim()) {
|
||||
const query = props.searchQuery.trim().toLowerCase()
|
||||
result = result.filter(item =>
|
||||
item.name.toLowerCase().includes(query)
|
||||
)
|
||||
}
|
||||
|
||||
// Filter items that have at least one of the selected tags
|
||||
return items.value.filter(item => {
|
||||
if (!item.tags || item.tags.length === 0) return false
|
||||
// Filter by tags
|
||||
if (props.tagFilters && props.tagFilters.length > 0) {
|
||||
result = result.filter(item => {
|
||||
if (!item.tags || item.tags.length === 0) return false
|
||||
|
||||
const itemTagIds = item.tags.map((t: any) => t.tag.id)
|
||||
return props.tagFilters!.some(filterId => itemTagIds.includes(filterId))
|
||||
})
|
||||
const itemTagIds = item.tags.map((t: any) => t.tag.id)
|
||||
return props.tagFilters!.some(filterId => itemTagIds.includes(filterId))
|
||||
})
|
||||
}
|
||||
|
||||
return result
|
||||
})
|
||||
|
||||
const handleDelete = async (id: string) => {
|
||||
|
||||
Reference in New Issue
Block a user