OEKZident.de/ovdashboard
2
0
Fork 0
Code Releases 1 Packages Activity

Merge branch 'feature/ui_upgrade' into feature/python3.12

Browse source
This commit is contained in:
Jörn-Michael Miehe 2023-10-27 02:12:52 +02:00
commit 77a0eddfd8
40 changed files with 2266 additions and 2070 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

72
Dockerfile
View file

@ -2,41 +2,49 @@
# build ui #
############
FROM node:lts-alpine AS build-ui
# some dir for our code
WORKDIR /app
# install dependencies
COPY ui/package*.json ui/yarn*.lock ./
RUN yarn --production=false
# copy code
COPY ui .
RUN yarn build
##############
# webservice #
##############
FROM antonapetrov/uvicorn-gunicorn:python3.9-alpine3.13 AS production
RUN set -ex; \
# prerequisites
apk add --no-cache \
libmagic \
;
FROM node:lts AS build-ui
# env setup
ENV \
WORKDIR /usr/local/src/ovdashboard_ui
# install ovdashboard_ui dependencies
COPY ui/package*.json ui/yarn*.lock ./
RUN yarn install --production false
# copy and build ovdashboard_ui
COPY ui ./
RUN yarn build --dest /tmp/ovdashboard_ui/html
###########
# web app #
###########
FROM tiangolo/uvicorn-gunicorn:python3.12-slim AS production
# add prepared ovdashboard_ui
COPY --from=build-ui /tmp/ovdashboard_ui /usr/local/share/ovdashboard_ui
# env setup
WORKDIR /usr/local/src/ovdashboard_api
ENV \
PRODUCTION_MODE="true" \
APP_MODULE="ovdashboard_api:app"
PORT="8000" \
MODULE_NAME="ovdashboard_api.app"
EXPOSE 8000
# install API
COPY api /usr/src/ovdashboard_api
COPY api ./
RUN set -ex; \
pip3 --no-cache-dir install /usr/src/ovdashboard_api;
# install libs
export DEBIAN_FRONTEND=noninteractive; \
apt-get update; apt-get install --yes --no-install-recommends \
libmagic1 \
; rm -rf /var/lib/apt/lists/*; \
\
# remove example app
rm -rf /app; \
\
# install ovdashboard_api
python -m pip --no-cache-dir install ./
# install UI
COPY --from=build-ui /app/dist /html
# run as unprivileged user
USER nobody

2
api/ovdashboard_api/core/caldav.py
View file

@ -79,7 +79,7 @@ class CalDAV:
_logger.info(f"downloading {calendar_name!r} ...")
dt_start = datetime.combine(
datetime.utcnow().date(),
datetime.now().date(),
datetime.min.time(),
)
dt_end = dt_start + timedelta(days=cfg.calendar.future_days)

4
api/ovdashboard_api/core/calevent.py
View file

@ -31,8 +31,8 @@ class CalEvent(BaseModel):
summary: StrippedStr = ""
description: StrippedStr = ""
dtstart: datetime = datetime.utcnow()
dtend: datetime = datetime.utcnow()
dtstart: datetime = datetime.now()
dtend: datetime = datetime.now()
def __lt__(self, other: Self) -> bool:
"""

2
api/ovdashboard_api/core/settings.py
View file

@ -25,7 +25,7 @@ class DAVSettings(BaseModel):
username: str | None = None
password: str | None = None
cache_ttl: int = 60 * 30
cache_ttl: int = 60 * 10
cache_size: int = 1024
@property

4
api/ovdashboard_api/routers/v1/misc.py
View file

@ -31,8 +31,8 @@ async def get_lan_ip() -> str:
family=AF_INET,
type=SOCK_DGRAM,
) as s:
s.settimeout(0)
try:
s.settimeout(0)
s.connect((SETTINGS.ping_host, SETTINGS.ping_port))
IP = s.getsockname()[0]
@ -44,7 +44,7 @@ async def get_lan_ip() -> str:
@router.get("/version")
async def get_server_api_version() -> str:
return importlib.metadata.version("ovdashboard-api")
return importlib.metadata.version("ovdashboard_api")
@router.get("/config/server")

13
ui/.devcontainer/Dockerfile
View file

@ -1,11 +1,20 @@
# [Choice] Node.js version (use -bullseye variants on local arm64/Apple Silicon): 18, 16, 14, 18-bullseye, 16-bullseye, 14-bullseye, 18-buster, 16-buster, 14-buster
ARG VARIANT=16-bullseye
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
ARG VARIANT=16-bookworm
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:1-${VARIANT}
# [Optional] Uncomment this section to install additional OS packages.
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
# && apt-get -y install --no-install-recommends <your-package-list-here>
RUN set -ex; \
\
export DEBIAN_FRONTEND=noninteractive; \
apt-get update; apt-get install --yes --no-install-recommends \
git-flow \
git-lfs \
; rm -rf /var/lib/apt/lists/*; \
su node -c "git lfs install"
# [Optional] Uncomment if you want to install an additional version of node using nvm
# ARG EXTRA_NODE_VERSION=10
# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"

21
ui/.devcontainer/devcontainer.json
View file

@ -1,28 +1,35 @@
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
// https://github.com/microsoft/vscode-dev-containers/tree/v0.245.2/containers/javascript-node
{
"name": "Node.js",
"name": "OVD UI",
"build": {
"dockerfile": "Dockerfile",
"context": "..",
// Update 'VARIANT' to pick a Node version: 18, 16, 14.
// Append -bullseye or -buster to pin to an OS version.
// Use -bullseye variants on local arm64/Apple Silicon.
"args": {
"VARIANT": "18-bullseye"
"VARIANT": "20-bookworm"
}
},
// Set *default* container specific settings.json values on container create.
"settings": {
"terminal.integrated.defaultProfile.linux": "zsh"
"containerEnv": {
"TZ": "Europe/Berlin"
},
// Configure tool-specific properties.
"customizations": {
// Configure properties specific to VS Code.
"vscode": {
// Set *default* container specific settings.json values on container create.
"settings": {
"terminal.integrated.defaultProfile.linux": "zsh"
},
// Add the IDs of extensions you want installed when the container is created.
"extensions": [
"dbaeumer.vscode-eslint",
"octref.vetur"
"esbenp.prettier-vscode",
"mhutchie.git-graph",
"Syler.sass-indented",
"Vue.volar"
]
}
},
@ -30,7 +37,7 @@
// "forwardPorts": [],
// Use 'postCreateCommand' to run commands after the container is created.
// "postCreateCommand": "yarn install",
"postStartCommand": "yarn install",
"postStartCommand": "yarn install --production false",
// Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
"remoteUser": "node"
}

20
ui/.eslintrc.js
View file

@ -1,18 +1,18 @@
module.exports = {
root: true,
env: {
node: true
node: true,
},
'extends': [
'plugin:vue/essential',
'eslint:recommended',
'@vue/typescript/recommended'
extends: [
"plugin:vue/essential",
"eslint:recommended",
"@vue/typescript/recommended",
],
parserOptions: {
ecmaVersion: 2020
ecmaVersion: 2020,
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
"no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
},
};

15
ui/.vscode/settings.json vendored
View file

@ -1,8 +1,21 @@
{
"editor.formatOnSave": true,
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"editor.codeActionsOnSave": {
"source.organizeImports": true
},
"git.closeDiffOnOperation": true,
"editor.tabSize": 2
"editor.tabSize": 2,
"sass.disableAutoIndent": true,
"sass.format.convert": false,
"sass.format.deleteWhitespace": true,
"prettier.trailingComma": "all",
}

6
ui/babel.config.js
View file

@ -1,5 +1,3 @@
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
presets: ["@vue/cli-plugin-babel/preset"],
};

37
ui/package.json
View file

@ -7,35 +7,34 @@
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.27.2",
"color": "^4.2.3",
"core-js": "^3.8.3",
"luxon": "^3.0.3",
"register-service-worker": "^1.7.2",
"vue": "^2.6.14",
"vue-class-component": "^7.2.3",
"vue-property-decorator": "^9.1.2",
"vuetify": "^2.6.0"
},
"devDependencies": {
"@types/color": "^3.0.3",
"@types/luxon": "^3.0.1",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@typescript-eslint/eslint-plugin": "^6.9.0",
"@typescript-eslint/parser": "^6.9.0",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-plugin-pwa": "~5.0.0",
"@vue/cli-plugin-typescript": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"@vue/eslint-config-typescript": "^9.1.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"sass": "~1.32.0",
"sass-loader": "^10.0.0",
"typescript": "~4.5.5",
"@vue/eslint-config-typescript": "^12.0.0",
"axios": "^1.6.0",
"color": "^4.2.3",
"core-js": "^3.8.3",
"eslint": "^8.52.0",
"eslint-plugin-vue": "^9.18.0",
"luxon": "^3.0.3",
"prettier": "^3.0.3",
"register-service-worker": "^1.7.2",
"sass": "~1.69.5",
"sass-loader": "^13.3.2",
"typescript": "~5.2.2",
"vue": "^2.7.15",
"vue-class-component": "^7.2.3",
"vue-cli-plugin-vuetify": "^2.5.5",
"vue-property-decorator": "^9.1.2",
"vue-template-compiler": "^2.6.14",
"vuetify": "^2.7.1",
"vuetify-loader": "^1.7.0"
}
}

26
ui/public/index.html
View file

@ -1,17 +1,27 @@
<!DOCTYPE html>
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900">
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css">
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900"
/>
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/@mdi/font@latest/css/materialdesignicons.min.css"
/>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->

3
ui/src/components/Dashboard.vue
View file

@ -18,5 +18,4 @@ import { Component, Vue } from "vue-property-decorator";
export default class Dashboard extends Vue {}
</script>
<style>
</style>
<style></style>

12
ui/src/components/DashboardInfo.vue
View file

@ -18,10 +18,10 @@ import { Component, Vue } from "@/ovd-vue";
@Component
export default class DashboardInfo extends Vue {
private server_host = "https://oekzident.de";
private server_name = "OEKZident";
private version = "0.0.1";
private lan_ip = "0.0.0.0";
public server_host = "https://oekzident.de";
public server_name = "OEKZident";
public version = "0.0.1";
public lan_ip = "0.0.0.0";
public created(): void {
super.created();
@ -43,7 +43,7 @@ export default class DashboardInfo extends Vue {
(data) => {
this.server_host = data.host;
this.server_name = data.name;
}
},
);
// Update Version
@ -57,4 +57,4 @@ export default class DashboardInfo extends Vue {
});
}
}
</script>
</script>

12
ui/src/components/ImageCarousel.vue
View file

@ -22,10 +22,10 @@ import { Component, Vue } from "@/ovd-vue";
@Component
export default class ImageCarousel extends Vue {
private urls: string[] = require("@/assets/image_testdata.json");
private height = 300;
private contain = false;
private speed = 10000;
public urls: string[] = require("@/assets/image_testdata.json");
public height = 300;
public contain = false;
public speed = 10000;
public created(): void {
super.created();
@ -39,7 +39,7 @@ export default class ImageCarousel extends Vue {
// Update Images
this.$ovdashboard.api_get_list("image/list", (names) => {
this.urls = names.map((name: string) =>
this.$ovdashboard.api_url(`image/get/${name}`)
this.$ovdashboard.api_url(`image/get/${name}`),
);
});
@ -71,4 +71,4 @@ export default class ImageCarousel extends Vue {
}
}
}
</style>
</style>

6
ui/src/components/Message.vue
View file

@ -7,7 +7,7 @@ import { Component, Vue } from "@/ovd-vue";
@Component
export default class Message extends Vue {
private html = require("@/assets/message_testdata.json");
public html = require("@/assets/message_testdata.json");
public created(): void {
super.created();
@ -21,7 +21,7 @@ export default class Message extends Vue {
// Update Message
this.$ovdashboard.api_get_string(
"text/get/html/message",
(data) => (this.html = data)
(data) => (this.html = data),
);
}
}
@ -59,4 +59,4 @@ div:deep() {
font-weight: bold;
}
}
</style>
</style>

2
ui/src/components/Model.ts
View file

@ -5,7 +5,7 @@ export class Model {
// source: https://gist.github.com/hyamamoto/fd435505d29ebfa3d9716fd2be8d42f0?permalink_comment_id=2775538#gistcomment-2775538
let hash = 0;
for (let i = 0; i < str.length; i++)
hash = Math.imul(31, hash) + str.charCodeAt(i) | 0;
hash = (Math.imul(31, hash) + str.charCodeAt(i)) | 0;
return new Uint32Array([hash])[0].toString(36);
}

11
ui/src/components/TickerBar.vue
View file

@ -15,23 +15,20 @@ import Color from "color";
@Component
export default class TickerBar extends Vue {
private content = "<p>changeme</p>";
public content = "<p>changeme</p>";
private color = "primary";
@Ref("content")
private readonly _content!: HTMLDivElement;
public color = "primary";
@Ref("marquee")
private readonly _marquee!: HTMLSpanElement;
private get is_dark(): boolean {
public get is_dark(): boolean {
return this.footer_color.isDark();
}
private get footer_color(): Color {
// try getting from vuetify theme
let color = this.$vuetify.theme.themes.light[this.color];
const color = this.$vuetify.theme.themes.light[this.color];
if (typeof color === "string") {
return Color(color);

12
ui/src/components/calendar/Calendar.vue
View file

@ -4,11 +4,11 @@
{{ title }}
</span>
<template v-for="(event, index) in events">
<EventItem :event="event" :key="event.hash" />
<EventItem :event="event" :key="`event-${index}`" />
<v-divider
v-if="index < events.length - 1"
class="mx-5"
:key="`${event.hash}-div`"
:key="`event-div-${index}`"
/>
</template>
</v-list>
@ -16,8 +16,8 @@
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { EventData } from "./EventModel";
import EventItem from "./EventItem.vue";
import { EventData } from "./EventModel";
@Component({
components: {
@ -26,10 +26,10 @@ import EventItem from "./EventItem.vue";
})
export default class Calendar extends Vue {
@Prop({ default: "CALENDAR" })
private readonly title!: string;
public readonly title!: string;
@Prop({ default: () => [] })
private readonly events!: EventData[];
public readonly events!: EventData[];
}
</script>
@ -37,4 +37,4 @@ export default class Calendar extends Vue {
.v-list .v-divider {
border-color: rgba(0, 0, 0, 0.25);
}
</style>
</style>

12
ui/src/components/calendar/CalendarCarousel.vue
View file

@ -29,7 +29,7 @@ export default class CalendarCarousel extends Vue {
private interval?: number;
private data: CalendarData[] = require("@/assets/calendar_testdata.json");
private speed = 10000;
public speed = 10000;
@Ref("main")
private readonly _main?: Vue;
@ -57,7 +57,7 @@ export default class CalendarCarousel extends Vue {
events: calendars[i],
});
}
}
},
);
});
@ -70,7 +70,7 @@ export default class CalendarCarousel extends Vue {
"calendar/config",
(data) => {
this.speed = data.speed;
}
},
);
}
@ -98,8 +98,8 @@ export default class CalendarCarousel extends Vue {
this.interval = setInterval(this.update_height, 10000);
}
private get calendars(): CalendarModel[] {
let arr = [];
public get calendars(): CalendarModel[] {
const arr = [];
for (const json_data of this.data) {
arr.push(new CalendarModel(json_data));
@ -131,4 +131,4 @@ export default class CalendarCarousel extends Vue {
}
}
}
</style>
</style>

6
ui/src/components/calendar/CalendarModel.ts
View file

@ -13,11 +13,11 @@ export class CalendarModel extends Model {
public constructor(json_data: CalendarData) {
super();
this.title = json_data.title
this.title = json_data.title;
this.events = [];
for (const event_data of json_data.events) {
this.events.push(new EventModel(event_data))
this.events.push(new EventModel(event_data));
}
}
}
}

10
ui/src/components/calendar/EventDate.vue
View file

@ -17,23 +17,23 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { DateTime } from "luxon";
import { Component, Prop, Vue } from "vue-property-decorator";
@Component
export default class EventDate extends Vue {
@Prop()
private readonly date!: DateTime;
private get day(): string {
public get day(): string {
return this.date.toFormat("dd.");
}
private get month(): string {
public get month(): string {
return this.date.toFormat("MM.");
}
private get time(): string {
public get time(): string {
return this.date.toLocaleString(DateTime.TIME_24_SIMPLE);
}
}
@ -49,4 +49,4 @@ export default class EventDate extends Vue {
min-width: 130px;
}
}
</style>
</style>

25
ui/src/components/calendar/EventItem.vue
View file

@ -12,15 +12,7 @@
{{ event.description }}
</v-list-item-subtitle>
<v-list-item-subtitle
class="
d-inline-block
text-truncate
thw-heading-font
blue-grey--text
text--darken-1
font-weight-bold
ma-0
"
class="d-inline-block text-truncate thw-heading-font blue-grey--text text--darken-1 font-weight-bold ma-0"
>
{{ data_string }}
</v-list-item-subtitle>
@ -29,10 +21,10 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { DateTime, DurationLikeObject } from "luxon";
import { EventModel } from "./EventModel";
import { Component, Prop, Vue } from "vue-property-decorator";
import EventDate from "./EventDate.vue";
import { EventModel } from "./EventModel";
@Component({
components: {
@ -41,15 +33,15 @@ import EventDate from "./EventDate.vue";
})
export default class EventItem extends Vue {
@Prop()
private readonly event!: EventModel;
public readonly event!: EventModel;
private get data_string(): string {
public get data_string(): string {
const locale_string = this.event.start.toLocaleString(
DateTime.DATETIME_MED_WITH_WEEKDAY
DateTime.DATETIME_MED_WITH_WEEKDAY,
);
// decide which duration units to include
let units: (keyof DurationLikeObject)[] = ["hours"];
const units: (keyof DurationLikeObject)[] = ["hours"];
if (this.event.duration.as("days") >= 1) {
// include days if duration is at least one day
@ -72,5 +64,4 @@ export default class EventItem extends Vue {
}
</script>
<style>
</style>
<style></style>

12
ui/src/components/calendar/EventModel.ts
View file

@ -19,13 +19,11 @@ export class EventModel extends Model {
this.summary = json_data.summary;
this.description = json_data.description;
this.start = DateTime
.fromISO(json_data.dtstart)
.setLocale(navigator.language);
const end = DateTime
.fromISO(json_data.dtend)
.setLocale(navigator.language);
this.start = DateTime.fromISO(json_data.dtstart).setLocale(
navigator.language,
);
const end = DateTime.fromISO(json_data.dtend).setLocale(navigator.language);
this.duration = end.diff(this.start);
}
}
}

4
ui/src/components/title/Clock.vue
View file

@ -3,12 +3,12 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { DateTime } from "luxon";
import { Component, Prop, Vue } from "vue-property-decorator";
@Component
export default class Clock extends Vue {
private formatted = "";
public formatted = "";
private interval?: number;
@Prop({ required: true })

6
ui/src/components/title/THWLogo.vue
View file

@ -23,10 +23,10 @@ import { Component, Vue } from "@/ovd-vue";
@Component
export default class THWLogo extends Vue {
private above = "Technisches Hilfswerk";
private below = "OV Musterstadt";
public above = "Technisches Hilfswerk";
public below = "OV Musterstadt";
private get logo_url(): string {
public get logo_url(): string {
return this.$ovdashboard.api_url("file/get/logo");
}

2
ui/src/components/title/TitleBar.vue
View file

@ -38,7 +38,7 @@ import THWLogo from "./THWLogo.vue";
},
})
export default class TitleBar extends Vue {
private title = "<h1>TITLE</h1>";
public title = "<h1>TITLE</h1>";
public created(): void {
super.created();

5
ui/src/d.ts/shims-ovdashboard.d.ts vendored
View file

@ -1,10 +1,9 @@
import { OVDashboardPlugin } from "@/plugins/ovdashboard";
declare module 'vue/types/vue' {
declare module "vue/types/vue" {
interface Vue {
$ovdashboard: OVDashboardPlugin;
}
}
export { };
export {};

4
ui/src/d.ts/shims-tsx.d.ts vendored
View file

@ -1,11 +1,11 @@
import Vue, { VNode } from 'vue'
import Vue, { VNode } from "vue";
declare global {
namespace JSX {
interface Element extends VNode {}
interface ElementClass extends Vue {}
interface IntrinsicElements {
[elem: string]: any
[elem: string]: any;
}
}
}

6
ui/src/d.ts/shims-vue.d.ts vendored
View file

@ -1,4 +1,4 @@
declare module '*.vue' {
import Vue from 'vue'
export default Vue
declare module "*.vue" {
import Vue from "vue";
export default Vue;
}

6
ui/src/d.ts/shims-vuetify.d.ts vendored
View file

@ -1,4 +1,4 @@
declare module 'vuetify/lib/framework' {
import Vuetify from 'vuetify'
export default Vuetify
declare module "vuetify/lib/framework" {
import Vuetify from "vuetify";
export default Vuetify;
}

20
ui/src/main.ts
View file

@ -1,16 +1,16 @@
import Vue from "vue"
import Vue from "vue";
import "@/registerServiceWorker"
import "@/sass/fonts.scss"
import "@/registerServiceWorker";
import "@/sass/fonts.scss";
import App from "@/App.vue"
import ovdashboard from "@/plugins/ovdashboard"
import vuetify from "@/plugins/vuetify"
import App from "@/App.vue";
import ovdashboard from "@/plugins/ovdashboard";
import vuetify from "@/plugins/vuetify";
Vue.config.productionTip = false
Vue.use(ovdashboard)
Vue.config.productionTip = false;
Vue.use(ovdashboard);
new Vue({
vuetify,
render: h => h(App)
}).$mount('#app')
render: (h) => h(App),
}).$mount("#app");

22
ui/src/plugins/ovdashboard.ts
View file

@ -1,5 +1,5 @@
import axios, { AxiosInstance, AxiosPromise } from 'axios';
import Vue from 'vue';
import axios, { AxiosInstance, AxiosPromise } from "axios";
import Vue from "vue";
export class OVDashboardPlugin {
private axios: AxiosInstance;
@ -28,7 +28,6 @@ export class OVDashboardPlugin {
private get api_baseurl(): string {
if (process.env.NODE_ENV === "production") {
return `//${window.location.host}/api`;
} else if (process.env.NODE_ENV !== "development") {
console.warn("Unexpected NODE_ENV value");
}
@ -52,10 +51,7 @@ export class OVDashboardPlugin {
return this.axios.get<T>(this.api_url(endpoint));
}
private api_get<T>(
endpoint: string,
on_success: (data: T) => void
): void {
private api_get<T>(endpoint: string, on_success: (data: T) => void): void {
this.api_get_prepare<T>(endpoint)
.then((response) => on_success(response.data))
.catch(this.fail(endpoint));
@ -63,7 +59,7 @@ export class OVDashboardPlugin {
public api_get_string(
endpoint: string,
on_success: (data: string) => void
on_success: (data: string) => void,
): void {
this.api_get<string>(endpoint, (data) => {
if (typeof data !== "string") {
@ -84,7 +80,7 @@ export class OVDashboardPlugin {
public api_get_list(
endpoint: string,
on_success: (data: string[]) => void
on_success: (data: string[]) => void,
): void {
this.api_get(endpoint, (data) => {
if (!this.check_array<string>(data)) {
@ -105,7 +101,7 @@ export class OVDashboardPlugin {
public api_get_object<Type extends object>(
endpoint: string,
on_success: (data: Type) => void
on_success: (data: Type) => void,
): void {
this.api_get<Type>(endpoint, (data) => {
if (!this.check_object(data)) {
@ -119,9 +115,11 @@ export class OVDashboardPlugin {
public api_get_object_multi<Type extends object>(
endpoints: string[],
on_success: (data: Type[]) => void
on_success: (data: Type[]) => void,
): void {
const promises = endpoints.map((endpoint) => this.api_get_prepare<Type>(endpoint));
const promises = endpoints.map((endpoint) =>
this.api_get_prepare<Type>(endpoint),
);
Promise.all(promises)
.then((responses) => {

4
ui/src/plugins/vuetify.ts
View file

@ -1,5 +1,5 @@
import Vue from 'vue';
import Vuetify from 'vuetify/lib/framework';
import Vue from "vue";
import Vuetify from "vuetify/lib/framework";
Vue.use(Vuetify);

42
ui/src/registerServiceWorker.ts
View file

@ -1,32 +1,34 @@
/* eslint-disable no-console */
import { register } from 'register-service-worker'
import { register } from "register-service-worker";
if (process.env.NODE_ENV === 'production') {
if (process.env.NODE_ENV === "production") {
register(`${process.env.BASE_URL}service-worker.js`, {
ready () {
ready() {
console.log(
'App is being served from cache by a service worker.\n' +
'For more details, visit https://goo.gl/AFskqB'
)
"App is being served from cache by a service worker.\n" +
"For more details, visit https://goo.gl/AFskqB",
);
},
registered () {
console.log('Service worker has been registered.')
registered() {
console.log("Service worker has been registered.");
},
cached () {
console.log('Content has been cached for offline use.')
cached() {
console.log("Content has been cached for offline use.");
},
updatefound () {
console.log('New content is downloading.')
updatefound() {
console.log("New content is downloading.");
},
updated () {
console.log('New content is available; please refresh.')
updated() {
console.log("New content is available; please refresh.");
},
offline () {
console.log('No internet connection found. App is running in offline mode.')
offline() {
console.log(
"No internet connection found. App is running in offline mode.",
);
},
error (error) {
console.error('Error during service worker registration:', error)
}
})
error(error) {
console.error("Error during service worker registration:", error);
},
});
}

98
ui/src/sass/fonts.scss
View file

@ -1,11 +1,17 @@
@font-face {
font-family: "Lubalin Graph";
src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot");
src: url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff") format("woff"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.svg#Lubalin BQ") format("svg");
src:
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/60eaf3171fce0c04eb9b3e08bba9bf05.svg#Lubalin BQ")
format("svg");
font-weight: bold;
font-style: normal;
}
@ -13,11 +19,17 @@
@font-face {
font-family: "Lubalin Graph";
src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot");
src: url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff") format("woff"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.svg#LubalinGraph-Book") format("svg");
src:
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/ad42b6e73cbf720f172faa6355b69ec8.svg#LubalinGraph-Book")
format("svg");
font-weight: normal;
font-style: normal;
}
@ -25,11 +37,17 @@
@font-face {
font-family: "Neue Praxis";
src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot");
src: url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff") format("woff"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.svg#PraxisEF") format("svg");
src:
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/95d43d14f7d8f0f4692f507c86a29e25.svg#PraxisEF")
format("svg");
font-weight: bold;
font-style: normal;
}
@ -37,11 +55,17 @@
@font-face {
font-family: "Neue Praxis";
src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot");
src: url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff") format("woff"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.svg#PraxisEF") format("svg");
src:
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/3d62d4fffdd20ba4608e1b29e0f6fb42.svg#PraxisEF")
format("svg");
font-weight: normal;
font-style: normal;
}
@ -49,11 +73,17 @@
@font-face {
font-family: "Neue Demos";
src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot");
src: url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff") format("woff"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.svg#DemosEF") format("svg");
src:
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/57c19d4b8c4d1632fc97994508a35f5d.svg#DemosEF")
format("svg");
font-weight: normal;
font-style: normal;
}
@ -61,11 +91,17 @@
@font-face {
font-family: "Neue Demos";
src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot");
src: url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot?#iefix") format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff2") format("woff2"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff") format("woff"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.ttf") format("truetype"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.svg#DemosEF") format("svg");
src:
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.eot?#iefix")
format("embedded-opentype"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff2")
format("woff2"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.woff")
format("woff"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.ttf")
format("truetype"),
url("//db.onlinewebfonts.com/t/ad75fa70682671bbf5a5cec5f6df1470.svg#DemosEF")
format("svg");
font-weight: normal;
font-style: italic;
}
@ -91,4 +127,4 @@
@extend .thw-text-font;
font-style: italic !important;
}
}

2
ui/src/sass/variables.scss
View file

@ -1,2 +1,2 @@
$heading-font-family: "Neue Praxis", "Roboto", sans-serif;
$body-font-family: "Neue Demos", serif;
$body-font-family: "Neue Demos", serif;

21
ui/tsconfig.json
View file

@ -16,20 +16,11 @@
"useDefineForClassFields": true,
"sourceMap": true,
"baseUrl": ".",
"types": [
"webpack-env"
],
"types": ["webpack-env"],
"paths": {
"@/*": [
"src/*"
]
"@/*": ["src/*"]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
},
"include": [
"src/**/*.ts",
@ -38,7 +29,5 @@
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}
"exclude": ["node_modules"]
}

9
ui/vue.config.js
View file

@ -1,6 +1,5 @@
const { defineConfig } = require('@vue/cli-service')
const { defineConfig } = require("@vue/cli-service");
module.exports = defineConfig({
transpileDependencies: [
'vuetify'
]
})
transpileDependencies: ["vuetify"],
});

3740
ui/yarn.lock
View file

File diff suppressed because it is too large Load diff