From a1f92acdb8131eb2219c07e2b0b2f4973fd12409 Mon Sep 17 00:00:00 2001 From: elizavetaRa Date: Fri, 4 Nov 2022 17:00:07 +0100 Subject: [PATCH] Notifications of outages --- packages/web-app-files/src/App.vue | 42 +++++++++++++++++++ .../web-runtime/src/components/MessageBar.vue | 2 + 2 files changed, 44 insertions(+) diff --git a/packages/web-app-files/src/App.vue b/packages/web-app-files/src/App.vue index c1a960a12fc..9bed6a55064 100644 --- a/packages/web-app-files/src/App.vue +++ b/packages/web-app-files/src/App.vue @@ -8,6 +8,7 @@ import { defineComponent, onBeforeUnmount, watch, ref } from 'vue' import { useRoute, useStore } from 'web-pkg/src/composables' import { eventBus } from 'web-pkg/src/services/eventBus' +import { mapActions } from 'vuex' export default defineComponent({ setup() { @@ -34,6 +35,47 @@ export default defineComponent({ eventBus.unsubscribe('drop', drop) }) return { dragareaEnabled } + }, + + computed: { + otgStyle() { + return { + 'background-color': 'var(--oc-color-swatch-warning-default) !important' + } + } + }, + + async mounted() { + const accessToken = this.$store.getters['runtime/auth/accessToken'] + + const headers = new Headers() + headers.append('Authorization', 'Bearer ' + accessToken) + headers.append('X-Requested-With', 'XMLHttpRequest') + const response = await fetch('otg', { + method: 'GET', + headers + }) + if (response.status === 200) { + const data = await response.json() + if (data.message) + this.showMessage({ + title: 'OTG', + desc: data.message, + timeout: 10, + status: 'warning', + style: this.otgStyle + }) + } + }, + + methods: { + ...mapActions(['showMessage']), + hideDropzone() { + this.dragareaEnabled = false + }, + onDragOver(event) { + this.dragareaEnabled = (event.dataTransfer.types || []).some((e) => e === 'Files') + } } }) diff --git a/packages/web-runtime/src/components/MessageBar.vue b/packages/web-runtime/src/components/MessageBar.vue index eb1f5724e18..72f39445137 100644 --- a/packages/web-runtime/src/components/MessageBar.vue +++ b/packages/web-runtime/src/components/MessageBar.vue @@ -6,6 +6,8 @@ :title="item.title" :message="item.desc" :status="item.status" + :timeout="item.timeout" + :style="item.style" @close="deleteMessage(item)" />