order.html 4.3 KB
<!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 name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/base.css" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script src="js/base.js" type="text/javascript" charset="utf-8"></script>
<script src="js/jquery-1.8.3.min.js"></script>
<script>
 function tab(pid){
	$("li.or_li").removeClass("oron");
    $("li#or"+pid).addClass("oron");
	$("div.or_div").css("display","none");
    $("div#tab"+pid).css("display","block");
 }
 </script>

<style>
    .orpart{
        width: 7.5rem;
    }
#tab2{
	display:none;
	}
#tab3{
	display:none;
	}
#tab4{
	display:none;
	}
</style>
<title>我的订单</title>
</head>

<body>

<div class="orheader center">
	<div class="left orback"><a href="#" onClick="javascript:history.back(-1);"><img src="images/care_03.jpg"/></a></div>
    <div class="bloodtext">我的订单</div>
</div>

<div class="ornav center">
	<div class="ortopli">
    	<ul>
        	<li id="or1" class="or_li oron"><a href="#" onclick="tab('1')">全部</a></li>
            <li id="or2" class="or_li"><a href="#" onclick="tab('2')">待付款</a></li>
            <li id="or3" class="or_li"><a href="#" onclick="tab('3')">进行中</a></li>
            <li id="or4" class="or_li"><a href="#" onclick="tab('4')">已完成</a></li>
        </ul>
    </div>
</div>

<div class="or_div" id="tab1">
<div class="orpart">
	<div class="ordernum">订单号:010201800078<span class="pay right">待付款</span></div>
    <div class="orcon">
    	<p class="cate center">家庭医生</p>
        <p class="ordesc textleft"><a href="#">【家庭医生送长辈,安全可靠保健康】上有老、下有小是...</a></p>
        <p class="ortime">预约下单日期:2018-02-19  17:22</p>
        <p class="right orprice">合计:<span>¥5290</span></p>
    </div>
    <div class="right gopay"><a href="#">去支付</a></div>
</div>

<div class="orpart">
	<div class="ordernum">订单号:009201800056<span class="cancel right">已取消</span></div>
    <div class="orcon">
    	<p class="cate center">专业护理</p>
        <p class="ordesc textleft"><a href="#">【居家照护】适合出院后需要持续照护、失能/半失能以及...</a></p>
        <p class="ortime">预约服务时间:2018-03-20  13:00</p>
        <p class="right orprice">合计:<span>¥0</span></p>
    </div>
</div>
</div>

<div class="or_div" id="tab2">
<div class="orpart">
    <div class="ordernum">订单号:010201800078<span class="pay right">待付款</span></div>
    <div class="orcon">
    	<p class="cate center">家庭医生</p>
        <p class="ordesc textleft"><a href="#">【家庭医生送长辈,安全可靠保健康】上有老、下有小是...</a></p>
        <p class="ortime">预约下单日期:2018-02-19  17:22</p>
        <p class="right orprice">合计:<span>¥5290</span></p>
    </div>
    <div class="right gopay"><a href="#">去支付</a></div>
</div>
</div>

<div class="or_div" id="tab3">
    <div class="orpart">
        <div class="ordernum">订单号:009201800056<span class="cancel right">进行中</span></div>
        <div class="orcon">
            <p class="cate center">专业护理</p>
            <p class="ordesc textleft"><a href="#">【居家照护】适合出院后需要持续照护、失能/半失能以及...</a></p>
            <p class="ortime">预约服务时间:2018-03-20  13:00</p>
            <p class="right orprice">合计:<span>¥0</span></p>
        </div>
    </div>
</div>

<div class="or_div" id="tab4">
    <div class="orpart">
        <div class="ordernum">订单号:009201800056<span class="cancel right">已完成</span></div>
        <div class="orcon">
            <p class="cate center">专业护理</p>
            <p class="ordesc textleft"><a href="#">【居家照护】适合出院后需要持续照护、失能/半失能以及...</a></p>
            <p class="ortime">预约服务时间:2018-03-20  13:00</p>
            <p class="right orprice">合计:<span>¥0</span></p>
        </div>
    </div>
</div>
<div style="background-color:#fff; height:5.6rem;"></div>
</body>