webapp: Apply auto formatter

hoylabs · Jul 5, 2024 · 342642e · 342642e
1 parent d8316db
commit 342642e
Show file tree

Hide file tree

Showing 66 changed files with 2,298 additions and 1,436 deletions.
diff --git a/webapp/src/App.vue b/webapp/src/App.vue
@@ -5,10 +5,10 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import NavBar from "./components/NavBar.vue";
+import NavBar from './components/NavBar.vue';
 
 export default defineComponent({
-    name: "App",
+    name: 'App',
     components: {
         NavBar,
     },

diff --git a/webapp/src/components/BasePage.vue b/webapp/src/components/BasePage.vue
@@ -1,19 +1,29 @@
 <template>
-    <div :class="{'container-xxl': !isWideScreen,
-    'container-fluid': isWideScreen}" role="main">
+    <div :class="{ 'container-xxl': !isWideScreen, 'container-fluid': isWideScreen }" role="main">
         <div class="page-header">
             <div class="row">
                 <div class="col-sm-11">
-                    <h1>{{ title }}
-                        <span v-if="showWebSocket" :class="{
-                            'onlineMarker': isWebsocketConnected,
-                            'offlineMarker': !isWebsocketConnected,
-                        }"></span>
+                    <h1>
+                        {{ title }}
+                        <span
+                            v-if="showWebSocket"
+                            :class="{
+                                onlineMarker: isWebsocketConnected,
+                                offlineMarker: !isWebsocketConnected,
+                            }"
+                        ></span>
                     </h1>
                 </div>
                 <div class="col-sm-1" v-if="showReload">
-                    <button type="button" class="float-end btn btn-outline-primary"
-                        @click="$emit('reload')" v-tooltip :title="$t('base.Reload')" ><BIconArrowClockwise /></button>
+                    <button
+                        type="button"
+                        class="float-end btn btn-outline-primary"
+                        @click="$emit('reload')"
+                        v-tooltip
+                        :title="$t('base.Reload')"
+                    >
+                        <BIconArrowClockwise />
+                    </button>
                 </div>
             </div>
         </div>
@@ -48,19 +58,19 @@ export default defineComponent({
         showReload: { type: Boolean, required: false, default: false },
     },
     mounted() {
-        console.log("init");
+        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: () => {
                 this.$emit('reload');
-            }
+            },
         });
     },
     unmounted() {
-        console.log("destroy");
+        console.log('destroy');
         PullToRefresh.destroyAll();
     },
 });
