html5列表嵌套按钮，click点击事件及传参处理

其他 2020-01-16 14:26:17 阅读次数: 0

<li click事件>

列表第一项<button click事件></button>或<a click事件></a>

</li>

<li click事件>

列表第二项<button click事件></button>或<a click事件></a>

</li>

采用下拉刷新控件mescroll.js实现list

方法：

<div id="mescroll1" class="app_deta_li mescroll" style="display:block;">
    	<div class="app_empty" style="display:none;">
    		<b class="iconfont">&#xe643;</b>
        	<i>暂无数据</i>
    	</div>
    	<ul id="dataList1">    <!-- 
        	<li>
            	<p class="app_dl_t">标题<span class="fr col_ob">已完成</span></p>
                <p class="app_dl_i">
                	<label>内容一</label>
                    <label>内容二</label>
                	<label>内容三</label>
                    <i><font class="col_oo">0.39</font>元</i>
                </p>
                <p class="app_dl_b"><a href="javascript:void(0);" class="fr curr_bt ashide">按钮一</a><a href="javascript:void(0);" class="fr curr_bt">按钮二</a></p>
            </li>     -->
        </ul>
    </div>

js

//初始化mescroll1
function initmescroll1(){
	if(mescroll1 != null){
		return;
	}
	mescroll1 = new MeScroll("mescroll1", {
		up: {
			auto: true, //是否在初始化时以上拉加载的方式自动加载第一页数据; 默认false
			isBounce: false, //此处禁止ios回弹,解析(务必认真阅读,特别是最后一点): http://www.mescroll.com/qa.html#q10
			callback: upCallback1, //上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
			clearEmptyId: "dataList1", //1.下拉刷新时会自动先清空此列表,再加入数据; 2.无任何数据时会在此列表自动提示空
			page: {
				num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
				size: 10 //每页数据条数,默认10
			},
			empty: {
				//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
				warpId: "mescroll1", //父布局的id (1.3.5版本支持传入dom元素)
				icon: "", //图标,默认null,支持网络图
				tip: "" //提示
			}
		}
	});
}

//上拉加载的回调 page = {num:1, size:10}; num:当前页 从1开始, size:每页数据条数 
function upCallback1(page){
	ajaxSyncRequest(getContextPath() + "getServiceRecord", {"phone": userPhone, "orderStatus": filter, "pageNo": page.num}, function(data){
		if(data.success){
			//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
			//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
			//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			mescroll1.endByPage(data.data.rows.length, data.data.totalPage); //必传参数(当前页的数据个数, 总页数)
			//设置列表数据
			if(data.data.totalPage == "1" && data.data.rows.length == 0){
				$("#mescroll1 .app_empty").show();
			}else{
				$("#mescroll1 .app_empty").hide();
				setListData1(data.data.rows);
			}
		}else{
			//联网失败的回调,隐藏下拉刷新的状态
            mescroll1.endErr();
		}
	});
}

/*设置列表数据*/
function setListData1(curPageData){
	var listDom = document.getElementById("dataList1");
	for (var i = 0; i < curPageData.length; i++) {
		var data = curPageData[i];
		var str='<p class="app_dl_t">'+data.station_name+'-'+data.charge_id+'<span class="fr col_ob">'+orderStatus[parseInt(data.order_status)]+'</span></p>';
		str+='<p class="app_dl_i">';
		if(data.order_status == "1"){  //充电中
			str+='<label>充电电量：--【待核算】</label>';
		}else{
			str+='<label>充电电量：'+data.charged_capacity+'度'+'</label>';
		}
		str+='<label>开始时间：'+data.start_time+'</label>';
		str+='<label>结束时间：'+data.end_time+'</label>';
		str+='<i><font class="col_oo">'+data.money+'</font>元</i></p>';
		str+='<p class="app_dl_b">';
		if(data.order_status == "1" || DateFormat.compareDate(DateFormat.addDayStr(data.end_time, 7), new Date()) < 1){
			str+='<a href="javascript:void(0);" class="fr curr_bt ashide">申请售后</a>';
		}else{
			var para = data.order_num+","+data.charged_capacity+","+data.money;
			str+='<a href="javascript:void(0);" class="fr curr_bt" onclick="applyAfterSale(this.type);" type="'+para+'">申请售后</a>';
		}
		str+='<a href="javascript:void(0);" class="fr curr_bt">服务评价</a>';
		str+='</p>';
		var liDom = document.createElement("li");
		liDom.innerHTML = str;
		addClickListener1(liDom, data);
		listDom.appendChild(liDom);
	}
}

/*添加列表点击事件*/
function addClickListener1(el, data){
	$(el).find('.app_dl_i').on('click', function(){          
		if(data.order_status == 2 || data.order_status == 3){
			//跳转到详情页
			window.location.href = getContextPath() + "jsp/pay.html?order=" + data.order_num + "&scene=";
		}else{
			var para = "code="+data.charge_id+"&pos="+data.position_num+"&scene=";
			window.location.href = getContextPath() + "jsp/show.html?" + para;
		}
	});
}

