Think have basic flight body inputs finally working.

src/components/FlightDialogBody.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="flight-body">
+
+    <p v-for="(para, key) in paragraphsList" :key="key">
+
+      <v-icon small color="warning" class="mr-1">
+        {{ infoIcon }}
+      </v-icon>
+      {{ para.text }}
+    </p>
+
+  </div>
+</template>
+
+<script>
+
+  import { mdiInformation } from '@mdi/js'
+
+  export default {
+    name: "FlightDialogBody",
+    props: {
+      body: {
+        type: String,
+        default: ''
+      },
+      lang: {
+        type: String,
+        default: 'en'
+      },
+    },
+
+    data () {
+      return {
+
+        infoIcon:  mdiInformation,
+        
+        paragraphsList: {}
+      }
+    },
+
+
+
+    watch: {
+
+      body () {
+
+        console.log("Watching 'body'")
+
+        const parasList = []
+
+        // Break double new lines into paragraphs
+        const paras = this.body.split(/\n\n/)
+        //console.log(paras)
+
+        // Parse out the optional 'icon' type.
+        for (const p of paras) {
+          const iconSplit = p.split('[location]');
+          if (iconSplit.length > 1) {
+            console.log("Has Location icon: " + iconSplit.length);
+            const obj = {"icon":"location", "text":iconSplit[1]}
+            parasList.push(obj)
+          }
+        }
+
+        console.log(parasList)
+
+
+
+        return parasList
+      },
+      
+    },
+
+
+
+
+  }
+</script>

src/components/LangMenu.vue

@@ -130,10 +130,3 @@ export default {
 
 </script>
 
-<style scoped>
-
-
-
-
-
-</style>

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
 
 

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..."
+       }
+    }
+ ]
+