fix: rename component and change in store page[WTEL-5079]

webitel · Sep 25, 2024 · 2da1402 · 2da1402
1 parent 6dfa5cd
commit 2da1402
Show file tree

Hide file tree

Showing 8 changed files with 49 additions and 82 deletions.
diff --git a/src/modules/lookups/modules/calendars/components/opened-calendar-special-time.vue b/src/modules/lookups/modules/calendars/components/opened-calendar-special-time.vue
@@ -24,7 +24,7 @@
               :disabled="disableUserInput"
               :value="minToSec(item.start)"
               format="hh:mm"
-              noLabel
+              no-label
               @input="setItemProp({prop: 'start', index, value: secToMin($event)})"
             />
           </template>
@@ -33,7 +33,7 @@
               :disabled="disableUserInput"
               :value="minToSec(item.end)"
               format="hh:mm"
-              noLabel
+              no-label
               @input="setItemProp({prop: 'end', index, value: secToMin($event)})"
             />
           </template>

diff --git a/src/modules/lookups/modules/calendars/components/opened-calendar-work-week.vue b/src/modules/lookups/modules/calendars/components/opened-calendar-work-week.vue
@@ -24,7 +24,7 @@
               :disabled="disableUserInput"
               :value="minToSec(item.start)"
               format="hh:mm"
-              noLabel
+              no-label
               @input="setItemProp({ prop: 'start', index, value: secToMin($event)})"
             />
           </template>
@@ -33,7 +33,7 @@
               :disabled="disableUserInput"
               :value="minToSec(item.end)"
               format="hh:mm"
-              noLabel
+              no-label
               @input="setItemProp({prop: 'end', index, value: secToMin($event)})"
             />
           </template>
@@ -81,7 +81,4 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.wt-timepicker :deep(.wt-label) {
-  display: none;
-}
 </style>
diff --git a/src/modules/lookups/modules/shift-templates/api/shiftTemplates.js b/src/modules/lookups/modules/shift-templates/api/shiftTemplates.js
@@ -5,7 +5,6 @@ import applyTransform, {
   notify,
   sanitize,
   snakeToCamel,
-  starToSearch,
 } from '@webitel/ui-sdk/src/api/transformers/index.js';
 import { ShiftTemplateServiceApiFactory } from 'webitel-sdk';
 
