Feature/teams hooks [WTEL-4246]

src/app/locale/en/en.js

@@ -703,6 +703,11 @@ export default {
           longestIdleAgent: 'Agent with longest idle time',
           skillCapacity: 'By skill level',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Agent status changed',
+          }
+        },
       },
 
       members: {

src/app/locale/ru/ru.js

@@ -701,6 +701,11 @@ export default {
           longestIdleAgent: 'Агент с наибольшим временем простоя',
           skillCapacity: 'По уровню навыка',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Изменение статуса оператора',
+          }
+        },
       },
 
       members: {

src/app/locale/ua/ua.js

@@ -703,6 +703,11 @@ export default {
           longestIdleAgent: 'Оператор з найбільшим часом простою',
           skillCapacity: 'По рівню навички',
         },
+        hooks: {
+          eventTypes: {
+            agentStatus: 'Зміна статуту оператора',
+          }
+        },
       },
 
       members: {

src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks-popup.vue

@@ -52,7 +52,7 @@ import { useVuelidate } from '@vuelidate/core';
 import { required } from '@vuelidate/validators';
 import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
 import FlowsAPI from '../../../../../../routing/modules/flow/api/flow';
-import HookEvent from '../enum/HookEvent.enum';
+import HookEvent from '../enum/HookQueueEvent.enum';
 
 export default {
   name: 'OpenedQueueHooksPopup',

src/modules/contact-center/modules/queues/modules/hooks/components/opened-queue-hooks.vue

@@ -93,8 +93,6 @@ export default {
   data: () => ({
     subNamespace: 'hooks',
     isHookPopup: false,
-
-    isDeleteConfirmation: false,
   }),
 
   methods: {

src/modules/contact-center/modules/queues/modules/hooks/store/_internals/headers.js

@@ -17,7 +17,6 @@ export default [
     value: 'state',
     locale: 'reusable.state',
     field: 'enabled',
-    width: '100px',
     sort: SortSymbols.NONE,
   },
 ];

src/modules/contact-center/modules/teams/components/opened-team.vue

@@ -42,6 +42,7 @@ import Agents from '../modules/agents/components/opened-team-agents.vue';
 import Supervisors from '../modules/supervisors/components/opened-team-supervisors.vue';
 import General from './opened-team-general.vue';
 import Parameters from './opened-team-parameters.vue';
+import Hooks from '../modules/hooks/components/opened-team-hooks.vue';
 
 export default {
   name: 'OpenedTeam',
@@ -50,6 +51,7 @@ export default {
     Supervisors,
     Agents,
     Parameters,
+    Hooks,
   },
   mixins: [openedObjectMixin],
 
@@ -87,7 +89,10 @@ export default {
         }, {
           text: this.$tc('objects.ccenter.agents.agents', 2),
           value: 'agents',
-        },
+        }, {
+          text: this.$tc('objects.ccenter.queues.hooks.hooks', 2),
+          value: 'hooks',
+        }
       ];
 
       if (this.id) tabs.push(this.permissionsTab);

src/modules/contact-center/modules/teams/modules/hooks/api/teamHooks.js

@@ -0,0 +1,167 @@
+import {
+  getDefaultGetListResponse,
+  getDefaultGetParams,
+} from '@webitel/ui-sdk/src/api/defaults';
+import applyTransform, {
+  camelToSnake,
+  merge,
+  mergeEach,
+  notify,
+  sanitize,
+  snakeToCamel,
+  starToSearch,
+} from '@webitel/ui-sdk/src/api/transformers';
+import { TeamHookServiceApiFactory } from 'webitel-sdk';
+import instance from '../../../../../../../app/api/instance';
+import configuration from '../../../../../../../app/api/openAPIConfig';
+
+const teamHookService = new TeamHookServiceApiFactory(configuration, '', instance);
+
+const fieldsToSend = ['event', 'properties', 'schema', 'enabled'];
+
+const preRequestHandler = (parentId) => (item) => ({
+  ...item,
+  teamId: parentId,
+});
+
+const getTeamHooksList = async (params) => {
+  const defaultObject = {
+    enabled: false,
+  };
+
+  const {
+    page,
+    size,
+    search,
+    sort,
+    fields,
+    id,
+    parentId,
+  } = applyTransform(params, [
+    merge(getDefaultGetParams()),
+    starToSearch('search'),
+  ]);
+
+  try {
+    const response = await teamHookService.searchTeamHook(
+      parentId,
+      page,
+      size,
+      search,
+      sort,
+      fields,
+      id,
+    );
+    const { items, next } = applyTransform(response.data, [
+      snakeToCamel(),
+      merge(getDefaultGetListResponse()),
+    ]);
+    return {
+      items: applyTransform(items, [
+        mergeEach(defaultObject),
+      ]),
+      next,
+    };
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const getTeamHook = async ({ parentId, itemId: id }) => {
+  const defaultObject = {
+    event: '',
+    properties: [],
+    schema: {},
+    enabled: false,
+  };
+
+  try {
+    const response = await teamHookService.readTeamHook(parentId, id);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+      merge(defaultObject),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const addTeamHook = async ({ parentId, itemInstance }) => {
+  const item = applyTransform(itemInstance, [
+    preRequestHandler(parentId),
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+  try {
+    const response = await teamHookService.createTeamHook(parentId, item);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const patchTeamHook = async ({ changes, id, parentId }) => {
+  const body = applyTransform(changes, [
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+
+  try {
+    const response = await teamHookService.patchTeamHook(parentId, id, body);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const updateTeamHook = async ({ itemInstance, itemId: id, parentId }) => {
+  const item = applyTransform(itemInstance, [
+    preRequestHandler(parentId),
+    sanitize(fieldsToSend),
+    camelToSnake(),
+  ]);
+  try {
+    const response = await teamHookService.updateTeamHook(parentId, id, item);
+    return applyTransform(response.data, [
+      snakeToCamel(),
+    ]);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const deleteTeamHook = async ({ parentId, id }) => {
+  try {
+    const response = await teamHookService.deleteTeamHook(parentId, id);
+    return applyTransform(response.data, []);
+  } catch (err) {
+    throw applyTransform(err, [
+      notify,
+    ]);
+  }
+};
+
+const TeamHooksAPI = {
+  getList: getTeamHooksList,
+  get: getTeamHook,
+  add: addTeamHook,
+  patch: patchTeamHook,
+  update: updateTeamHook,
+  delete: deleteTeamHook,
+};
+
+export default TeamHooksAPI;

src/modules/contact-center/modules/teams/modules/hooks/components/opened-team-hooks-popup.vue

@@ -0,0 +1,103 @@
+<template>
+  <wt-popup
+    min-width="480"
+    overflow
+    @close="close"
+  >
+    <template #title>
+      {{ $tc('objects.ccenter.queues.hooks.hooks', 1) }}
+    </template>
+    <template #main>
+      <form>
+        <wt-select
+          :value="event"
+          :clearable="false"
+          :label="$t('objects.ccenter.queues.hooks.event')"
+          :options="eventOptions"
+          :v="v$.itemInstance.event"
+          required
+          track-by="value"
+          @input="setItemProp({ prop: 'event', value: $event.value })"
+        />
+        <wt-select
+          :clearable="false"
+          :label="$tc('objects.routing.flow.flow', 1)"
+          :search-method="loadFlowOptions"
+          :v="v$.itemInstance.schema"
+          :value="itemInstance.schema"
+          required
+          @input="setItemProp({ prop: 'schema', value: $event })"
+        />
+      </form>
+    </template>
+    <template #actions>
+      <wt-button
+        :disabled="disabledSave"
+        @click="save"
+      >
+        {{ $t('objects.save') }}
+      </wt-button>
+      <wt-button
+        color="secondary"
+        @click="close"
+      >
+        {{ $t('objects.close') }}
+      </wt-button>
+    </template>
+  </wt-popup>
+</template>
+
+<script>
+import { EngineRoutingSchemaType } from 'webitel-sdk';
+import { snakeToCamel } from '@webitel/ui-sdk/src/scripts/caseConverters';
+import { useVuelidate } from '@vuelidate/core';
+import { required } from '@vuelidate/validators';
+import nestedObjectMixin from '../../../../../../../app/mixins/objectPagesMixins/openedObjectMixin/nestedObjectMixin';
+import FlowsAPI from '../../../../../../routing/modules/flow/api/flow';
+import HookEvent from '../enum/HookTeamEvent.enum';
+
+export default {
+  name: 'OpenedQueueHooksPopup',
+  mixins: [nestedObjectMixin],
+
+  setup: () => ({
+    v$: useVuelidate(),
+  }),
+  data: () => ({
+    namespace: 'ccenter/teams/hooks',
+  }),
+  validations: {
+    itemInstance: {
+      event: { required },
+      schema: { required },
+    },
+  },
+
+  computed: {
+    eventOptions() {
+      return Object.values(HookEvent).map((event) => ({
+        name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
+        value: event,
+      }));
+    },
+    event() {
+      const { event } = this.itemInstance;
+      return event ? {
+        name: this.$t(`objects.ccenter.teams.hooks.eventTypes.${this.snakeToCamel(event)}`),
+        value: event,
+      } : {};
+    }
+  },
+
+  methods: {
+    loadFlowOptions(params) {
+      return FlowsAPI.getLookup({ ...params, type: [EngineRoutingSchemaType.Service] });
+    },
+    snakeToCamel,
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+
+</style>