You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
151 lines
5.4 KiB
151 lines
5.4 KiB
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>订单详情</title>
|
|
<link rel="stylesheet" href="./3D旋转图.css">
|
|
<link rel="stylesheet" href="./订单文字设置.css">
|
|
<link rel="stylesheet" href="./超链接字体改变.js">
|
|
<!-- <link href="car.css" rel="stylesheet" type="text/css">-->
|
|
<style>
|
|
.demo1{
|
|
width: 100%;
|
|
height: 100px;
|
|
background-color: #bbffaa;
|
|
display: flex;
|
|
}
|
|
.demo2{
|
|
width: 100%;
|
|
height: 2048px;
|
|
margin: 0px;
|
|
display: flex;
|
|
position: relative;
|
|
/*flex-direction: column;*/
|
|
}
|
|
.demo1{
|
|
height: 100%;
|
|
width: 1200px;
|
|
opacity: 0.5;
|
|
position: absolute;
|
|
}
|
|
.tableMyOrder{
|
|
position: absolute;
|
|
left: 200px;
|
|
top: 500px;
|
|
right: 200px;
|
|
}
|
|
|
|
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="Demo" style="width: 1200px;margin-left: auto;margin-right: auto">
|
|
|
|
<img class="demo1" src="order.jpg"></img>
|
|
<div class="demo2" style="width: 1200px;margin-left: auto;margin-right: auto">
|
|
<div class="cube">
|
|
<div class="box1">
|
|
<img src="./1.png" style="height: 100px;width: 100px">
|
|
</div>
|
|
<div class="box2" >
|
|
<img src="2.png" style="height: 100px;width: 100px">
|
|
</div>
|
|
<div class="box3">
|
|
<img src="3.png" style="height: 100px;width: 100px">
|
|
</div>
|
|
<div class="box4">
|
|
<img src="4.png" style="height: 100px;width: 100px" >
|
|
</div>
|
|
<div class="box5">
|
|
<img src="5.png" style="height: 100px;width: 100px">
|
|
</div>
|
|
<div class="box6">
|
|
<img src="6.png" style="height: 100px;width: 100px">
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<p name="MyOrder">我的订单</p>
|
|
<hr style="width : 900px">
|
|
<ul class="orderContentUl">
|
|
<li><a href="javascript:HideOrShowFont('a1')" id="a1" >全部订单</a></li>
|
|
<li><a href="javascript:HideOrShowFont('a2')" id="a2" >待支付</a></li>
|
|
<li><a href="javascript:HideOrShowFont('a3')" id="a3" >待收货</a></li>
|
|
<li><a href="javascript:HideOrShowFont('a4')" id="a4" >已完成</a></li>
|
|
<li><a href="javascript:HideOrShowFont('a5')" id="a5" >待评价</a></li>
|
|
<li><a href="javascript:HideOrShowFont('a6')" id="a6" >已取消</a></li>
|
|
</ul>
|
|
<script src="超链接字体改变.js"></script>
|
|
</div>
|
|
<div>
|
|
<form action="post">
|
|
<input type="text" value="请输入订单号">
|
|
<a href="javascript:SearchOrder()" ><img src="搜索图标.png" alt="搜索图标" class="imgSearch" style="width: 45px;height: 45px"></a>
|
|
<script>
|
|
function SearchOrder() {
|
|
alert("请输入正确订单号！");
|
|
}
|
|
</script>
|
|
</form>
|
|
</div>
|
|
<div class="list-group-title">
|
|
<table border="0" cellspacing="0" cellspacing="0" class="Table">
|
|
<therd>
|
|
<tr>
|
|
<th width="500px" style="text-align: center">商品</th>
|
|
<th>单价/元</th>
|
|
<th>数量</th>
|
|
<th>状态</th>
|
|
<th>实付款/元</th>
|
|
<th>订单状态及操作</th>
|
|
</tr>
|
|
</therd>
|
|
</table>
|
|
</div>
|
|
<div class="list-group-goods1">
|
|
<table border="0" cellspacing="0" cellspacing="0" class="Table">
|
|
<therd>
|
|
<tr>
|
|
<th width="500px" style="text-align: center"><img src="饮品1.jpg" width="180px"></th>
|
|
<th>20/元</th>
|
|
<th>1</th>
|
|
<th>已支付</th>
|
|
<th>20/元</th>
|
|
<th>已完成</th>
|
|
</tr>
|
|
</therd>
|
|
</table>
|
|
</div>
|
|
<div class="list-group-goods2">
|
|
<table border="0" cellspacing="0" cellspacing="0" class="Table">
|
|
<therd>
|
|
<tr>
|
|
<th width="500px" style="text-align: center"><img src="饮品3.jpg" width="180px"></th>
|
|
<th>20/元</th>
|
|
<th>1</th>
|
|
<th>已支付</th>
|
|
<th>20/元</th>
|
|
<th>已完成</th>
|
|
</tr>
|
|
</therd>
|
|
</table>
|
|
</div>
|
|
<div class="list-group-goods3">
|
|
<table border="0" cellspacing="0" cellspacing="0" class="Table">
|
|
<therd>
|
|
<tr>
|
|
<th width="500px" style="text-align: center"><img src="饮品2.jpg" width="180px"></th>
|
|
<th>20/元</th>
|
|
<th>1</th>
|
|
<th>已支付</th>
|
|
<th>20/元</th>
|
|
<th>已完成</th>
|
|
</tr>
|
|
</therd>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
</html>
|