@@ -100,13 +110,15 @@ export default defineComponent({
     margin: -12px 0 0 -12px;
     border: 1px solid #00bb00;
     border-radius: 50%;
-    box-shadow: 0 0 4px #00bb00, inset 0 0 4px rgb(56, 111, 169);
+    box-shadow:
+        0 0 4px #00bb00,
+        inset 0 0 4px rgb(56, 111, 169);
     transform: scale(0);
     animation: online 2.5s ease-in-out infinite;
 }
 @keyframes online {
     0% {
-        transform: scale(.1);
+        transform: scale(0.1);
         opacity: 1;
     }
 

diff --git a/webapp/src/components/BootstrapAlert.vue b/webapp/src/components/BootstrapAlert.vue
@@ -1,44 +1,50 @@
 <template>
     <div v-if="isAlertVisible" ref="element" class="alert" role="alert" :class="classes">
         <slot />
-        <button v-if="dismissible" type="button" class="btn-close" data-bs-dismiss="alert" :aria-label="dismissLabel"
-            @click="dismissClicked" />
+        <button
+            v-if="dismissible"
+            type="button"
+            class="btn-close"
+            data-bs-dismiss="alert"
+            :aria-label="dismissLabel"
+            @click="dismissClicked"
+        />
     </div>
 </template>
 
 <script lang="ts">
-import Alert from "bootstrap/js/dist/alert";
-import { computed, defineComponent, onBeforeUnmount, ref, watch } from "vue";
+import Alert from 'bootstrap/js/dist/alert';
+import { computed, defineComponent, onBeforeUnmount, ref, watch } from 'vue';
 
 export const toInteger = (value: number, defaultValue = NaN) => {
     return Number.isInteger(value) ? value : defaultValue;
 };
 
 export default defineComponent({
-    name: "BootstrapAlert",
+    name: 'BootstrapAlert',
     props: {
-        dismissLabel: { type: String, default: "Close" },
+        dismissLabel: { type: String, default: 'Close' },
         dismissible: { type: Boolean, default: false },
         fade: { type: Boolean, default: false },
         modelValue: { type: [Boolean, Number], default: false },
         show: { type: Boolean, default: false },
-        variant: { type: String, default: "info" },
+        variant: { type: String, default: 'info' },
     },
-    emits: ["dismissed", "dismiss-count-down", "update:modelValue"],
+    emits: ['dismissed', 'dismiss-count-down', 'update:modelValue'],
     setup(props, { emit }) {
         const element = ref<HTMLElement>();
         const instance = ref<Alert>();
         const classes = computed(() => ({
             [`alert-${props.variant}`]: props.variant,
             show: props.modelValue,
-            "alert-dismissible": props.dismissible,
+            'alert-dismissible': props.dismissible,
             fade: props.modelValue,
         }));
 
         let _countDownTimeout: number | undefined = 0;
 
         const parseCountDown = (value: boolean | number) => {
-            if (typeof value === "boolean") {
+            if (typeof value === 'boolean') {
                 return 0;
             }
 
@@ -53,9 +59,12 @@ export default defineComponent({
         };
 
         const countDown = ref();
-        watch(() => props.modelValue, () => {
-            countDown.value = parseCountDown(props.modelValue);
-        });
+        watch(
+            () => props.modelValue,
+            () => {
+                countDown.value = parseCountDown(props.modelValue);
+            }
+        );
 
         const isAlertVisible = computed(() => props.modelValue || props.show);
 
@@ -85,23 +94,23 @@ export default defineComponent({
         };
 
         const dismissClicked = () => {
-            if (typeof props.modelValue === "boolean") {
-                emit("update:modelValue", false);
+            if (typeof props.modelValue === 'boolean') {
+                emit('update:modelValue', false);
             } else {
-                emit("update:modelValue", 0);
+                emit('update:modelValue', 0);
             }
-            emit("dismissed");
+            emit('dismissed');
         };
 
         watch(() => props.modelValue, handleShowAndModelChanged);
         watch(() => props.show, handleShowAndModelChanged);
 
         watch(countDown, (newValue) => {
             clearCountDownInterval();
-            if (typeof props.modelValue === "boolean") return;
-            emit("dismiss-count-down", newValue);
-            if (newValue === 0 && props.modelValue > 0) emit("dismissed");
-            if (props.modelValue !== newValue) emit("update:modelValue", newValue);
+            if (typeof props.modelValue === 'boolean') return;
+            emit('dismiss-count-down', newValue);
+            if (newValue === 0 && props.modelValue > 0) emit('dismissed');
+            if (props.modelValue !== newValue) emit('update:modelValue', newValue);
             if (newValue > 0) {
                 _countDownTimeout = setTimeout(() => {
                     countDown.value--;

diff --git a/webapp/src/components/CardElement.vue b/webapp/src/components/CardElement.vue
@@ -1,5 +1,5 @@
 <template>
-    <div :class="['card', addSpace ? 'mt-5' : '' ]">
+    <div :class="['card', addSpace ? 'mt-5' : '']">
         <div :class="['card-header', textVariant]">{{ text }}</div>
         <div :class="['card-body', 'card-text', centerContent ? 'text-center' : '']">
             <slot />
@@ -12,10 +12,10 @@ import { defineComponent } from 'vue';
 
 export default defineComponent({
     props: {
-        'text': String,
-        'textVariant': String,
-        'addSpace': Boolean,
-        'centerContent': Boolean,
+        text: String,
+        textVariant: String,
+        addSpace: Boolean,
+        centerContent: Boolean,
     },
 });
 </script>
diff --git a/webapp/src/components/DevInfo.vue b/webapp/src/components/DevInfo.vue
@@ -1,8 +1,7 @@
 <template>
     <BootstrapAlert :show="!devInfoList.valid_data">
-        <h4 class="alert-heading">
-            <BIconInfoSquare class="fs-2" />&nbsp;{{ $t('devinfo.NoInfo') }}
-        </h4>{{ $t('devinfo.NoInfoLong') }}
+        <h4 class="alert-heading"><BIconInfoSquare class="fs-2" />&nbsp;{{ $t('devinfo.NoInfo') }}</h4>
+        {{ $t('devinfo.NoInfoLong') }}
     </BootstrapAlert>
     <table v-if="devInfoList.valid_data" class="table table-hover">
         <tbody>
@@ -53,7 +52,7 @@
 
 <script lang="ts">
 import BootstrapAlert from '@/components/BootstrapAlert.vue';
-import type { DevInfoStatus } from "@/types/DevInfoStatus";
+import type { DevInfoStatus } from '@/types/DevInfoStatus';
 import { BIconInfoSquare } from 'bootstrap-icons-vue';
 import { defineComponent, type PropType } from 'vue';
 
@@ -70,20 +69,20 @@ export default defineComponent({
             return (value: number) => {
                 const version_major = Math.floor(value / 10000);
                 const version_minor = Math.floor((value - version_major * 10000) / 100);
-                const version_patch = Math.floor((value - version_major * 10000 - version_minor * 100));
-                return version_major + "." + version_minor + "." + version_patch;
+                const version_patch = Math.floor(value - version_major * 10000 - version_minor * 100);
+                return version_major + '.' + version_minor + '.' + version_patch;
             };
         },
         productionYear() {
-            return() => {
-                return ((parseInt(this.devInfoList.serial, 16) >> (7 * 4)) & 0xF) + 2014;
-            }
+            return () => {
+                return ((parseInt(this.devInfoList.serial, 16) >> (7 * 4)) & 0xf) + 2014;
+            };
         },
         productionWeek() {
-            return() => {
-                return ((parseInt(this.devInfoList.serial, 16) >> (5 * 4)) & 0xFF).toString(16);
-            }
-        }
-    }
+            return () => {
+                return ((parseInt(this.devInfoList.serial, 16) >> (5 * 4)) & 0xff).toString(16);
+            };
+        },
+    },
 });
 </script>
diff --git a/webapp/src/components/EventLog.vue b/webapp/src/components/EventLog.vue
@@ -36,4 +36,4 @@ export default defineComponent({
         },
     },
 });
-</script>
+</script>
diff --git a/webapp/src/components/FirmwareInfo.vue b/webapp/src/components/FirmwareInfo.vue
@@ -17,10 +17,16 @@
                     </tr>
                     <tr>
                         <th>{{ $t('firmwareinfo.FirmwareVersion') }}</th>
-                        <td><a :href="versionInfoUrl"
-                                target="_blank" v-tooltip :title="$t('firmwareinfo.FirmwareVersionHint')">
+                        <td>
+                            <a
+                                :href="versionInfoUrl"
+                                target="_blank"
+                                v-tooltip
+                                :title="$t('firmwareinfo.FirmwareVersionHint')"
+                            >
                                 {{ systemStatus.git_hash }}
-                            </a></td>
+                            </a>
+                        </td>
                     </tr>
                     <tr>
                         <th>{{ $t('firmwareinfo.PioEnv') }}</th>
@@ -30,16 +36,32 @@
                         <th>{{ $t('firmwareinfo.FirmwareUpdate') }}</th>
                         <td>
                             <div class="form-check form-check-inline form-switch">
-                                <input v-model="modelAllowVersionInfo" class="form-check-input" type="checkbox" role="switch" v-tooltip :title="$t('firmwareinfo.FrmwareUpdateAllow')" />
+                                <input
+                                    v-model="modelAllowVersionInfo"
+                                    class="form-check-input"
+                                    type="checkbox"
+                                    role="switch"
+                                    v-tooltip
+                                    :title="$t('firmwareinfo.FrmwareUpdateAllow')"
+                                />
                                 <label class="form-check-label">
-                                    <a v-if="modelAllowVersionInfo && systemStatus.update_url !== undefined" :href="systemStatus.update_url" target="_blank" v-tooltip
-                                        :title="$t('firmwareinfo.FirmwareUpdateHint')">
+                                    <a
+                                        v-if="modelAllowVersionInfo && systemStatus.update_url !== undefined"
+                                        :href="systemStatus.update_url"
+                                        target="_blank"
+                                        v-tooltip
+                                        :title="$t('firmwareinfo.FirmwareUpdateHint')"
+                                    >
                                         <span class="badge" :class="systemStatus.update_status">
                                             {{ systemStatus.update_text }}
                                         </span>
                                     </a>
-                                    <span v-else-if="modelAllowVersionInfo" class="badge" :class="systemStatus.update_status">
-                                            {{ systemStatus.update_text }}
+                                    <span
+                                        v-else-if="modelAllowVersionInfo"
+                                        class="badge"
+                                        :class="systemStatus.update_status"
+                                    >
+                                        {{ systemStatus.update_text }}
                                     </span>
                                 </label>
                             </div>
@@ -59,7 +81,9 @@
                     </tr>
                     <tr>
                         <th>{{ $t('firmwareinfo.Uptime') }}</th>
-                        <td>{{ $t('firmwareinfo.UptimeValue', timeInHours(systemStatus.uptime)) }}</td>
+                        <td>
+                            {{ $t('firmwareinfo.UptimeValue', timeInHours(systemStatus.uptime)) }}
+                        </td>
                     </tr>
                 </tbody>
             </table>
@@ -93,15 +117,15 @@ export default defineComponent({
         timeInHours() {
             return (value: number) => {
                 const [count, time] = timestampToString(this.$i18n.locale, value, true);
-                return {count, time};
+                return { count, time };
             };
         },
         versionInfoUrl(): string {
             if (this.systemStatus.git_is_hash) {
                 return 'https://github.com/tbnobody/OpenDTU/commits/' + this.systemStatus.git_hash;
             }
             return 'https://github.com/tbnobody/OpenDTU/releases/tag/' + this.systemStatus.git_hash;
-        }
+        },
     },
 });
 </script>
diff --git a/webapp/src/components/FormFooter.vue b/webapp/src/components/FormFooter.vue
@@ -1,7 +1,9 @@
 <template>
-    <hr class="border border-3 opacity-75">
+    <hr class="border border-3 opacity-75" />
     <div class="d-grid gap-2 d-md-flex justify-content-md-end">
-        <button type="button" class="btn btn-secondary" @click="$emit('reload')">{{ $t('base.Cancel') }}</button>
+        <button type="button" class="btn btn-secondary" @click="$emit('reload')">
+            {{ $t('base.Cancel') }}
+        </button>
         <button type="submit" class="btn btn-primary">{{ $t('base.Save') }}</button>
     </div>
 </template>
diff --git a/webapp/src/components/FsInfo.vue b/webapp/src/components/FsInfo.vue
@@ -3,8 +3,14 @@
         <th>{{ name }}</th>
         <td>
             <div class="progress">
-                <div class="progress-bar" role="progressbar" :style="{ width: getPercent() + '%' }"
-                    v-bind:aria-valuenow="getPercent()" aria-valuemin="0" aria-valuemax="100">
+                <div
+                    class="progress-bar"
+                    role="progressbar"
+                    :style="{ width: getPercent() + '%' }"
+                    v-bind:aria-valuenow="getPercent()"
+                    aria-valuemin="0"
+                    aria-valuemax="100"
+                >
                     {{ $n(getPercent() / 100, 'percent') }}
                 </div>
             </div>