add new websocket http rest and notify components

src/boot/axios.ts

@@ -0,0 +1,21 @@
+import { boot } from 'quasar/wrappers';
+import axios from 'axios';
+
+const host = window.location.hostname;
+const port = 8100;
+const baseURL = `http://${host}:${port}`;
+
+const api = axios.create({
+  baseURL: baseURL,
+  timeout: 10000,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+});
+
+export default boot(({ app }) => {
+  app.config.globalProperties.$axios = axios;
+  app.config.globalProperties.$api = api;
+});
+
+export { axios, api };

src/composables/notify.ts

@@ -0,0 +1,39 @@
+import type { Response } from 'src/models/Response';
+import type { QVueGlobals } from 'quasar';
+
+export function NotifyResponse(
+  $q: QVueGlobals,
+  response: Response | string | undefined,
+  type?: 'warning' | 'error',
+  timeout: number = 5000,
+) {
+  let color = 'green';
+  let icon = 'check_circle';
+
+  switch (type) {
+    case 'warning':
+      color = 'orange';
+      icon = 'warning';
+      break;
+    case 'error':
+      color = 'orange';
+      icon = 'error';
+      break;
+  }
+
+  if (response) {
+    const message = typeof response === 'string' ? response : (response.message ?? '');
+    if (message === '') {
+      return;
+    }
+    color = typeof response === 'string' ? response : response?.error ? 'red' : color;
+    icon = typeof response === 'string' ? response : response?.error ? 'error' : icon;
+    $q?.notify({
+      message: message,
+      color: color,
+      position: 'bottom-right',
+      icon: icon,
+      timeout: timeout,
+    });
+  }
+}

src/models/Get.ts

@@ -9,6 +9,7 @@ type Get = {
   rights?: string;
   value?: undefined;
   query?: Query;
+  hasChild?: boolean;
 };
 
 export type Gets = Get[];

src/models/Response.ts

@@ -9,4 +9,6 @@ export type Response = {
   subscribe?: Subs;
   unsubscribe?: Subs;
   publish?: Pubs;
+  error?: boolean;
+  message?: string;
 };

src/models/Set.ts

@@ -1,6 +1,9 @@
 export type Set = {
+  uuid?: string | undefined;
   path: string;
+  type?: string;
   value: number | boolean | undefined;
+  create?: boolean;
 };
 
 export type Sets = Set[];

src/models/Subscribe.ts

@@ -3,6 +3,7 @@ export type Subscribe = {
   path?: string | undefined;
   depth?: number;
   value?: string | number | boolean | undefined;
+  hasChild?: boolean;
 };
 
 export type Subs = Subscribe[];

src/services/websocket.ts

@@ -4,11 +4,13 @@ import type { Request } from 'src/models/Request';
 import type { QVueGlobals } from 'quasar';
 import {
   getAllSubscriptions,
-  getSubscriptionsByPath,
   buildTree,
   dbmData,
-} from 'src/composables/dbmTree';
+  getSubscriptionsByUuid,
+} from 'src/composables/dbm/dbmTree';
 import { ref, reactive } from 'vue';
+import type { Subs } from 'src/models/Subscribe';
+import type { Sets } from 'src/models/Set';
 
 const pendingResponses = new Map<string, (data: Response | undefined) => void>();
 export const lastKnownValues = reactive(new Map<string, string>());
@@ -60,22 +62,22 @@ export function initWebSocket(url: string, $q?: QVueGlobals) {
         let changed = false;
 
         (message.publish as Publish[]).forEach((pub) => {
-          const path = pub.path;
+          const uuid = pub.uuid;
           const value = pub.value ?? '';
 
-          if (path === undefined) {
+          if (uuid === undefined) {
             return;
           }
 
-          const oldValue = lastKnownValues.get(path);
+          const oldValue = lastKnownValues.get(String(uuid));
           if (oldValue !== value) {
-            lastKnownValues.set(path, value); // this is now reactive
+            lastKnownValues.set(uuid, value); // this is now reactive
 
-            const existing = getSubscriptionsByPath(path);
+            const existing = getSubscriptionsByUuid(pub.uuid);
             if (existing) {
               existing.value = value;
             } else {
-              getAllSubscriptions().push({ path, value, uuid: pub.uuid });
+              getAllSubscriptions()?.push({ value, uuid: uuid });
             }
 
             changed = true;
@@ -125,8 +127,20 @@ function waitForSocketConnection(): Promise<void> {
   });
 }
 
-export function send(data: Request): Promise<Response | undefined> {
-  const id = generateId();
+export function subscribe(data: Subs): Promise<Response | undefined> {
+  return send({ subscribe: data });
+}
+
+export function unsubscribe(data: Subs): Promise<Response | undefined> {
+  return send({ unsubscribe: data });
+}
+
+export function setValues(data: Sets): Promise<Response | undefined> {
+  return send({ set: data });
+}
+
+function send(data: Request): Promise<Response | undefined> {
+  const id = Math.random().toString(36).substring(2, 9); // simple unique ID;
   const payload = { ...data, id };
 
   return new Promise((resolve) => {
@@ -142,7 +156,3 @@ export function send(data: Request): Promise<Response | undefined> {
       });
   });
 }
-
-function generateId(): string {
-  return Math.random().toString(36).substring(2, 9); // simple unique ID
-}