|
|
@@ -5,10 +5,59 @@ import $ from 'jquery';
|
|
|
|
|
|
var module = angular.module('grafana.directives');
|
|
|
|
|
|
+var panelTemplate = `
|
|
|
+ <div class="panel-container" ng-class="{'panel-transparent': ctrl.panel.transparent}">
|
|
|
+ <div class="panel-header">
|
|
|
+ <span class="alert-error panel-error small pointer" ng-if="ctrl.error" ng-click="ctrl.openInspector()">
|
|
|
+ <span data-placement="top" bs-tooltip="ctrl.error">
|
|
|
+ <i class="fa fa-exclamation"></i><span class="panel-error-arrow"></span>
|
|
|
+ </span>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <span class="panel-loading" ng-show="ctrl.loading">
|
|
|
+ <i class="fa fa-spinner fa-spin"></i>
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <div class="panel-title-container drag-handle" panel-menu></div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="panel-content">
|
|
|
+ <ng-transclude></ng-transclude>
|
|
|
+ </div>
|
|
|
+ <panel-resizer></panel-resizer>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="panel-full-edit" ng-if="ctrl.editMode">
|
|
|
+ <div class="gf-box">
|
|
|
+ <div class="gf-box-header">
|
|
|
+ <div class="gf-box-title">
|
|
|
+ <i ng-class="ctrl.icon"></i>
|
|
|
+ {{ctrl.name}}
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div ng-model="ctrl.editorTabIndex" bs-tabs>
|
|
|
+ <div ng-repeat="tab in ctrl.editorTabs" data-title="{{tab.title}}">
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <button class="gf-box-header-close-btn" ng-click="ctrl.exitFullscreen();">
|
|
|
+ Back to dashboard
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="gf-box-body">
|
|
|
+ <div ng-repeat="tab in ctrl.editorTabs" ng-if="ctrl.editorTabIndex === $index">
|
|
|
+ <panel-editor-tab editor-tab="tab" ctrl="ctrl" index="$index"></panel-editor-tab>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+`;
|
|
|
+
|
|
|
module.directive('grafanaPanel', function() {
|
|
|
return {
|
|
|
restrict: 'E',
|
|
|
- templateUrl: 'public/app/features/panel/partials/panel.html',
|
|
|
+ template: panelTemplate,
|
|
|
transclude: true,
|
|
|
scope: { ctrl: "=" },
|
|
|
link: function(scope, elem) {
|