//申请售后
function applyAfterSale(str){
	var param = str.split(",");
	var para = "order="+param[0]+"&chgAmount="+param[1]+"&chgMoney="+param[2];
	window.location.href = getContextPath() + "jsp/aftersales.html?" + para;
	return false;
}

完！！！

str+='<a href="javascript:void(0);" class="fr curr_bt" onclick="applyAfterSale(this.type);" type="'+para+'">申请售后</a>';

示例代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>示例</title>
<link href="../css/app_comm.css" rel="stylesheet" type="text/css" />
<link href="../css/app_style.css" rel="stylesheet" type="text/css" />
<link href="../css/comm.css" rel="stylesheet" type="text/css" />
<link href="../css/weui.min.css" rel="stylesheet" type="text/css" />
<link href="../css/iconfont/iconfont.css" rel="stylesheet" type="text/css" />
<link href="../css/mescroll.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="../css/iconfont/iconfont.js"></script>
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript" src="../js/app_comm.js"></script>
<script type="text/javascript" src="../js/app_func.js"></script>
<script type="text/javascript" src="../js/common.js"></script>
<script type="text/javascript" src="../js/wx_weui.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script type="text/javascript" src="../js/wx_jsapi.js"></script>
<script type="text/javascript" src="../js/app_menu.js"></script>
<script type="text/javascript" src="../js/dateformat.js"></script>
<script type="text/javascript" src="../js/mescroll.min.js"></script>
<script type="text/javascript" src="../js/ios_adapter2.js"></script>
<script type="text/javascript">
//全局变量
//mescroll对象
var mescroll1 = null;
var mescroll2 = null;
var mescroll3 = null;
//搜索关键字
var searchKey = "";
//当前tab位置
var currPage = 0;
//退款id
var refundId = "";

//就绪时执行
$(function(){
	//显示加载toast
	showLoadingToast();
	//设置tab监听，横向菜单切换
	setTabClickListener();
	//初始化mescrolls
	initmescrolls();
	//设置事件监听
	setEventListener();
	//隐藏加载toast
	hideLoadingToast();      
});

//设置tab监听，横向菜单切换
function setTabClickListener(){
	$(".app_q_menu li").unbind("click").click(function(){
		$(".app_q_menu li").removeClass("app_qm_in");
		$(this).addClass("app_qm_in");
		currPage = $(".app_q_menu li").index(this);
		$(".app_oper_r_li").hide();
		$(".app_oper_r_li:eq(" + currPage + ")").show();
		initmescrolls();
	});
}

//初始化mescrolls
function initmescrolls(){
	switch(currPage){
	case 0:  //提现
		initmescroll1();
		break;
	case 1:  //充值
		initmescroll2();
		break;
	case 2:  //退款
		initmescroll3();
		break;
	}
}

//设置列表项默认隐藏
function initExpandListDef(el){
	$(el).find(".app_oper_r_l").hide();
	$(el).find(".app_oper_r_m").show();
	$(el).find(".app_oper_r_un").show();
	$(el).find(".app_oper_r_un1").hide();
	$(el).find(".contain1").hide();
}

//设置列表扩展状态
function initExpandList(){
    $(".app_oper_r_m").click(function(){
    	$(this).parent().find(".contain1").slideDown(300);
    	$(this).parent().find(".app_oper_r_m").hide();
    	$(this).parent().find(".app_oper_r_l").show();
    	$(this).parent().find(".app_oper_r_un").hide();
    	$(this).parent().find(".app_oper_r_un1").show();
    });
	$(".app_oper_r_l").click(function(){
		$(this).parent().find(".contain1").slideUp(300);
		$(this).parent().find(".app_oper_r_l").hide();
		$(this).parent().find(".app_oper_r_m").show();
		$(this).parent().find(".app_oper_r_un").show();
		$(this).parent().find(".app_oper_r_un1").hide();
    });
}

//初始化mescroll1
function initmescroll1(){
	if(mescroll1 != null){
		return;
	}
	mescroll1 = new MeScroll("mescroll1", {
		up: {
			auto: true, //是否在初始化时以上拉加载的方式自动加载第一页数据; 默认false
			isBounce: false, //此处禁止ios回弹,解析(务必认真阅读,特别是最后一点): http://www.mescroll.com/qa.html#q10
			callback: upCallback1, //上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
			clearEmptyId: "dataList1", //1.下拉刷新时会自动先清空此列表,再加入数据; 2.无任何数据时会在此列表自动提示空
			page: {
				num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
				size: 10 //每页数据条数,默认10
			},
			empty: {
				//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
				warpId: "mescroll1", //父布局的id (1.3.5版本支持传入dom元素)
				icon: "", //图标,默认null,支持网络图
				tip: "" //提示
			}
		}
	});
}

