フロー保存の実装

frontend/src/components/left/AppSelector.vue

@@ -1,11 +1,5 @@
 <template>
-  <div
-    class="row"
-    style="
-      border-radius: 2px;
-      box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset,
-        rgba(0, 0, 0, 0.3) 0px 0px 0px 1px;
-    ">
+  <div class="row app-box">
     <q-icon
       class="self-center q-ma-sm"
       name="widgets"
@@ -13,7 +7,7 @@
       style="font-size: 2em"
     />
     <div class="col-7 self-center ellipsis">
-      {{ selectedApp.name }}
+      {{ store.appInfo?.name }}
     </div>
     <div class="self-center">
       <q-btn
@@ -51,22 +45,19 @@ export default defineComponent({
     const store = useFlowEditorStore();
     const appDg = ref();
     const showSelectApp=ref(false);
-    const selectedApp =ref<AppInfo>({
-      appId:"",
-      name:"",
-    });
+
     const closeDg=(val :any)=>{
       showSelectApp.value=false;
       console.log("Dialog closed->",val);
       if (val == 'OK') {
           const data  = appDg.value.selected[0];
           console.log(data);
-          selectedApp.value={
+          const appInfo={
             appId:data.id ,
             name:data.name
           };
-          store.setApp(selectedApp.value);
-          store.setFlow();
+          store.setApp(appInfo);
+          store.loadFlow();
       }
     }
     const showAppDialog=()=>{
@@ -74,7 +65,6 @@ export default defineComponent({
     }
     return {
       store,
-      selectedApp,
       showSelectApp,
       showAppDialog,
       closeDg,
@@ -83,3 +73,9 @@ export default defineComponent({
   }
 });
 </script>
+<style lang="scss">
+  .app-box{
+    border-radius: 2px;
+    box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 0px 1px inset,rgba(0, 0, 0, 0.3) 0px 0px 0px 1px;
+  }
+</style>