translate units

server/controllers/auth.go

@@ -115,7 +115,7 @@ func userLogin(c *gin.Context) {
 		Email:        user.Email,
 		Token:        token,
 		RefreshToken: refreshToken,
-		Role:         user.RoleDetail().Long,
+		Role:         user.RoleDetail().Key,
 	}
 	c.JSON(http.StatusOK, response)
 }
@@ -149,7 +149,7 @@ func refresh(c *gin.Context) {
 				Email:        user.Email,
 				Token:        token,
 				RefreshToken: refreshToken,
-				Role:         user.RoleDetail().Long,
+				Role:         user.RoleDetail().Key,
 			}
 			c.JSON(http.StatusOK, response)
 		} else {

server/db/enums.go

@@ -52,75 +52,58 @@ const (
 )
 
 type EnumDetail struct {
-	Short string `json:"short"`
+	Key string `json:"key"`
-	Long  string `json:"long"`
 }
 
 var FuelUnitDetails map[FuelUnit]EnumDetail = map[FuelUnit]EnumDetail{
 	LITRE: {
-		Short: "Lt",
+		Key:  "litre",
-		Long:  "litre",
 	},
 	GALLON: {
-		Short: "Gal",
+		Key:  "gallon",
-		Long:  "gallon",
 	}, KILOGRAM: {
-		Short: "Kg",
+		Key:  "kilogram",
-		Long:  "kilogram",
 	}, KILOWATT_HOUR: {
-		Short: "KwH",
+		Key:  "kilowatthour",
-		Long:  "kilowatthour",
 	}, US_GALLON: {
-		Short: "US Gal",
+		Key:  "usgallon",
-		Long:  "usgallon",
 	},
 	MINUTE: {
-		Short: "Mins",
+		Key:  "minutes",
-		Long:  "minutes",
 	},
 }
 
 var FuelTypeDetails map[FuelType]EnumDetail = map[FuelType]EnumDetail{
 	PETROL: {
-		Short: "Petrol",
+		Key:  "petrol",
-		Long:  "Petrol",
 	},
 	DIESEL: {
-		Short: "Diesel",
+		Key:  "diesel",
-		Long:  "Diesel",
 	}, CNG: {
-		Short: "CNG",
+		Key:  "cng",
-		Long:  "CNG",
 	}, LPG: {
-		Short: "LPG",
+		Key:  "lpg",
-		Long:  "LPG",
 	}, ELECTRIC: {
-		Short: "Electric",
+		Key:  "electric",
-		Long:  "Electric",
 	}, ETHANOL: {
-		Short: "Ethanol",
+		Key:  "ethanol",
-		Long:  "Ethanol",
 	},
 }
 
 var DistanceUnitDetails map[DistanceUnit]EnumDetail = map[DistanceUnit]EnumDetail{
 	KILOMETERS: {
-		Short: "Km",
+		Key: "kilometers",
-		Long:  "Kilometers",
 	},
 	MILES: {
-		Short: "Mi",
+		Key: "miles",
-		Long:  "Miles",
 	},
 }
 
 var RoleDetails map[Role]EnumDetail = map[Role]EnumDetail{
 	ADMIN: {
-		Short: "Admin",
+		Key: "ADMIN",
-		Long:  "ADMIN",
 	},
 	USER: {
-		Short: "User",
+		Key: "USER",
-		Long:  "USER",
 	},
 }

ui/src/components/mileageChart.vue

@@ -30,7 +30,7 @@ export default {
       var labels = this.chartData.map((x) => x.date.substr(0, 10))
       var dataset = {
         steppedLine: true,
-        label: `${this.$t('odometer')} (${this.user.distanceUnitDetail.short}/${this.vehicle.fuelUnitDetail.short})`,
+        label: `${this.$t('odometer')} (${this.$t('unit.short.' + this.user.distanceUnitDetail.key)}/${this.$t('unit.short.' + this.vehicle.fuelUnitDetail.key)})`,
         fill: true,
         data: this.chartData.map((x) => x.mileage),
       }

ui/src/i18n.js

@@ -16,62 +16,10 @@ function loadLocaleMessages () {
     return messages
   }
 
-const dateTimeFormats = {
-    'en-US': {
-      short: {
-        year: 'numeric',
-        month: 'short',
-        day: 'numeric'
-      },
-      long: {
-        year: 'numeric',
-        month: 'long',
-        day: 'numeric',
-        weekday: 'long',
-        hour: 'numeric',
-        minute: 'numeric'
-      }
-    },
-    'de-DE': {
-      short: {
-        year: 'numeric',
-        month: 'short',
-        day: 'numeric'
-      },
-      long: {
-        year: 'numeric',
-        month: 'long',
-        day: 'numeric',
-        weekday: 'long',
-        hour: 'numeric',
-        minute: 'numeric',
-        hour12: false
-      }
-    }
-  }
-
-const numberFormats = {
-    'en-US': {
-      currency: {
-        style: 'currency',
-        currency: 'USD'
-      }
-    },
-    'de-DE': {
-      currency: {
-        style: 'currency',
-        currency: 'EUR',
-        currencyDisplay: 'symbol'
-      }
-    }
-  }
-
 const i18n = new VueI18n({
     locale: navigator.language.split('-')[0] || 'en',
     fallbackLocale: 'en',
-    messages: loadLocaleMessages(),
+    messages: loadLocaleMessages()
-    numberFormats,
-    dateTimeFormats
 });
 
 export default i18n;

ui/src/locales/de.json

@@ -78,12 +78,12 @@
     "quantity": "Menge",
     "gasstation": "Tankstelle",
     "fuel": {
-      "Petrol": "Benzin",
+      "petrol": "Benzin",
-      "Diesel": "Diesel",
+      "diesel": "Diesel",
-      "CNG": "CNG",
+      "cng": "CNG",
-      "LPG": "LPG",
+      "lpg": "LPG",
-      "Electric": "Strom",
+      "electric": "Strom",
-      "Ethanol": "Ethanol"
+      "ethanol": "Ethanol"
     },
     "unit": {
       "long": {
@@ -92,7 +92,9 @@
         "kilowatthour": "Kilowattstunde",
         "kilogram": "Kilogramm",
         "usgallon": "US-Gallone",
-        "minutes": "Minuten"
+        "minutes": "Minuten",
+        "kilometers": "Kilometer",
+        "miles": "Meilen"
       },
       "short": {
         "litre": "L",
@@ -100,7 +102,9 @@
         "kilowatthour": "KwH",
         "kilogram": "Kg",
         "usgallon": "US-Gal",
-        "minutes": "Min"
+        "minutes": "Min",
+        "kilometers": "Km",
+        "miles": "Mi"
       }
     },
     "avgfillupqty": "Ø Tankmenge",
@@ -184,6 +188,10 @@
         "success": "Du hast dich erfolgreich registriert. Du wirst in kürze zur Anmeldung weitergeleitet und kannst Anfangen Hammond zu verwenden."
       }
     },
