@webitel/ui-sdk 25.4.55 → 25.4.56

package/src/modules/Filters/v2/filters/components/filter-options/score/score-from-to-filter-value-field.vue

@@ -1,100 +0,0 @@
-<template>
-  <div class="score-from-to-filter-value-field">
-    <wt-input
-      v-if="model"
-      :value="model.from"
-      :number-max="props.numberMax"
-      :number-min="0"
-      :v="v$.model?.from"
-      :label="`${t('reusable.from')}:`"
-      :placeholder="t('webitelUI.filters.filterValue')"
-      class="score-from-to-filter-value-field__input"
-      name="score-from-to-filter-value-field-from"
-      type="number"
-      @input="handleInput('from', $event)"
-    />
-
-    <wt-input
-      v-if="model"
-      :value="model.to"
-      :number-max="props.numberMax"
-      :number-min="0"
-      :v="v$.model?.to"
-      :label="`${t('reusable.to')}:`"
-      :placeholder="t('webitelUI.filters.filterValue')"
-      class="score-from-to-filter-value-field__input"
-      name="score-from-to-filter-value-field-to"
-      type="number"
-      @input="handleInput('to', $event)"
-    />
-  </div>
-</template>
-
-<script setup lang="ts">
-import { useVuelidate } from '@vuelidate/core';
-import { requiredIf } from '@vuelidate/validators';
-import { computed, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-type ModelValue = {
-  from: number;
-  to: number;
-};
-const model = defineModel<ModelValue>();
-if (!model.value) {
-  model.value = {
-    from: null,
-    to: null,
-  };
-}
-
-const props = withDefaults(
-  defineProps<{
-    numberMax: number;
-  }>(),
-  {
-    numberMax: 100,
-  },
-);
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-
-const { t } = useI18n();
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      from: { required: requiredIf(() => !model.value.to) },
-      to: { required: requiredIf(() => !model.value.from) },
-    },
-  })),
-  { model },
-  { $autoDirty: true },
-);
-v$.value.$touch();
-
-const handleInput = (key: keyof ModelValue, value: number) => {
-  const newValue = { ...model.value };
-  newValue[key] = value;
-  model.value = newValue;
-};
-
-watch(
-  () => v$.value.$invalid,
-  (invalid) => {
-    emit('update:invalid', invalid);
-  },
-  { immediate: true },
-);
-</script>
-
-<style lang="scss" scoped>
-.score-from-to-filter-value-field {
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  align-items: center;
-  grid-gap: var(--spacing-xs);
-}
-</style>

package/src/modules/Filters/v2/filters/components/filter-options/score/score-from-to-filter-value-preview.vue

@@ -1,39 +0,0 @@
-<template>
-  <div class="score-from-to-filter-value-preview">
-    <div v-if="props.value.from">
-      <p class="score-from-to-filter-value-preview__title">
-        {{ t('reusable.from') }}
-      </p>
-
-      <span>{{ props.value.from }}</span>
-    </div>
-
-    <div v-if="props.value.to">
-      <p class="score-from-to-filter-value-preview__title">
-        {{ t('reusable.to') }}
-      </p>
-
-      <span>{{ props.value.to }}</span>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { useI18n } from 'vue-i18n';
-
-const props = defineProps<{
-  value: number[];
-}>();
-
-const { t } = useI18n();
-</script>
-
-<style lang="scss" scoped>
-@use '@webitel/styleguide/typography' as *;
-
-.score-from-to-filter-value-preview {
-  &__title {
-    @extend %typo-subtitle-1;
-  }
-}
-</style>

package/src/modules/Filters/v2/filters/components/filter-options/service-case/config.js

@@ -1,6 +0,0 @@
-import ServiceCatalogsAPI from '../../../../../../../api/clients/caseServiceCatalogs/serviceCatalogs.js';
-import ServicesAPI from '../../../../../../../api/clients/caseServices/services.js';
-
-export const searchMethod = ServiceCatalogsAPI.getList;
-export const servicesSearchMethod = ServicesAPI.getList;
-export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/service-case/service-case-filter-value-field.vue

