浏览代码

HUE-2783 [search] Restyled definition modal

Added common message area to the dashboard too
Enrico Berti 10 年之前
父节点
当前提交
2e28c01

+ 9 - 0
apps/search/src/search/static/search/css/search.css

@@ -512,3 +512,12 @@ em {
 .datepicker {
 .datepicker {
   z-index: 1051;
   z-index: 1051;
 }
 }
+
+.qdefinitions {
+  margin-top: 5px;
+}
+
+.qdefinitions li {
+  display: inline;
+  margin-right: 10px;
+}

+ 20 - 15
apps/search/src/search/static/search/js/search.ko.js

@@ -532,14 +532,17 @@ var Collection = function (vm, collection) {
 
 
   self.selectedDocument = ko.observable({});
   self.selectedDocument = ko.observable({});
 
 
-  self.addQDefinition = function() {
+  self.newQDefinitionName = ko.observable("");
+
+  self.addQDefinition = function () {
     self.qdefinitions.push(
     self.qdefinitions.push(
-      ko.mapping.fromJS({
-        'name': 'new name',
-        'id': UUID(),
-        'data': ko.mapping.toJSON(vm.query)
-      })
+        ko.mapping.fromJS({
+          'name': self.newQDefinitionName(),
+          'id': UUID(),
+          'data': ko.mapping.toJSON(vm.query)
+        })
     );
     );
+    self.newQDefinitionName("");
   };
   };
 
 
   self.removeQDefinition = function (qdef) {
   self.removeQDefinition = function (qdef) {
@@ -550,17 +553,18 @@ var Collection = function (vm, collection) {
       }
       }
     });
     });
   }
   }
-  
-  self.loadQDefinition = function(qdefinition) {
-	var qdef = ko.mapping.fromJSON(qdefinition.data());
 
 
-	vm.query.uuid(qdef.uuid());
-	vm.query.qs(qdef.qs());
-	vm.query.fqs(qdef.fqs());
-	vm.query.start(qdef.start());
-	vm.query.selectedMultiq(qdef.selectedMultiq());
+  self.loadQDefinition = function (qdefinition) {
+    var qdef = ko.mapping.fromJSON(qdefinition.data());
 
 
-	vm.search();
+    vm.query.uuid(qdef.uuid());
+    vm.query.qs(qdef.qs());
+    vm.query.fqs(qdef.fqs());
+    vm.query.start(qdef.start());
+    vm.query.selectedMultiq(qdef.selectedMultiq());
+
+    vm.additionalInfo("<div class='center'><strong>" + qdefinition.name() + "</strong></div>");
+    vm.search();
   }
   }
  
  
   self.addFacet = function (facet_json) {
   self.addFacet = function (facet_json) {
@@ -1046,6 +1050,7 @@ var SearchViewModel = function (collection_json, query_json, initial_json) {
   self.initial = new NewTemplate(self, initial_json);
   self.initial = new NewTemplate(self, initial_json);
 
 
   // UI
   // UI
+  self.additionalInfo = ko.observable("");
   self.response = ko.observable({});
   self.response = ko.observable({});
   self.results = ko.observableArray([]);
   self.results = ko.observableArray([]);
   self.resultsHash = '';
   self.resultsHash = '';

+ 20 - 11
apps/search/src/search/templates/search.mako

@@ -1607,22 +1607,31 @@ ${ dashboard.layout_skeleton() }
         <form class="form-horizontal">
         <form class="form-horizontal">
           <fieldset>
           <fieldset>
             <legend><i class="fa fa-bookmark-o"></i> ${ _('Query definitions') }</legend>
             <legend><i class="fa fa-bookmark-o"></i> ${ _('Query definitions') }</legend>
-            <div class="control-group" data-bind="foreach: $root.collection.qdefinitions">
-              <label class="control-label" for="settingsdescription">${ _('Definition') }</label>
+            <div class="control-group">
+              <label class="control-label" for="newqname">${ _('New defition') }</label>
+              <div class="controls">
+                <div class="input-append">
+                  <input id="newqname" type="text" class="input-xlarge" data-bind="value: $root.collection.newQDefinitionName" style="margin-bottom: 0" placeholder="${ _('Name') }" />
+                  <a title="${ _('Click on this button to add the currenty query as a new definition') }" class="btn plus-btn" data-bind="click: $root.collection.addQDefinition">
+                    <i class="fa fa-plus"></i>
+                  </a>
+                </div>
+              </div>
+            </div>
+            <div class="control-group" data-bind="visible: $root.collection.qdefinitions().length > 0">
+              <label class="control-label" for="settingsdescription">${ _('Saved definitions') }</label>
               <div class="controls">
               <div class="controls">
-                <span data-bind="text: ko.mapping.toJSON(name)"></span>
-                <span data-bind="text: ko.mapping.toJSON(data), click: $root.collection.loadQDefinition"></span>
-                <a href="javascript: void(0)" data-bind="click: $root.collection.removeQDefinition">
-                  <i class="fa fa-times"></i>
-                </a>
+                <ul class="unstyled airy qdefinitions" data-bind="foreach: $root.collection.qdefinitions">
+                  <li>
+                    <span class="badge badge-info badge-left pointer">
+                      <i class="fa fa-bookmark"></i> <span data-bind="text: name, attr:{'title': ko.mapping.toJSON(data, null, 2)}, click: $root.collection.loadQDefinition"></span>
+                    </span><span class="badge badge-right trash-share" data-bind="click: $root.collection.removeQDefinition"> <i class="fa fa-times"></i></span></li>
+                  </li>
+                </ul>
               </div>
               </div>
-              </br>
             </div>
             </div>
           </fieldset>
           </fieldset>
 
 
-          <button title="${ _('Click on this button to add the field') }" class="btn plus-btn" data-bind="click: $root.collection.addQDefinition">
-            <i class="fa fa-plus"></i>
-          </button>
         </form>
         </form>
       </div>
       </div>
     </div>
     </div>

+ 6 - 1
desktop/core/src/desktop/static/desktop/css/common_dashboard.css

@@ -48,7 +48,7 @@
   background-color: #FFF;
   background-color: #FFF;
 }
 }
 
 
-.card-column {
+.card-column, .card-additional {
   border: none;
   border: none;
 }
 }
 
 
@@ -436,3 +436,8 @@ body.modal-open {
   font-size: 20px;
   font-size: 20px;
   margin-right: 17px;
   margin-right: 17px;
 }
 }
+
+.card-additional {
+  padding: 10px;
+  margin-bottom: 10px;
+}

+ 5 - 0
desktop/core/src/desktop/templates/common_dashboard.mako

@@ -121,6 +121,11 @@
 
 
 <div data-bind="css: {'dashboard': true, 'with-top-margin': isEditing()}">
 <div data-bind="css: {'dashboard': true, 'with-top-margin': isEditing()}">
   <div class="container-fluid">
   <div class="container-fluid">
+    <!-- ko if: $root.additionalInfo && $root.additionalInfo() != "" -->
+    <div class="row-fluid">
+      <div class="card card-additional card-home span12" data-bind="html: $root.additionalInfo"></div>
+    </div>
+    <!-- /ko -->
     <div class="row-fluid" data-bind="template: { name: 'column-template', foreach: columns}">
     <div class="row-fluid" data-bind="template: { name: 'column-template', foreach: columns}">
     </div>
     </div>
     <div class="clearfix"></div>
     <div class="clearfix"></div>