diff --git a/src/assets/styles/bmc/custom/_forms.scss b/src/assets/styles/bmc/custom/_forms.scss
index 07851dcd4f..d70a7df0a8 100644
--- a/src/assets/styles/bmc/custom/_forms.scss
+++ b/src/assets/styles/bmc/custom/_forms.scss
@@ -127,7 +127,7 @@ div[role='group'] {
   .form-check-input[disabled='disabled'],
   .form-check-input:disabled {
     background-color: $gray-200;
-    opacity: 1;
+    opacity: 0.5;
     & + .form-check-label {
       // Disabled label for checkbox, radio,
       // switch bootstrap form components
diff --git a/src/router/routes.js b/src/router/routes.js
index a1c6c94a07..c45a58d08a 100644
--- a/src/router/routes.js
+++ b/src/router/routes.js
@@ -26,6 +26,7 @@ import Firmware from '@/views/Operations/Firmware';
 import Certificates from '@/views/SecurityAndAccess/Certificates';
 import Inventory from '../views/HardwareStatus/Inventory/Inventory.vue';
 import SystemParameters from '@/views/ResourceManagement/SystemParameters';
+import HardwareDeconfiguration from '../views/Settings/HardwareDeconfiguration/HardwareDeconfiguration.vue';
 
 const roles = {
   administrator: 'Administrator',
@@ -175,6 +176,14 @@ export const routes = [
           title: i18n.global.t('appPageTitle.powerRestorePolicy'),
         },
       },
+      {
+        path: '/settings/hardware-deconfiguration',
+        name: 'hardware-deconfiguration',
+        component: HardwareDeconfiguration,
+        meta: {
+          title: i18n.global.t('appPageTitle.deconfigurationHardware'),
+        },
+      },
       {
         path: '/resource-management/power',
         name: 'power',
diff --git a/src/store/index.js b/src/store/index.js
index 700f4ba044..43b746bdb5 100644
--- a/src/store/index.js
+++ b/src/store/index.js
@@ -29,6 +29,7 @@ import SystemParametersStore from './modules/ResourceManagement/SystemParameters
 import CertificatesStore from './modules/SecurityAndAccess/CertificatesStore';
 import UserManagementStore from './modules/SecurityAndAccess/UserManagementStore';
 import PcieTopologyStore from './modules/HardwareStatus/PcieTopologyStore.js';
+import HardwareDeconfigurationStore from './modules/Settings/HardwareDeconfigurationStore';
 // ... (export use other stores)
 export {
   EventLogStore,
@@ -60,5 +61,6 @@ export {
   SystemParametersStore,
   CertificatesStore,
   UserManagementStore,
-  PcieTopologyStore
+  PcieTopologyStore,
+  HardwareDeconfigurationStore,
 };
diff --git a/src/store/modules/GlobalStore.js b/src/store/modules/GlobalStore.js
index 1b72180b4a..37a7961e80 100644
--- a/src/store/modules/GlobalStore.js
+++ b/src/store/modules/GlobalStore.js
@@ -63,6 +63,8 @@ export const GlobalStore = defineStore('global', {
     currentUserGetter: (state) => state.currentUser,
     isServiceUser: (state) =>
       state.currentUser?.RoleId === 'OemIBMServiceAgent' || !state.currentUser,
+    isReadOnlyUserGetter: (state) =>
+      state.currentUser?.RoleId === 'ReadOnly' || !state.currentUser,
   },
   actions: {
     async getBmcTime() {
diff --git a/src/store/modules/Settings/HardwareDeconfigurationStore.js b/src/store/modules/Settings/HardwareDeconfigurationStore.js
index 2746158fc9..f32d825f1c 100644
--- a/src/store/modules/Settings/HardwareDeconfigurationStore.js
+++ b/src/store/modules/Settings/HardwareDeconfigurationStore.js
@@ -1,222 +1,162 @@
 import api from '@/store/api';
 import i18n from '@/i18n';
 import { REGEX_MAPPINGS } from '@/utilities/GlobalConstants';
+import { defineStore } from 'pinia';
 
-const HardwareDeconfigurationStore = {
-  namespaced: true,
-  state: {
+export const HardwareDeconfigurationStore = defineStore('hardwareDeconfiguration', {
+  state: () => ({
     dimms: [],
     cores: [],
-  },
+  }),
   getters: {
-    dimms: (state) => state.dimms,
-    cores: (state) => state.cores,
-  },
-  mutations: {
-    setDimms: (state, dimms) => (state.dimms = dimms),
-    setCores: (state, cores) => (state.cores = cores),
+    dimmsGetter: (state) => state.dimms,
+    coresGetter: (state) => state.cores,
   },
+
   actions: {
     async getProcessorsCollection() {
       return await api
-        .get('/redfish/v1/Systems/system/Processors')
-        .then(({ data: { Members } }) =>
-          Members.map((member) => member['@odata.id']),
-        )
+        .get('/redfish/v1/Systems/system/Processors?$expand=.($levels=2)')
+        .then(({ data: { Members } }) => Members)
         .catch((error) => console.log(error));
     },
-    async getProcessors({ commit, dispatch }) {
-      const collection = await dispatch('getProcessorsCollection');
+    async getProcessors() {
+      let totalCores = [];
+      const collection = await this.getProcessorsCollection();
       if (!collection) return;
-      await api
-        .all(collection.map((processor) => dispatch('getCores', processor)))
-        .then((response) => {
-          var totalCores = [].concat.apply([], response);
-          commit('setCores', totalCores);
-        });
+      collection.map((processor) =>
+        this.getCores(processor).then((response) => {
+          totalCores = [].concat.apply(totalCores, response);
+          this.cores = totalCores;
+        })
+      );
     },
-
-    async getCores(_, id) {
-      const locationCode = await api
-        .get(`${id}`)
-        .then((response) => response.data.Location.PartLocation.ServiceLabel)
-        .catch((error) => console.log(error));
-      const procId = await api
-        .get(`${id}`)
-        .then((response) => response.data.Id)
-        .catch((error) => console.log(error));
+    async getCores(processor) {
+      const locationCode = processor.Location.PartLocation.ServiceLabel;
+      const procId = processor.Id;
       const cores = await api
-        .get(`${id}/SubProcessors`)
-        .then((response) => response.data.Members)
-        .catch((error) => console.log(error));
+        .get(`${processor['@odata.id']}/SubProcessors?$expand=.($levels=2)`)
+        .then((response) => response.data.Members);
       if (!cores) return;
-      const promises = cores.map((core) => {
-        return api.get(core['@odata.id']).catch((error) => {
-          console.log(error);
-          return error;
-        });
+      const coreData = cores.map((data) => {
+        var msgArgs = 'None';
+        var eventId = '';
+        const conditionsArray = data.Status?.Conditions;
+        if (Array.isArray(conditionsArray) && conditionsArray.length) {
+          const messageArgsArray = conditionsArray[0].MessageArgs;
+          if (Array.isArray(messageArgsArray) && messageArgsArray.length) {
+            msgArgs = messageArgsArray[0];
+          }
+          const logEntry = conditionsArray[0].LogEntry;
+          if (logEntry) {
+            const eventIdUrl = logEntry['@odata.id'];
+            const splitUrl = eventIdUrl.split('/');
+            eventId = splitUrl[splitUrl.length - 1];
+          }
+        }
+        return {
+          name: data.Name,
+          status: data.Status.Health,
+          id: data.Id,
+          location: locationCode,
+          functionalState: data.Status?.Health,
+          settings: data.Enabled,
+          uri: data['@odata.id'],
+          deconfigurationType:
+            msgArgs === 'By Association'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.byAssociation')
+              : msgArgs === 'Error'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.error')
+              : msgArgs === 'Fatal'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.fatal')
+              : msgArgs === 'FCO-Deconfigured'
+              ? i18n.global.t(
+                  'pageDeconfigurationHardware.table.filter.fcoDeconfigured'
+                )
+              : msgArgs === 'Invalid'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.invalid')
+              : msgArgs === 'Manual'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.manual')
+              : msgArgs === 'None'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.none')
+              : msgArgs === 'Predictive'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.predictive')
+              : msgArgs === 'Recovered'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.recovered')
+              : msgArgs === 'Unknown'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.unknown')
+              : msgArgs,
+          processorId: procId,
+          eventID: eventId,
+        };
       });
-      return await api.all(promises).then(
-        api.spread((...responses) => {
-          const coreData = responses.map(({ data }) => {
-            var msgArgs = 'None';
-            var eventId = '';
-            const conditionsArray = data.Status?.Conditions;
-            if (Array.isArray(conditionsArray) && conditionsArray.length) {
-              const messageArgsArray = conditionsArray[0].MessageArgs;
-              if (Array.isArray(messageArgsArray) && messageArgsArray.length) {
-                msgArgs = messageArgsArray[0];
-              }
-              const logEntry = conditionsArray[0].LogEntry;
-              if (logEntry) {
-                const eventIdUrl = logEntry['@odata.id'];
-                const splitUrl = eventIdUrl.split('/');
-                eventId = splitUrl[splitUrl.length - 1];
-              }
-            }
-            return {
-              name: data.Name,
-              status: data.Status.Health,
-              id: data.Id,
-              location: locationCode,
-              functionalState: data.Status?.Health,
-              settings: data.Enabled,
-              uri: data['@odata.id'],
-              deconfigurationType:
-                msgArgs === 'By Association'
-                  ? i18n.t(
-                      'pageDeconfigurationHardware.table.filter.byAssociation',
-                    )
-                  : msgArgs === 'Error'
-                    ? i18n.t('pageDeconfigurationHardware.table.filter.error')
-                    : msgArgs === 'Fatal'
-                      ? i18n.t('pageDeconfigurationHardware.table.filter.fatal')
-                      : msgArgs === 'FCO-Deconfigured'
-                        ? i18n.t(
-                            'pageDeconfigurationHardware.table.filter.fcoDeconfigured',
-                          )
-                        : msgArgs === 'Invalid'
-                          ? i18n.t(
-                              'pageDeconfigurationHardware.table.filter.invalid',
-                            )
-                          : msgArgs === 'Manual'
-                            ? i18n.t(
-                                'pageDeconfigurationHardware.table.filter.manual',
-                              )
-                            : msgArgs === 'None'
-                              ? i18n.t(
-                                  'pageDeconfigurationHardware.table.filter.none',
-                                )
-                              : msgArgs === 'Predictive'
-                                ? i18n.t(
-                                    'pageDeconfigurationHardware.table.filter.predictive',
-                                  )
-                                : msgArgs === 'Recovered'
-                                  ? i18n.t(
-                                      'pageDeconfigurationHardware.table.filter.recovered',
-                                    )
-                                  : msgArgs === 'Unknown'
-                                    ? i18n.t(
-                                        'pageDeconfigurationHardware.table.filter.unknown',
-                                      )
-                                    : msgArgs,
-              processorId: procId,
-              eventID: eventId,
-            };
-          });
-          return coreData;
-        }),
-      );
+      return coreData;
     },
 
-    async getDimms({ commit }) {
+    async getDimms() {
       const dimms = await api
-        .get('/redfish/v1/Systems/system/Memory')
+        .get('/redfish/v1/Systems/system/Memory?$expand=.($levels=2)')
         .then((response) => response.data.Members)
         .catch((error) => console.log(error));
       if (!dimms) return;
-      const promises = dimms.map((dimm) => {
-        return api.get(dimm['@odata.id']).catch((error) => {
-          console.log(error);
-          return error;
-        });
+      const dimmsData = dimms.map((data) => {
+        var msgArgs = 'None';
+        var eventId = '';
+        const conditionsArray = data.Status?.Conditions;
+        if (Array.isArray(conditionsArray) && conditionsArray.length) {
+          const messageArgsArray = conditionsArray[0].MessageArgs;
+          if (Array.isArray(messageArgsArray) && messageArgsArray.length) {
+            msgArgs = messageArgsArray[0];
+          }
+          const logEntry = conditionsArray[0].LogEntry;
+          if (logEntry) {
+            const eventIdUrl = logEntry['@odata.id'];
+            const splitUrl = eventIdUrl.split('/');
+            eventId = splitUrl[splitUrl.length - 1];
+          }
+        }
+        return {
+          id: data.Id,
+          name: data.Name,
+          functionalState: data.Status?.Health,
+          size: data.CapacityMiB,
+          locationCode: data.Location?.PartLocation?.ServiceLabel,
+          deconfigurationType:
+            msgArgs === 'By Association'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.byAssociation')
+              : msgArgs === 'Error'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.error')
+              : msgArgs === 'Fatal'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.fatal')
+              : msgArgs === 'FCO-Deconfigured'
+              ? i18n.global.t(
+                  'pageDeconfigurationHardware.table.filter.fcoDeconfigured'
+                )
+              : msgArgs === 'Invalid'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.invalid')
+              : msgArgs === 'Manual'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.manual')
+              : msgArgs === 'None'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.none')
+              : msgArgs === 'Predictive'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.predictive')
+              : msgArgs === 'Recovered'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.recovered')
+              : msgArgs === 'Unknown'
+              ? i18n.global.t('pageDeconfigurationHardware.table.filter.unknown')
+              : msgArgs,
+          settings: data.Enabled,
+          uri: data['@odata.id'],
+          available: data.Status?.State,
+          eventID: eventId,
+        };
       });
-      return await api.all(promises).then(
-        api.spread((...responses) => {
-          const dimmsData = responses.map(({ data }) => {
-            var msgArgs = 'None';
-            var eventId = '';
-            const conditionsArray = data.Status?.Conditions;
-            if (Array.isArray(conditionsArray) && conditionsArray.length) {
-              const messageArgsArray = conditionsArray[0].MessageArgs;
-              if (Array.isArray(messageArgsArray) && messageArgsArray.length) {
-                msgArgs = messageArgsArray[0];
-              }
-              const logEntry = conditionsArray[0].LogEntry;
-              if (logEntry) {
-                const eventIdUrl = logEntry['@odata.id'];
-                const splitUrl = eventIdUrl.split('/');
-                eventId = splitUrl[splitUrl.length - 1];
-              }
-            }
-            return {
-              id: data.Id,
-              name: data.Name,
-              functionalState: data.Status?.Health,
-              size: data.CapacityMiB,
-              locationCode: data.Location?.PartLocation?.ServiceLabel,
-              deconfigurationType:
-                msgArgs === 'By Association'
-                  ? i18n.t(
-                      'pageDeconfigurationHardware.table.filter.byAssociation',
-                    )
-                  : msgArgs === 'Error'
-                    ? i18n.t('pageDeconfigurationHardware.table.filter.error')
-                    : msgArgs === 'Fatal'
-                      ? i18n.t('pageDeconfigurationHardware.table.filter.fatal')
-                      : msgArgs === 'FCO-Deconfigured'
-                        ? i18n.t(
-                            'pageDeconfigurationHardware.table.filter.fcoDeconfigured',
-                          )
-                        : msgArgs === 'Invalid'
-                          ? i18n.t(
-                              'pageDeconfigurationHardware.table.filter.invalid',
-                            )
-                          : msgArgs === 'Manual'
-                            ? i18n.t(
-                                'pageDeconfigurationHardware.table.filter.manual',
-                              )
-                            : msgArgs === 'None'
-                              ? i18n.t(
-                                  'pageDeconfigurationHardware.table.filter.none',
-                                )
-                              : msgArgs === 'Predictive'
-                                ? i18n.t(
-                                    'pageDeconfigurationHardware.table.filter.predictive',
-                                  )
-                                : msgArgs === 'Recovered'
-                                  ? i18n.t(
-                                      'pageDeconfigurationHardware.table.filter.recovered',
-                                    )
-                                  : msgArgs === 'Unknown'
-                                    ? i18n.t(
-                                        'pageDeconfigurationHardware.table.filter.unknown',
-                                      )
-                                    : msgArgs,
-              settings: data.Enabled,
-              uri: data['@odata.id'],
-              available: data.Status?.State,
-              eventID: eventId,
-            };
-          });
-          const dimmsDataFiltered = dimmsData.filter(
-            (item) => item.available !== 'Absent',
-          );
-          commit('setDimms', dimmsDataFiltered);
-        }),
+      const dimmsDataFiltered = dimmsData.filter(
+        (item) => item.available !== 'Absent'
       );
+      this.dimms = dimmsDataFiltered;
     },
-    async updateSettingsState(_, settingsState) {
+    async updateSettingsState(settingsState) {
       const uri = settingsState.uri;
       const updatedSettingsValue = {
         Enabled: settingsState.settings,
@@ -228,20 +168,20 @@ const HardwareDeconfigurationStore = {
 
         if (REGEX_MAPPINGS.resourceCannotBeDeleted.test(messageId)) {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.deleteReqFailed'),
+            i18n.global.t('pageDeconfigurationHardware.toast.deleteReqFailed')
           );
         } else if (settingsState.settings) {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.errorEnablingSetting'),
+            i18n.global.t('pageDeconfigurationHardware.toast.errorEnablingSetting')
           );
         } else {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.errorDisablingSetting'),
+            i18n.global.t('pageDeconfigurationHardware.toast.errorDisablingSetting')
           );
         }
       });
     },
-    async updateCoresSettingsState(_, settingsState) {
+    async updateCoresSettingsState(settingsState) {
       const uri = settingsState.uri;
       const updatedSettingsValue = {
         Enabled: settingsState.settings,
@@ -253,20 +193,20 @@ const HardwareDeconfigurationStore = {
 
         if (REGEX_MAPPINGS.resourceCannotBeDeleted.test(messageId)) {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.deleteReqFailed'),
+            i18n.global.t('pageDeconfigurationHardware.toast.deleteReqFailed')
           );
         } else if (settingsState.settings) {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.errorEnablingSetting'),
+            i18n.global.t('pageDeconfigurationHardware.toast.errorEnablingSetting')
           );
         } else {
           throw new Error(
-            i18n.t('pageDeconfigurationHardware.toast.errorDisablingSetting'),
+            i18n.global.t('pageDeconfigurationHardware.toast.errorDisablingSetting')
           );
         }
       });
     },
   },
-};
+});
 
 export default HardwareDeconfigurationStore;
diff --git a/src/views/Settings/HardwareDeconfiguration/HardwareDeconfiguration.vue b/src/views/Settings/HardwareDeconfiguration/HardwareDeconfiguration.vue
index f6ae798937..f8c4228d61 100644
--- a/src/views/Settings/HardwareDeconfiguration/HardwareDeconfiguration.vue
+++ b/src/views/Settings/HardwareDeconfiguration/HardwareDeconfiguration.vue
@@ -1,23 +1,23 @@
 <template>
-  <b-container fluid="xl">
+  <BContainer fluid="xl">
     <page-title
       :title="$t('appPageTitle.deconfigurationHardware')"
       :description="$t('pageDeconfigurationHardware.description')"
       :link="$t('pageDeconfigurationHardware.link')"
       to="/logs/deconfiguration-records"
     />
-    <b-row>
-      <b-col md="8" xl="6">
+    <BRow>
+      <BCol md="8" xl="6">
         <alert variant="info" class="mb-4">
           <div>
             {{ $t('pageDeconfigurationHardware.alert.message') }}
           </div>
         </alert>
-      </b-col>
-    </b-row>
+      </BCol>
+    </BRow>
     <page-section>
-      <b-row>
-        <b-col>
+      <BRow>
+        <BCol>
           <b-card no-body>
             <b-tabs content-class="mt-3" fill>
               <b-tab :title="$t('pageDeconfigurationHardware.memoryDimms')">
@@ -28,32 +28,28 @@
               </b-tab>
             </b-tabs>
           </b-card>
-        </b-col>
-      </b-row>
+        </BCol>
+      </BRow>
     </page-section>
-  </b-container>
+  </BContainer>
 </template>
 
-<script>
-import PageTitle from '@/components/Global/PageTitle';
-import PageSection from '@/components/Global/PageSection';
-import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
-import Alert from '@/components/Global/Alert';
-import VuelidateMixin from '@/components/Mixins/VuelidateMixin.js';
-import BVToastMixin from '@/components/Mixins/BVToastMixin';
+<script setup>
+import PageTitle from '@/components/Global/PageTitle.vue';
+import PageSection from '@/components/Global/PageSection.vue';
+import useLoadingBar from '@/components/Composables/useLoadingBarComposable';
+import Alert from '@/components/Global/Alert.vue';
 import ProcessorCores from './ProcessorCores.vue';
 import MemoryDimms from './MemoryDimms.vue';
+import { onBeforeMount } from 'vue';
+import { onBeforeRouteLeave } from 'vue-router';
+const { startLoader, hideLoader } = useLoadingBar();
+
+onBeforeRouteLeave(() => {
+  hideLoader();
+});
+onBeforeMount(() =>  {
+  startLoader();
+});
 
-export default {
-  name: 'HardwareDeconfiguration',
-  components: { Alert, PageTitle, MemoryDimms, ProcessorCores, PageSection },
-  mixins: [VuelidateMixin, BVToastMixin, LoadingBarMixin],
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
-  created() {
-    this.startLoader();
-  },
-};
 </script>
diff --git a/src/views/Settings/HardwareDeconfiguration/MemoryDimms.vue b/src/views/Settings/HardwareDeconfiguration/MemoryDimms.vue
index 50d5816957..d467571f22 100644
--- a/src/views/Settings/HardwareDeconfiguration/MemoryDimms.vue
+++ b/src/views/Settings/HardwareDeconfiguration/MemoryDimms.vue
@@ -1,26 +1,27 @@
 <template>
-  <b-container fluid="xl">
-    <b-row class="align-items-end">
-      <b-col sm="12" class="text-right">
+  <BContainer fluid="xl">
+    <BRow class="align-items-end">
+      <BCol sm="12" class="text-right">
         <table-filter :filters="tableFilters" @filter-change="onFilterChange" />
-      </b-col>
-    </b-row>
-    <b-row>
-      <b-col xl="12">
-        <b-table
-          ref="table"
+      </BCol>
+    </BRow>
+    <BRow>
+      <BCol xl="12">
+        <BTable
+          ref="tableHardwareDeconfigurationRef"
           responsive="xl"
           no-select-on-click
           sort-icon-left
           hover
           no-sort-reset
-          sort-by="status"
+          :sort-by="[{ key: 'status', order: 'asc' }]"
           show-empty
+          sticky-header="75vh"
           :no-border-collapse="true"
           :items="filteredDimms"
           :fields="fields"
-          :per-page="perPage"
-          :current-page="currentPage"
+          :per-page="itemPerPage"
+          :current-page="currentPageNo"
           :filter="searchFilter"
           :empty-text="$t('global.table.emptyMessage')"
           :empty-filtered-text="$t('global.table.emptySearchMessage')"
@@ -36,7 +37,7 @@
             </div>
           </template>
           <template #cell(settings)="row">
-            <b-form-checkbox
+            <BFormCheckbox
               v-model="row.item.settings"
               name="switch"
               switch
@@ -49,14 +50,14 @@
               <span v-else>{{
                 $t('pageDeconfigurationHardware.deconfigure')
               }}</span>
-            </b-form-checkbox>
+            </BFormCheckbox>
           </template>
-        </b-table>
-      </b-col>
-    </b-row>
+        </BTable>
+      </BCol>
+    </BRow>
     <!-- Table pagination -->
-    <b-row>
-      <b-col sm="6">
+    <BRow>
+      <BCol sm="6">
         <b-form-group
           class="table-pagination-select"
           :label="$t('global.table.itemsPerPage')"
@@ -64,197 +65,167 @@
         >
           <b-form-select
             id="pagination-items-per-page"
-            v-model="perPage"
+            v-model="itemPerPage"
             :options="itemsPerPageOptions"
           />
         </b-form-group>
-      </b-col>
-      <b-col sm="6">
+      </BCol>
+      <BCol sm="6">
         <b-pagination
-          v-model="currentPage"
+          v-model="currentPageNo"
+          class="b-pagination"
           first-number
           last-number
-          :per-page="perPage"
-          :total-rows="getTotalRowCount(filteredRows)"
+          :per-page="itemPerPage"
+          :total-rows="getTotalRowCount(filteredRows, itemPerPage)"
           aria-controls="hardware-deconfiguration"
         />
-      </b-col>
-    </b-row>
-  </b-container>
+      </BCol>
+    </BRow>
+  </BContainer>
 </template>
 
-<script>
-import TableFilter from '@/components/Global/TableFilter';
-import BVToastMixin from '@/components/Mixins/BVToastMixin';
-import BVPaginationMixin, {
-  currentPage,
-  perPage,
-  itemsPerPageOptions,
-} from '@/components/Mixins/BVPaginationMixin';
-import BVTableSelectableMixin, {
-  selectedRows,
-  tableHeaderCheckboxModel,
-  tableHeaderCheckboxIndeterminate,
-} from '@/components/Mixins/BVTableSelectableMixin';
-import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
-import TableFilterMixin from '@/components/Mixins/TableFilterMixin';
-import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
-import TableSortMixin from '@/components/Mixins/TableSortMixin';
-import SearchFilterMixin, {
-  searchFilter,
-} from '@/components/Mixins/SearchFilterMixin';
-export default {
-  name: 'MemoryDimms',
-  components: {
-    TableFilter,
-  },
-  mixins: [
-    BVPaginationMixin,
-    TableFilterMixin,
-    BVTableSelectableMixin,
-    LoadingBarMixin,
-    DataFormatterMixin,
-    TableSortMixin,
-    SearchFilterMixin,
-    BVToastMixin,
-  ],
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
-  data() {
-    return {
-      isBusy: true,
-      allData: [],
-      fields: [
+<script setup>
+import { ref, computed, onBeforeMount } from 'vue';
+import i18n from '@/i18n';
+import { onBeforeRouteLeave } from 'vue-router';
+import TableFilter from '@/components/Global/TableFilter.vue';
+import useToastComposable from '@/components/Composables/useToastComposable';
+import usePaginationComposable from '@/components/Composables/usePaginationComposable';
+import useLoadingBar from '@/components/Composables/useLoadingBarComposable';
+import useTableFilterComposable from '@/components/Composables/useTableFilterComposable';
+import { HardwareDeconfigurationStore, GlobalStore } from '@/store';
+
+const Toast = useToastComposable();
+const { currentPage, perPage, itemsPerPageOptions, getTotalRowCount } =
+  usePaginationComposable();
+const { hideLoader, startLoader, endLoader } = useLoadingBar();
+const { getFilteredTableData } = useTableFilterComposable();
+const hardwareDeconfigurationStore = HardwareDeconfigurationStore();
+const global = GlobalStore();
+
+onBeforeRouteLeave(() => {
+  hideLoader();
+});
+
+const isBusy = ref(true);
+const activeFiltersRows = ref([]);
+const currentPageNo = ref(currentPage);
+const itemPerPage = ref(perPage);
+const searchFilter = ref('');
+const searchTotalFilteredRows = ref(0);
+const fields = ref([
         {
           key: 'name',
           sortable: true,
-          label: this.$t('pageDeconfigurationHardware.table.name'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.name'),
         },
         {
           key: 'size',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.size'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.size'),
         },
         {
           key: 'locationCode',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.locationCode'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.locationCode'),
         },
         {
           key: 'functionalState',
           sortable: true,
-          label: this.$t('pageDeconfigurationHardware.table.functionalState'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.functionalState'),
           tdClass: 'text-nowrap',
         },
         {
           key: 'eventID',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.eventId'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.eventId'),
         },
         {
           key: 'deconfigurationType',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t(
+          label: i18n.global.t(
             'pageDeconfigurationHardware.table.deconfigurationType',
           ),
         },
         {
           key: 'settings',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.settings'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.settings'),
         },
-      ],
-      tableFilters: [
+      ]);
+const tableFilters = ref([
         {
           key: 'deconfigurationType',
-          label: this.$t(
+          label: i18n.global.t(
             'pageDeconfigurationHardware.table.deconfigurationType',
           ),
           values: [
-            this.$t('pageDeconfigurationHardware.table.filter.byAssociation'),
-            this.$t('pageDeconfigurationHardware.table.filter.error'),
-            this.$t('pageDeconfigurationHardware.table.filter.fatal'),
-            this.$t('pageDeconfigurationHardware.table.filter.fcoDeconfigured'),
-            this.$t('pageDeconfigurationHardware.table.filter.invalid'),
-            this.$t('pageDeconfigurationHardware.table.filter.manual'),
-            this.$t('pageDeconfigurationHardware.table.filter.none'),
-            this.$t('pageDeconfigurationHardware.table.filter.predictive'),
-            this.$t('pageDeconfigurationHardware.table.filter.recovered'),
-            this.$t('pageDeconfigurationHardware.table.filter.unknown'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.byAssociation'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.error'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.fatal'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.fcoDeconfigured'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.invalid'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.manual'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.none'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.predictive'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.recovered'),
+            i18n.global.t('pageDeconfigurationHardware.table.filter.unknown'),
           ],
         },
-      ],
-      activeFilters: [],
-      currentPage: currentPage,
-      itemsPerPageOptions: itemsPerPageOptions,
-      perPage: perPage,
-      searchFilter: searchFilter,
-      searchTotalFilteredRows: 0,
-      selectedRows: selectedRows,
-      tableHeaderCheckboxModel: tableHeaderCheckboxModel,
-      tableHeaderCheckboxIndeterminate: tableHeaderCheckboxIndeterminate,
-    };
-  },
-  computed: {
-    allDimms() {
-      return this.$store.getters['hardwareDeconfiguration/dimms'];
-    },
-    filteredRows() {
-      return this.searchFilter
-        ? this.searchTotalFilteredRows
-        : this.filteredDimms.length;
-    },
-    filteredDimms() {
-      return this.getFilteredTableData(this.allDimms, this.activeFilters);
-    },
-    serverStatus() {
-      return this.$store.getters['global/serverStatus'];
-    },
-    isServerOff() {
-      return this.serverStatus === 'off' ? true : false;
-    },
-    isReadOnlyUser() {
-      return this.$store.getters['global/isReadOnlyUser'];
-    },
-  },
-  created() {
-    this.startLoader();
-    this.$store.dispatch('hardwareDeconfiguration/getDimms').finally(() => {
-      this.endLoader();
-      this.isBusy = false;
+      ]);
+
+const allDimms = computed(() => {
+      return hardwareDeconfigurationStore.dimmsGetter;
+    })
+const filteredRows = computed(() => {
+      return searchFilter.value
+        ? searchTotalFilteredRows.value
+        : filteredDimms.value.length;
+    });
+const filteredDimms = computed(() => {
+      return getFilteredTableData(allDimms.value, activeFiltersRows.value);
+    });
+const serverStatus = computed(() => {
+      return global.serverStatusGetter;
     });
-  },
-  methods: {
-    onFilterChange({ activeFilters }) {
-      this.activeFilters = activeFilters;
-    },
-    onFiltered(filteredItems) {
-      this.searchTotalFilteredRows = filteredItems.length;
-    },
-    toggleSettingsSwitch(row) {
-      this.startLoader();
-      this.isBusy = true;
-      this.$store
-        .dispatch('hardwareDeconfiguration/updateSettingsState', {
+const isServerOff = computed(() => {
+      return serverStatus.value === 'off' ? true : false;
+    });
+const isReadOnlyUser = computed(() => {
+      return global.isReadOnlyUserGetter;
+    });
+
+onBeforeMount(() => {
+    startLoader();
+    hardwareDeconfigurationStore.getDimms().finally(() => {
+      endLoader();
+      isBusy.value = false;
+    });
+  });
+const onFilterChange = ({ activeFilters }) => {
+    activeFiltersRows.value = activeFilters;
+    };
+const onFiltered = (filteredItems) => {
+      searchTotalFilteredRows.value = filteredItems.length;
+    };
+const toggleSettingsSwitch = (row) => {
+      startLoader();
+      hardwareDeconfigurationStore.updateSettingsState({
           uri: row.item.uri,
           settings: row.item.settings,
         })
         .catch(({ message }) => {
           row.item.settings = !row.item.settings;
-          this.errorToast(message);
+          Toast.errorToast(message);
         })
         .finally(() => {
-          this.endLoader();
-          this.isBusy = false;
+          endLoader();
         });
-    },
-  },
-};
-</script>
+    };
+ </script>
+ <style lang="scss" scoped>
+ .text-right {
+   text-align: right;
+ }
+ </style>
\ No newline at end of file
diff --git a/src/views/Settings/HardwareDeconfiguration/ProcessorCores.vue b/src/views/Settings/HardwareDeconfiguration/ProcessorCores.vue
index 567a796d37..dde6b3bf54 100644
--- a/src/views/Settings/HardwareDeconfiguration/ProcessorCores.vue
+++ b/src/views/Settings/HardwareDeconfiguration/ProcessorCores.vue
@@ -1,39 +1,40 @@
 <template>
-  <b-container fluid="xl">
-    <b-row class="align-items-end">
-      <b-col sm="12" class="text-right">
+  <BContainer fluid="xl">
+    <BRow class="align-items-end">
+      <BCol sm="12" class="text-right">
         <table-filter :filters="tableFilters" @filter-change="onFilterChange" />
-      </b-col>
-    </b-row>
-    <b-row>
-      <b-col xl="12">
+      </BCol>
+    </BRow>
+    <BRow>
+      <BCol xl="12">
         <table-toolbar
           ref="toolbar"
-          :selected-items-count="selectedRows.length"
-          @clear-selected="clearSelectedRows($refs.table)"
+          :selected-items-count="selectedRowsLists.length"
+          @clear-selected="clearSelectedRows(tableHardwareDeconfigurationRef)"
         >
           <template #toolbar-buttons>
             <table-toolbar-export
-              :data="selectedRows"
+              :data="selectedRowsLists"
               :file-name="exportFileNameByDate()"
             />
           </template>
         </table-toolbar>
         <b-table
-          ref="table"
+          ref="tableHardwareDeconfigurationRef"
           responsive="md"
           no-select-on-click
           sort-icon-left
           hover
           no-sort-reset
-          sort-by="status"
+          :sort-by="[{ key: 'status', order: 'asc' }]"
           show-empty
+          sticky-header="75vh"
           :no-border-collapse="true"
           :items="filteredCores"
           :fields="fields"
-          :per-page="perPage"
-          :current-page="currentPage"
-          :filter="searchFilter"
+          :per-page="itemPerPage"
+          :current-page="currentPageNo"
+          :filter="searchFilterInput"
           :empty-text="$t('global.table.emptyMessage')"
           :empty-filtered-text="$t('global.table.emptySearchMessage')"
           :busy="isBusy"
@@ -49,7 +50,7 @@
             </div>
           </template>
           <template #cell(settings)="row">
-            <b-form-checkbox
+            <BFormCheckbox
               v-model="row.item.settings"
               name="switch"
               switch
@@ -62,217 +63,195 @@
               <span v-else>{{
                 $t('pageDeconfigurationHardware.deconfigure')
               }}</span>
-            </b-form-checkbox>
+            </BFormCheckbox>
           </template>
         </b-table>
-      </b-col>
-    </b-row>
+      </BCol>
+    </BRow>
     <!-- Table pagination -->
-    <b-row>
-      <b-col sm="6">
-        <b-form-group
+    <BRow>
+      <BCol sm="6">
+        <BFormGroup
           class="table-pagination-select"
           :label="$t('global.table.itemsPerPage')"
           label-for="pagination-items-per-page"
         >
           <b-form-select
             id="pagination-items-per-page"
-            v-model="perPage"
+            v-model="itemPerPage"
             :options="itemsPerPageOptions"
           />
-        </b-form-group>
-      </b-col>
-      <b-col sm="6">
+        </BFormGroup>
+      </BCol>
+      <BCol sm="6">
         <b-pagination
-          v-model="currentPage"
+          v-model="currentPageNo"
+          class="b-pagination"
           first-number
           last-number
-          :per-page="perPage"
-          :total-rows="getTotalRowCount(filteredRows)"
+          :per-page="itemPerPage"
+          :total-rows="getTotalRowCount(filteredRows, itemPerPage)"
           aria-controls="table-sensors"
         />
-      </b-col>
-    </b-row>
-  </b-container>
+      </BCol>
+    </BRow>
+  </BContainer>
 </template>
 
-<script>
-import TableFilter from '@/components/Global/TableFilter';
-import BVToastMixin from '@/components/Mixins/BVToastMixin';
-import TableToolbar from '@/components/Global/TableToolbar';
-import TableToolbarExport from '@/components/Global/TableToolbarExport';
-import BVPaginationMixin, {
-  currentPage,
-  perPage,
-  itemsPerPageOptions,
-} from '@/components/Mixins/BVPaginationMixin';
-import BVTableSelectableMixin, {
-  selectedRows,
-  tableHeaderCheckboxModel,
-  tableHeaderCheckboxIndeterminate,
-} from '@/components/Mixins/BVTableSelectableMixin';
-import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
-import TableFilterMixin from '@/components/Mixins/TableFilterMixin';
-import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin';
-import TableSortMixin from '@/components/Mixins/TableSortMixin';
-import SearchFilterMixin, {
-  searchFilter,
-} from '@/components/Mixins/SearchFilterMixin';
-export default {
-  name: 'ProcessorCores',
-  components: {
-    TableFilter,
-    TableToolbar,
-    TableToolbarExport,
-  },
-  mixins: [
-    BVPaginationMixin,
-    BVToastMixin,
-    TableFilterMixin,
-    BVTableSelectableMixin,
-    LoadingBarMixin,
-    DataFormatterMixin,
-    TableSortMixin,
-    SearchFilterMixin,
-  ],
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
-  data() {
-    return {
-      isBusy: true,
-      fields: [
+<script setup>
+import { ref, computed, onBeforeMount } from 'vue';
+import i18n from '@/i18n';
+import { onBeforeRouteLeave } from 'vue-router';
+import TableFilter from '@/components/Global/TableFilter.vue';
+import useToastComposable from '@/components/Composables/useToastComposable';
+import TableToolbar from '@/components/Global/TableToolbar.vue';
+import TableToolbarExport from '@/components/Global/TableToolbarExport.vue';
+import usePaginationComposable from '@/components/Composables/usePaginationComposable';
+import useTableSelectableComposable from '@/components/Composables/useTableSelectableComposable';
+import useLoadingBar from '@/components/Composables/useLoadingBarComposable';
+import useTableFilterComposable from '@/components/Composables/useTableFilterComposable';
+import { HardwareDeconfigurationStore, GlobalStore } from '@/store';
+
+const Toast = useToastComposable();
+const { currentPage, perPage, itemsPerPageOptions, getTotalRowCount } =
+  usePaginationComposable();
+const {
+  selectedRowsList,
+  clearSelectedRows,
+  onRowSelected
+  } = useTableSelectableComposable();
+const { hideLoader, startLoader, endLoader } = useLoadingBar();
+const { getFilteredTableData } = useTableFilterComposable();
+const hardwareDeconfigurationStore = HardwareDeconfigurationStore();
+const global = GlobalStore();
+
+onBeforeRouteLeave(() => {
+  hideLoader();
+});
+
+const isBusy = ref(true);
+const tableHardwareDeconfigurationRef = ref(null);
+const selectedRowsLists = ref(selectedRowsList);
+const activeFiltersRows = ref([]);
+const currentPageNo = ref(currentPage);
+const itemPerPage = ref(perPage);
+const searchFilterInput = ref('');
+const searchTotalFilteredRows = ref(0);
+const fields = ref([
         {
           key: 'processorId',
           sortable: true,
-          label: this.$t('pageDeconfigurationHardware.table.id'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.id'),
         },
         {
           key: 'id',
           sortable: true,
-          label: this.$t('pageDeconfigurationHardware.table.name'),
+          label:i18n.global.t('pageDeconfigurationHardware.table.name'),
         },
         {
           key: 'location',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.locationCode'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.locationCode'),
         },
         {
           key: 'functionalState',
           sortable: true,
-          label: this.$t('pageDeconfigurationHardware.table.functionalState'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.functionalState'),
           tdClass: 'text-nowrap',
         },
         {
           key: 'eventID',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.eventId'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.eventId'),
           tdClass: 'text-nowrap',
         },
         {
           key: 'deconfigurationType',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t(
+          label: i18n.global.t(
             'pageDeconfigurationHardware.table.deconfigurationType',
           ),
         },
         {
           key: 'settings',
           sortable: true,
-          formatter: this.dataFormatter,
-          label: this.$t('pageDeconfigurationHardware.table.settings'),
+          label: i18n.global.t('pageDeconfigurationHardware.table.settings'),
         },
-      ],
-      tableFilters: [
+      ]);
+const tableFilters = ref([
         {
           key: 'deconfigurationType',
-          label: this.$t(
+          label: i18n.global.t(
             'pageDeconfigurationHardware.table.deconfigurationType',
           ),
           values: [
-            this.$t('pageDeconfigurationHardware.table.filter.byAssociation'),
-            this.$t('pageDeconfigurationHardware.table.filter.error'),
-            this.$t('pageDeconfigurationHardware.table.filter.fatal'),
-            this.$t('pageDeconfigurationHardware.table.filter.fcoDeconfigured'),
-            this.$t('pageDeconfigurationHardware.table.filter.invalid'),
-            this.$t('pageDeconfigurationHardware.table.filter.manual'),
-            this.$t('pageDeconfigurationHardware.table.filter.none'),
-            this.$t('pageDeconfigurationHardware.table.filter.predictive'),
-            this.$t('pageDeconfigurationHardware.table.filter.recovered'),
-            this.$t('pageDeconfigurationHardware.table.filter.unknown'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.byAssociation'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.error'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.fatal'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.fcoDeconfigured'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.invalid'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.manual'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.none'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.predictive'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.recovered'),
+          i18n.global.t('pageDeconfigurationHardware.table.filter.unknown'),
           ],
         },
-      ],
-      activeFilters: [],
-      currentPage: currentPage,
-      itemsPerPageOptions: itemsPerPageOptions,
-      perPage: perPage,
-      searchFilter: searchFilter,
-      searchTotalFilteredRows: 0,
-      selectedRows: selectedRows,
-      tableHeaderCheckboxModel: tableHeaderCheckboxModel,
-      tableHeaderCheckboxIndeterminate: tableHeaderCheckboxIndeterminate,
-    };
-  },
-  computed: {
-    allCores() {
-      return this.$store.getters['hardwareDeconfiguration/cores'];
-    },
-    filteredRows() {
-      return this.searchFilter
-        ? this.searchTotalFilteredRows
-        : this.filteredCores.length;
-    },
-    filteredCores() {
-      return this.getFilteredTableData(this.allCores, this.activeFilters);
-    },
-    serverStatus() {
-      return this.$store.getters['global/serverStatus'];
-    },
-    isServerOff() {
-      return this.serverStatus === 'off' ? true : false;
-    },
-    isReadOnlyUser() {
-      return this.$store.getters['global/isReadOnlyUser'];
-    },
-  },
-  created() {
-    this.startLoader();
-    this.$store
-      .dispatch('hardwareDeconfiguration/getProcessors')
-      .finally(() => {
-        this.endLoader();
-        this.isBusy = false;
+      ]);
+
+const allCores = computed(() => {
+      return hardwareDeconfigurationStore.coresGetter;
+});
+const filteredRows = computed(() =>  {
+      return searchFilterInput.value
+        ? searchTotalFilteredRows.value
+        : filteredCores.value.length;
+});
+const filteredCores = computed(() => {
+      return getFilteredTableData(allCores.value, activeFiltersRows.value);
+});
+const serverStatus = computed(() =>  {
+      return global.serverStatusGetter;
+});
+const isServerOff = computed(() =>  {
+      return serverStatus.value === 'off' ? true : false;
+});
+const isReadOnlyUser = computed(() =>  {
+      return global.isReadOnlyUserGetter;
+});
+
+onBeforeMount(() =>{
+    startLoader();
+    hardwareDeconfigurationStore.getProcessors()
+    .finally(() => {
+        endLoader();
+        isBusy.value = false;
       });
-  },
-  methods: {
-    onFilterChange({ activeFilters }) {
-      this.activeFilters = activeFilters;
-    },
-    onFiltered(filteredItems) {
-      this.searchTotalFilteredRows = filteredItems.length;
-    },
-    toggleSettingsSwitch(row) {
-      this.startLoader();
-      this.isBusy = true;
-      this.$store
-        .dispatch('hardwareDeconfiguration/updateCoresSettingsState', {
+});
+
+const onFilterChange = ({ activeFilters }) => {
+      activeFiltersRows.value = activeFilters;
+};
+const onFiltered = (filteredItems) => {
+      searchTotalFilteredRows.value = filteredItems.length;
+};
+const toggleSettingsSwitch = (row) => {
+      startLoader();
+      hardwareDeconfigurationStore.updateCoresSettingsState({
           uri: row.item.uri,
           settings: row.item.settings,
         })
         .catch(({ message }) => {
           row.item.settings = !row.item.settings;
-          this.errorToast(message);
+          Toast.errorToast(message);
         })
         .finally(() => {
-          this.endLoader();
-          this.isBusy = false;
+          endLoader();
         });
-    },
-  },
 };
 </script>
+<style lang="scss" scoped>
+.text-right {
+  text-align: right;
+}
+</style>
\ No newline at end of file