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

move axios to ovdashboard plugin

Browse source
This commit is contained in:
Jörn-Michael Miehe 2022-09-16 21:15:46 +00:00
parent 9804fffbf2
commit ac13f60b81
6 changed files with 111 additions and 122 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

81
ui/src/App.vue
View file

@ -87,89 +87,40 @@ export default class App extends Vue {
private ticker_html = "<p>changeme</p>"; private ticker_html = "<p>changeme</p>";
private ticker_color = "primary"; private ticker_color = "primary";
private fail(name: string): (arg0: unknown) => void {
return (reason: unknown) =>
console.warn("Failed to query", name, "-", reason);
}
private api_query_simple(
endpoint: string,
on_success: (data: unknown) => void
): void {
this.$axios
.get(this.$ovdashboard.api_url(endpoint))
.then((response) => on_success(response.data))
.catch(this.fail(endpoint));
}
private api_query_simple_string(
endpoint: string,
on_success: (data: string) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (typeof data !== "string") return;
on_success(data);
});
}
private api_query_simple_object(
endpoint: string,
on_success: (data: Record<string, unknown>) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (typeof data !== "object") return;
if (data === null) return;
on_success(data as Record<string, unknown>);
});
}
private api_query_simple_list(
endpoint: string,
on_success: (data: string[]) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (!Array.isArray(data)) return;
if (!data.every((value) => typeof value === "string")) return;
on_success(data);
});
}
private update(): void { private update(): void {
// Update Logo Config // Update Logo Config
this.api_query_simple_object("misc/config/logo", (data) => { this.$ovdashboard.api_query_simple_object("misc/config/logo", (data) => {
this.logo_above = data.above as string; this.logo_above = data.above as string;
this.logo_below = data.below as string; this.logo_below = data.below as string;
}); });
// Update Title // Update Title
this.api_query_simple_string("text/get/html/title", (data) => { this.$ovdashboard.api_query_simple_string("text/get/html/title", (data) => {
this.title_html = data; this.title_html = data;
}); });
// Update Images // Update Images
this.api_query_simple_list("image/list", (data) => { this.$ovdashboard.api_query_simple_list("image/list", (data) => {
this.image_urls = data.map((name: string) => this.image_urls = data.map((name: string) =>
this.$ovdashboard.api_url("image/get/" + name) this.$ovdashboard.api_url("image/get/" + name)
); );
}); });
// Update Image Config // Update Image Config
this.api_query_simple_object("image/config", (data) => { this.$ovdashboard.api_query_simple_object("image/config", (data) => {
this.image_height = data.height as number; this.image_height = data.height as number;
this.image_contain = data.contain as boolean; this.image_contain = data.contain as boolean;
this.image_speed = data.speed as number; this.image_speed = data.speed as number;
}); });
// Update Message // Update Message
this.api_query_simple_string("text/get/html/message", (data) => { this.$ovdashboard.api_query_simple_string(
this.message_html = data; "text/get/html/message",
}); (data) => (this.message_html = data)
);
// Update Calendar Aggregates // Update Calendar Aggregates
this.api_query_simple_list("aggregate/list", (data) => { this.$ovdashboard.api_query_simple_list("aggregate/list", (data) => {
let promises = data.map((name: string) => let promises = data.map((name: string) =>
this.$axios.get(this.$ovdashboard.api_url("aggregate/get/" + name)) this.$axios.get(this.$ovdashboard.api_url("aggregate/get/" + name))
); );
@ -185,37 +136,37 @@ export default class App extends Vue {
}); });
} }
}) })
.catch(this.fail("Calendar Aggregates")); .catch(this.$ovdashboard.fail("Calendar Aggregates"));
}); });
// Update Calendar Config // Update Calendar Config
this.api_query_simple_object("calendar/config", (data) => { this.$ovdashboard.api_query_simple_object("calendar/config", (data) => {
this.calendar_speed = data.speed as number; this.calendar_speed = data.speed as number;
}); });
// Update Server Config // Update Server Config
this.api_query_simple_object("misc/config/server", (data) => { this.$ovdashboard.api_query_simple_object("misc/config/server", (data) => {
this.server_host = data.host as string; this.server_host = data.host as string;
this.server_name = data.name as string; this.server_name = data.name as string;
}); });
// Update Version // Update Version
this.api_query_simple_string("misc/version", (data) => { this.$ovdashboard.api_query_simple_string("misc/version", (data) => {
this.dashboard_version = data; this.dashboard_version = data;
}); });
// Update IP // Update IP
this.api_query_simple_string("misc/lanip", (data) => { this.$ovdashboard.api_query_simple_string("misc/lanip", (data) => {
this.dashboard_ip = data; this.dashboard_ip = data;
}); });
// Update Ticker // Update Ticker
this.api_query_simple_string("ticker/html", (data) => { this.$ovdashboard.api_query_simple_string("ticker/html", (data) => {
this.ticker_html = data; this.ticker_html = data;
}); });
// Update Ticker Config // Update Ticker Config
this.api_query_simple_object("ticker/config", (data) => { this.$ovdashboard.api_query_simple_object("ticker/config", (data) => {
this.ticker_color = data.color as string; this.ticker_color = data.color as string;
}); });
} }

