Browse Source

feat: allow delay block in group

Ahmad Kholid 3 years ago
parent
commit
0078716846

+ 21 - 1
src/components/block/BlockDelay.vue

@@ -1,5 +1,5 @@
 <template>
 <template>
-  <div :id="componentId" class="p-4">
+  <div :id="componentId" class="p-4 block-basic">
     <div class="flex items-center mb-2">
     <div class="flex items-center mb-2">
       <div
       <div
         :class="block.category.color"
         :class="block.category.color"
@@ -26,6 +26,16 @@
       required
       required
       @input="handleInput"
       @input="handleInput"
     />
     />
+    <div
+      v-if="!editor.minimap && block.details.id !== 'trigger'"
+      :title="t('workflow.blocks.base.moveToGroup')"
+      draggable="true"
+      class="bg-white dark:bg-gray-700 invisible move-to-group z-50 absolute -top-2 -right-2 rounded-md p-1 shadow-md"
+      @dragstart="handleStartDrag"
+      @mousedown.stop
+    >
+      <v-remixicon name="riDragDropLine" size="20" />
+    </div>
   </div>
   </div>
 </template>
 </template>
 <script setup>
 <script setup>
@@ -49,4 +59,14 @@ function handleInput({ target }) {
   props.editor.updateNodeDataFromId(block.id, { time: target.value });
   props.editor.updateNodeDataFromId(block.id, { time: target.value });
   emitter.emit('editor:data-changed', block.id);
   emitter.emit('editor:data-changed', block.id);
 }
 }
+function handleStartDrag(event) {
+  const payload = {
+    data: block.data,
+    id: block.details.id,
+    blockId: block.id,
+    fromBlockBasic: true,
+  };
+
+  event.dataTransfer.setData('block', JSON.stringify(payload));
+}
 </script>
 </script>

+ 0 - 1
src/components/block/BlockGroup.vue

@@ -116,7 +116,6 @@ const excludeBlocks = [
   'blocks-group',
   'blocks-group',
   'conditions',
   'conditions',
   'element-exists',
   'element-exists',
-  'delay',
 ];
 ];
 
 
 function onDragStart(item, event) {
 function onDragStart(item, event) {

+ 3 - 2
src/components/newtab/workflow/WorkflowEditBlock.vue

@@ -98,11 +98,12 @@ export default {
   emits: ['close', 'update', 'update:autocomplete'],
   emits: ['close', 'update', 'update:autocomplete'],
   setup(props, { emit }) {
   setup(props, { emit }) {
     const excludeOnError = [
     const excludeOnError = [
+      'delay',
       'webhook',
       'webhook',
+      'trigger',
       'while-loop',
       'while-loop',
-      'element-exists',
       'conditions',
       'conditions',
-      'trigger',
+      'element-exists',
     ];
     ];
 
 
     const { t } = useI18n();
     const { t } = useI18n();

+ 24 - 0
src/components/newtab/workflow/edit/EditDelay.vue

@@ -0,0 +1,24 @@
+<template>
+  <div class="space-y-2">
+    <ui-input
+      :model-value="data.time"
+      label="Delay time (millisecond)"
+      class="w-full"
+      type="text"
+      @change="updateData({ time: $event })"
+    />
+  </div>
+</template>
+<script setup>
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+});
+const emit = defineEmits(['update:data']);
+
+function updateData(value) {
+  emit('update:data', { ...props.data, ...value });
+}
+</script>

+ 1 - 2
src/utils/shared.js

@@ -277,7 +277,7 @@ export const tasks = {
     description: 'Add delay before executing the next block',
     description: 'Add delay before executing the next block',
     icon: 'riTimerLine',
     icon: 'riTimerLine',
     component: 'BlockDelay',
     component: 'BlockDelay',
-    editComponent: 'EditTrigger',
+    editComponent: 'EditDelay',
     category: 'general',
     category: 'general',
     inputs: 1,
     inputs: 1,
     outputs: 1,
     outputs: 1,
@@ -470,7 +470,6 @@ export const tasks = {
     name: 'Repeat task',
     name: 'Repeat task',
     icon: 'riRepeat2Line',
     icon: 'riRepeat2Line',
     component: 'BlockRepeatTask',
     component: 'BlockRepeatTask',
-    editComponent: 'EditTrigger',
     category: 'general',
     category: 'general',
     inputs: 1,
     inputs: 1,
     outputs: 2,
     outputs: 2,