d4d3d9390c
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
Issue #30 - TagManager component: - Create/delete tags with name, category, icon, color - Color picker with hex input - Organized display by category - Integrated in settings page with tabs Issue #31 - Tag filter for inventory: - TagFilter component with multi-select - Filter button in inventory header - Active filter display with removable badges - Filters items by selected tags (OR logic) - Clean "Clear" button Updates: - Extended useTags composable with createTag, deleteTag - Enhanced settings page with tab navigation - Improved inventory filtering UX Closes #30, #31
67 lines
1.5 KiB
Vue
67 lines
1.5 KiB
Vue
<template>
|
|
<div>
|
|
<h1 class="text-3xl font-bold text-gray-900 mb-6">Settings</h1>
|
|
|
|
<UTabs :items="tabs" v-model="activeTab">
|
|
<template #account>
|
|
<UCard class="mt-4">
|
|
<div class="space-y-4">
|
|
<h3 class="text-lg font-semibold">Account Settings</h3>
|
|
<p class="text-gray-600">Account management will be implemented in future updates.</p>
|
|
</div>
|
|
</UCard>
|
|
</template>
|
|
|
|
<template #tags>
|
|
<div class="mt-4">
|
|
<TagsTagManager />
|
|
</div>
|
|
</template>
|
|
|
|
<template #about>
|
|
<UCard class="mt-4">
|
|
<div class="space-y-4">
|
|
<h3 class="text-lg font-semibold">About Pantry</h3>
|
|
<p class="text-gray-600">Version 0.1.0 (MVP)</p>
|
|
<p class="text-gray-600">Self-hosted pantry management app with barcode scanning.</p>
|
|
<UButton
|
|
to="https://github.com/pantry-app/pantry"
|
|
target="_blank"
|
|
color="gray"
|
|
variant="soft"
|
|
>
|
|
View on GitHub
|
|
</UButton>
|
|
</div>
|
|
</UCard>
|
|
</template>
|
|
</UTabs>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
definePageMeta({
|
|
layout: 'default'
|
|
})
|
|
|
|
const activeTab = ref('tags')
|
|
|
|
const tabs = [
|
|
{
|
|
key: 'tags',
|
|
label: 'Tags',
|
|
icon: 'i-heroicons-tag'
|
|
},
|
|
{
|
|
key: 'account',
|
|
label: 'Account',
|
|
icon: 'i-heroicons-user'
|
|
},
|
|
{
|
|
key: 'about',
|
|
label: 'About',
|
|
icon: 'i-heroicons-information-circle'
|
|
}
|
|
]
|
|
</script>
|