patrick/OpenDTU
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

webapp: Fix lint errors

Browse Source
This commit is contained in:
Thomas Basler 2024-04-12 20:34:30 +02:00
parent b58d08683e
commit de156ef10a
13 changed files with 189 additions and 185 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
webapp/src/components/BasePage.vue
View File

@ -48,15 +48,14 @@ export default defineComponent({
showReload: { type: Boolean, required: false, default: false },
},
mounted() {
var self = this;
console.log("init");
PullToRefresh.init({
mainElement: 'body', // above which element?
instructionsPullToRefresh: this.$t('base.Pull'),
instructionsReleaseToRefresh: this.$t('base.Release'),
instructionsRefreshing: this.$t('base.Refreshing'),
onRefresh: function() {
self.$emit('reload');
onRefresh: () => {
this.$emit('reload');
}
});
},

4
webapp/src/components/BootstrapAlert.vue
View File

@ -52,7 +52,7 @@ export default defineComponent({
_countDownTimeout = undefined;
};
var countDown = ref();
const countDown = ref();
watch(() => props.modelValue, () => {
countDown.value = parseCountDown(props.modelValue);
});
@ -116,4 +116,4 @@ export default defineComponent({
};
},
});
</script>
</script>

4
webapp/src/components/FirmwareInfo.vue
View File

@ -83,10 +83,10 @@ export default defineComponent({
},
computed: {
modelAllowVersionInfo: {
get(): any {
get(): boolean {
return !!this.allowVersionInfo;
},
set(value: any) {
set(value: boolean) {
this.$emit('update:allowVersionInfo', value);
},
},

4
webapp/src/components/InputElement.vue
View File

@ -83,10 +83,12 @@ export default defineComponent({
},
computed: {
model: {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
get(): any {
if (this.type === 'checkbox') return !!this.modelValue;
return this.modelValue;
},
// eslint-disable-next-line @typescript-eslint/no-explicit-any
set(value: any) {
this.$emit('update:modelValue', value);
},
@ -112,4 +114,4 @@ export default defineComponent({
}
},
});
</script>
</script>

2
webapp/src/components/InputSerial.vue
View File

@ -28,9 +28,11 @@ export default defineComponent({
},
computed: {
model: {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
get(): any {
return this.modelValue;
},
// eslint-disable-next-line @typescript-eslint/no-explicit-any
set(value: any) {
this.$emit('update:modelValue', value);
},

24
webapp/src/components/NavBar.vue
View File

@ -146,8 +146,8 @@ export default defineComponent({
},
isEaster() {
const easter = this.getEasterSunday(this.now.getFullYear());
var easterStart = new Date(easter);
var easterEnd = new Date(easter);
const easterStart = new Date(easter);
const easterEnd = new Date(easter);
easterStart.setDate(easterStart.getDate() - 2);
easterEnd.setDate(easterEnd.getDate() + 1);
return this.now >= easterStart && this.now < easterEnd;
@ -170,18 +170,18 @@ export default defineComponent({
this.$refs.navbarCollapse && (this.$refs.navbarCollapse as HTMLElement).classList.remove("show");
},
getEasterSunday(year: number): Date {
var f = Math.floor;
var G = year % 19;
var C = f(year / 100);
var H = (C - f(C / 4) - f((8 * C + 13) / 25) + 19 * G + 15) % 30;
var I = H - f(H / 28) * (1 - f(29 / (H + 1)) * f((21 - G) / 11));
var J = (year + f(year / 4) + I + 2 - C + f(C / 4)) % 7;
var L = I - J;
var month = 3 + f((L + 40) / 44);
var day = L + 28 - 31 * f(month / 4);
const f = Math.floor;
const G = year % 19;
const C = f(year / 100);
const H = (C - f(C / 4) - f((8 * C + 13) / 25) + 19 * G + 15) % 30;
const I = H - f(H / 28) * (1 - f(29 / (H + 1)) * f((21 - G) / 11));
const J = (year + f(year / 4) + I + 2 - C + f(C / 4)) % 7;
const L = I - J;
const month = 3 + f((L + 40) / 44);
const day = L + 28 - 31 * f(month / 4);
return new Date(year, month - 1, day);
}
},
});
</script>
</script>

2
webapp/src/components/PinInfo.vue
View File

@ -84,9 +84,11 @@ export default defineComponent({
let comCur = 999999;
if (this.selectedPinAssignment && category in this.selectedPinAssignment) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
comSel = (this.selectedPinAssignment as any)[category][prop];
}
if (this.currentPinAssignment && category in this.currentPinAssignment) {
// eslint-disable-next-line @typescript-eslint/no-explicit-any
comCur = (this.currentPinAssignment as any)[category][prop];
}

2
webapp/src/utils/authentication.ts
View File

@ -41,7 +41,7 @@ export function isLoggedIn(): boolean {
return (localStorage.getItem('user') != null);
}
export function login(username: String, password: String) {
export function login(username: string, password: string) {
const requestOptions = {
method: 'GET',
headers: {

4
webapp/src/views/ConfigAdminView.vue
View File

@ -188,8 +188,8 @@ export default defineComponent({
fetch("/api/config/get?file=" + this.backupFileSelect, { headers: authHeader() })
.then(res => res.blob())
.then(blob => {
var file = window.URL.createObjectURL(blob);
var a = document.createElement('a');
const file = window.URL.createObjectURL(blob);
const a = document.createElement('a');
a.href = file;
a.download = this.backupFileSelect;
document.body.appendChild(a);

308
webapp/src/views/ConsoleInfoView.vue
View File

@ -1,154 +1,154 @@
<template>
<BasePage :title="$t('console.Console')" :isLoading="dataLoading">
<CardElement :text="$t('console.VirtualDebugConsole')" textVariant="text-bg-primary">
<div class="row g-3 align-items-center">
<div class="col">
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="autoScroll"
v-model="isAutoScroll">
<label class="form-check-label" for="autoScroll">
{{ $t('console.EnableAutoScroll') }}
</label>
</div>
</div>
<div class="col text-end">
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" :onClick="clearConsole">
{{ $t('console.ClearConsole') }}</button>
<button type="button" class="btn btn-secondary" :onClick="copyConsole">
{{ $t('console.CopyToClipboard') }}</button>
</div>
</div>
</div>
<textarea id="console" class="form-control" rows="24" v-model="consoleBuffer" readonly></textarea>
</CardElement>
</BasePage>
</template>
<script lang="ts">
import BasePage from '@/components/BasePage.vue';
import CardElement from '@/components/CardElement.vue';
import { authUrl } from '@/utils/authentication';
import { defineComponent } from 'vue';
export default defineComponent({
components: {
BasePage,
CardElement,
},
data() {
return {
socket: {} as WebSocket,
heartInterval: 0,
dataLoading: true,
consoleBuffer: "",
isAutoScroll: true,
endWithNewline: false,
};
},
created() {
this.initSocket();
this.dataLoading = false;
},
unmounted() {
this.closeSocket();
},
watch: {
consoleBuffer() {
if (this.isAutoScroll) {
let textarea = this.$el.querySelector("#console");
setTimeout(() => {
textarea.scrollTop = textarea.scrollHeight;
}, 0);
}
}
},
methods: {
initSocket() {
console.log("Starting connection to WebSocket Server");
const { protocol, host } = location;
const authString = authUrl();
const webSocketUrl = `${protocol === "https:" ? "wss" : "ws"
}://${authString}${host}/console`;
this.closeSocket();
this.socket = new WebSocket(webSocketUrl);
this.socket.onmessage = (event) => {
console.log(event);
let outstr = new String(event.data);
let removedNewline = false;
if (outstr.endsWith('\n')) {
outstr = outstr.substring(0, outstr.length - 1);
removedNewline = true;
}
this.consoleBuffer += (this.endWithNewline ? this.getOutDate() : '') + outstr.replaceAll("\n", "\n" + this.getOutDate());
this.endWithNewline = removedNewline;
this.heartCheck(); // Reset heartbeat detection
};
this.socket.onopen = function (event) {
console.log(event);
console.log("Successfully connected to the echo websocket server...");
};
// Listen to window events , When the window closes , Take the initiative to disconnect websocket Connect
window.onbeforeunload = () => {
this.closeSocket();
};
},
// Send heartbeat packets regularly * 59s Send a heartbeat
heartCheck() {
this.heartInterval && clearTimeout(this.heartInterval);
this.heartInterval = setInterval(() => {
if (this.socket.readyState === 1) {
// Connection status
this.socket.send("ping");
} else {
this.initSocket(); // Breakpoint reconnection 5 Time
}
}, 5 * 1000);
},
/** To break off websocket Connect */
closeSocket() {
try {
this.socket.close();
} catch {
// continue regardless of error
}
this.heartInterval && clearTimeout(this.heartInterval);
},
getOutDate(): String {
const u = new Date();
return ('0' + u.getHours()).slice(-2) + ':' +
('0' + u.getMinutes()).slice(-2) + ':' +
('0' + u.getSeconds()).slice(-2) + '.' +
(u.getMilliseconds() / 1000).toFixed(3).slice(2, 5) + ' > ';
},
clearConsole() {
this.consoleBuffer = "";
},
copyConsole() {
var input = document.createElement('textarea');
input.innerHTML = this.consoleBuffer;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
}
}
});
</script>
<style>
#console {
background-color: #0C0C0C;
color: #CCCCCC;
padding: 8px;
font-family: courier new;
font-size: .875em;
}
</style>
<template>
<BasePage :title="$t('console.Console')" :isLoading="dataLoading">
<CardElement :text="$t('console.VirtualDebugConsole')" textVariant="text-bg-primary">
<div class="row g-3 align-items-center">
<div class="col">
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" role="switch" id="autoScroll"
v-model="isAutoScroll">
<label class="form-check-label" for="autoScroll">
{{ $t('console.EnableAutoScroll') }}
</label>
</div>
</div>
<div class="col text-end">
<div class="btn-group" role="group">
<button type="button" class="btn btn-primary" :onClick="clearConsole">
{{ $t('console.ClearConsole') }}</button>
<button type="button" class="btn btn-secondary" :onClick="copyConsole">
{{ $t('console.CopyToClipboard') }}</button>
</div>
</div>
</div>
<textarea id="console" class="form-control" rows="24" v-model="consoleBuffer" readonly></textarea>
</CardElement>
</BasePage>
</template>
<script lang="ts">
import BasePage from '@/components/BasePage.vue';
import CardElement from '@/components/CardElement.vue';
import { authUrl } from '@/utils/authentication';
import { defineComponent } from 'vue';
export default defineComponent({
components: {
BasePage,
CardElement,
},
data() {
return {
socket: {} as WebSocket,
heartInterval: 0,
dataLoading: true,
consoleBuffer: "",
isAutoScroll: true,
endWithNewline: false,
};
},
created() {
this.initSocket();
this.dataLoading = false;
},
unmounted() {
this.closeSocket();
},
watch: {
consoleBuffer() {
if (this.isAutoScroll) {
const textarea = this.$el.querySelector("#console");
setTimeout(() => {
textarea.scrollTop = textarea.scrollHeight;
}, 0);
}
}
},
methods: {
initSocket() {
console.log("Starting connection to WebSocket Server");
const { protocol, host } = location;
const authString = authUrl();
const webSocketUrl = `${protocol === "https:" ? "wss" : "ws"
}://${authString}${host}/console`;
this.closeSocket();
this.socket = new WebSocket(webSocketUrl);
this.socket.onmessage = (event) => {
console.log(event);
let outstr = new String(event.data);
let removedNewline = false;
if (outstr.endsWith('\n')) {
outstr = outstr.substring(0, outstr.length - 1);
removedNewline = true;
}
this.consoleBuffer += (this.endWithNewline ? this.getOutDate() : '') + outstr.replaceAll("\n", "\n" + this.getOutDate());
this.endWithNewline = removedNewline;
this.heartCheck(); // Reset heartbeat detection
};
this.socket.onopen = function (event) {
console.log(event);
console.log("Successfully connected to the echo websocket server...");
};
// Listen to window events , When the window closes , Take the initiative to disconnect websocket Connect
window.onbeforeunload = () => {
this.closeSocket();
};
},
// Send heartbeat packets regularly * 59s Send a heartbeat
heartCheck() {
this.heartInterval && clearTimeout(this.heartInterval);
this.heartInterval = setInterval(() => {
if (this.socket.readyState === 1) {
// Connection status
this.socket.send("ping");
} else {
this.initSocket(); // Breakpoint reconnection 5 Time
}
}, 5 * 1000);
},
/** To break off websocket Connect */
closeSocket() {
try {
this.socket.close();
} catch {
// continue regardless of error
}
this.heartInterval && clearTimeout(this.heartInterval);
},
getOutDate(): string {
const u = new Date();
return ('0' + u.getHours()).slice(-2) + ':' +
('0' + u.getMinutes()).slice(-2) + ':' +
('0' + u.getSeconds()).slice(-2) + '.' +
(u.getMilliseconds() / 1000).toFixed(3).slice(2, 5) + ' > ';
},
clearConsole() {
this.consoleBuffer = "";
},
copyConsole() {
const input = document.createElement('textarea');
input.innerHTML = this.consoleBuffer;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
}
}
});
</script>
<style>
#console {
background-color: #0C0C0C;
color: #CCCCCC;
padding: 8px;
font-family: courier new;
font-size: .875em;
}
</style>

12
webapp/src/views/HomeView.vue
View File

@ -5,7 +5,7 @@
<div class="row gy-3">
<div class="col-sm-3 col-md-2" :style="[inverterData.length == 1 ? { 'display': 'none' } : {}]">
<div class="nav nav-pills row-cols-sm-1" id="v-pills-tab" role="tablist" aria-orientation="vertical">
<button v-for="inverter in inverterData" :key="inverter.serial" class="nav-link border border-primary text-break"
<button v-for="inverter in inverterData" :key="inverter.serial" class="nav-link border border-primary text-break"
:id="'v-pills-' + inverter.serial + '-tab'" data-bs-toggle="pill"
:data-bs-target="'#v-pills-' + inverter.serial" type="button" role="tab"
aria-controls="'v-pills-' + inverter.serial" aria-selected="true">
@ -476,17 +476,15 @@ export default defineComponent({
}
};
var self = this;
this.socket.onopen = function (event) {
this.socket.onopen = (event) => {
console.log(event);
console.log("Successfully connected to the echo websocket server...");
self.isWebsocketConnected = true;
this.isWebsocketConnected = true;
};
this.socket.onclose = function () {
this.socket.onclose = () => {
console.log("Connection to websocket closed...")
self.isWebsocketConnected = false;
this.isWebsocketConnected = false;
}
// Listen to window events , When the window closes , Take the initiative to disconnect websocket Connect

2
webapp/src/views/SystemInfoView.vue
View File

@ -99,7 +99,7 @@ export default defineComponent({
}
},
watch: {
allowVersionInfo(allow: Boolean) {
allowVersionInfo(allow: boolean) {
localStorage.setItem("allowVersionInfo", allow ? "1" : "0");
if (allow) {
this.getUpdateInfo();

1
webapp/vite.config.ts
View File

@ -12,6 +12,7 @@ import path from 'path'
// example 'vite.user.ts': export const proxy_target = '192.168.16.107'
let proxy_target;
try {
// eslint-disable-next-line
proxy_target = require('./vite.user.ts').proxy_target;
} catch (error) {
proxy_target = '192.168.20.110';