index.phtml 16.7 KB
{{> layout/simple-header}}
<div class="order-save-page yoho-page clearfix">
{{# orderSave}}
    <div class="order-edit">
        <div class="order-title">
            <ul>
                <li>查看购物车</li>
                <li class="active">填写订单</li>
                <li class="end">付款,完成购买</li>
            </ul>
        </div>

        <div class="order-edit-main">
            <h2 class="title">请填写并核对以下信息</h2>
            <div class="order-content">
                <div class="order-selection address-list">
                    <h2>收货地址:<span>[修改]</span></h2>
                    <div class="address-list-inner">
                    <ul class="exist-address-list">
                        {{#each hasAddress}}
                        <li class="has-exist-address">
                            <input class="radio" type="radio" name="exist-address" id="{{id}}" {{#if checked}}checked{{/if}}/>
                            <label for="{{id}}">
                                <strong>{{user}}</strong>
                                <span>{{address}}</span>
                                <b class="default-address">设为默认地址</b>
                                <div class="order-modify-btn">
                                    <span class="address-modify">[修改]</span>
                                    <span class="address-del">[删除]</span>
                                </div>
                            </label>
                        </li>
                        {{/each}}

                        <li class="use-new-address">
                            <input class="radio add-address" type="radio" name="exist-address" id=""/>
                            <label for="">使用新地址</label>
                        </li>
                    </ul>

                    <div class="address-manage hide">
                        <ul>
                            <li>
                                <span class="address-legend"><i>*</i>收货人姓名:</span>
                                <input type="text" name="name" class="name text-input"/>
                                <span>请填写您的真实姓名,最多5个汉字</span>
                            </li>
                            <li>
                                <span class="address-legend"><i>*</i>省市:</span>
                                <select name="province" id="" class="text-input">
                                    <option>请选择省份</option>
                                </select>
                                <select name="city" id="" class="text-input">
                                    <option>请选择城市</option>
                                </select>
                                <select name="county" id="" class="text-input">
                                    <option>请选择区县</option>
                                </select>
                                <input type="text" name="address" class="text-input"/>
                                <span>标'*'的为支持加急送的地区,请输入收货的详细地址</span>
                            </li>
                            <li>
                                <span class="address-legend"><i>*</i>手机号码:</span>
                                <input type="text" name="phone" class="text-input"/>
                                <span>填写正确手机号便于接收发货和收货通知</span>
                            </li>
                            <li>
                                <span class="address-legend">固定电话:</span>
                                <div class="address-tel-input">
                                    <input type="text" name="tel-code" class="tel-lengend text-input"/>
                                    <input type="text" name="tel" class="text-input"/>
                                    
                                </div>
                                <span>如:010-12345678,固话和手机号至少填一项</span>
                            </li>
                            <li>
                                <span class="address-legend">电子邮件:</span>
                                <input type="text" name="mail" class="text-input"/>
                                <span>用来接收订单提醒邮件,便于您及时了解订单状态</span>
                            </li>
                            <li>
                                <span class="address-legend">邮编:</span>
                                <input type="text" name="code" class="text-input"/>
                                <span>请填写准确的邮编,以确保商品尽快送达</span>
                            </li>
                        </ul>
                    </div>
                    <span class="save-btn">保存并送到这个地址</span>
                    </div>
                </div>



                <div class="order-selection pay-time">
                    <h2>支付及送货时间:<span class="switch-pay-modify">[修改]</span></h2>
                    <ul>
                        <li>付款方式:在线支付</li>
                        <li>送货时间:只工作日送货(双休日、节假日不用送)</li>
                        <li>送货前联系我:否</li>
                    </ul>

                    <div class="pay-time-modify hide">
                        <h3>支付方式</h3>

                        <ul>
                            <li class="pay-dashed-hr pay-recommend">
                                <div class="pay-type-legend">
                                    <input checked class="radio" name="pay-type" type="radio" id=""/>
                                    <label for="">在线支付(推荐)</label>
                                </div>
                                <span class="pay-type-legend">查看支持在线支付的银行和平台</span>
                                <div class="support-type hide">
                                    <h4>支持以下支付平台在线支付:</h4>
                                    <ul>
                                    {{#each supportLine}}

                                    <li><img src="{{src}}" alt=""/></li>
                                    {{/each}}
                                    </ul>
                                    <h4>支持以下银行在线支付:</h4>
                                    <ul>
                                    {{#each supportBank}}
                                    <li><img src="{{src}}" alt=""/></li>
                                    {{/each}}
                                    </ul>
                                </div>
                            </li>

                            <li>
                                <input class="radio" name="pay-type" type="radio" id=""/>
                                <label for="">付款方式:货到付款</label>
                                <span>注:订单中有限量商品、预售商品、化妆品或者订单金额超过10000元不可以选择货到付款。</span>
                            </li>
                        </ul>

                        <h3>送货时间</h3>
                        <ul>
                            <li>
                                <input checked class="radio" name="pay-time-radio" type="radio" id=""/>
                                <label for="">只工作日送货(双休日、节假日不送)</label>
                            </li>

                            <li>
                                <input class="radio" name="pay-time-radio" type="radio" id=""/>
                                <label for="">工作日、双休日和节假日均送货</label>
                            </li>

                            <li class="pay-dashed-hr">
                                <input class="radio" name="pay-time-radio" type="radio" id=""/>
                                <label for="">只双休日、节假日送货(工作时间不送货)</label>
                            </li>

                            <li class="pay-dashed-hr pay-type-tips">声明:我们会努力按照您指定的时间配送,但因为天气、交通等各类因素影响,您的订单有可能会有延误现象,敬请谅解!</li>

                            <li>
                                <span>送货前是否联系:</span>
                                <input class="radio" name="call-me" type="radio" id=""/>
                                <label for="">是</label>
                                <input checked class="radio" name="call-me" type="radio" id=""/>
                                <label for="">否</label>
                            </li>
                        </ul>

                        <span class="pay-btn">确定</span>
                    </div>
                </div>

                <div class="order-selection select-express">
                    <h2>选择快递:</h2>
                    {{#each carriagelist}}
                    <div class="express-list">
                        <input class="radio" type="radio" name="carriagegroup" id="common-{id}" value="{{value}}"/>
                        <label for="common-express">{{name}}:&nbsp;&nbsp;运费 {{value}}  {{desc}}</label>
                    </div>
                    {{/each}}
                    <div class="express-list express-tips">注:配送会由于天气,交通等不可抗拒的客观因素造成您收货时间延迟,请您知悉。</div>
                </div>
            </div>
        </div>
    </div>
    <div class="order-pay">
        <div class="pay-wapper">
        <table>
            <thead>
                <tr>
                    <th style="width:40%;">
                        商品信息
                    </th>
                    <th style="width:10%;">单价(元)</th>
                    <th style="width:10%;">返YOHO币</th>
                    <th style="width:10%;">数量</th>
                    <th style="width:10%;">小计(元)</th>
                    <th style="width:20%;">商品总价(元)</th>
                </tr>
            </thead>
            <tbody>
                {{#each orderProducts}}
                <tr>
                    <td>
                        <div class="pay-pro">
                            <a class="pay-pro-icon" href="{{href}}"><img src="{{src}}" /></a>
                            <p class="pay-pro-info">
                                <a href="#">{{name}}</a>
                                <span>颜色:蓝色 尺码:L</span>
                            </p>
                        </div>
                    </td>
                    <td>{{price}}</td>
                    <td>{{coin}}</td>
                    <td>{{count}}</td>
                    <td></td>
                    <td></td>
                </tr>
                {{/each}}
            </tbody>
        </table>
        <!--YOHO-->
        <div class="play-content clearfix">
            <div class="play-left">
                <dl class="play-piao-pan pan">
                    <dt>索要发票</dt>
                    <dd>
                        <div class="play-pan">
                            <ul>
                                <li><label>发票抬头 :</label><input type="text" class="textbox" id="piaodesc" /></li>
                                <li><label>发票类型 :</label> <select class="dropdown" id="piaotype">
                                    <option value="-1">请选择</option>
                                    {{#each piaotypes}}
                                        <option value="{{value}}">{{name}}</option>
                                    {{/each}}
                                </select> </li>
                            </ul>
                        </div>
                    </dd>
                </dl>
                <dl class="play-remark-pan pan">
                    <dt>添加备注信息</dt>
                    <dd>
                        <div class="play-pan">
                            <textarea class="textbox" id="notedesc"></textarea>
                            <p class="note">声明:备注中有关收货人信息、支付方式、配送方式、发票信息等购买要求一律以上面的选择为准,备注无效。</p>
                            <p>是否打印价格:
                                <input name="isPP" id="isPPY" type="radio" value="Y" checked="">
                                <label for="isPPY">是</label>
                                <input name="isPP" id="isPPN" type="radio" value="N">
                                <label for="isPPN">否</label>
                                (如:送朋友的商品可不打印价格哦!) 
                            </p>
                        </div>
                    </dd>
                </dl>
            </div>
            <div class="play-right">
                <ul class="play-total">
                    <li><label>发票抬头:</label>+¥<em>0.00</em></li>
                    <li><label>活动:</label>-¥<em>0.00</em></li>
                    <li class="red"><label>运费:</label>+¥<em>0.00</em></li>
                    <li><label>优惠券支付<a href="javascript:void(0);" to="play-juan-pan">[修改]</a>:</label>-¥<em>0.00</em></li>
                    <li><label>使用YOHO币<a href="javascript:void(0);" to="play-bi-pan">[修改]</a>:</label>-¥<em>0.00</em></li>
                </ul>
                <dl class="play-juan-pan pan">
                    <dt>使用优惠卷支付</dt>
                    <dd>
                        <div class="play-pan">
                            <p class="strong">请选择您要使用的优惠券: </p>
                            <p class="strong orange">(OUTLET商品除免邮券外不可使用优惠券)</p>
                            <p class="strong orange">(订单中使用优惠券将不赠送商品返还的YOHO币)</p>
                            <div class="play-juan">
                                <ul>
                                    <li>
                                        <input name="juangroup" type="radio" value="">
                                        <label>直接输入优惠码: </label>
                                        <input type="text" class="textbox" id="juancode" />
                                    </li>
                                    {{#each juanlist}}
                                        <li>
                                           <input name="juangroup" type="radio" value="{{value}}">
                                            <label>{{name}} </label> 
                                        </li>
                                    {{/each}}
                                </ul>
                               
                            </div>

                            <p class="errtip red"></p>
                            <div class="btn-group clearfix">
                                <input type="button" class="ok" value="确定" id="juansubmit"/>
                                <input type="button" class="cancel" value="取消"/>    
                            </div>
                        </div>
                    </dd>
                </dl>
                <dl class="play-bi-pan pan">
                    <dt>使用YOHO币支付</dt>
                    <dd>
                        <div class="play-pan">
                            <div class="strong">
                                使用YOHO币支付:
                                <input type="text" class="textbox" id="biprice" />
                                 
                            </div>
                            <p >
                                您目前有YOHO币 <em class="strong">100</em> 
                            </p>
                            <div class="btn-group clearfix">
                                <input type="button" class="ok" value="确定" id="bisubmit"/>
                                <input type="button" class="cancel" value="取消"/>    
                            </div>
                        </div>
                    </dd>
                </dl>
            </div>
        </div>    
        </div>
        
        <div class="to-play">
            <p>您需要实际支付金额:<em>0.00</em>元</p>
            <div class="btn-group clearfix">
                    <input type="button" class="submit" value="确定"/>
            </div>
        </div>
    </div>
{{/ orderSave}}
</div>
{{> layout/footer}}