Implement Field core override

src/assets/styles/bmc/custom/_forms.scss

@@ -135,6 +135,7 @@ div[role='group'] {
       color: $gray-900 !important;
     }
   }
+  margin-bottom: 1rem !important;
 }
 
 .form-check-input:focus ~ .form-check-label::before {
@@ -189,4 +190,4 @@ div[role='group'] {
       inset 0 0 0 3px $primary,
       inset 0 0 0 5px $white;
   }
-}
+}

src/router/routes.js

@@ -34,6 +34,7 @@ import DeconfigurationRecords from '../views/Logs/DeconfigurationRecords/Deconfi
 import ServerPowerOperations from '@/views/Operations/ServerPowerOperations';
 import Ldap from '../views/SecurityAndAccess/Ldap/Ldap.vue';
 import EventLogs from '@/views/Logs/EventLogs';
+import FieldCoreOverride from '@/views/ResourceManagement/FieldCoreOverride';
 
 const roles = {
   administrator: 'Administrator',
@@ -256,6 +257,14 @@ export const routes = [
           title: i18n.global.t('appPageTitle.capacityOnDemand'),
         },
       },
+      {
+        path: '/resource-management/field-core-override',
+        name: 'field-core-override',
+        component: FieldCoreOverride,
+        meta: {
+          title: i18n.global.t('appPageTitle.fieldCoreOverride'),
+        },
+      },
       {
         path: '/resource-management/memory',
         name: 'memory',
@@ -288,14 +297,14 @@ export const routes = [
           title: i18n.global.t('appPageTitle.pageNotFound'),
         },
       },