9
ui/src/d.ts/shims-axios.d.ts vendored
View file

@ -1,9 +0,0 @@
import axios from "axios";
declare module 'vue/types/vue' {
interface Vue {
$axios: typeof axios;
}
}
export { };

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

@ -1,7 +1,33 @@
import { AxiosInstance } from "axios";
declare module 'vue/types/vue' { declare module 'vue/types/vue' {
interface Vue { interface Vue {
$axios: AxiosInstance;
$ovdashboard: { $ovdashboard: {
api_url: (endpoint?: string) => string; api_url: (endpoint?: string) => string;
fail: (name: string) => ((arg0: unknown) => void);
api_query_simple: (
endpoint: string,
on_success: (data: unknown) => void
) => void;
api_query_simple_string: (
endpoint: string,
on_success: (data: string) => void
) => void;
api_query_simple_list: (
endpoint: string,
on_success: (data: string[]) => void
) => void;
api_query_simple_object: (
endpoint: string,
on_success: (data: Record<string, unknown>) => void
) => void;
} }
} }
} }

2
ui/src/main.ts
View file

@ -4,12 +4,10 @@ import "@/registerServiceWorker"
import "@/sass/fonts.scss" import "@/sass/fonts.scss"
import App from "@/App.vue" import App from "@/App.vue"
import axios from "@/plugins/axios"
import ovdashboard from "@/plugins/ovdashboard" import ovdashboard from "@/plugins/ovdashboard"
import vuetify from "@/plugins/vuetify" import vuetify from "@/plugins/vuetify"
Vue.config.productionTip = false Vue.config.productionTip = false
Vue.use(axios)
Vue.use(ovdashboard) Vue.use(ovdashboard)
new Vue({ new Vue({

46
ui/src/plugins/axios.ts
View file

@ -1,46 +0,0 @@
import axios from 'axios';
import Vue from 'vue';
class AxiosPlugin {
public install(vue: typeof Vue) {
// Full config: https://github.com/axios/axios#request-config
// axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
// axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
const config = {
// baseURL: process.env.baseURL || process.env.apiUrl || ""
// timeout: 60 * 1000, // Timeout
// withCredentials: true, // Check cross-site Access-Control
};
const _axios = axios.create(config);
_axios.interceptors.request.use(
function (config) {
// Do something before request is sent
return config;
},
function (error) {
// Do something with request error
return Promise.reject(error);
}
);
// Add a response interceptor
_axios.interceptors.response.use(
function (response) {
// Do something with response data
return response;
},
function (error) {
// Do something with response error
return Promise.reject(error);
}
);
vue.prototype.$axios = _axios;
}
}
export default new AxiosPlugin();

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

@ -1,7 +1,26 @@
import axios, { AxiosInstance } from 'axios';
import Vue from 'vue'; import Vue from 'vue';
class OVDashboardPlugin { class OVDashboardPlugin {
private axios: AxiosInstance;
public constructor() {
// Full config: https://github.com/axios/axios#request-config
// axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
// axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
const config = {
// baseURL: process.env.baseURL || process.env.apiUrl || ""
// timeout: 60 * 1000, // Timeout
// withCredentials: true, // Check cross-site Access-Control
};
this.axios = axios.create(config);
}
public install(vue: typeof Vue) { public install(vue: typeof Vue) {
vue.prototype.$axios = this.axios;
vue.prototype.$ovdashboard = this; vue.prototype.$ovdashboard = this;
} }
@ -25,6 +44,56 @@ class OVDashboardPlugin {
else else
return this.api_baseurl + "/" + endpoint; return this.api_baseurl + "/" + endpoint;
} }
public fail(name: string): (reason: unknown) => void {
return (reason: unknown) =>
console.warn("Failed to query", name, "-", reason);
}
public api_query_simple(
endpoint: string,
on_success: (data: unknown) => void
): void {
this.axios
.get(this.api_url(endpoint))
.then((response) => on_success(response.data))
.catch(this.fail(endpoint));
}
public api_query_simple_string(
endpoint: string,
on_success: (data: string) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (typeof data !== "string") return;
on_success(data);
});
}
public api_query_simple_list(
endpoint: string,
on_success: (data: string[]) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (!Array.isArray(data)) return;
if (!data.every((value) => typeof value === "string")) return;
on_success(data);
});
}
public api_query_simple_object(
endpoint: string,
on_success: (data: Record<string, unknown>) => void
): void {
this.api_query_simple(endpoint, (data) => {
if (typeof data !== "object") return;
if (data === null) return;
on_success(data as Record<string, unknown>);
});
}
} }
export default new OVDashboardPlugin(); export default new OVDashboardPlugin();