ovdashboard/ui/src/App.vue

77 lines
2.2 KiB
Vue

<template>
<v-app>
<v-layout column fill-height>
<TitleBar
:logo_above="logo_above"
:logo_below="logo_below"
:title="title_html"
/>
<Dashboard>
<template slot="message">
<ImageCarousel
:speed="image_speed"
:height="image_height"
:contain="image_contain"
:urls="image_urls"
/>
<div v-html="message_html" />
</template>
<template slot="calendars">
<CalendarCarousel :speed="calendar_speed" :data="calendar_data" />
<DashboardInfo
:server_host="server_host"
:server_name="server_name"
:version="dashboard_version"
:lan_ip="dashboard_ip"
/>
</template>
</Dashboard>
<TickerBar
v-if="ticker_html !== ''"
:content="ticker_html"
color="primary"
/>
</v-layout>
</v-app>
</template>
<script lang="ts">
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 ImageCarousel from "./components/ImageCarousel.vue";
import TitleBar from "./components/title/TitleBar.vue";
import TickerBar from "./components/TickerBar.vue";
@Component({
components: {
CalendarCarousel,
Dashboard,
DashboardInfo,
ImageCarousel,
TitleBar,
TickerBar,
},
})
export default class App extends Vue {
private logo_above = "Technisches Hilfswerk";
private logo_below = "OV Musterstadt";
private title_html = "<h1>changeme</h1>";
private image_urls = require("@/assets/image_testdata.json");
private image_height = 300;
private image_contain = false;
private image_speed = 10000;
private message_html = "<p>changeme</p>";
private calendar_data = require("@/assets/calendar_testdata.json");
private calendar_speed = 10000;
private server_host = "https://oekzident.de";
private server_name = "OEKZident";
private dashboard_version = "0.0.1";
private dashboard_ip = "0.0.0.0";
private ticker_html = "<p>changeme</p>";
}
</script>