added AssociatedEquipmentTable to CombinedEquipmentEnergyItem report in web UI

Merge branch 'develop'

web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyItem.js

@@ -33,6 +33,7 @@ import ButtonIcon from '../../common/ButtonIcon';
 import { APIBaseURL } from '../../../config';
 
 const DetailedDataTable = loadable(() => import('../common/DetailedDataTable'));
+const AssociatedEquipmentTable = loadable(() => import('../common/AssociatedEquipmentTable'));
 
 const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
   let current_moment = moment();
@@ -88,6 +89,10 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
 
   const [detailedDataTableData, setDetailedDataTableData] = useState([]);
   const [detailedDataTableColumns, setDetailedDataTableColumns] = useState([{dataField: 'startdatetime', text: t('Datetime'), sort: true}]);
+  
+  const [associatedEquipmentTableData, setAssociatedEquipmentTableData] = useState([]);
+  const [associatedEquipmentTableColumns, setAssociatedEquipmentTableColumns] = useState([{dataField: 'name', text: t('Associated Equipment'), sort: true }]);
+  
   const [excelBytesBase64, setExcelBytesBase64] = useState(undefined);
   
   useEffect(() => {
@@ -291,6 +296,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
 
     // Reinitialize tables
     setDetailedDataTableData([]);
+    setAssociatedEquipmentTableData([]);
     
     let isResponseOK = false;
     fetch(APIBaseURL + '/reports/combinedequipmentenergyitem?' +
@@ -443,6 +449,38 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         });
         setDetailedDataTableColumns(detailed_column_list);
         
+        let associated_equipment_value_list = [];
+        if (json['associated_equipment']['associated_equipment_names_array'].length > 0) {
+          json['associated_equipment']['associated_equipment_names_array'][0].forEach((currentEquipmentName, equipmentIndex) => {
+            let associated_equipment_value = {};
+            associated_equipment_value['id'] = equipmentIndex;
+            associated_equipment_value['name'] = currentEquipmentName;
+            json['associated_equipment']['energy_item_names'].forEach((currentValue, energyItemIndex) => {
+              associated_equipment_value['a' + energyItemIndex] = json['associated_equipment']['subtotals_array'][energyItemIndex][equipmentIndex].toFixed(2);
+            });
+            associated_equipment_value_list.push(associated_equipment_value);
+          });
+        };
+
+        setAssociatedEquipmentTableData(associated_equipment_value_list);
+
+        let associated_equipment_column_list = [];
+        associated_equipment_column_list.push({
+          dataField: 'name',
+          text: t('Associated Equipment'),
+          sort: true
+        });
+        json['associated_equipment']['energy_item_names'].forEach((currentValue, index) => {
+          let unit = json['associated_equipment']['units'][index];
+          associated_equipment_column_list.push({
+            dataField: 'a' + index,
+            text: currentValue + ' (' + unit + ')',
+            sort: true
+          });
+        });
+
+        setAssociatedEquipmentTableColumns(associated_equipment_column_list);
+       
         setExcelBytesBase64(json['excel_bytes_base64']);
 
         // enable submit button
@@ -662,6 +700,9 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
       <br />
       <DetailedDataTable data={detailedDataTableData} title={t('Detailed Data')} columns={detailedDataTableColumns} pagesize={50} >
       </DetailedDataTable>
+      <br />
+      <AssociatedEquipmentTable data={associatedEquipmentTableData} title={t('Associated Equipment Data')} columns={associatedEquipmentTableColumns}>
+      </AssociatedEquipmentTable>
     </Fragment>
   );
 };

web/src/components/MyEMS/common/AssociatedEquipmentTable.js

@@ -0,0 +1,39 @@
+import React, { Fragment } from 'react';
+import BootstrapTable from 'react-bootstrap-table-next';
+import FalconCardHeader from '../../common/FalconCardHeader';
+import ButtonIcon from '../../common/ButtonIcon';
+import { Card, CardBody, CardHeader, Row, Col } from 'reactstrap';
+import { withTranslation } from 'react-i18next';
+
+
+const defaultSorted = [{
+  dataField: 'name',
+  order: 'asc'
+}];
+
+const AssociatedEquipmentTable = ({ title, data, columns, t }) => {
+  return (
+    <Fragment>
+      <Card>
+        <FalconCardHeader title={title} className="bg-light">
+          
+        </FalconCardHeader>
+        <CardBody>
+          <Row>
+            <Col>
+              <BootstrapTable
+                bootstrap4
+                keyField="id"
+                data={data}
+                columns={columns}
+                defaultSorted={defaultSorted}
+              />
+            </Col>
+          </Row>
+        </CardBody>
+      </Card>
+    </Fragment>
+  );
+};
+
+export default withTranslation()(AssociatedEquipmentTable);

web/src/i18n.js

@@ -82,6 +82,7 @@ const resources = {
       "Description": "Description",
       "Energy Category": "Energy Category",
       "Child Spaces": "Child Spaces",
+      "Associated Equipment": "Associated Equipment",
       //Energy Categories
       "Electricity": "Electricity",
       "Water": "Water",
@@ -220,6 +221,7 @@ const resources = {
       "Detailed Data": "Detailed Data",
       "Child Spaces Data": "Child Spaces Data",
       "Child Spaces Data of This Month": "Child Spaces Data of This Month",
+      "Associated Equipment Data": "Associated Equipment Data",
       "This Year": "This Year",
       "This Month": "This Month",
       "This Day": "This Day",
@@ -419,6 +421,7 @@ const resources = {
       "Description": "Beschreibung",
       "Energy Category": "Energiekategorie",
       "Child Spaces": "Teilplatz",
+      "Associated Equipment": "Dazugehörige Geräte",
       //Energy Categories
       "Electricity": "Elektrizität",
       "Water": "Wasser",
@@ -557,6 +560,7 @@ const resources = {
       "Detailed Data": "Detaillierte Daten",
       "Child Spaces Data": "Teilplatz Daten",
       "Child Spaces Data of This Month": "Teilplatz Daten dieses Monats",
+      "Associated Equipment Data": "Dazugehörige Geräte Daten",
       "This Year": "Dieses Jahr",
       "This Month": "Diesen Monat",
       "This Day": "Dieser Tag",
@@ -759,6 +763,7 @@ const resources = {
       "Description": "描述",
       "Energy Category": "能耗分类",
       "Child Spaces": "子空间",
+      "Associated Equipment": "相关设备",
       //Energy Categories
       "Electricity": "电",
       "Water": "自来水",
@@ -897,6 +902,7 @@ const resources = {
       "Detailed Data": "详细数据",
       "Child Spaces Data": "子空间数据",
       "Child Spaces Data of This Month": "本月子空间数据",
+      "Associated Equipment Data": "相关设备数据",
       "This Year": "本年",
       "This Month": "本月",
       "This Day": "本日",