Commit c521182c by Torkel Ödegaard

feat(plugins): more work on plugins list/edit view

parent 8db7cf49
package dtos package dtos
import ( import "github.com/grafana/grafana/pkg/plugins"
"github.com/grafana/grafana/pkg/models"
"github.com/grafana/grafana/pkg/plugins"
)
type PluginSetting struct { type PluginSetting struct {
Name string `json:"name"` Name string `json:"name"`
AppId string `json:"appId"` PluginId string `json:"pluginId"`
Enabled bool `json:"enabled"` Enabled bool `json:"enabled"`
Pinned bool `json:"pinned"` Pinned bool `json:"pinned"`
Module string `json:"module"` Module string `json:"module"`
...@@ -26,24 +23,3 @@ type PluginListItem struct { ...@@ -26,24 +23,3 @@ type PluginListItem struct {
Pinned bool `json:"pinned"` Pinned bool `json:"pinned"`
Info *plugins.PluginInfo `json:"info"` Info *plugins.PluginInfo `json:"info"`
} }
func NewPluginSettingDto(def *plugins.AppPlugin, data *models.PluginSetting) *PluginSetting {
dto := &PluginSetting{
AppId: def.Id,
Name: def.Name,
Info: &def.Info,
Module: def.Module,
BaseUrl: def.BaseUrl,
Pages: def.Pages,
Includes: def.Includes,
}
if data != nil {
dto.Enabled = data.Enabled
dto.Pinned = data.Pinned
dto.Info = &def.Info
dto.JsonData = data.JsonData
}
return dto
}
...@@ -72,7 +72,7 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) { ...@@ -72,7 +72,7 @@ func setIndexViewData(c *middleware.Context) (*dtos.IndexViewData, error) {
data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{ data.MainNavLinks = append(data.MainNavLinks, &dtos.NavLink{
Text: "Plugins", Text: "Plugins",
Icon: "icon-gf icon-gf-apps", Icon: "icon-gf icon-gf-apps",
Url: setting.AppSubUrl + "/apps", Url: setting.AppSubUrl + "/plugins",
}) })
} }
......
...@@ -38,15 +38,34 @@ func GetPluginList(c *middleware.Context) Response { ...@@ -38,15 +38,34 @@ func GetPluginList(c *middleware.Context) Response {
func GetPluginSettingById(c *middleware.Context) Response { func GetPluginSettingById(c *middleware.Context) Response {
pluginId := c.Params(":pluginId") pluginId := c.Params(":pluginId")
if pluginDef, exists := plugins.Apps[pluginId]; !exists { if def, exists := plugins.Plugins[pluginId]; !exists {
return ApiError(404, "PluginId not found, no installed plugin with that id", nil) return ApiError(404, "Plugin not found, no installed plugin with that id", nil)
} else { } else {
dto := &dtos.PluginSetting{
PluginId: def.Id,
Name: def.Name,
Info: &def.Info,
}
if app, exists := plugins.Apps[pluginId]; exists {
dto.Pages = app.Pages
dto.Includes = app.Includes
dto.BaseUrl = app.BaseUrl
dto.Module = app.Module
}
query := m.GetPluginSettingByIdQuery{PluginId: pluginId, OrgId: c.OrgId} query := m.GetPluginSettingByIdQuery{PluginId: pluginId, OrgId: c.OrgId}
if err := bus.Dispatch(&query); err != nil { if err := bus.Dispatch(&query); err != nil {
return ApiError(500, "Failed to get login settings", nil) if err != m.ErrPluginSettingNotFound {
return ApiError(500, "Failed to get login settings", nil)
}
} else {
dto.Enabled = query.Result.Enabled
dto.Pinned = query.Result.Pinned
dto.JsonData = query.Result.JsonData
} }
return Json(200, dtos.NewPluginSettingDto(pluginDef, query.Result)) return Json(200, dto)
} }
} }
......
<navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin"> <navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin">
<nav-button title="Orgs" title-url="admin/orgs" icon="icon-gf icon-gf-users"></nav-button> <a href="admin/orgs" class="navbar-page-btn">
<i class="icon-gf icon-gf-users"></i>
Orgs
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
......
<navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin"> <navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin">
<nav-button title="Users" title-url="admin/users" icon="icon-gf icon-gf-users"></nav-button> <a href="admin/users" class="navbar-page-btn">
<i class="icon-gf icon-gf-users"></i>
Users
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
......
<navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin"> <navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin">
<nav-button title="Users" title-url="admin/users" icon="icon-gf icon-gf-users"></nav-button> <a href="admin/users" class="navbar-page-btn">
<i class="icon-gf icon-gf-users"></i>
Users
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
......
<navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin"> <navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin">
<nav-button title="Orgs" title-url="admin/orgs" icon="icon-gf icon-gf-users"></nav-button> <a href="admin/orgs" class="navbar-page-btn">
<i class="icon-gf icon-gf-users"></i>
Orgs
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
......
<navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin"> <navbar icon="fa fa-fw fa-cogs" title="Admin" title-url="admin">
<nav-button title="Users" title-url="admin/users" icon="icon-gf icon-gf-users"></nav-button> <a href="admin/users" class="navbar-page-btn">
<i class="icon-gf icon-gf-users"></i>
Users
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
......
...@@ -22,8 +22,8 @@ ...@@ -22,8 +22,8 @@
<table class="filter-table" ng-if="ctrl.datasources.length > 0"> <table class="filter-table" ng-if="ctrl.datasources.length > 0">
<thead> <thead>
<tr> <tr>
<th><strong>Name</strong></th> <th><strong>name</strong></th>
<th><strong>Url</strong></th> <th><strong>url</strong></th>
<th style="width: 60px;"></th> <th style="width: 60px;"></th>
<th style="width: 85px;"></th> <th style="width: 85px;"></th>
<th style="width: 44px;"></th> <th style="width: 44px;"></th>
......
<navbar title="Plugins" title-url="Plugins" icon="icon-gf icon-gf-apps"> <navbar title="Plugins" title-url="plugins" icon="icon-gf icon-gf-apps">
<a href="plugins/apps" class="navbar-page-btn">
<i class="fa fa-cubes"></i>
Apps
</a>
</navbar> </navbar>
<div class="page-container"> <div class="page-container">
<div class="flex-container"> <div class="page-header">
<div class="flex-column app-edit-logo-box"> <img class="page-header-logo" src="{{ctrl.model.info.logos.large}}">
<img src="{{ctrl.appModel.info.logos.large}}"> <h1>
</div> {{ctrl.model.name}}
<div class="flex-column"> </h1>
<h1>
{{ctrl.appModel.name}}
</h1>
<div class="app-edit-description">
{{ctrl.appModel.info.description}}<br>
<span style="small">
Version: {{ctrl.appModel.info.version}} &nbsp; &nbsp; Updated: {{ctrl.appModel.info.updated}}
</span>
</div>
<div class="form-inline">
<editor-checkbox text="Enabled" model="ctrl.appModel.enabled" change="ctrl.toggleEnabled()"></editor-checkbox>
&nbsp; &nbsp; &nbsp;
<editor-checkbox text="Pinned" model="ctrl.appModel.pinned" change="ctrl.togglePinned()"></editor-checkbox>
</div>
</div>
<div class="flex-column">
<ul class="app-edit-links">
<li>
By <a href="{{ctrl.appModel.info.author.url}}" class="external-link" target="_blank">{{ctrl.appModel.info.author.name}}</a>
</li>
<li ng-repeat="link in ctrl.appModel.info.links">
<a href="{{link.url}}" class="external-link" target="_blank">{{link.name}}</a>
</li>
</ul>
</div>
</div> </div>
<section class="simple-box"> <div class="flex-container">
<h3 class="simple-box-header">Included with app:</h3> <div class="app-edit-description">
<div class="flex-container"> {{ctrl.model.info.description}}<br>
<div class="simple-box-body simple-box-column"> <span style="small">
<div class="simple-box-column-header"> Version: {{ctrl.model.info.version}} &nbsp; &nbsp; Updated: {{ctrl.model.info.updated}}
<i class="fa fa-th-large"></i> </span>
Dashboards
</div>
<ul>
<li><em class="small">None</em></li>
</ul>
</div>
<div class="simple-box-body simple-box-column">
<div class="simple-box-column-header">
<i class="fa fa-line-chart"></i>
Panels
</div>
<ul>
<li ng-show="!ctrl.includedPanels.length"><em class="small">None</em></li>
<li ng-repeat="panel in ctrl.includedPanels">
{{panel.name}}
</li>
</ul>
</div>
<div class="simple-box-body simple-box-column">
<div class="simple-box-column-header">
<i class="fa fa-database"></i>
Datasources
</div>
<ul>
<li ng-show="!ctrl.includedDatasources.length"><em class="small">None</em></li>
<li ng-repeat="ds in ctrl.includedDatasources">
{{ds.name}}
</li>
</ul>
</div>
<div class="simple-box-body simple-box-column">
<div class="simple-box-column-header">
<i class="fa fa-files-o"></i>
Pages
</div>
<ul>
<li ng-repeat="page in ctrl.appModel.pages">
<a href="apps/{{ctrl.appId}}/page/{{page.slug}}" class="external-link">{{page.name}}</a>
</li>
</ul>
</div>
</div>
</section>
<section class="simple-box">
<h3 class="simple-box-header">Dependencies:</h3>
<div class="simple-box-body">
Grafana 2.6.x
</div> </div>
</section>
<section class="simple-box"> <div class="form-inline">
<h3 class="simple-box-header">Configuration:</h3> <editor-checkbox text="Enabled" model="ctrl.model.enabled" change="ctrl.toggleEnabled()"></editor-checkbox>
<div class="simple-box-body"> &nbsp; &nbsp; &nbsp;
<div ng-if="ctrl.appModel.appId"> <editor-checkbox text="Pinned" model="ctrl.model.pinned" change="ctrl.togglePinned()"></editor-checkbox>
<plugin-component type="app-config-ctrl"></plugin-component>
<div class="clearfix"></div>
<button type="submit" class="btn btn-success" ng-click="ctrl.update()">Save</button>
</div>
</div> </div>
</section> </div>
<div class="flex-column">
<ul class="app-edit-links">
<li>
By <a href="{{ctrl.model.info.author.url}}" class="external-link" target="_blank">{{ctrl.model.info.author.name}}</a>
</li>
<li ng-repeat="link in ctrl.model.info.links">
<a href="{{link.url}}" class="external-link" target="_blank">{{link.name}}</a>
</li>
</ul>
</div>
</div> </div>
<!-- <section class="simple&#45;box"> -->
<!-- <h3 class="simple&#45;box&#45;header">Included with app:</h3> -->
<!-- <div class="flex&#45;container"> -->
<!-- <div class="simple&#45;box&#45;body simple&#45;box&#45;column"> -->
<!-- <div class="simple&#45;box&#45;column&#45;header"> -->
<!-- <i class="fa fa&#45;th&#45;large"></i> -->
<!-- Dashboards -->
<!-- </div> -->
<!-- <ul> -->
<!-- <li><em class="small">None</em></li> -->
<!-- </ul> -->
<!-- </div> -->
<!-- <div class="simple&#45;box&#45;body simple&#45;box&#45;column"> -->
<!-- <div class="simple&#45;box&#45;column&#45;header"> -->
<!-- <i class="fa fa&#45;line&#45;chart"></i> -->
<!-- Panels -->
<!-- </div> -->
<!-- <ul> -->
<!-- <li ng&#45;show="!ctrl.includedPanels.length"><em class="small">None</em></li> -->
<!-- <li ng&#45;repeat="panel in ctrl.includedPanels"> -->
<!-- {{panel.name}} -->
<!-- </li> -->
<!-- </ul> -->
<!-- </div> -->
<!-- <div class="simple&#45;box&#45;body simple&#45;box&#45;column"> -->
<!-- <div class="simple&#45;box&#45;column&#45;header"> -->
<!-- <i class="fa fa&#45;database"></i> -->
<!-- Datasources -->
<!-- </div> -->
<!-- <ul> -->
<!-- <li ng&#45;show="!ctrl.includedDatasources.length"><em class="small">None</em></li> -->
<!-- <li ng&#45;repeat="ds in ctrl.includedDatasources"> -->
<!-- {{ds.name}} -->
<!-- </li> -->
<!-- </ul> -->
<!-- </div> -->
<!-- <div class="simple&#45;box&#45;body simple&#45;box&#45;column"> -->
<!-- <div class="simple&#45;box&#45;column&#45;header"> -->
<!-- <i class="fa fa&#45;files&#45;o"></i> -->
<!-- Pages -->
<!-- </div> -->
<!-- <ul> -->
<!-- <li ng&#45;repeat="page in ctrl.model.pages"> -->
<!-- <a href="apps/{{ctrl.appId}}/page/{{page.slug}}" class="external&#45;link">{{page.name}}</a> -->
<!-- </li> -->
<!-- </ul> -->
<!-- </div> -->
<!-- -->
<!-- </div> -->
<!-- </section> -->
<!-- -->
<!-- <section class="simple&#45;box"> -->
<!-- <h3 class="simple&#45;box&#45;header">Dependencies:</h3> -->
<!-- <div class="simple&#45;box&#45;body"> -->
<!-- Grafana 2.6.x -->
<!-- </div> -->
<!-- </section> -->
<!-- -->
<!-- <section class="simple&#45;box"> -->
<!-- <h3 class="simple&#45;box&#45;header">Configuration:</h3> -->
<!-- <div class="simple&#45;box&#45;body"> -->
<!-- <div ng&#45;if="ctrl.model.appId"> -->
<!-- <plugin&#45;component type="app&#45;config&#45;ctrl"></plugin&#45;component> -->
<!-- <div class="clearfix"></div> -->
<!-- <button type="submit" class="btn btn&#45;success" ng&#45;click="ctrl.update()">Save</button> -->
<!-- </div> -->
<!-- </div> -->
<!-- </section> -->
<!-- -->
<!-- -->
<!-- </div> -->
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
@import "pages/playlist"; @import "pages/playlist";
@import "pages/admin"; @import "pages/admin";
@import "pages/alerting"; @import "pages/alerting";
@import "pages/apps"; @import "pages/plugins";
@import "pages/signup"; @import "pages/signup";
@import "pages/styleguide"; @import "pages/styleguide";
......
...@@ -27,6 +27,10 @@ ...@@ -27,6 +27,10 @@
background-image: linear-gradient(60deg, transparent 70%, darken($page-bg, 4%) 98%) background-image: linear-gradient(60deg, transparent 70%, darken($page-bg, 4%) 98%)
} }
.page-header-logo {
max-width: 7rem;
}
.page-header { .page-header {
padding: $spacer 0 $spacer/2 0; padding: $spacer 0 $spacer/2 0;
display: flex; display: flex;
......
.app-edit-logo-box {
padding: 1.2rem;
background: $panel-bg;
text-align: center;
img {
max-width: 7rem;
}
margin-right: 2rem;
}
.app-edit-links {
list-style: none;
margin: 0 0 0 2rem;
li {
background: $panel-bg;
margin-top: 4px;
padding: 0.2rem 1rem;
}
}
.app-edit-description {
font-style: italic;
margin-bottom: 1.5rem;
}
// .app-edit-logo-box {
// padding: 1.2rem;
// background: $panel-bg;
// text-align: center;
// img {
// max-width: 7rem;
// }
// margin-right: 2rem;
// }
//
// .app-edit-links {
// list-style: none;
// margin: 0 0 0 2rem;
//
// li {
// background: $panel-bg;
// margin-top: 4px;
// padding: 0.2rem 1rem;
// }
// }
//
// .app-edit-description {
// font-style: italic;
// margin-bottom: 1.5rem;
// }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment