mirror of
https://github.com/TwiN/gatus.git
synced 2024-11-21 23:43:27 +01:00
fix(ui): Hide endpoint and prev/next arrows while data is being fetched
This commit is contained in:
parent
685351a025
commit
b5e742acde
@ -1,14 +1,15 @@
|
|||||||
<template>
|
<template>
|
||||||
<Loading v-if="!retrievedData" class="h-64 w-64 px-4 my-24"/>
|
<Loading v-if="!retrievedData" class="h-64 w-64 px-4 my-24"/>
|
||||||
<slot v-else>
|
<slot>
|
||||||
<Endpoints
|
<Endpoints
|
||||||
|
v-show="retrievedData"
|
||||||
:endpointStatuses="endpointStatuses"
|
:endpointStatuses="endpointStatuses"
|
||||||
:showStatusOnHover="true"
|
:showStatusOnHover="true"
|
||||||
@showTooltip="showTooltip"
|
@showTooltip="showTooltip"
|
||||||
@toggleShowAverageResponseTime="toggleShowAverageResponseTime"
|
@toggleShowAverageResponseTime="toggleShowAverageResponseTime"
|
||||||
:showAverageResponseTime="showAverageResponseTime"
|
:showAverageResponseTime="showAverageResponseTime"
|
||||||
/>
|
/>
|
||||||
<Pagination @page="changePage"/>
|
<Pagination v-show="retrievedData" @page="changePage"/>
|
||||||
</slot>
|
</slot>
|
||||||
<Settings @refreshData="fetchData"/>
|
<Settings @refreshData="fetchData"/>
|
||||||
</template>
|
</template>
|
||||||
@ -31,6 +32,7 @@ export default {
|
|||||||
emits: ['showTooltip', 'toggleShowAverageResponseTime'],
|
emits: ['showTooltip', 'toggleShowAverageResponseTime'],
|
||||||
methods: {
|
methods: {
|
||||||
fetchData() {
|
fetchData() {
|
||||||
|
this.retrievedData = false;
|
||||||
fetch(`${SERVER_URL}/api/v1/endpoints/statuses?page=${this.currentPage}`, {credentials: 'include'})
|
fetch(`${SERVER_URL}/api/v1/endpoints/statuses?page=${this.currentPage}`, {credentials: 'include'})
|
||||||
.then(response => {
|
.then(response => {
|
||||||
this.retrievedData = true;
|
this.retrievedData = true;
|
||||||
|
@ -1 +1 @@
|
|||||||
<!doctype html><html lang="en"><head><meta charset="utf-8"/><script>window.config = {logo: "{{ .Logo }}", header: "{{ .Header }}", link: "{{ .Link }}", buttons: []};{{- range .Buttons}}window.config.buttons.push({name:"{{ .Name }}",link:"{{ .Link }}"});{{end}}</script><title>{{ .Title }}</title><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="manifest" href="/manifest.json"><link rel="shortcut icon" href="/favicon.ico"/><meta name="description" content="{{ .Description }}"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><meta name="apple-mobile-web-app-title" content="{{ .Title }}"><meta name="application-name" content="{{ .Title }}"><meta name="theme-color" content="#f7f9fb"><script defer="defer" src="/js/chunk-vendors.js"></script><script defer="defer" src="/js/app.js"></script><link href="/css/app.css" rel="stylesheet"></head><body class="dark:bg-gray-900"><noscript><strong>Enable JavaScript to view this page.</strong></noscript><div id="app"></div></body></html>
|
<!doctype html><html lang="en"><head><meta charset="utf-8"/><script>window.config = {logo: "{{ .Logo }}", header: "{{ .Header }}", link: "{{ .Link }}", buttons: []};{{- range .Buttons}}window.config.buttons.push({name:"{{ .Name }}",link:"{{ .Link }}"});{{end}}</script><title>{{ .Title }}</title><meta http-equiv="X-UA-Compatible" content="IE=edge"/><meta name="viewport" content="width=device-width,initial-scale=1"/><link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png"/><link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png"/><link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png"/><link rel="manifest" href="/manifest.json"/><link rel="shortcut icon" href="/favicon.ico"/><meta name="description" content="{{ .Description }}"/><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/><meta name="apple-mobile-web-app-title" content="{{ .Title }}"/><meta name="application-name" content="{{ .Title }}"/><meta name="theme-color" content="#f7f9fb"/><script defer="defer" src="/js/chunk-vendors.js"></script><script defer="defer" src="/js/app.js"></script><link href="/css/app.css" rel="stylesheet"></head><body class="dark:bg-gray-900"><noscript><strong>Enable JavaScript to view this page.</strong></noscript><div id="app"></div></body></html>
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Loading…
Reference in New Issue
Block a user