fe / YOHO-ACTIVITY-PHP · 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 @@ @@ -899,7 +899,7 @@
899 ], 899 ],
900 goods: [ 900 goods: [
901 { 901 {
902 - ... //购物车商品 902 + ... //订单商品
903 } 903 }
904 ], 904 ],
905 coupon: { 905 coupon: {
1 -@import "good", "chose-panel", "gift-advance-good"; 1 +@import "good", "chose-panel", "gift-advance-good", "order-ensure";
2 2
3 3
4 .icon-checkbox:before { content: "\e61c"; } 4 .icon-checkbox:before { content: "\e61c"; }
  1 +.order-ensure-page {
  2 + background: #f0f0f0;
  3 +
  4 + .block {
  5 + background: #fff;
  6 + margin: 20rem / $pxConvertRem 0;
  7 + padding: 30rem / $pxConvertRem 20rem / $pxConvertRem;
  8 + border-top: 1px solid #e0e0e0;
  9 + border-bottom: 1px solid #e0e0e0;
  10 + }
  11 +
  12 + .title {
  13 + font-size: 26rem / $pxConvertRem;
  14 + font-weight: bold;
  15 + }
  16 +
  17 + .address-wrap {
  18 + display: block;
  19 + position: relative;
  20 + margin-top: 0;
  21 + border-top: none;
  22 +
  23 + > .iconfont {
  24 + position: absolute;
  25 + color: #bcbcbc;
  26 + right: 20rem / $pxConvertRem;
  27 + top: 50%;
  28 + margin-top: -8px;
  29 + }
  30 +
  31 + .infos {
  32 + font-weight: bold;
  33 + font-size: 24rem / $pxConvertRem;
  34 + padding-right: 55rem / $pxConvertRem;
  35 + }
  36 +
  37 + .per-info {
  38 + float: right;
  39 + }
  40 +
  41 + .address {
  42 + display: block;
  43 + margin-top: 20rem / $pxConvertRem;
  44 + color: #bcbcbc;
  45 + font-weight: normal;
  46 + }
  47 + }
  48 +
  49 + .dispatch .title {
  50 + margin-bottom: 10rem / $pxConvertRem;
  51 + }
  52 +
  53 + .dispatch .sub-block:first-child {
  54 + border-bottom: 1px solid #f7f7f7;
  55 + margin-bottom: 15rem / $pxConvertRem;
  56 + }
  57 +
  58 + .dispatch-mode li,
  59 + .dispatch-time li {
  60 + float: left;
  61 + padding: 10rem / $pxConvertRem 20rem / $pxConvertRem;
  62 + margin-right: 15rem / $pxConvertRem;
  63 + margin-bottom: 15rem / $pxConvertRem;
  64 + border: 1px solid #c9c9c9;
  65 + color: #676767;
  66 + font-size: 26rem / $pxConvertRem;
  67 + }
  68 +
  69 + .goods {
  70 + margin-right: -20rem / $pxConvertRem;
  71 + }
  72 +
  73 + .sale-invoice {
  74 + margin-top: -20rem / $pxConvertRem;
  75 + font-size: 24rem / $pxConvertRem;
  76 +
  77 + li {
  78 + height: 90rem / $pxConvertRem;
  79 + line-height: 90rem / $pxConvertRem;
  80 + border-bottom: 1px solid #f7f7f7;
  81 + }
  82 +
  83 + .coupon-count {
  84 + padding: 5rem / $pxConvertRem;
  85 + background: #f00;
  86 + color: #fff;
  87 + @include border-radius(10px);
  88 + margin-left: 20rem / $pxConvertRem;
  89 + }
  90 +
  91 + .coupon-use,
  92 + .coin-check {
  93 + float: right;
  94 + color: #999;
  95 + }
  96 +
  97 + .coin-check {
  98 + float: right;
  99 + color: #999;
  100 +
  101 + .checkbox {
  102 + margin-left: 5rem / $pxConvertRem;
  103 + color: #000;
  104 + }
  105 +
  106 + }
  107 +
  108 + .checkbox.icon-checkbox {
  109 + color: #999;
  110 + }
  111 +
  112 + .invoice .checkbox {
  113 + float: right;
  114 + }
  115 +
  116 + .desc {
  117 + color: #999;
  118 + }
  119 + }
  120 +
  121 + .total {
  122 + font-size: 22rem / $pxConvertRem;
  123 + margin-top: 20rem / $pxConvertRem;
  124 +
  125 + span {
  126 + display: inline-block;
  127 + width: 130rem / $pxConvertRem;
  128 + }
  129 + }
  130 +
  131 + .cost {
  132 + border-top: 1px solid #f7f7f7;
  133 + line-height: 100rem / $pxConvertRem;
  134 + margin-top: 10rem / $pxConvertRem;
  135 + font-size: 34rem / $pxConvertRem;
  136 +
  137 + em {
  138 + color: #f00;
  139 + }
  140 + }
  141 +
  142 + .pay-mode {
  143 + background: #fff;
  144 + padding: 0 20rem / $pxConvertRem;
  145 + margin-top: -22rem / $pxConvertRem;
  146 +
  147 + li {
  148 + height: 88rem / $pxConvertRem;
  149 + line-height: 88rem / $pxConvertRem;
  150 + margin-bottom: 28rem / $pxConvertRem;
  151 + @include border-radius(5px);
  152 + font-size: 32rem / $pxConvertRem;
  153 + color: #fff;
  154 + text-align: center;
  155 + }
  156 +
  157 + .cod {
  158 + background: #000;
  159 + }
  160 +
  161 + .pay-online {
  162 + background: #57b038;
  163 + }
  164 + }
  165 +}
1 {{> layout/header}} 1 {{> layout/header}}
2 <div class="order-ensure-page yoho-page"> 2 <div class="order-ensure-page yoho-page">
3 {{# orderEnsure}} 3 {{# orderEnsure}}
4 - <section class="block">  
5 - <p> 4 + <a class="address-wrap block">
  5 + <p class="infos">
6 收货地址 6 收货地址
7 <span class="per-info">{{name}} {{phoneNum}}</span> 7 <span class="per-info">{{name}} {{phoneNum}}</span>
  8 + <span class="address">{{address}}</span>
8 </p> 9 </p>
9 - <p class="address">  
10 - {{address}}  
11 - </p>  
12 - </section> 10 + <span class="iconfont">&#xe614;</span>
  11 + </a>
13 12
14 - <section class="block"> 13 + <section class="dispatch block">
15 <div class="sub-block"> 14 <div class="sub-block">
16 <h3 class="title">配送方式</h3> 15 <h3 class="title">配送方式</h3>
17 - <ul class="dispatch-mode"> 16 + <ul class="dispatch-mode clearfix">
18 {{#each dispatchMode}} 17 {{#each dispatchMode}}
19 <li data-id="{{id}}">{{name}}</li> 18 <li data-id="{{id}}">{{name}}</li>
20 {{/each}} 19 {{/each}}
@@ -23,7 +22,7 @@ @@ -23,7 +22,7 @@
23 22
24 <div class="sub-block"> 23 <div class="sub-block">
25 <h3 class="title">送货时间</h3> 24 <h3 class="title">送货时间</h3>
26 - <ul class="dispatch-time"> 25 + <ul class="dispatch-time clearfix">
27 {{#each dispatchTime}} 26 {{#each dispatchTime}}
28 <li data-id="{{id}}">{{name}}</li> 27 <li data-id="{{id}}">{{name}}</li>
29 {{/each}} 28 {{/each}}
@@ -35,13 +34,13 @@ @@ -35,13 +34,13 @@
35 <h3 class="title">商品</h3> 34 <h3 class="title">商品</h3>
36 <div class="goods"> 35 <div class="goods">
37 {{#each goods}} 36 {{#each goods}}
38 - {{> shopping-cart/good}} 37 + {{> me/order/good}}
39 {{/each}} 38 {{/each}}
40 </div> 39 </div>
41 </section> 40 </section>
42 41
43 <section class="block"> 42 <section class="block">
44 - <ul> 43 + <ul class="sale-invoice">
45 {{# coupon}} 44 {{# coupon}}
46 <li class="coupon"> 45 <li class="coupon">
47 <a href="{{url}}"> 46 <a href="{{url}}">
@@ -53,14 +52,16 @@ @@ -53,14 +52,16 @@
53 {{/if}} 52 {{/if}}
54 53
55 {{#if notUsed}} 54 {{#if notUsed}}
56 - <span class="not-used"> 55 + <span class="not-used coupon-use">
57 未使用 56 未使用
58 <i class="iconfont">&#xe614;</i> 57 <i class="iconfont">&#xe614;</i>
59 </span> 58 </span>
60 {{^}} 59 {{^}}
61 - <span class="used">-¥{{value}}</span> 60 + <span class="used coupon-use">
  61 + -¥{{value}}
  62 + <i class="iconfont">&#xe614;</i>
  63 + </span>
62 {{/if}} 64 {{/if}}
63 - <span></span>  
64 </a> 65 </a>
65 </li> 66 </li>
66 {{/ coupon}} 67 {{/ coupon}}
@@ -70,7 +71,7 @@ @@ -70,7 +71,7 @@
70 <span class="title">YOHO币</span> 71 <span class="title">YOHO币</span>
71 <span class="desc">可抵用¥{{.}}</span> 72 <span class="desc">可抵用¥{{.}}</span>
72 <span class="coin-check"> 73 <span class="coin-check">
73 - -¥ {{.}} 74 + <em>- ¥ {{.}}</em>
74 <i class="iconfont checkbox icon-cb-checked"></i> 75 <i class="iconfont checkbox icon-cb-checked"></i>
75 </span> 76 </span>
76 </li> 77 </li>
@@ -79,7 +80,7 @@ @@ -79,7 +80,7 @@
79 {{# invoice}} 80 {{# invoice}}
80 <li class="invoice"> 81 <li class="invoice">
81 <span class="title">发票</span> 82 <span class="title">发票</span>
82 - <span class="iconfont checkbox icon-cb"></span> 83 + <span class="iconfont checkbox icon-checkbox"></span>
83 </li> 84 </li>
84 {{/ invoice}} 85 {{/ invoice}}
85 </ul> 86 </ul>
@@ -87,22 +88,22 @@ @@ -87,22 +88,22 @@
87 <ul class="total"> 88 <ul class="total">
88 <li> 89 <li>
89 <span>总价</span> 90 <span>总价</span>
90 - ¥{{sumPrice}} 91 + &nbsp;&nbsp;¥ {{sumPrice}}
91 </li> 92 </li>
92 <li> 93 <li>
93 <span>活动价</span> 94 <span>活动价</span>
94 - -¥{{salePrice}} 95 + - ¥ {{salePrice}}
95 </li> 96 </li>
96 <li> 97 <li>
97 <span>运费</span> 98 <span>运费</span>
98 - +¥{{freight}} 99 + + ¥ {{freight}}
99 </li> 100 </li>
100 <li> 101 <li>
101 <span>YOHO币</span> 102 <span>YOHO币</span>
102 - -¥{{yohoCoin}} 103 + - ¥ {{yohoCoin}}
103 </li> 104 </li>
104 - <li>  
105 - 应付金额： ¥{{price}} 105 + <li class="cost">
  106 + 应付金额： <em>¥{{price}}</em>
106 </li> 107 </li>
107 </ul> 108 </ul>
108 </section> 109 </section>
@@ -51,17 +51,17 @@ class ShoppingCartController extends AbstractAction @@ -51,17 +51,17 @@ class ShoppingCartController extends AbstractAction
51 ) 51 )
52 ); 52 );
53 53
54 - // $data = array(  
55 - // 'gift' => array(  
56 - // 'id' => 1,  
57 - // 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',  
58 - // 'name' => 'Life.After.Life纯棉短袜',  
59 - // 'color' => '黄色',  
60 - // 'size' => 'L',  
61 - // 'price' => 0,  
62 - // 'count' => 1  
63 - // )  
64 - // ); 54 + $data = array(
  55 + 'gift' => array(
  56 + 'id' => 1,
  57 + 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',
  58 + 'name' => 'Life.After.Life纯棉短袜',
  59 + 'color' => '黄色',
  60 + 'size' => 'L',
  61 + 'price' => 0,
  62 + 'count' => 1
  63 + )
  64 + );
65 65
66 $this->_view->display('gift-advance', array('giftAdvancePage' => true, 'pageHeader' => array( 66 $this->_view->display('gift-advance', array('giftAdvancePage' => true, 'pageHeader' => array(
67 'navBack' => true, 'navTitle' => '加价购'), 'shoppingCart' => $data)); 67 'navBack' => true, 'navTitle' => '加价购'), 'shoppingCart' => $data));
@@ -100,11 +100,22 @@ class ShoppingCartController extends AbstractAction @@ -100,11 +100,22 @@ class ShoppingCartController extends AbstractAction
100 'goods' => array( 100 'goods' => array(
101 array( 101 array(
102 'id' => 1, 102 'id' => 1,
103 - 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/10/03/10/01bc1878f9154e77ac4f7a6003c954f1b8.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',  
104 - 'name' => '银鳞堂民族风牛皮手绳',  
105 - 'salePrice' => 9,  
106 - 'price' => 19,  
107 - 'count' => 1 103 + 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/11/04/05/01ce2aff32fc3c90584f516167cd526d91.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
  104 + 'name' => 'Adidas Originals ZX FLUXM22508',
  105 + 'color' => '黄',
  106 + 'size' => '43',
  107 + 'price' => '699.00',
  108 + 'count' => '2'
  109 + ),
  110 + array(
  111 + 'id' => 1,
  112 + 'thumb' => 'http://img10.static.yhbimg.com/goodsimg/2015/11/04/05/0188f1aca49ac478a565ec029b5d2d4a6c.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
  113 + 'name' => 'B.Duck浴室玩伴mini浮水鸭',
  114 + 'gift' => true,
  115 + 'color' => '黄',
  116 + 'size' => '43',
  117 + 'price' => '0.00',
  118 + 'count' => '1'
108 ) 119 )
109 ), 120 ),
110 'coupon' => array( 121 'coupon' => array(