shopping_hascard.html 12.9 KB
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>已购服务卡-{$tpshop_config['shop_info_store_title']}</title>
		<include file="public/header" />
	<body>
		<ul class="card_head">
				<li onclick="javascript:window.location.href='{:U('Mobile/User/shopping_card',array('stoid'=>$Think.request.stoid))}'">
					<span>订购卡券</span>
				</li>
				<li class="on" onclick="javascript:window.location.href='{:U('Mobile/User/shopping_hascard',array('stoid'=>$Think.request.stoid))}'">
					<span>已购卡券</span>
				</li>
			</ul>
			<div class="card_info">
				<p>
					<label>使用门店:</label>
					<select class="info_text" onchange="sel_1(this);">
						<option value="">全部</option>
						<foreach name="clist_c" item="vc">
							<option value="{$vc.id}">{$vc.storagename}</option>
						</foreach>
					</select>
				</p>
				<p>
					<label>服务类型:</label>
					<select class="info_text"  id="temp1" onchange="sel_2(this);">
						<option value="">全部</option>
						<foreach name="clist_x" item="vx">
							<option value="{$vx.xzno}">{$vx.xzname}</option>
						</foreach>

					</select>
				</p>
			</div>
			<div class="card_nav">
				<ul  id="temp2">
					<li class="on"  data-id="" onclick="sel_3(this);">
						全部
					</li>
					<foreach name="clist_b" item="vb">
						<li data-id="{$vb.xzno}" onclick="sel_3(this);">
							{$vb.xzname}
						</li>
					</foreach>
				</ul>
			</div>
			<ul class="card_list">
				<foreach name='cardlist' item='cardlist' key="k">
					<if condition="$cardlist.isgq eq 1">
						<li class="gray">
					<p class="tit">有效期至:{$cardlist.enddate}</p>
					<div class="left">
						<p></p>
						<p class="color"><span>{:floatval($cardlist.qty)}</span></p>
						<p><a class="use_record" data-id="{$cardlist.id}" onclick="use_record(this);">使用记录</a></p>
					</div>
					<div class="right">
						<p><span>{:floatval($cardlist.sum)}</span></p>
						<p class="cut">{$cardlist.servername}</p>
					</div>
					<div class="f_card">
						<span class="fl cut">注:{$cardlist.remark}</span>
						<a class="fr buy" >已经过期</a>
						<div class="clear"></div>
					</div>
					</li>
						<else/>
						<li class="<if condition="$k%3 eq 0">blue<else/><if condition="$k%3 eq 1">red<else/>green</if></if>">
					<p class="tit">有效期至:{$cardlist.enddate}</p>
					<div class="left">
						<p></p>
						<p class="color"><span>{:floatval($cardlist.syqty)}</span></p>
						<p><a class="use_record" data-id="{$cardlist.id}" onclick="use_record(this);">使用记录</a></p>
					</div>
					<div class="right">
						<p><span>{$cardlist.sum}</span></p>
						<p class="cut">{$cardlist.servername}</p>
					</div>
					<div class="f_card">
						<span class="fl cut">注:{$cardlist.remark}</span>
						<a class="fr buy" data-id="{$cardlist.cardno}"  onclick="show('{$cardlist.cardno}');">二维码<em class="code"><img src="__STATIC__/images/user/code_card.png"/><span class="dis_vm"></span></em></a>
						<div class="clear"></div>
					</div>
					</li>
					</if>

				</foreach>
				<!--<li class="blue">-->
					<!--<p class="tit">有效期至:2017-12-25</p>-->
					<!--<div class="left">-->
						<!--<p></p>-->
						<!--<p class="color"><span>5</span>次</p>-->
						<!--<p><a class="use_record">使用记录</a></p>-->
					<!--</div>-->
					<!--<div class="right">-->
						<!--<p><span>180</span>元</p>-->
						<!--<p class="cut">宝宝游泳卡</p>-->
					<!--</div>-->
					<!--<div class="f_card">-->
						<!--<span class="fl cut">注:可在田娜门店使用。仅限周末可用,需提前一天预约。</span>-->
						<!--<a class="fr buy">二维码<em class="code"><img src="__STATIC__/images/user/code_card.png"/><span class="dis_vm"></span></em></a>-->
						<!--<div class="clear"></div>-->
					<!--</div>-->
				<!--</li>-->
				<!--<li class="red">-->
					<!--<p class="tit">有效期至:2017-12-25</p>-->
					<!--<div class="left">-->
						<!--<p></p>-->
						<!--<p class="color"><span>5</span>次</p>-->
						<!--<p><a class="use_record">使用记录</a></p>-->
					<!--</div>-->
					<!--<div class="right">-->
						<!--<p><span>180</span>元</p>-->
						<!--<p class="cut">宝宝游泳卡</p>-->
					<!--</div>-->
					<!--<div class="f_card">-->
						<!--<span class="fl cut">注:可在田娜门店使用。仅限周末可用,需提前一天预约。</span>-->
						<!--<a class="fr buy">二维码<em class="code"><img src="__STATIC__/images/user/code_card.png"/><span class="dis_vm"></span></em></a>-->
						<!--<div class="clear"></div>-->
					<!--</div>-->
				<!--</li>-->
				<!--<li class="gray">-->
					<!--<p class="tit">有效期至:2017-12-25</p>-->
					<!--<div class="left">-->
						<!--<p></p>-->
						<!--<p class="color"><span>5</span>次</p>-->
					<!--</div>-->
					<!--<div class="right">-->
						<!--<p><span>180</span>元</p>-->
						<!--<p class="cut">宝宝游泳卡</p>-->
					<!--</div>-->
					<!--<div class="f_card">-->
						<!--<span class="fl cut">注:可在田娜门店使用。仅限周末可用,需提前一天预约。</span>-->
						<!--<a class="fr buy">已经过期</a>-->
						<!--<div class="clear"></div>-->
					<!--</div>-->
				<!--</li>-->
			</ul>
			<!--弹窗-->
			<div class="layermbox dn" onclick="hide_shop()">
				<div class="laymshade"></div>
				<div class="layermmain">
					<div class="section">
						<div class="layermchild" style="width: 80%;">
							<ul class="shop_list">
								<!--<li>-->
									<!--<a>-->
										<!--<span class="tit">门店</span>-->
										<!--<span class="tit">次数</span>-->
									<!--</a>-->
								<!--</li>-->
								<!--<li>-->
									<!--<a>-->
										<!--<span><p>田娜门店</p><p>2017-08-23</p></em></span>-->
										<!--<span>1次</span>-->
									<!--</a>-->
								<!--</li>-->
								<!--<li>-->
									<!--<a>-->
										<!--<span><p>田娜门店</p><p>2017-08-23</p></em></span>-->
										<!--<span>1次</span>-->
									<!--</a>-->
								<!--</li>-->
							</ul>
						</div>
					</div>
				</div>
			</div>
		<input id="storageid" type="hidden" value=""/>
		<input id="serve_cate" type="hidden" value=""/>
		<input id="card_cate" type="hidden" value=""/>
		<!-- 微信浏览器 调用微信 分享js-->
		<include file="public/wx_share"/>
		<!-- 微信浏览器 调用微信 分享js  end-->
	</body>
