Improved early warning and probability maps

Author: epou

quasar.conf.js

@@ -79,17 +79,16 @@ module.exports = configure(function (ctx) {
     devServer: {
       https: false,
       // port: 8080,
-      open: true // opens browser window automatically
-      // proxy: {
-      //   // proxy all requests starting with /api to jsonplaceholder
-      //   '/django': {
-      //     target: 'http://192.168.1.47:8000/',
-      //     changeOrigin: true,
-      //     pathRewrite: {
-      //       '^/django': ''
-      //     }
-      //   }
-      // }
+      open: true, // opens browser window automatically
+      proxy: {
+        '/api_v1_prod': {
+          target: 'https://api.mosquitoalert.com/',
+          changeOrigin: true,
+          pathRewrite: {
+            '^/api_v1_prod': 'v1/map/'
+          },
+        }
+      },
     },
 
     // https://quasar.dev/quasar-cli/quasar-conf-js#Property%3A-framework

src/components/CustControl.vue

@@ -6,6 +6,7 @@
   <div :class="className">
     <button
       :title="trans(titleText)"
+      :disabled="isDisabled"
       @click.stop="buttonClicked"
     >
       <i :class="faIcon"></i>
@@ -18,10 +19,14 @@ import { computed } from 'vue'
 import { useStore } from 'vuex'
 
 export default {
-  props: ['class', 'icon', 'title'],
+  props: ['class', 'icon', 'title', 'disabled'],
   emits: ['clicked'],
   setup (props, context) {
     const $store = useStore()
+    const isDisabled = computed(() => {
+      return props.disabled
+    })
+
     const className = computed(() => {
       return props.class
     })
@@ -45,6 +50,7 @@ export default {
     return {
       trans,
       className,
+      isDisabled,
       faIcon,
       titleText,
       buttonClicked

src/components/FaThinButtonRouter.vue

@@ -5,7 +5,7 @@
 
 <template>
   <div class="tab-link-container" :class="isButtonDisabled?'disabled':''">
-    <router-link v-if="!isButtonDisabled" class="main-menu-item" :id="Id" :to="toLink">
+    <router-link v-if="!isButtonDisabled" class="main-menu-item" :id="Id" :to="{'name': routeName, params: {'lang': language}}">
       <button class="fa-thin-button" :class="classProp" :title="label">
         <i :class="iconCode"></i>
       </button>
@@ -20,18 +20,17 @@
 
 <script>
 import { computed } from 'vue'
+import { useStore } from 'vuex'
 
 export default {
-  props: ['name', 'label', 'link', 'class', 'item', 'id'],
+  props: ['name', 'label', 'routeName', 'class', 'item', 'id'],
   setup (props) {
+    const $store = useStore()
+
     const Id = computed(() => {
       return props.id
     })
 
-    const toLink = computed(() => {
-      return props.link
-    })
-
     const iconCode = computed(() => {
       return props.name
     })
@@ -44,12 +43,16 @@ export default {
       return props.class.toLowerCase().indexOf('disabled') > -1
     })
 
+    const language = computed(() => {
+      return $store.getters['app/getLang']
+    })
+
     return {
       Id,
-      toLink,
       iconCode,
       classProp,
-      isButtonDisabled
+      isButtonDisabled,
+      language
     }
   }
 }

src/components/LeftDrawer.vue

@@ -394,10 +394,13 @@ export default {
 
 .toc-title-reports{
   font-family: 'Roboto';
-  text-transform: Capitalize;
   font-weight: 700;
   color: #666666;
 }
+.toc-title-reports::first-letter{
+  text-transform: uppercase;
+}
+
 .toc-title{
   font-family: 'Roboto';
   text-transform: uppercase;