Вопрос
По умолчанию мастер мобильного приложения позволяет добавить в реестр раздела только два поля.
Пример:
Возможно ли увеличить количество отображаемых полей? Если не через мастер, то через код.
Ответ
В реестре может отображаться не только колонка для отображения, но можно выводить и значения, сформированные на основании значений нескольких колонок. Для такого сложного форматирования, или отображения разных значений в зависимости от условий, значения колонок можно задавать в виде функций (используя методы Terrasoft.sdk.GridPage.setPrimaryColumn() и Terrasoft.sdk.GridPage.setSecondaryColumn()):
Terrasoft.sdk.GridPage.setPrimaryColumn('Account', {
columns: ['Name', 'PrimaryContact'],
convertFunction: function(values) {
if (!Ext.isEmpty(values.PrimaryContact)) {
return values.Name + ' (' + values.PrimaryContact + ')';
} else {
return values.Name;
}
}
});
Кроме того, можно указывать дополнительные колонки и при выборе значения поля-справочника. Делается это по аналогии с гридом, но только используется класс Terrasoft.sdk.LookupGridPage:
Terrasoft.sdk.LookupGridPage.setSecondaryColumn("Account", "PrimaryContact");
А вот альтернативный вариант расширения возможностей грида - изменение шаблона элементов грида:
Terrasoft.util.writeStyles(
".div-table {",
"display:table;",
"width:100%;",
"}",
".div-table-row {",
"display:table-row;",
"width:100%;",
"clear:both;",
"}",
".div-table-col {",
"float:left;",
"display:table-column;",
"min-width:50%;",
"}",
".div-table-col-button {",
"float:right;",
"display:table-column;",
"}"
);
Ext.define("MyCustomList", {
override: "Ext.Terrasoft.List",
initializeItemTpl: function() {
this.callParent(arguments);
var store = this.getStore();
var model = store.getModel();
var modelName = model.getName();
if (modelName === "Account") {
var tpl = this.getItemTpl();
tpl.html =
"<div class=\"x-list-item-tpl div-table\">" +
"<div class=\"div-table-row\">" +
"<div class=\"div-table-col\">{[this.applyPrimaryColumn(values)]}</div>" +
"<div class=\"div-table-col-button\">{Phone}</div>" +
"</div>" +
"<div class=\"div-table-row\">" +
"<div class=\"div-table-col\">{[this.applySecondaryColumn(values)]}</div>" +
"<div class=\"div-table-col-button\">{Web}</div>" +
"</div>" +
"</div>";
}
}
});
