Адаптивные карты предоставляют разработчикам ботов возможность создавать свои собственные шаблоны карт, подходящие для различных сценариев. Адаптивные карты предназначены для «адаптирования» к любой среде, в которой они используются, поскольку хост-приложение получает полный контроль над презентацией. Адаптивные карты — это способ представить автономный пользовательский интерфейс пользователю в более крупном пользовательском интерфейсе, таком как клиент чата. Они включают в себя почти все функции расширенных карточек Bot Framework, а также предоставляют некоторые собственные специальные функции. Они поддерживаются в веб-чате, Microsoft Teams и даже могут использоваться вне ботов на временной шкале Windows и интерактивных сообщениях Outlook. Мы также можем отображать адаптивные карты в наших собственных приложениях.
Для получения подробной информации об адаптивной карте перейдите по этой ссылке
Примечание. Отправки адаптивных карточек отправляются как postBack, что означает, что данные отправки не отображаются в окне чата как часть беседы — они остаются на адаптивной карточке.
Для получения полных сведений об интеграции Teams с помощью Node.js (для полной сборки) щелкните ссылку ниже:
Теперь я показываю флажки с динамическими данными, предоставляя полезную нагрузку (т.е. формат json). Используя формат json, я получаю данные и отображаю их по командам.
Пример полезной нагрузки:
{
«полезная нагрузка»: {
"данные": [{
«тип»: «богатое_сообщение»,
«вложения»: [{
«contentType»: «application/vnd.microsoft.card.hero»,
"содержание": {
«текст»: «Пожалуйста, установите флажки и нажмите «одобрить» или «отклонить».»,
"Таблица": [{
“id”: 1,
«Номер»: «REQ0012198»,
«Краткое описание»: «Проблема с электронной почтой»,
"ссылка на сайт": "",
«флажок»: 1,
«requested_by»: «Системный администратор»,
«sys_id»: «2538ac8fdba9c0101ee9d001cf96190d»
}, {
“id”: 2,
«Номер»: «REQ0012199»,
«Краткое описание»: «Проблема с сетью»,
"ссылка на сайт": "",
«флажок»: 1,
«requested_by»: «Системный администратор»,
«sys_id»: «cc5820cfdba9c0101ee9d001cf961945»
}],
«кнопки»: [{
«тип»: «Обратное сообщение»,
«название»: «Утвердить»,
«значение»: «Утвердить»
}, {
«тип»: «Обратное сообщение»,
«название»: «Отклонить»,
«значение»: «Отклонить»
}]
}
}]
}]
}
}
Из приведенной выше полезной нагрузки, названия и краткого описания с комбинированным отображением в флажках.
Вот мой код Nodejs
вар с = [];
вар а = {
«тип»: «Текстовый блок»,
«текст»: response.body.payload.data[0].attachments[0].content.text
};
c.push(а);
вар т = [];
for (var i = 0; i ‹ response.body.payload.data[0].attachments[0].content.table.length; i++) {
переменные данные =
{
«тип»: «Ввод.Переключить»,
«заголовок»: response.body.payload.data[0].attachments[0].content.table[i].number +
" \n " + response.body.payload.data[0].attachments[0].content.table[i]["Краткое описание"],
«id»: response.body.payload.data[0].attachments[0].content.table[i].id,
«значение»: ложь
}
c.push(данные)
// console.log («данные», данные);
t.push(response.body.payload.data[0].attachments[0].content.table[i].id);
}
// console.log("id таблицы", t);
вар копия = [];
for (var i = 0; i ‹ response.body.payload.data[0].attachments[0].content.buttons.length; i++) {
// console.log("подтвердить", response.body.payload.data[0].attachments[0].content.table[i].id);
var action = «селектор инцидентов-» + response.body.payload.data[0].attachments[0].content.buttons[i].title;
переменная data1 = {
«тип»: «Действие.Отправить»,
// «id»: «отправить»,
«заголовок»: response.body.payload.data[0].attachments[0].content.buttons[i].title,
"данные": {
«мпары»: {
«тип»: «Обратное сообщение»,
«значение»: response.body.payload.data[0].attachments[0].content.buttons[i].value + « « + t,
«displayText»: response.body.payload.data[0].attachments[0].content.buttons[i].value,
«текст»: response.body.payload.data[0].attachments[0].content.buttons[i].value
}
}
}
cc.push(данные1)
}
var msg = новый строитель.Сообщение(сеанс)
.добавить приложение({
contentType: «application/vnd.microsoft.card.adaptive»,
содержание:
{
тип: «Адаптивная карта»,
«тело»: в,
действия: сс,
«$schema»: «http://adaptivecards.io/schemas/adaptive-card.json,
«версия»: «1.0»
}
});
Тестирование нашего бота в MS Teams
