From fdf75f4c0ae758bd3874b779bbf1647cb731d027 Mon Sep 17 00:00:00 2001
From: yvesn <yvesn>
Date: Wed, 24 May 2017 09:38:21 +0000
Subject: [PATCH] SSDM-5068 : ELN config on GUI - adjusted column widths
SVN: 38217
---
.../js/views/SettingsForm/SettingsFormView.js | 48 +++++++++++--------
1 file changed, 29 insertions(+), 19 deletions(-)
diff --git a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/SettingsForm/SettingsFormView.js b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/SettingsForm/SettingsFormView.js
index 69dc231e03b..1cc93a010c9 100644
--- a/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/SettingsForm/SettingsFormView.js
+++ b/openbis_standard_technologies/dist/core-plugins/eln-lims/1/as/webapps/eln-lims/html/js/views/SettingsForm/SettingsFormView.js
@@ -122,7 +122,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
this._getMainMenuItemsTableModel = function() {
var tableModel = this._getTableModel();
// define columns
- tableModel.columnNames = ["Main Menu Item", "enabled"];
+ tableModel.columns = [{ label : "Main Menu Item"}, { label : "enabled"}];
tableModel.rowBuilders = {
"Main Menu Item" : function(rowData) {
return $("<span>").text(rowData.menuItemName);
@@ -273,7 +273,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
var tableModel = this._getTableModel();
tableModel.dynamicRows = true;
// define columns
- tableModel.columnNames = ["Filename extension", "Dataset type"];
+ tableModel.columns = [{ label : "Filename extension" }, { label : "Dataset type" }];
tableModel.rowBuilders = {
"Filename extension" : function(rowData) {
return $("<input>", { type : "text", class : "form-control" }).val(rowData.fileNameExtension);
@@ -327,7 +327,13 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
var tableModel = this._getTableModel();
tableModel.dynamicRows = true;
// define columns
- tableModel.columnNames = ["Hints for", "Label", "Type", "Min", "Max"];
+ tableModel.columns = [
+ { label : "Hints for", width : "140px" },
+ { label : "Label" },
+ { label : "Type" },
+ { label : "Min", width : "80px" },
+ { label : "Max", width : "80px" }
+ ];
tableModel.rowBuilders = {
"Hints for" : (function(rowData) {
var options = ["Children", "Parents"];
@@ -408,7 +414,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
var tableModel = this._getTableModel();
tableModel.dynamicRows = true;
// define columns
- tableModel.columnNames = ["Annotation property type", "Mandatory"];
+ tableModel.columns = [{ label : "Annotation property type" }, { label : "Mandatory", width : "160px" }];
tableModel.rowBuilders = {
"Annotation property type" : (function(rowData) {
var options = this._settingsFormController.getAnnotationPropertyTypeOptions();
@@ -449,7 +455,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
var tableModel = this._getTableModel();
tableModel.dynamicRows = true;
// define columns
- tableModel.columnNames = [params.columnName];
+ tableModel.columns = [{ label : params.columnName }];
tableModel.rowBuilders[params.columnName] = function(rowData) {
return FormUtil.getDropdown(params.options.map(function(option) {
return {
@@ -474,7 +480,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
this._getTableModel = function() {
var tableModel = {};
- tableModel.columnNames = []; // array of strings
+ tableModel.columns = []; // array of elements with label and optional width
tableModel.rowBuilders = {}; // key (column name); value (function to build widget)
tableModel.rows = []; // array of maps with key (column name); value (widget)
tableModel.rowExtraBuilder = null; // optional builder for expandable component per row
@@ -487,10 +493,10 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
for (var i of Object.keys(tableModel.rows)) {
var row = tableModel.rows[i];
var rowValues = {};
- for (var columnName of tableModel.columnNames) {
- var $widget = row[columnName];
+ for (var column of tableModel.columns) {
+ var $widget = row[column.label];
var value = this._getWidgetValue($widget);
- rowValues[columnName] = value;
+ rowValues[column.label] = value;
}
if (tableModel.rowExtraModels.length === tableModel.rows.length) {
rowValues.extraValues = tableModel.rowExtraModels[i].getValues();
@@ -501,9 +507,9 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
}).bind(this);
tableModel.addRow = function(rowData) {
var rowWidgets = {};
- for (var columnName of tableModel.columnNames) {
- var rowBuilder = tableModel.rowBuilders[columnName];
- rowWidgets[columnName] = rowBuilder(rowData);
+ for (var column of tableModel.columns) {
+ var rowBuilder = tableModel.rowBuilders[column.label];
+ rowWidgets[column.label] = rowBuilder(rowData);
}
tableModel.rows.push(rowWidgets);
if (tableModel.rowExtraBuilder) {
@@ -535,8 +541,12 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
if (tableModel.rowExtraBuilder) {
$trHead.append($("<th>").css("width", "30px"));
}
- for (var columnName of tableModel.columnNames) {
- $trHead.append($("<th>").css("vertical-align", "middle").text(columnName));
+ for (var column of tableModel.columns) {
+ var $th = $("<th>").css("vertical-align", "middle").text(column.label);
+ if (column.width) {
+ $th.css("width", column.width);
+ }
+ $trHead.append($th);
}
// add row button
if (tableModel.dynamicRows) {
@@ -555,7 +565,7 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
}
}).bind(this))
}
- $trHead.append($("<th>").append($addButton));
+ $trHead.append($("<th>").css("width", "80px").append($addButton));
}
$thead.append($trHead);
$table.append($thead);
@@ -584,12 +594,12 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
// add expand / collapse for extra
if ($extra) {
// create extra row
- var colspan = tableModel.columnNames.length + 1;
+ var colspan = tableModel.columns.length + 1;
if (tableModel.dynamicRows) {
colspan++;
}
$extraRow = $("<tr>")
- .append($("<td>").css("padding-left", "50px").attr("colspan", colspan)
+ .append($("<td>").css({"padding-left" : "50px", "padding-right" : "50px"}).attr("colspan", colspan)
.append($extra));
// hiding / showing extra row
$extraRow.hide();
@@ -607,10 +617,10 @@ function SettingsFormView(settingsFormController, settingsFormModel) {
$td.append($expandCollapse);
}
- for (var columnName of tableModel.columnNames) {
+ for (var column of tableModel.columns) {
var $td = $("<td>");
$tr.append($td);
- var $widget = tableModelRow[columnName];
+ var $widget = tableModelRow[column.label];
$td.append($widget);
// disbale widget if in view mode
if (this._settingsFormModel.mode === FormMode.VIEW) {
--
GitLab