Browse Source

feat: add delete data block

Ahmad Kholid 3 years ago
parent
commit
ddff3dedc2

+ 36 - 0
src/background/workflow-engine/blocks-handler/handler-delete-data.js

@@ -0,0 +1,36 @@
+import { getBlockConnection } from '../helper';
+
+function deleteData({ data, outputs }) {
+  return new Promise((resolve) => {
+    data.deleteList.forEach((item) => {
+      if (item.type === 'table') {
+        if (item.columnId === '[all]') {
+          this.referenceData.table = [];
+          this.columns = { column: { index: 0, name: 'column', type: 'any' } };
+        } else {
+          const columnName = this.columns[item.columnId].name;
+
+          this.referenceData.table.forEach((_, index) => {
+            const row = this.referenceData.table[index];
+            delete row[columnName];
+
+            if (!row || Object.keys(row).length === 0) {
+              this.referenceData.table[index] = {};
+            }
+          });
+
+          this.columns[item.columnId].index = 0;
+        }
+      } else if (item.variableName) {
+        delete this.referenceData.variables[item.variableName];
+      }
+    });
+
+    resolve({
+      data: '',
+      nextBlockId: getBlockConnection({ outputs }),
+    });
+  });
+}
+
+export default deleteData;

+ 114 - 0
src/components/newtab/workflow/edit/EditDeleteData.vue

@@ -0,0 +1,114 @@
+<template>
+  <div>
+    <ui-textarea
+      :model-value="data.description"
+      class="w-full"
+      :placeholder="t('common.description')"
+      @change="updateData({ description: $event })"
+    />
+    <ul class="delete-list mt-4">
+      <li
+        v-for="(item, index) in deleteList"
+        :key="item.id"
+        class="mb-2 pb-4 border-b"
+      >
+        <div class="flex items-end space-x-2">
+          <ui-select
+            v-model="deleteList[index].type"
+            :label="t('workflow.blocks.delete-data.from')"
+            class="flex-1"
+          >
+            <option v-for="type in types" :key="type.id" :value="type.id">
+              {{ type.name }}
+            </option>
+          </ui-select>
+          <ui-button icon @click="deleteList.splice(index, 1)">
+            <v-remixicon name="riDeleteBin7Line" />
+          </ui-button>
+        </div>
+        <ui-input
+          v-if="item.type === 'variable'"
+          v-model="deleteList[index].variableName"
+          :placeholder="t('workflow.variables.name')"
+          :title="t('workflow.variables.name')"
+          autocomplete="off"
+          class="w-full mt-2"
+        />
+        <ui-select
+          v-else
+          v-model="deleteList[index].columnId"
+          :label="t('workflow.table.select')"
+          class="w-full mt-1"
+        >
+          <option value="[all]">
+            {{ t('workflow.blocks.delete-data.allColumns') }}
+          </option>
+          <option value="column">Column</option>
+          <option
+            v-for="column in workflow.data.value.table"
+            :key="column.id"
+            :value="column.id"
+          >
+            {{ column.name }}
+          </option>
+        </ui-select>
+      </li>
+    </ul>
+    <ui-button class="my-4" variant="accent" @click="addItem">
+      {{ t('common.add') }}
+    </ui-button>
+  </div>
+</template>
+<script setup>
+import { inject, ref, watch } from 'vue';
+import { useI18n } from 'vue-i18n';
+import cloneDeep from 'lodash.clonedeep';
+
+const props = defineProps({
+  data: {
+    type: Object,
+    default: () => ({}),
+  },
+  autocomplete: {
+    type: Array,
+    default: () => [],
+  },
+});
+const emit = defineEmits(['update:data']);
+
+const { t } = useI18n();
+
+const workflow = inject('workflow', {});
+const deleteList = ref(cloneDeep(props.data.deleteList));
+
+const types = [
+  { id: 'table', name: t('workflow.table.title') },
+  { id: 'variable', name: t('workflow.variables.title') },
+];
+
+function updateData(value) {
+  emit('update:data', { ...props.data, ...value });
+}
+function addItem() {
+  deleteList.value.push({
+    type: 'table',
+    variableName: '',
+    columnId: '[all]',
+  });
+}
+
+watch(
+  deleteList,
+  (value) => {
+    updateData({ deleteList: value });
+  },
+  { deep: true }
+);
+</script>
+<style scoped>
+.delete-list li:last-child {
+  padding-bottom: 0;
+  margin-bottom: 0;
+  border-bottom: 0;
+}
+</style>

+ 6 - 0
src/locales/en/blocks.json

@@ -70,6 +70,12 @@
           }
         }
       },
+      "delete-data": {
+        "name": "Delete data",
+        "description": "Delete table or variable data",
+        "from": "Data from",
+        "allColumns": "[All columns]"
+      },
       "reload-tab": {
         "name": "Reload tab",
         "description": "Reload the active tab"

+ 17 - 0
src/utils/shared.js

@@ -849,6 +849,23 @@ export const tasks = {
     disableEdit: true,
     data: {},
   },
+  'delete-data': {
+    name: 'Delete data',
+    description: 'Delete table or variable data',
+    icon: 'riDeleteBin7Line',
+    editComponent: 'EditDeleteData',
+    component: 'BlockBasic',
+    category: 'general',
+    inputs: 1,
+    outputs: 1,
+    allowedInputs: true,
+    maxConnection: 1,
+    disableEdit: true,
+    data: {
+      description: '',
+      deleteList: [],
+    },
+  },
 };
 
 export const categories = {