e47535d0fa
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
- Create usePWAInstall composable for install management - Add InstallPrompt banner component with auto-show after 3s - Add App Settings tab in settings page - Show install button with loading state - Display installation status and instructions - Handle dismissal with 7-day cooldown - Add iOS/Android installation guides - Show PWA features list - Display storage usage with visual progress - Auto-hide prompt after successful install Features: - Automatic install prompt after 3 seconds - Manual install from settings - Platform-specific instructions - Smart dismissal tracking - Storage info visualization Closes #35
76 lines
1.7 KiB
Vue
76 lines
1.7 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 #app>
|
|
<SettingsAppSettings />
|
|
</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: 'app',
|
|
label: 'App',
|
|
icon: 'i-heroicons-device-phone-mobile'
|
|
},
|
|
{
|
|
key: 'account',
|
|
label: 'Account',
|
|
icon: 'i-heroicons-user'
|
|
},
|
|
{
|
|
key: 'about',
|
|
label: 'About',
|
|
icon: 'i-heroicons-information-circle'
|
|
}
|
|
]
|
|
</script>
|