@@ -17,7 +16,6 @@ const shiftTemplateService = new ShiftTemplateServiceApiFactory(configuration, '
 const getShiftTemplateList = async (params) => {
   const { search: q, page, size, sort, fields } = applyTransform(params, [
     merge(getDefaultGetParams()),
-    starToSearch(),
   ]);
 
   try {
@@ -64,7 +62,7 @@ const addShiftTemplate = async ({ itemInstance }) => {
   const item = applyTransform(itemInstance, [sanitize(fieldsToSend), camelToSnake()]);
   try {
     const response = await shiftTemplateService.createShiftTemplate({ item: { ...item } });
-    return applyTransform(response.data, [snakeToCamel()]);
+    return applyTransform(response.data, [snakeToCamel(), itemResponseHandler]);
   } catch (err) {
     throw applyTransform(err, [notify]);
   }

diff --git a/...onents/opened-shift-template-template.vue → ...omponents/opened-shift-template-times.vue b/...onents/opened-shift-template-template.vue → ...omponents/opened-shift-template-times.vue
@@ -1,5 +1,5 @@
 <template>
-  <section class="opened-calendar-work-week">
+  <section>
     <header class="content-header">
       <h3 class="content-title">
         {{ $tc('objects.routing.chatGateways.templates.templates', 1) }}
@@ -10,7 +10,7 @@
           v-if="!disableUserInput"
           class="icon-action"
           icon="plus"
-          @click="addTemplate"
+          @click="addTime"
         />
       </div>
     </header>
@@ -29,6 +29,7 @@
               :value="minToSec(item.start)"
               :v="v.itemInstance.times.$each.$response.$data[index].start"
               format="hh:mm"
+              no-label
               @input="setStartTime({ index, value: secToMin($event) })"
             />
           </template>
@@ -37,6 +38,7 @@
               :disabled="disableUserInput"
               :value="minToSec(item.end)"
               format="hh:mm"
+              no-label
               :v="v.itemInstance.times.$each.$response.$data[index].end"
               @input="setEndTime({ index, value: secToMin($event) })"
             />
@@ -46,13 +48,14 @@
               :value="minToSec(item.duration)"
               format="hh:mm"
               type="number"
+              no-label
               @input="setDuration({ index, value: secToMin($event) })"
             />
           </template>
           <template #actions="{ item, index }">
             <wt-icon-action
               action="delete"
-              @click="deleteTemplate(index)"
+              @click="deleteTime(index)"
             />
           </template>
         </wt-table>
@@ -62,11 +65,12 @@
 </template>
 
 <script>
-import { mapActions, mapState } from 'vuex';
 import openedTabComponentMixin from '../../../../../app/mixins/objectPagesMixins/openedObjectTabMixin/openedTabComponentMixin';
 
+const DEFAULT_TIME = { start: 9 * 60, end: 20 * 60, duration: 11 * 60 };
+
 export default {
-  name: 'OpenedShiftTemplateTemplate',
+  name: 'OpenedShiftTemplateTimes',
   mixins: [openedTabComponentMixin],
   computed: {
     headers() {
@@ -88,36 +92,43 @@ export default {
   },
 
   methods: {
-    ...mapActions('lookups/shiftTemplates', {
-      addTemplate: 'ADD_TEMPLATE',
-      setTemplate: 'SET_TEMPLATE',
-      deleteTemplate: 'DELETE_TEMPLATE',
-    }),
     minToSec(min) {
       return min * 60;
     },
     secToMin(sec) {
       return sec / 60;
     },
+    addTime() {
+      const array = [...this.itemInstance.times];
+      array.push(DEFAULT_TIME);
+      this.setItemProp({ prop: 'times', value: array });
+    },
+    deleteTime(index) {
+      const array = [...this.itemInstance.times];
+      array.splice(index, 1);
+      this.setItemProp({ prop: 'times', value: array });
+    },
+    setTime({ prop, index, value }) {
+      const array = [...this.itemInstance.times];
+      array[index][prop] = value;
+      this.setItemProp({ prop: 'times', value: array });
+    },
     setStartTime({ index, value }) {
-      this.setTemplate({ prop: 'start', index, value });
-      this.setTemplate({ prop: 'duration', index, value: this.itemInstance.times[index].end - this.itemInstance.times[index].start });
+      this.setTime({ prop: 'start', index, value });
+      this.setTime({ prop: 'duration', index, value: this.itemInstance.times[index].end - this.itemInstance.times[index].start });
     },
     setEndTime({ index, value }) {
-      this.setTemplate({ prop: 'end', index, value });
-      this.setTemplate({ prop: 'duration', index, value: this.itemInstance.times[index].end - this.itemInstance.times[index].start });
+      this.setTime({ prop: 'end', index, value });
+      this.setTime({ prop: 'duration', index, value: this.itemInstance.times[index].end - this.itemInstance.times[index].start });
     },
     setDuration({ index, value }) {
-      this.setTemplate({ prop: 'duration', index, value });
-      this.setTemplate({ prop: 'end', index, value: this.itemInstance.times[index].start + this.itemInstance.times[index].duration });
+      this.setTime({ prop: 'duration', index, value});
+      this.setTime({ prop: 'end', index, value: this.itemInstance.times[index].start + this.itemInstance.times[index].duration });
     },
   },
 };
 </script>
 
 <style lang="scss" scoped>
-.wt-timepicker :deep(.wt-label) {
-  display: none;
-}
 </style>
 
diff --git a/src/modules/lookups/modules/shift-templates/components/opened-shift-template.vue b/src/modules/lookups/modules/shift-templates/components/opened-shift-template.vue
@@ -39,15 +39,15 @@
 import { useVuelidate } from '@vuelidate/core';
 import { required, maxLength, helpers, minValue, maxValue } from '@vuelidate/validators';
 import openedObjectMixin from '../../../../../app/mixins/objectPagesMixins/openedObjectMixin/openedObjectMixin';
-import { requiredArrayValue, timerangeStartLessThanEnd } from '../../../../../app/utils/validators.js';
+import { requiredArrayValue } from '../../../../../app/utils/validators.js';
 import General from './opened-shift-template-general.vue';
-import Template from './opened-shift-template-template.vue';
+import Times from './opened-shift-template-times.vue';
 import ShiftTemplatesRouteNames from '../router/_internals/ShiftTemplatesRouteName.enum.js';
 import RouteNames from '../../../../../app/router/_internals/RouteNames.enum.js';
 
 export default {
   name: 'OpenedShiftTemplate',
-  components: { General, Template },
+  components: { General, Times },
   mixins: [openedObjectMixin],
 
   setup: () => ({
@@ -63,7 +63,6 @@ export default {
       times: {
         requiredArrayValue,
         $each: helpers.forEach({
-          timerangeStartLessThanEnd,
           start: {
             required,
             minValue: minValue(0),
@@ -74,6 +73,9 @@ export default {
             minValue: minValue(0),
             maxValue: maxValue(1440),
           },
+          duration: {
+            minValue: minValue(1)
+          }
         }),
       }
     },
@@ -89,8 +91,8 @@ export default {
         },
         {
           text: this.$tc('objects.routing.chatGateways.templates.templates', 1),
-          value: 'template',
-          pathName: ShiftTemplatesRouteNames.TEMPLATE
+          value: 'times',
+          pathName: ShiftTemplatesRouteNames.TIMES
         },
       ];
       return tabs;

diff --git a/...modules/lookups/modules/shift-templates/router/_internals/ShiftTemplatesRouteName.enum.js b/...modules/lookups/modules/shift-templates/router/_internals/ShiftTemplatesRouteName.enum.js
@@ -2,5 +2,5 @@ import RouteNames from '../../../../../../app/router/_internals/RouteNames.enum.
 
 export default Object.freeze({
   GENERAL: `${RouteNames.SHIFT_TEMPLATES}-general`,
-  TEMPLATE: `${RouteNames.SHIFT_TEMPLATES}-template`,
+  TIMES: `${RouteNames.SHIFT_TEMPLATES}-times`,
 });
diff --git a/src/modules/lookups/modules/shift-templates/router/shift-templates.js b/src/modules/lookups/modules/shift-templates/router/shift-templates.js
@@ -7,7 +7,7 @@ const ShiftTemplates = () => import('../components/the-shift-templates.vue');
 const OpenedShiftTemplate = () => import('../components/opened-shift-template.vue');
 
 const OpenedShiftTemplateGeneral = () => import('../components/opened-shift-template-general.vue');
-const OpenedShiftTemplateTemplate = () => import('../components/opened-shift-template-template.vue');
+const OpenedShiftTemplateTimes = () => import('../components/opened-shift-template-times.vue');
 
 
 const ShiftTemplatesRoutes = [
@@ -30,9 +30,9 @@ const ShiftTemplatesRoutes = [
         component: OpenedShiftTemplateGeneral,
       },
       {
-        path: 'template',
-        name: ShiftTemplatesRouteNameEnum.TEMPLATE,
-        component: OpenedShiftTemplateTemplate,
+        path: 'times',
+        name: ShiftTemplatesRouteNameEnum.TIMES,
+        component: OpenedShiftTemplateTimes,
       }
     ],
   },

diff --git a/src/modules/lookups/modules/shift-templates/store/shift-templates.js b/src/modules/lookups/modules/shift-templates/store/shift-templates.js
@@ -10,50 +10,9 @@ const resettableState = {
   },
 };
 
-const actions = {
-  ADD_TEMPLATE: (context) => {
-    const pair = { start: 9 * 60, end: 20 * 60, duration : 11 * 60 };
-    context.commit('ADD_TEMPLATE', pair);
-    context.commit('SET_ITEM_PROPERTY', {
-      prop: '_dirty',
-      value: true,
-    });
-  },
-  SET_TEMPLATE: (context, { index, prop, value }) => {
-    context.commit('SET_TEMPLATE', {
-      index,
-      prop,
-      value,
-    });
-    context.commit('SET_ITEM_PROPERTY', {
-      prop: '_dirty',
-      value: true,
-    });
-  },
-  DELETE_TEMPLATE: (context, index) => {
-    context.commit('DELETE_TEMPLATE', index);
-    context.commit('SET_ITEM_PROPERTY', {
-      prop: '_dirty',
-      value: true,
-    });
-  },
-}
-
-const mutations = {
-  ADD_TEMPLATE: (state, pair) => {
-    state.itemInstance.times.push(pair);
-  },
-  SET_TEMPLATE: (state, { index, prop, value }) => {
-    state.itemInstance.times[index][prop] = value;
-  },
-  DELETE_TEMPLATE: (state, index) => {
-    state.itemInstance.times.splice(index, 1);
-  },
-};
-
 const shiftTemplates = new ObjectStoreModule({ resettableState, headers })
 .attachAPIModule(ShiftTemplatesAPI)
 .generateAPIActions()
-.getModule({ actions, mutations });
+.getModule();
 
 export default shiftTemplates;