easyui生成合并行,合计计算价格

easyui生成合并行,合计计算价格

注：本文来源： 原创

一：图样你效果图

二：代码实现

1：datagrid 列展示：

  1 	window.dataGrid = $("#dataGrid").widgets({
  2 		xtype:"datagrid",
  3 		idField:'gf_id',
  4 		pagination:true,
  5 		cellTip:true,
  6 		fit:true,
  7 		border:false,
  8 		height:480,
  9 		rownumbers:true,
 10 		pageSize:global_pageSize,
 11 		pageList:global_pageList,
 12 		showFooter:true,
 13
 14 		frozenColumns:[
 15 		               [
 16 		                {field:'check',checkbox:true},
 17 					  	{field:'adjust_typename',title:'调整方式名称'     ,width:80,halign:'center',align:'left'},
 18 					    {field:'adjust_and_amt',title:'追加方金额'        ,width:150,halign:'center',align:'right'},
 19 				    	{field:'adjust_and_amt',title:'追减方金额'        ,width:150,halign:'center',align:'right'}
 20 		               ]
 21 		              ]
 22
 23 			});
 24 	$('#dataGrid').datagrid({
 25 	    rowStyler:function(index,row){
 26 	        if (row.zb_id=="小计"){
 27 	            return 'background-color:#D7FFEE;';
 28 	        }
 29 	    }
 30 	});

2：小计的实现：

  1 window.detailGridBind = $W.databind.arrayDatabind({
  2 		id:'detailGridBind',
  3 		name:'主表绑定',
  4 		autoload:true,
  5 		noReload:true,
  6 		pageSize:global_pageSize,
  7 		binds:['#dataGrid'],
  8 		beforeLoad:function (param) {
  9 			param.ys_zxtz_id=window.ys_zxtz_id;
 10
 11 		},afterLoad:function(data){
 12
 13 				//-------增加小计----------------------------------------
 14 				var flag=0;
 15 				var len = data.data.length;
 16
 17 				/*if(len>0){
 18 					$("#remark").val(data.data[0].remark);
 19 					$("#remarks").val(data.data[0].remarks);
 20 				}*/
 21
 22 				for(var i=0;i<len;i++){
 23 					if(i + 1 < len){
 24 						var row=data.data[i];
 25 						var rowNext=data.data[i+1];
 26 						if(row.order_id != rowNext.order_id){
 27 							debugger;
 28 							var rowParam = compute(i+1,flag,data.data);
 29 							flag=i+2;
 30 							data.data.splice(rowParam.index,0,rowParam.row);
 31 							i++;
 32 							len++;
 33 							var index = rowParam.index;
 34 						}
 35 					}else{
 36 						    debugger;
 37 							var rowParam = compute(i+1,flag,data.data);
 38 							data.data.splice(rowParam.index,0,rowParam.row);
 39 							var index = rowParam.index;
 40 							break;
 41 					}
 42 			   }
 43
 44
 45
 46 			} 			return data;
 52
 53         },onLoadSuccess:function(data){
 54
 55
 56         }
 57 	});

3：金额 统计

  1 //统计列函数,返回插入行参数
  2 function compute(index,flag,data){
  3 	var total_1 = 0;
  4 	var total_2 = 0;
  5 	for(var i=flag;i<index;i++){
  6 		total_1 +=  parseFloat(data[i].adjust_and_amt==undefined?0.00:data[i].adjust_and_amt);
  7 		total_2 +=  parseFloat(data[i].adjust_sub_amt== undefined?0.00:data[i].adjust_sub_amt);
  8 	}
  9 	 window.param={
 10 		index:index,
 11 		row:{adjust_typename:"小计",adjust_and_amt:formatMoney(total_1,2),adjust_sub_amt:formatMoney(total_2,2)
 12 		}
 13 	}
 14 	return param;
 15 }
 16 

