DashboardInfo component

ui/src/App.vue

@@ -8,6 +8,11 @@
       />
       <Dashboard :message="message_html">
         <CalendarCarousel />
+        <DashboardInfo
+          server_host="https://cloud.oekzident.de"
+          server_name="OV-Cloud"
+          version="0"
+        />
       </Dashboard>
       <TickerBar
         v-if="ticker_html !== ''"
@@ -22,6 +27,7 @@
 import { Component, Vue } from "vue-property-decorator";
 import CalendarCarousel from "./components/calendar/CalendarCarousel.vue";
 import Dashboard from "./components/Dashboard.vue";
+import DashboardInfo from "./components/DashboardInfo.vue";
 import TitleBar from "./components/title_bar/TitleBar.vue";
 import TickerBar from "./components/TickerBar.vue";
 
@@ -29,6 +35,7 @@ import TickerBar from "./components/TickerBar.vue";
   components: {
     CalendarCarousel,
     Dashboard,
+    DashboardInfo,
     TitleBar,
     TickerBar,
   },

ui/src/components/DashboardInfo.vue

@@ -0,0 +1,32 @@
+<template>
+  <div>
+    <v-divider class="mb-1" />
+    <div class="d-flex flex-column align-end blue-grey--text text-body-2">
+      <span class="d-flex">
+        ovdashboard powered by&nbsp;<a :href="server_host">{{ server_name }}</a>
+      </span>
+      <span class="d-flex">
+        Version: {{ version }} &ndash; IP: {{ lan_ip ? lan_ip : "?" }}
+      </span>
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Prop, Vue } from "vue-property-decorator";
+
+@Component
+export default class DashboardInfo extends Vue {
+  @Prop({ required: true })
+  private readonly version!: string;
+
+  @Prop()
+  private readonly lan_ip?: string;
+
+  @Prop({ required: true })
+  private readonly server_host!: string;
+
+  @Prop({ required: true })
+  private readonly server_name!: string;
+}
+</script>