fe / YOHOBUYPC · Commits

Go to a project

Authored by xuqi
Commit ab402af342fd1447783d5876c616b60f3dd53578 1 parent 42c766c0

order ensure style

Inline Side-by-side
Showing 6 changed files with 217 additions and 40 deletions
... ... @@ -899,7 +899,7 @@
],
goods: [
{
... //购物车商品
... //订单商品
}
],
coupon: {
... ...
@import "good", "chose-panel", "gift-advance-good";
@import "good", "chose-panel", "gift-advance-good", "order-ensure";
.icon-checkbox:before { content: "\e61c"; }
... ...
.order-ensure-page {
background: #f0f0f0;
.block {
background: #fff;
margin: 20rem / $pxConvertRem 0;
padding: 30rem / $pxConvertRem 20rem / $pxConvertRem;
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
}
.title {
font-size: 26rem / $pxConvertRem;
font-weight: bold;
}
.address-wrap {
display: block;
position: relative;
margin-top: 0;
border-top: none;
> .iconfont {
position: absolute;
color: #bcbcbc;
right: 20rem / $pxConvertRem;
top: 50%;
margin-top: -8px;
}
.infos {
font-weight: bold;
font-size: 24rem / $pxConvertRem;
padding-right: 55rem / $pxConvertRem;
}
.per-info {
float: right;
}
.address {
display: block;
margin-top: 20rem / $pxConvertRem;
color: #bcbcbc;
font-weight: normal;
}
}
.dispatch .title {
margin-bottom: 10rem / $pxConvertRem;
}
.dispatch .sub-block:first-child {
border-bottom: 1px solid #f7f7f7;
margin-bottom: 15rem / $pxConvertRem;
}
.dispatch-mode li,
.dispatch-time li {
float: left;
padding: 10rem / $pxConvertRem 20rem / $pxConvertRem;
margin-right: 15rem / $pxConvertRem;
margin-bottom: 15rem / $pxConvertRem;
border: 1px solid #c9c9c9;
color: #676767;
font-size: 26rem / $pxConvertRem;
}
.goods {
margin-right: -20rem / $pxConvertRem;
}
.sale-invoice {
margin-top: -20rem / $pxConvertRem;
font-size: 24rem / $pxConvertRem;
li {
height: 90rem / $pxConvertRem;
line-height: 90rem / $pxConvertRem;
border-bottom: 1px solid #f7f7f7;
}
.coupon-count {
padding: 5rem / $pxConvertRem;
background: #f00;
color: #fff;
@include border-radius(10px);
margin-left: 20rem / $pxConvertRem;
}
.coupon-use,
.coin-check {
float: right;
color: #999;
}
.coin-check {
float: right;
color: #999;
.checkbox {
margin-left: 5rem / $pxConvertRem;
color: #000;
}
}
.checkbox.icon-checkbox {
color: #999;
}
.invoice .checkbox {
float: right;
}
.desc {
color: #999;
}
}
.total {
font-size: 22rem / $pxConvertRem;
margin-top: 20rem / $pxConvertRem;
span {
display: inline-block;
width: 130rem / $pxConvertRem;
}
}
.cost {
border-top: 1px solid #f7f7f7;
line-height: 100rem / $pxConvertRem;
margin-top: 10rem / $pxConvertRem;
font-size: 34rem / $pxConvertRem;
em {
color: #f00;
}
}
.pay-mode {
background: #fff;
padding: 0 20rem / $pxConvertRem;
margin-top: -22rem / $pxConvertRem;
li {
height: 88rem / $pxConvertRem;
line-height: 88rem / $pxConvertRem;
margin-bottom: 28rem / $pxConvertRem;
@include border-radius(5px);
font-size: 32rem / $pxConvertRem;
color: #fff;
text-align: center;
}
.cod {
background: #000;
}
.pay-online {
background: #57b038;
}
}
}
\ No newline at end of file
... ...
{{> layout/header}}
<div class="order-ensure-page yoho-page">
{{# orderEnsure}}
<section class="block">
<p>
<a class="address-wrap block">
<p class="infos">
收货地址
<span class="per-info">{{name}} {{phoneNum}}</span>
<span class="address">{{address}}</span>
</p>
<p class="address">
{{address}}
</p>
</section>
<span class="iconfont">&#xe614;</span>
</a>
<section class="block">
<section class="dispatch block">
<div class="sub-block">
<h3 class="title">配送方式</h3>
<ul class="dispatch-mode">
<ul class="dispatch-mode clearfix">
{{#each dispatchMode}}
<li data-id="{{id}}">{{name}}</li>
{{/each}}
... ... @@ -23,7 +22,7 @@
<div class="sub-block">
<h3 class="title">送货时间</h3>
<ul class="dispatch-time">
<ul class="dispatch-time clearfix">
{{#each dispatchTime}}
<li data-id="{{id}}">{{name}}</li>
{{/each}}
... ... @@ -35,13 +34,13 @@
<h3 class="title">商品</h3>
<div class="goods">
{{#each goods}}
{{> shopping-cart/good}}
{{> me/order/good}}
{{/each}}
</div>
</section>
<section class="block">
<ul>
<ul class="sale-invoice">
{{# coupon}}
<li class="coupon">
<a href="{{url}}">
... ... @@ -53,14 +52,16 @@
{{/if}}
{{#if notUsed}}
<span class="not-used">
<span class="not-used coupon-use">
未使用
<i class="iconfont">&#xe614;</i>
</span>
{{^}}
<span class="used">-¥{{value}}</span>
<span class="used coupon-use">
-¥{{value}}
<i class="iconfont">&#xe614;</i>
</span>
{{/if}}
<span></span>
</a>
</li>
{{/ coupon}}
... ... @@ -70,7 +71,7 @@
<span class="title">YOHO币</span>
<span class="desc">可抵用¥{{.}}</span>
<span class="coin-check">
-¥ {{.}}
<em>- ¥ {{.}}</em>
<i class="iconfont checkbox icon-cb-checked"></i>
</span>
</li>
... ... @@ -79,7 +80,7 @@
{{# invoice}}
<li class="invoice">
<span class="title">发票</span>
<span class="iconfont checkbox icon-cb"></span>
<span class="iconfont checkbox icon-checkbox"></span>
</li>
{{/ invoice}}
</ul>
... ... @@ -87,22 +88,22 @@
<ul class="total">
<li>
<span>总价</span>
¥{{sumPrice}}
&nbsp;&nbsp;¥ {{sumPrice}}
</li>
<li>
<span>活动价</span>
-¥{{salePrice}}
- ¥ {{salePrice}}
</li>
<li>
<span>运费</span>
+¥{{freight}}
+ ¥ {{freight}}
</li>
<li>
<span>YOHO币</span>
-¥{{yohoCoin}}
- ¥ {{yohoCoin}}
</li>
<li>
应付金额： ¥{{price}}
<li class="cost">
应付金额： <em>¥{{price}}</em>
</li>
</ul>
</section>
... ...
... ... @@ -51,17 +51,17 @@ class ShoppingCartController extends AbstractAction
)
);
// $data = array(
// 'gift' => array(
// 'id' => 1,
// 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',
// 'name' => 'Life.After.Life纯棉短袜',
// 'color' => '黄色',
// 'size' => 'L',
// 'price' => 0,
// 'count' => 1
// )
// );
$data = array(
'gift' => array(
'id' => 1,
'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',
'name' => 'Life.After.Life纯棉短袜',
'color' => '黄色',
'size' => 'L',
'price' => 0,
'count' => 1
)
);
$this->_view->display('gift-advance', array('giftAdvancePage' => true, 'pageHeader' => array(
'navBack' => true, 'navTitle' => '加价购'), 'shoppingCart' => $data));
... ... @@ -100,11 +100,22 @@ class ShoppingCartController extends AbstractAction
'goods' => array(
array(
'id' => 1,
'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/10/03/10/01bc1878f9154e77ac4f7a6003c954f1b8.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => '银鳞堂民族风牛皮手绳',
'salePrice' => 9,
'price' => 19,
'count' => 1
'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/11/04/05/01ce2aff32fc3c90584f516167cd526d91.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'Adidas Originals ZX FLUXM22508',
'color' => '黄',
'size' => '43',
'price' => '699.00',
'count' => '2'
),
array(
'id' => 1,
'thumb' => 'http://img10.static.yhbimg.com/goodsimg/2015/11/04/05/0188f1aca49ac478a565ec029b5d2d4a6c.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'B.Duck浴室玩伴mini浮水鸭',
'gift' => true,
'color' => '黄',
'size' => '43',
'price' => '0.00',
'count' => '1'
)
),
'coupon' => array(
... ...