@@ -1,82 +0,0 @@
-<template>
-  <wt-tree
-    :model-value="model"
-    :data="catalogData"
-    item-data="id"
-    item-label="name"
-    children-prop="service"
-    class="service-case-filter-value-field"
-    multiple
-    @update:model-value="model = $event"
-  />
-</template>
-
-<script lang="ts" setup>
-import deepCopy from 'deep-copy';
-import { onMounted, ref } from 'vue';
-
-import WtTree from '../../../../../../../components/wt-tree/wt-tree.vue';
-import { searchMethod } from './config.js';
-
-type ModelValue = string[];
-const model = defineModel<ModelValue>({
-  default: [],
-});
-
-const catalogData = ref([]);
-
-const loadCatalogs = async () => {
-  const { items } = await searchMethod({
-    size: -1, // To get all catalogs with services we need to pass size -1
-    fields: ['id', 'name', 'closeReasonGroup', 'status', 'service'],
-    hasSubservices: true,
-  });
-
-  catalogData.value = deepCopy(items);
-};
-
-if (!model.value) {
-  model.value = [];
-}
-
-onMounted(loadCatalogs);
-</script>
-
-<style lang="scss">
-$form-width: 800px;
-
-.service-case-filter-value-field {
-  grid-area: value;
-  background: transparent;
-  height: 100%;
-  max-height: 350px;
-  overflow-y: auto;
-}
-
-.dynamic-filter-config-form {
-  &:has(.service-case-filter-value-field) {
-    display: grid;
-    grid-template-rows: 64px 1fr auto;
-    grid-template-columns: repeat(2, 1fr);
-    grid-template-areas:
-      'column label'
-      'value value'
-      'footer footer';
-    width: $form-width;
-    height: 500px;
-
-    .wt-select {
-      grid-area: column;
-      height: fit-content;
-    }
-
-    .wt-input {
-      grid-area: label;
-    }
-
-    .dynamic-filter-config-form-footer {
-      grid-area: footer;
-    }
-  }
-}
-</style>

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

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

package/src/modules/Filters/v2/filters/components/filter-options/sla/config.js

@@ -1,4 +0,0 @@
-import SlasAPI from '../../../../../../../api/clients/slas/slas.js';
-
-export const searchMethod = SlasAPI.getLookup;
-export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/sla/sla-filter-value-field.vue

@@ -1,57 +0,0 @@
-<template>
-  <wt-select
-    :close-on-select="false"
-    :label="t('webitelUI.filters.filterValue')"
-    :search-method="searchMethod"
-    :v="v$.model"
-    :value="model"
-    multiple
-    use-value-from-options-by-prop="id"
-    @input="handleInput"
-  />
-</template>
-
-<script lang="ts" setup>
-import { useVuelidate } from '@vuelidate/core';
-import { required } from '@vuelidate/validators';
-import { computed, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import WtSelect from '../../../../../../../components/wt-select/wt-select.vue';
-import { searchMethod } from './config.js';
-
-type ModelValue = number[];
-
-const model = defineModel<ModelValue>();
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-
-const { t } = useI18n();
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      required,
-    },
-  })),
-  { model },
-  { $autoDirty: true },
-);
-v$.value.$touch();
-
-watch(
-  () => v$.value.$invalid,
-  (invalid) => {
-    emit('update:invalid', invalid);
-  },
-  { immediate: true },
-);
-
-const handleInput = (value: ModelValue) => {
-  model.value = value;
-};
-</script>
-
-<style lang="scss" scoped></style>

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

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

package/src/modules/Filters/v2/filters/components/filter-options/sla-condition/config.js

@@ -1,6 +0,0 @@
-import SLAConditionsAPI from '../../../../../../../api/clients/slaConditions/slaConditions.js';
-import SlasAPI from '../../../../../../../api/clients/slas/slas.js';
-
-export const slasConditionsSearchMethod = SLAConditionsAPI.getLookup;
-export const slasSearchMethod = SlasAPI.getLookup;
-export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/sla-condition/sla-condition-filter-value-field.vue

