From fa4526a8b87d0744e10f6f1156a4f419ca89f2ec Mon Sep 17 00:00:00 2001 From: Chris Banford Date: Wed, 11 Oct 2023 11:07:27 +0200 Subject: [PATCH] Think have basic flight body inputs finally working. --- src/components/FlightDialogBody.vue | 78 ++++++++++++++++ src/components/LangMenu.vue | 7 -- src/store/storex.js | 61 +++++++++++- src/store/test.json | 36 +++++++ src/views/Step_Start.vue | 139 ++++++++++++++++------------ 5 files changed, 255 insertions(+), 66 deletions(-) create mode 100644 src/components/FlightDialogBody.vue create mode 100644 src/store/test.json diff --git a/src/components/FlightDialogBody.vue b/src/components/FlightDialogBody.vue new file mode 100644 index 00000000..f296311d --- /dev/null +++ b/src/components/FlightDialogBody.vue @@ -0,0 +1,78 @@ + + + diff --git a/src/components/LangMenu.vue b/src/components/LangMenu.vue index 2a4e773f..39158690 100644 --- a/src/components/LangMenu.vue +++ b/src/components/LangMenu.vue @@ -130,10 +130,3 @@ export default { - \ No newline at end of file diff --git a/src/store/storex.js b/src/store/storex.js index 6618ef7a..dab13253 100644 --- a/src/store/storex.js +++ b/src/store/storex.js @@ -12,6 +12,9 @@ import navigation from './modules/nav' // ----------------- +import testFlightData from "./test.json"; + + //import { format, add, sub, parseISO, isAfter, isBefore, isEqual } from 'date-fns' // import { format, add, isBefore, parseISO } from 'date-fns' @@ -444,6 +447,10 @@ export default new Vuex.Store({ // ******************** API: Flight Options ******************** // This needs to return a json object listing each flight's id, name and price in CHF. async flightOptions(context) { + + // console.log("testFlightData on load - before: " + testFlightData) + // console.log("flightDate on load - before: " + context.state.flightDate) + // Return if the date is not set/valid. const flDate = context.state.flightDate; if (flDate === '') return @@ -452,7 +459,18 @@ export default new Vuex.Store({ // Setup dev/live API call to Tommy. let apiPath = "https://bookings.simpleitsolutions.ch/api/flightoptions/" + flDate - if (context.state._DEV === true) apiPath = "https://bookings-dev.simpleitsolutions.ch/api/flightoptions/" + flDate + //if (context.state._DEV === true) apiPath = "https://bookings-dev.simpleitsolutions.ch/api/flightoptions/" + flDate + + + // local test data until Tom delivers. + if (context.state._DEV === true) { + //console.log("testFlightData on load: " + testFlightData) + context.commit("FLIGHTS_LIST", testFlightData) + context.commit("FLIGHTSLIST_LOADING", false) + return + } + + //console.log("Loading Flight Options for drop menu Step 1 ->", flDate); return axios.get(apiPath) @@ -971,10 +989,51 @@ export default new Vuex.Store({ // Return the matching flight object, otherwise 'undefined' getFlightObjById: (state) => () => { + if (state._flightsList === undefined || state._flightsList === null) return let flightObj = state._flightsList.find(_flightsList => _flightsList.id === state.selectedFlight) + if (flightObj === undefined || flightObj === null) return return flightObj }, + getFlightName: (state) => () => { + if (state._flightsList === undefined || state._flightsList === null || Object.keys(state._flightsList).length === 0) return + let flightObj = state._flightsList.find(_flightsList => _flightsList.id === state.selectedFlight) + if (flightObj === undefined || flightObj === null) return + return flightObj.name + }, + + + +/* eslint-disable */ + getFlightRawBodyObj: (state) => () => { + // //if (state._flightsList === undefined || state._flightsList === null || Object.keys(state._flightsList).length === 0) return -1 + // let flightObj = state._flightsList.find(_flightsList => _flightsList.id === state.selectedFlight) + // if (flightObj === undefined || flightObj === null) return + // //console.log(flightObj) + // return flightObj.body + + + //console.log("state.flightslist ***********") + //console.log(state.selectedFlight) + //console.log(state._flightsList) + + // if we have a valid Array then loop through looking for the matching Flight Object's body. + for (const flghtObj of state._flightsList) { + //console.log(flghtObj) + if (flghtObj.id === state.selectedFlight ) { + console.log("Found Flight obj:") + console.log(flghtObj) + return flghtObj.body + } + } + + + return null + }, + + + + } // END GETTERS diff --git a/src/store/test.json b/src/store/test.json new file mode 100644 index 00000000..945b3d82 --- /dev/null +++ b/src/store/test.json @@ -0,0 +1,36 @@ +[ + { + "id":39, + "name":"Scenic", + "price":"190.00", + "body": { + "en": "[location] We fly the Scenic from both Blauherd and Riffelberg. We try and choose the location that we feel will have the best conditions for your specific booking time. \n\n[star] We fly the Scenic in the Spring, Summer and Autumn, from Riffelberg/Blauherd (there is too much snow in winter forthese lower take off areas). \n\n[info]If you book the early morning (08:00) flight, we ask that you be be fairly fit, confident and not too heavy.", + "de": "[location] DE...", + "fr": "[location] FR...", + "ko": "[location] KO..." + } + }, + { + "id":38, + "name":"Classic High", + "price":"240.00", + "body": { + "en": "The best time for the Classic High is in the mornings. It is often also possible to do this flight in the afternoon, but it depends on the day's conditions. \n\nWe fly the Classic High the entire year, in the summer from Rothorn and in the spring/autumn, from Gornergrat and/or Rotenboden. \n\nIf you book the early morning (08:00) flight, we ask that you be be fairly fit, confident and not too heavy.", + "de": "[location] DE...", + "fr": "[location] FR...", + "ko": "[location] KO..." + } + }, + { + "id":40, + "name":"Elite", + "price":"420.00", + "body": { + "en": "The Elite flight is the highest tandem take off in the Alps - this makes for an amazing flight, but also means that both weather and snow conditions have to be just right. Winds are often strong at this altitude and our take off areas are on glacier/snow - because of this we try and do this flight early in the morning when conditions are the best. \n\n[location] We fly the Elite over the entire year, when ever wind and snow conditions allow. \n\nIf you book the Elite, we ask that you are happy to do the Classic High flight as a back-up - in case the conditions don't allow us to fly from Klein Matterhorn. \n\n[star]The Elite flight also requires passengers to be fairly fit, confident and not too heavy.", + "de": "[location] DE...", + "fr": "[location] FR...", + "ko": "[location] KO..." + } + } + ] + diff --git a/src/views/Step_Start.vue b/src/views/Step_Start.vue index 625e22bc..16068a6b 100644 --- a/src/views/Step_Start.vue +++ b/src/views/Step_Start.vue @@ -122,30 +122,28 @@ - + {{$t('step-start.flightInfo')}} - - - Classic + Heli Fly - - - Elite - - - Classic High - - - Scenic + + + {{ flightName }} -
+ + + + + + + -
+ -
+ @@ -281,7 +279,7 @@ - + @@ -371,12 +369,15 @@ import { mdiInformation, mdiArrowRightBoldCircleOutline, mdiCheckCircleOutline, import i18n from '@/i18n' import PageHeader from '@/components/PageHeader.vue' +import FlightDialogBody from '@/components/FlightDialogBody.vue' + //const VueScrollTo = require('vue-scrollto'); export default { name: 'Start', components: { - PageHeader + PageHeader, + FlightDialogBody }, props: {}, @@ -400,7 +401,7 @@ export default { nrPeopleEnabled: false, bigGroupDialog: false, - eliteDialog: false, + flightInfoDialog: false, photosVideoDialog: false, hoverPhotoVidsCarousel: true, @@ -411,10 +412,10 @@ export default { // flightMenu: false, departMenu: false, - isHeliClassic: false, - isKlein: false, - isClassic: false, - isScenic: false, + // isHeliClassic: false, + // isKlein: false, + // isClassic: false, + // isScenic: false, myLocal: enGB, // default date-fns locale @@ -455,6 +456,7 @@ export default { if (this.$i18n.locale === 'en') this.myLocal = enGB if (this.$i18n.locale === 'de') this.myLocal = de if (this.$i18n.locale === 'ko') this.myLocal = ko + //console.log(this.myLocal) }, @@ -462,6 +464,27 @@ export default { computed: { + + flightBodyStr: function () { + const obj = this.$store.getters.getFlightRawBodyObj() + //console.log('flightBodyStr before null check: ' + obj) + if (obj == null || obj == undefined) return '' + console.log('------ flightBodyStr: ') + console.log(obj[this.currLang]) + return obj[this.currLang] + }, + + + currLang: function () { + var lang = this.$store.state.locale + console.log("Grabbing curr lang: " + lang) + if (lang == '' || lang == undefined) lang = 'en' // set default, as empty throws errors later on. + return lang + }, + flightName: function () { + return this.$store.getters.getFlightName() + }, + hasValidFlightDate: function () { if ( isAfter( sub(parseISO(this.flightDate), {days: -1}), Date.now() ) ) { return true @@ -702,7 +725,7 @@ export default { closeFlightDialog () { - this.eliteDialog = false + this.flightInfoDialog = false this.scrollToId('#arriveInput') }, @@ -715,38 +738,38 @@ export default { } // check if user selected the Elite flight and if yes, show info dialog. - this.eliteDialog = true - - - // Classic + Heli - if (this.$store.state.selectedFlight === 41) { - this.isHeliClassic = true, - this.isKlein = false, - this.isClassic = false, - this.isScenic = false - } - - // Klein - if (this.$store.state.selectedFlight === 40) { - this.isHeliClassic = false, - this.isKlein = true, - this.isClassic = false, - this.isScenic = false - } - // Classic - if (this.$store.state.selectedFlight === 38) { - this.isHeliClassic = false, - this.isKlein = false, - this.isClassic = true, - this.isScenic = false - } - // Scenic - if (this.$store.state.selectedFlight === 39) { - this.isHeliClassic = false, - this.isKlein = false, - this.isClassic = false, - this.isScenic = true - } + this.flightInfoDialog = true + + + // // Classic + Heli + // if (this.$store.state.selectedFlight === 41) { + // this.isHeliClassic = true, + // this.isKlein = false, + // this.isClassic = false, + // this.isScenic = false + // } + + // // Klein + // if (this.$store.state.selectedFlight === 40) { + // this.isHeliClassic = false, + // this.isKlein = true, + // this.isClassic = false, + // this.isScenic = false + // } + // // Classic + // if (this.$store.state.selectedFlight === 38) { + // this.isHeliClassic = false, + // this.isKlein = false, + // this.isClassic = true, + // this.isScenic = false + // } + // // Scenic + // if (this.$store.state.selectedFlight === 39) { + // this.isHeliClassic = false, + // this.isKlein = false, + // this.isClassic = false, + // this.isScenic = true + // } },