fe / YOHOBUYWAP · Commits

Go to a project

Authored by weiqingting
Commit de88e672175ef8c2197ad9c3f66c2f47b0359b49 2 parents cf2199a8 f003a930

Merge branch 'feature/order-save' of http://git.dev.yoho.cn/web/yohobuy into feature/order-save

Inline Side-by-side
Showing 9 changed files with 333 additions and 13 deletions
1 {{> layout/simple-header}} 1 {{> layout/simple-header}}
2 <div class="order-save-page yoho-page clearfix"> 2 <div class="order-save-page yoho-page clearfix">
3 {{# orderSave}} 3 {{# orderSave}}
4 - <div class="order-edit"></div> 4 + <div class="order-edit">
  5 + <div class="order-title">
  6 + <ul>
  7 + <li>查看购物车</li>
  8 + <li class="active">填写订单</li>
  9 + <li class="end">付款，完成购买</li>
  10 + </ul>
  11 + </div>
  12 +
  13 + <div class="order-edit-main">
  14 + <h2 class="title">请填写并核对以下信息</h2>
  15 + <div class="order-content">
  16 + <div class="order-selection address-list">
  17 + <h2>收货地址：<span>[不保存并关闭]</span></h2>
  18 + <ul>
  19 + {{#each hasAddress}}
  20 + <li>
  21 + <input class="radio" type="radio" name="address" id="{{id}}" {{#if checked}}checked{{/if}}/>
  22 + <label for="{{id}}">
  23 + <strong>{{user}}</strong>
  24 + <span>{{address}}</span>
  25 + <a href="javascript:void(0);">设为默认地址</a>
  26 + <div class="order-modify-btn">
  27 + <span>[修改]</span>
  28 + <span>[删除]</span>
  29 + </div>
  30 + </label>
  31 + </li>
  32 + {{/each}}
  33 +
  34 + <li>
  35 + <input class="radio" type="radio" name="" id="addAddress"/>
  36 + <label for="addAddress">使用新地址</label>
  37 + </li>
  38 + </ul>
  39 + </div>
  40 + <div class="order-selection address-manage hide">
  41 + <ul>
  42 + <li>
  43 + <span class="address-legend"><i>*</i>收货人姓名：</span>
  44 + <input type="text" name="name" class="name text-input"/>
  45 + <span>请填写您的真实姓名，最多5个汉字</span>
  46 + </li>
  47 + <li>
  48 + <span class="address-legend"><i>*</i>省市：</span>
  49 + <select name="" id="" class="text-input">
  50 + {{# province}}
  51 + <option value="{{value}}">{{name}}</option>
  52 + {{/ province}}
  53 + <option value="0">请选择省份</option>
  54 + </select>
  55 + <select name="" id="" class="text-input">
  56 + {{# city}}
  57 + <option value="{{value}}">{{name}}</option>
  58 + {{/ city}}
  59 + <option value="0">请选择城市</option>
  60 + </select>
  61 + <select name="" id="" class="text-input">
  62 + {{# county}}
  63 + <option value="{{value}}">{{name}}</option>
  64 + <option value="0">请选择区县</option>
  65 + {{/ county}}
  66 + </select>
  67 + <input type="text" class="text-input"/>
  68 + <span>标'*'的为支持加急送的地区，请输入收货的详细地址</span>
  69 + </li>
  70 + <li>
  71 + <span class="address-legend"><i>*</i>手机号码：</span>
  72 + <input type="text" class="text-input"/>
  73 + <span>填写正确手机号便于接收发货和收货通知</span>
  74 + </li>
  75 + <li>
  76 + <span class="address-legend">固定电话：</span>
  77 + <input type="text" class="text-input"/>—
  78 + <input type="text" class="text-input"/>
  79 + <span>如：010-12345678，固话和手机号至少填一项</span>
  80 + </li>
  81 + <li>
  82 + <span class="address-legend">电子邮件：</span>
  83 + <input type="text" class="text-input"/>
  84 + <span>用来接收订单提醒邮件，便于您及时了解订单状态</span>
  85 + </li>
  86 + <li>
  87 + <span class="address-legend">邮编：</span>
  88 + <input type="text" class="text-input"/>
  89 + <span>请填写准确的邮编，以确保商品尽快送达</span>
  90 + </li>
  91 + </ul>
  92 + </div>
  93 + <span class="save-btn">保存并送到这个地址</span>
  94 +
  95 + <div class="order-selection pay-time">
  96 + <h2>支付及送货时间：<span>[修改]</span></h2>
  97 + <ul>
  98 + <li>付款方式：在线支付</li>
  99 + <li>送货时间：只工作日送货（双休日、节假日不用送）</li>
  100 + <li>送货前联系我：否</li>
  101 + </ul>
  102 + </div>
  103 +
  104 + <div class="order-selection select-express">
  105 + <h2>选择快递：</h2>
  106 + <div class="express-list">
  107 + <input class="radio" type="radio" name="" id="common-express"/>
  108 + <label for="common-express">普通快递：&nbsp;&nbsp;运费 ￥0.00</label>
  109 + </div>
  110 + <div class="express-list">
  111 + <input class="radio" type="radio" name="" id="sf-express"/>
  112 + <label for="sf-express">顺丰速运：&nbsp;&nbsp;运费 ￥5.00　(仅支持顺丰可配送的地区)</label>
  113 + </div>
  114 + <div class="express-list express-tips">注：配送会由于天气，交通等不可抗拒的客观因素造成您收货时间延迟，请您知悉。</div>
  115 + </div>
  116 + </div>
  117 + </div>
  118 + </div>
5 <div class="order-pay"> 119 <div class="order-pay">
6 <div class="pay-wapper"> 120 <div class="pay-wapper">
7 <table> 121 <table>
  1 +$order: sprite-map("order/save/*.png", $spacing: 10px);
  2 +
1 @import "save"; 3 @import "save";
2 -@import "pay";  
  4 +@import "pay";
@@ -5,6 +5,203 @@ @@ -5,6 +5,203 @@
5 // 填写订单 5 // 填写订单
6 .order-edit { 6 .order-edit {
7 width: 100%; 7 width: 100%;
  8 + position: relative;
  9 +
  10 + &:before {
  11 + content: '';
  12 + display: block;
  13 + background: sprite($order, cart_logo) no-repeat;
  14 + width: image-width(sprite-file($order, cart_logo));
  15 + height: image-height(sprite-file($order, cart_logo));
  16 + }
  17 +
  18 + .order-title {
  19 + ul {
  20 + display: block;
  21 + background: sprite($order, cartnew_flow) no-repeat;
  22 + width: image-width(sprite-file($order, cartnew_flow));
  23 + height: image-height(sprite-file($order, cartnew_flow));
  24 + position: absolute;
  25 + right: 0;
  26 + top: 0;
  27 +
  28 + li {
  29 + display: block;
  30 + width: 33.33333333%;
  31 + float: left;
  32 + font-size: 12px;
  33 + color: #999;
  34 + height: 50px;
  35 + line-height: 50px;
  36 +
  37 + &.active {
  38 + color: #333;
  39 + text-align: center;
  40 + &:after {
  41 + display: block;
  42 + content: '';
  43 + background: sprite($order, cart_flow_black) no-repeat;
  44 + width: image-width(sprite-file($order, cart_flow_black));
  45 + height: image-height(sprite-file($order, cart_flow_black));
  46 + position: absolute;
  47 + left: 50%;
  48 + margin-left: image-width(sprite-file($order, cart_flow_black))/(-2);
  49 + top: 0;
  50 + }
  51 + }
  52 + &.end {
  53 + text-align: right;
  54 + }
  55 + }
  56 + }
  57 + }
  58 +
  59 + .order-edit-main {
  60 + border: 1px solid #ccc;
  61 + margin-top: 30px;
  62 +
  63 + h2.title {
  64 + height: 30px;
  65 + line-height: 30px;
  66 + background: #000000;
  67 + color: #fff;
  68 + font-size: 12px;
  69 + text-indent: 15px;
  70 + }
  71 +
  72 + .order-content {
  73 + padding: 20px 30px;
  74 + font-size: 12px;
  75 + color: #333;
  76 +
  77 +
  78 + //public
  79 + .order-selection {
  80 +
  81 + border-top: 1px dashed #ccc;
  82 + padding-top: 30px;
  83 +
  84 + &.address-list {
  85 + border-top: none;
  86 + padding-top: 0;
  87 + }
  88 +
  89 + h2 {
  90 + font-size: 14px;
  91 + color: #000;
  92 +
  93 + span {
  94 + color: #e8044f;
  95 + text-decoration: underline;
  96 + cursor: pointer;
  97 + }
  98 + }
  99 +
  100 + }
  101 + //end
  102 +
  103 + .address-list {
  104 + ul {
  105 + padding: 15px 0;
  106 +
  107 + li {
  108 + margin: 10px 0;
  109 +
  110 + strong {
  111 + font-weight: bold;
  112 + margin-right: 15px;
  113 + }
  114 +
  115 + input.radio {
  116 + margin: 0;
  117 + vertical-align: middle;
  118 + }
  119 +
  120 + }
  121 + .order-modify-btn {
  122 + display: inline-block;
  123 + float: right;
  124 + color: #e8044f;
  125 +
  126 + span {
  127 + text-decoration: underline;
  128 + margin: 0 10px;
  129 + cursor: pointer;
  130 + }
  131 + }
  132 + }
  133 + }
  134 +
  135 + .address-manage {
  136 +
  137 + li {
  138 +
  139 + margin-bottom: 15px;
  140 +
  141 + .address-legend {
  142 + width: 80px;
  143 + text-align: right;
  144 + display: inline-block;
  145 + height: 30px;
  146 + line-height: 30px;
  147 + color: #333;
  148 +
  149 + i {
  150 + color: #e8044f;
  151 + }
  152 + }
  153 +
  154 + .text-input {
  155 + height: 25px;
  156 + line-height: 25px;
  157 + }
  158 + }
  159 + }
  160 +
  161 + .save-btn {
  162 + background: sprite($order, btn_sb) no-repeat;
  163 + width: image-width(sprite-file($order, btn_sb));
  164 + height: image-height(sprite-file($order, btn_sb));
  165 + line-height: image-height(sprite-file($order, btn_sb));
  166 + display: block;
  167 + font-size: 14px;
  168 + color: #fff;
  169 + font-weight: bold;
  170 + text-indent: 25px;
  171 + cursor: pointer;
  172 + margin-bottom: 30px;
  173 + }
  174 +
  175 + .pay-time {
  176 +
  177 + ul {
  178 + padding: 15px;
  179 +
  180 + li {
  181 + margin: 10px 0;
  182 + }
  183 + }
  184 + }
  185 +
  186 + .select-express {
  187 +
  188 + .express-list {
  189 + padding-left: 15px;
  190 + margin: 10px 0;
  191 +
  192 + input.radio {
  193 + margin: 0;
  194 + vertical-align: middle;
  195 + }
  196 + }
  197 +
  198 + .express-tips {
  199 + color: #999;
  200 + }
  201 + }
  202 +
  203 + }
  204 + }
8 } 205 }
9 206
10 // 207 //
@@ -13,19 +13,26 @@ class SaveController extends AbstractAction @@ -13,19 +13,26 @@ class SaveController extends AbstractAction
13 $data = array( 13 $data = array(
14 'orderSavePage' => true, 14 'orderSavePage' => true,
15 'orderSave'=>array( 15 'orderSave'=>array(
16 - 'orderProducts'=>array(  
17 - array('name' =>"Eight Guys 破洞束口牛仔裤",'tip'=>"颜色：蓝色 尺码：L",'src'=>$src,'href'=>'','price'=>'179.00','coin'=>'0','count'=>'1'),  
18 - array('name' =>"Eight Guys 破洞束口牛仔裤",'tip'=>"颜色：蓝色 尺码：L",'src'=>$src,'href'=>'','price'=>'179.00','coin'=>'0','count'=>'1')  
19 - ),  
20 - 'piaotypes'=>array(  
21 - array('name'=>'个人','value'=>'001'),  
22 - array('name'=>'公司','value'=>'002')  
23 - ),  
24 - 'juanlist'=>array(  
25 - array('name'=>'YOHOXXXXXX优惠卷','value'=>'001'),  
26 - array('name'=>'爽1111优惠卷','value'=>'002') 16 + 'hasAddress' => array(
  17 + array(
  18 + 'user' => '王成龙',
  19 + 'address' => '江苏省南京市建邺区嘉陵江东街18号，国家广告产业园5栋17楼，YOHO 18605269243',
  20 + 'checked' => true
27 ) 21 )
  22 + ),
  23 + 'orderProducts'=>array(
  24 + array('name' =>"Eight Guys 破洞束口牛仔裤",'tip'=>"颜色：蓝色 尺码：L",'src'=>$src,'href'=>'','price'=>'179.00','coin'=>'0','count'=>'1'),
  25 + array('name' =>"Eight Guys 破洞束口牛仔裤",'tip'=>"颜色：蓝色 尺码：L",'src'=>$src,'href'=>'','price'=>'179.00','coin'=>'0','count'=>'1')
  26 + ),
  27 + 'piaotypes'=>array(
  28 + array('name'=>'个人','value'=>'001'),
  29 + array('name'=>'公司','value'=>'002')
  30 + ),
  31 + 'juanlist'=>array(
  32 + array('name'=>'YOHOXXXXXX优惠卷','value'=>'001'),
  33 + array('name'=>'爽1111优惠卷','value'=>'002')
28 ) 34 )
  35 + )
29 ); 36 );
30 37
31 $this->_view->display('index', $data); 38 $this->_view->display('index', $data);