A schedule per location, and locations backed up one after the other

Off, once a day or every N hours from a time, each in its own time zone. Existing locations
keep the time that held for all of them. A backup that has to wait shows as queued, and its
restore point has the time it really began.

src/components/Backups.vue

@@ -5,10 +5,7 @@
 <template>
 	<NcSettingsSection :name="t('ng_backup', 'Backups')"
 		:description="t('ng_backup', 'Backups run in the background through Nextcloud\'s cron. Unchanged files are not read again; only new data is uploaded.')">
-		<div class="ngb-row">
-			<NcTextField v-model="schedule" class="ngb-time" :label="t('ng_backup', 'Daily at (HH:MM, {zone}, empty = off)', { zone: browserZone })" />
-			<NcButton :disabled="schedule === status.schedule && browserZone === status.scheduleTimezone" @click="saveSchedule">{{ t('ng_backup', 'Save') }}</NcButton>
-		</div>
+		<LocationScheduleRow v-for="target in status.targets" :key="target.id" :target="target" @changed="emit('changed')" @error="error = $event" />
 		<div class="ngb-row">
 			<NcTextField v-model="label" class="ngb-label" :maxlength="100" :label="t('ng_backup', 'Label (optional)')"
 				:placeholder="t('ng_backup', 'e.g. before the upgrade to Nextcloud 35')" />
@@ -60,24 +57,19 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue'
+import { ref } from 'vue'
 import { n, t } from '@nextcloud/l10n'
 import NcButton from '@nextcloud/vue/components/NcButton'
 import NcNoteCard from '@nextcloud/vue/components/NcNoteCard'
 import NcSettingsSection from '@nextcloud/vue/components/NcSettingsSection'
 import NcTextField from '@nextcloud/vue/components/NcTextField'
+import LocationScheduleRow from './LocationScheduleRow.vue'
 import api from '../api.js'
-import { formatDateTime, formatSize, toZone } from '../format.js'
+import { formatDateTime, formatSize } from '../format.js'
 
 const props = defineProps({ status: { type: Object, required: true }, allRuns: { type: Boolean, default: false } })
 const emit = defineEmits(['changed', 'show-all-runs'])
-// The time is saved in the administrator's own zone (the browser's); a schedule saved in another
-// zone is shown in this one, so it reads as the moment it runs here.
-const browserZone = Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'
-const shown = (s) => (s && props.status.scheduleTimezone && props.status.scheduleTimezone !== browserZone) ? toZone(s, props.status.scheduleTimezone, browserZone) : s
-const schedule = ref(shown(props.status.schedule))
 const error = ref('')
-watch(() => [props.status.schedule, props.status.scheduleTimezone], ([s]) => { schedule.value = shown(s) })
 
 const label = ref('')
 
@@ -97,6 +89,9 @@ const runStatus = (run) => {
 	if (run.status !== 'running') {
 		return run.status
 	}
+	if (run.queued) {
+		return t('ng_backup', 'queued, after the backup that is running now')
+	}
 	const detail = run.phase + percent(run)
 	if (run.waitingFor) {
 		return t('ng_backup', 'waiting for background jobs ({detail}, last step {minutes} min ago)', { detail, minutes: Math.floor(run.waitingFor / 60) })
@@ -116,21 +111,10 @@ async function start(target) {
 		error.value = e.message
 	}
 }
-
-async function saveSchedule() {
-	error.value = ''
-	try {
-		await api.setSchedule(schedule.value.trim(), browserZone)
-		emit('changed')
-	} catch (e) {
-		error.value = e.message
-	}
-}
 </script>
 
 <style scoped>
 .ngb-row { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 12px; }
-.ngb-time { max-width: 260px; }
 .ngb-label { max-width: 360px; }
 .ngb-table-wrap { overflow-x: auto; }
 .ngb-table { width: 100%; border-collapse: collapse; }

src/components/LocationScheduleRow.vue

@@ -0,0 +1,77 @@
+<!--
+  - SPDX-FileCopyrightText: 2026 Dillard Blom
+  - SPDX-License-Identifier: AGPL-3.0-or-later
+-->
+<template>
+	<div class="ngb-row">
+		<strong class="ngb-name">{{ target.name }}</strong>
+		<NcSelect v-model="kind" :options="kinds" label="label" :input-label="t('ng_backup', 'Schedule')" :clearable="false" />
+		<NcTextField v-if="kind.id !== 'off'" v-model="time" class="ngb-time" :label="kind.id === 'daily' ? t('ng_backup', 'At (HH:MM, {zone})', { zone: browserZone }) : t('ng_backup', 'From (HH:MM, {zone})', { zone: browserZone })" />
+		<NcTextField v-if="kind.id === 'hours'" v-model="hours" class="ngb-hours" type="number" min="1" max="23" :label="t('ng_backup', 'Every … hours')" />
+		<NcButton :disabled="busy || wanted === current" @click="save">{{ t('ng_backup', 'Save') }}</NcButton>
+	</div>
+</template>
+
+<script setup>
+import { computed, ref, watch } from 'vue'
+import { t } from '@nextcloud/l10n'
+import NcButton from '@nextcloud/vue/components/NcButton'
+import NcSelect from '@nextcloud/vue/components/NcSelect'
+import NcTextField from '@nextcloud/vue/components/NcTextField'
+import api from '../api.js'
+import { toZone } from '../format.js'
+
+const props = defineProps({ target: { type: Object, required: true } })
+const emit = defineEmits(['changed', 'error'])
+
+const kinds = [
+	{ id: 'off', label: t('ng_backup', 'Off') },
+	{ id: 'daily', label: t('ng_backup', 'Once a day') },
+	{ id: 'hours', label: t('ng_backup', 'Every few hours') },
+]
+// The time is saved in the administrator's own zone (the browser's); a schedule saved in another
+// zone is shown in this one, so it reads as the moment it runs here.
+const browserZone = Intl.DateTimeFormat().resolvedOptions().timeZone || 'UTC'
+const kind = ref(kinds[0])
+const time = ref('02:00')
+const hours = ref('6')
+const busy = ref(false)
+
+const current = computed(() => {
+	const [at, every] = props.target.schedule.split('/')
+	return at === '' ? '' : (props.target.scheduleZone !== browserZone ? toZone(at, props.target.scheduleZone, browserZone) : at) + (every ? '/' + every : '')
+})
+const wanted = computed(() => {
+	if (kind.value.id === 'off') {
+		return ''
+	}
+	return time.value.trim() + (kind.value.id === 'hours' ? '/' + String(hours.value).trim() : '')
+})
+
+watch(current, (schedule) => {
+	const [at, every] = schedule.split('/')
+	kind.value = kinds[at === '' ? 0 : (every ? 2 : 1)]
+	time.value = at === '' ? time.value : at
+	hours.value = every ?? hours.value
+}, { immediate: true })
+
+async function save() {
+	busy.value = true
+	emit('error', '')
+	try {
+		await api.setTargetSchedule(props.target.id, wanted.value, browserZone)
+		emit('changed')
+	} catch (e) {
+		emit('error', e.message)
+	} finally {
+		busy.value = false
+	}
+}
+</script>
+
+<style scoped>
+.ngb-row { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 12px; }
+.ngb-name { min-width: 120px; align-self: center; }
+.ngb-time { max-width: 220px; }
+.ngb-hours { max-width: 120px; }
+</style>