</html>
<script type="text/javascript">
    var cardlist=JSON.parse('{$cardlist1}');
    var serve_list=JSON.parse('{$clist_x1}');
    var card_list=JSON.parse('{$clist_b1}');
    var temp=new Array();   //临时存放_服务卡项目
    var temp1=new Array();   //临时存放_服务类型
    var temp2=new Array();   //临时存放_卡片类型
    var vipuselist='{$vipuselist}';
    if(vipuselist!="")
	{
        vipuselist=JSON.parse(vipuselist);
	}

//    var vipuselist=JSON.parse('{$vipuselist}');
    var storageid='';
    var serve_cate='';
    var card_cate='';

//    $(".card_nav li").click(function(){
//        card_cate=$(this).attr("data-id");
//        $(".card_nav li").removeClass("on");
//        $(this).addClass("on");
//        getdata();
//    });

    function hide_shop(){
        $(".layermbox").addClass("dn");
    }
    function sel_1(obj) {
        storageid=$(obj).val();
        serve_cate="";
        card_cate="";
        getdata(1);
    }
    function sel_2(obj) {
        serve_cate=$(obj).val();
        card_cate="";
        getdata(2);
    }
    function sel_3(that) {
        card_cate=$(that).attr("data-id");
        $(".card_nav li").removeClass("on");
        $(that).addClass("on");
        getdata(3);
    }


    function getdata(k) {
        var ismiss=true;
        temp=[];
        temp1=[];
        temp2=[];
        var html="";
        var t=0;
        for(var i=0;i<cardlist.length;i++)
        {
            var row=cardlist[i]
            if(storageid!="" && row.storageid!="" && row.storageid.indexOf(storageid)==-1)
            {
                ismiss=false;
            }
            if(serve_cate!="" && row.xmno!=serve_cate)
            {
                ismiss=false;
            }
            if(card_cate!="" && row.kno!=card_cate)
            {
                ismiss=false;
            }
            if(ismiss)
            {
                t++;
                if(temp1.indexOf(row.xmno)==-1)
                {
                    temp1.push(row.xmno);
                }
                if(temp2.indexOf(row.kno)==-1)
                {
                    temp2.push(row.kno);
                }
                temp.push(row);
//                html+="<li class='"+(t%3==0?'blue':(t%3==1?'red':'green'))+"'>					<p class='tit'>有效期至:"+row.enddate.toString().substring(0,10)+"</p>					<div class='left'>						<p></p>						<p class='color'><span>"+parseInt(row.qty==''?0:row.qty)+"</span>次</p><p><a class='use_record' data-id='"+row.id+"' onclick='use_record(this);'>使用记录</a></p>					</div>					<div class='right'>						<p><span>"+parseFloat(row.price)+"</span>元</p>						<p class='cut'>"+row.servername+"</p>					</div>					<div class='f_card'>						<span class='fl cut'>注:"+row.remark+"</span>						<a class='fr buy' data-id='"+row.cardno+"' onclick='show(&apos;"+row.cardno+"&apos;);'>二维码<em class='code'><img src='__STATIC__/images/user/code_card.png'/><span class='dis_vm'></span></em></a>						<div class='clear'></div>					</div>				</li>";
            }
            ismiss=true;
        }
        reset_info(k);
    }

    function reset_info(obj) {
        var html="";
        var html1="";
        var html2=""
        switch (obj)
        {
            case 1:
                for(var t1=0;t1<serve_list.length;t1++)
                {
                    if(temp1.toString().indexOf(serve_list[t1].xzno)>-1)
                    {
                        html1+="<option value=\""+serve_list[t1].xzno+"\">"+serve_list[t1].xzname+"</option>";
                    }
                }
                for(var t2=0;t2<card_list.length;t2++)
                {
                    if(temp2.toString().indexOf(card_list[t2].xzno)>-1)
                    {
                        html2+="<li data-id=\""+card_list[t2].xzno+"\" onclick=\"sel_3(this);\">"+card_list[t2].xzname+"</li>";
                    }
                }
                $("#temp1").html("<option value=\"\">全部</option>"+html1);
                $("#temp2").html("<li class=\"on\" data-id=\"\" onclick=\"sel_3(this);\">全部</li>"+html2);
                break;
            case 2:
                for(var t2=0;t2<card_list.length;t2++)
                {
                    if(temp2.toString().indexOf(card_list[t2].xzno)>-1)
                    {
                        html2+="<li data-id=\""+card_list[t2].xzno+"\"  onclick=\"sel_3(this);\">"+card_list[t2].xzname+"</li>";
                    }
                }
                $("#temp2").html("<li class=\"on\" data-id=\"\"  onclick=\"sel_3(this);\">全部</li>"+html2);
                break;
            default:break;
        }
        for(var t=0;t<temp.length;t++) //项目
        {
            var row=temp[t];
            html+="<li class='"+(t%3==0?'blue':(t%3==1?'red':'green'))+"'>					<p class='tit'>有效期至:"+row.enddate.toString().substring(0,10)+"</p>					<div class='left'>						<p></p>						<p class='color'><span>"+parseInt(row.syqty==''?0:row.syqty)+"</span>次</p><p><a class='use_record' data-id='"+row.id+"' onclick='use_record(this);'>使用记录</a></p>					</div>					<div class='right'>						<p><span>"+parseFloat(row.sum)+"</span>元</p>						<p class='cut'>"+row.servername+"</p>					</div>					<div class='f_card'>						<span class='fl cut'>注:"+row.remark+"</span>						<a class='fr buy' data-id='"+row.cardno+"' onclick='show(&apos;"+row.cardno+"&apos;);'>二维码<em class='code'><img src='__STATIC__/images/user/code_card.png'/><span class='dis_vm'></span></em></a>						<div class='clear'></div>					</div>				</li>";
        }
        if(html==""){html="<div class=\"tac\">暂无卡券</div>";}
        $(".card_list").html(html);
    }


    function use_record(obj) {
		var id=$(obj).attr('data-id');
		var html='';
		for(var i=0;i<vipuselist.length;i++)
		{
		    var row=vipuselist[i];
		    if(row.buyitemid.toString()==id)
			{
			    html +="<li><a><span><p>"+row.storagename+"</p><p>"+row.billdate.toString().substring(0,10)+"</p></em></span><span>1次</span></a></li>";
			}
		}
		if(html!='')
		{
            $('.shop_list').html("<li><a><span class='tit'>门店</span><span class='tit'>次数</span></a></li>"+html);
            $(".layermbox").removeClass("dn");
		}
		else
		{
            layer.open({content:'暂未使用',time:2});
		}

    }

    function show(urlstr) {
        var str="<Div style='width:250px;'><Img src='/index.php?m=Home&c=Index&a=qr_code&data="+urlstr+"' width='210' height='210' style=' padding: 20px 20px 0px 20px'><p class='tac p10'>"+urlstr+"</p></Div>";
        layer.open({
            type: 1,
            title: "",
            scrollbar: false,
            content:str
        });

    }
</script>