//上拉加载的回调 page = {num:1, size:10}; num:当前页 从1开始, size:每页数据条数 
function upCallback1(page){
	ajaxSyncRequest(getContextPath() + "getOperDrawList", {"phone": userPhone, "key": searchKey, "pageNo": page.num}, function(data){
		if(data.success){
			//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
			//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
			//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			mescroll1.endByPage(data.data.rows.length, data.data.totalPage); //必传参数(当前页的数据个数, 总页数)
			//设置列表数据
			if(data.data.totalPage == "1" && data.data.rows.length == 0){
				$("#mescroll1 .app_empty").show();
			}else{
				$("#mescroll1 .app_empty").hide();
				setListData1(data.data.rows);
			}
		}else{
			//联网失败的回调,隐藏下拉刷新的状态
            mescroll1.endErr();
		}
	});
}

/*设置列表数据*/
function setListData1(curPageData){
	var listDom = document.getElementById("dataList1");
	for (var i = 0; i < curPageData.length; i++) {
		var data = curPageData[i];
		var str='<div class="contain">';
		str += '<div class="app_oper_r_ln">';
		str += '<span class="app_oper_r_tz">'+data.orderNum+'</span>';
		if(data.handleStatus == "1"){
			str += '<span class="app_oper_r_sw">未审批</span>';
		}else if(data.handleStatus == "2"){
			str += '<span class="app_oper_r_ss">已审批</span>';
		}else if(data.handleStatus == "3"){
			str += '<span class="app_oper_r_st">已退回</span>';
		}
		str += '</div>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：'+data.orderUser+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;申请提现金额：'+data.cardMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：'+DateFormat.format(new Date(data.applyTime), 'yyyy-MM-dd hh:mm:ss')+'</span><br/></use>';
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>';
		str += '<div class="app_oper_r_un"></div>';
		str += '<div class="contain1">';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;实际提现金额：'+data.finalMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;备注：'+data.orderDesc+'</span><br/></use>';
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>';
		str += '<div class="app_oper_r_un1"></div>';
		if(data.handleStatus == "1"){
			str += '<div class="app_oper_r_bt_p">';
			str += '<a href="javascript:void(0);" class="app_oper_r_bt_s" onclick="approvePass(this.type);" type="'+data.id+','+data.orderUser+','+data.refundAccount+','+data.orderNum+'">审批</a>';
			str += '<a href="javascript:void(0);" class="app_oper_r_bt_b" onclick="approveReject(this.type);" type="'+data.id+','+data.orderUser+','+data.refundAccount+','+data.orderNum+'">驳回</a>';
			str += '</div>';
		}
		var liDom = document.createElement("li");
		liDom.innerHTML = str;
		addClickListener1(liDom, data);
		listDom.appendChild(liDom);
		//设置列表项默认隐藏
		initExpandListDef(liDom);
	}
	//设置列表扩展状态
	initExpandList();
}

/*添加列表点击事件*/
function addClickListener1(el, data){
	$(el).on('click', function(){          
		//点击列表项时，处理
	});
}

//审批通过
function approvePass(str){
	var param = str.split(",");
	showDlg("确定批准该会员当前提现订单？", "提示");
	$("#ok").unbind('click').click(function(){
		$('#iosDialog2').fadeOut(200); 
		ajaxSyncRequest(getContextPath() + "operDrawPass", {"phone": userPhone, "id": param[0], "mber": param[1], "guid": param[2], "order": param[3]}, function(data){
			setTimeout(function(){
				if(data.success){
					showToast("操作成功");
				}else{
					showDlg(data.msg);
				}
			}, 500);
		});
	});
}

//审批驳回
function approveReject(str){
	var param = str.split(",");
	showDlg("确定驳回该会员当前提现订单？", "提示");
	$("#ok").unbind('click').click(function(){
		$('#iosDialog2').fadeOut(200); 
		ajaxSyncRequest(getContextPath() + "operDrawReject", {"phone": userPhone, "id": param[0], "mber": param[1], "guid": param[2], "order": param[3]}, function(data){
			setTimeout(function(){
				if(data.success){
					showToast("操作成功");
				}else{
					showDlg(data.msg);
				}
			}, 500);
		});
	});
}

//初始化mescroll2
function initmescroll2(){
	if(mescroll2 != null){
		return;
	}
	mescroll2 = new MeScroll("mescroll2", {
		up: {
			auto: true, //是否在初始化时以上拉加载的方式自动加载第一页数据; 默认false
			isBounce: false, //此处禁止ios回弹,解析(务必认真阅读,特别是最后一点): http://www.mescroll.com/qa.html#q10
			callback: upCallback2, //上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
			clearEmptyId: "dataList2", //1.下拉刷新时会自动先清空此列表,再加入数据; 2.无任何数据时会在此列表自动提示空
			page: {
				num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
				size: 10 //每页数据条数,默认10
			},
			empty: {
				//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
				warpId: "mescroll2", //父布局的id (1.3.5版本支持传入dom元素)
				icon: "", //图标,默认null,支持网络图
				tip: "" //提示
			}
		}
	});
}

