|
|
@@ -1,26 +1,37 @@
|
|
|
-require('../utilities/sort.js');
|
|
|
-const header = function (object) {
|
|
|
+window.sort=require('../utilities/sort');
|
|
|
+window.Header = function getHeader(object) {
|
|
|
+ this.object = object;
|
|
|
this._header = object.el || '#header';
|
|
|
this._column = object.column;
|
|
|
this._data = object.data;
|
|
|
+ this._restorationColumn = object.restorationColumn;
|
|
|
+ this._fixedTop = object.fixedTop || 0;
|
|
|
|
|
|
let _this = this;
|
|
|
let _parentNode = $(_this._header);
|
|
|
let sortType = {};
|
|
|
let columnArr = [];
|
|
|
// form fixed
|
|
|
- function parentNodeFloat() {
|
|
|
+ let _headerParent = $(_this._header+"Parent");
|
|
|
+ let _parentNodeTemp = _parentNode.clone();
|
|
|
+ function fixed() {
|
|
|
let _parentNode_top = _parentNode.offset().top;
|
|
|
let height = _parentNode.height();
|
|
|
- window.onscroll = function () {
|
|
|
+ _parentNodeTemp.css('position',"fixed");
|
|
|
+ _parentNodeTemp.css('top',_this._fixedTop+"px");
|
|
|
+ _parentNodeTemp.css('z-index',"1030");
|
|
|
+ _parentNodeTemp.css('width',_headerParent.width()+"px");
|
|
|
+ _parentNodeTemp.height(height);
|
|
|
+ _parentNodeTemp.attr('id',_this._header+"Temp");
|
|
|
+ $(_this._header+"Roll").append(_parentNodeTemp).removeClass('d-none');
|
|
|
+ $(window).scroll(function(){
|
|
|
let scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
|
|
|
if (scrollTop > _parentNode_top) {
|
|
|
- _parentNode.addClass('fixed-top');
|
|
|
- _parentNode.height(height);
|
|
|
+ $(_this._header+"Roll").removeClass('d-none');
|
|
|
} else {
|
|
|
- _parentNode.removeClass('fixed-top');
|
|
|
+ $(_this._header+"Roll").addClass('d-none');
|
|
|
}
|
|
|
- }
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
/**
|
|
|
@@ -37,26 +48,99 @@ const header = function (object) {
|
|
|
if (column.customization){
|
|
|
_parentNode.append(column.dom);
|
|
|
}else{
|
|
|
- let _td = "<th";
|
|
|
- if (column.style) _td += " style='"+column.style+"'"
|
|
|
- _td += ">"+column.value;
|
|
|
+ let _td = "<th id='sort_"+column.name+"' style='";
|
|
|
+ if(!column.neglect){
|
|
|
+ _td += "cursor: pointer;"
|
|
|
+ }
|
|
|
+ if (column.style) _td += column.style;
|
|
|
+ _td += "'>";
|
|
|
+ if(!column.neglect){
|
|
|
+ _td += "<span class='fa fa-sort'></span>";
|
|
|
+ }
|
|
|
+ _td += column.value;
|
|
|
_td += "</th>";
|
|
|
_parentNode.append(_td);
|
|
|
+ let column_dom = $('#sort_'+column.name);
|
|
|
+ let column_dom_temp = column_dom.clone();
|
|
|
+ column_dom_temp.attr('id','#sort_'+column.name+"_temp");
|
|
|
+ column_dom_temp.width(column_dom.width());
|
|
|
+ _parentNodeTemp.append(column_dom_temp);
|
|
|
if (!column.neglect){
|
|
|
- $(_td).click(function () {
|
|
|
+ let rule=function () {
|
|
|
if (!sortType[column.name]){
|
|
|
sortType[column.name] = 'asc';
|
|
|
columnArr.push(column.name);
|
|
|
+ column_dom.removeClass('fa-sort').addClass('fa-sort-asc');
|
|
|
+ column_dom_temp.removeClass('fa-sort').addClass('fa-sort-asc');
|
|
|
+ let columnArrTemp = [];
|
|
|
+ columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
+ window.sort.sort(_this._data,columnArrTemp,sortType);
|
|
|
+ return ;
|
|
|
+ }
|
|
|
+ if (sortType[column.name] === 'asc'){
|
|
|
+ sortType[column.name] = 'desc';
|
|
|
+ column_dom.removeClass('fa-sort-asc').addClass('fa-sort-desc');
|
|
|
+ column_dom_temp.removeClass('fa-sort-asc').addClass('fa-sort-desc');
|
|
|
+ let columnArrTemp = [];
|
|
|
+ columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
+ window.sort.sort(_this._data,columnArrTemp,sortType);
|
|
|
+ return ;
|
|
|
}
|
|
|
- if (sortType[column.name] === 'asc') sortType[column.name] = 'desc';
|
|
|
if (sortType[column.name] === 'desc'){
|
|
|
delete sortType[column.name];
|
|
|
- delete columnArr[column.name];
|
|
|
+ columnArr.some(function (name, index) {
|
|
|
+ if (name === column.name){
|
|
|
+ columnArr.splice(index,1);
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ column_dom.removeClass('fa-sort-desc').addClass('fa-sort');
|
|
|
+ column_dom_temp.removeClass('fa-sort-desc').addClass('fa-sort');
|
|
|
+ if (columnArr.length === 0){
|
|
|
+ //希尔排序
|
|
|
+ let arr = [];
|
|
|
+ arr.push.apply(arr,_this._data);
|
|
|
+ let len = arr.length;
|
|
|
+ for(let gap = Math.floor(len / 2); gap > 0; gap = Math.floor(gap / 2)) {
|
|
|
+ for(let i = gap; i < len; i++) {
|
|
|
+ let j = i;
|
|
|
+ let current = arr[i];
|
|
|
+ while(j - gap >= 0 && current[_this._restorationColumn] < arr[j - gap][_this._restorationColumn]) {
|
|
|
+ arr[j] = arr[j - gap];
|
|
|
+ j = j - gap;
|
|
|
+ }
|
|
|
+ arr[j] = current;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //插入排序
|
|
|
+ /*let preIndex, current;
|
|
|
+ for(let i = 1; i < len; i++) {
|
|
|
+ preIndex = i - 1;
|
|
|
+ current = arr[i];
|
|
|
+ while(preIndex >= 0 && arr[preIndex][_this._restorationColumn] > current[_this._restorationColumn]) {
|
|
|
+ arr[preIndex + 1] = arr[preIndex];
|
|
|
+ preIndex--;
|
|
|
+ }
|
|
|
+ arr[preIndex + 1] = current;
|
|
|
+ }*/
|
|
|
+ _this._data.length = 0;
|
|
|
+ _this._data.push.apply(_this._data,arr);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let columnArrTemp = [];
|
|
|
+ columnArrTemp.push.apply(columnArrTemp,columnArr);
|
|
|
+ window.sort.sort(_this._data,columnArrTemp,sortType);
|
|
|
+ return ;
|
|
|
}
|
|
|
- sort(_this._data,columnArr,sortType);
|
|
|
- });
|
|
|
+ };
|
|
|
+ column_dom.on('click',rule);
|
|
|
+ column_dom_temp.on('click',rule);
|
|
|
}
|
|
|
}
|
|
|
});
|
|
|
}
|
|
|
+ this.init = function() {
|
|
|
+ append();
|
|
|
+ fixed();
|
|
|
+ }
|
|
|
};
|