add pinia

frontend/src/pages/FlowEditorPage.vue

@@ -10,6 +10,8 @@
             :key="flowName"
             :label="flowName"
           />
+
+          <q-breadcrumbs-el :label="flowNames1" />
         </q-breadcrumbs>
         <q-separator vertical class="q-mr-xs" />
         <q-btn
@@ -115,10 +117,11 @@ import FlowChartTest from 'pages/FlowChartTest.vue';
 import ControlPanel from 'components/flowEditor/left/ControlPanelC.vue';
 import ItemSelector from 'components/flowEditor/left/ItemSelector.vue';
 import { computed, ref } from 'vue';
+import { storeToRefs } from 'pinia';
 
 import ShowDialog from 'components/ShowDialog.vue';
 import ActionSelect from 'components/ActionSelect.vue';
-
+import { useFlowEditorStore } from 'stores/flowEditor';
 const show = ref(false);
 const addshow = ref(true);
 const appDg = ref();
@@ -127,17 +130,18 @@ interface FlowEditorPageProps {
   actName: string;
   flowNames: string[];
 }
-
+const store = useFlowEditorStore();
+const { flowNames1 } = storeToRefs(store);
+flowNames1.value = '保存をクリックした時';
 const props = withDefaults(defineProps<FlowEditorPageProps>(), {
   actName: '勤怠管理 - 4',
   flowNames: () => ['レコードを追加画面', '保存をクリックした時'],
 });
 const actName = computed(() => props.actName);
-const flowNames = computed(() => props.flowNames);
-
+const flowNames = computed(() => props.flowNames as Array<string>);
+flowNames.value.splice(1, 1, flowNames1.value)
 const drawerLeft = ref(false);
 
-
 const showDg = () => {
   show.value = true;
 };
@@ -161,10 +165,8 @@ const closeDg = (val: string) => {
     if (document.getElementsByClassName('action').length > 0) {
       addshow.value = false;
     }
-  };
+  }
 };
-
-
 </script>
 
 <style lang="sass">