<script setup>
    const termosDeUso = ref('')

    const loading = ref(true)

    const getConfigs = async () => {
        loading.value = true
        try {
            const res = await $api('/options/get', {
                method: 'GET',
                query: {
                    type: 'termos-politica-vagas'
                }
            })

            if (!res) return

            console.log('Res configss:', res)

            termosDeUso.value = res.find(c => c.type === 'termos-politica-vagas')?.value ?? ''
        } catch (error) {
            console.error('Error get configs:', error, error.response)

            termosDeUso.value = ''
        }

        
        loading.value = false
    }

    getConfigs()
</script>
<template>
    <div style="max-width: 1200px;" class="mx-auto">
        <VCard>
            <VCardText>
                <h2 class="text-primary">Termos de Uso e Políticas - Vagas</h2>
                <br>
                <VSkeletonLoader
                v-if="loading"
                type="paragraph"
              />
              <div
                v-else
                class="div-html-text"
                v-html="termosDeUso"
              />
            </VCardText>
        </VCard>
    </div>
</template>