@webitel/ui-sdk 3.1.55 → 3.1.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webitel/ui-sdk",
-  "version": "3.1.55",
+  "version": "3.1.57",
   "private": false,
   "scripts": {
     "serve-lib": "vue-cli-service serve",

package/src/components/atoms/wt-icon/wt-icon.vue

@@ -127,6 +127,16 @@ svg {
 }
 
 .wt-icon--size {
+  &-3xl {
+    width: var(--icon-3xl-size);
+    height: var(--icon-3xl-size);
+  }
+
+  &-2xl {
+    width: var(--icon-2xl-size);
+    height: var(--icon-2xl-size);
+  }
+
   &-xl {
     width: var(--icon-xl-size);
     height: var(--icon-xl-size);

package/src/css/components/atoms/wt-icon/_variables.scss

@@ -1,8 +1,10 @@
 
 :root {
+  --icon-3xl-size: 56px;
+  --icon-2xl-size: 48px;
   --icon-xl-size: 40px;
   --icon-lg-size: 32px;
   --icon-md-size: 24px;
   --icon-sm-size: 16px;
   --icon-xs-size: 8px;
-}
+}

package/src/locale/en/en.js

@@ -23,6 +23,8 @@ export default {
     save: 'Save',
     saveAs: 'SaveAs',
     saved: 'Saved',
+    send: 'Send',
+    start: 'Start',
     close: 'Close',
     add: 'Add',
     cancel: 'Cancel',

package/src/locale/ru/ru.js

@@ -23,6 +23,8 @@ export default {
     save: 'Сохранить',
     saveAs: 'Сохранить как нового',
     saved: 'Сохранено',
+    send: 'Отправить',
+    start: 'Начать',
     close: 'Закрыть',
     add: 'Добавить',
     cancel: 'Отменить',

package/src/locale/ua/ua.js

@@ -23,6 +23,8 @@ export default {
     save: 'Зберегти',
     saveAs: 'Зберігти як нового',
     saved: 'Збережено',
+    send: 'Надіслати',
+    start: 'Почати',
     close: 'Закрити',
     add: 'Додати',
     cancel: 'Відмінити',

package/src/modules/QueryFilters/components/filter-table-fields.vue

@@ -0,0 +1,101 @@
+<template>
+  <wt-table-column-select
+    :headers="headers"
+    :static-headers="staticHeaders"
+    @change="change"
+  ></wt-table-column-select>
+</template>
+
+<script>
+import baseFilterMixin from '../mixins/baseFilterMixin/baseFilterMixin';
+
+export default {
+  name: 'filter-table-fields',
+  mixins: [baseFilterMixin],
+  props: {
+    entity: {
+      type: String,
+      required: true,
+    },
+    headers: {
+      type: Array,
+      required: true,
+    },
+    staticHeaders: {
+      type: Array,
+    },
+  },
+
+  data: () => ({
+    storedProp: 'value',
+    filterQuery: 'fields',
+  }),
+
+  model: {
+    prop: 'headers',
+    event: 'change',
+  },
+
+  methods: {
+    change(headers) {
+      this.setValue(headers);
+    },
+
+    // overrides baseFilterMixin method
+    restore({ filterQuery }) {
+      const queryValue = this.getValueFromQuery({ filterQuery });
+      const storageValue = this.getFromLocalStorage({ filterQuery });
+      if (!queryValue && storageValue) {
+        this.setValueToQuery({
+          filterQuery,
+          value: storageValue,
+          storedProp: this.storedProp,
+        });
+      }
+      if (queryValue || storageValue) {
+        this.restoreValue(queryValue || storageValue);
+      }
+    },
+
+    restoreValue(value) {
+      const headers = this.headers.map((header) => ({
+        ...header,
+        show: !!value.includes(header.value),
+      }));
+      this.$emit('change', headers);
+    },
+
+    setValue(headers) {
+      const value = headers.filter((item) => item.show);
+      const params = {
+        filterQuery: this.filterQuery,
+        value,
+        storedProp: this.storedProp,
+      };
+      this.setValueToQuery(params);
+      this.setToLocalStorage(params);
+      this.$emit('change', headers);
+    },
+
+    getFromLocalStorage({ filterQuery }) {
+      const value = localStorage.getItem(`${this.entity}-${filterQuery}`);
+      return value ? value.split(',') : null;
+    },
+
+    // copy-pasted params from "setValueArrayToQuery method
+    // for easier future refactors, if method should be abstract
+    setToLocalStorage({
+                        filterQuery,
+                        value,
+                        storedProp = 'id',
+                      }) {
+      const filter = value.map((item) => item[storedProp]);
+      localStorage.setItem(`${this.entity}-${filterQuery}`, filter);
+    },
+  },
+};
+</script>
+
+<style scoped>
+
+</style>