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

Refactor: Map UI improvements, ETA metrics, Schedule fixes, and Transport Detail styling

Browse Source
This commit is contained in:
Johan Samudio
2026-02-28 10:39:20 -05:00
parent 8d967814f9
commit 621da9e4c3
4 changed files with 163 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
frontend/src/views/SchedulesView.vue
View File

@ -56,7 +56,7 @@ function getScheduleDay(schedule: any): 'today' | 'tomorrow' | 'other' {
// Comparar con el tipo del horario
// Nota: Si el horario es 'todos', cuenta para hoy y mañana (pero priorizamos hoy si pides hoy)
const type = schedule.schedule_type || 'todos'
const type = (schedule.schedule_type as string) || 'todos'
const isToday = type === todayType || type === 'todos'
const isTomorrow = type === tomorrowType || type === 'todos'
@ -81,27 +81,35 @@ function getDayLabel(schedule: any): string {
// ── Filtrado de horarios
const filteredSchedules = computed(() => {
const now = new Date()
const tomorrow = new Date(now)
tomorrow.setDate(now.getDate() + 1)
const hhmmAhora = now.getHours() * 100 + now.getMinutes()
return scheduleStore.schedules.filter(s => {
const d = getScheduleDay(s)
const [hStr, mStr] = (s.departure_time || '00:00').split(':')
const h = parseInt(hStr || '0')
const m = parseInt(mStr || '0')
const hhmmSched = h * 100 + m
const isPassed = hhmmSched < hhmmAhora - 2 // margen de 2 min
const type = (s.schedule_type as string) || 'todos'
const todayType = (now.getDay() === 0 || now.getDay() === 6) ? 'weekend' : 'weekday'
const tomorrowType = (tomorrow.getDay() === 0 || tomorrow.getDay() === 6) ? 'weekend' : 'weekday'
const isActuallyToday = type === todayType || type === 'todos'
const isActuallyTomorrow = type === tomorrowType || type === 'todos'
// Filtro Hoy: Es hoy Y no ha pasado (o es de los que dice salir en este rango)
if (dayFilter.value === 'today') {
return d === 'today' && !isPassed
const [hStr, mStr] = (s.departure_time || '00:00').split(':')
const h = parseInt(hStr || '0')
const m = parseInt(mStr || '0')
const hhmmSched = h * 100 + m
const isPassed = hhmmSched < hhmmAhora - 2 // margen de 2 min
return isActuallyToday && !isPassed
}
// Filtro Mañana: Es mañana
// Filtro Mañana: Es mañana (sin importar si pasó la hora hoy)
if (dayFilter.value === 'tomorrow') {
return d === 'tomorrow'
return isActuallyTomorrow
}
// Filtro Todos: Mostrar todo sin importar si pasó o es otro día
// Filtro Todos: Mostrar todo
return true
})
})
@ -281,7 +289,7 @@ onUnmounted(() => {
v-for="(schedule, i) in filteredSchedules"
:key="schedule.id"
class="schedule-card"
:class="`schedule-card--${getBusStatus(schedule.departure_time)}`"
:class="dayFilter === 'today' ? `schedule-card--${getBusStatus(schedule.departure_time)}` : 'schedule-card--upcoming'"
>
<!-- Borde izquierdo decorativo -->
<div class="card-accent"></div>
@ -295,8 +303,8 @@ onUnmounted(() => {
<!-- Info -->
<div class="card-info">
<div class="card-top-row">
<span class="day-tag" :class="`day-tag--${getScheduleDay(schedule)}`">
{{ getDayLabel(schedule) }}
<span class="day-tag" :class="dayFilter === 'today' ? `day-tag--${getScheduleDay(schedule)}` : 'day-tag--tomorrow'">
{{ dayFilter === 'tomorrow' ? 'Mañana' : (dayFilter === 'all' ? getDayLabel(schedule) : getDayLabel(schedule)) }}
</span>
<span v-if="i === 0 && getBusStatus(schedule.departure_time) === 'departing'" class="departing-pulse">SALIENDO</span>
</div>
@ -308,11 +316,11 @@ onUnmounted(() => {
</div>
<!-- Badge estado -->
<div class="status-badge" :class="`status-badge--${getBusStatus(schedule.departure_time)}`">
<div class="status-badge" :class="dayFilter === 'today' ? `status-badge--${getBusStatus(schedule.departure_time)}` : 'status-badge--upcoming'">
<span class="material-icons status-icon">
{{ getBusStatus(schedule.departure_time) === 'departing' ? 'directions_run' :
getBusStatus(schedule.departure_time) === 'ontime' ? 'check_circle' :
getBusStatus(schedule.departure_time) === 'passed' ? 'history' : 'access_time' }}
{{ (dayFilter === 'today' && getBusStatus(schedule.departure_time) === 'departing') ? 'directions_run' :
(dayFilter === 'today' && getBusStatus(schedule.departure_time) === 'ontime') ? 'check_circle' :
(dayFilter === 'today' && getBusStatus(schedule.departure_time) === 'passed') ? 'history' : 'access_time' }}
</span>
</div>
</div>