[ORCT-95] List of energies

app/public/views/periods/ActiveColumns/periodsActiveColumns.js

@@ -16,22 +16,26 @@ import linkChip from '../../../components/chips/linkChip.js';
 import { RCT } from '../../../config.js';
 import { getClosestDefinedEnergy } from '../../../utils/dataProcessing/dataProcessingUtils.js';
 import { buildHref } from '../../../utils/url/urlUtils.js';
-const { dataReqParams: DRP, pageNames: PN } = RCT;
+const { dataReqParams: DRP, pageNames: PN, fieldNames: FN } = RCT;
 const acceptableEnergyValues = RCT.mapping.energy.values;
 const acceptableEnergyMargin = RCT.mapping.energy.acceptableMargin;
+const fieldNames = FN.periods;
 
 /**
  * List of active columns for a generic periods table
  */
 export const periodsActiveColumns = {
     id: {
-        name: 'Id',
+        name: 'id',
         visible: false,
     },
 
     name: {
-        name: 'Name',
+        name: 'name',
         visible: true,
+        header: fieldNames.name.fieldName,
+        fieldName: fieldNames.name.fieldName,
+        filterInput: fieldNames.name.filterInput,
         format: (navigation, period) => [
             h('td.text-ellipsis', period.name),
             h('td',
@@ -72,26 +76,38 @@ export const periodsActiveColumns = {
     },
 
     beamType: {
-        name: 'Beam',
+        name: 'beamType',
         visible: true,
+        header: fieldNames.beamType.fieldName,
+        fieldName: fieldNames.beamType.fieldName,
+        filterInput: fieldNames.beamType.filterInput,
         format: (_, period) => period.beamType,
     },
 
     year: {
-        name: 'Year',
+        name: 'year',
         visible: true,
+        header: fieldNames.year.fieldName,
+        fieldName: fieldNames.year.fieldName,
+        filterInput: fieldNames.year.filterInput,
         format: (_, period) => period.year,
     },
 
     avgEnergy: {
-        name: 'Mean energy',
+        name: 'avgEnergy',
         visible: true,
+        header: fieldNames.avgEnergy.fieldName,
+        fieldName: fieldNames.avgEnergy.fieldName,
+        filterInput: fieldNames.avgEnergy.filterInput,
         format: (_, period) => `${Number(period.avgEnergy).toFixed(2)}`,
     },
 
     distinctEnergies: {
-        name: 'Distinct energies',
+        name: 'distinctEnergies',
         visible: true,
+        header: h('.center-of-mass-energy'),
+        fieldName: fieldNames.distinctEnergies.fieldName,
+        filterInput: fieldNames.distinctEnergies.filterInput,
         format: (_, period) =>
             h('', period.distinctEnergies.map((e) => getClosestDefinedEnergy(e, acceptableEnergyValues, acceptableEnergyMargin))
                 .filter((value, index, array) => array.indexOf(value) === index)

app/public/views/periods/PeriodsModel.js

@@ -18,6 +18,7 @@ import { RCT } from '../../config.js';
 import { createCSVExport, createJSONExport } from '../../utils/dataExport/export.js';
 import { exportFormats } from './overview/dataExport.js';
 import { pageTitle } from '../../components/common/pageTitle.js';
+import { periodsActiveColumns } from './ActiveColumns/periodsActiveColumns.js';
 
 /**
  * Model representing handlers for periods page
@@ -41,7 +42,7 @@ export default class PeriodsModel extends Observable {
             this.notify();
         });
 
-        this._fields = Object.keys(RCT.fieldNames.periods).map((field) => ({ name: field, visible: true }));
+        this._fields = periodsActiveColumns;
 
         this._hideSelectedPeriods = false;
         this._sortingRowVisible = false;
@@ -162,7 +163,7 @@ export default class PeriodsModel extends Observable {
     }
 
     get visibleFields() {
-        return this._fields.filter((field) => field.visible);
+        return Object.keys(this._fields).map((field) => ({ ...this._fields[field] })).filter((field) => field.visible);
     }
 
     get fields() {

app/public/views/periods/overview/periodsContent.js

@@ -63,10 +63,10 @@ export default function periodsContent(periodsModel, model) {
                         h(`table.${pageName}-table`, {
                             id: `data-table-${pageName}`,
                         },
-                        periodsTableHeader(periodsModel, pageName, periodsModel.visibleFields, periods),
+                        periodsTableHeader(periodsModel, pageName, periods),
                         h('tbody', { id: `table-body-${pageName}` },
                             periods.map((period) => periodsTableRow(
-                                period, periodsModel.visibleFields, navigation, periodsModel,
+                                period, navigation, periodsModel,
                             ))))))
                 : ''
             : anyFiltersActive(url)

app/public/views/periods/table/periodsTableHeader.js

@@ -13,17 +13,13 @@
  */
 
 import { h } from '/js/src/index.js';
-import { RCT } from '../../../config.js';
-const { fieldNames } = RCT;
-
-export default function periodsTableHeader(periodsModel, pageName, visibleFields, data) {
-    const periodFields = Object.keys(fieldNames.periods).reduce((acc, field) => ({ ...acc, [field]: fieldNames.periods[field].fieldName }), {});
 
+export default function periodsTableHeader(periodsModel, pageName, data) {
     const headerColumns = (visibleFields) => {
-        const dataHeaders = visibleFields.map((field) =>
+        const dataHeaders = visibleFields.map((field, index) =>
             h(`th.${pageName}-${field.name}-header`, {
                 scope: 'col',
-            }, h('.relative', h('.inline', periodFields[field.name]))));
+            }, h('.relative', h('.inline', visibleFields[index].header))));
         return dataHeaders;
     };
 
@@ -44,5 +40,5 @@ export default function periodsTableHeader(periodsModel, pageName, visibleFields
     return h('thead.header',
         h('tr',
             headerCheckbox(periodsModel, data),
-            headerColumns(visibleFields)));
+            headerColumns(periodsModel.visibleFields)));
 }

app/public/views/periods/table/periodsTableRow.js

@@ -15,15 +15,14 @@
 import { h } from '/js/src/index.js';
 import { RCT } from '../../../config.js';
 import { rowDisplayStyle } from '../../../utils/dataProcessing/dataProcessingUtils.js';
-import { periodsActiveColumns } from '../ActiveColumns/periodsActiveColumns.js';
 
-export default function periodsTableRow(periodData, visibleFields, navigation, periodsModel) {
+export default function periodsTableRow(periodData, navigation, periodsModel) {
     const pageName = RCT.pageNames.periods;
 
-    const dataCells = visibleFields.map((field) =>
+    const dataCells = periodsModel.visibleFields.map((field, index) =>
         h(`td.${pageName}-${field.name}-cell.text-ellipsis`,
             periodData[field.name]
-                ? periodsActiveColumns[field.name].format(navigation, periodData)
+                ? periodsModel.visibleFields[index].format(navigation, periodData)
                 : ''));
 
     const checkbox = h('td.relative.track',

app/public/views/runs/newRunsPerPeriod/RunsPerPeriodModel.js

@@ -52,7 +52,6 @@ export default class RunsPerPeriodModel extends Observable {
             const { items } = await getRemoteDataSlice(endpoint);
             this._selectedPeriod = RemoteData.success([...items]);
             this._periods[periodId] = this._selectedPeriod.payload.find((e) => Boolean(e));
-            // Console.log(this._periods);
         } catch (errors) {
             this._selectedPeriod = RemoteData.failure(errors);
         }