76 lines
1.9 KiB
Vue
76 lines
1.9 KiB
Vue
<template>
|
|
<UDashboardPanel id="help">
|
|
<template #header>
|
|
<UDashboardNavbar :title="$t('help.pageTitle')">
|
|
<template #leading>
|
|
<UDashboardSidebarCollapse />
|
|
</template>
|
|
</UDashboardNavbar>
|
|
</template>
|
|
|
|
<template #body>
|
|
<div class="flex flex-col gap-6 w-full lg:max-w-4xl mx-auto p-6">
|
|
<!-- Introduction Card -->
|
|
<UCard>
|
|
<template #header>
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-highlighted">{{ $t('help.pageTitle') }}</h3>
|
|
<p class="text-sm text-muted mt-1">{{ $t('help.description') }}</p>
|
|
</div>
|
|
</template>
|
|
</UCard>
|
|
|
|
<!-- FAQ Section -->
|
|
<UCard>
|
|
<template #header>
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-highlighted">{{ $t('help.faq.title') }}</h3>
|
|
</div>
|
|
</template>
|
|
|
|
<UAccordion :items="faqItems" />
|
|
</UCard>
|
|
|
|
<!-- Support Section -->
|
|
<UCard>
|
|
<template #header>
|
|
<div>
|
|
<h3 class="text-lg font-semibold text-highlighted">{{ $t('help.support.title') }}</h3>
|
|
<p class="text-sm text-muted mt-1">{{ $t('help.support.description') }}</p>
|
|
</div>
|
|
</template>
|
|
|
|
<UButton :label="$t('help.support.contactLink')" to="/contact" icon="i-lucide-mail" />
|
|
</UCard>
|
|
</div>
|
|
</template>
|
|
</UDashboardPanel>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
definePageMeta({
|
|
layout: 'default'
|
|
})
|
|
|
|
const { t: $t } = useI18n()
|
|
|
|
const faqItems = computed(() => [
|
|
{
|
|
label: $t('help.faq.q1.question'),
|
|
content: $t('help.faq.q1.answer')
|
|
},
|
|
{
|
|
label: $t('help.faq.q2.question'),
|
|
content: $t('help.faq.q2.answer')
|
|
},
|
|
{
|
|
label: $t('help.faq.q3.question'),
|
|
content: $t('help.faq.q3.answer')
|
|
},
|
|
{
|
|
label: $t('help.faq.q4.question'),
|
|
content: $t('help.faq.q4.answer')
|
|
}
|
|
])
|
|
</script>
|