Просмотр исходного кода

Fixed dashboard import view, did not hide search results

Torkel Ödegaard 11 лет назад
Родитель
Сommit
3157fc651d
3 измененных файлов с 85 добавлено и 108 удалено
  1. 9 12
      src/app/directives/dashEditLink.js
  2. 3 2
      src/app/directives/dashUpload.js
  3. 73 94
      src/app/partials/search.html

+ 9 - 12
src/app/directives/dashEditLink.js

@@ -42,26 +42,23 @@ function (angular, $) {
             }
           }
 
-          scope.onAppEvent('hide-dash-editor', function() {
-            if (editorScope) {
-              editorScope.dismiss();
-            }
-          });
+          function hideEditorPane() {
+            if (editorScope) { editorScope.dismiss(); }
+          }
+
+          scope.onAppEvent("dashboard-loaded", hideEditorPane);
+          scope.onAppEvent('hide-dash-editor', hideEditorPane);
 
           scope.onAppEvent('show-dash-editor', function(evt, payload) {
-            if (lastEditor === payload.src) {
-              editorScope.dismiss();
-              return;
-            }
+            hideEditorPane();
 
-            if (editorScope) {
-              editorScope.dismiss();
-            }
+            if (lastEditor === payload.src) { return; }
 
             scope.exitFullscreen();
 
             lastEditor = payload.src;
             editorScope = payload.scope ? payload.scope.$new() : scope.$new();
+
             editorScope.dismiss = function() {
               editorScope.$destroy();
               elem.empty();

+ 3 - 2
src/app/directives/dashUpload.js

@@ -15,8 +15,9 @@ function (angular) {
           var readerOnload = function() {
             return function(e) {
               var dashboard = JSON.parse(e.target.result);
-              scope.emitAppEvent('setup-dashboard', dashboard);
-              scope.$apply();
+              scope.$apply(function() {
+                scope.emitAppEvent('setup-dashboard', dashboard);
+              });
             };
           };
           for (var i = 0, f; f = files[i]; i++) {

+ 73 - 94
src/app/partials/search.html

@@ -1,105 +1,84 @@
-  <style>
-    #grafana-search {
-      position: fixed;
-      right: 0;
-      left: 0;
-      top: 39px;
-      margin-right: auto;
-      margin-left: auto;
-      /* give it dimensions */
-      min-height: 10em;
-      width: 90%;
-    }
-  </style>
-	<div ng-controller="SearchCtrl" ng-init="init()">
-		<div class="dashboard-editor-header">
-			<div class="dashboard-editor-title" style="border: 0; line-height: 41px;">
-				<i class="icon icon-search"></i>
-				Search
+<div ng-controller="SearchCtrl" ng-init="init()">
+
+	<div class="dashboard-editor-header">
+		<div class="dashboard-editor-title" style="border: 0; line-height: 41px;">
+			<i class="icon icon-search"></i>
+			Search
+		</div>
+
+		<div class="grafana-search-panel">
+			<div class="search-field-wrapper">
+				<button class="btn btn-success pull-right" dash-editor-link="app/partials/playlist.html" editor-scope="isolated">
+					<i class="icon-play"></i>
+					Playlist
+				</button>
+				<button class="btn btn-success pull-right" ng-click="toggleImport($event)">
+					<i class="icon-download-alt"></i>
+					Import
+				</button>
+				<button class="btn btn-success pull-right" ng-click="newDashboard()">
+					<i class="icon-th-large"></i>
+					New
+				</button>
+				<span style="position: relative;">
+					<input  type="text" placeholder="search dashboards, metrics, or graphs" xng-focus="giveSearchFocus"
+									ng-keydown="keyDown($event)" ng-model="query.query" spellcheck='false' ng-change="search()" />
+					<a class="search-tagview-switch" href="javascript:void(0);" ng-class="{'active': tagsOnly}" ng-click="showTags($event)">tags</a>
+				</span>
 			</div>
+		</div>
+	</div>
 
-			<div class="grafana-search-panel">
-				<div class="search-field-wrapper">
-					<button class="btn btn-success pull-right" dash-editor-link="app/partials/playlist.html" editor-scope="isolated">
-						<i class="icon-play"></i>
-						Playlist
-					</button>
-					<button class="btn btn-success pull-right" ng-click="toggleImport($event)">
-						<i class="icon-download-alt"></i>
-						Import
-					</button>
-					<button class="btn btn-success pull-right" ng-click="newDashboard()">
-						<i class="icon-th-large"></i>
-						New
-					</button>
-					<span style="position: relative;">
-						<input  type="text"
-						placeholder="search dashboards, metrics, or graphs"
-						xng-focus="giveSearchFocus"
-						ng-keydown="keyDown($event)"
-						ng-model="query.query" spellcheck='false'
-						ng-change="search()" />
-						<a class="search-tagview-switch" href="javascript:void(0);"
-							ng-class="{'active': tagsOnly}"
-							ng-click="showTags($event)">tags</a>
-					</span>
-				</div>
+	<div ng-if="!showImport">
+		<h6 ng-hide="results.dashboards.length">No dashboards matching your query were found.</h6>
+		<div class="search-results-container" ng-if="tagsOnly">
+			<div ng-repeat="tag in results.tags" class="pointer" style="width: 180px; float: left;"
+				ng-class="{'selected': $index === selectedIndex }"
+				ng-click="filterByTag(tag.term, $event)">
+				<a class="search-result-tag label label-tag" tag-color-from-name>
+					<i class="icon icon-tag"></i>
+					<span>{{tag.term}} &nbsp;({{tag.count}})</span>
+				</a>
 			</div>
+		</div>
 
-				<h6 ng-hide="results.dashboards.length">No dashboards matching your query were found.</h6>
+		<div class="search-results-container" ng-if="!tagsOnly">
+			<div class="search-result-item pointer" bindonce ng-repeat="row in results.dashboards"
+				ng-class="{'selected': $index === selectedIndex }" ng-click="goToDashboard(row.id)">
 
-				<div class="search-results-container" ng-if="tagsOnly">
-					<div ng-repeat="tag in results.tags" class="pointer" style="width: 180px; float: left;"
-						ng-class="{'selected': $index === selectedIndex }"
-						ng-click="filterByTag(tag.term, $event)">
-						<a class="search-result-tag label label-tag" tag-color-from-name>
-							<i class="icon icon-tag"></i>
-							<span>{{tag.term}} &nbsp;({{tag.count}})</span>
-						</a>
-					</div>
+				<div class="search-result-actions small">
+					<a ng-click="shareDashboard(row.id, row.id, $event)" config-modal="app/partials/dashLoaderShare.html">
+						<i class="icon-share"></i> share &nbsp;&nbsp;&nbsp;
+					</a>
+					<a ng-click="deleteDashboard(row.id, $event)">
+						<i class="icon-remove"></i> delete
+					</a>
 				</div>
 
-				<div class="search-results-container" ng-if="!tagsOnly">
-					<div class="search-result-item pointer"
-							bindonce ng-repeat="row in results.dashboards"
-							ng-class="{'selected': $index === selectedIndex }" ng-click="goToDashboard(row.id)">
-
-							<div class="search-result-actions small">
-								<a ng-click="shareDashboard(row.id, row.id, $event)" config-modal="app/partials/dashLoaderShare.html">
-									<i class="icon-share"></i> share &nbsp;&nbsp;&nbsp;
-								</a>
-								<a ng-click="deleteDashboard(row.id, $event)">
-									<i class="icon-remove"></i> delete
-								</a>
-							</div>
-
-							<div class="search-result-tags">
-								<a ng-click="filterByTag(tag, $event)" ng-repeat="tag in row.tags" tag-color-from-name  class="label label-tag">
-									{{tag}}
-								</a>
-							</div>
-
-							<a class="search-result-link">
-								<i class="icon icon-th-large"></i>
-								<span bo-text="row.title"></span>
-							</a>
-
-					</div>
+				<div class="search-result-tags">
+					<a ng-click="filterByTag(tag, $event)" ng-repeat="tag in row.tags" tag-color-from-name  class="label label-tag">
+						{{tag}}
+					</a>
 				</div>
 
-      </div>
-    </li>
+				<a class="search-result-link">
+					<i class="icon icon-th-large"></i>
+					<span bo-text="row.title"></span>
+				</a>
 
-    <li ng-if="showImport" style="margin: 20px;">
-      <div class="editor-row">
-        <div class="section">
-          <div class="editor-option">
-            <h5>Local File <tip>Load dashboard JSON layout from file</tip></h5>
-            <form>
-              <input type="file" id="dashupload" dash-upload /><br>
-            </form>
-          </div>
-        </div>
-      </div>
-    </li>
+			</div>
 		</div>
+	</div>
+
+	<div class="editor-row" ng-if="showImport">
+		<div class="section">
+			<div class="editor-option">
+				<h5>Local File <tip>Load dashboard JSON layout from file</tip></h5>
+				<form>
+					<input type="file" id="dashupload" dash-upload/><br>
+				</form>
+			</div>
+		</div>
+	</div>
+
+</div>