Add Airline

src/renderer/components/AirportEdit.vue

@@ -1,5 +1,22 @@
 <template>
   <div v-if="airport">
+    <el-dialog
+      title="Add Airline"
+      :visible.sync="dialogVisible"
+      width="20%"
+      :before-close="handleClose">
+      <span>Add an selectable airline to {{ icao }} {{ name }}</span>
+          <el-input
+            placeholder="Please input airline"
+            v-model="airlineCode"
+            maxlength="3"
+          ></el-input>
+
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">Cancel</el-button>
+        <el-button type="primary" @click="addAirline">Confirm</el-button>
+      </span>
+    </el-dialog>
     <h1 class="leaflet-sidebar-header">{{ icao }} {{ name }}</h1>
     <div width="100%" >
         <el-row>
@@ -7,6 +24,7 @@
           <el-col :span="15">
             <el-tag v-for="item in airlines" :key="item.value">{{item.value}}</el-tag>
           </el-col>
+          <el-col :span="2"><el-button @click="dialogVisible = true" v-if="editing" ><i class="fas fa-plus"></i></el-button></el-col>
         </el-row>
     </div>
     <el-tabs v-model="activeTab" >
@@ -60,7 +78,7 @@
 
 export default {
     data () {
-      return {activeTab: 'first', editing: false}
+      return {activeTab: 'first', editing: false, dialogVisible: false, airlineCode: ''}
     },
     components: {
       Frequency, ParkingList
@@ -69,6 +87,10 @@ export default {
       setEditing (editing) {
         this.editing = editing
       },
+      addAirline () {
+        this.dialogVisible = false
+        this.$store.dispatch('addAirline', this.airlineCode)
+      },
       addFrequency () {
         this.$store.dispatch('addFrequency', {type: 'AWOS', value: 0})
       },
@@ -81,6 +103,8 @@ export default {
           return
         }
         this.editLayer = parent.$refs.editLayer
+      },
+      handleClose () {
       }
     },
     computed: {

src/renderer/store/modules/Airports.js

@@ -7,6 +7,7 @@ const SET_AIRPORTS = 'SET_AIRPORTS';
 const SET_UNFILTERED_AIRPORTS = 'SET_UNFILTERED_AIRPORTS';
 const RESET_AIRPORTS = 'RESET_AIRPORTS';
 const SET_CURRENT_AIRPORT = 'SET_CURRENT_AIRPORT';
+const UPDATE_CURRENT_AIRPORT = 'UPDATE_CURRENT_AIRPORT';
 
 const state = {
   airports: [], unfilteredairports:[], currentAirport: {}
@@ -21,6 +22,10 @@ const mutations = {
     });
     Vue.set(state, 'airports', state.airports.concat(airports));
   },
+  'UPDATE_CURRENT_AIRPORT' (state, airport) {
+    Vue.set(state, 'currentAirport', airport.properties);
+    idb.saveAirport(airport);
+  },
   SET_AIRPORTS (state, airports) {
     Vue.set(state, 'airports', airports);
   },
@@ -51,6 +56,23 @@ const actions = {
       console.error(error);
     }
   },
+  async addAirline(context, airlineCode) {
+    try {
+      airlineCode = airlineCode.toUpperCase()
+      let airports = await idb.getAirports();
+      let searchRegex = new RegExp(this.state.Airports.currentAirport.icao, 'i');
+      let airport = airports
+      .filter(point => typeof point.geometry.coordinates !== "undefined" )
+      .filter(a => searchRegex.test(a.properties.icao));
+      if (airport[0] !== undefined && !airport[0].properties.airlines.includes(airlineCode)) {
+        airport[0].properties.airlines.push(airlineCode);
+        airport[0].properties.airlines.sort();
+      }
+      context.commit(UPDATE_CURRENT_AIRPORT, airport[0]);            
+    } catch (error) {
+      console.error(error);      
+    }
+  },
   async setCurrentAirport(context, icao) {
     try {
       let airports = await idb.getAirports();