Merge pull request #229 from IFRCGo/bugfix/WN-274

WN-274,

Author: l-dufour

resources/assets/js/methods/index.js

@@ -126,14 +126,13 @@ export const methods = {
   },
   markdown: value => markdown.toHTML(value),
   getLangName: value => languages[value] ? languages[value].native : value,
-  hazardIcon (str, store) {
+  hazardIcon (str, hazardsList = []) {
     if (str === 'Create Hazard Type' || str === 'create') {
       return require('../../img/icons/[email protected]')
     }
 
     let hazardUrl = null
-    if (store) {
-      const hazardsList = store.getters['content/hazardsList']
+    if (hazardsList.length) {
       const hazard = hazardsList.find(h => h.name === str || h.icon === str)
       if (hazard) {
         hazardUrl = hazard.url

resources/assets/js/pages/content/editWhatnow.vue

@@ -32,7 +32,7 @@
                   <hr>
                   <div :class="`c-file-upload ${newHazardValidations.validated && (newHazardValidations.icon === false) ? 'is-invalid' : ''}`">
                     <label for="newHazardIcon" class="upload-label">
-                        <b-img :src="hazardIcon('create', this.$store)" class="upload-icon" width="60" height="60" alt="" role="presentation"></b-img>
+                        <b-img :src="hazardIcon('create', hazardsList)" class="upload-icon" width="60" height="60" alt="" role="presentation"></b-img>
                         <span class="upload-text">{{$t('hazard_type.create.upload_icon')}}</span>
                     </label>
 

resources/assets/js/pages/content/whatnow.vue

@@ -509,6 +509,7 @@ export default {
         this.attributionPublishing = false
         this.addingNewLanguage = false
         this.editing = false
+        this.languageToAdd = null
       } catch (e) {
         // Find index of translation we've just edited so we can find it in the response from the server
         this.updateErrors.indexError = this.attributionToEdit.translations.findIndex(translation => translation.languageCode === this.selectedLanguage)

resources/assets/js/pages/content/whatnowContentItem.vue

@@ -40,7 +40,7 @@
         <b-card-header header-tag="header" class="pl-2 pt-3 pb-3 pr-2 rounded-bottom" role="tab">
           <div class="d-flex justify-content-start align-items-center">
             <div>
-              <b-img :src="hazardIcon(content.eventType, this.$store)" class="rounded-circle" width="60" height="60"></b-img>
+              <b-img :src="hazardIcon(content.eventType, hazardsList)" class="rounded-circle" width="60" height="60"></b-img>
             </div>
             <div class="ml-2 rtl-mr-2">
               <h4 class="subtitle">{{ content.currentTranslation.title }}</h4>
@@ -116,7 +116,7 @@ import swal from 'sweetalert2'
 import WhatnowMessageCard from './whatnowMessageCard'
 
 export default {
-  props: ['selectedLanguage', 'content', 'isPromo', 'regionSlug', 'forceCreate', 'selectedSoc', 'disabled'],
+  props: ['selectedLanguage', 'content', 'isPromo', 'regionSlug', 'forceCreate', 'selectedSoc', 'disabled', 'hazardsList'],
   components: {
     WhatnowMessageCard,
   },

resources/assets/js/pages/content/whatnowList.vue

@@ -47,6 +47,7 @@
             :regionSlug="selectedRegion?.title"
             :selectedSoc="selectedSoc"
             :disabled="disabled"
+            :hazardsList="hazardsList"
             >
           </whatnow-content-item>
           <whatnow-content-item
@@ -61,6 +62,7 @@
             :forceCreate="true"
             :selectedSoc="selectedSoc"
             :disabled="disabled"
+            :hazardsList="hazardsList"
             >
           </whatnow-content-item>
         </transition-group>
@@ -112,6 +114,7 @@ export default {
   },
   mounted () {
     this.fetch()
+    this.fetchAllHazardTypes()
   },
   watch: {
     selectedLanguage: {
@@ -171,12 +174,20 @@ export default {
           }
         }
       }
-    }
+    },
+    async fetchAllHazardTypes() {
+      try {
+        await this.$store.dispatch('content/fetchHazardTypes')
+      } catch (e) {
+        this.$noty.error(this.$t('error_alert_text'))
+      }
+    },
   },
   computed: {
     ...mapGetters({
       user: 'auth/user',
-      currentContent: 'content/currentContent'
+      currentContent: 'content/currentContent',
+      hazardsList: 'content/hazardsList',
     }),
     hazardSelected (val) {
       return this.selectedHazard

resources/assets/js/pages/content/whatnowPreviewer.vue

@@ -17,7 +17,7 @@
         <div class="card-content">
             <div class="title-section">
             <div class="previsualizer-key-message-icon small-icon icon-spacing">
-              <b-img :src="hazardIcon(eventType, this.$store)" class="rounded-circle" width="40" height="40"></b-img>
+              <b-img :src="hazardIcon(eventType, hazardsList)" class="rounded-circle" width="40" height="40"></b-img>
             </div>
             <h4>{{title}}</h4>
           </div>
@@ -43,6 +43,7 @@
 </template>
 
 <script>
+import { mapGetters } from 'vuex'
 import html2canvas from 'html2canvas'
 import Loading from '../../components/Loading'
 import jsPDF from 'jspdf'
@@ -56,6 +57,9 @@ export default {
       loading: false,
     }
   },
+  mounted() {
+    this.fetchAllHazardTypes()
+  },
   methods: {
     async downloadAsPNG() {
       this.loading = true;
@@ -157,8 +161,19 @@ export default {
       } finally {
         this.loading = false;
       }
-    }
-
+    },
+    async fetchAllHazardTypes() {
+      try {
+        await this.$store.dispatch('content/fetchHazardTypes')
+      } catch (e) {
+        this.$noty.error(this.$t('error_alert_text'))
+      }
+    },
+  },
+  computed: {
+    ...mapGetters({
+      hazardsList: 'content/hazardsList',
+    })
   }
 }
 </script>

resources/assets/js/pages/view_data/whatnow.vue

@@ -17,7 +17,8 @@
 
     <b-row  v-if="hazardsList" class="ml-4 mr-4 pl-4 pr-4 pb-3 pt-3 selects-container d-flex align-items-center justify-content-start" v-show="selectedSoc">
       <b-col cols="auto" class="d-flex align-items-center">
-        <selectSociety :selected.sync="selectedSoc" :staynull="true" :dontfilter="true" @optionUpdated="watchOptionUpdated"></selectSociety>
+        <SimpleSelectSociety class="mr-3" v-model="selectedSoc" :societyList="filteredSocieties" :countryCode="countryCode">
+        </SimpleSelectSociety>
         <p class="ml-2 mb-0">{{ selectedSoc ? selectedSoc.label : 'Select a society' }}</p>
       </b-col>
       <b-col cols="auto" v-if="hazardsList" class="d-flex align-items-center">
@@ -55,12 +56,14 @@
 
 <script>
 import SelectSociety from '~/pages/content/selectSociety'
+import SimpleSelectSociety from '~/pages/content/simpleSocietyPicker'
 import WhatnowList from '~/pages/content/whatnowList'
 import { mapGetters } from 'vuex'
 import Spooky from '~/components/global/Spooky'
 import axios from 'axios'
 import PageBanner from '~/components/PageBanner'
 import { languages } from 'countries-list'
+import * as permissionsList from '../../store/permissions'
 
 export default {
   props: {
@@ -73,7 +76,8 @@ export default {
     SelectSociety,
     Spooky,
     WhatnowList,
-    PageBanner
+    PageBanner,
+    SimpleSelectSociety,
   },
   data () {
     return {
@@ -82,7 +86,8 @@ export default {
       loadingContent: false,
       currentTranslations: null,
       selectedHazard: null,
-      languages
+      languages,
+      currentLanguages: ['en'],
     }
   },
   watch: {
@@ -144,14 +149,20 @@ export default {
           }
           return flattened
         })
+        this.currentLanguages = this.selectedSoc.translations.map((transl) => transl.languageCode)
       }
+
     },
     watchOptionUpdated (val) {
-      console.log('watchOptionUpdated', val)
       if (!val) {
         this.$router.push({ path: '/data/whatnow' });
       }
     },
+    async getData() {
+      this.$store.dispatch('content/fetchOrganisations').then(() => {
+        this.selectedSoc = this.filteredSocieties.find((soc) => soc.countryCode === this.countryCode)
+      })
+    },
   },
   metaInfo () {
     return { title: this.$t('content.whatnow.whatnow') }
@@ -173,11 +184,19 @@ export default {
       locale: 'lang/locale',
       user: 'auth/user',
       currentContent: 'content/currentContent',
-      currentLanguages: 'content/currentLanguages',
-      societies: 'content/organisations'
+      societies: 'content/organisations',
     }),
     hazardsList () {
       return this.currentTranslations
+    },
+    filteredSocieties() {
+      if (this.user) {
+        if (this.can(this.user, permissionsList.ALL_ORGANISATIONS)) {
+          return this.societies
+        }
+        return this.societies.filter(soc => this.user.data.organisations.indexOf(soc.countryCode) !== -1)
+      }
+      return this.societies
     }
   }
 }