|
|
@@ -111,6 +111,58 @@
|
|
|
<!-- Row 3: Bottom -->
|
|
|
<div class="row q-col-gutter-md items-stretch">
|
|
|
<div class="col-12 col-md-5">
|
|
|
+ <q-card flat class="card-ring full-height feriados-card">
|
|
|
+ <div class="flex justify-between items-center no-wrap q-mb-sm">
|
|
|
+ <span class="text-subtitle2 text-weight-regular">Feriados do mês</span>
|
|
|
+ <q-btn
|
|
|
+ flat
|
|
|
+ round
|
|
|
+ dense
|
|
|
+ icon="mdi-calendar-star"
|
|
|
+ color="grey-5"
|
|
|
+ @click="openFeriadosDialog"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <q-btn
|
|
|
+ unelevated
|
|
|
+ color="primary"
|
|
|
+ label="Nova data"
|
|
|
+ no-caps
|
|
|
+ class="full-width q-mb-md"
|
|
|
+ @click="openFeriadosDialog"
|
|
|
+ />
|
|
|
+
|
|
|
+ <div v-if="feriadosLoading" class="flex flex-center q-py-md">
|
|
|
+ <q-spinner color="primary" size="24px" />
|
|
|
+ </div>
|
|
|
+ <div v-else-if="feriadosMes.length === 0" class="text-caption text-grey-5 text-center q-mt-sm">
|
|
|
+ Nenhum feriado neste mês.
|
|
|
+ </div>
|
|
|
+ <div v-else class="row q-gutter-sm">
|
|
|
+ <div
|
|
|
+ v-for="feriado in feriadosMes"
|
|
|
+ :key="feriado.id"
|
|
|
+ class="column items-center cursor-pointer"
|
|
|
+ style="min-width: 52px"
|
|
|
+ @click="openEditFromDashboard(feriado)"
|
|
|
+ >
|
|
|
+ <q-badge
|
|
|
+ color="deep-orange"
|
|
|
+ class="text-subtitle1 text-bold q-pa-sm"
|
|
|
+ style="min-width: 40px; justify-content: center"
|
|
|
+ >
|
|
|
+ {{ feriado.dia }}
|
|
|
+ </q-badge>
|
|
|
+ <div class="text-caption q-mt-xs text-center">
|
|
|
+ {{ feriado.nome }}
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </q-card>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="col-12 col-md-4">
|
|
|
<DashboardChartCard title="Matrículas por Período" style="height: 100%">
|
|
|
<GroupedBarChart
|
|
|
:labels="matriculasChart.labels"
|
|
|
@@ -125,63 +177,8 @@
|
|
|
</DashboardChartCard>
|
|
|
</div>
|
|
|
|
|
|
- <div class="col-12 col-md-4">
|
|
|
- <AniversariantesCard :people="aniversariantes" style="height: 100%" />
|
|
|
- </div>
|
|
|
-
|
|
|
<div class="col-12 col-md-3">
|
|
|
- <q-card flat bordered class="full-height">
|
|
|
- <q-card-section class="row justify-between items-center q-pb-xs">
|
|
|
- <span class="text-subtitle2 text-weight-medium"
|
|
|
- >Feriados do mês</span
|
|
|
- >
|
|
|
- <q-btn
|
|
|
- flat
|
|
|
- round
|
|
|
- dense
|
|
|
- icon="mdi-calendar-star"
|
|
|
- color="grey-5"
|
|
|
- @click="openFeriadosDialog"
|
|
|
- />
|
|
|
- </q-card-section>
|
|
|
- <q-separator />
|
|
|
- <q-card-section class="q-pt-md">
|
|
|
- <q-btn
|
|
|
- unelevated
|
|
|
- color="primary"
|
|
|
- label="Nova data"
|
|
|
- no-caps
|
|
|
- class="full-width q-mb-md"
|
|
|
- @click="openFeriadosDialog"
|
|
|
- />
|
|
|
- <div v-if="feriadosLoading" class="flex flex-center q-py-md">
|
|
|
- <q-spinner color="primary" size="24px" />
|
|
|
- </div>
|
|
|
- <div v-else-if="feriadosMes.length === 0" class="text-caption text-grey-5 text-center">
|
|
|
- Nenhum feriado neste mês.
|
|
|
- </div>
|
|
|
- <div v-else class="row q-gutter-sm">
|
|
|
- <div
|
|
|
- v-for="feriado in feriadosMes"
|
|
|
- :key="feriado.id"
|
|
|
- class="column items-center cursor-pointer"
|
|
|
- style="min-width: 52px"
|
|
|
- @click="openEditFromDashboard(feriado)"
|
|
|
- >
|
|
|
- <q-badge
|
|
|
- color="deep-orange"
|
|
|
- class="text-subtitle1 text-bold q-pa-sm"
|
|
|
- style="min-width: 40px; justify-content: center"
|
|
|
- >
|
|
|
- {{ feriado.dia }}
|
|
|
- </q-badge>
|
|
|
- <div class="text-caption q-mt-xs text-center">
|
|
|
- {{ feriado.nome }}
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </q-card-section>
|
|
|
- </q-card>
|
|
|
+ <AniversariantesCard :people="aniversariantes" style="height: 100%" />
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -360,6 +357,7 @@ const feriadosMes = computed(() => {
|
|
|
holiday_date: h.holiday_date,
|
|
|
description: h.description,
|
|
|
type: h.type,
|
|
|
+ base_holiday_id: h.base_holiday_id ?? null,
|
|
|
}));
|
|
|
});
|
|
|
|
|
|
@@ -429,4 +427,11 @@ onMounted(() => {
|
|
|
text-align: center;
|
|
|
pointer-events: none;
|
|
|
}
|
|
|
+
|
|
|
+.feriados-card {
|
|
|
+ border-radius: 12px;
|
|
|
+ padding: 20px 24px;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+}
|
|
|
</style>
|