购买界面优化

This commit is contained in:
wanyongkang
2020-10-12 21:54:19 +08:00
parent f3911de303
commit 0bc6915fd7
4 changed files with 73 additions and 37 deletions

View File

@@ -164,12 +164,12 @@
</div>
<div class="col-sm-7 col-xs-7 pay">
<div class="radio" v-on:click="OneBuyModel.OPayType=100">
<input name="OPayType" type="radio" v-model="OneBuyModel.OPayType" checked value="100">
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
<input id="zhifubaopay_s1" name="OPayType" type="radio" v-model="OneBuyModel.OPayType" checked value="100">
<label for="zhifubaopay_s1" class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
</div>
<div class="radio" v-on:click="OneBuyModel.OPayType=70">
<input name="OPayType" type="radio" v-model="OneBuyModel.OPayType" value="70">
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
<input id="weixinpay_s1" name="OPayType" type="radio" v-model="OneBuyModel.OPayType" value="70">
<label for="weixinpay_s1" class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
</div>
<div class="radio" >
<input id="UseAccountAmount" name="OPayType" type="radio" v-model="OneBuyModel.UseAccountAmount" value="1">
@@ -286,12 +286,12 @@
</div>
<div class="col-sm-7 col-xs-7 pay">
<div class="radio" v-on:click="MoreBuyModel.OPayType=100">
<input name="radio" type="radio" value="100" checked v-model="MoreBuyModel.OPayType">
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
<input id="zhifubaopay_s" name="radio" type="radio" value="100" checked v-model="MoreBuyModel.OPayType">
<label for="zhifubaopay_s" class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
</div>
<div class="radio" v-on:click="MoreBuyModel.OPayType=70">
<input name="radio" type="radio" value="70" v-model="MoreBuyModel.OPayType">
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
<input id="weixinpay_s" name="radio" type="radio" value="70" v-model="MoreBuyModel.OPayType">
<label for="weixinpay_s" class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
</div>
<div class="radio" >
<input id="UseAccountAmount_s" name="radio" type="radio" v-model="MoreBuyModel.UseAccountAmount" value="1">
@@ -397,7 +397,7 @@
},
OnePayAmount: function () {
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ?this.RestAmount:0;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount - this.OneBuyModel.CouponAmount - restAmout;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount - this.OneBuyModel.CouponAmount ;
total= total < 0 ? 0 : total;
return total.toFixed(2);
},
@@ -407,7 +407,7 @@
},
MorePayAmount: function () {
var restAmout = this.MoreBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
var total = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix - this.MoreBuyModel.CouponAmount - restAmout;
var total = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix - this.MoreBuyModel.CouponAmount ;
total= total < 0 ? 0 : total;
return total.toFixed(2);
}
@@ -434,6 +434,8 @@
}
}
return;
} else {
this.OneBuyModel.CouponAmount = 0;
}
}
},
@@ -447,6 +449,7 @@
if (totalAmount < item.AllowMinAmount) {
continue;
}
if (item.Id == newValue) {
if (item.CouponType == 1) {//满减
this.MoreBuyModel.CouponAmount = item.CouponValue;
@@ -460,6 +463,8 @@
}
}
return;
} else {
this.MoreBuyModel.CouponAmount = 0;
}
}
},
@@ -553,9 +558,12 @@
this.OneBuyModel.ConnectCount = parseInt(this.OneBuyModel.ConnectCount)
if (!this.isNum(this.OneBuyModel.ConnectCount)) return;
if (!this.checkOneAccount() || !this.checkOnePwd()) return;
if (this.OnePayAmount > 0 ) {
if (this.OneBuyModel.UseAccountAmount){
if (this.OneBuyModel.UseAccountAmount) {
if (this.RestAmount < this.OnePayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.OnePayAmount;
}
}
var that = this;
@@ -591,9 +599,11 @@
if (!this.isNum(this.MoreBuyModel.ConnectCount)) return;
if (!this.checkMoreAccount() || !this.checkMorePwd() || this.MoreBuyModel.MaxPostfix>500) return;
var that = this;
if (this.OnePayAmount > 0 ) {
if (this.MoreBuyModel.UseAccountAmount){
if (this.MoreBuyModel.UseAccountAmount) {
if (this.RestAmount < this.MorePayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.MorePayAmount;
}
}
if (this.MoreBuyModel.UseAccountAmount === true) this.MoreBuyModel.UseAccountAmount = 1;

View File

@@ -103,13 +103,13 @@
</div>
<div class="row">
<div class="col-sm-5 col-xs-5">
余额抵扣
余额:
</div>
<div class="col-sm-7 col-xs-7">
<div class="radio">
<input type="checkbox" v-model="OneBuyModel.UseAccountAmount" value="1"> 当前账户余额<span class="blueText">@(userEntity.RestAmount)</span>元
@*<input id="radio-1" name="radio" type="radio">
<label for="radio-1" class="radio-label">使用余额抵扣,当前账户余额@(userEntity.RestAmount)元</label>*@
<div class="">
当前账户余额<span class="blueText">@(userEntity.RestAmount)</span>元
<a href="/User/Index">前往充值</a>
</div>
</div>
</div>
@@ -119,12 +119,16 @@
</div>
<div class="col-sm-7 col-xs-7 pay">
<div class="radio" v-on:click="OneBuyModel.OPayType=100">
<input type="radio" v-model="OneBuyModel.OPayType" value="100">
<label class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
<input id="zhifubaopay_s1" name="OPayType" type="radio" v-model="OneBuyModel.OPayType" value="100">
<label for="zhifubaopay_s1" class="radio-label"><img src="~/m/img/zfb.png"> 支付宝支付</label>
</div>
<div class="radio" v-on:click="OneBuyModel.OPayType=70">
<input type="radio" v-model="OneBuyModel.OPayType" value="70">
<label class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
<input id="weixinpay_s1" name="OPayType" type="radio" v-model="OneBuyModel.OPayType" value="70">
<label for="weixinpay_s1" class="radio-label"><img src="~/m/img/wx.png"> 微信支付</label>
</div>
<div class="radio" >
<input id="UseAccountAmount" name="OPayType" type="radio" v-model="OneBuyModel.UseAccountAmount" value="1">
<label for="UseAccountAmount" class="radio-label" style="line-height:150%"> 余额支付</label>
</div>
</div>
@@ -188,7 +192,7 @@
PayAmount: function () {
var count = this.OneBuyModel.Account.split(',').length;
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count - this.OneBuyModel.CouponAmount - restAmout;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count - this.OneBuyModel.CouponAmount ;
total= total < 0 ? 0 : total;
return total.toFixed(2);
}
@@ -215,8 +219,10 @@
}
}
return;
} else {
this.OneBuyModel.CouponAmount = 0;
}
}
}
},
immediate: true
},
@@ -253,8 +259,12 @@
})
},
onePay: function () {
if (this.PayAmount == 0 || this.OneBuyModel.UseAccountAmount) {
if (!confirm('余额和微信支付宝组合支付时,余额将立即扣除,请务必完成后续差额支付!')) return;
if (this.OneBuyModel.UseAccountAmount) {
if (this.RestAmount < this.PayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.PayAmount;
}
}
var that = this;
if (this.OneBuyModel.UseAccountAmount === true) this.OneBuyModel.UseAccountAmount = 1;

View File

@@ -342,7 +342,7 @@
</div>
<div class="row">
<div class="col-lg-4 text-right">
应付款
总金额:
</div>
<div class="col-lg-4">
<span class="blueText">{{MoreTotalAmount}}</span>元
@@ -463,7 +463,7 @@
},
OnePayAmount: function () {
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount - this.OneBuyModel.CouponAmount - restAmout;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount - this.OneBuyModel.CouponAmount ;
total = total < 0 ? 0 : total;
return total.toFixed(2);
},
@@ -473,7 +473,7 @@
},
MorePayAmount: function () {
var restAmout = this.MoreBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
var total = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix - this.MoreBuyModel.CouponAmount - restAmout;
var total = this.MoreBuyModel.Price * this.MoreBuyModel.ConnectCount * this.MoreBuyModel.MaxPostfix - this.MoreBuyModel.CouponAmount ;
total = total < 0 ? 0 : total;
return total.toFixed(2);
}
@@ -487,6 +487,9 @@
if (totalAmount < item.AllowMinAmount) {
continue;
}
if(newValue == '0'){
this.OneBuyModel.CouponAmount = 0;
}
if (item.Id == newValue) {
if (item.CouponType == 1) {//满减
this.OneBuyModel.CouponAmount = item.CouponValue;
@@ -513,6 +516,9 @@
if (totalAmount < item.AllowMinAmount) {
continue;
}
if(newValue == '0'){
this.OneBuyModel.CouponAmount = 0;
}
if (item.Id == newValue) {
if (item.CouponType == 1) {//满减
this.MoreBuyModel.CouponAmount = item.CouponValue;
@@ -617,9 +623,12 @@
this.OneBuyModel.ConnectCount = parseInt(this.OneBuyModel.ConnectCount)
if (!this.isNum(this.OneBuyModel.ConnectCount)) return;
if (!this.checkOneAccount() || !this.checkOnePwd()) return;
if (this.OnePayAmount > 0 ) {
if (this.OneBuyModel.UseAccountAmount){
if (this.OneBuyModel.UseAccountAmount) {
if (this.RestAmount < this.OnePayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.OnePayAmount;
}
}
var that = this;
@@ -655,9 +664,11 @@
if (!this.isNum(this.MoreBuyModel.ConnectCount)) return;
if (!this.checkMoreAccount() || !this.checkMorePwd() || this.MoreBuyModel.MaxPostfix>500) return;
var that = this;
if (this.MorePayAmount > 0 ) {
if (this.MoreBuyModel.UseAccountAmount){
if (this.MoreBuyModel.UseAccountAmount) {
if (this.RestAmount < this.MorePayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.MorePayAmount;
}
}
if (this.MoreBuyModel.UseAccountAmount === true) this.MoreBuyModel.UseAccountAmount = 1;

View File

@@ -257,7 +257,7 @@
PayAmount: function () {
var count = this.OneBuyModel.Account.split(',').length;
var restAmout = this.OneBuyModel.UseAccountAmount == 1 ? this.RestAmount : 0;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count - this.OneBuyModel.CouponAmount - restAmout;
var total = this.OneBuyModel.Price * this.OneBuyModel.ConnectCount * count - this.OneBuyModel.CouponAmount ;
total= total < 0 ? 0 : total;
return total.toFixed(2);
}
@@ -271,6 +271,9 @@
if (totalAmount < item.AllowMinAmount) {
continue;
}
if(newValue == '0'){
this.OneBuyModel.CouponAmount = 0;
}
if (item.Id == newValue) {
if (item.CouponType == 1) {//满减
this.OneBuyModel.CouponAmount = item.CouponValue;
@@ -316,9 +319,11 @@
})
},
onePay: function () {
if (this.PayAmount > 0 ) {
if (this.OneBuyModel.UseAccountAmount){
if (this.OneBuyModel.UseAccountAmount) {
if (this.RestAmount < this.PayAmount){
alert('余额不足,请充值。您也可以使用微信、支付宝支付。');return;
} else {
this.RestAmount = this.RestAmount - this.PayAmount;
}
}
var that = this;