Всем доброго времени суток.
Версия 7.10.
Продолжаем постигать тайны разработки.
На этот раз задача - вызывать контрол внутри пользовательского контрола.
Есть некоторый контрол, занаследованный от GridLayout:
/**
* @class Terrasoft.controls.UsrTestSchedule
*/
Ext.define("Terrasoft.controls.UsrTestSchedule", {
extend: "Terrasoft.GridLayout",
alternateClassName: "Terrasoft.UsrTestSchedule",
});
Есть его генератор:
function(resources, Terrasoft) {
var UsrTestScheduleGenerator = Ext.define("Terrasoft.configuration.UsrTestScheduleGenerator", {
extend: "Terrasoft.ViewGenerator",
alternateClassName: "Terrasoft.UsrTestScheduleGenerator",
item1: function(){
return Ext.create("Terrasoft.Label", {
"className": "Terrasoft.Label",
"itemType": Terrasoft.ViewItemType.LABEL,
"caption": "A Panel",
"visible": true
});
},
generateUsrTestSchedule: function(config) {
var myItems = [
{ "row": 0,
"rowSpan": 1,
"column": 0,
"colSpan": 12,
"item": this.item1
},
{ "row": 0,
"rowSpan": 1,
"column": 12,
"colSpan": 12,
"item": {
"className": "Terrasoft.Label",
"name": "label2",
"itemType": Terrasoft.ViewItemType.LABEL,
"caption": "A panel 2",
"visible": true,
}
}
];
var UsrTestScheduleConfig = {
"className": "Terrasoft.UsrTestSchedule",
"id" : "grid-layout-007",
"selectors": { wrapEl: "#grid-layout-007"},
"items": myItems,
"type": "tiled",
};
return UsrTestScheduleConfig;
}
});
return Ext.create(UsrTestScheduleGenerator);
});
При создании ориентировались на документацию: https://academy.terrasoft.ru/jscoresdk/#!/api/Terrasoft.controls.GridLayout
и инструкцию https://community.terrasoft.ru/forum/topic/25285#comment-67717
По сути требуется вывести некоторую информацию (при этом для вывода в силу специфика используются собственные контролы, сейчас не о них) внутри набора из грид блоков.
На практике с помощью генератора, приведённого выше, в код добавляются грид блоки в полном соответствии с массивом myItems (см. скриншот), но без внутреннего содержимого, того, что по документации описывается как item: {}. Для примера решили там вывести просто текст внутри контрола Label.
Как правильно в этом случае подключить label и вывести текст? То, что item1 вынесена в функцию - одна из попыток.. не помогло.
Нравится
"Смородинов Денис" написал:что по документации описывается как item: {}.
Очень странно. Я бы попробовал как-то так генерировать:
[javascript]
var myItems = [
{
"layout": {
"row": 0,
"rowSpan": 1,
"column": 0,
"colSpan": 12
},
"className": "Terrasoft.Label",
"itemType": Terrasoft.ViewItemType.LABEL,
"caption": "Label1",
"visible": true
},
{
"layout": {
"row": 0,
"rowSpan": 1,
"column": 12,
"colSpan": 12
},
"className": "Terrasoft.Label",
"itemType": Terrasoft.ViewItemType.LABEL,
"caption": "Label2",
"visible": true
}
];
[/javascript]
Данила, так не съедает:
user: user/7f3b869f-34f3-4f20-ab4d-7480a5fdf647
file: undefined
line: undefined
column: undefined
message: Cannot read property 'toString' of undefined
date: Mon Jun 12 2017 16:35:57 GMT+0300 (RTZ 2 (зима))
moduleId: SectionModuleV2_UsrSchedulerTest1Section
moduleName: SectionModuleV2
"Иван Тюряков" написал:Данила, так не съедает:
Потестил на демке, вот что получилось:
[javascript]
generateControl: function(config) {
debugger;
var items=[{
"colSpan": 12,
"column": 0,
"row": 0,
"item": {
className: "Terrasoft.Container",
id: "Button-Container",
items: [{
className: "Terrasoft.Button",
style: "blue",
caption: "TOAST",
click: {bindTo: config.ButtonClick},
visible: true,
enabled: true,
safeBind: true
}]
}
},
{
"colSpan": 12,
"column": 12,
"row": 0,
"item": {
className: "Terrasoft.Container",
id: "Label-Container",
items: [{
className: "Terrasoft.Label",
caption: config.LabelCaption
}]
}
}];
var CTRLConfig = {
"className": "Terrasoft.TmGridControl",
"id" : "grid-layout-test",
"selectors": { wrapEl: "#grid-layout-test"},
"items": items,
"layout": config.layout
};
return CTRLConfig;
}
[/javascript]
В странице описываю в diff:
[javascript]
{
"operation": "insert",
"parentName": "ContactGeneralInfoBlock",
"propertyName": "items",
"name": "MyControl",
"values": {
"layout": {
"colSpan": 12,
"column": 0,
"row": 2
},
"ButtonClick": "showTestMessage",
"LabelCaption": "ТЕСТОВЫЙ LABEL",
"generator": "TmGridControlGenerator.generateControl",
"visible": true
}
}
[/javascript]
showTestMessage - пустой тестовый метод с дебагером.
В итоге всё нормально генерируется. У меня когнитивный диссонанс: ну вот почему нельзя в items запихивать одну и ту же структуру? Нафига они разворачивают всё в вид:
[javascript]
"colSpan": 12,
"column": 0,
"row": 0,
"item": {}
[/javascript]
????? Хотя в тот же самый контейнер items надо складировать в ином виде. Блин. Ну надо же так придумать.
Возник следующий вопрос.
А возможно ли динамическое получение данных, и передача их в свой контрол?
То есть на странице что-то такого вида в диффе:
[javascript]
{
"operation": "insert",
"parentName": "IvanContainer",
"name": "UsrTestSchedule",
"propertyName": "items",
"values": {
"className": "Terrasoft.UsrTestSchedule",
"generator": "UsrTestScheduleGenerator.generateControl",
"items": {"bindTo": "contactsItems"},
"visible": true
}
},
[/javascript]
В атрибутах:
[javascript]
"contactsItems":{
dataValueType: Terrasoft.DataValueType.COLLECTION,
value: this.Ext.create("Terrasoft.Collection"),
type: Terrasoft.ViewModelColumnType.VIRTUAL_COLUMN
},
[/javascript]
И в методах:
[javascript]
var esq = this.Ext.create("Terrasoft.EntitySchemaQuery", {
rootSchemaName: "Contact"
});
esq.addColumn("Id");
esq.addColumn("Name");
esq.getEntityCollection(function (result) {
if (!result.success) {
console.log("UsrTestScheduleGenerator: wrapContacts: ESQ error -" + result);
return;
}
this.set("contactsItems", result.collection);
}, this);
[/javascript]
В генераторе соответственно:
[javascript]
generateControl: function(config) {
var UsrTestScheduleConfig = {
className: "Terrasoft.UsrTestSchedule",
id: "grid-layout-007",
selectors: { wrapEl: "#grid-layout-007"},
items: config.items
};
return UsrTestScheduleConfig;
},
[/javascript]
В этом случае ничего не происходит. Подозреваю, что массив нельзя засунуть в виртуальную колонку. Так ли это?
"Смородинов Денис" написал:А возможно ли динамическое получение данных, и передача их в свой контрол?
Это уже что-то типа ContainerList. Там есть коллекция, которая динамически наполняется и вызывается метод onGetItemConfig при добавлении ряда.
Соответственно возможно сделать, но надо выковыривать методы/реализацию из того, что уже есть)
А я правильно понимаю, что фильтры в разделах работают также?
Если к примеру это всё подставляется на страницу раздела.
"Варфоломеев Данила" написал:Это уже что-то типа ContainerList. Там есть коллекция, которая динамически наполняется и вызывается метод onGetItemConfig при добавлении ряда.
Соответственно возможно сделать, но надо выковыривать методы/реализацию из того, что уже есть)
Данила, вопрос Дениса по сути про механизм bindTo. Строки нормально биндятся и передаются в контрол, а вот с коллекциями проблема:
[javascript]
user: user/7f3b869f-14f3-4d20-ab4d-7480a5fdf647
file: undefined
line: undefined
column: undefined
message: Cannot read property 'changeMethod' of undefined
date: Thu Jun 15 2017 17:48:10 GMT+0300 (RTZ 2 (зима))
moduleId: SectionModuleV2_UsrSchedulerTest1Section
moduleName: SectionModuleV2
[/javascript]
Я читал где то про ошибку 'changeMethod', что нужно создавать bindConfig и т.п., но не помню даже где видел. Знаете что нибудь про это?
Строка тоже нет. По сути в items отправляется нечто вида:
{bindTo:"contactsItems"}
в виде объекта. И всё.
Так что не биндить, а искать другие методы надо.