add NodeBook NodeView click for ordering

src/components/globals/ButtonClose.vue

@@ -36,6 +36,7 @@ export default {
   svg {
     width: 100%;
     height: 100%;
+    pointer-events: none;
   }
 
   path {

src/components/layouts/NodeBook.vue

@@ -8,7 +8,7 @@
     >
       <div
         v-for="({ parent, children }, i) in nodes" :key="parent.id"
-        class="node-book-stack-item node-book-stack-item-parent splitted"
+        class="node-book-stack-item node-book-stack-item-parent splitted no-events-container"
         :class="{ active: i === nodes.length - 1 }"
         :style="`--nth: ${i}`"
       >
@@ -25,6 +25,7 @@
           @open-node="$emit('open-node', $event)"
           @open-child="$emit('open-node', { parentId: parent.id, ...$event })"
           @close-node="$emit('close-node', { parentId: $event })"
+          @click.native="onNodeViewClick($event, i)"
         />
 
         <section
@@ -44,6 +45,7 @@
               type="prod"
               @open-node="$emit('open-node', $event)"
               @close-node="$emit('close-node', { parentId: parent.id, childId: $event })"
+              @click.native="onNodeViewClick($event, i, j)"
             />
           </div>
         </section>
@@ -77,6 +79,20 @@ export default {
   methods: {
     getChildrenStackHeight (childrenLen) {
       return this.stackHeight / childrenLen || this.stackHeight
+    },
+
+    onNodeViewClick (e, parentIndex, childIndex) {
+      if (e.target.classList.contains('btn')) return
+      const parentIsLast = parentIndex === this.nodes.length - 1
+      const childIsLast = childIndex !== undefined
+        ? childIndex === this.nodes[parentIndex].children.length - 1
+        : true
+      if (parentIsLast && childIsLast) return
+      const ids = { parentId: this.nodes[parentIndex].parent.id }
+      if (childIndex !== undefined) {
+        ids.childId = this.nodes[parentIndex].children[childIndex].id
+      }
+      this.$emit('select-node', ids)
     }
   }
 }