1
0
Эх сурвалжийг харах

feat: add `$randData` function

Ahmad Kholid 2 жил өмнө
parent
commit
043b3ed71a

+ 10 - 1
src/components/newtab/workflow/WorkflowBuilderSearchBlocks.vue

@@ -15,11 +15,13 @@
       <v-remixicon name="riSearch2Line" />
     </button>
     <ui-autocomplete
+      ref="autocompleteEl"
       :model-value="state.query"
       :items="state.autocompleteItems"
       :custom-filter="searchNodes"
       item-key="id"
       item-label="name"
+      @cancel="blurInput"
       @select="onSelectItem"
       @selected="onItemSelected"
     >
@@ -51,7 +53,7 @@
 </template>
 <script setup>
 /* eslint-disable vue/no-mutating-props */
-import { reactive } from 'vue';
+import { reactive, ref } from 'vue';
 import { useI18n } from 'vue-i18n';
 import { useShortcut } from '@/composable/shortcut';
 
@@ -71,6 +73,8 @@ const initialState = {
   canvasX: 0,
   canvasY: 0,
 };
+
+const autocompleteEl = ref(null);
 const state = reactive({
   query: '',
   active: false,
@@ -142,12 +146,16 @@ function clearState() {
     canvasY: 0,
   });
 
+  autocompleteEl.value.state.showPopover = false;
   clearHighlightedNodes();
 
   setTimeout(() => {
     props.editor.precanvas.style.transition = '';
   }, 500);
 }
+function blurInput() {
+  document.querySelector('#search-blocks')?.blur();
+}
 function onSelectItem({ item }) {
   if (props.editor.zoom !== 1) {
     /* eslint-disable-next-line */
@@ -170,6 +178,7 @@ function onSelectItem({ item }) {
 function onItemSelected(event) {
   state.selected = true;
   onSelectItem(event);
+  blurInput();
 }
 </script>
 <style scoped>

+ 1 - 0
src/components/newtab/workflow/WorkflowEditBlock.vue

@@ -107,6 +107,7 @@ export default {
         $date: '',
         $randint: '',
         $getLength: '',
+        $randData: '',
       },
     });
 

+ 4 - 0
src/components/ui/UiAutocomplete.vue

@@ -360,6 +360,10 @@ onMounted(() => {
 onBeforeUnmount(() => {
   detachEvents();
 });
+
+defineExpose({
+  state,
+});
 </script>
 <style>
 .ui-autocomplete.block,

+ 34 - 1
src/utils/referenceData/mustacheReplacer.js

@@ -8,7 +8,7 @@ const refKeys = {
   dataColumns: 'table',
 };
 
-/* eslint-disable prefer-destructuring */
+/* eslint-disable prefer-destructuring, no-useless-escape */
 export const functions = {
   date(...args) {
     let date = new Date();
@@ -40,6 +40,39 @@ export const functions = {
 
     return value.length ?? value;
   },
+  randData(str) {
+    const getRand = (data) => data[Math.floor(Math.random() * data.length)];
+    const lowercase = 'abcdefghijklmnopqrstuvwxyz';
+    const uppercase = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ';
+    const digits = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
+    const symbols = `!@#$%^&*()-_+={}[]|\;:'"<>,./?"`;
+    const mapSamples = {
+      l: () => getRand(lowercase),
+      u: () => getRand(uppercase),
+      d: () => getRand(digits),
+      s: () => getRand(symbols),
+      f() {
+        return this.l() + this.u();
+      },
+      n() {
+        return this.l() + this.d();
+      },
+      m() {
+        return this.u() + this.d();
+      },
+      i() {
+        return this.l() + this.u() + this.d();
+      },
+      a() {
+        return getRand(lowercase + uppercase + digits.join('') + symbols);
+      },
+    };
+
+    return `${str}`.replace(
+      /\?[a-zA-Z]/g,
+      (char) => mapSamples[char.at(-1)]?.() ?? char
+    );
+  },
 };
 
 export function extractStrFunction(str) {