Extract api request logic into component

This commit is contained in:
Joscha 2025-03-03 15:12:51 +01:00
parent 8df09e1b21
commit db73dee8d7
4 changed files with 51 additions and 66 deletions

View file

@ -1,48 +1,22 @@
<script setup lang="ts">
import { useApiRequest } from "@/apiRequest";
import { ref, useTemplateRef } from "vue";
import CSegmentError from "./CSegmentError.vue";
const { disabled, error, makeRequest } = useApiRequest();
const form = useTemplateRef<HTMLFormElement>("form");
const disabled = ref(false);
const error = ref<string>();
const today = new Date();
const year = ref(today.getFullYear());
const month = ref(today.getMonth() + 1);
const feed = ref(true);
async function waitAtLeast(duration: number, since: number): Promise<void> {
const now = Date.now();
const wait = duration - (now - since);
if (wait > 0) {
await new Promise((resolve) => setTimeout(resolve, wait));
}
}
async function submit(): Promise<void> {
const start = Date.now();
disabled.value = true;
try {
const data = new URLSearchParams();
data.append("year", String(year.value));
data.append("month", String(month.value));
data.append("feed", String(feed.value));
const response = await fetch("/api/calendar", {
method: "POST",
body: data,
});
if (!response.ok) {
const status = `${response.status.toFixed()} ${response.statusText}`;
const text = await response.text();
error.value = text.length > 0 ? `${status}: ${text}` : status;
}
} catch (err) {
error.value = String(err);
}
await waitAtLeast(500, start);
disabled.value = false;
function submit() {
const data = new URLSearchParams();
data.append("year", String(year.value));
data.append("month", String(month.value));
data.append("feed", String(feed.value));
void makeRequest("/api/calendar", data);
}
</script>