Оформление
веб-компонент
1. Обзор
1.1 Версия
| Версия FineBI | Мобильная презентация HTML5 | Функциональные изменения |
|---|---|---|
| 6.0 | - | - |
| V11.0.83 | Оптимизация веб-компонентов для адаптации к мобильным устройствам | |
| 6.0.13 | - | Веб-компонент поддерживает передачу ${имя компонента-фильтра} в качестве параметра для динамического обновления ссылок. |
1.2 Сценарии применения
Веб-компоненты используются, когда пользователи хотят добавить ссылки на интерфейс приборной панели, отображаемые веб-страницы и другие веб-интерфейсы.
1.3 Функциональный профиль
- Поддерживается прямое добавление гиперссылок и отображение страницы под гиперссылкой, гиперссылки поддерживают удаление и замену.
- Поддержка добавления относительных путей для отображения других шаблонов/отчетов, например, /webroot/decision/view/report?viewlet=aggregate-report.cpt.
- Если текущий размер компонента не позволяет отобразить все страницы с гиперссылками, поддерживается выдвижная панель для просмотра оставшейся части страницы.
- Поддержка наведения и удаления компонентов, установка метода наведения с фильтрацией компонентов.
2. Добавление веб-компонентов
1) Как показано на рисунке ниже, выберите веб-компонент из списка Others на левой панели действий и перетащите его на интерфейс приборной панели;
2) Добавьте w ww.finebi.com, после чего эффект отображения компонентов будет выглядеть следующим образом:
3. Отображение ведомостей cpt
Веб-компонент может добавлять веб-страницы в дополнение к заполнению относительных путей для отображения других шаблонов/отчетов, как показано ниже, добавьте ссылку на веб-компонент:/webroot/decision/view/report?viewlet=aggregatedreport.cpt, компонент может отобразить агрегированный отчет.cpt в каталоге FineBI/webapps/webroot/WEB-.I NF/reportletsкаталог агрегированных отчетов.cpt.
4. Веб-компонент, передающий параметры
Если компонент фильтра существует как для приборной панели, к которой подключен веб-компонент, так и для текущей приборной панели, текущая дашборд может быть настроена на передачу значения компонента фильтра в компонент фильтра веб-компонента на приборной панели после того, как текущая дашборд добавит значение компонента фильтра.
1) Скопируйте гиперссылку на приборную панель
Создайте публичную ссылку на приборную панель, на которую должен ссылаться веб-компонент, и скопируйте ее, чтобы получить ссылку: http: //localhost:37799/webroot/decision/link/qXgA. Как показано ниже:
2） Создание веб-компонентов
Вернитесь к панели инструментов, над которой вы работаете, добавьте "Веб-компонент" и добавьте ссылку.
Добавление параметра после ссылки гарантирует, что значение компонента фильтра текущей приборной панели будет передано компоненту фильтра веб-компонента. В этой части используется абсолютная ссылка: /webroot/decision/link/qXgA?contract signing time=${year}
| Суффикс ссылки | инструкции |
|---|---|
| ? Время подписания контракта = ${год} | Текущий компонент фильтра "Год " в приборной панели передается вВ панели веб-компонента "Время подписания контракта ". |
Примечание: Если в шаблоне FR передается параметр, суффикс ссылки не совпадает с суффиксом приборной панели, а является & Время подписания контракта = ${год} .
Готовый результат выглядит так, как показано выше.
5. Подвеска
Веб-компоненты поддерживают наведение, просто нажмите следующую кнопку. Использование такое же, как и при наведении компонентов.
6. поддержка адаптивной высоты
Правила мобильной адаптации приведены в таблице ниже:
| Тип шаблона | Макет шаблона | Тип встроенного шаблона | Макет встроенного шаблона |
|---|---|---|---|
| BI | Адаптивная верстка (поля страниц представляют собой однострочные компоненты) | FR | неадаптивная криптовалюта |
| адаптивный горизонтальный | |||
| Мобильная вкладка Body "Галочка" Мобильная перепланировка | |||
| На мобильной странице Tab тела снят флажок в разделе Mobile Relay, а для масштабирования компонентов выбрано значение Horizontal Adaptive. | |||
| Снят флажок Телефон переставляется, а логика масштабирования имеет фиксированный размер |
7. Мобильный
Например, веб-компонент добавляет ссылку: www.baidu.com . Эффект для мобильных устройств показан ниже:
Пользователи могут искать контент прямо на странице. Нажмите кнопку в правом верхнем углу веб-компонента, чтобы перейти на страницу Baidu.
Кнопка "Перейти" в правом верхнем углу показана ниже:
