smart-table

'use strict';

angular.module('myApp.smart', ['ngRoute'])

.config(['$routeProvider',function($routeProvider) {

$routeProvider.when('/smart', {

templateUrl:'smart-table/index.html',

controller:'mainCtrl'

});

}]);

(function(ng) {

angular.module('myApp', ['smart-table','ui.bootstrap'])

.controller('mainCtrl', ['$scope',function($scope) {

var

nameList= ['Pierre','Pol','Jacques','Robert','Elisa'],

familyName= ['Dupont','Germain','Delcourt','bjip','Menez'],

nationList= ['USA','France','Germany'],

educationList= ['Doctorate','Master','Bachelor','High school'];

functioncreateRandomItem() {

var

firstName=nameList[Math.floor(Math.random() *5)],

lastName=familyName[Math.floor(Math.random() *5)],

nationality=nationList[Math.floor(Math.random() *3)],

education=educationList[Math.floor(Math.random() *4)];

return{

firstName:firstName,

lastName:lastName,

nationality:nationality,

education:education

};

}

$scope.itemsByPage=15;

$scope.collection= [];

$scope.displayed= [].concat($scope.collection);

for(varj=0;j<200;j++) {

$scope.collection.push(createRandomItem());

}

}])

.directive('stSelectDistinct', [function() {

return{

restrict:'E',

require:'^stTable',

scope: {

collection:'=',

predicate:'@',

predicateExpression:'='

},

template:'',

link:function(scope, element, attr, table) {

vargetPredicate=function() {

varpredicate= scope.predicate;

if(!predicate&& scope.predicateExpression) {

predicate= scope.predicateExpression;

}

returnpredicate;

}

scope.$watch('collection',function(newValue) {

varpredicate=getPredicate();

if(newValue) {

vartemp= [];

scope.distinctItems= ['All'];

angular.forEach(scope.collection,function(item) {

varvalue= item[predicate];

if(value&&value.trim().length>0&&temp.indexOf(value) === -1) {

temp.push(value);

}

});

temp.sort();

scope.distinctItems= scope.distinctItems.concat(temp);

scope.selectedOption= scope.distinctItems[0];

scope.optionChanged(scope.selectedOption);

}

},true);

scope.optionChanged=function(selectedOption) {

varpredicate=getPredicate();

varquery= {};

query.distinct= selectedOption;

if(query.distinct==='All') {

query.distinct='';

}

table.search(query,predicate);

};

}

}

}])

.directive('stSelectMultiple', [function() {

return{

restrict:'E',

require:'^stTable',

scope: {

collection:'=',

predicate:'@',

predicateExpression:'='

},

templateUrl:'stSelectMultiple.html',

link:function(scope, element, attr, table) {

scope.dropdownLabel='';

scope.filterChanged=filterChanged;

initialize();

functioninitialize() {

bindCollection(scope.collection);

}

functiongetPredicate() {

varpredicate= scope.predicate;

if(!predicate&& scope.predicateExpression) {

predicate= scope.predicateExpression;

}

returnpredicate;

}

functiongetDropdownLabel() {

varallCount= scope.distinctItems.length;

//獲取要查的列表

varselected=getSelectedOptions();

if(allCount===selected.length||selected.length===0) {

return'All';

}

if(selected.length===1) {

returnselected[0];

}

returnselected.length+' items';

}

functiongetSelectedOptions() {

varselectedOptions= [];

angular.forEach(scope.distinctItems,function(item) {

if(item.selected) {

selectedOptions.push(item.value);

}

});

returnselectedOptions;

}

functionbindCollection(collection) {

varpredicate=getPredicate();

vardistinctItems= [];

angular.forEach(collection,function(item) {

varvalue= item[predicate];

fillDistinctItems(value,distinctItems);

});

distinctItems.sort(function(obj, other) {

if(obj.value> other.value) {

return1;

}else if(obj.value< other.value) {

return-1;

}

return0;

});

//獲取篩選的列表

scope.distinctItems=distinctItems;

filterChanged();

}

functionfilterChanged() {

scope.dropdownLabel=getDropdownLabel();

varpredicate=getPredicate();

varquery= {

matchAny: {}

};

//獲取要篩選的項(xiàng)

query.matchAny.items=getSelectedOptions();

varnumberOfItems=query.matchAny.items.length;

if(numberOfItems===0||numberOfItems=== scope.distinctItems.length) {

query.matchAny.all=true;

}else{

query.matchAny.all=false;

}

table.search(query,predicate);

}

functionfillDistinctItems(value, distinctItems) {

if(value && value.trim().length>0&& !findItemWithValue(distinctItems, value)) {

distinctItems.push({

value: value,

selected:true

});

}

}

functionfindItemWithValue(collection, value) {

varfound=_.find(collection,function(item) {

returnitem.value=== value;

});

returnfound;

}

}

}

}])

.filter('customFilter', ['$filter',function($filter) {

varfilterFilter= $filter('filter');

varstandardComparator=functionstandardComparator(obj, text) {

text = (''+ text).toLowerCase();

return(''+ obj).toLowerCase().indexOf(text) > -1;

};

return functioncustomFilter(array, expression) {

functioncustomComparator(actual, expected) {

varisBeforeActivated= expected.before;

varisAfterActivated= expected.after;

varisLower= expected.lower;

varisHigher= expected.higher;

varhigherLimit;

varlowerLimit;

varitemDate;

varqueryDate;

if(ng.isObject(expected)) {

//exact match

if(expected.distinct) {

if(!actual || actual.toLowerCase() !== expected.distinct.toLowerCase()) {

return false;

}

return true;

}

//matchAny

if(expected.matchAny) {

if(expected.matchAny.all) {

return true;

}

if(!actual) {

return false;

}

for(vari=0;i< expected.matchAny.items.length;i++) {

if(actual.toLowerCase() === expected.matchAny.items[i].toLowerCase()) {

return true;

}

}

return false;

}

//date range

if(expected.before|| expected.after) {

try{

if(isBeforeActivated) {

higherLimit= expected.before;

itemDate=newDate(actual);

queryDate=newDate(higherLimit);

if(itemDate>queryDate) {

return false;

}

}

if(isAfterActivated) {

lowerLimit= expected.after;

itemDate=newDate(actual);

queryDate=newDate(lowerLimit);

if(itemDate

return false;

}

}

return true;

}catch(e) {

return false;

}

}else if(isLower||isHigher) {

//number range

if(isLower) {

higherLimit= expected.lower;

if(actual >higherLimit) {

return false;

}

}

if(isHigher) {

lowerLimit= expected.higher;

if(actual

return false;

}

}

return true;

}

//etc

return true;

}

returnstandardComparator(actual, expected);

}

varoutput=filterFilter(array, expression,customComparator);

returnoutput;

};

}]);

})(angular);

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末致开,一起剝皮案震驚了整個(gè)濱河市筷厘,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌砸捏,老刑警劉巖冗懦,帶你破解...
    沈念sama閱讀 206,378評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件爽冕,死亡現(xiàn)場離奇詭異,居然都是意外死亡披蕉,警方通過查閱死者的電腦和手機(jī)颈畸,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,356評論 2 382
  • 文/潘曉璐 我一進(jìn)店門前塔,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人承冰,你說我怎么就攤上這事华弓。” “怎么了困乒?”我有些...
    開封第一講書人閱讀 152,702評論 0 342
  • 文/不壞的土叔 我叫張陵寂屏,是天一觀的道長。 經(jīng)常有香客問我娜搂,道長迁霎,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,259評論 1 279
  • 正文 為了忘掉前任百宇,我火速辦了婚禮考廉,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘携御。我一直安慰自己昌粤,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 64,263評論 5 371
  • 文/花漫 我一把揭開白布啄刹。 她就那樣靜靜地躺著涮坐,像睡著了一般。 火紅的嫁衣襯著肌膚如雪誓军。 梳的紋絲不亂的頭發(fā)上袱讹,一...
    開封第一講書人閱讀 49,036評論 1 285
  • 那天,我揣著相機(jī)與錄音昵时,去河邊找鬼捷雕。 笑死,一個(gè)胖子當(dāng)著我的面吹牛壹甥,可吹牛的內(nèi)容都是我干的救巷。 我是一名探鬼主播,決...
    沈念sama閱讀 38,349評論 3 400
  • 文/蒼蘭香墨 我猛地睜開眼盹廷,長吁一口氣:“原來是場噩夢啊……” “哼征绸!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起俄占,我...
    開封第一講書人閱讀 36,979評論 0 259
  • 序言:老撾萬榮一對情侶失蹤管怠,失蹤者是張志新(化名)和其女友劉穎,沒想到半個(gè)月后缸榄,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體渤弛,經(jīng)...
    沈念sama閱讀 43,469評論 1 300
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 35,938評論 2 323
  • 正文 我和宋清朗相戀三年甚带,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了她肯。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片佳头。...
    茶點(diǎn)故事閱讀 38,059評論 1 333
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖晴氨,靈堂內(nèi)的尸體忽然破棺而出康嘉,到底是詐尸還是另有隱情,我是刑警寧澤籽前,帶...
    沈念sama閱讀 33,703評論 4 323
  • 正文 年R本政府宣布亭珍,位于F島的核電站,受9級特大地震影響枝哄,放射性物質(zhì)發(fā)生泄漏肄梨。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,257評論 3 307
  • 文/蒙蒙 一挠锥、第九天 我趴在偏房一處隱蔽的房頂上張望众羡。 院中可真熱鬧,春花似錦蓖租、人聲如沸粱侣。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,262評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽甜害。三九已至,卻和暖如春球昨,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背眨攘。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工主慰, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人鲫售。 一個(gè)月前我還...
    沈念sama閱讀 45,501評論 2 354
  • 正文 我出身青樓共螺,卻偏偏與公主長得像,于是被迫代替她去往敵國和親情竹。 傳聞我的和親對象是個(gè)殘疾皇子藐不,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 42,792評論 2 345

推薦閱讀更多精彩內(nèi)容