//上拉加载的回调 page = {num:1, size:10}; num:当前页 从1开始, size:每页数据条数 
function upCallback2(page){
	ajaxSyncRequest(getContextPath() + "getOperRechargeList", {"phone": userPhone, "key": searchKey, "pageNo": page.num}, function(data){
		if(data.success){
			//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
			//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
			//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			mescroll2.endByPage(data.data.rows.length, data.data.totalPage); //必传参数(当前页的数据个数, 总页数)
			//设置列表数据
			if(data.data.totalPage == "1" && data.data.rows.length == 0){
				$("#mescroll2 .app_empty").show();
			}else{
				$("#mescroll2 .app_empty").hide();
				setListData2(data.data.rows);
			}
		}else{
			//联网失败的回调,隐藏下拉刷新的状态
            mescroll2.endErr();
		}
	});
}

/*设置列表数据*/
function setListData2(curPageData){
	var listDom = document.getElementById("dataList2");
	for (var i = 0; i < curPageData.length; i++) {
		var data = curPageData[i];
		var str='<div class="contain">'; 
		str += '<div class="app_oper_r_ln">'; 
		str += '<span class="app_oper_r_tz">'+data.orderNum+'</span>';
		if(data.orderStatus == "1"){
			str += '<span class="app_oper_r_sw">服务中</span>';
		}else if(data.orderStatus == "2"){
			str += '<span class="app_oper_r_ss">已完成</span>';
		}else if(data.orderStatus == "3"){
			str += '<span class="app_oper_r_st">异常中</span>';
		}
		str += '</div>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：'+data.orderUser+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;实际结算：'+data.finalMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-riqi"><span class="app_oper_r_s">&nbsp;日期：'+DateFormat.format(new Date(data.createTime), 'yyyy-MM-dd hh:mm:ss')+'</span><br/></use>';
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>';
		str += '<div class="app_oper_r_un"></div>';
		str += '<div class="contain1">';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-chongzhijineicon"><span class="app_oper_r_s">&nbsp;充值金额：'+data.orderMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-youhuijine"><span class="app_oper_r_s">&nbsp;优惠金额：'+data.discountMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		if(data.payStatus == "0"){
			str += '<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_0">未支付</span></span><br/></use>';
		}else if(data.payStatus == "1"){
			str += '<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_1">已支付</span></span><br/></use>';
		}else if(data.payStatus == "2"){
			str += '<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_1">已提现</span></span><br/></use>';
		}else if(data.payStatus == "3"){
			str += '<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_1">已付款</span></span><br/></use>';
		}
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>';
		str += '<div class="app_oper_r_un1"></div>';
		var liDom = document.createElement("li");
		liDom.innerHTML = str;
		addClickListener2(liDom, data);
		listDom.appendChild(liDom);
		//设置列表项默认隐藏
		initExpandListDef(liDom);
	}
	//设置列表扩展状态
	initExpandList();
}

/*添加列表点击事件*/
function addClickListener2(el, data){
	$(el).on('click', function(){          
		//点击列表项时，处理
	});
}

//初始化mescroll2
function initmescroll3(){
	if(mescroll3 != null){
		return;
	}
	mescroll3 = new MeScroll("mescroll3", {
		up: {
			auto: true, //是否在初始化时以上拉加载的方式自动加载第一页数据; 默认false
			isBounce: false, //此处禁止ios回弹,解析(务必认真阅读,特别是最后一点): http://www.mescroll.com/qa.html#q10
			callback: upCallback3, //上拉回调,此处可简写; 相当于 callback: function (page) { upCallback(page); }
			clearEmptyId: "dataList3", //1.下拉刷新时会自动先清空此列表,再加入数据; 2.无任何数据时会在此列表自动提示空
			page: {
				num: 0, //当前页 默认0,回调之前会加1; 即callback(page)会从1开始
				size: 10 //每页数据条数,默认10
			},
			empty: {
				//列表第一页无任何数据时,显示的空提示布局; 需配置warpId才显示
				warpId: "mescroll3", //父布局的id (1.3.5版本支持传入dom元素)
				icon: "", //图标,默认null,支持网络图
				tip: "" //提示
			}
		}
	});
}

//上拉加载的回调 page = {num:1, size:10}; num:当前页 从1开始, size:每页数据条数 
function upCallback3(page){
	ajaxSyncRequest(getContextPath() + "getOperRefundList", {"phone": userPhone, "key": searchKey, "pageNo": page.num}, function(data){
		if(data.success){
			//联网成功的回调,隐藏下拉刷新和上拉加载的状态;
			//mescroll会根据传的参数,自动判断列表如果无任何数据,则提示空;列表无下一页数据,则提示无更多数据;
			//方法一(推荐): 后台接口有返回列表的总页数 totalPage
			mescroll3.endByPage(data.data.rows.length, data.data.totalPage); //必传参数(当前页的数据个数, 总页数)
			//设置列表数据
			if(data.data.totalPage == "1" && data.data.rows.length == 0){
				$("#mescroll3 .app_empty").show();
			}else{
				$("#mescroll3 .app_empty").hide();
				setListData3(data.data.rows);
			}
		}else{
			//联网失败的回调,隐藏下拉刷新的状态
            mescroll3.endErr();
		}
	});
}

/*设置列表数据*/
function setListData3(curPageData){
	var listDom = document.getElementById("dataList3");
	for (var i = 0; i < curPageData.length; i++) {
		var data = curPageData[i];
		var str='<div class="contain">'; 
		str += '<div class="app_oper_r_ln">'; 
		str += '<span class="app_oper_r_tz">'+data.afterServiceNum+'</span>';
		if(data.handleStatus == "1"){
			str += '<span class="app_oper_r_sw">未处理</span>';
		}else if(data.handleStatus == "2"){
			str += '<span class="app_oper_r_ss">已处理</span>';
		}
		str += '</div>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-shenqinghuiyuan"><span class="app_oper_r_s">&nbsp;申请会员：'+data.member+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：'+DateFormat.format(new Date(data.applyTime), 'yyyy-MM-dd hh:mm:ss')+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-tuikuanjine"><span class="app_oper_r_s">&nbsp;退款金额：'+data.finalMoney+'</span><br/></use>';
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>';
		str += '<div class="app_oper_r_un"></div>';
		str += '<div class="contain1">';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-dingdanhao-copy"><span class="app_oper_r_s">&nbsp;充电订单编号：'+data.orderNum+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;充电结算金额：'+data.chargeMoney+'</span><br/></use>';
		str += '</svg>';
		str += '<svg class="app_svg_icon" aria-hidden="true">';
		str += '<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;退款原因：'+data.clientReason+'</span><br/></use>';
		str += '</svg>';
		str += '</div>';
		str += '<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>';
		str += '<div class="app_oper_r_un1"></div>';
		if(data.handleStatus == "1"){
			str += '<div class="app_oper_r_bt_p">';
			var type = data.afterServiceNum+","+data.member+","+DateFormat.format(new Date(data.applyTime), 'yyyy-MM-dd hh:mm:ss')+","+data.finalMoney+","+data.orderNum+","+data.chargeMoney+","+data.clientReason+","+data.id;
			str += '<a href="javascript:void(0);" class="app_oper_r_bt_s" onclick="refundAgree(this.type);" type="'+type+'">审批</a>';
			str += '<a href="javascript:void(0);" class="app_oper_r_bt_b" onclick="refundReject(this.type);" type="'+type+'">驳回</a>';
			str += '</div>';
		}
		var liDom = document.createElement("li");
		liDom.innerHTML = str;
		addClickListener3(liDom, data);
		listDom.appendChild(liDom);
		//设置列表项默认隐藏
		initExpandListDef(liDom);
	}
	//设置列表扩展状态
	initExpandList();
}

/*添加列表点击事件*/
function addClickListener3(el, data){
	$(el).on('click', function(){          
		//点击列表项时，处理
	});
}

//退款申请审批通过
function refundAgree(str){
	var param = str.split(",");
	refundId = param[7];
	$(".app_oper_r_fr").eq(0).text(param[4]);
	$(".app_oper_r_fr").eq(1).text(param[5]);
	$(".app_oper_r_fr").eq(2).text(param[3]);
	$(".app_oper_r_fr").eq(3).text(param[6]);
	$(".app_oper_r_fr").eq(5).text(param[1]);
	$("#agree").css("display","block");
	$(".lock").css("display","block");
}

//退款申请审批驳回
function refundReject(str){
	var param = str.split(",");
	refundId = param[7];
	$(".app_oper_r_fr").eq(4).text(param[0]);
	$(".app_oper_r_fr").eq(5).text(param[1]);
	$(".app_oper_r_fr").eq(6).text(param[4]);
	$(".app_oper_r_fr").eq(7).text(param[2]);
	$(".app_oper_r_fr").eq(8).text(param[5]);
	$(".app_oper_r_fr").eq(9).text(param[3]);
	$("#reject").css("display","block");
	$(".lock").css("display","block");
}

//处理方式选择
function setHandleWay(value){
	if(value==2){
		$('#customRow').show();
	}else{
		$('#customRow').hide();
	}
}

