订单列表首页
示例源码
<style>
.goods-title {
color: #757575 !important;
}
.goods-price {
color: #666666 !important;
font-weight: 700;
}
</style>
<div class="aui-tips aui-bg-warning aui-margin-b-15" id="tips-1">
<i class="aui-iconfont aui-icon-info"></i>
<div class="aui-tips-title">消息提示条消息提示条消息提示</div>
<i class="aui-iconfont aui-icon-close" tapmode="" onclick="closeTips()"></i>
</div>
<section class="aui-content">
<div class="aui-card-list aui-border-t aui-border-b">
<div class="aui-card-list-header aui-card-list-user">
<div class="aui-card-list-user-avatar">
<img src="/static/auicss/img/demo1.png">
</div>
<div class="aui-card-list-user-name">
<div class="aui-font-size-16">陕十三肉夹馍 <i class="aui-iconfont aui-icon-right aui-font-size-12"></i></div>
<small>订单已完成</small>
</div>
<div class="aui-card-list-user-info">5小时30分钟前</div>
</div>
<div class="aui-card-list-content aui-border-t" style="margin-left: 3.5rem;">
<ul class="aui-list aui-list-noborder">
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
</ul>
</div>
<div class="aui-card-list-footer aui-border-t">
<div></div>
<div>
<div class="aui-btn aui-btn aui-btn-outlined aui-btn-info aui-margin-r-10">再来一单</div>
<div class="aui-btn aui-btn aui-btn-outlined aui-btn-warning">评价得积分</div>
</div>
</div>
</div>
<div class="aui-card-list aui-border-t aui-border-b">
<div class="aui-card-list-header aui-card-list-user">
<div class="aui-card-list-user-avatar">
<img src="/static/auicss/img/demo1.png">
</div>
<div class="aui-card-list-user-name">
<div class="aui-font-size-16">陕十三肉夹馍 <i class="aui-iconfont aui-icon-right aui-font-size-12"></i></div>
<small>订单已完成</small>
</div>
<div class="aui-card-list-user-info">5小时30分钟前</div>
</div>
<div class="aui-card-list-content aui-border-t" style="margin-left: 3.5rem;">
<ul class="aui-list aui-list-noborder">
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
</ul>
</div>
<div class="aui-card-list-footer aui-border-t">
<div></div>
<div>
<div class="aui-btn aui-btn aui-btn-outlined aui-btn-warning">评价得积分</div>
</div>
</div>
</div>
<div class="aui-card-list aui-border-t aui-border-b">
<div class="aui-card-list-header aui-card-list-user">
<div class="aui-card-list-user-avatar">
<img src="/static/auicss/img/demo1.png">
</div>
<div class="aui-card-list-user-name">
<div class="aui-font-size-16">陕十三肉夹馍 <i class="aui-iconfont aui-icon-right aui-font-size-12"></i></div>
<small>订单已完成</small>
</div>
<div class="aui-card-list-user-info">5小时30分钟前</div>
</div>
<div class="aui-card-list-content aui-border-t" style="margin-left: 3.5rem;">
<ul class="aui-list aui-list-noborder">
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
<div class="aui-list-item aui-padded-l-0">
<div class="aui-list-item-inner">
<div class="aui-list-item-title aui-font-size-14 goods-title">超值单人餐</div>
<div class="aui-list-item-right goods-price">¥55</div>
</div>
</div>
</ul>
</div>
<div class="aui-card-list-footer aui-border-t">
<div></div>
<div>
<div class="aui-btn aui-btn aui-btn-outlined aui-btn-warning">评价得积分</div>
</div>
</div>
</div>
</section>
<script>
// 关闭提示条
function closeTips(){
document.getElementById('tips-1').remove();
}
</script>