Hanzo_Dev/SIB
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix favorites system, add support for bus stops and tourist trips, and improve UI consistency

Browse Source
This commit is contained in:
Johan Samudio
2026-02-24 21:55:52 -05:00
parent 973483fa35
commit 4bf75d3302
7 changed files with 114 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
frontend/src/views/FavoritesView.vue
View File

@ -12,10 +12,11 @@ const selectedFilter = ref('all')
const filters = [
{ key: 'all', label: 'Todos', icon: 'star' },
{ key: 'routes', label: 'Rutas', icon: 'directions_bus' },
{ key: 'routes', label: 'Buses', icon: 'directions_bus' },
{ key: 'taxis', label: 'Taxis', icon: 'local_taxi' },
{ key: 'businesses',label: 'Negocios', icon: 'store' },
{ key: 'coupons', label: 'Eventos', icon: 'confirmation_number' },
{ key: 'businesses',label: 'Comercios', icon: 'store' },
{ key: 'coupons', label: 'Ofertas', icon: 'confirmation_number' },
{ key: 'stops', label: 'Paradas', icon: 'location_on' },
]
onMounted(async () => {
@ -34,9 +35,11 @@ async function removeFavorite(event: Event, itemType: string, itemId: string) {
}
function navigateToItem(item: any) {
if (item.item_type === 'route') router.push('/schedules')
if (item.item_type === 'route') router.push({ path: '/schedules', query: { routeId: item.item_id } })
else if (item.item_type === 'taxi') router.push('/taxi')
else if (item.item_type === 'business') router.push('/business/' + item.item_id)
else if (item.item_type === 'coupon') router.push('/coupons')
else if (item.item_type === 'stop') router.push({ path: '/map', query: { stopId: item.item_id } })
}
const visibleRoutes = computed(() =>
@ -51,11 +54,15 @@ const visibleBusinesses = computed(() =>
const visibleCoupons = computed(() =>
(selectedFilter.value === 'all' || selectedFilter.value === 'coupons') ? favoritesStore.coupons : []
)
const visibleStops = computed(() =>
(selectedFilter.value === 'all' || selectedFilter.value === 'stops') ? favoritesStore.stops : []
)
const totalFavorites = computed(() => favoritesStore.favorites.length)
const hasVisibleItems = computed(() =>
visibleRoutes.value.length + visibleTaxis.value.length +
visibleBusinesses.value.length + visibleCoupons.value.length > 0
visibleBusinesses.value.length + visibleCoupons.value.length +
visibleStops.value.length > 0
)
</script>
@ -206,20 +213,22 @@ const hasVisibleItems = computed(() =>
<section v-if="visibleCoupons.length > 0" class="fav-section">
<div class="section-label">
<span class="material-icons">confirmation_number</span>
<span>Eventos</span>
<span>Ofertas y Viajes</span>
</div>
<div class="card-list">
<div
v-for="item in visibleCoupons"
:key="item.id"
class="card card--row"
@click="navigateToItem(item)"
>
<div class="card-thumb card-thumb--event">
<span class="material-icons">local_activity</span>
<img v-if="item.item_image" :src="getImageUrl(item.item_image)" class="thumb-img" />
<span v-else class="material-icons">local_activity</span>
</div>
<div class="card-info">
<p class="card-name">{{ item.item_name }}</p>
<span class="badge-avail">Disponible</span>
<span class="badge-avail">Cupón</span>
</div>
<button class="heart-btn heart-btn--active" @click.stop="removeFavorite($event, item.item_type, item.item_id)" title="Quitar de favoritos">
<span class="material-icons">favorite</span>
@ -228,6 +237,33 @@ const hasVisibleItems = computed(() =>
</div>
</section>
<!-- ── PARADAS ── -->
<section v-if="visibleStops.length > 0" class="fav-section">
<div class="section-label">
<span class="material-icons">location_on</span>
<span>Paradas</span>
</div>
<div class="card-list">
<div
v-for="item in visibleStops"
:key="item.id"
class="card card--row"
@click="navigateToItem(item)"
>
<div class="card-thumb card-thumb--blue">
<span class="material-icons">location_on</span>
</div>
<div class="card-info">
<p class="card-name">{{ item.item_name }}</p>
<span class="badge-avail">Favorito</span>
</div>
<button class="heart-btn heart-btn--active" @click.stop="removeFavorite($event, item.item_type, item.item_id)">
<span class="material-icons">favorite</span>
</button>
</div>
</div>
</section>
</div>
</template>
</div>