-        {
-          path: '/security-and-access/ldap',
-          name: 'ldap',
-          component: Ldap,
-          meta: {
-            title: i18n.global.t('appPageTitle.ldap'),
-          },
+      {
+        path: '/security-and-access/ldap',
+        name: 'ldap',
+        component: Ldap,
+        meta: {
+          title: i18n.global.t('appPageTitle.ldap'),
         },
+      },
       {
         path: '/notices',
         name: 'notices',

src/store/index.js

@@ -33,6 +33,7 @@ import HardwareDeconfigurationStore from './modules/Settings/HardwareDeconfigura
 import DeconfigurationRecordsStore from './modules/Logs/DeconfigurationRecordsStore.js';
 import NetworkSettingsStore from './modules/Operations/NetworkSettingsStore.js';
 import LdapStore from './modules/SecurityAndAccess/LdapStore.js';
+import FieldCoreOverrideStore from './modules/ResourceManagement/FieldCoreOverrideStore.js';
 // ... (export use other stores)
 export {
   EventLogStore,
@@ -68,5 +69,6 @@ export {
   HardwareDeconfigurationStore,
   DeconfigurationRecordsStore,
   NetworkSettingsStore,
-  LdapStore
+  LdapStore,
+  FieldCoreOverrideStore,
 };

src/store/modules/ResourceManagement/FieldCoreOverrideStore.js

@@ -1,39 +1,40 @@
 import api from '@/store/api';
 import i18n from '@/i18n';
+import { defineStore } from 'pinia';
 
-const FieldCoreOverrideStore = {
-  namespaced: true,
-  state: {
+const FieldCoreOverrideStore = defineStore('fieldCoreOverride', {
+  state: () => ({
     fieldCoreOverridePending: 0,
     fieldCoreOverrideCurrent: 0,
-  },
+  }),
   getters: {
-    isPending: (state) =>
-      state.fieldCoreOverrideCurrent !== state.fieldCoreOverridePending,
-    configuredCores: (state, getters) =>
-      getters.isPending
+    isPendingGetter(state) {
+      return state.fieldCoreOverrideCurrent !== state.fieldCoreOverridePending;
+    },
+    configuredCoresGetter(state) {
+      return this.isPendingGetter
         ? state.fieldCoreOverridePending
-        : state.fieldCoreOverrideCurrent,
-    isEnabled: (state, getters) =>
-      getters.isPending
+        : state.fieldCoreOverrideCurrent;
+    },
+    isEnabledGetter(state) {
+      return this.isPendingGetter
         ? state.fieldCoreOverridePending > 0
-        : state.fieldCoreOverrideCurrent > 0,
-  },
-  mutations: {
-    setBiosAttributes: (state, data) => {
-      state.fieldCoreOverridePending = data?.hb_field_core_override;
-      state.fieldCoreOverrideCurrent = data?.hb_field_core_override_current;
+        : state.fieldCoreOverrideCurrent > 0;
     },
   },
   actions: {
-    async getBiosAttributes({ commit }) {
+    setBiosAttributes(data) {
+      this.fieldCoreOverridePending = data?.hb_field_core_override;
+      this.fieldCoreOverrideCurrent = data?.hb_field_core_override_current;
+    },
+    async getBiosAttributes() {
       return await api
         .get('/redfish/v1/Systems/system/Bios')
         .then(({ data }) => {
-          commit('setBiosAttributes', data?.Attributes || {});
+          this.setBiosAttributes(data?.Attributes || {});
         });
     },
-    async setFieldCoreOverride({ dispatch }, coreOverride) {
+    async setFieldCoreOverride(coreOverride) {
       const data = {
         Attributes: {
           hb_field_core_override: +coreOverride,
@@ -42,19 +43,21 @@ const FieldCoreOverrideStore = {
       return await api
         .patch('/redfish/v1/Systems/system/Bios/Settings', data)
         .then(() => {
-          dispatch('getBiosAttributes');
-          return i18n.t(
-            'pageFieldCoreOverride.toast.configurationChangeSuccess',
+          this.getBiosAttributes();
+          return i18n.global.t(
+            'pageFieldCoreOverride.toast.configurationChangeSuccess'
           );
         })
         .catch((error) => {
           console.log('Field core override', error);
           throw new Error(
-            i18n.t('pageFieldCoreOverride.toast.configurationChangeError'),
+            i18n.global.t(
+              'pageFieldCoreOverride.toast.configurationChangeError'
+            )
           );
         });
     },
   },
-};
+});
 
 export default FieldCoreOverrideStore;

src/views/ResourceManagement/FieldCoreOverride/FieldCoreOverride.vue

@@ -1,60 +1,53 @@
 <template>
-  <b-container fluid="xl">
+  <BContainer fluid="xl">
     <page-title
       :title="$t('appPageTitle.fieldCoreOverride')"
       :description="$t('pageFieldCoreOverride.pageDescription')"
     />
-    <b-row>
-      <b-col md="8" xl="6">
+    <BRow>
+      <BCol md="8" xl="6">
         <alert variant="info" class="mb-5">
-          <p class="mb-0 font-weight-bold">
+          <p class="mb-0 fw-bold">
             {{ $t('pageFieldCoreOverride.alert.title') }}
           </p>
           <p>
             {{ $t('pageFieldCoreOverride.alert.description') }}
           </p>
         </alert>
-      </b-col>
-    </b-row>
+      </BCol>
+    </BRow>
 
     <current-configuration />
     <change-configuration />
-  </b-container>
+  </BContainer>
 </template>
 
-<script>
-import PageTitle from '@/components/Global/PageTitle';
-import LoadingBarMixin, { loading } from '@/components/Mixins/LoadingBarMixin';
-import Alert from '@/components/Global/Alert';
+<script setup>
+import { onBeforeMount } from 'vue';
+import { onBeforeRouteLeave } from 'vue-router';
+import useLoadingBar from '@/components/Composables/useLoadingBarComposable';
+import PageTitle from '@/components/Global/PageTitle.vue';
+import Alert from '@/components/Global/Alert.vue';
+import { SystemStore, FieldCoreOverrideStore, LicenseStore } from '@/store';
+import CurrentConfiguration from './FieldCoreOverrideInfo.vue';
+import ChangeConfiguration from './FieldCoreOverrideConfiguration.vue';
 
-import FieldCoreOverrideInfo from './FieldCoreOverrideInfo.vue';
-import FieldCoreOverrideConfiguration from './FieldCoreOverrideConfiguration.vue';
+const { startLoader, endLoader, hideLoader } = useLoadingBar();
 
-export default {
-  name: 'FieldCoreOverride',
-  components: {
-    PageTitle,
-    Alert,
-    CurrentConfiguration: FieldCoreOverrideInfo,
-    ChangeConfiguration: FieldCoreOverrideConfiguration,
-  },
-  mixins: [LoadingBarMixin],
-  beforeRouteLeave(to, from, next) {
-    this.hideLoader();
-    next();
-  },
-  data() {
-    return {
-      loading,
-    };
-  },
-  created() {
-    this.startLoader();
-    Promise.all([
-      this.$store.dispatch('licenses/getLicenses'),
-      this.$store.dispatch('system/getSystem'),
-      this.$store.dispatch('fieldCoreOverride/getBiosAttributes'),
-    ]).finally(() => this.endLoader());
-  },
-};
+const systemStore = SystemStore();
+const fieldCoreOverrideStore = FieldCoreOverrideStore();
+const licenseStore = LicenseStore();
+
+onBeforeMount(() => {
+  startLoader();
+  Promise.all([
+    licenseStore.getLicenses(),
+    systemStore.getSystem(),
+    fieldCoreOverrideStore.getBiosAttributes(),
+  ]).finally(() => endLoader());
+});
+
+onBeforeRouteLeave(() => {
+  hideLoader();
+});
 </script>