@webitel/ui-sdk 3.1.91 → 3.1.93

package/package.json

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

package/src/components/organisms/wt-table-column-select/wt-table-column-select.vue

@@ -18,19 +18,29 @@
         {{ $t('webitelUI.tableColumnSelect.title') }}
       </template>
       <template v-slot:main>
-        <ul class="wt-table-column-select__popup__list">
-          <li
-            v-for="(col, key) of changeableDraft"
-            :key="key"
-            class="wt-table-column-select__popup__item"
-            @click.capture.prevent="col.show = !col.show"
+        <div class="wt-table-column-select__popup-list-wrap">
+          <ul
+            class="wt-table-column-select__popup-list"
+            :class="{
+            'wt-table-column-select__popup-list--md':
+            changeableDraft.length > 20 && changeableDraft.length <= 30,
+            'wt-table-column-select__popup-list--lg':
+            changeableDraft.length > 30
+            }"
           >
-            <wt-checkbox
-              v-model="col.show"
-              :label="shownColLabel(col)"
-            ></wt-checkbox>
-          </li>
-        </ul>
+            <li
+              v-for="(column, key) of changeableDraft"
+              :key="key"
+              class="wt-table-column-select__popup-item"
+              @click.capture.prevent="column.show = !column.show"
+            >
+              <wt-checkbox
+                v-model="column.show"
+                :label="shownColLabel(column)"
+              ></wt-checkbox>
+            </li>
+          </ul>
+        </div>
       </template>
       <template v-slot:actions>
         <wt-button
