mirror of
https://github.com/ClusterCockpit/cc-backend
synced 2024-09-21 11:57:25 +02:00
43 lines
1.4 KiB
Svelte
43 lines
1.4 KiB
Svelte
|
<!--
|
||
|
|
@component
|
||
|
|
|
||
|
|
Events:
|
||
|
|
- 'reload': When fired, the parent component shoud refresh its contents
|
||
|
|
-->
|
||
|
|
<script>
|
||
|
|
import { createEventDispatcher } from 'svelte'
|
||
|
|
import { Button, Icon, InputGroup } from 'sveltestrap'
|
||
|
|
|
||
|
|
const dispatch = createEventDispatcher()
|
||
|
|
|
||
|
|
let refreshInterval = null;
|
||
|
|
let refreshIntervalId = null;
|
||
|
|
function refreshIntervalChanged() {
|
||
|
|
if (refreshIntervalId != null)
|
||
|
|
clearInterval(refreshIntervalId);
|
||
|
|
|
||
|
|
if (refreshInterval == null)
|
||
|
|
return;
|
||
|
|
|
||
|
|
refreshIntervalId = setInterval(() => dispatch("reload"), refreshInterval);
|
||
|
|
}
|
||
|
|
|
||
|
|
export let initially = null
|
||
|
|
if (initially != null) {
|
||
|
|
refreshInterval = initially * 1000
|
||
|
|
refreshIntervalChanged()
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<InputGroup>
|
||
|
|
<Button outline on:click={() => dispatch("reload")} disabled={refreshInterval != null}>
|
||
|
|
<Icon name="arrow-clockwise" /> Reload
|
||
|
|
</Button>
|
||
|
|
<select class="form-select" bind:value={refreshInterval} on:change={refreshIntervalChanged}>
|
||
|
|
<option value={null}>No periodic reload</option>
|
||
|
|
<option value={ 30 * 1000}>Update every 30 seconds</option>
|
||
|
|
<option value={ 60 * 1000}>Update every minute</option>
|
||
|
|
<option value={2 * 60 * 1000}>Update every two minutes</option>
|
||
|
|
<option value={5 * 60 * 1000}>Update every 5 minutes</option>
|
||
|
|
</select>
|
||
|
|
</InputGroup>
|