diff --git a/src/features/ePocFlow/nodes/ScreenNode.vue b/src/features/ePocFlow/nodes/ScreenNode.vue index 1010d540f1556eaf76cb76459e7854f220d1c402..e2f598fa7bea6ba69621792a81ae0ef686060550 100644 --- a/src/features/ePocFlow/nodes/ScreenNode.vue +++ b/src/features/ePocFlow/nodes/ScreenNode.vue @@ -61,7 +61,7 @@ function dragEnter(event) { const { nodes } = useVueFlow(); function openForm(element: NodeElement) { - editorStore.openFormPanel(element.id, element.form); + editorStore.openFormPanel(element.id, element.form, element.parentId); } diff --git a/src/features/forms/components/FormButton.vue b/src/features/forms/components/FormButton.vue index 90eded577b344bfb5eb907e79e31d8176ff45191..389255485f67aa661fd6b963dcbd467975e511b2 100644 --- a/src/features/forms/components/FormButton.vue +++ b/src/features/forms/components/FormButton.vue @@ -12,8 +12,15 @@ const emit = defineEmits<{ </script> <template> - <button class="btn btn-form" @click="emit('click')"> + <button class="btn btn-form" :class="{ 'btn-delete' : label === 'Supprimer' }" @click="emit('click')"> <i :class="icon"></i> {{ label }} </button> -</template> \ No newline at end of file +</template> + +<style scoped lang="scss"> +.btn-delete:hover { + transition: color .2s ease-in-out; + color: var(--editor-red); +} +</style> \ No newline at end of file diff --git a/src/shared/data/form.data.ts b/src/shared/data/form.data.ts index 288111437948d2e871b92b83eb544152840bc1b6..ec595e5892f589166204ff733dd6fd73374d0682 100644 --- a/src/shared/data/form.data.ts +++ b/src/shared/data/form.data.ts @@ -206,11 +206,6 @@ const epocForm: Form = { ], buttons: [ - { - label: 'Supprimer', - icon: 'icon-supprimer', - action: 'delete' - }, { label: 'Copier le lien', icon: 'icon-copie', diff --git a/src/shared/stores/editorStore.ts b/src/shared/stores/editorStore.ts index 2a4fdbc30bdba6d2996e7211039f046a262017e3..43d39c4ed17fab1aff55b84fd8f9d64c7279ca90 100644 --- a/src/shared/stores/editorStore.ts +++ b/src/shared/stores/editorStore.ts @@ -2,9 +2,12 @@ import { defineStore } from 'pinia'; import { fetchRecentProjects } from '@/src/shared/services'; import { SideAction, Screen, ePocProject, NodeElement, Form, Card } from '@/src/shared/interfaces'; import { toRaw } from 'vue'; +import { useVueFlow } from '@vue-flow/core'; import { formsModel } from '@/src/shared/data/form.data'; +const { findNode } = useVueFlow(); + type uid = string; interface EditorState { @@ -16,6 +19,7 @@ interface EditorState { form: Form; }; openedNodeId: uid | null; + openedParentId: uid | null; sideActions: SideAction[]; questions: SideAction[]; standardScreens: Screen[]; @@ -32,6 +36,7 @@ export const useEditorStore = defineStore('editor', { form: null, }, openedNodeId: null, + openedParentId: null, sideActions: actionItems, questions: questions, standardScreens: standardScreen, @@ -63,10 +68,11 @@ export const useEditorStore = defineStore('editor', { this.floatingMenu = false; this.modelMenu = false; }, - openFormPanel(id: string, form: Form): void { + openFormPanel(id: string, form: Form, parentId?: string): void { this.formPanel.isOpen = true; this.formPanel.form = form; this.openedNodeId = id; + this.openedParentId = parentId; }, closeFormPanel(): void { this.formPanel.isOpen = false; @@ -97,7 +103,10 @@ export const useEditorStore = defineStore('editor', { // type: 'remove', // } // ]); - console.log(this.openedNodeId); + console.log('deleteCurrentElement', this.openedParentId); + const node = findNode(this.openedParentId); + console.log('node', node); + this.closeFormPanel(); }, addCard(type: string, fieldIndex: number):void { const newCard: Card = this.getCard(type);