diff --git a/src/frontend/src/views/Main.vue b/src/frontend/src/views/Main.vue index 76ea051ba32a98317356601bcae7b648352a0521..fb9e9543e7cc2ba27947d39093d966a94e5b73ac 100644 --- a/src/frontend/src/views/Main.vue +++ b/src/frontend/src/views/Main.vue @@ -177,7 +177,7 @@ :key="trip.id" :trip="trip" class="md:m-8 m-4" - @click="selectTrip(trip.id)" + @click="selectTrip(trip)" /> </div> </div> @@ -190,8 +190,8 @@ <trip-detail ref="trip-comp" :trip-id="selectedTripId" - :trip-start="startCity" - :trip-end="endCity" + :trip-start="startingCity" + :trip-end="endingCity" /> </card-popup> </div> @@ -323,7 +323,7 @@ export default { CardPopup }, data() { - return { lang: Lang.CurrentLang, trips: [], startCity: {}, endCity: {}, selectedTripId: null } + return { lang: Lang.CurrentLang, trips: [], startCity: {}, endCity: {}, startingCity: null, endingCity: null, selectedTripId: null } }, mounted() { Lang.AddCallback(lang => this.lang = lang); @@ -472,11 +472,15 @@ export default { }); } }, - selectTrip(id) { - this.$refs["trip-comp"].setPopup(this.$refs["trip-details"]); + selectTrip(trip) { this.selectedTripId = null; - this.selectedTripId = id; + this.selectedTripId = trip.id; + + this.startingCity = {value: trip.startCity}; + this.endingCity = {value: trip.endCity}; + const popup = this.$refs["trip-details"]; + this.$refs["trip-comp"].setPopup(popup); popup.show(); }, onpopupcancel(popup) {