<script setup>
import { defineAsyncComponent } from 'vue';
import MelissaConfigPage from './MelissaConfigPage.vue';

const AddonsExtratoPage = defineAsyncComponent(
    () => import('@/layout/configuracoes/AddonsExtratoPage.vue')
);

const emit = defineEmits(['close']);

const faq = [
    { icon: 'pi pi-filter',   label: 'Período',   text: 'Filtre por mês, últimos 90 dias ou intervalo personalizado.' },
    { icon: 'pi pi-tag',      label: 'Tipo',      text: 'Cruze por SMS, e-mail, servidor ou domínio.' },
    { icon: 'pi pi-download', label: 'Exportar',  text: 'CSV, PDF ou Excel — imutável e auditável (LGPD).' }
];
</script>

<template>
    <MelissaConfigPage
        title="Extrato de Recursos Extras"
        icon="pi pi-list"
        subtitle="Histórico de débitos e créditos dos seus recursos extras (SMS, e-mail, etc). Exportável em CSV, PDF ou Excel."
        faq-sub="Movimentações"
        :faq="faq"
        @close="emit('close')"
    >
        <AddonsExtratoPage />
    </MelissaConfigPage>
</template>
