Технические вопросы
7.x

Вставить элемент PhotoContainer на новый Тип записи

Доброго дня!
В стандартном типе(когда еще не создавал своих) на карточке Контакта был такой элемент: PhotoContainer.
При нового типа его вставить с мастера разделов нельзя.
Начальство очень хочет. Как можно его вставить?
Я еще новичок, поэтому буду очень рад если ответите подробно как сделать.

Нравится

12 комментариев

Здравствуйте!

Пример, как создать поле, в которое можно вставить фото:

Этот кусок кода необходимо вставлять в секцию diff в замещающий клиентский модуль схемы карточки или новый созданный модуль.

{

"operation": "insert",

"name": "PhotoContainer",

"values": {

"itemType": 7,

"wrapClass": [

"image-edit-container"

],

"layout": {

"column": 0,

"row": 0,

"rowSpan": 3,

"colSpan": 2

},

"items": []

},

"parentName": "Header",

"propertyName": "items",

"index": 7

},

{

"operation": "insert",

"name": "Photo",

"values": {

"getSrcMethod": "getSrcMethod",

"onPhotoChange": "onPhotoChange",

"beforeFileSelected": "beforeFileSelected",

"readonly": false,

"defaultImage": "http://PHOTO_PHOTO_PHOTO.PHOTO",

"generator": "ImageCustomGeneratorV2.generateCustomImageControl"

},

"parentName": "PhotoContainer",

"propertyName": "items",

"index": 0

}