//设置事件监听
function setEventListener(){
	//软键盘回车键搜索
	$(".app_li_search input").bind('keypress', function (event) { 
    	if (event.keyCode == "13") { 
    		refreshData();
   		}
  	});
	//搜索框文字变化监听
	$(".app_li_search input").on('input propertychange', function(){
		refreshData();
	});
	//点击列表，搜索框取消焦点
	$(".w_all").on("touchstart", function(){
		$(".app_li_search input").blur();
	});
	$(".mescroll").on("touchstart", function(){
		$(".app_li_search input").blur();
	});
	//审批通过事件
	$("#csm_pass").click(function(){
		var money, mber;
		var way = $("#selWay").val();
		if(way == ""){
			showDlg("请选择处理方式");
			return;
		}
		if(way == "1"){
			money = $(".app_oper_r_fr").eq(2).text();
		}else{
			money = $('#customRow input').val();
			if(money == ""){
				showDlg("请输入自定义金额");
				return;
			}
		}
		mber = $(".app_oper_r_fr").eq(5).text();
		//审批通过
		handleRefundAgree(money, mber);
	});
	//审批驳回事件
	$("#csm_reject").click(function(){
		var reason = $("#reason").val(); 
		if(reason == ""){
			showDlg("请输入驳回原因");
			return;
		}
		//审批驳回
		handleRefundReject(reason);
	});
}

//刷新页面，重新获取页面数据
function refreshData(){
	searchKey = $(".app_li_search input").val();
	//刷新数据
	if(mescroll1 != null){
		mescroll1.resetUpScroll();
	}
	if(mescroll2 != null){
		mescroll2.resetUpScroll();
	}
	if(mescroll3 != null){
		mescroll3.resetUpScroll();
	}
}

//审批通过
function handleRefundAgree(money, mber){
	ajaxSyncRequest(getContextPath() + "operRefundPass", {"phone": userPhone, "id": refundId, "mber": mber, "money": money}, function(data){
		if(data.success){
			showToast("操作成功");
		}else{
			showDlg(data.msg);
		}
	});
}

//审批驳回
function handleRefundReject(reason){
	ajaxSyncRequest(getContextPath() + "operRefundReject", {"phone": userPhone, "id": refundId, "reason": reason}, function(data){
		if(data.success){
			showToast("操作成功");
		}else{
			showDlg(data.msg);
		}
	});
}
</script>
<style type="text/css">
.mescroll{
	position: fixed;
	top: 100px;
	bottom: 0;
	height: auto; /*如设置bottom:50px,则需height:auto才能生效*/
}
</style>
</head>
<body>
<div class="app_pop_price" style="display:none;" id="agree">
    <div class="app_pop_pt">退款申请详情</div>
    <div class="app_pop_pi">
    	<ul class="app_oper_r_dg">    
        	<li><span class="app_oper_r_fl">订单编号:</span><span class="app_oper_r_fr">S3YF0001001190822153724</span></li>
            <li><span class="app_oper_r_fl">充电结算金额:</span><span class="app_oper_r_fr">33</span></li>
            <li><span class="app_oper_r_fl">申请退款金额:</span><span class="app_oper_r_fr">33</span></li>
            <li><span class="app_oper_r_fl">退款原因:</span><span class="app_oper_r_fr">没有原因</span></li>
            <li>
            	<span class="app_oper_r_fl">处理方式:</span>
            	<select onchange="setHandleWay(this.value)" id="selWay">
					<option value="" >- 请选择 -</option>
					<option value="1">以申请退款金额为准</option>
					<option value="2">自定义金额</option>          
            	</select>
            </li>
            <li id="customRow" style="display:none">
            	<span class="app_oper_r_fl">自定义金额:</span>
            	<input type="number" style="width:100px;"/>
            </li>
        </ul>
    </div>
    <div class="app_oper_r_pb">
    	<button class="app_oper_r_bt_o close_b bg_b" id="csm_pass">确定</button>
    	<button class="app_oper_r_bt_c close_b" id="csm_cancel">取消</button>
    </div>
</div>
<div class="app_pop_price" style="display:none;" id="reject">
    <div class="app_pop_pt">退款详情</div>
    <div class="app_pop_pi">
    	<ul class="app_oper_r_dg">
    		<li><span class="app_oper_r_fl">售后编号:</span><span class="app_oper_r_fr">RF1821602819120190822154308</span></li>
    		<li><span class="app_oper_r_fl">申请会员:</span><span class="app_oper_r_fr">15524262871</span></li>
        	<li><span class="app_oper_r_fl">订单编号:</span><span class="app_oper_r_fr">S3YF0001001190822153724</span></li>
        	<li><span class="app_oper_r_fl">申请时间:</span><span class="app_oper_r_fr">2019-08-22 15:43:09</span></li>
            <li><span class="app_oper_r_fl">充电结算金额:</span><span class="app_oper_r_fr">33</span></li>
            <li><span class="app_oper_r_fl">申请退款金额:</span><span class="app_oper_r_fr">33</span></li>
            <li><span class="app_oper_r_fl">驳回原因:</span><input type="text" style="width:150px;" id="reason"/></li>          
        </ul>
    </div>
    <div class="app_oper_r_pb">
    	<button class="app_oper_r_bt_o close_b bg_b" id="csm_reject">确定</button>
    	<button class="app_oper_r_bt_c close_b" id="csm_cancel">取消</button>
    </div>