@@ -84,7 +94,10 @@ export default {
   },
   computed: {
     changeableDraft() {
-      return this.draft.filter((header) => !this.staticHeaders.includes(header.value));
+      return this.draft.filter((header) => !this.staticHeaders.includes(header.value)).sort((a, b) => {
+        return a.text.localeCompare(b.text);
+        // sorting headers for alphabet just in popup
+      });
     },
   },
   methods: {
@@ -112,18 +125,53 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+$list-height: 400px;
+$list-width-sm: calc(500px - var(--spacing-xl)); // all popup width - (paddings + overflow-padding)
+$list-width-md: calc(800px - var(--spacing-xl)); // all popup width - (paddings + overflow-padding)
+
 .wt-table-column-select {
-  line-height: 0; // prevent 24x28 icon heght :/
+  line-height: 0; // prevent 24x28 icon height :/
 }
+.wt-table-column-select {
+  &__heading {
+    text-align: center;
+  }
 
-.wt-table-column-select__popup__list {
-  @extend %wt-scrollbar;
-  overflow: auto;
-  width: 550px; // fixme popup fixed sizes
-  max-height: 35vh; // fixme popup fixed sizes
-}
+  &__popup-list-wrap {
+    max-height: $list-height;
+  }
+
+  &__popup-list {
+    @extend %wt-scrollbar;
+    max-height: $list-height;
+    width: $list-width-sm;
+    display: flex;
+    flex-direction: column;
+    flex-wrap: wrap;
+    overflow-x: hidden;
 
-.wt-table-column-select__popup__item {
-  margin-bottom: var(--spacing-xs);
+    // for 20-30 items
+    &--md {
+      width: $list-width-md;
+    }
+
+    // for 30+ items
+    &--lg {
+      width: $list-width-md;
+      max-height: none;
+      display: block;
+      column-count: 3;
+      overflow-y: auto;
+    }
+  }
+
+  &__popup-item {
+    display: flex;
+    align-items: center;
+    margin-right: var(--spacing-sm);
+    margin-bottom: var(--spacing-sm);
+  }
 }
+
 </style>
+

package/src/enums/WebitelApplications/CrmSections.enum.js

@@ -0,0 +1,5 @@
+const CrmSections = Object.freeze({
+  CONTACTS: 'contacts',
+});
+
+export default CrmSections;

package/src/enums/WebitelApplications/WebitelApplications.enum.js

@@ -5,6 +5,7 @@ const WebitelApplications = Object.freeze({
   HISTORY: 'history',
   AUDIT: 'audit',
   ANALYTICS: 'grafana',
+  CRM: 'crm',
 });
 
 export default WebitelApplications;

package/src/locale/en/en.js

@@ -9,6 +9,7 @@ import { QueueType } from 'webitel-sdk/esm2015/enums';
 import AdminSections from '../../enums/WebitelApplications/AdminSections.enum';
 import AuditorSections
   from '../../enums/WebitelApplications/AuditorSections.enum';
+import CrmSections from '../../enums/WebitelApplications/CrmSections.enum';
 import SupervisorSections
   from '../../enums/WebitelApplications/SupervisorSections.enum';
 import WebitelApplications
@@ -166,6 +167,12 @@ export default {
         [AuditorSections.SCORECARDS]: 'Scorecards',
       },
     },
+    [WebitelApplications.CRM]: {
+      name: 'CRM',
+      sections: {
+        [CrmSections.CONTACTS]: 'Contacts',
+      },
+    },
     [WebitelApplications.HISTORY]: { name: 'Call History' },
     [WebitelApplications.ANALYTICS]: { name: 'Data Visualisation Tool' },
     [WebitelApplications.SUPERVISOR]: {

package/src/locale/ru/ru.js

@@ -9,6 +9,7 @@ import { QueueType } from 'webitel-sdk/esm2015/enums';
 import AdminSections from '../../enums/WebitelApplications/AdminSections.enum';
 import AuditorSections
   from '../../enums/WebitelApplications/AuditorSections.enum';
+import CrmSections from '../../enums/WebitelApplications/CrmSections.enum';
 import SupervisorSections
   from '../../enums/WebitelApplications/SupervisorSections.enum';
 import WebitelApplications
@@ -165,6 +166,12 @@ export default {
         [AuditorSections.SCORECARDS]: 'Анкеты',
       },
     },
+    [WebitelApplications.CRM]: {
+      name: 'CRM',
+      sections: {
+        [CrmSections.CONTACTS]: 'Контакты',
+      },
+    },
     [WebitelApplications.HISTORY]: { name: 'Call History' },
     [WebitelApplications.ANALYTICS]: { name: 'Data Visualisation Tool' },
     [WebitelApplications.SUPERVISOR]: {

package/src/locale/ua/ua.js

@@ -9,6 +9,7 @@ import { QueueType } from 'webitel-sdk/esm2015/enums';
 import AdminSections from '../../enums/WebitelApplications/AdminSections.enum';
 import AuditorSections
   from '../../enums/WebitelApplications/AuditorSections.enum';
+import CrmSections from '../../enums/WebitelApplications/CrmSections.enum';
 import SupervisorSections
   from '../../enums/WebitelApplications/SupervisorSections.enum';
 import WebitelApplications
@@ -165,6 +166,12 @@ export default {
         [AuditorSections.SCORECARDS]: 'Анкети',
       },
     },
+    [WebitelApplications.CRM]: {
+      name: 'CRM',
+      sections: {
+        [CrmSections.CONTACTS]: 'Контакти',
+      },
+    },
     [WebitelApplications.HISTORY]: { name: 'Call History' },
     [WebitelApplications.ANALYTICS]: { name: 'Data Visualisation Tool' },
     [WebitelApplications.SUPERVISOR]: {

package/src/modules/Userinfo/classes/ApplicationsAccess.js

@@ -1,5 +1,6 @@
 import deepmerge from 'deepmerge';
 import deepCopy from 'deep-copy';
+import CrmSections from '../../../enums/WebitelApplications/CrmSections.enum';
 import WebitelApplications from '../../../enums/WebitelApplications/WebitelApplications.enum';
 import SupervisorSections from '../../../enums/WebitelApplications/SupervisorSections.enum';
 import AdminSections from '../../../enums/WebitelApplications/AdminSections.enum';
@@ -159,6 +160,14 @@ const applicationsAccess = (value = true) => ({
       _locale: `WebitelApplications.${WebitelApplications.AUDIT}.sections.${AuditorSections.SCORECARDS}`,
     },
   },
+  [WebitelApplications.CRM]: {
+    _enabled: value,
+    _locale: `WebitelApplications.${WebitelApplications.CRM}.name`,
+    [CrmSections.CONTACTS]: {
+      _enabled: value,
+      _locale: `WebitelApplications.${WebitelApplications.CRM}.sections.${CrmSections.CONTACTS}`,
+    },
+  },
 });
 
 /**