update dynnode ref onchange

src/components/TheDynamics.vue

@@ -5,7 +5,7 @@ import { UABaseNode } from '@/ua/UABaseNode';
 import { ObjectIds, ReferenceTypeIds } from '@/ua/opcua_node_ids';
 import type { UAReferenceType } from '@/ua/UAReferenceType';
 import type { UAVariableType } from '@/ua/UAVariableType';
-import { DynamicNode, type DynamicNodeData} from '@/ua/DynamicNode';
+import { type DynamicNodeData} from '@/ua/DynamicNode';
 import { storeToRefs } from 'pinia';
 const store = useStore();
 const { selectedNode} = storeToRefs(store)
@@ -27,14 +27,16 @@ let opt: DynamicNodeData = {
   name:"...",
   startIndex:0
 };
-const dynNode = ref(new DynamicNode(opt));
+const dynNode = ref(opt);
 const checked = ref("")
 const typedef = ref("")
 
 watch(selectedNode, async (newNode, _oldNode) => {
   if(!newNode)
     return;
-  //TODO: what id does typedef hold?
+  let dynConfig=store.serverConfig.configData.dynamics?.find((d) => {d.parentNodeId==newNode.nodeId.toString()})||{}
+  dynNode.value=dynConfig;
+  //TODO: what id does/should typedef hold?
   typedef.value=newNode.nodeId.toString();
 })
 
@@ -50,7 +52,6 @@ function getObjTypes(nid: string):UABaseNode[] {
 }
 
 function getInstanceDecl(nid: string, mrType: string){
-  //TODO: why aggregates?
   const aggregates = (store.addressSpace?.getSubTreeAsList("ns=0;i="+ReferenceTypeIds.Aggregates)||[]) as UABaseNode[];
   let aggStrings:String[] = [];
   aggregates.forEach((item) => {
@@ -110,14 +111,14 @@ async function createDynamic() {
 
 
 function okPressed() {
-  console.log('TODO: Handle OK Button');
+  store.serverConfig.addDynamic(dynNode.value);
 }
 defineExpose({ okPressed })
 </script>
 
 <template>
   <div class="card">
-    <div class="card-body" v-if="selectedNode != null && dynNode != null">
+    <div class="card-body" v-if="selectedNode != null">
       <h5 class="card-title">Dynamic Node</h5>
       <div class="card-text">
         <div class="input-group mb-3">
@@ -138,14 +139,14 @@ defineExpose({ okPressed })
             <span class="input-group-text" id="inputGroup-sizing-default">Name Dynamic Definition</span>
           </div>
           <input type="text" class="form-control" aria-label="Default"
-            aria-describedby="inputGroup-sizing-default" v-model="dynNode.dynamicNodeData.name"> 
+            aria-describedby="inputGroup-sizing-default" v-model="dynNode.name"> 
         </div>
         <div class="input-group mb-3">
           <div class="input-group-prepend">
             <span class="input-group-text" id="inputGroup-sizing-default">Update Interval in ms</span>
           </div>
           <input type="text" class="form-control" aria-label="Default"
-            aria-describedby="inputGroup-sizing-default" v-model="dynNode.dynamicNodeData.checkInterval"> 
+            aria-describedby="inputGroup-sizing-default" v-model="dynNode.checkInterval"> 
         </div>
         <div class="input-group mb-3">
           <div class="input-group-prepend">
@@ -169,7 +170,7 @@ defineExpose({ okPressed })
             <span class="input-group-text" id="inputGroup-sizing-default">Ident</span>
           </div>
           <input type="text" class="form-control" aria-label="Default"
-            aria-describedby="inputGroup-sizing-default" v-model="dynNode.dynamicNodeData.ident"> 
+            aria-describedby="inputGroup-sizing-default" v-model="dynNode.ident"> 
         </div>
         <div class="input-group mb-3">
           <div class="input-group-prepend">
@@ -203,15 +204,11 @@ defineExpose({ okPressed })
             </li>
           </ul>
         </div>
-        <div>
-          <button class="btn btn-light" @click.prevent="createDynamic()">OK</button>
-        </div>
       </div>
     </div>
   </div>
 </template>
 
-
 <style scoped>
   ul.no-bullets {
   list-style-type: none;