fix BMC configuration, add global table styles

17 files changed, 117 insertions, 66 deletions

diff --git a/src/assets/styles/bmc/custom/_base.scss b/src/assets/styles/bmc/custom/_base.scss
index 0c3fbd2a..94cbecb5 100644
--- a/src/assets/styles/bmc/custom/_base.scss
+++ b/src/assets/styles/bmc/custom/_base.scss
@@ -127,7 +127,7 @@ h6,
 }
 
 .semi-bold-12px__caps {
-  font-family: 'Inter', sans-serif;
+    font-family: 'Inter', sans-serif;
     font-size: 12px;
     font-style: normal;
     font-weight: 600;
diff --git a/src/assets/styles/bmc/custom/_buttons.scss b/src/assets/styles/bmc/custom/_buttons.scss
index 51e2d073..04a97c21 100644
--- a/src/assets/styles/bmc/custom/_buttons.scss
+++ b/src/assets/styles/bmc/custom/_buttons.scss
@@ -103,7 +103,7 @@
   }
 }
 
-.btn-unstiled {
+.btn-unstyled {
   border: none;
   &:focus {
     box-shadow: none;
diff --git a/src/assets/styles/bmc/custom/_logs.scss b/src/assets/styles/bmc/custom/_logs.scss
index 2a8dcff7..1f6b314b 100644
--- a/src/assets/styles/bmc/custom/_logs.scss
+++ b/src/assets/styles/bmc/custom/_logs.scss
@@ -71,4 +71,8 @@
   box-shadow: 0px -4px 12px rgba(0, 0, 0, 0.06);
   z-index: $zindex-dropdown;
   background-color: $white;
+}
+
+.table-pagination-select {
+  line-height: 1.8rem;
 }
\ No newline at end of file
diff --git a/src/assets/styles/bmc/custom/_tables.scss b/src/assets/styles/bmc/custom/_tables.scss
index 84dc5f99..dc5d5e83 100644
--- a/src/assets/styles/bmc/custom/_tables.scss
+++ b/src/assets/styles/bmc/custom/_tables.scss
@@ -29,15 +29,7 @@
   // thead-light added for specificity
   .thead-light th {
     vertical-align: middle;
-    // border-top: 1px solid gray("300");
     border-bottom: 1px solid gray("300");
-    // &:first-of-type {
-      // border-left: 1px solid gray("300");
-    // }
-    // &:last-of-type {
-      // border-right: 1px solid gray("300");
-    // }
-    // color: theme-color("dark");
     &:focus {
       outline: none;
     }
@@ -319,3 +311,57 @@
   -o-border-radius: 0;
   -khtml-border-radius: 0;
 }
+
+#table-session-logs,
+#user-management-table,
+#certificates-table {
+  -moz-border-radius: 10px;
+  -webkit-border-radius: 10px; 
+  border-radius: 10px; 
+  border: 1px solid rgba(26, 62, 91, 0.3);
+  background-color: none;
+  tr {
+    border-radius: 10px 10px 0 0;
+    -webkit-border-radius: 10px 10px 0 0;
+    -moz-border-radius: 10px 10px 0 0;
+    //fonst-styles
+    font-family: 'Inter', sans-serif;
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 600;
+    line-height: 16px;
+    letter-spacing: 0em;
+    text-align: left;
+    text-transform: uppercase;
+    color: $text-primary;
+  }
+  th {
+    border-top: none;
+    border-bottom: none;
+    border-left: 1px solid rgba(26, 62, 91, 0.3);
+    background-color: $faint-secondary-primary-10 !important;
+    color: $text-primary !important;
+  }
+  th:first-child {
+    border-left: none;
+    border-radius: 10px 0 0 0;
+  }
+  th:last-child {
+    border-left: none;
+    border-radius: 0 10px 0 0;
+  }
+  td {
+    &:hover {
+      background-color: $faint-secondary-primary-2-hover;
+    }
+    //fonst-styles
+    font-family: 'Inter', sans-serif;
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 500;
+    line-height: 20px;
+    letter-spacing: 0em;
+    text-align: left;
+    color: $text-secondary;
+  }
+}
\ No newline at end of file
diff --git a/src/components/Global/SilaComponents/PopoverWithSlot.vue b/src/components/Global/SilaComponents/PopoverWithSlot.vue
index 44fb9640..9a3c1d9d 100644
--- a/src/components/Global/SilaComponents/PopoverWithSlot.vue
+++ b/src/components/Global/SilaComponents/PopoverWithSlot.vue
@@ -4,7 +4,7 @@
     <b-popover
       ref="popover"
       :target="id"
-      triggers="click"
+      triggers="focus"
       :show.sync="popoverShow"
       :placement="placement"
       container="popover-container"
diff --git a/src/components/Global/TableCellCount.vue b/src/components/Global/TableCellCount.vue
index acb4d443..e64475bc 100644
--- a/src/components/Global/TableCellCount.vue
+++ b/src/components/Global/TableCellCount.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="mt-2">
+  <div class="semi-bold-14px">
     <p v-if="!filterActive">
       {{ $t('global.table.items', { count: totalNumberOfCells }) }}
     </p>
diff --git a/src/views/BMC/Configuration/BMCConfiguration.vue b/src/views/BMC/Configuration/BMCConfiguration.vue
index 86f4ac5f..111fa81a 100644
--- a/src/views/BMC/Configuration/BMCConfiguration.vue
+++ b/src/views/BMC/Configuration/BMCConfiguration.vue
@@ -14,7 +14,7 @@
         {{ $t('BMC.BmcTitle') }}
         <component :is="iconChevronUp" class="icon-expand" />
       </b-button>
-      <b-collapse id="toggle-collapse_1" class="nav-item__nav">
+      <b-collapse id="toggle-collapse_1" visible class="nav-item__nav">
         <span class="semi-bold-12px">{{ $t('BMC.BmcTable') }}</span>
         <b-m-c-configuration-table />
         <span class="semi-bold-12px">{{ $t('BMC.Bios') }}</span>
@@ -36,7 +36,7 @@
         {{ $t('BMC.ControlTitle') }}
         <component :is="iconChevronUp" class="icon-expand" />
       </b-button>
-      <b-collapse id="toggle-collapse_2" class="nav-item__nav">
+      <b-collapse id="toggle-collapse_2" visible class="nav-item__nav">
         <b-m-c-configuration-control />
       </b-collapse>
     </div>
@@ -49,6 +49,7 @@ import BMCConfigurationTable from './BMCConfigurationTable';
 import BMCConfigurationControl from './BMCConfigurationControl';
 import PageSection from '@/components/Global/PageSection';
 import iconChevronUp from '@carbon/icons-vue/es/chevron--up/16';
+import LoadingBarMixin from '@/components/Mixins/LoadingBarMixin';
 
 export default {
   components: {
@@ -57,12 +58,20 @@ export default {
     BMCConfigurationTable,
     PageSection,
   },
+  mixins: [LoadingBarMixin],
   data() {
     return {
       text: '',
       iconChevronUp: iconChevronUp,
     };
   },
+  created() {
+    this.startLoader();
+    const bmcManagerTablePromise = new Promise((resolve) => {
+      this.$root.$on('hardware-status-bmc-manager-complete', () => resolve());
+    });
+    Promise.all([bmcManagerTablePromise]).finally(() => this.endLoader());
+  },
 };
 </script>
 <style lang="scss" scoped>
diff --git a/src/views/BMC/Configuration/BMCConfigurationControl.vue b/src/views/BMC/Configuration/BMCConfigurationControl.vue
index 2cc259a7..e75b5f7d 100644
--- a/src/views/BMC/Configuration/BMCConfigurationControl.vue
+++ b/src/views/BMC/Configuration/BMCConfigurationControl.vue
@@ -31,20 +31,12 @@
         <div>
           <span class="semi-bold-12px">{{ $t('BMC.microcode') }}</span>
         </div>
-        <popover
-          id="popover-reactive-3"
-          description="BMC.ReloadMicrocodeBios"
-          popup="BMC.ReloadMicrocodeBios"
-          button="global.action.refresh"
-          :is-microcode="true"
-        />
-        <popover
-          id="popover-reactive-4"
-          description="BMC.ReloadicrocodeBmc"
-          popup="BMC.ReloadicrocodeBmc"
-          button="global.action.refresh"
-          :is-microcode="true"
-        />
+        <b-button variant="unstyled" class="p-0" @click="redirectUpdateBmc">
+          <img src="@/assets/images/icon-reload-red.svg" />
+          <span style="margin-left: 5px" class="regular-12px red">{{
+            $t('BMC.ReloadMicrocodeBios')
+          }}</span>
+        </b-button>
       </div>
     </div>
   </page-section>
@@ -82,6 +74,9 @@ export default {
     redirectNetworkParametrs() {
       this.$router.push('/network-parametrs');
     },
+    redirectUpdateBmc() {
+      this.$router.push('/operations/firmware');
+    },
     rebootBmc() {
       this.$store
         .dispatch('controls/rebootBmc')
diff --git a/src/views/BMC/Configuration/BMCConfigurationTable.vue b/src/views/BMC/Configuration/BMCConfigurationTable.vue
index 51e428e3..881f8e34 100644
--- a/src/views/BMC/Configuration/BMCConfigurationTable.vue
+++ b/src/views/BMC/Configuration/BMCConfigurationTable.vue
@@ -6,6 +6,7 @@
       class="bootstrap-rounded-table"
       :items="items"
       :fields="fields"
+      :busy="isBusy"
       :empty-text="$t('global.table.emptyMessage')"
     >
     </b-table>
@@ -88,11 +89,8 @@ export default {
   created() {
     this.$store.dispatch('bmc/getBmcInfo').finally(() => {
       this.$root.$emit('hardware-status-bmc-manager-complete');
+      this.isBusy = false;
     });
-    const bmcManagerTablePromise = new Promise((resolve) => {
-      this.$root.$on('hardware-status-bmc-manager-complete', () => resolve());
-    });
-    Promise.all([bmcManagerTablePromise]).finally(() => this.endLoader());
   },
 };
 </script>
diff --git a/src/views/Logs/EventLogs/EventLogs.vue b/src/views/Logs/EventLogs/EventLogs.vue
index 441d8cfa..41de40fd 100644
--- a/src/views/Logs/EventLogs/EventLogs.vue
+++ b/src/views/Logs/EventLogs/EventLogs.vue
@@ -6,12 +6,10 @@
   >
     <page-title />
     <div class="logs-head-container">
-      <div class="semi-bold-12px">
-        <table-cell-count
-          :filtered-items-count="filteredRows"
-          :total-number-of-cells="allLogs.length"
-        ></table-cell-count>
-      </div>
+      <table-cell-count
+        :filtered-items-count="filteredRows"
+        :total-number-of-cells="allLogs.length"
+      ></table-cell-count>
       <search
         :placeholder="$t('pageEventLogs.table.searchLogs')"
         data-test-id="eventLogs-input-searchLogs"
@@ -306,7 +304,6 @@ import TableRowExpandMixin, {
 import SearchFilterMixin, {
   searchFilter,
 } from '@/components/Mixins/SearchFilterMixin';
-// import { headerHeight } from '@/assets/styles/bmc/helpers/_variables';
 
 export default {
   components: {
@@ -342,8 +339,6 @@ export default {
     return {
       isBusy: true,
       sortDesc: true,
-      // headerHeight,
-      // stickyHeader: 'calc(100vh - 200px - #{$header-height})',
       fields: [
         {
           key: 'checkbox',
@@ -632,10 +627,6 @@ export default {
   color: $text-quaternary;
 }
 
-.table-pagination-select {
-  line-height: 1.8rem;
-}
-
 .form-group,
 .b-pagination {
   margin: 0px !important;
diff --git a/src/views/Logs/PostCodeLogs/PostCodeLogs.vue b/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
index b13cef46..14359dfb 100644
--- a/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
+++ b/src/views/Logs/PostCodeLogs/PostCodeLogs.vue
@@ -6,12 +6,10 @@
   >
     <page-title />
     <div class="logs-head-container">
-      <div class="semi-bold-12px">
-        <table-cell-count
-          :filtered-items-count="filteredRows"
-          :total-number-of-cells="allLogs.length"
-        ></table-cell-count>
-      </div>
+      <table-cell-count
+        :filtered-items-count="filteredRows"
+        :total-number-of-cells="allLogs.length"
+      ></table-cell-count>
       <search
         :placeholder="$t('pagePostCodeLogs.table.searchLogs')"
         style="margin: 13px; width: 35%"
@@ -370,10 +368,6 @@ export default {
 };
 </script>
 <style lang="scss" scoped>
-.table-pagination-select {
-  line-height: 1.8rem;
-}
-
 .form-group,
 .b-pagination {
   margin: 0px !important;
diff --git a/src/views/Operations/FactoryReset/FactoryReset.vue b/src/views/Operations/FactoryReset/FactoryReset.vue
index 8f5a159f..175cb89e 100644
--- a/src/views/Operations/FactoryReset/FactoryReset.vue
+++ b/src/views/Operations/FactoryReset/FactoryReset.vue
@@ -10,7 +10,10 @@
     >
       <b-row>
         <b-col md="8">
-          <b-form-group :label="$t('pageFactoryReset.form.resetOptionsLabel')">
+          <b-form-group
+            :label="$t('pageFactoryReset.form.resetOptionsLabel')"
+            label-class="semi-bold-16px"
+          >
             <b-form-radio-group
               id="factory-reset-options"
               v-model="resetOption"
diff --git a/src/views/Operations/KeyClear/KeyClear.vue b/src/views/Operations/KeyClear/KeyClear.vue
index c970e17a..17629b8d 100644
--- a/src/views/Operations/KeyClear/KeyClear.vue
+++ b/src/views/Operations/KeyClear/KeyClear.vue
@@ -21,7 +21,10 @@
     >
       <b-row>
         <b-col md="8">
-          <b-form-group :label="$t('pageKeyClear.form.keyClearOptionsLabel')">
+          <b-form-group
+            :label="$t('pageKeyClear.form.keyClearOptionsLabel')"
+            label-class="semi-bold-16px"
+          >
             <b-form-radio-group
               id="key-clear-options"
               v-model="keyOption"
diff --git a/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue
index eef8b1f9..045fc5ef 100644
--- a/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue
+++ b/src/views/SILA/AnalyticalPanel/AnalyticalPanelPage.vue
@@ -97,7 +97,7 @@
       <span class="indicators-units regular-12px tretiatry">
         {{ $t('global.units.unit') }}</span
       >
-      <b-button id="popover-choice-1" variant="unstiled">
+      <b-button id="popover-choice-1" variant="unstyled">
         <span class="regular-12px units-label">
           {{
             $t(`global.units.${unit === 'Ампераж' ? 'amper' : 'volt'}`)
diff --git a/src/views/SecurityAndAccess/Certificates/Certificates.vue b/src/views/SecurityAndAccess/Certificates/Certificates.vue
index 0113b80a..852e6d34 100644
--- a/src/views/SecurityAndAccess/Certificates/Certificates.vue
+++ b/src/views/SecurityAndAccess/Certificates/Certificates.vue
@@ -54,9 +54,11 @@
     <b-row>
       <b-col xl="11">
         <b-table
+          id="certificates-table"
           responsive="md"
           show-empty
           hover
+          no-border-collapse
           :busy="isBusy"
           :fields="fields"
           :items="tableItems"
diff --git a/src/views/SecurityAndAccess/Sessions/Sessions.vue b/src/views/SecurityAndAccess/Sessions/Sessions.vue
index 07ee725d..5f96ca47 100644
--- a/src/views/SecurityAndAccess/Sessions/Sessions.vue
+++ b/src/views/SecurityAndAccess/Sessions/Sessions.vue
@@ -1,7 +1,7 @@
 <template>
-  <b-container fluid="xl">
+  <b-container fluid class="m-0 p-0">
     <page-title />
-    <b-row class="align-items-end">
+    <b-row class="align-items-center bootstrap-table__section">
       <b-col sm="6" md="5" xl="4">
         <search
           :placeholder="$t('pageSessions.table.searchSessions')"
@@ -17,7 +17,7 @@
         ></table-cell-count>
       </b-col>
     </b-row>
-    <b-row>
+    <b-row class="bootstrap-table__section">
       <b-col>
         <table-toolbar
           ref="toolbar"
@@ -35,6 +35,7 @@
           no-select-on-click
           hover
           show-empty
+          no-border-collapse
           sort-by="clientID"
           :busy="isBusy"
           :fields="fields"
@@ -85,16 +86,18 @@
     </b-row>
 
     <!-- Table pagination -->
-    <b-row>
+    <b-row class="bootstrap-table__section">
       <b-col sm="6">
         <b-form-group
           class="table-pagination-select"
           :label="$t('global.table.itemsPerPage')"
+          label-class="semi-bold-16px"
           label-for="pagination-items-per-page"
         >
           <b-form-select
             id="pagination-items-per-page"
             v-model="perPage"
+            class="select-per-page semi-bold-16px"
             :options="itemsPerPageOptions"
           />
         </b-form-group>
@@ -163,6 +166,7 @@ export default {
       fields: [
         {
           key: 'checkbox',
+          thStyle: { width: '3%' },
         },
         {
           key: 'clientID',
diff --git a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
index c6c556c8..c0a67b09 100644
--- a/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
+++ b/src/views/SecurityAndAccess/UserManagement/UserManagement.vue
@@ -1,7 +1,7 @@
 <template>
-  <b-container fluid="xl">
+  <b-container fluid class="m-0 p-0">
     <page-title />
-    <b-row>
+    <b-row class="bootstrap-table__section">
       <b-col xl="9" class="text-right">
         <b-button variant="link" @click="initModalSettings">
           <icon-settings />
@@ -17,7 +17,7 @@
         </b-button>
       </b-col>
     </b-row>
-    <b-row>
+    <b-row class="bootstrap-table__section">
       <b-col xl="9">
         <table-toolbar
           ref="toolbar"
@@ -27,12 +27,14 @@
           @batch-action="onBatchAction"
         />
         <b-table
+          id="user-management-table"
           ref="table"
           responsive="md"
           selectable
           show-empty
           no-select-on-click
           hover
+          no-border-collapse
           :busy="isBusy"
           :fields="fields"
           :items="tableItems"
@@ -85,7 +87,7 @@
         </b-table>
       </b-col>
     </b-row>
-    <b-row>
+    <b-row class="bootstrap-table__section">
       <b-col xl="8">
         <b-button
           v-b-toggle.collapse-role-table