@webitel/ui-sdk 25.4.55 → 25.4.56

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

@@ -1,56 +0,0 @@
-<template>
-  <div class="date-time-filter-value-field">
-    <wt-datepicker
-      :label="`${t('webitelUI.filters.createdAtFrom')}:`"
-      :value="model?.from"
-      class="date-time-filter-value-field__picker"
-      mode="datetime"
-      @input="handleInput('from', $event)"
-    />
-
-    <wt-datepicker
-      :label="`${t('webitelUI.filters.createdAtTo')}:`"
-      :value="model?.to"
-      class="date-time-filter-value-field__picker"
-      mode="datetime"
-      @input="handleInput('to', $event)"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { endOfToday, startOfToday } from 'date-fns';
-import { onMounted } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-type ModelValue = {
-  from: number;
-  to: number;
-};
-
-const model = defineModel<ModelValue>();
-const { t } = useI18n();
-
-const handleInput = (key: keyof ModelValue, value: number) => {
-  model.value = { ...model.value, [key]: value };
-};
-
-const initModel = () => {
-  if (!model.value) {
-    model.value = {
-      from: startOfToday().getTime(),
-      to: endOfToday().getTime(),
-    };
-  }
-};
-
-onMounted(() => initModel());
-</script>
-
-<style lang="scss" scoped>
-.date-time-filter-value-field {
-  display: flex;
-  flex-direction: column;
-  grid-gap: var(--spacing-xs);
-}
-</style>

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

