代码拉取完成，页面将自动刷新
The following JSON document describes a single board along with its layout, gadgets and their properites.
{
"board": [
{
"title": "Board Sample 1",
"structure": "3-6-3",
"id": 9,
"boardInstanceId": 1,
"rows": [
{
"columns": [
{
"styleClass": "three wide",
"gadgets": [
{
"componentType": "NewsGadgetComponent",
"name": "News",
"description": "What's new",
"icon": "images/news.png",
"instanceId": 1500253814523,
"tags": [
{
"facet": "Informational",
"name": "news"
},
{
"facet": "List",
"name": "news"
}
],
"config": {
"propertyPages": [
{
"displayName": "Run",
"groupId": "run",
"position": 10,
"properties": [
{
"value": "news",
"key": "endpoint",
"label": "News URL",
"required": false,
"order": 3,
"controlType": "dynamicdropdown"
},
{
"value": "News",
"key": "title",
"label": "Title",
"required": false,
"order": 1,
"controlType": "textbox"
},
{
"value": 2,
"key": "instanceId",
"required": false,
"order": -1,
"controlType": "hidden"
}
]
}
]
}
}
]
},
{
"styleClass": "six wide",
"gadgets": [
{
"componentType": "CPUGadgetComponent",
"name": "CPU Chart",
"description": "Monitors CPU utilization for application.",
"icon": "images/cpu.png",
"instanceId": 1499912922910,
"tags": [
{
"facet": "Performance",
"name": "real-time"
},
{
"facet": "Chart",
"name": "bar"
}
],
"config": {
"propertyPages": [
{
"displayName": "Run",
"groupId": "run",
"position": 10,
"properties": [
{
"value": "CPU Utilization",
"key": "title",
"label": "Title",
"required": false,
"order": 1,
"controlType": "textbox"
},
{
"value": "Carlosappliance - Process Monitor",
"key": "endpoint",
"label": "API Endpoints",
"required": false,
"order": 3,
"controlType": "dynamicdropdown"
},
{
"value": 999,
"key": "instanceId",
"required": false,
"order": -1,
"controlType": "hidden"
}
]
},
{
"displayName": "Chart",
"groupId": "chart",
"position": 11,
"properties": [
{
"value": true,
"key": "chart_properties",
"label": "Show chart details",
"required": false,
"order": 3,
"controlType": "checkbox"
}
]
}
]
}
},
{
"componentType": "TrendGadgetComponent",
"name": "Trend",
"description": "General trends.",
"icon": "images/trend.png",
"instanceId": 1499912901569,
"tags": [
{
"facet": "Performance",
"name": "trend"
},
{
"facet": "Chart",
"name": "area"
}
],
"config": {
"propertyPages": [
{
"displayName": "Run",
"groupId": "run",
"position": 10,
"properties": [
{
"value": "Devappliance",
"key": "endpoint",
"label": "API Endpoints",
"required": false,
"order": 2,
"controlType": "dynamicdropdown"
},
{
"value": "Trend",
"key": "title",
"label": "Title",
"required": false,
"order": 1,
"controlType": "textbox"
},
{
"value": 2,
"key": "instanceId",
"required": false,
"order": -1,
"controlType": "hidden"
}
]
},
{
"displayName": "Chart",
"groupId": "chart",
"position": 11,
"properties": [
{
"value": true,
"key": "chart_properties",
"label": "Show chart details",
"required": false,
"order": 3,
"controlType": "checkbox"
}
]
}
]
}
}
]
},
{
"styleClass": "three wide",
"gadgets": []
}
]
}
]
}
]
}
Note: This project is under heavy construction and is not intended for general production use yet. As such, we are not accepting bugs at the moment and documentation is quite lacking.
This is an angular (ngx) based dashboard framework that is inspired by JIRA's dashboard implementation and https://github.com/angular-dashboard-framework/angular-dashboard-framework
The primary projects leveraged:
Features:
The code includes a very simple Todo gadget that can be used as an example for getting started developing your own gadget. The following steps uses that Todo Gadget as a reference. You focus on defining the gadget and the rest of the framework will deal with making it available to the Add Gadget Modal, drag and drop, instance creation, tracking, persistence and cleanup, etc.
The model is used to dynamically create and render the gadget and its property page forms. This model is an entry into a model array used for all gadgets. You will simply add an entry to the model's array. See the Todo entry. Add an entry for the gadget in the library model array gadget-library-model.json
Add an entry for your gadget in the factory gadget class gadget-factory.ts
Define an image/icon for your gadget todo.png
This project was generated with Angular CLI version 7.x.
Clone this repository then run npm install
Run ng serve for a dev server. Navigate to http://localhost:4200/. The app will automatically reload if you change any of the source files.
Run ng build to build the project. The build artifacts will be stored in the dist/ directory. Use the --aot --prod flag for ahead of time compilation and production mode.
The title of that issue suggests an issue with AOT but in my testing --prod seems to be the problem.
Run ng test to execute the unit tests via Karma.
Run ng e2e to execute the end-to-end tests via Protractor.
Before running the tests make sure you are serving the app via ng serve.
This project uses the compodoc project : https://github.com/compodoc/compodoc
Run npm install -g @compodoc/compodoc to install compodoc globally
Run compodoc -p tsconfig.json -n 'NGX Dynamic Dashboard Framework' to generate the documentation. It will be placed in the documentation folder
Run compodoc -s to serve up the documentation site at http://localhost:8080
There is an accompanying java based backend project that serves up some of the endpoints used by the board.
https://github.com/catalogicsoftware/ngx-dynamic-dashboard-framework-microservice
It is a maven based project so you will need to do the following:
static folder of the microservice project.<directory path to maven bin folder>/mvn install from within the project's root directory.http://localhost:8080 using java -jar <path to the microservice root folder>/target/ngxdd-x.y.z.jar
To get more help on the Angular CLI use ng help or go check out the Angular CLI README.
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。