+    "roles": {
+      "ADMIN": "Adminstrator",
+      "USER": "Benutzer"
+    },
     "profile": "Profil",
     "processedon": "Bearbeitet am",
     "enable": "Entsperren",

ui/src/locales/en.json

@@ -81,12 +81,12 @@
     "quantity": "Quantity",
     "gasstation": "Gas Station",
     "fuel": {
-      "Petrol": "Petrol",
+      "petrol": "Petrol",
-      "Diesel": "Diesel",
+      "diesel": "Diesel",
-      "CNG": "CNG",
+      "cng": "CNG",
-      "LPG": "LPG",
+      "lpg": "LPG",
-      "Electric": "Electric",
+      "electric": "Electric",
-      "Ethanol": "Ethanol"
+      "ethanol": "Ethanol"
     },
     "unit": {
       "long": {
@@ -95,7 +95,9 @@
         "kilowatthour": "Kilowatt Hour",
         "kilogram": "Kilogram",
         "usgallon": "US Gallon",
-        "minutes": "Minutes"
+        "minutes": "Minutes",
+        "kilometers": "Kilometers",
+        "miles": "Miles"
       },
       "short": {
         "litre": "Lt",
@@ -103,7 +105,9 @@
         "kilowatthour": "KwH",
         "kilogram": "Kg",
         "usgallon": "US Gal",
-        "minutes": "Mins"
+        "minutes": "Mins",
+        "kilometers": "Km",
+        "miles": "Mi"
       }
     },
     "avgfillupqty": "Avg Fillup Qty",
