Add page title to html title

Closes #45
Botffy · Jul 31, 2021 · fb8f607 · fb8f607
1 parent 28f5d24
commit fb8f607
Show file tree

Hide file tree

Showing 9 changed files with 43 additions and 4 deletions.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -54,6 +54,7 @@
     "luxon": "^1.27.0",
     "uuid": "^3.4.0",
     "vue": "^2.6.14",
+    "vue-meta": "^2.4.0",
     "vue-router": "^3.5.2"
   }
 }
diff --git a/src/Bikes.vue b/src/Bikes.vue
@@ -102,6 +102,9 @@ const bikeByTime = (bikeStats: BikeStat[], slotSize = 5): number[][] => {
 }
 
 export default Vue.extend({
+  metaInfo: {
+    title: 'Bicajok'
+  },
   components: {
     'ride-list': BubiRides,
     'quote': Quote

diff --git a/src/BubiRides.vue b/src/BubiRides.vue
@@ -208,6 +208,9 @@ const formatTime = (time: DateTime): string => {
 }
 
 export default Vue.extend({
+  metaInfo: {
+    title: 'Bérlések'
+  },
   components: {
     'ride-form': RideForm,
     'screenshot-upload': AddByScreenshot

diff --git a/src/Settings.vue b/src/Settings.vue
@@ -58,6 +58,9 @@ import { getStationByCode } from './station-service'
 import InfoPage from './InfoPage.vue'
 
 export default Vue.extend({
+  metaInfo: {
+    title: 'Beállítások'
+  },
   components: {
     'info-page': InfoPage
   },

diff --git a/src/Stations.vue b/src/Stations.vue
@@ -114,6 +114,9 @@ const stationDependency = (rides: Ride[]): any[] => {
 }
 
 export default Vue.extend({
+  metaInfo: {
+    title: 'Állomások'
+  },
   components: {
     'ride-list': BubiRides,
     'quote': Quote

diff --git a/src/TimePage.vue b/src/TimePage.vue
@@ -171,6 +171,9 @@ const dayStats = (rides: Ride[]) => {
 }
 
 export default Vue.extend({
+  metaInfo: {
+    title: 'Idő'
+  },
   components: {
     'quote': Quote,
     'ride': RideComponent,

diff --git a/src/index.html b/src/index.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html>
+<html lang="hu">
 
 <head>
   <title>BubiStats</title>

diff --git a/src/index.ts b/src/index.ts
@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import VueRouter from 'vue-router'
+import VueMeta from 'vue-meta'
 import HighchartsVue from 'highcharts-vue'
 import Highcharts from 'highcharts'
 import HighchartsSankey from 'highcharts/modules/sankey'
@@ -33,6 +34,7 @@ HighchartsSankey(Highcharts)
 HighchartsDependencyWheel(Highcharts)
 
 Vue.use(VueRouter)
+Vue.use(VueMeta)
 Vue.use(HighchartsVue, Highcharts, HighchartsSankey, HighchartsDependencyWheel)
 Vue.use(Buefy, { defaultIconPack: 'fas' })
 
@@ -77,6 +79,12 @@ const router = new VueRouter({
 new Vue({
   el: '#app',
   router,
+  metaInfo: {
+    title: null,
+    titleTemplate: (titleChunk: string): string => {
+      return titleChunk ? `BubiStats: ${titleChunk}` : 'BubiStats'
+    }
+  },
   components: {
     'filter-component': FilterComponent
   },