Merge branch 'sila' of git.sila.ru:pub/openbmc/webui-vue into sila

8 files changed, 220 insertions, 127 deletions

diff --git a/src/env/components/AppNavigation/sila.js b/src/env/components/AppNavigation/sila.js
index 31538b98..50aaf996 100644
--- a/src/env/components/AppNavigation/sila.js
+++ b/src/env/components/AppNavigation/sila.js
@@ -31,11 +31,6 @@ const AppNavigationMixin = {
               label: this.$t('appNavigation.dateTime'),
               route: '/date-time',
             },
-            {
-              id: 'pci-devices',
-              label: this.$t('appNavigation.pciDevices'),
-              route: '/pci-devices',
-            },
           ],
         },
         {
diff --git a/src/env/router/sila.js b/src/env/router/sila.js
index 539f3c16..e7c4b19c 100644
--- a/src/env/router/sila.js
+++ b/src/env/router/sila.js
@@ -36,7 +36,6 @@ import FansDynamic from '@/views/_sila/Fans/Dynamic';
 import MotherboardDynamic from '@/views/_sila/Motherboard/Dynamic';
 import PowerStatic from '@/views/_sila/Power/Static';
 import PowerDynamic from '@/views/_sila/Power/Dynamic';
-import PciDevices from '@/views/_sila/PciDevices';
 
 import i18n from '@/i18n';
 
@@ -337,14 +336,6 @@ const routes = [
         },
       },
       {
-        path: '/pci-devices',
-        name: 'pci-devices',
-        component: PciDevices,
-        meta: {
-          title: i18n.t('appPageTitle.pciDevices'),
-        },
-      },
-      {
         path: '*',
         name: 'page-not-found',
         component: PageNotFound,
diff --git a/src/locales/en-US.json b/src/locales/en-US.json
index c6f209c4..cd119b46 100644
--- a/src/locales/en-US.json
+++ b/src/locales/en-US.json
@@ -414,6 +414,7 @@
     "quicklinkTitle": "Quick links to hardware components",
     "system": "System",
     "assemblies": "Assemblies",
+    "pci": "PCI-devices",
     "systemIndicator": {
       "powerStatus": "Power status",
       "identifyLed": "System identify LED",
@@ -1107,7 +1108,10 @@
     "table": {
       "id": "ID",
       "name": "Name",
+      "health": "Health",
+      "health_d": "OK",
       "type": "Type",
+      "class": "Class",
       "model": "Model",
       "manufacturer": "Manufacturer",
       "classCode": "Class Code",
diff --git a/src/locales/ru-RU.json b/src/locales/ru-RU.json
index 621ef62e..a2d6f481 100644
--- a/src/locales/ru-RU.json
+++ b/src/locales/ru-RU.json
@@ -414,6 +414,7 @@
     "quicklinkTitle": "Быстрые ссылки к компонентам оборудования",
     "assemblies": "Сборки",
     "system": "Система",
+    "pci": "PCI-устройства",
     "systemIndicator": {
       "powerStatus": "Состояние питания",
       "identifyLed": "Идентификационный LED системы",
@@ -1106,8 +1107,11 @@
     "title": "Установленые PCI-устройства",
     "table": {
       "id": "Идентификатор",
-      "name": "Имя устройства",
+      "health": "Состояние",
+      "health_d": "Работоспособен",
+      "name": "Имя",
       "type": "Тип устройства",
+      "class": "Класс устройства",
       "model": "Модель",
       "manufacturer": "Производитель",
       "classCode": "Код класса",
diff --git a/src/store/modules/HardwareStatus/PciStore.js b/src/store/modules/HardwareStatus/PciStore.js
index baeaaadf..e49e452c 100644
--- a/src/store/modules/HardwareStatus/PciStore.js
+++ b/src/store/modules/HardwareStatus/PciStore.js
@@ -19,25 +19,64 @@ const PciStore = {
         return {
           id: Id,
           name: Name,
-          type: DeviceType,
+          DeviceType: DeviceType,
           manufacturer: Manufacturer,
           PCIeFunction: PCIeFunctions,
         };
       });
     },
-    setSecondPciDevises: (state, data) => {
+    setPciDevisesMembers: (state, data) => {
       state.pci = data.map((item, index) => {
         const {
           value: {
-            data: { ClassCode, DeviceClass, DeviceId, FunctionType },
+            data: { Members },
           },
         } = item;
         return {
           ...state.pci[index],
-          classCode: ClassCode,
-          deviceClass: DeviceClass,
-          deviceId: DeviceId,
-          functionType: FunctionType,
+          Members: Members,
+        };
+      });
+    },
+    setFunctionDevices: (state, data) => {
+      let count = 0;
+      const newData = state.pci.map((item) => {
+        const result = data.slice(count, count + item.Members.length);
+        count += item.Members.length;
+        return result;
+      });
+      state.pci = newData.map((item, index) => {
+        const functions = item.map((item) => {
+          const {
+            value: {
+              data: {
+                ClassCode,
+                DeviceClass,
+                DeviceId,
+                FunctionType,
+                DeviceName,
+              },
+            },
+          } = item;
+          return {
+            classCode: ClassCode,
+            deviceClass: DeviceClass,
+            deviceId: DeviceId,
+            functionType: FunctionType,
+            DeviceName: DeviceName,
+          };
+        });
+
+        if (item.length > 1) {
+          return {
+            ...state.pci[index],
+            Functions: functions,
+          };
+        }
+
+        return {
+          ...state.pci[index],
+          ...functions[0],
         };
       });
     },
@@ -55,22 +94,25 @@ const PciStore = {
         })
         .catch((error) => console.log(error));
     },
-    async getFunctionDevices({ commit, state }) {
-      const functions = state.pci.map((item) =>
+    async getDevicesMembers({ commit, state }) {
+      const Members = state.pci.map((item) =>
         api.get(item.PCIeFunction['@odata.id'])
       );
-      Promise.allSettled(functions)
-        .then((response) => {
-          const data = response.map((item) =>
-            api.get(item.value.data.Members[0]['@odata.id'])
-          );
-          return Promise.allSettled(data);
-        })
+      return Promise.allSettled(Members)
         .then((response) => {
-          commit('setSecondPciDevises', response);
+          commit('setPciDevisesMembers', response);
         })
         .catch((error) => console.log(error));
     },
+    async getFunctionDevices({ commit, state }) {
+      const Functions = state.pci
+        .map((item) => item.Members)
+        .flat(Infinity)
+        .map((item) => api.get(item['@odata.id']));
+      return Promise.allSettled(Functions).then((response) =>
+        commit('setFunctionDevices', response)
+      );
+    },
   },
 };
 
diff --git a/src/views/_sila/Overview/Inventory/Inventory.vue b/src/views/_sila/Overview/Inventory/Inventory.vue
index 3bf9433f..cf909423 100644
--- a/src/views/_sila/Overview/Inventory/Inventory.vue
+++ b/src/views/_sila/Overview/Inventory/Inventory.vue
@@ -44,7 +44,7 @@
     <table-processors ref="processors" class="inventory-scroll" />
 
     <!-- Assembly table -->
-    <table-assembly ref="assembly" class="inventory-scroll" />
+    <pci-devices ref="pci" class="inventory-scroll" />
   </b-container>
 </template>
 
@@ -58,7 +58,7 @@ import TableFans from './InventoryTableFans';
 import TableBmcManager from './InventoryTableBmcManager';
 import TableChassis from './InventoryTableChassis';
 import TableProcessors from './InventoryTableProcessors';
-import TableAssembly from './InventoryTableAssembly';
+import PciDevices from './InventoryPciDevices';
 import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
 import PageSection from '@/components/_sila/Global/PageSection';
 import JumpLinkMixin from '@/components/_sila/Mixins/JumpLinkMixin';
@@ -75,7 +75,7 @@ export default {
     TableBmcManager,
     TableChassis,
     TableProcessors,
-    TableAssembly,
+    PciDevices,
     PageSection,
   },
   mixins: [LoadingBarMixin, JumpLinkMixin],
@@ -131,10 +131,10 @@ export default {
           linkText: this.$t('pageInventory.processors'),
         },
         {
-          id: 'assembly',
-          dataRef: 'assembly',
-          href: '#assembly',
-          linkText: this.$t('pageInventory.assemblies'),
+          id: 'pci',
+          dataRef: 'pci',
+          href: '#pci',
+          linkText: this.$t('pageInventory.pci'),
         },
       ],
     };