@@ -191,6 +195,10 @@
         "success": "You have been registered successfully. You will be redirected to the login screen shortly where you can login and start using the system."
       }
     },
+    "roles": {
+      "ADMIN": "ADMIN",
+      "USER": "USER"
+    },
     "profile": "Profile",
     "processedon": "Processed on",
     "enable": "Enable",

ui/src/router/views/createExpense.vue

@@ -198,7 +198,7 @@ export default {
       </b-field>
       <b-field :label="this.$t('odometer')">
         <p class="control">
-          <span class="button is-static">{{ me.distanceUnitDetail.short }}</span>
+          <span class="button is-static">{{ $t('unit.short.' + me.distanceUnitDetail.key) }}</span>
         </p>
         <b-input v-model.number="expenseModel.odoReading" type="number" min="0" expanded required></b-input>
       </b-field>

ui/src/router/views/createFillup.vue

@@ -233,11 +233,11 @@ export default {
         <b-input v-model.number="fillupModel.fuelQuantity" type="number" step=".001" min="0" expanded required></b-input>
         <b-select v-model="fillupModel.fuelUnit" :placeholder="this.$t('fuelunit')" required>
           <option v-for="(option, key) in fuelUnitMasters" :key="key" :value="key">
-            {{ $t('unit.long.' + option.long) }}
+            {{ $t('unit.long.' + option.key) }}
           </option>
         </b-select>
       </b-field>
-      <b-field :label="this.$t('per', { '0': this.$t('price'), '1': vehicle.fuelUnitDetail.short })"
+      <b-field :label="this.$t('per', { '0': this.$t('price'), '1': $t('unit.short.' + vehicle.fuelUnitDetail.key) })"
         ><p class="control">
           <span class="button is-static">{{ me.currency }}</span>
         </p>
@@ -251,7 +251,7 @@ export default {
       </b-field>
       <b-field :label="this.$t('odometer')">
         <p class="control">
-          <span class="button is-static">{{ me.distanceUnitDetail.short }}</span>
+          <span class="button is-static">{{ $t('unit.short.' + me.distanceUnitDetail.key) }}</span>
         </p>
         <b-input v-model.number="fillupModel.odoReading" type="number" min="0" expanded required></b-input>
       </b-field>

ui/src/router/views/createVehicle.vue

@@ -141,7 +141,7 @@ export default {
       <b-field :label="this.$t('fueltype') + `*`">
         <b-select v-model.number="vehicleModel.fuelType" :placeholder="this.$t('fueltype')" required expanded>
           <option v-for="(option, key) in fuelTypeMasters" :key="key" :value="key">
-            {{ $t('fuel.' + option.long) }}
+            {{ $t('fuel.' + option.key) }}
           </option>
         </b-select>
       </b-field>
@@ -149,7 +149,7 @@ export default {
       <b-field :label="this.$t('fuelunit') + `*`">
         <b-select v-model.number="vehicleModel.fuelUnit" :placeholder="this.$t('fuelunit')" required expanded>
           <option v-for="(option, key) in fuelUnitMasters" :key="key" :value="key">
-            {{ $t('unit.long.' + option.long) }}
+            {{ $t('unit.long.' + option.key) }}
           </option>
         </b-select>
       </b-field>

ui/src/router/views/home.vue

@@ -124,7 +124,7 @@ export default {
                     <div class="column"
                       >{{ formatDate(vehicle.fillups[0].date) }} <br />
                       {{ `${formatCurrency(vehicle.fillups[0].totalAmount)}` }} ({{
-                        `${vehicle.fillups[0].fuelQuantity} ${vehicle.fillups[0].fuelUnitDetail.short}`
+                        `${vehicle.fillups[0].fuelQuantity} ${ $t('unit.short.' + vehicle.fillups[0].fuelUnitDetail.key) }`
                       }}
                       @ {{ `${formatCurrency(vehicle.fillups[0].perUnitPrice)}` }})</div
                     >
@@ -135,7 +135,7 @@ export default {
                     <div class="column">
                       <template v-if="vehicle.fillups.length">
                         {{ vehicle.fillups[0].odoReading }}&nbsp;{{
-                          me.distanceUnitDetail.short
+                          $t('unit.short.' + me.distanceUnitDetail.key)
                         }}</template
                       >
                     </div>

ui/src/router/views/initialize.vue

@@ -224,7 +224,7 @@ export default {
         <b-field :label="this.$t('distanceunit')">
           <b-select v-model.number="registerModel.distanceUnit" :placeholder="this.$t('distanceunit')" required expanded>
             <option v-for="(option, key) in distanceUnitMasters" :key="key" :value="key">
-              {{ `${option.long} (${option.short})` }}
+              {{ `${$t('unit.long.' + option.key)} (${$t('unit.short.' + option.key)})` }}
             </option>
           </b-select>
         </b-field>

ui/src/router/views/settings.vue

@@ -154,7 +154,7 @@ export default {
           <b-field :label="$t('distanceunit')">
             <b-select v-model.number="settingsModel.distanceUnit" placeholder="Distance Unit" required expanded>
               <option v-for="(option, key) in distanceUnitMasters" :key="key" :value="key">
-                {{ `${option.long} (${option.short})` }}
+                {{ `${$t('unit.long.' + option.key)} (${$t('unit.short.' + option.key)})` }}
               </option>
             </b-select>
           </b-field>

ui/src/router/views/siteSettings.vue

@@ -82,7 +82,7 @@ export default {
       <b-field :label="this.$t('distanceunit')">
         <b-select v-model.number="settingsModel.distanceUnit" :placeholder="this.$t('distanceunit')" required expanded>
           <option v-for="(option, key) in distanceUnitMasters" :key="key" :value="key">
-            {{ `${option.long} (${option.short})` }}
+            {{ `${$t('unit.long.' + option.key)} (${$t('unit.short.' + option.key)})` }}
           </option>
         </b-select>
       </b-field>

ui/src/router/views/users.vue

@@ -156,7 +156,7 @@ export default {
           <b-field :label="this.$t('role')">
             <b-select v-model.number="registerModel.role" :placeholder="this.$t('placeholder')" required expanded>
               <option v-for="(option, key) in roleMasters" :key="key" :value="key">
-                {{ `${option.long}` }}
+                {{ `test` }}
               </option>
             </b-select>
           </b-field>
@@ -175,7 +175,7 @@ export default {
               expanded
             >
               <option v-for="(option, key) in distanceUnitMasters" :key="key" :value="key">
-                {{ `${option.long} (${option.short})` }}
+                {{ `${$t('unit.long.' + option.key)} (${$t('unit.short.' + option.key)})` }}
               </option>
             </b-select>
           </b-field>
@@ -195,14 +195,14 @@ export default {
           {{ `${props.row.email}` }}
         </b-table-column>
         <b-table-column v-slot="props" field="role" :label="this.$t('role')">
-          {{ `${props.row.roleDetail.short}` }}
+          {{ `${$t('roles.' + props.row.roleDetail.key)}` }}
         </b-table-column>
         <b-table-column v-slot="props" field="createdAt" :label="this.$t('created')" sortable date>
           {{ formatDate(props.row.createdAt) }}
         </b-table-column>
          <b-table-column v-slot="props">
-           <b-button type="is-success" v-if="props.row.isDisabled && props.row.roleDetail.long === 'USER'" @click="changeDisabledStatus(props.row.id, false)">{{ $t('enable') }}</b-button>
+           <b-button type="is-success" v-if="props.row.isDisabled && props.row.roleDetail.key === 'USER'" @click="changeDisabledStatus(props.row.id, false)">{{ $t('enable') }}</b-button>
-           <b-button type="is-danger" v-if="!props.row.isDisabled && props.row.roleDetail.long === 'USER'" @click="changeDisabledStatus(props.row.id, true)">{{ $t('disable') }}</b-button>
+           <b-button type="is-danger" v-if="!props.row.isDisabled && props.row.roleDetail.key === 'USER'" @click="changeDisabledStatus(props.row.id, true)">{{ $t('disable') }}</b-button>
          </b-table-column>
       </b-table>
     </div>

ui/src/router/views/vehicle.vue

@@ -82,11 +82,11 @@ export default {
           },
           {
             label: this.$t('avgfillupqty'),
-            value: `${x.avgFuelQty} ${this.vehicle.fuelUnitDetail.short}`,
+            value: `${x.avgFuelQty} ${this.$t('unit.short.' + this.vehicle.fuelUnitDetail.key)}`,
           },
           {
             label: this.$t('avgfuelcost'),
-            value: this.$t('per', {'0': this.formatCurrency(x.avgFuelPrice, x.currency), '1': this.vehicle.fuelUnitDetail.short}),
+            value: this.$t('per', {'0': this.formatCurrency(x.avgFuelPrice, x.currency), '1': this.$t('unit.short.' + this.vehicle.fuelUnitDetail.key)}),
           },
         ]
       })
@@ -303,7 +303,7 @@ export default {
       <div class="column is-one-half" :class="isMobile ? 'has-text-centered' : ''">
         <p class="title">{{ vehicle.nickname }} - {{ vehicle.registration }}</p>
         <p class="subtitle">
-          {{ [vehicle.make, vehicle.model, this.$t('fuel.' + vehicle.fuelTypeDetail.short)].join(' | ') }}
+          {{ [vehicle.make, vehicle.model, this.$t('fuel.' + vehicle.fuelTypeDetail.key)].join(' | ') }}
 
           <template v-if="users.length > 1">
             | {{ $t("sharedwith") }} :
@@ -363,12 +363,12 @@ export default {
           {{ props.row.fuelSubType }}
         </b-table-column>
         <b-table-column v-slot="props" field="fuelQuantity" :label="this.$t('quantity')" :td-attrs="hiddenMobile" numeric>
-          {{ `${props.row.fuelQuantity} ${props.row.fuelUnitDetail.short}` }}
+          {{ `${props.row.fuelQuantity} ${$t('unit.short.' + props.row.fuelUnitDetail.key)}` }}
         </b-table-column>
         <b-table-column
           v-slot="props"
           field="perUnitPrice"
-          :label="this.$t('per', { '0': this.$t('price'), '1': vehicle.fuelUnitDetail.short })"
+          :label="this.$t('per', { '0': this.$t('price'), '1': this.$t('unit.short.' + vehicle.fuelUnitDetail.key) })"
           :td-attrs="hiddenMobile"
           numeric
           sortable
@@ -376,7 +376,7 @@ export default {
           {{ `${formatCurrency(props.row.perUnitPrice, props.row.currency)}` }}
         </b-table-column>
         <b-table-column v-if="isMobile" v-slot="props" field="totalAmount" :label="this.$t('total')" :td-attrs="hiddenDesktop" sortable numeric>
-          {{ `${me.currency} ${props.row.totalAmount}` }} ({{ `${props.row.fuelQuantity} ${props.row.fuelUnitDetail.short}` }} @
+          {{ `${me.currency} ${props.row.totalAmount}` }} ({{ `${props.row.fuelQuantity} ${$t('unit.short.' + props.row.fuelUnitDetail.key)}` }} @
           {{ `${me.currency} ${props.row.perUnitPrice}` }})
         </b-table-column>
         <b-table-column v-if="!isMobile" v-slot="props" field="totalAmount" :label="this.$t('total')" :td-attrs="hiddenMobile" sortable numeric>
@@ -386,7 +386,7 @@ export default {
           <b-icon pack="fas" :icon="props.row.isTankFull ? 'check' : 'times'" type="is-info"> </b-icon>
         </b-table-column>
         <b-table-column v-slot="props" field="odoReading" :label="this.$t('odometer')" :td-attrs="hiddenMobile" numeric>
-          {{ `${props.row.odoReading} ${me.distanceUnitDetail.short}` }}
+          {{ `${props.row.odoReading} ${$t('unit.short.' + me.distanceUnitDetail.key)}` }}
         </b-table-column>
         <b-table-column v-slot="props" field="fillingStation" :label="this.$t('gasstation')" :td-attrs="hiddenMobile">
           {{ `${props.row.fillingStation}` }}
@@ -433,7 +433,7 @@ export default {
         </b-table-column>
 
         <b-table-column v-slot="props" field="odoReading" :label="this.$t('odometer')" :td-attrs="columnTdAttrs" numeric>
-          {{ `${props.row.odoReading} ${me.distanceUnitDetail.short}` }}
+          {{ `${props.row.odoReading} ${$t('unit.short.' + me.distanceUnitDetail.key)}` }}
         </b-table-column>
 
         <b-table-column v-slot="props" field="userId" :label="this.$t('by')" :td-attrs="columnTdAttrs">