4：金额 格式化

  1
  2
  3 /**
  4  * 金额数据校验：
  5  * @param data
  6  * @returns {Array}
  7  */
  8 function  dataMathFormatBoolean(data){
  9 	var regexp_js1=/^-?(?:0|[1-9][0-9]*|(?:[1-9][0-9]{0,2})(?:(?:,[0-9]{3})*))(?:\.[0-9]+)?$/;//千分位 数字格式化正则校验表达式 /^(-)?\d{1,3}(,\d{3})*(.\d+)?$/
 10 	var returnData=[];
 11     //把 不是数字型数据（如:segsdg2323）给返回回去；让用户重新输入
 12     if(!regexp_js1.test(Money2Num(data))){
 13     	 returnData.data=data;
 14     	 returnData.Falg=false;//不符合要求
 15     }else{
 16     	 returnData.data=parseFloat(trm((data+'').replace(/,/g,'')));
 17     	 returnData.Falg=true;//符合要求
 18     }
 19     return returnData;
 20 }
 21
 22 /**
 23  *  金额值格式化
 24  * @param value
 25  * @returns
 26  */
 27 function  commonFormatMoney(value){
 28 	var arrayData= dataMathFormatBoolean(value);
 29     if(!arrayData.Falg){
 30     	 $.messager.alert("警告",arrayData.data+" 不符合要求，请输入正确格式；如：123或123.235或-123.456或-122 ","warning");
 31     	return;
 32     }
 33     return formatMoney(arrayData.data, 2);
 34 }
 35
 36
 37 /*
 38 * formatMoney(s,n)
 39 * 功能：金额按千位逗号分割
 40 * 参数：n，需要格式化的金额数值.
 41 * 参数：type,判断格式化后的金额是否需要小数位.
 42 * 返回：返回格式化后的数值字符串.
 43 */
 44 function formatMoney(s, n) {
 45 	 n =( (n >= 0 && n <= 20) ? n : 2); //小数点后小数位数的格式长度为0~20
 46 	//判断是否为数值型数据：例如：1；0；-1；如果非数值类型如（wesf,wef12）则返回 0；
 47 	if(!(/^-?(?:0|[1-9][0-9]*|(?:[1-9][0-9]{0,2})(?:(?:,[0-9]{3})*))(?:\.[0-9]+)?$/.test(trm((s+'').replace(/,/g,''))))) {
 48 		   s=parseFloat(0).toFixed(n);
 49 		}else if (s == null || s == ""){
 50 			//判断是否为空或者是null  如果是 则返回数值0
 51 		   s=parseFloat(0).toFixed(n);
 52 		}else{
 53 		    var symbol='-';//声明 ’-‘号；用于对负数的格式化的处理
 54 		    if(s>=0){
 55 			 symbol='+';
 56 			}else{
 57 			  symbol='-';
 58 			  s=Math.abs(s);
 59 			}
 60 		    /**
 61 		     * 格式化：核心代码
 62 		     */
 63
 64 			s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + ""; //去掉空格 并格式化小数
 65 			var l = s.split(".")[0].split("").reverse(), r = s.split(".")[1]; //数据以 . 拆分
 66 			t = "";
 67 			for (i = 0; i < l.length; i++) {
 68 				t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");
 69 			}
 70 			 s= t.split("").reverse().join("") + "." + r;
 71 			 if(n==0){
 72 				 s= t.split("").reverse().join("");
 73 			 }
 74 			 /**
 75 			  * 对于’-111‘格式的数据的格式化的处理
 76 			  */
 77 			 if(symbol=='-'){
 78 			   if(s.length<4){
 79 			     s=parseFloat(symbol+s).toFixed(n);
 80 			   }else{
 81 			     s=symbol+s;
 82 			   }
 83 			}
 84 		}
 85 		return s;
 86 }
 87 /**
 88  * 把已经被千分位格式化‘,’的数据，转换为数值型数据
 89  * @param money  已经格式化的数据
 90  * 思路：先把所有的‘,’替换为空格，
 91  * 再把空格去掉，
 92  *  再转换为浮点型
 93  */
 94 function Money2Num(money){
 95 	return  parseFloat(trm((money+'').replace(/,/g,'')));
 96 }
 97
 98
 99 

————————————————————————————————————————————————————————————————————————