Files
owly-news/frontend/src/components/CronSlider.vue

30 lines
938 B
Vue
Raw Blame History

This file contains invisible Unicode characters

This file contains invisible Unicode characters that are indistinguishable to humans but may be processed differently by a computer. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script setup lang="ts">
import {ref, onMounted} from 'vue';
const hours = ref(1);
const saving = ref(false);
onMounted(async () => {
const h = await fetch('/settings/cron').then(r => r.json());
hours.value = h.hours;
});
async function update() {
saving.value = true;
await fetch('/settings/cron', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({hours: hours.value})
});
saving.value = false;
}
</script>
<template>
<div class="p-4 bg-white dark:bg-gray-800 rounded shadow dark:shadow-gray-700 dark:text-gray-200">
<label class="block font-semibold mb-2">Fetch Interval (Stunden)</label>
<input type="range" min="0.5" max="24" step="0.5" v-model="hours" @change="update"
class="w-full accent-green-600 dark:accent-green-500"/>
<p class="text-sm mt-2">{{ hours }} h <span v-if="saving" class="animate-pulse"></span></p>
</div>
</template>