@@ -1,84 +0,0 @@
-<template>
-  <div class="duration-filter">
-    <wt-timepicker
-      v-if="model"
-      :label="t('reusable.from')"
-      :value="model.from"
-      :v="v$.model?.from"
-      format="mm:ss"
-      @input="handleInput('from', $event)"
-    />
-    <wt-timepicker
-      v-if="model"
-      :label="t('reusable.to')"
-      :value="model.to"
-      :v="v$.model?.to"
-      format="mm:ss"
-      @input="handleInput('to', $event)"
-    />
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { useVuelidate } from '@vuelidate/core';
-import { computed, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-const { t } = useI18n();
-
-type ModelValue = {
-  from: number;
-  to: number;
-};
-
-const model = defineModel<ModelValue>();
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-
-if (!model.value) {
-  model.value = {
-    from: 0,
-    to: 0,
-  };
-}
-
-const isValueEmpty = () => {
-  return !!model?.value?.to || !!model?.value?.from;
-};
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      from: {
-        required: isValueEmpty,
-      },
-      to: {
-        required: isValueEmpty,
-      },
-    },
-  })),
-  { 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>
-//.duration-filter {}
-</style>

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

@@ -1,38 +0,0 @@
-<template>
-  <wt-select
-    v-bind="attrs"
-    :clearable="false"
-    :options="BooleanOptions"
-    :value="strModel"
-    :label="t('webitelUI.filters.filterValue')"
-    class="has-option-filter-value-field"
-    track-by="value"
-    use-value-from-options-by-prop="value"
-    @input="strModel = $event"
-  />
-</template>
-
-<script lang="ts" setup>
-import { computed, useAttrs } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import WtSelect from '../../../../../../../../components/wt-select/wt-select.vue';
-import { BooleanOptions } from '../../../../enums/boolean-options';
-
-const model = defineModel<boolean | null>();
-
-const attrs = useAttrs();
-
-const { t } = useI18n();
-
-const strModel = computed({
-  get: () => {
-    return typeof model.value === 'boolean' ? String(model.value) : model.value;
-  },
-  set: (value: string) => {
-    model.value = value === 'true';
-  },
-});
-</script>
-
-<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/_shared/types/BooleanFilter.ts

@@ -1 +0,0 @@
-export type BooleanFilterModelValue = boolean;

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

@@ -1,18 +0,0 @@
-<template>
-  <date-time-filter-value-field
-    :model-value="model"
-    @update:model-value="model = $event"
-  />
-</template>
-
-<script lang="ts" setup>
-import DateTimeFilterValueField from '../_shared/date-time-filter/date-time-filter-value-field.vue';
-
-type ModelValue = {
-  from: number;
-  to: number;
-};
-const model = defineModel<ModelValue>();
-</script>
-
-<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/actual-reaction-time/actual-reaction-time-filter-value-preview.vue

@@ -1,44 +0,0 @@
-<template>
-  <div class="actual-reaction-time-filter-value-preview">
-    <div v-if="props.value.from">
-      <p class="actual-reaction-time-filter-value-preview__title">
-        {{ t('reusable.from') }}
-      </p>
-
-      <span>{{ convertTimestampToDate(props.value.from) }}</span>
-    </div>
-
-    <div v-if="props.value.to">
-      <p class="actual-reaction-time-filter-value-preview__title">
-        {{ t('reusable.to') }}
-      </p>
-
-      <span>{{ convertTimestampToDate(props.value.to) }}</span>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { format } from 'date-fns';
-import { useI18n } from 'vue-i18n';
-
-const props = defineProps<{
-  value: number[];
-}>();
-
-const { t } = useI18n();
-
-function convertTimestampToDate(value) {
-  return format(new Date(value), 'dd.MM.yyyy HH:mm');
-}
-</script>
-
-<style lang="scss" scoped>
-@use '@webitel/styleguide/typography' as *;
-
-.actual-reaction-time-filter-value-preview {
-  &__title {
-    @extend %typo-subtitle-1;
-  }
-}
-</style>

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

@@ -1,18 +0,0 @@
-<template>
-  <date-time-filter-value-field
-    :model-value="model"
-    @update:model-value="model = $event"
-  />
-</template>
-
-<script lang="ts" setup>
-import DateTimeFilterValueField from '../_shared/date-time-filter/date-time-filter-value-field.vue';
-
-type ModelValue = {
-  from: number;
-  to: number;
-};
-const model = defineModel<ModelValue>();
-</script>
-
-<style lang="scss" scoped></style>

package/src/modules/Filters/v2/filters/components/filter-options/actual-resolution-time/actual-resolution-time-filter-value-preview.vue

@@ -1,44 +0,0 @@
-<template>
-  <div class="actual-resolution-time-filter-value-preview">
-    <div v-if="props.value.from">
-      <p class="actual-resolution-time-filter-value-preview__title">
-        {{ t('reusable.from') }}
-      </p>
-
-      <span>{{ convertTimestampToDate(props.value.from) }}</span>
-    </div>
-
-    <div v-if="props.value.to">
-      <p class="actual-resolution-time-filter-value-preview__title">
-        {{ t('reusable.to') }}
-      </p>
-
-      <span>{{ convertTimestampToDate(props.value.to) }}</span>
-    </div>
-  </div>
-</template>
-
-<script lang="ts" setup>
-import { format } from 'date-fns';
-import { useI18n } from 'vue-i18n';
-
-const props = defineProps<{
-  value: number[];
-}>();
-
-const { t } = useI18n();
-
-function convertTimestampToDate(value) {
-  return format(new Date(value), 'dd.MM.yyyy HH:mm');
-}
-</script>
-
-<style lang="scss" scoped>
-@use '@webitel/styleguide/typography' as *;
-
-.actual-resolution-time-filter-value-preview {
-  &__title {
-    @extend %typo-subtitle-1;
-  }
-}
-</style>

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

@@ -1,58 +0,0 @@
-<template>
-  <wt-select
-    :close-on-select="false"
-    :label="t('webitelUI.filters.filterValue')"
-    :search-method="searchMethod"
-    :value="model"
-    :v="v$.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/agent/agent-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/agent/config.js

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

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

@@ -1,52 +0,0 @@
-<template>
-  <wt-select
-    :clearable="false"
-    :label="t('webitelUI.filters.filterValue')"
-    :options="AmdResultOptions"
-    :value="model"
-    :v="v$.model"
-    multiple
-    track-by="value"
-    use-value-from-options-by-prop="value"
-    @input="model = $event"
-  />
-</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 { AmdResultOptions } from '../../../enums/amd-result-options';
-
-const model = defineModel<string>();
-const { t } = useI18n();
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      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/amd-result/amd-result-filter-value-preview.vue

@@ -1,18 +0,0 @@
-<template>
-  <ul>
-    <li
-      v-for="(result, index) of props.value"
-      :key="index"
-    >
-      {{ result }}
-    </li>
-  </ul>
-</template>
-
-<script lang="ts" setup>
-const props = defineProps<{
-  value: number[];
-}>();
-</script>
-
-<style lang="scss" scoped></style>

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

@@ -1,74 +0,0 @@
-<template>
-  <wt-select
-    :close-on-select="false"
-    :label="t('webitelUI.filters.filterValue')"
-    :search-method="searchMethod"
-    :v="v$.model.list"
-    :value="model?.list"
-    multiple
-    track-by="id"
-    use-value-from-options-by-prop="id"
-    @input="model.list = $event"
-  />
-  <wt-checkbox
-    :label="t('reusable.showUnassigned')"
-    :selected="model?.unassigned"
-    :v="v$.model.unassigned"
-    @change="model.unassigned = $event"
-  />
-</template>
-
-<script lang="ts" setup>
-import { useVuelidate } from '@vuelidate/core';
-import { requiredIf } from '@vuelidate/validators';
-import { computed, onMounted, watch } from 'vue';
-import { useI18n } from 'vue-i18n';
-
-import WtCheckbox from '../../../../../../../components/wt-checkbox/wt-checkbox.vue';
-import WtSelect from '../../../../../../../components/wt-select/wt-select.vue';
-import { searchMethod } from './config.js';
-
-type ModelValue = {
-  list: string[];
-  unassigned: boolean;
-};
-
-const model = defineModel<ModelValue>();
-
-const emit = defineEmits<{
-  'update:invalid': [boolean];
-}>();
-const { t } = useI18n();
-
-const initModel = () => {
-  if (!model.value) {
-    model.value = {
-      list: [],
-      unassigned: false,
-    };
-  }
-};
-onMounted(() => initModel());
-
-const v$ = useVuelidate(
-  computed(() => ({
-    model: {
-      list: { required: requiredIf(() => !model.value.unassigned) },
-      unassigned: { required: requiredIf(() => !model.value.list.length) },
-    },
-  })),
-  { model },
-  { $autoDirty: true },
-);
-v$.value.$touch();
-
-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/assignee/assignee-filter-value-preview.vue

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

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

@@ -1,4 +0,0 @@
-import ContactsAPI from '../../../../../../../api/clients/сontacts/contacts.js';
-
-export const searchMethod = ContactsAPI.getLookup;
-export const localePath = '';

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

@@ -1,56 +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/author/author-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/author/config.js

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