methods: {

getSrcMethod: function() {

var primaryImageColumnValue = this.get(this.primaryImageColumnName);

if (primaryImageColumnValue) {

return this.getSchemaImageUrl(primaryImageColumnValue);

}

return this.Terrasoft.ImageUrlBuilder.getUrl(resources.localizableImages.DefaultPhoto);

},

onPhotoChange: function(photo) {

if (!photo) {

this.set(this.primaryImageColumnName, null);

return;

}

this.Terrasoft.ImageApi.upload({

file: photo,

onComplete: this.onPhotoUploaded,

onError: this.Terrasoft.emptyFn,

scope: this

});

},

onPhotoUploaded: function(imageId) {

var imageData = {

value: imageId,

displayValue: "Photo"

};

this.set(this.primaryImageColumnName, imageData);

},

У меня в конфигурации есть:
Схема страницы редактирования раздела "Контакты" с типом "Физическое лицо"

Это сюда вставлять?

пока удалил

Нашел статью: ВОТ
Где все описано. Столкнулся вот с чем:
У меня для Контакта есть 6 страниц(схем), они сгенерились когда я создавал типы.
Для одной из них(Схема страницы редактирования раздела "Контакты" с типом "Физическое лицо"), мне надо вывести фото.
Как я понял, надо создать замещающую схему страницы, так как при сохранении чего нить на оригинале вылазят ошибки JS на каждую строку. Но столкнулся вот с чем. По стандарту bpm создал схемы в пакете Custom, и создать в этом же пакете замещающую страницу я не могу(пишет нельзя создать в одном пакете). Я создал новый пакет, но не могу его унаследовать от Custom, а ведь там мои схемы.
Как мне поступить?

Плиз хэлп!

Виктиор, пакет Custom, как раз содержит в себе все замещающие схемы и объекты. Именно в них можно вносить корректировки.

"Липатов Юрий Сергеевич" написал:

Виктиор, пакет Custom, как раз содержит в себе все замещающие схемы и объекты. Именно в них можно вносить корректировки.


Тогда очень странно. При попытке сохранить схему, вываливаются js ошибки на все строки.
вот скрин: картинко
Кругами обвел вставленый код и ошибки.

Виктор, это предупреждения.
Вы проверили функциональность кода, он работает?

В данном случае я сделал чисто для примера.
Не знал что error это предупреждение)
И так я сделал все по мануалу.
При попытке загрузить новое фото ничего не происходит. Висит дальше дефолтовая картинка.
Прилаживаю скриншоты. И код.
1
2
[javascript]
define('UsrContactType3Page', ['UsrContactType3PageResources', 'GeneralDetails'],
function(resources, GeneralDetails) {
return {
entitySchemaName: 'Contact',
details: /**SCHEMA_DETAILS*/{
"PropertyCon": {
"schemaName": "PropertyConDetail",
"entitySchemaName": "PropertyCon",
"filter": {
"detailColumn": "Contact",
"masterColumn": "Id"
}
}
}/**SCHEMA_DETAILS*/,
diff: /**SCHEMA_DIFF*/[
{
"operation": "insert",
"name": "Name",
"values": {
"layout": {
"column": 0,
"row": 0,
"colSpan": 12,
"rowSpan": 1
}
},
"parentName": "Header",
"propertyName": "items",
"index": 0
},
{
"operation": "insert",
"name": "Type",
"values": {
"layout": {
"column": 12,
"row": 1,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Type",
"caption": {
"bindTo": "Resources.Strings.TypeCaption"
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 1
},
{
"operation": "insert",
"name": "Owner",
"values": {
"layout": {
"column": 12,
"row": 0,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Owner",
"caption": {
"bindTo": "Resources.Strings.OwnerCaption"
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 2
},
{
"operation": "insert",
"name": "Job",
"values": {
"layout": {
"column": 0,
"row": 1,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Job",
"caption": {
"bindTo": "Resources.Strings.JobCaption"
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 3
},
{
"operation": "insert",
"name": "UsrDepartment",
"values": {
"layout": {
"column": 0,
"row": 2,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrDepartment",
"caption": {
"bindTo": "Resources.Strings.UsrDepartmentCaption"
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 4
},
{
"operation": "insert",
"name": "UsrCustomerTypeField",
"values": {
"layout": {
"column": 12,
"row": 2,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrCustomerTypeField",
"caption": {
"bindTo": "Resources.Strings.CustomerTypeFieldCaption"
},
"textSize": 0,
"contentType": 3,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 5
},
{
"operation": "insert",
"name": "UsrStatus",
"values": {
"layout": {
"column": 12,
"row": 3,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrStatus",
"caption": {
"bindTo": "Resources.Strings.StatusCaption"
},
"textSize": 0,
"contentType": 3,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 6
},
{
"operation": "insert",
"name": "DescMain",
"values": {
"layout": {
"column": 0,
"row": 3,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "DescMain",
"caption": {
"bindTo": "Resources.Strings.DescMainCaption"
},
"textSize": 0,
"contentType": 0,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 7
},
{
"operation": "insert",
"name": "Account",
"values": {
"layout": {
"column": 0,
"row": 4,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Account",
"caption": {
"bindTo": "Resources.Strings.AccountCaption"
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 8
},
{
"operation": "insert",
"name": "PersonContactId",
"values": {
"layout": {
"column": 12,
"row": 4,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "PersonContactId",
"caption": {
"bindTo": "Resources.Strings.PersonContactIdCaption"
},
"textSize": 0,
"contentType": 1,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "Header",
"propertyName": "items",
"index": 9
},
{
"operation": "insert",
"name": "GeneralInfoTab",
"values": {
"caption": {
"bindTo": "Resources.Strings.GeneralInfoTabCaption"
},
"items": []
},
"parentName": "Tabs",
"propertyName": "tabs",
"index": 0
},
{
"operation": "insert",
"name": "group",
"values": {
"itemType": 15,
"caption": {
"bindTo": "Resources.Strings.groupCaption"
},
"items": [],
"controlConfig": {
"collapsed": false
}
},
"parentName": "GeneralInfoTab",
"propertyName": "items",
"index": 0
},
{
"operation": "insert",
"name": "group_gridLayout",
"values": {
"itemType": 0,
"items": []
},
"parentName": "group",
"propertyName": "items",
"index": 0
},
{
"operation": "insert",
"name": "MobilePhone",
"values": {
"layout": {
"column": 0,
"row": 0,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "MobilePhone",
"caption": {
"bindTo": "Resources.Strings.MobilePhoneCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 0
},
{
"operation": "insert",
"name": "Email",
"values": {
"layout": {
"column": 12,
"row": 0,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Email",
"caption": {
"bindTo": "Resources.Strings.EmailCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 1
},
{
"operation": "insert",
"name": "Phone",
"values": {
"layout": {
"column": 0,
"row": 1,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "Phone",
"caption": {
"bindTo": "Resources.Strings.PhoneCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 2
},
{
"operation": "insert",
"name": "UsrOtherEmail",
"values": {
"layout": {
"column": 12,
"row": 1,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrOtherEmail",
"caption": {
"bindTo": "Resources.Strings.OtherEmailCaption"
},
"textSize": 0,
"contentType": 1,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 3
},
{
"operation": "insert",
"name": "UsrHomePhone",
"values": {
"layout": {
"column": 0,
"row": 2,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrHomePhone",
"caption": {
"bindTo": "Resources.Strings.HomePhoneCaption"
},
"textSize": 0,
"contentType": 1,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 4
},
{
"operation": "insert",
"name": "BirthDate",
"values": {
"layout": {
"column": 12,
"row": 2,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "BirthDate",
"caption": {
"bindTo": "Resources.Strings.BirthDateCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 5
},
{
"operation": "insert",
"name": "UsrOtherPhone",
"values": {
"layout": {
"column": 0,
"row": 3,
"colSpan": 12,
"rowSpan": 1
},
"bindTo": "UsrOtherPhone",
"caption": {
"bindTo": "Resources.Strings.OtherPhoneCaption"
},
"textSize": 0,
"contentType": 1,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 6
},
{
"operation": "insert",
"name": "DoNotUseEmail",
"values": {
"layout": {
"column": 12,
"row": 3,
"colSpan": 6,
"rowSpan": 1
},
"bindTo": "DoNotUseEmail",
"caption": {
"bindTo": "Resources.Strings.DoNotUseEmailCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 7
},
{
"operation": "insert",
"name": "DoNotUseCall",
"values": {
"layout": {
"column": 18,
"row": 3,
"colSpan": 6,
"rowSpan": 1
},
"bindTo": "DoNotUseCall",
"caption": {
"bindTo": "Resources.Strings.DoNotUseCallCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 8
},
{
"operation": "insert",
"name": "UsrRegAdress",
"values": {
"layout": {
"column": 0,
"row": 4,
"colSpan": 24,
"rowSpan": 1
},
"bindTo": "UsrRegAdress",
"caption": {
"bindTo": "Resources.Strings.RegAdressCaption"
},
"textSize": 0,
"contentType": 1,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 9
},
{
"operation": "insert",
"name": "Address",
"values": {
"layout": {
"column": 0,
"row": 5,
"colSpan": 24,
"rowSpan": 1
},
"bindTo": "Address",
"caption": {
"bindTo": "Resources.Strings.AddressCaption"
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 10
},
{
"operation": "insert",
"name": "UsrCurrentLoans",
"values": {
"layout": {
"column": 0,
"row": 6,
"colSpan": 24,
"rowSpan": 1
},
"bindTo": "UsrCurrentLoans",
"caption": {
"bindTo": "Resources.Strings.CurrentLoansCaption"
},
"textSize": 0,
"contentType": 0,
"labelConfig": {
"visible": true
},
"enabled": true
},
"parentName": "group_gridLayout",
"propertyName": "items",
"index": 11
},
{
"operation": "insert",
"name": "PropertyCon",
"values": {
"itemType": 2
},
"parentName": "GeneralInfoTab",
"propertyName": "items",
"index": 1
},
// Контейнер-обертка, в который будет размещен логотип контрагента.
{
"operation": "insert",
"parentName": "Header",
"propertyName": "items",
"name": "PhotoContainer",
"values": {
// Тип элемента - контейнер.
"itemType": Terrasoft.ViewItemType.CONTAINER,
"wrapClass": ["image-edit-container"],
"layout": { "column": 0, "row": 0, "rowSpan": 4, "colSpan": 4 },
"items": []
}
},
// Поле [Picture] — поле с логотипом контрагента.
{
"operation": "insert",
"parentName": "PhotoContainer",
"propertyName": "items",
"name": "Picture",
"values": {
// Наименование метода, который получает изображение по ссылке.
"getSrcMethod": "getAccountImage",
// Наименование метода, который вызывается при изменении изображения.
"onPhotoChange": "onPhotoChange",
// Свойство, которое определяет возможность редактирования (изменения, удаления) изображения.
"readonly": false,
// Изображение, которое будет отображаться по умолчанию.
"defaultImage": Terrasoft.ImageUrlBuilder.getUrl(resources.localizableImages.DefaultPhoto),
// Генератор элемента управления.
"generator": "ImageCustomGeneratorV2.generateCustomImageControl"
}
}
]/**SCHEMA_DIFF*/,
attributes: {},
methods: {
// Возвращает url логотипа контрагента по ссылке, сохраненной в объекте.
getAccountImage: function () {
// Получаем ссылку на изображение из колонки объекта.
var imageColumnValue = this.get("PhotoClient");
// Если ссылка установлена, то возвращает url файла с изображением.
// Если нет, то вызывает метод, возвращающий изображение по умолчанию.
if (imageColumnValue) {
return this.getSchemaImageUrl(imageColumnValue);
}
return this.getAccountDefaultImage();
},
// Возвращает url логотипа контрагента по умолчанию.
getAccountDefaultImage: function () {
return this.Terrasoft.ImageUrlBuilder.getUrl(this.get("Resources.Images.DefaultPhoto"));
},
// Обрабатывает изменение логотипа контрагента. В качестве параметра принимает файл с изображением.
onPhotoChange: function (photo) {
if (!photo) {
this.set("PhotoClient", null);
return;
}
// Выполняется загрузка файла в базу данных. По окончании загрузки вызывается метод, который
// сохраняет ссылку на измененное изображение в колонке [Логотип] объекта [Контрагент].
this.Terrasoft.ImageApi.upload({
file: photo,
onComplete: this.onPhotoUploaded,
onError: this.Terrasoft.emptyFn,
scope: this
});
},
// Метод, который сохраняет ссылку на измененное изображение. В качестве параметра передается Id
// сохраненного файла из базы данных.
onPhotoUploaded: function (imageId) {
var imageData = {
value: imageId,
displayValue: "Image"
};
// Полю с изображением присваивается ссылка на изображение.
this.set("PhotoClient", imageData);
}

},
rules: {},
userCode: {}
};
});

[/javascript]

Виктор, для раздела «Контакты» загрузка фото уже было ранее реализовано. См. «ContactPageV2». Делайте аналогично и все получится.
Статья на SDK рассчитана на другие разделы, кроме раздела контакты, так как в других разделах похожего функционала просто нет.
Для раздела «Контакты» тут есть свои нюансы.

Например, убедитесь, что в колонке «Изображение» объекта «Контакт» выбрана пользовательская колонка (например, "PhotoClient"), а не базовая. Должно помочь. См. пикчу

Спасибо!

Показать все комментарии