parent
ac09c9e81b
commit
494a5e5d10
@ -0,0 +1,355 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<view class="width100 height100p backcorf06"> |
||||||
|
<view class="block"> |
||||||
|
<view class="content height60"> |
||||||
|
<input type="number" class="my flleft font18 fcorfff" placeholder-style="color:#ffffff;" placeholder="请输入充值号码" v-model="inputPhone" /> |
||||||
|
</view> |
||||||
|
<view class="line1 width100 backcorfff"></view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width90 font16 fcor333 fontwig6 mart40"> |
||||||
|
选择金额 |
||||||
|
</view> |
||||||
|
<view class="list"> |
||||||
|
<view class="box" :class="{'on':item.realPrice == inputAmount}" v-for="(item,index) in amountList" |
||||||
|
:key="index" @click="select(item)"> |
||||||
|
<view class="heTitle">{{item.realPrice}}元</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width90 font18 fcor333 fontwig6"> |
||||||
|
话费充值温馨提示： |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">1:</view> |
||||||
|
<view style="margin-left: 5%;">慢充话费与营业厅充值一样，只是到账时间稍长。充值过程中可能出现分批到账的情况，但是总金额不会少，请耐心等待如72小时未到账请联系客服查询。</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">2:</view> |
||||||
|
<view style="margin-left: 5%;">此业务为话费慢充，平均4-5小时到账，最晚72小时内到账。月末月初为充值高峰期，话费可能会有延迟，请您耐心等待或在48小时后联系客服确认订单状态。</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">3:</view> |
||||||
|
<view style="margin-left: 5%;">由于优惠有限，每个手机号30天内仅支持2次充值(不限金额)，如1号充值1单，29号充值1单，第三单需要在第31号才能充值，请根据自己话费使用情况选择对应金额。 </view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">4:</view> |
||||||
|
<view style="margin-left: 5%;">目前仅支持(移动、联通、电信三网号段)，165、167 170、171、162等虚拟号段暂不支持充值，携号转网号码暂不能充值，否则损失自负无法退款。</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">5:</view> |
||||||
|
<view style="margin-left: 5%;">停机号码需要额外补缴欠费后，慢充话费才能到账。此服务为虚拟充值类服务，无特殊情况不支持退款。</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">6:</view> |
||||||
|
<view style="margin-left: 5%;">空号、错号充值后不支持退款，请您务必核对确认号码无误后再进行充值。非空号欠费可充，欠费1个月导致空号的不能充值，损失自负无法退款。</view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">7:</view> |
||||||
|
<view style="margin-left: 5%;">本充值业务不提供发票。如需发票请在运营商手机客户端储开取电子发票，也可以凭身份证到运营商实体营业厅打印发票。 </view> |
||||||
|
</view> |
||||||
|
<view class="mart5 width80 font14 fcor999 fontwig6 marb40" style="list-style-type: decimal;"> |
||||||
|
<view style="width: 5%;" class="flleft">8:</view> |
||||||
|
<view style="margin-left: 5%;">如遇系统维护充值失败，将72小时后原路退款到付款账户。</view> |
||||||
|
</view> |
||||||
|
<view class="height100p"></view> |
||||||
|
<view class="bombtn width94 font16"> |
||||||
|
<view class="width50 flleft payem">应付: {{inputAmount}}元</view> |
||||||
|
<view class="width50 flright paybtn" @click="addOrderPay">立即购买</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
// #ifdef H5 |
||||||
|
var jweixin = require('jweixin-module'); |
||||||
|
// #endif |
||||||
|
let app = getApp(); |
||||||
|
import { |
||||||
|
getListOutRechargePrice, |
||||||
|
addOrderPay, |
||||||
|
orderToUNionPay |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
typeId: '', |
||||||
|
inputAmountId: '', |
||||||
|
inputAmount: '', |
||||||
|
inputPhone: '', |
||||||
|
amoutType: '', |
||||||
|
codesVlues: '', |
||||||
|
amountList: [] |
||||||
|
} |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.typeId = options.id; |
||||||
|
if (this.typeId == 1) { |
||||||
|
uni.setNavigationBarTitle({ |
||||||
|
title: '中国移动' |
||||||
|
}) |
||||||
|
this.amoutType = 2; |
||||||
|
this.getListOutRechargePrice(2); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (this.typeId == 2) { |
||||||
|
uni.setNavigationBarTitle({ |
||||||
|
title: '中国电信' |
||||||
|
}) |
||||||
|
this.amoutType = 1; |
||||||
|
this.getListOutRechargePrice(1); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (this.typeId == 3) { |
||||||
|
uni.setNavigationBarTitle({ |
||||||
|
title: '中国联通' |
||||||
|
}) |
||||||
|
this.amoutType = 3; |
||||||
|
this.getListOutRechargePrice(3); |
||||||
|
return; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
select(amoutinfos) { |
||||||
|
this.inputAmount = amoutinfos.realPrice; |
||||||
|
this.inputAmountId = amoutinfos.id; |
||||||
|
}, |
||||||
|
|
||||||
|
/** |
||||||
|
* 查询价格 |
||||||
|
*/ |
||||||
|
getListOutRechargePrice(item) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '加载中...' |
||||||
|
}) |
||||||
|
let params = { |
||||||
|
type: item |
||||||
|
} |
||||||
|
getListOutRechargePrice(params).then(res => { |
||||||
|
uni.hideLoading() |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.amountList = res.return_data; |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
|
||||||
|
/** |
||||||
|
* 提交订单 |
||||||
|
*/ |
||||||
|
addOrderPay() { |
||||||
|
let that = this; |
||||||
|
if (that.inputPhone == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请输入充值号码', |
||||||
|
icon: "none" |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (that.inputAmount == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请选择价格', |
||||||
|
icon: "none" |
||||||
|
}); |
||||||
|
return false; |
||||||
|
} |
||||||
|
// let params = { |
||||||
|
// "orderPrice": this.inputAmount, |
||||||
|
// "payPrice": this.inputAmount, |
||||||
|
// "rechargeContent": this.inputPhone, |
||||||
|
// "rechargeModel": this.amoutType, |
||||||
|
// "agentKey": this.codesVlues, |
||||||
|
// "objectId": this.inputAmountId, |
||||||
|
// } |
||||||
|
uni.showToast({ |
||||||
|
title: '提交订单...', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000, |
||||||
|
success() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../unionComfirmation/unionComfirmation?orderPrice=' + that.inputAmount + |
||||||
|
'&payPrice=' + that.inputAmount + '&rechargeContent=' + that.inputPhone + |
||||||
|
'&rechargeModel=' + that.amoutType + '&agentKey=' + that.codesVlues +'&objectId='+that.inputAmountId |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// uni.showLoading({ |
||||||
|
// title: '加载中...' |
||||||
|
// }) |
||||||
|
// addOrderPay(params).then(res => { |
||||||
|
// uni.hideLoading() |
||||||
|
// if (res.return_code == '000000') { |
||||||
|
// let params = { |
||||||
|
// "orderId": res.return_data.id, |
||||||
|
// "openId": app.globalData.openId |
||||||
|
// } |
||||||
|
// this.orderToUNionPay(params); |
||||||
|
// } else { |
||||||
|
// uni.showToast({ |
||||||
|
// title: res.return_msg, |
||||||
|
// icon: "none" |
||||||
|
// }) |
||||||
|
// } |
||||||
|
// }) |
||||||
|
|
||||||
|
}, |
||||||
|
//获取订单信息 |
||||||
|
orderToUNionPay(item) { |
||||||
|
orderToUNionPay(item).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
//判断是否是公众号 |
||||||
|
// #ifdef H5 |
||||||
|
//判断微信浏览器 |
||||||
|
this.payRequest(res); |
||||||
|
// #endif |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//唤起支付 |
||||||
|
payRequest: function(self) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '支付中...' |
||||||
|
}) |
||||||
|
jweixin.config({ |
||||||
|
// debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 |
||||||
|
appId: self.return_data.appId, // 必填，公众号的唯一标识 |
||||||
|
timestamp: self.return_data.timeStamp, // 必填，生成签名的时间戳 |
||||||
|
nonceStr: self.return_data.nonceStr, // 必填，生成签名的随机串 |
||||||
|
signature: self.return_data.sign, // 必填，签名，见附录1 |
||||||
|
jsApiList: ['chooseWXPay'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 |
||||||
|
}); |
||||||
|
uni.hideLoading(); |
||||||
|
jweixin.ready(function() { |
||||||
|
jweixin.checkJsApi({ |
||||||
|
jsApiList: ['chooseWXPay'], // 需要检测的JS接口列表，所有JS接口列表见附录2, |
||||||
|
success: function(res) {}, |
||||||
|
fail: function(res) {} |
||||||
|
}); |
||||||
|
jweixin.chooseWXPay({ |
||||||
|
appId: self.return_data.appId, |
||||||
|
timestamp: self.return_data |
||||||
|
.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 |
||||||
|
nonceStr: self.return_data.nonceStr, // 支付签名随机串，不长于 32 位 |
||||||
|
package: self.return_data |
||||||
|
.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***） |
||||||
|
signType: 'MD5', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5' |
||||||
|
paySign: self.return_data.sign, // 支付签名 |
||||||
|
success: function(res) { |
||||||
|
// 支付成功后的回调函数 |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功' |
||||||
|
}) |
||||||
|
if (that.jumpType == 4) { |
||||||
|
uni.reLaunch({ |
||||||
|
url: '/pages/tabBar/user/user' |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.reLaunch({ |
||||||
|
url: '../success/success?id=' + that.couponId |
||||||
|
}); |
||||||
|
}, |
||||||
|
cancel: function(r) {}, |
||||||
|
fail: function(res) {} |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
jweixin.error(function(res) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: '支付失败了', |
||||||
|
duration: 4000 |
||||||
|
}); |
||||||
|
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。 |
||||||
|
/*alert("config信息验证失败");*/ |
||||||
|
}); |
||||||
|
}, |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
.block { |
||||||
|
width: 94%; |
||||||
|
padding: 60upx 3%; |
||||||
|
|
||||||
|
.my { |
||||||
|
width: 80%; |
||||||
|
height: 120upx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
.uni-input-placeholder { |
||||||
|
color: #FFFFFF; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.list { |
||||||
|
width: 94%; |
||||||
|
margin-left: 3%; |
||||||
|
display: flow-root; |
||||||
|
justify-content: space-between; |
||||||
|
padding: 20upx 0; |
||||||
|
|
||||||
|
.box { |
||||||
|
width: 30%; |
||||||
|
margin-left: 1%; |
||||||
|
margin-right: 2%; |
||||||
|
margin-top: 20upx; |
||||||
|
float: left; |
||||||
|
height: 120upx; |
||||||
|
line-height: 120upx; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
text-align: center; |
||||||
|
box-shadow: 0upx 0upx 4upx #666666; |
||||||
|
font-size: 36upx; |
||||||
|
color: #089bf5; |
||||||
|
|
||||||
|
&.on { |
||||||
|
background-color: #089bf5; |
||||||
|
color: #ffffff; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.heTitle { |
||||||
|
width: 100%; |
||||||
|
font-size: 15px; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.bombtn { |
||||||
|
position: fixed; |
||||||
|
height: 45px; |
||||||
|
bottom: 20px; |
||||||
|
border-radius: 6px; |
||||||
|
|
||||||
|
.payem { |
||||||
|
height: 45px; |
||||||
|
line-height: 45px; |
||||||
|
text-align: center; |
||||||
|
background-color: #007AFF; |
||||||
|
color: #FFFFFF; |
||||||
|
border-radius: 6px 0 0 6px; |
||||||
|
} |
||||||
|
|
||||||
|
.paybtn { |
||||||
|
height: 45px; |
||||||
|
line-height: 45px; |
||||||
|
text-align: center; |
||||||
|
background-color: #F8A628; |
||||||
|
border-radius: 0 6px 6px 0; |
||||||
|
color: #FFFFFF; |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
@ -0,0 +1,30 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
<image class="width100" mode="widthFix" src="../static/upay3.jpg"></image> |
||||||
|
<image class="width94 mart20" mode="widthFix" src="../static/upay4.jpg" @click="jumprecent(1)"></image> |
||||||
|
<image class="width94 mart10" mode="widthFix" src="../static/upay2.jpg" @click="jumprecent(2)"></image> |
||||||
|
<image class="width94 mart10" mode="widthFix" src="../static/upay1.jpg" @click="jumprecent(3)"></image> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
export default { |
||||||
|
data() { |
||||||
|
return { |
||||||
|
|
||||||
|
} |
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//跳转充值 |
||||||
|
jumprecent(item) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../recharge-centre/recharge-centre?id=' + item |
||||||
|
}) |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style> |
||||||
|
|
||||||
|
</style> |
||||||
|
After Width: | Height: | Size: 113 KiB |
|
After Width: | Height: | Size: 124 KiB |
|
After Width: | Height: | Size: 405 KiB |
|
After Width: | Height: | Size: 140 KiB |
@ -0,0 +1,826 @@ |
|||||||
|
<template> |
||||||
|
<view> |
||||||
|
|
||||||
|
<view class="width94 comorder mart10"> |
||||||
|
<view class="height100p width94 goodsimg"> |
||||||
|
<image class="flleft" mode="widthFix" src="../static/head.jpg"></image> |
||||||
|
<view class="tcrig"> |
||||||
|
<view class="font18 fontwig6 fcor333 text1" v-if="rechargeModel == 1">电信话费充值</view> |
||||||
|
<view class="font18 fontwig6 fcor333 text1" v-if="rechargeModel == 2">移动话费充值</view> |
||||||
|
<view class="font18 fontwig6 fcor333 text1" v-if="rechargeModel == 3">联通话费充值</view> |
||||||
|
<view class="font13 fcor666 mart10">规格: 默认</view> |
||||||
|
<view class="price-number mart10"> |
||||||
|
<view class="price font16">￥{{orderPrice}}</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width94 line1 mart5 marb5"></view> |
||||||
|
<view class="height50 width100 backcorfff"> |
||||||
|
<view class="width50 flleft fcor333 fontwig6 font16" style="padding-left: 4%;"> |
||||||
|
商品总额 |
||||||
|
</view> |
||||||
|
<view class="width40 flright fotrt paddtright10 font15 fontwig6 fcor999"> |
||||||
|
￥{{orderPrice}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
|
||||||
|
<view class="width94 comorder mart10"> |
||||||
|
<view class="height50 width100 backcorfff"> |
||||||
|
<view class="width50 flleft fcor333 fontwig6 font16" style="padding-left: 4%;"> |
||||||
|
支付方式 |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width94 line1 mart5 marb5"></view> |
||||||
|
<view class="height50 width100 backcorfff" @tap="paytype='jinbi'"> |
||||||
|
<view class="width70 flleft fcor333 fontwig6 font16 text1" style="padding-left: 4%;"> |
||||||
|
积分支付<text class="font14 fcor666 margle">可用积分: {{user.gold}}</text> |
||||||
|
</view> |
||||||
|
<view class="width20 flright fotrt paddtright10 font15 fontwig6 fcor666 alijun" |
||||||
|
style="align-items: center;"> |
||||||
|
<radio :checked="paytype=='jinbi'" color="#0083f5" /> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width94 line1 mart5 marb5"></view> |
||||||
|
<view class="height50 width100 backcorfff" @tap="paytype='weixin'"> |
||||||
|
<view class="width50 flleft fcor333 fontwig6 font16" style="padding-left: 4%;"> |
||||||
|
微信支付 |
||||||
|
</view> |
||||||
|
<view class="width40 flright fotrt paddtright10 font15 fontwig6 fcor666 alijun" |
||||||
|
style="align-items: center;"> |
||||||
|
<radio :checked="paytype=='weixin'" color="#0083f5" /> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="height50 width100 backcorfff" @tap="paytype='gonghuika'"> |
||||||
|
<view class="width70 flleft fcor333 fontwig6 font16 text1" style="padding-left: 4%;"> |
||||||
|
汇联通工会卡<text class="font14 fcor666 margle">可用余额: {{tongCardPrice}}元</text> |
||||||
|
</view> |
||||||
|
<view class="width20 flright fotrt paddtright10 font15 fontwig6 fcor666 alijun" |
||||||
|
style="align-items: center;"> |
||||||
|
<radio :checked="paytype=='gonghuika'" @click="changeRiado()" color="#0083f5" /> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<view class="width100 height60"></view> |
||||||
|
<view class="footer"> |
||||||
|
<view class="settlement"> |
||||||
|
<view class="sum">实付:<view class="money" v-if="paytype == 'weixin'">￥{{orderPrice}}</view> |
||||||
|
<view class="money aliitem" v-else> |
||||||
|
<image style="width: 15px;height: 15px;vertical-align: sub;" src="../../static/img/jfx.png"> |
||||||
|
</image>{{orderPrice*100}} |
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<!-- #ifdef MP --> |
||||||
|
<button class="btn" open-type="getPhoneNumber" v-if="user.phone == null" |
||||||
|
@getphonenumber="getPhoneNumber">立即支付</button> |
||||||
|
<button class="btn" v-else @tap="toPay">立即支付</button> |
||||||
|
<!-- #endif --> |
||||||
|
<!-- #ifdef H5 --> |
||||||
|
<button class="btn" v-if="user.phone == null" @click="jumpH5Bding">立即支付</button> |
||||||
|
<button class="btn" v-else @tap="toPay">立即支付</button> |
||||||
|
<!-- #endif --> |
||||||
|
|
||||||
|
</view> |
||||||
|
</view> |
||||||
|
<ssPaymentPassword ref="paymentPassword" :mode="1" @submit="submitHandle" /> |
||||||
|
</view> |
||||||
|
</template> |
||||||
|
|
||||||
|
<script> |
||||||
|
import { |
||||||
|
addOrderPay, |
||||||
|
orderToUNionPay, |
||||||
|
findUser, |
||||||
|
orderToGoldPay, |
||||||
|
orderToGoldPayunion, |
||||||
|
hltUnionCardPay |
||||||
|
} from '../../Utils/Api.js'; |
||||||
|
import ssPaymentPassword from '../../components/sanshui-payment-password'; |
||||||
|
let app = getApp(); |
||||||
|
// #ifdef H5 |
||||||
|
var jweixin = require('jweixin-module'); |
||||||
|
// #endif |
||||||
|
export default { |
||||||
|
components: { |
||||||
|
ssPaymentPassword |
||||||
|
}, |
||||||
|
data() { |
||||||
|
return { |
||||||
|
buylist: [], //订单列表 |
||||||
|
goodsPrice: 0.0, //商品合计价格 |
||||||
|
sumPrice: 0.0, //用户付款价格 |
||||||
|
freight: 12.00, //运费 |
||||||
|
note: '', //备注 |
||||||
|
int: 1200, //抵扣积分 |
||||||
|
deduction: 0, //抵扣价格 |
||||||
|
couponId: '', |
||||||
|
couponList: [], |
||||||
|
UserNormalDiscountList: [], |
||||||
|
imageUrl: app.globalData.imgUrl, |
||||||
|
deductionPrice: '0.00', |
||||||
|
paytheprice: '', |
||||||
|
radioStatus: true, |
||||||
|
memDiscountId: '', |
||||||
|
user: '', |
||||||
|
paytype: '', |
||||||
|
PaymentPassword: '', |
||||||
|
orderId: '', |
||||||
|
jumpType: '', |
||||||
|
tongCardPrice: 0, |
||||||
|
|
||||||
|
//话费充值 |
||||||
|
orderPrice: 0, |
||||||
|
payPrice: 0, |
||||||
|
rechargeContent: '', |
||||||
|
rechargeModel: '', |
||||||
|
agentKey: '', |
||||||
|
objectId: '' |
||||||
|
|
||||||
|
}; |
||||||
|
}, |
||||||
|
onLoad(options) { |
||||||
|
this.orderPrice = options.orderPrice; |
||||||
|
this.payPrice = options.payPrice; |
||||||
|
this.rechargeContent = options.rechargeContent; |
||||||
|
this.rechargeModel = options.rechargeModel; |
||||||
|
this.agentKey = options.agentKey; |
||||||
|
this.objectId = options.objectId; |
||||||
|
}, |
||||||
|
onShow() { |
||||||
|
let that = this; |
||||||
|
that.paytype = ''; |
||||||
|
that.user = app.globalData.userInfo; |
||||||
|
that.findUser(); |
||||||
|
}, |
||||||
|
onHide() { |
||||||
|
|
||||||
|
}, |
||||||
|
methods: { |
||||||
|
//查询积分 |
||||||
|
findUser() { |
||||||
|
let params; |
||||||
|
findUser(params).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
app.globalData.userInfo = res.return_data; |
||||||
|
this.user = res.return_data; |
||||||
|
// this.getHuiLianTongCardBalance(); |
||||||
|
uni.setStorage({ |
||||||
|
key: "user", |
||||||
|
data: res.return_data |
||||||
|
}) |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
//显示弹出 |
||||||
|
showPopup() { |
||||||
|
this.$refs.popup.show(); |
||||||
|
}, |
||||||
|
//查询工会卡余额 |
||||||
|
//查询详情 |
||||||
|
getHuiLianTongCardBalance() { |
||||||
|
let params = { |
||||||
|
cardNo: this.user.hltCardNo.cardNo |
||||||
|
} |
||||||
|
getHuiLianTongCardBalance(params).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
this.tongCardPrice = res.return_data.balance; |
||||||
|
} |
||||||
|
|
||||||
|
}); |
||||||
|
}, |
||||||
|
// H5获取手机号 |
||||||
|
jumpH5Bding() { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '/pages/login/register?id=2' |
||||||
|
}) |
||||||
|
}, |
||||||
|
// 微信获取手机号 |
||||||
|
getPhoneNumber(PhoneNumber) { |
||||||
|
let params = { |
||||||
|
openId: app.globalData.openId, |
||||||
|
iv: PhoneNumber.detail.iv, |
||||||
|
encryptedData: PhoneNumber.detail.encryptedData |
||||||
|
} |
||||||
|
GetPhoneNumber(params).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
app.globalData.userInfo = res.return_data |
||||||
|
.object |
||||||
|
.highUser; |
||||||
|
uni.setStorage({ |
||||||
|
key: "user", |
||||||
|
data: res.return_data |
||||||
|
.object |
||||||
|
.highUser |
||||||
|
}) |
||||||
|
let that = this; |
||||||
|
that.toPay(); |
||||||
|
} |
||||||
|
}); |
||||||
|
}, |
||||||
|
toPay() { |
||||||
|
if (this.paytype == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请选择支付方式', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showLoading({ |
||||||
|
title: '提交订单中...' |
||||||
|
}) |
||||||
|
let params = { |
||||||
|
"orderPrice": this.orderPrice, |
||||||
|
"payPrice": this.payPrice, |
||||||
|
"rechargeContent": this.rechargeContent, |
||||||
|
"rechargeModel": this.rechargeModel, |
||||||
|
"agentKey": this.agentKey, |
||||||
|
"objectId": this.objectId, |
||||||
|
} |
||||||
|
addOrderPay(params).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.hideLoading(); |
||||||
|
this.orderId = res.return_data.id; |
||||||
|
let params = { |
||||||
|
"orderId": res.return_data.id, |
||||||
|
"openId": app.globalData.openId |
||||||
|
} |
||||||
|
this.orderToUNionPay(params); |
||||||
|
} else { |
||||||
|
uni.hideLoading(); |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}); |
||||||
|
} |
||||||
|
}) |
||||||
|
}, |
||||||
|
//获取选择支付方式 |
||||||
|
changeRiado() { |
||||||
|
if (!this.user.isSetHltCard) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: '当前账号还未绑定,前往绑定', |
||||||
|
duration: 2000, |
||||||
|
success() { |
||||||
|
setTimeout(() => { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../pages/user/bindingCard/bindingCard' |
||||||
|
}) |
||||||
|
}, 1000) |
||||||
|
} |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
}, |
||||||
|
//获取订单数据 |
||||||
|
orderToUNionPay(item) { |
||||||
|
let that = this; |
||||||
|
if (that.paytype == 'weixin') { |
||||||
|
orderToUNionPay(item).then(res => { |
||||||
|
if (res.return_code == '000000') { |
||||||
|
// #ifdef MP |
||||||
|
uni.showLoading({ |
||||||
|
title: '支付中...' |
||||||
|
}) |
||||||
|
uni.requestPayment({ |
||||||
|
"appId": res.return_data.appId, |
||||||
|
"nonceStr": res.return_data.nonceStr, |
||||||
|
"package": res.return_data.package, |
||||||
|
"paySign": res.return_data.sign, |
||||||
|
"signType": "MD5", |
||||||
|
"timeStamp": res.return_data.timeStamp, |
||||||
|
success: function(res) { |
||||||
|
uni.hideLoading(); |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功' |
||||||
|
}) |
||||||
|
uni.switchTab({ |
||||||
|
url:'../../pages/tabBar/user/user' |
||||||
|
}) |
||||||
|
}, |
||||||
|
fail: function(err) { |
||||||
|
uni.hideLoading(); |
||||||
|
uni.navigateBack({}) |
||||||
|
}, |
||||||
|
}); |
||||||
|
// #endif |
||||||
|
|
||||||
|
//判断是否是公众号 |
||||||
|
// #ifdef H5 |
||||||
|
//判断微信浏览器 |
||||||
|
that.payRequest(res); |
||||||
|
// #endif |
||||||
|
|
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
} |
||||||
|
}) |
||||||
|
} else if (that.paytype == 'jinbi') { |
||||||
|
if (!that.user.isSetPayPwd) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../pages/login/updatePas/updatePas' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
that.$refs.paymentPassword.modalFun('show'); |
||||||
|
} else if (that.paytype == 'gonghuika') { |
||||||
|
if (!that.user.isSetPayPwd) { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../pages/login/updatePas/updatePas' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
if (!that.user.isSetHltCard) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: '当前账号还未绑定,前往绑定', |
||||||
|
duration: 2000, |
||||||
|
success() { |
||||||
|
setTimeout(() => { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../pages/user/bindingCard/bindingCard' |
||||||
|
}) |
||||||
|
}, 1000) |
||||||
|
} |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
that.$refs.paymentPassword.modalFun('show'); |
||||||
|
} else { |
||||||
|
uni.showToast({ |
||||||
|
title: '请选择支付方式', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
} |
||||||
|
}, |
||||||
|
submitHandle(e) { |
||||||
|
this.PaymentPassword = e.value; |
||||||
|
if (this.PaymentPassword == '') { |
||||||
|
uni.showToast({ |
||||||
|
title: '请勿手动关闭弹窗', |
||||||
|
icon: 'none', |
||||||
|
duration: 2000 |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showLoading({ |
||||||
|
title: '支付中...' |
||||||
|
}) |
||||||
|
if (this.paytype == 'jinbi') { |
||||||
|
let params = { |
||||||
|
"orderId": this.orderId, |
||||||
|
"password": this.PaymentPassword |
||||||
|
} |
||||||
|
orderToGoldPayunion(params).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功' |
||||||
|
}) |
||||||
|
uni.switchTab({ |
||||||
|
url:'../../pages/tabBar/user/user' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
if (res.return_code == '102130') { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../login/updatePas/updatePas' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
let params = { |
||||||
|
"orderId": this.orderId, |
||||||
|
"cardNo": this.user.hltCardNo.cardNo, |
||||||
|
"password": this.PaymentPassword |
||||||
|
} |
||||||
|
hltUnionCardPay(params).then(res => { |
||||||
|
uni.hideLoading(); |
||||||
|
if (res.return_code == '000000') { |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功' |
||||||
|
}) |
||||||
|
uni.reLaunch({ |
||||||
|
url: '../pay/success/success?id=' + this.couponId |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
if (res.return_code == '102130') { |
||||||
|
uni.navigateTo({ |
||||||
|
url: '../../login/updatePas/updatePas' |
||||||
|
}) |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.showToast({ |
||||||
|
title: res.return_msg, |
||||||
|
icon: 'none' |
||||||
|
}) |
||||||
|
}) |
||||||
|
|
||||||
|
|
||||||
|
}, |
||||||
|
payRequest: function(self) { |
||||||
|
uni.showLoading({ |
||||||
|
title: '支付中...' |
||||||
|
}) |
||||||
|
jweixin.config({ |
||||||
|
// debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。 |
||||||
|
appId: self.return_data.appId, // 必填，公众号的唯一标识 |
||||||
|
timestamp: self.return_data.timeStamp, // 必填，生成签名的时间戳 |
||||||
|
nonceStr: self.return_data.nonceStr, // 必填，生成签名的随机串 |
||||||
|
signature: self.return_data.sign, // 必填，签名，见附录1 |
||||||
|
jsApiList: ['chooseWXPay'] // 必填，需要使用的JS接口列表，所有JS接口列表见附录2 |
||||||
|
}); |
||||||
|
uni.hideLoading(); |
||||||
|
jweixin.ready(function() { |
||||||
|
jweixin.checkJsApi({ |
||||||
|
jsApiList: ['chooseWXPay'], // 需要检测的JS接口列表，所有JS接口列表见附录2, |
||||||
|
success: function(res) {}, |
||||||
|
fail: function(res) {} |
||||||
|
}); |
||||||
|
jweixin.chooseWXPay({ |
||||||
|
appId: self.return_data.appId, |
||||||
|
timestamp: self.return_data |
||||||
|
.timeStamp, // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符 |
||||||
|
nonceStr: self.return_data.nonceStr, // 支付签名随机串，不长于 32 位 |
||||||
|
package: self.return_data |
||||||
|
.package, // 统一支付接口返回的prepay_id参数值，提交格式如：prepay_id=***） |
||||||
|
signType: 'MD5', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5' |
||||||
|
paySign: self.return_data.sign, // 支付签名 |
||||||
|
success: function(res) { |
||||||
|
// 支付成功后的回调函数 |
||||||
|
uni.showToast({ |
||||||
|
title: '支付成功' |
||||||
|
}) |
||||||
|
if (that.jumpType == 4) { |
||||||
|
uni.reLaunch({ |
||||||
|
url: '/pages/tabBar/user/user' |
||||||
|
}); |
||||||
|
return; |
||||||
|
} |
||||||
|
uni.reLaunch({ |
||||||
|
url: '../success/success?id=' + that.couponId |
||||||
|
}); |
||||||
|
}, |
||||||
|
cancel: function(r) {}, |
||||||
|
fail: function(res) {} |
||||||
|
}); |
||||||
|
}); |
||||||
|
|
||||||
|
jweixin.error(function(res) { |
||||||
|
uni.showToast({ |
||||||
|
icon: 'none', |
||||||
|
title: '支付失败了', |
||||||
|
duration: 4000 |
||||||
|
}); |
||||||
|
}); |
||||||
|
}, |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
</script> |
||||||
|
|
||||||
|
<style lang="scss"> |
||||||
|
page { |
||||||
|
background-color: #f7f7f7; |
||||||
|
} |
||||||
|
|
||||||
|
.comorder { |
||||||
|
background-color: #FFFFFF; |
||||||
|
border-radius: 8px; |
||||||
|
} |
||||||
|
|
||||||
|
.jtcs { |
||||||
|
width: 40rpx; |
||||||
|
height: 40rpx; |
||||||
|
margin-top: 30rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.goodsimg { |
||||||
|
align-items: center; |
||||||
|
display: flex; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 170rpx; |
||||||
|
max-height: 170rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.yhprice { |
||||||
|
width: 100%; |
||||||
|
height: 25px; |
||||||
|
text-align: right; |
||||||
|
margin-top: -20px; |
||||||
|
} |
||||||
|
|
||||||
|
.price-number { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: flex-end; |
||||||
|
font-size: 28upx; |
||||||
|
height: 40upx; |
||||||
|
|
||||||
|
.price { |
||||||
|
color: #FE4545; |
||||||
|
display: flex; |
||||||
|
max-width: 50%; |
||||||
|
align-items: center; |
||||||
|
} |
||||||
|
|
||||||
|
.number { |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
width: 50%; |
||||||
|
text-decoration: line-through; |
||||||
|
|
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.yhqky { |
||||||
|
background: #ff0034; |
||||||
|
color: #ffffff; |
||||||
|
font-size: 14px; |
||||||
|
padding-left: 5px; |
||||||
|
padding-right: 5px; |
||||||
|
margin-left: 8px; |
||||||
|
padding-top: 2px; |
||||||
|
padding-bottom: 2px; |
||||||
|
} |
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.addr { |
||||||
|
width: 86%; |
||||||
|
padding: 20upx 3%; |
||||||
|
margin: 30upx auto 20upx auto; |
||||||
|
box-shadow: 0upx 5upx 20upx rgba(0, 0, 0, 0.1); |
||||||
|
border-radius: 20upx; |
||||||
|
display: flex; |
||||||
|
|
||||||
|
.icon { |
||||||
|
width: 80upx; |
||||||
|
height: 80upx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 60upx; |
||||||
|
height: 60upx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tel-name { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
font-size: 32upx; |
||||||
|
|
||||||
|
.tel { |
||||||
|
margin-left: 40upx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.addres { |
||||||
|
width: 100%; |
||||||
|
font-size: 26upx; |
||||||
|
color: #999; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tccs { |
||||||
|
box-shadow: 0rpx 0rpx 10rpx rgba(0, 0, 0, 0.2); |
||||||
|
border: 1px solid #f6f6f6; |
||||||
|
border-radius: 8px; |
||||||
|
align-items: center; |
||||||
|
display: flex; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 170rpx; |
||||||
|
max-height: 170rpx; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.tcrig { |
||||||
|
margin-left: 20rpx; |
||||||
|
} |
||||||
|
|
||||||
|
.info { |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: flex-end; |
||||||
|
width: 92%; |
||||||
|
} |
||||||
|
|
||||||
|
.order { |
||||||
|
width: 86%; |
||||||
|
padding: 10upx 3%; |
||||||
|
margin: 30upx auto 20upx auto; |
||||||
|
box-shadow: 0upx 5upx 20upx rgba(0, 0, 0, 0.1); |
||||||
|
border-radius: 20upx; |
||||||
|
|
||||||
|
.row { |
||||||
|
margin: 20upx 0; |
||||||
|
height: 40upx; |
||||||
|
display: flex; |
||||||
|
|
||||||
|
.left { |
||||||
|
font-size: 28upx; |
||||||
|
} |
||||||
|
|
||||||
|
.right { |
||||||
|
margin-left: 40upx; |
||||||
|
font-size: 26upx; |
||||||
|
color: #999; |
||||||
|
|
||||||
|
input { |
||||||
|
font-size: 26upx; |
||||||
|
color: #999; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.footer { |
||||||
|
width: 92%; |
||||||
|
padding: 0 4%; |
||||||
|
background-color: #fbfbfb; |
||||||
|
height: 100upx; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
align-items: center; |
||||||
|
font-size: 28upx; |
||||||
|
position: fixed; |
||||||
|
bottom: 0upx; |
||||||
|
z-index: 5; |
||||||
|
|
||||||
|
.settlement { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.sum { |
||||||
|
width: 50%; |
||||||
|
font-size: 18px; |
||||||
|
margin-right: 10upx; |
||||||
|
display: flex; |
||||||
|
justify-content: flex-start; |
||||||
|
|
||||||
|
.money { |
||||||
|
color: #eb5823; |
||||||
|
font-weight: 600; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.btn { |
||||||
|
padding: 0 50rpx; |
||||||
|
height: 80rpx; |
||||||
|
background-color: #0083f5; |
||||||
|
color: #fff; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
font-size: 30upx; |
||||||
|
border-radius: 40upx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.goods-list { |
||||||
|
width: 100%; |
||||||
|
padding: 0; |
||||||
|
|
||||||
|
.tis { |
||||||
|
width: 100%; |
||||||
|
height: 60upx; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
font-size: 32upx; |
||||||
|
} |
||||||
|
|
||||||
|
.row { |
||||||
|
width: calc(92%); |
||||||
|
height: calc(22vw + 40upx); |
||||||
|
margin: 20upx auto; |
||||||
|
|
||||||
|
border-radius: 15upx; |
||||||
|
box-shadow: 0upx 5upx 20upx rgba(0, 0, 0, 0.1); |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
position: relative; |
||||||
|
overflow: hidden; |
||||||
|
z-index: 4; |
||||||
|
border: 0; |
||||||
|
|
||||||
|
.menu { |
||||||
|
.icon { |
||||||
|
color: #fff; |
||||||
|
// font-size: 25upx; |
||||||
|
} |
||||||
|
|
||||||
|
position: absolute; |
||||||
|
width: 30%; |
||||||
|
height: 100%; |
||||||
|
right: 0; |
||||||
|
display: flex; |
||||||
|
justify-content: center; |
||||||
|
align-items: center; |
||||||
|
background-color: red; |
||||||
|
color: #fff; |
||||||
|
z-index: 2; |
||||||
|
} |
||||||
|
|
||||||
|
.carrier { |
||||||
|
.checkbox-box { |
||||||
|
padding-left: 20upx; |
||||||
|
flex-shrink: 0; |
||||||
|
height: 22vw; |
||||||
|
margin-right: 20upx; |
||||||
|
} |
||||||
|
|
||||||
|
position: absolute; |
||||||
|
width: 94%; |
||||||
|
margin-left: 3%; |
||||||
|
padding: 0 0; |
||||||
|
height: 100%; |
||||||
|
z-index: 3; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
|
||||||
|
.goods-info { |
||||||
|
width: 100%; |
||||||
|
display: flex; |
||||||
|
padding-right: 20upx; |
||||||
|
|
||||||
|
.img { |
||||||
|
width: 22vw; |
||||||
|
height: 22vw; |
||||||
|
border-radius: 10upx; |
||||||
|
overflow: hidden; |
||||||
|
flex-shrink: 0; |
||||||
|
margin-right: 10upx; |
||||||
|
|
||||||
|
image { |
||||||
|
width: 22vw; |
||||||
|
height: 22vw; |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
.info { |
||||||
|
width: 100%; |
||||||
|
height: 22vw; |
||||||
|
overflow: hidden; |
||||||
|
display: flex; |
||||||
|
flex-wrap: wrap; |
||||||
|
position: relative; |
||||||
|
|
||||||
|
.title { |
||||||
|
width: 100%; |
||||||
|
font-size: 16px; |
||||||
|
display: -webkit-box; |
||||||
|
-webkit-box-orient: vertical; |
||||||
|
-webkit-line-clamp: 2; |
||||||
|
// text-align: justify; |
||||||
|
overflow: hidden; |
||||||
|
} |
||||||
|
|
||||||
|
.spec { |
||||||
|
font-size: 14px; |
||||||
|
color: #a7a7a7; |
||||||
|
height: 30upx; |
||||||
|
display: flex; |
||||||
|
align-items: center; |
||||||
|
padding: 0; |
||||||
|
border-radius: 15upx; |
||||||
|
margin-bottom: 20vw; |
||||||
|
} |
||||||
|
|
||||||
|
.price-number { |
||||||
|
position: absolute; |
||||||
|
width: 100%; |
||||||
|
bottom: 0upx; |
||||||
|
display: flex; |
||||||
|
justify-content: space-between; |
||||||
|
align-items: flex-end; |
||||||
|
font-size: 28upx; |
||||||
|
height: 60upx; |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
</style> |
||||||
Loading…
Reference in new issue