feat: error when connect storage table

src/components/newtab/workflow/WorkflowDataTable.vue

@@ -56,56 +56,47 @@
     />
   </div>
   <div
-    class="overflow-y-auto scroll"
-    style="max-height: 500px; height: calc(100vh - 13rem)"
+    class="overflow-y-auto scroll px-1"
+    style="max-height: calc(100vh - 16rem); min-height: 300px"
   >
     <p v-if="columns.length === 0" class="text-center mt-4">
       {{ t('message.noData') }}
     </p>
-    <draggable
-      v-else
-      v-model="columns"
-      handle=".column-handle"
-      item-key="id"
-      class="py-1 space-y-2"
-    >
-      <template #item="{ index }">
-        <li class="flex items-center space-x-2">
-          <v-remixicon
-            name="mdiDrag"
-            class="mr-2 cursor-move -ml-1 column-handle"
-          />
-          <ui-input
-            :disabled="Boolean(workflow.connectedTable)"
-            :model-value="state.columns[index].name"
-            :placeholder="t('workflow.table.column.name')"
-            class="flex-1"
-            @blur="updateColumnName(index, $event.target)"
-          />
-          <ui-select
-            v-model="state.columns[index].type"
-            :disabled="Boolean(workflow.connectedTable)"
-            :placeholder="t('workflow.table.column.type')"
-            class="flex-1"
-          >
-            <option v-for="type in dataTypes" :key="type.id" :value="type.id">
-              {{ type.name }}
-            </option>
-          </ui-select>
-          <button
-            v-if="!Boolean(workflow.connectedTable)"
-            @click="state.columns.splice(index, 1)"
-          >
-            <v-remixicon name="riDeleteBin7Line" />
-          </button>
-        </li>
-      </template>
-    </draggable>
+    <ul v-else class="space-y-2 py-1">
+      <li
+        v-for="(column, index) in columns"
+        :key="column.id"
+        class="flex items-center space-x-2"
+      >
+        <ui-input
+          :disabled="Boolean(workflow.connectedTable)"
+          :model-value="columns[index].name"
+          :placeholder="t('workflow.table.column.name')"
+          class="flex-1"
+          @blur="updateColumnName(index, $event.target)"
+        />
+        <ui-select
+          v-model="columns[index].type"
+          :disabled="Boolean(workflow.connectedTable)"
+          :placeholder="t('workflow.table.column.type')"
+          class="flex-1"
+        >
+          <option v-for="type in dataTypes" :key="type.id" :value="type.id">
+            {{ type.name }}
+          </option>
+        </ui-select>
+        <button
+          v-if="!Boolean(workflow.connectedTable)"
+          @click="state.columns.splice(index, 1)"
+        >
+          <v-remixicon name="riDeleteBin7Line" />
+        </button>
+      </li>
+    </ul>
   </div>
 </template>
 <script setup>
 import { computed, onMounted, watch, reactive } from 'vue';
-import Draggable from 'vuedraggable';
 import { nanoid } from 'nanoid';
 import { useI18n } from 'vue-i18n';
 import dbStorage from '@/db/storage';

src/utils/handleFormElement.js

@@ -1,4 +1,4 @@
-import { sleep, objectHasKey } from '@/utils/helper';
+import { sleep } from '@/utils/helper';
 import { keyDefinitions } from '@/utils/USKeyboardLayout';
 import simulateEvent from './simulateEvent';
 
@@ -7,12 +7,6 @@ const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
   'value'
 ).set;
 function reactJsEvent(element, value) {
-  console.dir(element);
-  console.log(
-    objectHasKey(element, '_valueTracker'),
-    element.parentElement.hasChildNodes(element)
-  );
-  console.log(!element._valueTracker, element._valueTracker, element);
   if (!element._valueTracker) return;
 
   const previousValue = element.value;