@@ -1,98 +0,0 @@
-<template>
-  <div>
-    <wt-select
-      :clearable="false"
-      :label="t('cases.appliedSLA')"
-      :search-method="slasSearchMethod"
-      :v="v$.model.selection"
-      :value="model?.selection"
-      track-by="id"
-      use-value-from-options-by-prop="id"
-      @input="updateSelected"
-    />
-
-    <wt-select
-      v-if="model?.selection"
-      :key="model.selection"
-      :clearable="false"
-      :disabled="!model.selection"
-      :label="t('webitelUI.filters.filterValue')"
-      :search-method="getConditionList"
-      :v="v$.model.conditions"
-      :value="model?.conditions"
-      multiple
-      track-by="id"
-      use-value-from-options-by-prop="id"
-      @input="model.conditions = $event"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { useVuelidate } from '@vuelidate/core';
-import { required } from '@vuelidate/validators';
-import { computed, onMounted, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import WtSelect from '../../../../../../../components/wt-select/wt-select.vue';
-import { slasConditionsSearchMethod, slasSearchMethod } from './config.js';
-
-type ModelValue = {
-  selection: string;
-  conditions: string;
-};
-const model = defineModel<ModelValue>();
-const { t } = useI18n();
-
-const updateSelected = (value) => {
-  model.value.selection = value;
-  model.value.conditions = '';
-};
-
-const getConditionList = async (params) => {
-  return await slasConditionsSearchMethod({
-    parentId: model.value.selection,
-    ...params,
-  });
-};
-
-const initModel = () => {
-  if (!model.value) {
-    model.value = {
-      selection: '',
-      conditions: '',
-    };
-  }
-};
-onMounted(() => initModel());
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      selection: {
-        required,
-      },
-      conditions: {
-        required,
-      },
-    },
-  })),
-  { model },
-  { $autoDirty: true },
-);
-
-v$.value.$touch();
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-
-watch(
-  () => v$.value.$invalid,
-  (invalid) => {
-    emit('update:invalid', invalid);
-  },
-  { immediate: true },
-);
-</script>
-
-<style lang="scss" scoped></style>

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

@@ -1,37 +0,0 @@
-<template>
-  <ul v-if="localValue">
-    <li
-      v-for="({ name }, index) of localValue"
-      :key="index"
-    >
-      {{ name }}
-    </li>
-  </ul>
-</template>
-
-<script lang="ts" setup>
-import { ref } from 'vue';
-
-import { slasConditionsSearchMethod } from './config.js';
-
-const props = defineProps<{
-  value: {
-    selection: string;
-    conditions: string;
-  };
-}>();
-
-const localValue = ref([]);
-
-const getLocalValue = async () => {
-  const { items } = await slasConditionsSearchMethod({
-    parentId: props.value?.selection,
-    id: props.value?.conditions,
-  });
-  localValue.value = items;
-};
-
-getLocalValue();
-</script>
-
-<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/source-case/config.js

@@ -1,4 +0,0 @@
-import CaseSourcesAPI from '../../../../../../../api/clients/caseSources/caseSources.js';
-
-export const searchMethod = CaseSourcesAPI.getLookup;
-export const localePath = '';

package/src/modules/Filters/v2/filters/components/filter-options/source-case/source-case-filter-value-field.vue

@@ -1,57 +0,0 @@
-<template>
-  <wt-select
-    :close-on-select="false"
-    :label="t('webitelUI.filters.filterValue')"
-    :search-method="searchMethod"
-    :v="v$.model"
-    :value="model"
-    multiple
-    use-value-from-options-by-prop="id"
-    @input="handleInput"
-  />
-</template>
-
-<script lang="ts" setup>
-import { useVuelidate } from '@vuelidate/core';
-import { required } from '@vuelidate/validators';
-import { computed, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import WtSelect from '../../../../../../../components/wt-select/wt-select.vue';
-import { searchMethod } from './config.js';
-
-type ModelValue = number[];
-
-const model = defineModel<ModelValue>();
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-
-const { t } = useI18n();
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      required,
-    },
-  })),
-  { model },
-  { $autoDirty: true },
-);
-v$.value.$touch();
-
-watch(
-  () => v$.value.$invalid,
-  (invalid) => {
-    emit('update:invalid', invalid);
-  },
-  { immediate: true },
-);
-
-const handleInput = (value: ModelValue) => {
-  model.value = value;
-};
-</script>
-
-<style lang="scss" scoped></style>

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

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

package/src/modules/Filters/v2/filters/components/filter-options/status-case/config.js

@@ -1,7 +0,0 @@
-import CaseStatusConditionsAPI from '../../../../../../../api/clients/caseStatusConditions/caseStatusConditions.js';
-import CaseStatusesApi from '../../../../../../../api/clients/caseStatuses/caseStatuses.js';
-
-export const caseStatusesSearchMethod = CaseStatusesApi.getLookup;
-export const caseStatusConditionsSearchMethod =
-  CaseStatusConditionsAPI.getLookup;
-export const localePath = '';