diff --git a/showbits-thermal-printer-ui/src/components/CSegmentText.vue b/showbits-thermal-printer-ui/src/components/CSegmentText.vue index 5c502ba..303a40b 100644 --- a/showbits-thermal-printer-ui/src/components/CSegmentText.vue +++ b/showbits-thermal-printer-ui/src/components/CSegmentText.vue @@ -3,6 +3,7 @@ import { computed, ref, type StyleValue, useTemplateRef } from "vue"; const form = useTemplateRef("form"); const disabled = ref(false); +const error = ref(); const text = ref(""); const forceWrap = ref(false); @@ -38,9 +39,13 @@ async function submit(): Promise { data.append("force_wrap", String(forceWrap.value)); data.append("feed", String(feed.value)); const response = await fetch("/api/text", { method: "POST", body: data }); - console.log("POST succeeded:", await response.text()); + 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) { - console.log("POST failed:", err); + error.value = String(err); } await waitAtLeast(500, start); @@ -68,6 +73,7 @@ async function submit(): Promise { +

{{ error }}

@@ -92,4 +98,10 @@ fieldset { flex-direction: column; border: none; } + +.error { + background-color: #fdd; + color: #400; + padding: 0 2px; +}