1 <div class="venus_table"> 2 <table class="table table-bordered"> 3 <thead> 4 <tr> 5 <th> 6 <input type="checkbox" style="height: 13px;" ng-change="checkedBoxChanged()" ng-model="newColRegCondition.checkedAccountAll" ng-disabled="newColRegCondition.status.checkedClaimAll_disabled"> 7 </th> 8 <th>结算单号</th> 9 <th>收款人名称</th> 10 <th>币种</th> 11 <th>结算金额</th> 12 <th>收款人账号</th> 13 <th>开户行名称</th> 14 <th>结算单生成日期</th> 15 <th>制单人</th> 16 <th>操作</th> 17 </tr> 18 </thead> 19 <tbody> 20 <tr ng-repeat="d in queryPayList" ng-class="{true:'venus_table_check',false:''}[d.checked]"> 21 <td ng-class="d.selectedClass" ng-mouseover="display=true;" ng-mouseleave="display=false;"> 22 <input type="checkbox" ng-change="checkedBoxChanged(d)" ng-model="d.checked" 23 ng-disabled="d.disabled" style="zoom:110%;"></td> 24 <td><a ng-click="refundNum(d)">{{d.payrefno}}</a></td> 25 <td>{{d.accountname}}</td> 26 <td>{{d.currency}}</td> 27 <td>{{d.billfee }}</td> 28 <td>{{d.accountcode}}</td> 29 <td>{{d.bankname}}</td> 30 <td>{{d.packagedate}}</td> 31 <td>{{d.packageName}}</td> 32 <td> <a href="" ng-click="getback(d)"><i class="glyphicon glyphicon-pencil color-oranage"></i>打回</a></td> 33 </tr> 34 </tbody> 35 </table> 36 </div> 37 <div class="row list_content_bottom" ng-if="pagination.totalItems>0"> 38 <span class="text-left" align="bottom">共{{pagination.totalItems}}条记录</span> 39 <pagination 40 ng-if="pagination.totalItems>pagination.pageSize" 41 ng-model="pagination.pageIndex" 42 class="pagination-sm pull-right" 43 total-items="pagination.totalItems" 44 page="pagination.pageIndex" 45 items-per-page="pagination.pageSize" 46 max-size="pagination.maxSize" 47 previous-text="上一页" 48 next-text="下一页" 49 first-text="首页" 50 last-text="末页" 51 class="" 52 ng-click="collectionSearch('page')" 53 style="margin: 0 20px 20px 0;" 54 boundary-links="true" 55 on-select-page="onSelectPage(page)"> 56 </pagination> 57 </div>
后台js的实现
1 /** 2 * 勾选全选框 或者 单个框时 3 * @param obj 4 */ 5 $scope.newColRegCondition.checkedRecords=[]; 6 $scope.newColRegCondition.checkedAccountAll=false; 7 $scope.checkedBoxChanged=function(obj){ 8 if(obj){//勾选单个框时 9 if(obj.checked){//如果勾选 10 if(!$scope.findObj(obj,$scope.newColRegCondition.checkedRecords)){//判断数组中是否存在该条案件 11 $scope.newColRegCondition.checkedRecords.push(obj);//记录此条数据 12 } 13 }else{//如果取消勾选 14 $scope.deleteObj(obj,$scope.newColRegCondition.checkedRecords,'certiID');//删除此条记录 15 } 16 //判断全选框是否应该勾选或取消 17 $scope.newColRegCondition.checkedAccountAll=$scope.queryPayList.every(function(item){ 18 return item.checked; 19 }); 20 }else{//勾选全选框时 21 angular.forEach($scope.queryPayList,function(target){ 22 if($scope.newColRegCondition.checkedAccountAll){//如果全选框勾选 23 if(!$scope.findObj(target,$scope.newColRegCondition.checkedRecords)){//先判断当前勾选数据是否已经存在记录列表中 24 $scope.newColRegCondition.checkedRecords.push(target);//记录此条数据 25 target.checked = true; 26 } 27 }else{//如果未勾选 28 $scope.deleteObj(target,$scope.newColRegCondition.checkedRecords,'payrefno');//删除对应记录 29 target.checked = false; 30 } 31 }); 32 } 33 if(obj){ 34 if(obj.certiType != null && obj.certiType == 'U' && obj.planFee > 0 && obj.checked){ 35 //调用接口检查勾选记录中是否有负数赔案(如果返回成功就跳转到下个页面。否则就停在当前页面。) 36 $$payClaimReg.refundIsPaid({compensateNo:obj.compensateNo,payRefReason:obj.payRefReason},{ 37 success:function (data) { 38 if(data.content.resultCode=='0000'){ 39 isDisabledCommon($scope.newColRegCondition.checkedRecords,obj,'disabled'); 40 }else{ 41 layerMsg(data.content.resultMsg); 42 var refundIsPaid = false; 43 angular.forEach($scope.newColRegCondition.checkedRecords,function(data){ 44 console.log('A'+obj.payRefReason.substr(1)); 45 if(data.compensateNo ==obj.compensateNo && data.payRefReason == ('A'+obj.payRefReason.substr(1))){ 46 refundIsPaid = true; 47 } 48 }); 49 if(!refundIsPaid){ 50 $scope.deleteObj(obj,$scope.newColRegCondition.checkedRecords,'payrefno');//删除此条记录 51 obj.checked = false; 52 } 53 } 54 }, 55 error:function () { 56 57 } 58 }); 59 } 60 } 61 getSelectedList() 62 63 }; 64 /** 65 *将勾选数据放入记录 66 */ 67 var getSelectedList=function(){ 68 angular.forEach($scope.queryPayList,function(data){ 69 if(data.checked){ 70 if(!$scope.findObj(data,$scope.newColRegCondition.checkedRecords)){ 71 $scope.newColRegCondition.checkedRecords.push(data); 72 73 } 74 } 75 else if($scope.findObj(data,$scope.newColRegCondition.checkedRecords)){ 76 $scope.deleteObj(data,$scope.newColRegCondition.checkedRecords,'payrefno') 77 } 78 }); 79 console.log($scope.newColRegCondition.checkedRecords) 80 81 };
简单实现：
1 //全选 2 $scope.selectedAll = function() { 3 console.log($scope.channelCheckedAll); 4 $scope.channelCheckedList = []; 5 angular.forEach($scope.processingList, function(ele, index) { 6 ele['checked'] = $scope.channelCheckedAll; 7 }); 8 angular.forEach($scope.processingList, function(ele, index){ 9 if(ele['checked']) { 10 $scope.channelCheckedList.push(ele); 11 } 12 }) 13 }; 14 //多选 15 $scope.selectedOne = function(item) { 16 var flag = true; 17 $scope.channelCheckedList = []; 18 angular.forEach($scope.processingList, function(ele, index){ 19 if(ele['checked']) { 20 $scope.channelCheckedList.push(ele); 21 } else { 22 flag = false; 23 } 24 }); 25 if(flag) { 26 $scope.channelCheckedAll = true; 27 } else { 28 $scope.channelCheckedAll = false; 29 } 30 };