Authored by lijing

新增弹框

... ... @@ -28,6 +28,15 @@
</div>
</div>
</div>
<div class="dia-c">
<div class="dia-bg"></div>
<div class="dia-main">
<span class="close"></span>
<img src="{{imgSrc 'img/activity/raffle/dia-succ.png'}}" />
<img class="hide" src="{{imgSrc 'img/activity/raffle/dia-err.png'}}" />
<a></a>
</div>
</div>
{{/ order}}
</div>
... ...
<div class="order" data-id="{{orderNum}}" data-href="{{detailUrl}}">
<header class="header">
订单编号:{{orderNum}}
<div class="raffle-btn">参与抽奖</div>
<div class="disable-btn hide">已抽奖</div>
<span class="order-status">{{orderStatus}}</span>
</header>
<section class="order-goods">
... ...
... ... @@ -123,6 +123,7 @@ function getOrders(option) {
data: opt,
success: function(data) {
var num;
if (data != '') {
order.page = opt.page;
... ... @@ -195,6 +196,13 @@ orderHammer.on('tap', function(e) {
$reaMask.data('orderId', id);
if ($cur.closest('.raffle-btn').length > 0) {
$('.dia-c').show();
var dia_h = $('.dia-main').height() / 2;
$('.dia-main').css('margin-top', '-' + dia_h + 'px');
}
if ($cur.closest('.del').length > 0) {
// Order delete
... ... @@ -342,3 +350,7 @@ $reaMask.on('touchend', function(event) {
$reaMask.css('visibility', 'hidden');
event.stopPropagation();
});
$('.dia-c .close').on('click', function() {
$('.dia-c').hide();
});
... ...
... ... @@ -101,4 +101,81 @@
}
}
}
}
\ No newline at end of file
}
.order-page {
.order {
.header {
border-bottom: 1px solid #e0e0e0;
.raffle-btn {
width: 140px;
height: 60px;
line-height: 60px;
background-color: #e01;
color: #fff;
font-size: 24px;
position: absolute;
right: 30px;
top: 15px;
border-radius: 8px;
text-align: center;
}
.disable-btn {
width: 140px;
height: 60px;
line-height: 60px;
background-color: #e0e0e0;
color: #454545;
font-size: 24px;
position: absolute;
right: 30px;
top: 15px;
border-radius: 8px;
text-align: center;
}
}
}
.dia-c {
display: none;
width: 100%;
height: 100%;
position: fixed;
top: 0;
bottom: 0;
right: 0;
left: 0;
.dia-bg {
width: 100%;
height: 100%;
top: 0;
bottom: 0;
right: 0;
left: 0;
background-color: #000;
opacity: 0.7;
}
.dia-main {
width: 540px;
position: absolute;
top: 50%;
left: 50%;
margin-left: -270px;
}
.close {
width: 40px;
height: 40px;
background-repeat: no-repeat;
background-image: resolve("activity/raffle/close.png");
position: absolute;
top: -20px;
right: -20px;
background-size: 100%;
}
}
}
... ...