Show database callsign for first activators in case it is not the same (e.g. for activations with club callsigns)

src/components/FirstActivator.vue

@@ -0,0 +1,42 @@
+<template>
+  <span>
+    <router-link :to="makeActivatorLinkUserId(userId)"><strong>{{ callsign }}</strong></router-link>{{ databaseCallsign ? ' (' + databaseCallsign + ')' : '' }}
+  </span>
+</template>
+
+<script>
+import api from '../mixins/api.js'
+import utils from '../mixins/utils.js'
+
+export default {
+  name: 'FirstActivator',
+  props: {
+    callsign: String,
+    userId: Number
+  },
+  mixins: [utils, api],
+  methods: {
+    loadDatabaseCallsign () {
+      this.loadActivator(this.userId)
+        .then(activator => {
+          if (this.homeCallsign(this.callsign) !== this.homeCallsign(activator.callsign)) {
+            this.databaseCallsign = this.homeCallsign(activator.callsign)
+          }
+        })
+    }
+  },
+  mounted () {
+    this.loadDatabaseCallsign()
+  },
+  watch: {
+    userId () {
+      this.loadDatabaseCallsign()
+    }
+  },
+  data () {
+    return {
+      databaseCallsign: null
+    }
+  }
+}
+</script>

src/mixins/api.js

@@ -27,6 +27,12 @@ export default {
     },
     reorderPhotos (summitCode, filenames) {
       return this.axiosAuth.post(process.env.VUE_APP_API_URL + '/photos/summits/' + summitCode + '/reorder', { filenames })
+    },
+    loadActivator (userIdOrCallsign) {
+      return axios.get(process.env.VUE_APP_API_URL + '/activators/' + userIdOrCallsign)
+        .then(response => {
+          return response.data
+        })
     }
   }
 }

src/views/Activator.vue

@@ -106,7 +106,6 @@
 </template>
 
 <script>
-import axios from 'axios'
 import moment from 'moment'
 import utils from '../mixins/utils.js'
 import api from '../mixins/api.js'
@@ -340,10 +339,10 @@ export default {
       this.databaseError = false
 
       let loads = []
-      axios.get(process.env.VUE_APP_API_URL + '/activators/' + this.callsign)
-        .then(response => {
-          if (response) {
-            this.activator = response.data
+      this.loadActivator(this.callsign)
+        .then(activator => {
+          if (activator) {
+            this.activator = activator
             if (this.activator && this.activator.callsign !== this.callsign) {
               this.$router.replace('/activators/' + this.activator.callsign)
               return

src/views/Summit.vue

@@ -63,7 +63,7 @@
             <div v-if="firstActivations">
               <span v-if="firstActivations.activators.length == 1">First activation: </span>
               <span v-else>First day's activations: </span>
-              <span v-for="(activator, index) in firstActivations.activators" :key="activator.userId"><router-link :to="makeActivatorLinkUserId(activator.userId)"><strong>{{ activator.callsign }}</strong></router-link>{{ index !== firstActivations.activators.length - 1 ? ' & ' : '' }}</span>
+              <span v-for="(activator, index) in firstActivations.activators" :key="activator.userId"><FirstActivator :callsign="activator.callsign" :userId="activator.userId" />{{ index !== firstActivations.activators.length - 1 ? ' & ' : '' }}</span>
             <span class="has-text-grey"> on {{ firstActivations.date | formatActivationDate }}</span></div>
 
             <SummitAttributes :attributes="summit.attributes" />
@@ -131,6 +131,7 @@
 
 <script>
 import axios from 'axios'
+import api from '../mixins/api.js'
 import utils from '../mixins/utils.js'
 import smptracks from '../mixins/smptracks.js'
 import coverphoto from '../mixins/coverphoto.js'
@@ -153,6 +154,7 @@ import SpotsList from '../components/SpotsList.vue'
 import AlertsList from '../components/AlertsList.vue'
 import EditAlert from '../components/EditAlert.vue'
 import EditSpot from '../components/EditSpot.vue'
+import FirstActivator from '../components/FirstActivator.vue'
 import HikrIcon from '../assets/hikr.png'
 import SACIcon from '../assets/sac.png'
 import SotatrailsIcon from '../assets/sotatrails.png'
@@ -164,9 +166,9 @@ export default {
     summitCode: String
   },
   components: {
-    SummitDatabasePageLayout, MiniMap, SummitActivations, SummitAttributes, ResourceList, SummitRoutes, SummitPhotos, SummitVideos, PhotosUploader, Coordinates, Bearing, SummitPointsLabel, AltitudeLabel, SpotsList, AlertsList, EditAlert, EditSpot
+    SummitDatabasePageLayout, MiniMap, SummitActivations, SummitAttributes, ResourceList, SummitRoutes, SummitPhotos, SummitVideos, PhotosUploader, Coordinates, Bearing, SummitPointsLabel, AltitudeLabel, SpotsList, AlertsList, EditAlert, EditSpot, FirstActivator
   },
-  mixins: [utils, smptracks, coverphoto],
+  mixins: [utils, api, smptracks, coverphoto],
   computed: {
     locator () {
       if (!this.summit.coordinates) {