-
Notifications
You must be signed in to change notification settings - Fork 47
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
✨ Improve StationAutocomplete + Departures in experimental (#2574)
- Loading branch information
Showing
11 changed files
with
441 additions
and
84 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
|
@@ -2,8 +2,6 @@ | |
|
||
namespace App\Http\Controllers\Frontend; | ||
|
||
|
||
|
||
use Illuminate\View\View; | ||
|
||
class VueFrontendController | ||
|
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,87 @@ | ||
export type departureEntry = { | ||
tripId: string; | ||
stop: HafasStop; | ||
when: string | null; | ||
plannedWhen: string | null; | ||
delay: number | null; | ||
platform: string | null; | ||
prognosisType: string; | ||
direction: string; | ||
provenance: any | null; | ||
line: HafasLine; | ||
remarks: any[]; | ||
origin: any; | ||
destination: HafasDestination; | ||
currentTripPosition: { | ||
type: string; | ||
latitude: number; | ||
longitude: number | ||
} | ||
cancelled: boolean|null|undefined; | ||
station: { | ||
id: number; | ||
ibnr: number; | ||
wikidata_id: null|any; | ||
ifopt_a: any|null; | ||
ifopt_b: any|null; | ||
ifopt_c: any|null; | ||
ifopt_d: any|null; | ||
ifopt_e: any|null; | ||
rilIdentifier: string|null; | ||
name: string; | ||
latitude: number|null; | ||
longitude: number|null; | ||
ifopt: any|null; | ||
} | ||
} | ||
|
||
export type HafasDestination = { | ||
type: string; | ||
id: string; | ||
name: string; | ||
location: HafasLocation; | ||
products: { | ||
[key: string]: boolean; | ||
} | ||
station: HafasStation; | ||
} | ||
|
||
export type HafasLine = { | ||
type: string; | ||
id: string; | ||
fahrtNr: string; | ||
name: string; | ||
public: any; | ||
adminCode: any; | ||
productName: any; | ||
mode: any; | ||
product: any; | ||
operator: any; | ||
} | ||
|
||
export type HafasStop = { | ||
type: string; | ||
id: string; | ||
name: string; | ||
location: HafasLocation; | ||
products: { | ||
[key: string]: boolean; | ||
} | ||
station: HafasStation | ||
} | ||
export type HafasStation = { | ||
type: string; | ||
id: string; | ||
name: string; | ||
location: HafasLocation; | ||
products: { | ||
[key: string]: boolean; | ||
} | ||
} | ||
|
||
export type HafasLocation = { | ||
type: string; | ||
id: string; | ||
latitude: number; | ||
longitude: number; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,17 @@ | ||
import {ShortStation} from "./Station"; | ||
|
||
export type User = { | ||
displayName: string, | ||
username: string, | ||
profilePicture: string, | ||
trainDistance: number, | ||
trainDuration: number, | ||
points: number, | ||
mastodonUrl: string|null, | ||
privateProfile: boolean, | ||
privacyHideDays: number, | ||
preventIndex: boolean, | ||
role: number, | ||
home: ShortStation, | ||
language: string | ||
}; |
35 changes: 35 additions & 0 deletions
35
resources/vue/components/Checkin/AutocompleteListEntry.vue
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,35 @@ | ||
<script lang="ts"> | ||
import {defineComponent} from 'vue' | ||
import {ShortStation} from "../../../types/Station"; | ||
export default defineComponent({ | ||
name: "AutocompleteListEntry", | ||
props: { | ||
station: { | ||
type: Object () as ShortStation, | ||
required: false | ||
}, | ||
text: { | ||
type: String, | ||
required: false | ||
}, | ||
prefix: { | ||
type: String, | ||
required: false | ||
} | ||
}, | ||
}) | ||
</script> | ||
|
||
<template> | ||
<li class="list-group-item autocomplete-item"> | ||
<a href="#" class="text-trwl"> | ||
<i v-show="prefix" :class="prefix"></i> | ||
{{ station?.name || text }} <span v-if="station?.rilIdentifier">({{ station.rilIdentifier }})</span> | ||
</a> | ||
</li> | ||
</template> | ||
|
||
<style scoped lang="scss"> | ||
|
||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,97 @@ | ||
<script lang="ts"> | ||
import {defineComponent} from 'vue' | ||
import ProductIcon from "../ProductIcon.vue"; | ||
import LineIndicator from "../LineIndicator.vue"; | ||
import {DateTime} from "luxon"; | ||
import {trans} from "laravel-vue-i18n"; | ||
import {departureEntry} from "../../../types/Departure"; | ||
export default defineComponent({ | ||
name: "StationBoardEntry", | ||
components: {LineIndicator, ProductIcon}, | ||
props: { | ||
item: { | ||
type: Object() as departureEntry, | ||
required: true | ||
}, | ||
station: { | ||
type: Object, | ||
required: true | ||
} | ||
}, | ||
methods: { | ||
trans, | ||
formatTime(time: any) { | ||
return DateTime.fromISO(time).toFormat("HH:mm"); | ||
}, | ||
}, | ||
computed: { | ||
isPast(): boolean { | ||
const when = this.item.when || this.item.plannedWhen; | ||
if (!when) { | ||
return false; | ||
} | ||
return DateTime.fromISO(when) < DateTime.now(); | ||
}, | ||
cancelled(): boolean { | ||
return this.item.cancelled || false; | ||
} | ||
}, | ||
}) | ||
</script> | ||
|
||
<template> | ||
<div class="card mb-1 dep-card" :class="{'past-card': isPast, 'cancelled-card': cancelled}"> | ||
<div class="card-body d-flex py-0"> | ||
<div class="col-1 align-items-center d-flex justify-content-center"> | ||
<ProductIcon :product="item.line.product"/> | ||
</div> | ||
<div class="col-2 align-items-center d-flex me-3 justify-content-center"> | ||
<span class="sr-only" v-if="cancelled">{{ trans("stationboard.stop-cancelled") }}</span> | ||
<LineIndicator | ||
:productName="item.line.product" | ||
:number="item.line.name !== null ? item.line.name : item.line.fahrtNr" | ||
/> | ||
</div> | ||
<div class="col align-items-center d-flex second-stop"> | ||
<div> | ||
<span class="fw-bold fs-6">{{ item.direction }}</span><br> | ||
<span v-if="item.stop.name !== station.name" class="text-muted small font-italic"> | ||
{{ trans("stationboard.dep") }} {{ item.stop.name }} | ||
</span> | ||
</div> | ||
</div> | ||
<div class="col-auto ms-auto align-items-center d-flex"> | ||
<div v-if="item.delay"> | ||
<span class="text-muted text-decoration-line-through"> | ||
{{ formatTime(item.plannedWhen) }}<br> | ||
</span> | ||
<span>{{ formatTime(item.when) }}</span> | ||
</div> | ||
<div v-else> | ||
<span>{{ formatTime(item.plannedWhen) }}</span> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
|
||
</template> | ||
|
||
<style scoped lang="scss"> | ||
@import "../../../sass/_variables.scss"; | ||
.dep-card { | ||
min-height: 4.25rem; | ||
} | ||
.past-card { | ||
opacity: 50%; | ||
} | ||
.cancelled-card { | ||
opacity: 50%; | ||
background-color: $red !important; | ||
color: $white; | ||
text-decoration: line-through; | ||
text-decoration-thickness: 2px; | ||
} | ||
</style> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.