<script setup lang="ts">
const { apiFetch } = useApi()
interface ApiEdital { ID: string; Numero: string; Orgao: string; Modalidade: string; Objeto: string; Plataforma: string; ValorEstimado: number; DataPublicacao: string; DataAbertura: string; Status: string }
const { data: todos } = await useAsyncData('editais-recurso', () => apiFetch<ApiEdital[]>('/editais'))
const editais = computed(() => (todos.value ?? []).filter(e => e.Status === 'recurso'))
</script>
<template>
  <div class="page">
    <AppTopbar title="Recurso" breadcrumb="Oportunidades · Recurso" />
    <div class="content"><div class="card"><EditaisTable :editais="editais" /></div></div>
  </div>
</template>
<style scoped>
.page { display: flex; flex-direction: column; height: 100vh; }
.content { padding: 20px 22px; flex: 1; overflow-y: auto; }
.card { background: white; border-radius: 11px; border: 1px solid #e2e8f0; overflow: hidden; }
</style>
