@webitel/ui-sdk 25.4.36 → 25.4.38

package/src/modules/Filters/v2/filter-presets/components/apply-preset/preset-preview.vue

@@ -61,9 +61,7 @@
             @update:model-value="nameAlreadyExistsError = false"
           />
 
-          <preset-filters-preview
-            :filters="presetFilters"
-          />
+          <preset-filters-preview :filters="presetFilters" />
 
           <preset-description-field
             v-model:model-value="editDraft.description"
@@ -76,28 +74,38 @@
 </template>
 
 <script lang="ts" setup>
-import {EnginePresetQuery} from "webitel-sdk";
-import {computed, ref} from "vue";
-import {useVuelidate} from "@vuelidate/core";
-import {required} from "@vuelidate/validators";
-import {AxiosError} from "axios";
-import {WtExpansionPanel, WtIconAction, WtRadio} from "../../../../../../components/index";
-import {createFiltersManager} from "../../../filters/index";
-import PresetFiltersPreview from "../_shared/preset-filters-preview.vue";
-import PresetNameField from "../_shared/input-fields/preset-name-field.vue";
-import PresetDescriptionField from "../_shared/input-fields/preset-description-field.vue";
+import { EnginePresetQuery } from 'webitel-sdk';
+import { computed, ref } from 'vue';
+import { useVuelidate } from '@vuelidate/core';
+import { required } from '@vuelidate/validators';
+import { AxiosError } from 'axios';
+import {
+  WtExpansionPanel,
+  WtIconAction,
+  WtRadio,
+} from '../../../../../../components/index';
+import { createFiltersManager } from '../../../filters/index';
+import PresetFiltersPreview from '../_shared/preset-filters-preview.vue';
+import PresetNameField from '../_shared/input-fields/preset-name-field.vue';
+import PresetDescriptionField from '../_shared/input-fields/preset-description-field.vue';
 
 type Props = {
   preset: EnginePresetQuery;
   isSelected: boolean;
   collapsed: boolean;
-}
+};
 
 const props = defineProps<Props>();
 
 const emit = defineEmits<{
   'preset:select': [EnginePresetQuery];
-  'preset:update': [{ preset: EnginePresetQuery, onSuccess: () => void, onFailure: (err: AxiosError) => void }];
+  'preset:update': [
+    {
+      preset: EnginePresetQuery;
+      onSuccess: () => void;
+      onFailure: (err: AxiosError) => void;
+    },
+  ];
   'preset:delete': [EnginePresetQuery];
 }>();
 
