瀏覽代碼

[search] Restyled a bit grid results, added all/current filter

Enrico Berti 11 年之前
父節點
當前提交
2df9942725
共有 3 個文件被更改,包括 27 次插入10 次删除
  1. 8 2
      apps/search/src/search/templates/search.mako
  2. 5 0
      apps/search/static/css/search.css
  3. 14 8
      apps/search/static/js/search.ko.js

+ 8 - 2
apps/search/src/search/templates/search.mako

@@ -416,7 +416,10 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
           </a>
           <input type="text" data-bind="clearable: $root.collection.template.fieldsAttributesFilter, valueUpdate:'afterkeydown'" placeholder="${_('Filter fields')}" style="width: 70%; margin-bottom: 10px" />
         </div>
-        <div style="border-bottom: 1px solid #CCC; padding-bottom: 4px">
+        <div style="margin-bottom: 8px">
+          <a href="javascript: void(0)" data-bind="click: function(){$root.collection.template.filteredAttributeFieldsAll(true)}, style: {'font-weight': $root.collection.template.filteredAttributeFieldsAll() ? 'bold': 'normal'}">${_('All')} (<span data-bind="text: $root.collection.template.fieldsAttributes().length"></span>)</a> / <a href="javascript: void(0)" data-bind="click: function(){$root.collection.template.filteredAttributeFieldsAll(false)}, style: {'font-weight': ! $root.collection.template.filteredAttributeFieldsAll() ? 'bold': 'normal'}">${_('Current')} (<span data-bind="text: $root.collection.template.fields().length"></span>)</a>
+        </div>
+        <div style="border-bottom: 1px solid #CCC; padding-bottom: 4px;">
           <a href="javascript: void(0)" class="btn btn-mini"
             data-bind="click: toggleGridFieldsSelection, css: { 'btn-inverse': $root.collection.template.fields().length > 0 }"
             style="margin-right: 2px;">
@@ -430,6 +433,9 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
             <span data-bind="text: name"></span>
           </label>
         </div>
+        <div data-bind="visible: $root.collection.template.filteredAttributeFields().length == 0" style="padding-left: 4px; padding-top: 5px; font-size: 40px; color: #CCC">
+          <i class="fa fa-frown-o"></i>
+        </div>
       </span>
     </div>
 
@@ -439,7 +445,7 @@ ${ commonheader(_('Search'), "search", user, "80px") | n,unicode }
       </div>
     
       <!-- ko if: $root.response().response -->
-        <div data-bind="template: {name: 'resultset-pagination', data: $root.response() }"></div>
+        <div data-bind="template: {name: 'resultset-pagination', data: $root.response() }" style="padding: 8px; color: #666"></div>
       <!-- /ko -->
 
       <div class="widget-spinner" data-bind="visible: $root.isRetrievingResults()">

+ 5 - 0
apps/search/static/css/search.css

@@ -500,6 +500,11 @@ body.modal-open {
 
 .result-row td {
   white-space: nowrap;
+  padding: 3px;
+}
+
+#result-container thead tr {
+  border-bottom: 1px solid #e5e5e5;
 }
 
 .demi-modal {

+ 14 - 8
apps/search/static/js/search.ko.js

@@ -504,16 +504,22 @@ var Collection = function (vm, collection) {
   self.template.fieldsModalType = ko.observable(""); // For UI
   self.template.fieldsAttributesFilter = ko.observable(""); // For UI
   self.template.filteredModalFields = ko.observableArray();
+  self.template.filteredAttributeFieldsAll = ko.observable(true);
   self.template.filteredAttributeFields = ko.computed(function() {
-	var _fields = [];
+    var _fields = [];
 
-	$.each(self.template.fieldsAttributes(), function (index, field) {
-	  if (self.template.fieldsAttributesFilter() == "" || field.name().toLowerCase().indexOf(self.template.fieldsAttributesFilter().toLowerCase()) > -1){
-	    _fields.push(field);
-	  }
-	});
-	    
-	return _fields;	  
+    var _iterable = self.template.fieldsAttributes();
+    if (!self.template.filteredAttributeFieldsAll()){
+      _iterable = self.template.fields();
+    }
+
+    $.each(_iterable, function (index, field) {
+      if (self.template.fieldsAttributesFilter() == "" || field.name().toLowerCase().indexOf(self.template.fieldsAttributesFilter().toLowerCase()) > -1){
+        _fields.push(field);
+      }
+    });
+
+    return _fields;
   });
   self.template.availableWidgetFields = ko.computed(function() {
     if (self.template.fieldsModalType() == 'histogram-widget') {