</div>
<div class="lock" style="display:none;"></div>
<div class="w_all app_main">
	<div class="app_quick">
    	<b class="iconfont">&#xe61a;</b>
        <dl>
        	<dd><a href="javascript:void(0);">扫一扫</a></dd>
            <dd><a href="javascript:void(0);">充电搜索</a></dd>
            <dd><a href="javascript:void(0);">钱包充值</a></dd>
            <dd><a href="javascript:void(0);">服务订单</a></dd>
            <dd><a href="javascript:void(0);">个人中心</a></dd>
        </dl>
    </div>
    <div class="lock" style="display:none;"></div>  
    <div class="app_li_search">
    	<label><b class="iconfont">&#xe741;</b><input type="search" value="" placeholder="输入用户手机号" /></label>
    </div>
    <div class="app_q_menu" style="margin-top:53px;">
    	<ul>
        	<li class="app_qm_in">会员提现订单</li>
            <li>会员充值订单</li>
            <li>会员退款订单</li>
        </ul>
    </div>
    <div id="mescroll1" class="app_oper_r_li mescroll" style="display:block;">
    	<div class="app_empty" style="display:none;">
    		<b class="iconfont">&#xe643;</b>
        	<i>暂无数据</i>
    	</div>
    	<ul id="dataList1">   <!-- 
        	<li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">CW1867670561420190916110541</span><span class="app_oper_r_sw">未审批</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;申请提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;实际提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;备注：没有备注</span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            	<div class="app_oper_r_bt_p">
            		<a class="app_oper_r_bt_s" onclick="withdrawalAgree();">审批</a>
            		<a class="app_oper_r_bt_b" onclick="withdrawalReject();">驳回</a>
            	</div>
            </li>
            <li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">CW1867670561420190916110541</span><span class="app_oper_r_ss">已审批</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;申请提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;实际提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;备注：没有备注</span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>
            <li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">CW1867670561420190916110541</span><span class="app_oper_r_st">退回</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;申请提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tixianjinezengzhiwan"><span class="app_oper_r_s">&nbsp;实际提现金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;备注：没有备注</span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>      -->
        </ul>
    </div>
    <div id="mescroll2" class="app_oper_r_li mescroll">
    	<div class="app_empty" style="display:none;">
    		<b class="iconfont">&#xe643;</b>
        	<i>暂无数据</i>
    	</div>
    	<ul id="dataList2">   <!-- 
        	<li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">RC1552426287120190912113259</span><span class="app_oper_r_sw">服务中</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;实际结算：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-riqi"><span class="app_oper_r_s">&nbsp;日期：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-chongzhijineicon"><span class="app_oper_r_s">&nbsp;充值金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-youhuijine"><span class="app_oper_r_s">&nbsp;优惠金额：0</span><br/></use>
					</svg>
					<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_0">未支付</span></span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>
            <li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">RC1552426287120190912113259</span><span class="app_oper_r_ss">已完成</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;实际结算：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-riqi"><span class="app_oper_r_s">&nbsp;日期：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-chongzhijineicon"><span class="app_oper_r_s">&nbsp;充值金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-youhuijine"><span class="app_oper_r_s">&nbsp;优惠金额：0</span><br/></use>
					</svg>
					<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_1">已支付</span></span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>
            <li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">RC1552426287120190912113259</span><span class="app_oper_r_st">异常</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shoujihao"><span class="app_oper_r_s">&nbsp;用户手机号：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;实际结算：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-riqi"><span class="app_oper_r_s">&nbsp;日期：2019-10-10 15:30</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-chongzhijineicon"><span class="app_oper_r_s">&nbsp;充值金额：33</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-youhuijine"><span class="app_oper_r_s">&nbsp;优惠金额：0</span><br/></use>
					</svg>
					<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-renwuzhongxin_chulizhuangtai_icon_daiban"><span class="app_oper_r_s">&nbsp;支付状态：<span class="app_oper_r_ps_0">未支付</span></span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>         -->
        </ul> 
    </div>
    <div id="mescroll3" class="app_oper_r_li mescroll">
    	<div class="app_empty" style="display:none;">
    		<b class="iconfont">&#xe643;</b>
        	<i>暂无数据</i>
    	</div> 
    	<ul id="dataList3">    <!-- 
        	<li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">RF1312897801520190824213004</span><span class="app_oper_r_sw">未处理</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqinghuiyuan"><span class="app_oper_r_s">&nbsp;申请会员：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：2019-10-10 15:30</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tuikuanjine"><span class="app_oper_r_s">&nbsp;退款金额：33</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-dingdanhao-copy"><span class="app_oper_r_s">&nbsp;充电订单编号：S3YF0001001190820105709</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;充电结算金额：33</span><br/></use>
					</svg>
					<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;退款原因：没有原因</span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            	<div class="app_oper_r_bt_p">
            		<a class="app_oper_r_bt_s" onclick="refundAgree();">审批</a>
            		<a class="app_oper_r_bt_b" onclick="refundReject();">驳回</a>
            	</div>
            </li>
            <li>
            	<div class="contain">
            		<div class="app_oper_r_ln">
        				<span class="app_oper_r_tz">RF1312897801520190824213004</span><span class="app_oper_r_ss">已处理</span>
        			</div>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqinghuiyuan"><span class="app_oper_r_s">&nbsp;申请会员：15524262871</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-shenqingshijian"><span class="app_oper_r_s">&nbsp;申请时间：2019-10-10 15:30</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-tuikuanjine"><span class="app_oper_r_s">&nbsp;退款金额：33</span><br/></use>
					</svg>
        		</div>
            	<div class="iconfont icon-xiala-anniu app_oper_r_m"></div>
            	<div class="app_oper_r_un"></div>
            	<div class="contain1">
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-dingdanhao-copy"><span class="app_oper_r_s">&nbsp;充电订单编号：S3YF0001001190820105709</span><br/></use>
					</svg>
            		<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-jine"><span class="app_oper_r_s">&nbsp;充电结算金额：33</span><br/></use>
					</svg>
					<svg class="app_svg_icon" aria-hidden="true">
  						<use xlink:href="#icon-beizhu"><span class="app_oper_r_s">&nbsp;退款原因：没有原因</span><br/></use>
					</svg>
            	</div>
            	<div class="iconfont icon-shangla-anniu app_oper_r_l"></div>
            	<div class="app_oper_r_un1"></div>
            </li>      -->
        </ul>
    </div>
