refactor: used delete-popup composable and removed delete mixin in pr…

…ogress [WTEL-3606]
webitel · Oct 25, 2023 · 2e6a88a · 2e6a88a
1 parent bd246c1
commit 2e6a88a
Show file tree

Hide file tree

Showing 4 changed files with 48 additions and 17 deletions.
diff --git a/src/app/mixins/baseMixins/baseTableMixin/baseTableMixin.js b/src/app/mixins/baseMixins/baseTableMixin/baseTableMixin.js
@@ -11,7 +11,7 @@ import tableActionsHandlerMixin from './tableActionsMixin';
  */
 export default {
   mixins: [
-    deleteMixin,
+    // deleteMixin,
     itemLinkMixin,
     tableActionsHandlerMixin,
   ],

diff --git a/src/app/mixins/baseMixins/baseTableMixin/deleteMixin/deleteConfirmationMixin.js b/src/app/mixins/baseMixins/baseTableMixin/deleteMixin/deleteConfirmationMixin.js
@@ -15,6 +15,7 @@ export default {
   }),
   methods: {
     askDeleteConfirmation({ deleted, callback }) {
+      console.log('askDeleteConfirmation');
       if (Array.isArray(deleted)) this.deleteConfirmation.deleteCount = deleted.length;
       else this.deleteConfirmation.deleteCount = 1;
       this.deleteConfirmation.isDeleteConfirmationPopup = true;

diff --git a/src/app/mixins/baseMixins/baseTableMixin/deleteMixin/tableDeleteMixin.js b/src/app/mixins/baseMixins/baseTableMixin/deleteMixin/tableDeleteMixin.js
@@ -1,16 +1,16 @@
 import deleteConfirmationMixin from './deleteConfirmationMixin';
 
 export default {
-  mixins: [deleteConfirmationMixin],
+  // mixins: [deleteConfirmationMixin],
   methods: {
-    callDelete(deleted) {
-      if (this.isDeleteConfirmation) {
-        this.askDeleteConfirmation({
-          deleted,
-          callback: this.makeDelete.bind(this, deleted),
-        });
-      } else this.makeDelete(deleted);
-    },
+    // callDelete(deleted) {
+    //   if (this.isDeleteConfirmation) {
+    //     this.askDeleteConfirmation({
+    //       deleted,
+    //       callback: this.makeDelete.bind(this, deleted),
+    //     });
+    //   } else this.makeDelete(deleted);
+    // },
     makeDelete(deleted) {
       return this.dispatchDelete(deleted);
     },

diff --git a/src/modules/contact-center/modules/queues/components/the-queues.vue b/src/modules/contact-center/modules/queues/components/the-queues.vue
@@ -17,9 +17,9 @@
         @close="isQueueSelectPopup = false"
       />
       <delete-confirmation-popup
-        v-show="deleteConfirmation.isDeleteConfirmationPopup"
-        :delete-count="deleteConfirmation.deleteCount"
-        :callback="deleteConfirmation.callback"
+        v-show="isDeleteConfirmationPopup"
+        :delete-count="deleteCount"
+        :callback="deleteCallback"
         @close="closeDelete"
       />
 
@@ -44,7 +44,10 @@
                 v-if="hasDeleteAccess"
                 :class="{'hidden': anySelected}"
                 :selected-count="selectedRows.length"
-                @click="callDelete(selectedRows)"
+                @click="askDeleteConfirmation({
+                  deleted: [selectedRows],
+                  callback: () => deleteData(selectedRows),
+                })"
               />
             </wt-table-actions>
           </div>
@@ -123,7 +126,10 @@
                 v-if="hasDeleteAccess"
                 action="delete"
                 class="table-action"
-                @click="callDelete(item)"
+                @click="askDeleteConfirmation({
+                  deleted: [item],
+                  callback: () => deleteData(item),
+                })"
               />
             </template>
           </wt-table>
@@ -149,17 +155,41 @@ import tableComponentMixin from '../../../../../app/mixins/objectPagesMixins/obj
 import RouteNames from '../../../../../app/router/_internals/RouteNames.enum';
 import QueueTypeProperties from '../lookups/QueueTypeProperties.lookup';
 import QueuePopup from './create-queue-popup.vue';
+import { useDeleteConfirmationPopup } from '@webitel/ui-sdk/src/modules/DeleteConfirmationPopup/composables/useDeleteConfirmationPopup';
+import { useTableStore } from '@webitel/ui-sdk/src/modules/TableStoreModule/composables/useTableStore';
+import DeleteConfirmationPopup
+  from '@webitel/ui-sdk/src/modules/DeleteConfirmationPopup/components/delete-confirmation-popup.vue';
 
 const namespace = 'ccenter/queues';
 
 export default {
   name: 'TheQueues',
-  components: { QueuePopup },
+  components: { QueuePopup, DeleteConfirmationPopup },
   mixins: [tableComponentMixin],
 
   setup() {
     const { dummy } = useDummy({ namespace, showAction: true });
-    return { dummy };
+    const {
+      isVisible: isDeleteConfirmationPopup,
+      deleteCount,
+      deleteCallback,
+
+      askDeleteConfirmation,
+      closeDelete,
+    } = useDeleteConfirmationPopup();
+
+    const { deleteData } = useTableStore(namespace);
+
+    return {
+      dummy,
+      isDeleteConfirmationPopup,
+      deleteCount,
+      deleteCallback,
+
+      askDeleteConfirmation,
+      closeDelete,
+      deleteData,
+    };
   },
   data: () => ({
     namespace,