52 lines
2.0 KiB
HTML
52 lines
2.0 KiB
HTML
<li>
|
|
<div class="departure">
|
|
<div class="departure__line">
|
|
<line-symbol :line="departure.line"/>
|
|
<div class="line__display">{{ departure.display }}</div>
|
|
</div>
|
|
|
|
<div class="departure__time">
|
|
<fa-layers v-if="!departure.estimated" class="mr-1" title="Czas rozkładowy, nieuwzględniający aktualnej sytuacji komunikacyjnej.">
|
|
<fa :icon="['far', 'clock']"/>
|
|
<fa :icon="['fas', 'exclamation-triangle']" transform="shrink-5 down-4 right-6"/>
|
|
</fa-layers>
|
|
|
|
<span :class="[ 'departure__time', 'departure__time--delayed']" v-if="timeDiffers">
|
|
{{ departure.scheduled.format('HH:mm') }}
|
|
</span>
|
|
<span class="badge" :class="[departure.delay < 0 ? 'badge-danger' : 'badge-warning']"
|
|
v-if="departure.delay < 0 || departure.delay > 30">
|
|
{{ departure.delay|signed }}s
|
|
</span>
|
|
|
|
<span class="departure__time">{{ time.format('HH:mm') }}</span>
|
|
</div>
|
|
|
|
<div class="departure__stop">
|
|
<fa :icon="['fal', 'sign']" fixed-width class="mr-1 flex-shrink-0"/>
|
|
<stop :stop="departure.stop"/>
|
|
|
|
<div class="stop__actions flex-space-left">
|
|
<button class="btn btn-action" @click="showTrip = !showTrip">
|
|
<fa :icon="['far', 'code-commit']" rotation="90" />
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<fold :visible="showTrip">
|
|
<div v-if="trip != null" class="trip" :class="[ `trip--${departure.line.type}` ]">
|
|
<ol class="trip__stops">
|
|
<li v-for="stop in trip.schedule" class="trip-stop">
|
|
<div class="trip-stop__marker"/>
|
|
<div class="trip-stop__description">
|
|
<stop :stop="stop.stop"/>
|
|
</div>
|
|
</li>
|
|
</ol>
|
|
</div>
|
|
<div v-else class="text-center">
|
|
<fa icon="spinner-third" pulse></fa>
|
|
</div>
|
|
</fold>
|
|
</li>
|