initial implementation of integral types

frontend/src/views/PanelEditorView.vue

@@ -2,6 +2,7 @@
 import DynamicComponent from '@/components/DynamicComponent.vue';
 import type { OptionalDynamicComponentData } from '@/composables/dynamic.ts';
 import { ref, watchEffect } from 'vue';
+import { parseJsonString, toJsonString } from '@/composables/json.ts';
 
 const data = ref<OptionalDynamicComponentData>({ type: 'none' });
 
@@ -29,7 +30,7 @@ async function load(id: string) {
     loading.value = true;
     const panel_data = await fetch(`/api/panel/${id}`);
     const panel_json_value = await panel_data.json();
-    data.value = JSON.parse(
+    data.value = parseJsonString(
         panel_json_value['data'],
     ) as OptionalDynamicComponentData;
     panel_name.value = panel_json_value['name'];
@@ -50,9 +51,9 @@ async function save() {
     if (panel_id_value) {
         const res = await fetch(`/api/panel/${panel_id_value}`, {
             method: 'PUT',
-            body: JSON.stringify({
+            body: toJsonString({
                 name: panel_name.value,
-                data: JSON.stringify(data.value),
+                data: toJsonString(data.value),
             }),
             headers: {
                 'Content-Type': 'application/json',
@@ -62,9 +63,9 @@ async function save() {
     } else {
         const res = await fetch('/api/panel', {
             method: 'POST',
-            body: JSON.stringify({
+            body: toJsonString({
                 name: panel_name.value,
-                data: JSON.stringify(data.value),
+                data: toJsonString(data.value),
             }),
             headers: {
                 'Content-Type': 'application/json',