</div>
<!-- 微信dialog -->
<div class="js_dialog" id="iosDialog1" style="display:none;">
    <div class="weui-mask"></div>
    <div class="weui-dialog">
        <div class="weui-dialog__bd">弹窗内容，告知当前状态、信</div>
        <div class="weui-dialog__ft">
            <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary">知道了</a>
        </div>
    </div>
</div>
<div class="js_dialog" id="iosDialog2" style="display:none;">
    <div class="weui-mask"></div>
    <div class="weui-dialog">
        <div class="weui-dialog__hd"><strong class="weui-dialog__title">提示</strong></div>
        <div class="weui-dialog__bd"></div>
        <div class="weui-dialog__ft">
            <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_primary" id="ok">确认</a>
            <a href="javascript:;" class="weui-dialog__btn weui-dialog__btn_default">取消</a>
        </div>
    </div>
</div>
<!-- 微信toast -->
<div id="toast" style="display:none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast">
        <i class="weui-icon-success-no-circle weui-icon_toast"></i>
        <p class="weui-toast__content">已完成</p>
    </div>
</div>
<!-- loading toast -->
<div id="loadingToast" style="display:none;">
    <div class="weui-mask_transparent"></div>
    <div class="weui-toast">
        <i class="weui-loading weui-icon_toast"></i>
        <p class="weui-toast__content">数据加载中</p>
    </div>
</div>    <!-- 
<script type="text/javascript" src="../js/wx_foot.js"></script>    -->
</body>
</html>
沧海龙腾LV
发布了106 篇原创文章 · 获赞 65 · 访问量 22万+
私信 关注

猜你喜欢

转载自blog.csdn.net/xialong_927/article/details/103694937
今日推荐
TIOBE 5 月榜单：Fortran “复活”进入 Top 10
GCC 14.1 发布
面壁智能发布 Eurux-8x22B 开源大模型 —— 堪称「理科状元」
开源日报 | 谷歌扶持鸿蒙上位；开源Rabbit R1；Docker加持的安卓手机；微软的焦虑和野心；海尔电器把开放平台关了
中国码农的“35岁魔咒”
蘭雅 CorelDRAW 插件 2024.5.1 国际劳动节版，免费下载
Arc Browser for Windows 1.0 正式 GA
90后程序员开发视频搬运软件、不到一年获利超 700 万，结局很刑！
周排行
基本数据类型封装类比较 Java源码解读(一) 8种基本类型对应的封装类型
JS实现无缝滚动上
深入解析HashMap原理（基于JDK1.8）
mysql的连接池
关于.htc
linux下的ubuntu12.04图形界面
【数论】好推不好记的扩展欧几里德
设备树详解
cscope + tags 简单设置
xml学习
每日归档
更多
2024-05-09(35)
2024-05-08(42)
2024-05-07(14)
2024-05-06(40)
2024-05-05(0)
2024-05-04(7)
2024-05-03(19)
2024-05-02(0)
2024-05-01(4)
2024-04-30(1)

代码天地 © 2018 codetd.com

境外服务器   最新电视剧2022