微信支付 - 扫描二维码完成支付

<div class='mod-ct'>
    <div class='amount'>{$log.order_amount|currency:'pre'}</div>
    <div class='qr-image' id='qrcode'><img width='230px' src='{'@welcome@qrcode'|web_url}?text={$uri}&size=10' /></div>
    <div class='tip'>
<span class='dec dec-left'></span>
<span class='dec dec-right'></span>
<div class='ico-scan'><img src='{asset_url('@home@img/payment/wechat-pay.png')}'></div>
<div class='tip-text'>
{if $is_mobile}
<p>截图二维码到相册<br>识别二维码支付</p>
{else}
<p>请使用{$pay_name}支付<br>扫描二维码完成支付</p>
{/if}
</div>
</div>
 <div class='text-center'>
                <button type='submit' class='btn btn-default' onclick='javascript:history.back();' style='padding:7px 20px;'><i class='glyphicon glyphicon-menu-left'></i> 选择其他支付方式</button>
            </div>
    </div>
<style>
.mod-title{
    height: 6vw;
    line-height: 6vw;
    text-align: center;
    border-bottom: 1px solid #ddd;
    background: #fff;
}
.mod-title .ico-wechat{
    display: inline-block;
    width: 3.3vw;
    height: 2.88vw;
    background: url(./wechat-pay.png) 0 -11.5vw no-repeat;
    vertical-align: middle;
    margin-right: 1.4vw;
}
.mod-title .text{
    font-size: 4vw;
    color: #333;
    font-weight: normal;
    vertical-align: middle;
}
.mod-ct .amount {
    font-size: 9.6vw;
    margin-top: 2vw;
    padding-top: 3.6vw;
}
.mod-ct {
    padding: 0 13.5vw;
    margin: 0 auto;
    margin-top: 1.5vw;
    background: #fff url(../img/payment/wave.png) top center repeat-x;
    text-align: center;
    color: #333;
    border: 0.1vw solid #e5e5e5;
    border-top: none;
}
.mod-ct .qr-image {
    margin-top: 3vw;
}
.mod-ct .tip .tip-text {
    display: inline-block;
    vertical-align: middle;
    text-align: left;
    margin-left: 2.3vw;
    font-size: 1.6vw;
    line-height: 2.8vw;
    *display: inline;
    *zoom: 1;
}
.mod-ct .tip .ico-scan {
    display: inline-block;
    width: 5.6vw;
    height: 5.5vw;
    background: url(./wechat-pay.png) 0 0 no-repeat;
    vertical-align: middle;
    *display: inline;
    *zoom: 1;
}
.mod-ct .tip .dec-left {
    background-position: 0 -5.5vw;
    left: -13.6vw;
}
.mod-ct .tip {
    margin-top: 4vw;
    border-top: 0.1vw dashed #e5e5e5;
    padding: 3vw 0;
    position: relative;
}
<p>@media screen and (max-width: 768px) {
.mod-ct {
padding: 0 7vw;
}
.mod-ct .tip .tip-text {
font-size: 3vw;
line-height: 4.2vw;
}
.mod-ct .tip .ico-scan {
width: 8vw;
height: 7.8vw;
}
.mod-ct .tip .dec-left {
background-position: 0 -7.8vw;
left: -20vw;
}
.mod-ct .tip {
margin-top: 6vw;
padding: 5vw 0;
}
}
</style></p>