@@ -174,7 +174,7 @@ export default {
       this.$root.$on('hardware-status-system-complete', () => resolve());
     });
     const assemblyTablePromise = new Promise((resolve) => {
-      this.$root.$on('hardware-status-assembly-complete', () => resolve());
+      this.$root.$on('hardware-status-pci-complete', () => resolve());
     });
     // Combine all child component Promises to indicate
     // when page data load complete
diff --git a/src/views/_sila/Overview/Inventory/InventoryPciDevices.vue b/src/views/_sila/Overview/Inventory/InventoryPciDevices.vue
new file mode 100644
index 00000000..ff1255ce
--- /dev/null
+++ b/src/views/_sila/Overview/Inventory/InventoryPciDevices.vue
@@ -0,0 +1,144 @@
+<template>
+  <page-section :section-title="$t('pagePci.title')">
+    <b-table
+      responsive="md"
+      show-empty
+      hover
+      :items="items"
+      :fields="fields"
+      :empty-text="$t('global.table.emptyMessage')"
+      :busy="isBusy"
+    >
+      <template #cell(expandRow)="row">
+        <b-button
+          v-if="items[row.index].DeviceType !== 'SingleFunction'"
+          variant="link"
+          :title="expandRowLabel"
+          class="btn-icon-only"
+          @click="toggleRowDetails(row)"
+        >
+          <icon-chevron />
+          <span class="sr-only">{{ expandRowLabel }}</span>
+        </b-button>
+      </template>
+      <template #cell(DeviceName)="data">
+        <span v-if="items[data.index].DeviceType === 'SingleFunction'">
+          {{ data.value }}</span
+        >
+        <span v-else>
+          {{
+            items[data.index].Functions[0].DeviceName
+              ? items[data.index].Functions[0].DeviceName
+              : '--'
+          }}</span
+        >
+      </template>
+      <template #cell(health)>
+        <status-icon :status="statusIcon('OK')" />
+        {{ $t('pagePci.table.health_d') }}
+      </template>
+      <template #cell(deviceClass)="data">
+        <span v-if="items[data.index].DeviceType === 'SingleFunction'">
+          {{ data.value }}</span
+        >
+        <span v-else> {{ items[data.index].Functions[0].deviceClass }}</span>
+      </template>
+      <template #row-details="data">
+        <b-container fluid>
+          <b-row v-for="item in data.item.Functions" :key="item.deviceId">
+            <b-col xs="6">
+              <dl>
+                <dt>{{ $t('pagePci.table.name') }}:</dt>
+                <dd>{{ dataFormatter(item.DeviceName) }}</dd>
+              </dl>
+            </b-col>
+            <b-col xs="6">
+              <dl>
+                <dt>{{ $t('pagePci.table.type') }}:</dt>
+                <dd>{{ dataFormatter(item.deviceClass) }}</dd>
+              </dl>
+            </b-col>
+          </b-row>
+        </b-container>
+      </template>
+    </b-table>
+  </page-section>
+</template>
+
+<script>
+import PageSection from '@/components/_sila/Global/PageSection';
+import IconChevron from '@carbon/icons-vue/es/chevron--down/20';
+import StatusIcon from '@/components/_sila/Global/StatusIcon';
+
+import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
+import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
+import TableRowExpandMixin, {
+  expandRowLabel,
+} from '@/components/_ibs/Mixins/TableRowExpandMixin';
+
+export default {
+  components: { PageSection, StatusIcon, IconChevron },
+  mixins: [DataFormatterMixin, LoadingBarMixin, TableRowExpandMixin],
+  data() {
+    return {
+      isBusy: true,
+      fields: [
+        {
+          key: 'expandRow',
+          label: '',
+          tdClass: 'table-row-expand',
+          sortable: false,
+        },
+        {
+          key: 'DeviceName',
+          label: this.$t('pagePci.table.name'),
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'health',
+          label: this.$t('pagePci.table.health'),
+          formatter: this.dataFormatter,
+          tdClass: 'text-nowrap',
+        },
+        {
+          key: 'deviceClass',
+          label: this.$t('pagePci.table.class'),
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'DeviceType',
+          label: this.$t('pagePci.table.type'),
+          formatter: this.dataFormatter,
+        },
+        {
+          key: 'manufacturer',
+          label: this.$t('pagePci.table.manufacturer'),
+          formatter: this.dataFormatter,
+        },
+      ],
+      expandRowLabel: expandRowLabel,
+    };
+  },
+
+  computed: {
+    items() {
+      return this.$store.getters['pci/pciDevices'];
+    },
+  },
+
+  created() {
+    return this.$store
+      .dispatch('pci/getDevices')
+      .then(() => {
+        return this.$store.dispatch('pci/getDevicesMembers');
+      })
+      .then(() => {
+        this.$store.dispatch('pci/getFunctionDevices');
+      })
+      .finally(() => {
+        this.$root.$emit('hardware-status-pci-complete');
+        this.isBusy = false;
+      });
+  },
+};
+</script>
diff --git a/src/views/_sila/PciDevices/PciDevices.vue b/src/views/_sila/PciDevices/PciDevices.vue
deleted file mode 100644
index 77f40b66..00000000
--- a/src/views/_sila/PciDevices/PciDevices.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<template>
-  <b-container fluid="xl">
-    <page-title />
-    <page-section :section-title="$t('pagePci.title')">
-      <b-table
-        responsive="md"
-        show-empty
-        hover
-        :items="items"
-        :fields="fields"
-        :empty-text="$t('global.table.emptyMessage')"
-        :busy="isBusy"
-      >
-      </b-table>
-    </page-section>
-  </b-container>
-</template>
-
-<script>
-import PageTitle from '@/components/_sila/Global/PageTitle';
-import PageSection from '@/components/_sila/Global/PageSection';
-
-import DataFormatterMixin from '@/components/_sila/Mixins/DataFormatterMixin';
-import LoadingBarMixin from '@/components/_sila/Mixins/LoadingBarMixin';
-
-export default {
-  components: { PageTitle, PageSection },
-  mixins: [DataFormatterMixin, LoadingBarMixin],
-  data() {
-    return {
-      isBusy: true,
-      fields: [
-        {
-          key: 'id',
-          label: this.$t('pagePci.table.id'),
-          formatter: this.dataFormatter,
-          tdClass: 'text-nowrap',
-        },
-        {
-          key: 'name',
-          label: this.$t('pagePci.table.name'),
-          formatter: this.dataFormatter,
-        },
-        {
-          key: 'type',
-          label: this.$t('pagePci.table.type'),
-          formatter: this.dataFormatter,
-        },
-        {
-          key: 'manufacturer',
-          label: this.$t('pagePci.table.manufacturer'),
-          formatter: this.dataFormatter,
-        },
-        {
-          key: 'classCode',
-          label: this.$t('pagePci.table.classCode'),
-          formatter: this.dataFormatter,
-        },
-        {
-          key: 'deviceClass',
-          label: this.$t('pagePci.table.deviceClass'),
-          formatter: this.dataFormatter,
-        },
-      ],
-    };
-  },
-
-  computed: {
-    items() {
-      return this.$store.getters['pci/pciDevices'];
-    },
-  },
-
-  created() {
-    this.startLoader();
-    this.$store
-      .dispatch('pci/getDevices')
-      .then(() => {
-        this.$store.dispatch('pci/getFunctionDevices');
-      })
-      .finally(() => {
-        this.endLoader();
-        this.isBusy = false;
-      });
-  },
-};
-</script>