Melhorando ano dos jogos

This commit is contained in:
Gustavo Barbosa 2025-08-13 22:14:23 -03:00
parent 3448b07609
commit 863d98494f

View file

@ -1,6 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import Jogo, { estados, precos } from '@/modelo/Jogo'; import Jogo, { estados, precos } from '@/modelo/Jogo';
import { Column, DataTable, InputText, Select, type DataTableFilterMeta } from 'primevue'; import { Badge, Column, DataTable, InputText, Select, type DataTableFilterMeta } from 'primevue';
import { ref } from 'vue'; import { ref } from 'vue';
import ComponenteDeEstado from './ComponenteDeEstado.vue'; import ComponenteDeEstado from './ComponenteDeEstado.vue';
import ComponenteDePreco from './ComponenteDePreco.vue'; import ComponenteDePreco from './ComponenteDePreco.vue';
@ -29,16 +29,17 @@ function lojas(jogos: Jogo[]): string[] {
<Column field="nome" sortable header="Nome"> <Column field="nome" sortable header="Nome">
<template #filter="{ filterModel, filterCallback }"> <template #filter="{ filterModel, filterCallback }">
<InputText type="text" v-model="filterModel.value" @input="filterCallback()" /> <InputText type="text" v-model="filterModel.value" @input="filterCallback" />
</template> </template>
<template #body="{ data }"> <template #body="{ data }">
{{ data.nome }} <span v-if="data.ano">({{ data.ano }})</span> {{ data.nome }}
<Badge v-if="data.ano" :value="data.ano" severity="secondary" />
</template> </template>
</Column> </Column>
<Column field="estado" sortable header="Estado" :show-filter-menu="false"> <Column field="estado" sortable header="Estado" :show-filter-menu="false">
<template #filter="{ filterModel, filterCallback }"> <template #filter="{ filterModel, filterCallback }">
<Select v-model="filterModel.value" @change="filterCallback()" :options="estados" :show-clear="true"> <Select v-model="filterModel.value" @change="filterCallback" :options="estados" :show-clear="true">
<template #option="slotProps"> <template #option="slotProps">
<ComponenteDeEstado :estado="slotProps.option" /> <ComponenteDeEstado :estado="slotProps.option" />
</template> </template>
@ -51,14 +52,14 @@ function lojas(jogos: Jogo[]): string[] {
<Column field="loja" sortable header="Loja"> <Column field="loja" sortable header="Loja">
<template #filter="{ filterModel, filterCallback }"> <template #filter="{ filterModel, filterCallback }">
<Select v-model="filterModel.value" @change="filterCallback()" :options="lojas(jogos)" <Select v-model="filterModel.value" @change="filterCallback" :options="lojas(jogos)"
:show-clear="true"></Select> :show-clear="true"></Select>
</template> </template>
</Column> </Column>
<Column field="preco" sortable header="Preço"> <Column field="preco" sortable header="Preço">
<template #filter="{ filterModel, filterCallback }"> <template #filter="{ filterModel, filterCallback }">
<Select v-model="filterModel.value" @change="filterCallback()" :options="precos" :show-clear="true"> <Select v-model="filterModel.value" @change="filterCallback" :options="precos" :show-clear="true">
<template #value="{ value }"> <template #value="{ value }">
<ComponenteDePreco v-if="value" :preco="value" /> <ComponenteDePreco v-if="value" :preco="value" />
</template> </template>