@@ -134,17 +142,21 @@ const fillDraft = () => {
 
 fillDraft();
 
-const v$ = useVuelidate(computed(() => {
-  return {
-    name: {
-      required,
-      nameAlreadyInUse: () => !nameAlreadyExistsError.value,
-    },
-  };
-}), editDraft, {$autoDirty: true});
+const v$ = useVuelidate(
+  computed(() => {
+    return {
+      name: {
+        required,
+        nameAlreadyInUse: () => !nameAlreadyExistsError.value,
+      },
+    };
+  }),
+  editDraft,
+  { $autoDirty: true },
+);
 v$.value.$touch();
 
-const startEdit = ({open: openExpansion}) => {
+const startEdit = ({ open: openExpansion }) => {
   openExpansion();
   editMode.value = true;
 };
@@ -177,15 +189,15 @@ const submitEdit = () => {
 <style lang="scss" scoped>
 .preset-preview-title-wrapper {
   display: flex;
-  min-width: 0;
   gap: var(--spacing-xs);
+  min-width: 0;
 }
 
 .preset-preview-name {
-  overflow: hidden;
   flex: 1 1 0;
-  white-space: nowrap;
+  overflow: hidden;
   text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
 .preset-preview-content {

package/src/modules/Filters/v2/filter-presets/components/save-preset/overwrite-preset-popup.vue

@@ -4,7 +4,9 @@
     @close="emit('close')"
   >
     <template #title>
-      {{ `${t('reusable.save')} ${t('webitelUI.filters.presets.preset').toLowerCase()}` }}
+      {{
+        `${t('reusable.save')} ${t('webitelUI.filters.presets.preset').toLowerCase()}`
+      }}
     </template>
     <template #main>
       <p class="overwrite-preset-popup-text">

package/src/modules/Filters/v2/filter-presets/components/save-preset/save-preset-action.vue

@@ -7,8 +7,12 @@
     />
 
     <save-preset-popup
-      v-if="showSaveForm /* v-if is used to re-mount component on each open/close so that each time component data re-inits*/"
-      v-show="!presetToOverwriteWith /* on 'overwrite preset' popup hide this popup, but don't reset it*/"
+      v-if="
+        showSaveForm /* v-if is used to re-mount component on each open/close so that each time component data re-inits*/
+      "
+      v-show="
+        !presetToOverwriteWith /* on 'overwrite preset' popup hide this popup, but don't reset it*/
+      "
       :shown="true /* coz visibility is controlled by v-if*/"
       :filters-manager="props.filtersManager"
       :namespace="namespace"
@@ -26,16 +30,20 @@
 </template>
 
 <script lang="ts" setup>
-import {computed, inject, type Ref,ref} from 'vue';
-import {useI18n} from "vue-i18n";
-import {EnginePresetQuery} from "webitel-sdk";
+import { computed, inject, type Ref, ref } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { EnginePresetQuery } from 'webitel-sdk';
 
 import { WtIconAction } from '../../../../../../components/index';
-import {IFiltersManager} from "../../../filters/index";
-import {addPreset, getPresetList, updatePreset} from '../../api/PresetQuery.api.ts';
-import OverwritePresetPopup from "./overwrite-preset-popup.vue";
-import { IconAction } from "../../../../../../enums";
-import SavePresetPopup, {SubmitConfig} from "./save-preset-popup.vue";
+import { IFiltersManager } from '../../../filters/index';
+import {
+  addPreset,
+  getPresetList,
+  updatePreset,
+} from '../../api/PresetQuery.api.ts';
+import OverwritePresetPopup from './overwrite-preset-popup.vue';
+import { IconAction } from '../../../../../../enums';
+import SavePresetPopup, { SubmitConfig } from './save-preset-popup.vue';
 
 const props = defineProps<{
   /**
@@ -66,12 +74,16 @@ const showSaveForm = ref(false);
  */
 const presetToOverwriteWith: Ref<EnginePresetQuery | null> = ref(null);
 
-const handlePresetSubmit = async (preset: EnginePresetQuery, { onCompleted }: SubmitConfig) => {
+const handlePresetSubmit = async (
+  preset: EnginePresetQuery,
+  { onCompleted }: SubmitConfig,
+) => {
   try {
     await addPreset({ preset, namespace: props.namespace });
 
     eventBus.$emit('notification', {
-      type: 'success',  text: t('systemNotifications.success.create', {
+      type: 'success',
+      text: t('systemNotifications.success.create', {
         entity: t('webitelUI.filters.presets.preset'),
       }),
     });
@@ -87,15 +99,20 @@ const handlePresetSubmit = async (preset: EnginePresetQuery, { onCompleted }: Su
   }
 };
 
-const handlePresetOverwriteConfirmation = async ({ onCompleted }: SubmitConfig) => {
+const handlePresetOverwriteConfirmation = async ({
+  onCompleted,
+}: SubmitConfig) => {
   try {
-    const {items} = await getPresetList({
-      search: presetToOverwriteWith.value.name,
-      presetNamespace: props.namespace,
-    }, {
-      transformers: {useStarToSearch: false},
-    });
-    const {id: existingPresetId} = items[0];
+    const { items } = await getPresetList(
+      {
+        search: presetToOverwriteWith.value.name,
+        presetNamespace: props.namespace,
+      },
+      {
+        transformers: { useStarToSearch: false },
+      },
+    );
+    const { id: existingPresetId } = items[0];
     await updatePreset({
       id: existingPresetId,
       item: {
@@ -105,7 +122,8 @@ const handlePresetOverwriteConfirmation = async ({ onCompleted }: SubmitConfig)
     });
 
     eventBus.$emit('notification', {
-      type: 'success',  text: t('systemNotifications.success.update', {
+      type: 'success',
+      text: t('systemNotifications.success.update', {
         entity: t('webitelUI.filters.presets.preset'),
       }),
     });
@@ -118,6 +136,4 @@ const handlePresetOverwriteConfirmation = async ({ onCompleted }: SubmitConfig)
 };
 </script>
 
-<style lang="scss" scoped>
-
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filter-presets/components/save-preset/save-preset-popup.vue

@@ -129,8 +129,8 @@ const save = () => {
 
 .save-preset-filters-preview-wrapper {
   @extend %wt-scrollbar;
-  overflow-y: auto;
-  max-height: 140px;
   margin-top: var(--spacing-sm);
+  max-height: 140px;
+  overflow-y: auto;
 }
 </style>

package/src/modules/Filters/v2/filter-presets/index.ts

@@ -1,10 +1,5 @@
-import { createFilterPresetsStore } from "./stores/createFilterPresetsStore.ts";
+import { createFilterPresetsStore } from './stores/createFilterPresetsStore.ts';
 import SavePresetAction from './components/save-preset/save-preset-action.vue';
-import ApplyPresetAction from "./components/apply-preset/apply-preset-action.vue";
+import ApplyPresetAction from './components/apply-preset/apply-preset-action.vue';
 
-export {
-    SavePresetAction,
-    ApplyPresetAction,
-
-    createFilterPresetsStore
-};
+export { SavePresetAction, ApplyPresetAction, createFilterPresetsStore };

package/src/modules/Filters/v2/filter-presets/stores/createFilterPresetsStore.ts

@@ -1,14 +1,16 @@
 import { EnginePresetQuery } from 'webitel-sdk';
 import { createTableStore } from '../../table/createTableStore.store.ts';
-import PresetQueryAPI from "../api/PresetQuery.api.ts";
-import { headers } from "./headers/headers.ts";
+import PresetQueryAPI from '../api/PresetQuery.api.ts';
+import { headers } from './headers/headers.ts';
 
 export const createFilterPresetsStore = (namespace = 'presets') => {
-    const presetsNamespace = namespace.endsWith('presets') ? namespace : `${namespace}/presets`;
+  const presetsNamespace = namespace.endsWith('presets')
+    ? namespace
+    : `${namespace}/presets`;
 
-    return createTableStore<EnginePresetQuery>(presetsNamespace, {
-        apiModule: PresetQueryAPI,
-        headers,
-        disablePersistence: true,
-    });
-}
+  return createTableStore<EnginePresetQuery>(presetsNamespace, {
+    apiModule: PresetQueryAPI,
+    headers,
+    disablePersistence: true,
+  });
+};

package/src/modules/Filters/v2/filter-presets/stores/headers/headers.ts

@@ -1,24 +1,24 @@
-import {WtTableHeader} from "src/components/wt-table/types/WtTable.d.ts";
+import { WtTableHeader } from 'src/components/wt-table/types/WtTable.d.ts';
 
 export const headers: WtTableHeader[] = [
-    {
-        value: 'id',
-        field: 'id',
-        show: true,
-    },
-    {
-        value: 'name',
-        field: 'name',
-        show: true,
-    },
-    {
-        value: 'preset',
-        field: 'preset',
-        show: true,
-    },
-    {
-        value: 'description',
-        field: 'description',
-        show: true,
-    },
+  {
+    value: 'id',
+    field: 'id',
+    show: true,
+  },
+  {
+    value: 'name',
+    field: 'name',
+    show: true,
+  },
+  {
+    value: 'preset',
+    field: 'preset',
+    show: true,
+  },
+  {
+    value: 'description',
+    field: 'description',
+    show: true,
+  },
 ];

package/src/modules/Filters/v2/filters/components/config/dynamic-filter-config-form.vue

@@ -127,10 +127,10 @@ $form-width: 380px;
 .dynamic-filter-config-form {
   display: flex;
   flex-direction: column;
+  gap: var(--spacing-xs);
   box-sizing: border-box;
-  width: $form-width;
   padding: var(--spacing-xs) 0;
-  gap: var(--spacing-xs);
+  width: $form-width;
 }
 
 .dynamic-filter-config-form-footer {

package/src/modules/Filters/v2/filters/components/dynamic-filter-add-action.vue

@@ -44,11 +44,11 @@ const { t } = useI18n();
 
   &-wrapper {
     display: flex;
-    align-items: center;
     justify-content: center;
-    width: fit-content;
-    cursor: pointer;
+    align-items: center;
     gap: var(--spacing-2xs);
+    cursor: pointer;
+    width: fit-content;
   }
 }
 </style>

package/src/modules/Filters/v2/filters/components/dynamic-filter-panel-wrapper.vue

@@ -16,19 +16,22 @@
 <script setup lang="ts">
 import { ComponentSize } from '../../../../../enums';
 
-const props = withDefaults(defineProps<{
-  size?: ComponentSize;
-}>(), {
-  size: ComponentSize.MD,
-});
+const props = withDefaults(
+  defineProps<{
+    size?: ComponentSize;
+  }>(),
+  {
+    size: ComponentSize.MD,
+  },
+);
 </script>
 
 <style lang="scss" scoped>
 .dynamic-filter-panel-wrapper {
   display: grid;
   grid-gap: var(--spacing-sm);
-  align-items: center;
   grid-template-columns: 1fr auto;
+  align-items: center;
 }
 
 .dynamic-filter-panel-wrapper__filters {
@@ -46,7 +49,7 @@ const props = withDefaults(defineProps<{
 .dynamic-filter-panel-wrapper {
   &--sm {
     .dynamic-filter-panel-wrapper__filters,
-    .dynamic-filter-panel-wrapper__actions, {
+    .dynamic-filter-panel-wrapper__actions {
       grid-gap: var(--spacing-xs);
     }
   }

package/src/modules/Filters/v2/filters/components/filter-options/_shared/composables/booleanFilterToolkit.ts

@@ -1,33 +1,39 @@
-import {useVuelidate} from "@vuelidate/core";
-import {computed, ModelRef, type Reactive, type Ref} from "vue";
-import {useI18n} from "vue-i18n";
+import { useVuelidate } from '@vuelidate/core';
+import { computed, ModelRef, type Reactive, type Ref } from 'vue';
+import { useI18n } from 'vue-i18n';
 
-import {BooleanFilterModelValue} from "../types/BooleanFilter";
+import { BooleanFilterModelValue } from '../types/BooleanFilter';
 
-export const usePrettifyBooleanValuePreview = (value: Reactive<boolean>): { localeValue: Ref<string> } => {
-    const { t } = useI18n();
+export const usePrettifyBooleanValuePreview = (
+  value: Reactive<boolean>,
+): { localeValue: Ref<string> } => {
+  const { t } = useI18n();
 
-    const localeValue = computed(() => {
-        return value ? t('vocabulary.yes') : t('vocabulary.no');
-    });
+  const localeValue = computed(() => {
+    return value ? t('vocabulary.yes') : t('vocabulary.no');
+  });
 
-    return { localeValue };
+  return { localeValue };
 };
 
-export const useBooleanFilterValueValidation = <T extends BooleanFilterModelValue>(model: ModelRef<T>) => {
-    const v$ = useVuelidate(
-        computed(() => ({
-            model: {
-                required: (v: T) => !(!v && v !== false),
-            },
-        })),
-        { model },
-        { $autoDirty: true },
-    );
+export const useBooleanFilterValueValidation = <
+  T extends BooleanFilterModelValue,
+>(
+  model: ModelRef<T>,
+) => {
+  const v$ = useVuelidate(
+    computed(() => ({
+      model: {
+        required: (v: T) => !(!v && v !== false),
+      },
+    })),
+    { model },
+    { $autoDirty: true },
+  );
 
-    v$.value.$touch();
+  v$.value.$touch();
 
-    return {
-        v$,
-    };
+  return {
+    v$,
+  };
 };

package/src/modules/Filters/v2/filters/components/filter-options/_shared/composables/useFromToSecToPreviewTime.ts

@@ -1,41 +1,41 @@
-import {computed} from "vue";
-import {useI18n} from "vue-i18n";
+import { computed } from 'vue';
+import { useI18n } from 'vue-i18n';
 
 export const useFromToSecToPreviewTime = (value: {
-    from?: number | string | null,
-    to?: number | string | null,
+  from?: number | string | null;
+  to?: number | string | null;
 }) => {
-    const { t } = useI18n();
+  const { t } = useI18n();
 
-    const format = (secsVal: number) => {
-        const minutes = Math.floor(secsVal / 60);
-        const seconds = secsVal % 60;
+  const format = (secsVal: number) => {
+    const minutes = Math.floor(secsVal / 60);
+    const seconds = secsVal % 60;
 
-        return `${t('webitelUI.timepicker.min')} ${minutes} ${t('webitelUI.timepicker.sec')} ${seconds}`;
-    };
+    return `${t('webitelUI.timepicker.min')} ${minutes} ${t('webitelUI.timepicker.sec')} ${seconds}`;
+  };
 
-    const from = computed(() => {
-        const numValue = Number(value.from);
+  const from = computed(() => {
+    const numValue = Number(value.from);
 
-        if (!numValue && numValue !== 0) {
-            return '';
-        }
+    if (!numValue && numValue !== 0) {
+      return '';
+    }
 
-        return format(numValue);
-    });
+    return format(numValue);
+  });
 
-    const to = computed(() => {
-        const numValue = Number(value.to);
+  const to = computed(() => {
+    const numValue = Number(value.to);
 
-        if (!numValue && numValue !== 0) {
-            return '';
-        }
+    if (!numValue && numValue !== 0) {
+      return '';
+    }
 
-        return format(numValue);
-    });
+    return format(numValue);
+  });
 
-    return {
-        from,
-        to
-    };
+  return {
+    from,
+    to,
+  };
 };

package/src/modules/Filters/v2/filters/components/filter-options/_shared/date-time-filter/date-time-filter-value-field.vue

@@ -19,9 +19,9 @@
 </template>
 
 <script lang="ts" setup>
-import {endOfToday, startOfToday} from 'date-fns';
-import {useI18n} from 'vue-i18n';
-import {onMounted} from 'vue';
+import { endOfToday, startOfToday } from 'date-fns';
+import { useI18n } from 'vue-i18n';
+import { onMounted } from 'vue';
 
 type ModelValue = {
   from: number;
@@ -29,15 +29,18 @@ type ModelValue = {
 };
 
 const model = defineModel<ModelValue>();
-const {t} = useI18n();
+const { t } = useI18n();
 
 const handleInput = (key: keyof ModelValue, value: number) => {
-  model.value = { ...model.value, [key]: value};
+  model.value = { ...model.value, [key]: value };
 };
 
 const initModel = () => {
   if (!model.value) {
-    model.value = {from: startOfToday().getTime(), to: endOfToday().getTime()};
+    model.value = {
+      from: startOfToday().getTime(),
+      to: endOfToday().getTime(),
+    };
   }
 };
 

package/src/modules/Filters/v2/filters/components/filter-options/_shared/has-options/has-option-filter-value-field.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script lang="ts" setup>
-import {computed, useAttrs} from 'vue';
+import { computed, useAttrs } from 'vue';
 import { useI18n } from 'vue-i18n';
 
 import WtSelect from '../../../../../../../../components/wt-select/wt-select.vue';
@@ -27,7 +27,7 @@ const { t } = useI18n();
 
 const strModel = computed({
   get: () => {
-    return typeof model.value === "boolean" ? String(model.value) : model.value;
+    return typeof model.value === 'boolean' ? String(model.value) : model.value;
   },
   set: (value: string) => {
     model.value = value === 'true';

package/src/modules/Filters/v2/filters/components/filter-options/agent/agent-filter-value-preview.vue

@@ -1,6 +1,5 @@
 <template>
-  <ul
-    v-if="localValue">
+  <ul v-if="localValue">
     <li
       v-for="({ name }, index) of localValue"
       :key="index"
@@ -12,7 +11,7 @@
 
 <script lang="ts" setup>
 import { searchMethod } from './config.js';
-import {ref} from 'vue';
+import { ref } from 'vue';
 
 const props = defineProps<{
   value: number[];
@@ -21,12 +20,11 @@ const props = defineProps<{
 const localValue = ref([]);
 
 const getLocalValue = async () => {
-  const { items } = await searchMethod({id: props.value});
+  const { items } = await searchMethod({ id: props.value });
   localValue.value = items;
 };
 
 getLocalValue();
 </script>
 
-<style lang="scss" scoped>
-</style>
+<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/amd-result/amd-result-filter-value-preview.vue

@@ -13,8 +13,6 @@
 const props = defineProps<{
   value: number[];
 }>();
-
-
 </script>
 
 <style lang="scss" scoped></style>