ovdashboard/ui/src/App.vue

<template>
  <v-app>
    <v-layout column fill-height>
      <TitleBar />
      <Dashboard>
        <template slot="message">
          <div class="d-flex flex-column fill-height">
            <Message />
            <ImageCarousel class="mt-auto" />
          </div>
        </template>
        <template slot="calendars">
          <CalendarCarousel />
          <DashboardInfo
            :server_host="server_host"
            :server_name="server_name"
            :version="dashboard_version"
            :lan_ip="dashboard_ip"
          />
        </template>
      </Dashboard>
      <TickerBar />
    </v-layout>
  </v-app>
</template>

<script lang="ts">
import { Component, Vue } from "@/ovd-vue";

import TitleBar from "./components/title/TitleBar.vue";
import Dashboard from "./components/Dashboard.vue";
import ImageCarousel from "./components/ImageCarousel.vue";
import Message from "./components/Message.vue";
import CalendarCarousel from "./components/calendar/CalendarCarousel.vue";
import DashboardInfo from "./components/DashboardInfo.vue";
import TickerBar from "./components/TickerBar.vue";

@Component({
  components: {
    TitleBar,
    Dashboard,
    ImageCarousel,
    Message,
    CalendarCarousel,
    DashboardInfo,
    TickerBar,
  },
})
export default class App extends Vue {
  // API data
  private server_host = "https://oekzident.de";
  private server_name = "OEKZident";
  private dashboard_version = "0.0.1";
  private dashboard_ip = "0.0.0.0";

  public created(): void {
    super.created();
  }

  public beforeDestroy(): void {
    super.beforeDestroy();
  }

  protected update(): void {
    // Update Server Config
    type ServerConfig = {
      host: string;
      name: string;
    };

    this.$ovdashboard.api_get_object<ServerConfig>(
      "misc/config/server",
      (data) => {
        this.server_host = data.host;
        this.server_name = data.name;
      }
    );

    // Update Version
    this.$ovdashboard.api_get_string("misc/version", (data) => {
      this.dashboard_version = data;
    });

    // Update IP
    this.$ovdashboard.api_get_string("misc/lanip", (data) => {
      this.dashboard_ip = data;
    });
  }
}
</script>

<style>
/* Hide scrollbar for Chrome, Safari and Opera */
body::-webkit-scrollbar {
  display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
body {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
}
</style>