Merge pull request #23 from webitel/feat/contact-timezone

feat: contact timezone [WTEL-3707]

package.json

@@ -20,7 +20,7 @@
     "vue-i18n": "^9.2.2",
     "vue-router": "^4.0.3",
     "vuex": "^4.0.0",
-    "webitel-sdk": "^23.7.13"
+    "webitel-sdk": "^23.9.5"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",

src/modules/contacts/api/ContactsAPI.js

@@ -92,7 +92,7 @@ const getList = async (params) => {
 };
 
 const get = async ({ itemId: id }) => {
-  const fields = ['name', 'about', 'labels', 'etag', 'mode', 'managers'];
+  const fields = ['name', 'about', 'labels', 'etag', 'mode', 'managers', 'timezones'];
 
   const defaultObject = {};
   const itemResponseHandler = (item) => {
@@ -118,7 +118,7 @@ const get = async ({ itemId: id }) => {
   }
 };
 
-const fieldsToSend = ['name', 'labels', 'about', 'managers'];
+const fieldsToSend = ['name', 'labels', 'about', 'managers', 'timezones'];
 
 const sanitizeManagers = (itemInstance) => {
   // handle many managers and even no managers field cases
@@ -127,9 +127,17 @@ const sanitizeManagers = (itemInstance) => {
   return { ...itemInstance, managers };
 };
 
+const sanitizeTimezones = (itemInstance) => {
+  // handle many timezones and even no timezones field cases
+  const timezones = (itemInstance.timezones ||
+    []).filter(({ timezone } = {}) => timezone.id);
+  return { ...itemInstance, timezones };
+};
+
 const add = async ({ itemInstance }) => {
   const item = applyTransform(itemInstance, [
     sanitizeManagers,
+    sanitizeTimezones,
     sanitize(fieldsToSend),
     camelToSnake(),
 
@@ -150,6 +158,7 @@ const update = async ({ itemInstance }) => {
   const { etag } = itemInstance;
   const item = applyTransform(itemInstance, [
     sanitizeManagers,
+    sanitizeTimezones,
     sanitize(fieldsToSend),
     camelToSnake(),
   ]);

src/modules/contacts/api/TimezonesAPI.js

@@ -18,6 +18,8 @@ const getList = async (params) => {
     page,
     size,
     search,
+    sort,
+    fields,
   } = applyTransform(params, [
     merge(getDefaultGetParams()),
     starToSearch('search'),
@@ -28,6 +30,8 @@ const getList = async (params) => {
       page,
       size,
       search,
+      sort,
+      fields,
     );
     const { items, next } = applyTransform(response.data, [
       snakeToCamel(),
@@ -44,8 +48,14 @@ const getList = async (params) => {
   }
 };
 
+const getLookup = (params) => getList({
+  ...params,
+  fields: params.fields || ['id', 'name'],
+});
+
 const TimezonesAPI = {
   getList,
+  getLookup,
 };
 
 export default TimezonesAPI;

src/modules/contacts/components/contact-popup.vue

@@ -19,10 +19,10 @@
           @input="draft.name.commonName = $event"
         ></wt-input>
         <wt-select
-          :value="draft.timezones"
+          :value="draft.timezones[0]?.timezone"
           :label="t('date.timezone', 1)"
-          :search-method="TimezonesAPI.getList"
-          @input="draft.timezones = $event"
+          :search-method="TimezonesAPI.getLookup"
+          @input="draft.timezones[0] = { timezone: $event }"
         ></wt-select>
         <wt-select
           :value="draft.managers[0]?.user"

src/modules/contacts/components/opened-contact-general.vue

@@ -40,7 +40,7 @@
       <p class="opened-contact-general-item__title">
         {{ t('date.timezone', 1) }}
       </p>
-      <p class="opened-contact-general-item__value">{{ timezones[0] }}</p>
+      <p class="opened-contact-general-item__value">{{ timezones[0].timezone.name }}</p>
     </div>
 
     <wt-divider v-if="timezones.length"></wt-divider>