Vaadin 仪表盘

仪表盘 UI 组件在 Jmix 中集成了商业版 Vaadin 仪表盘。能将内容排列成响应式的小部件网格，用户可以在运行时移动、调整大小和移除小部件。

扩展组件提供以下功能：

  • 在视图 XML 中声明式组合仪表盘、小部件以及区域。

  • 响应式网格，能根据可用宽度调整列数，并支持配置列数、列宽、行高、间距和内边距。

  • 小部件中可以放置任何组件树，并可跨越多个列和行，除了标题之外还可以有自己的 header。

  • 可折叠的区域，用于对关联的小部件进行分组。

  • 可编辑模式，用户可以使用鼠标或键盘移动、调整大小和移除小部件，视图中能订阅这些操作的事件。

  • 通过标准 Jmix 消息机制对编辑模式控件进行本地化。

  • 在 Jmix Studio 中提供支持，可在视图设计器面板的 Vaadin Commercial 类别中找到该组件，并提供属性编辑器。

典型使用场景是结合图表、KPI 和表格的分析型落地页。另一个场景是个人工作区，用户可以在决定保留哪些小部件以及如何排列。

安装

此扩展组件需要两个订阅：

请按照 扩展组件 章节的介绍通过 Jmix 市场自动安装。

手动安装步骤：

  1. 配置 premium 仓库的访问

    • 在 build.gradle 添加 premium 仓库：

      repositories {
    // ...
    maven {
        url = 'https://global.repo.jmix.io/repository/premium'
        credentials {
            username = rootProject['premiumRepoUser']
            password = rootProject['premiumRepoPass']
        }
    }
}

    • 将 premium 仓库的凭证记录在 ~/.gradle/gradle.properties 文件中：

      premiumRepoUser=123456123456
premiumRepoPass=abcdefabcdef

      仓库的凭证可以通过许可秘钥获取：秘钥中短横前的部分为用户名，短横后的部分为密码。例如，如果你的秘钥是 123456123456-abcdefabcdef，则用户名是：123456123456，密码是 abcdefabcdef。

  2. 在 build.gradle 中添加依赖：

    implementation 'io.jmix.vcc:vaadin-dashboard-starter'

有关组件、元素、属性和 Java API 的说明，请参阅 dashboard 仪表盘。