Skip to content

G
gxpt_wechat
Commit c0769b73 by zhangzhen
Options

细节优化

parent 718b8cb1
Showing with 91 additions and 57 deletions
App.vue
...@@ -55,6 +55,9 @@ ...@@ -55,6 +55,9 @@
if(uni.getStorageSync("popupTipStatus")){ if(uni.getStorageSync("popupTipStatus")){
uni.removeStorageSync("popupTipStatus") uni.removeStorageSync("popupTipStatus")
} }
uni.setStorageSync('activite',false)
uni.setStorageSync('rechargeTip',false)
uni.getSystemInfo({ uni.getSystemInfo({
success: (e) => { success: (e) => {
Vue.prototype.screenHeight = e.screenHeight; Vue.prototype.screenHeight = e.screenHeight;
......
pages/order/order.vue
...@@ -220,37 +220,13 @@ ...@@ -220,37 +220,13 @@
<text>/小时</text> <text>/小时</text>
</view> </view>
</view> </view>
<view v-if="computePriceInfo.totalFeeNow" class="flex-between price"> <view class="flex-between price">
<text class="text-black text-left">应付金额</text>
<view class="flex-row">
<!-- <text class="text-pink text-sm text-bold" style="margin-bottom: 3upx;">{{computePriceInfo.couponFee>0?'-':''}}￥</text> -->
<text class="text-pink">￥</text>
<text class="text-pink text-lg text-bold">{{computePriceInfo.totalFeeNow||0}}</text>
</view>
</view>
<view v-if="computePriceInfo.remainingBalance" class="flex-between price">
<text class="text-black text-left">支付策略</text> <text class="text-black text-left">支付策略</text>
<view class="flex-row"> <view class="flex-row">
<text class="text-pink">优先使用钱包余额</text> <text class="text-pink">优先使用钱包余额</text>
</view> </view>
</view> </view>
<view v-if="computePriceInfo.discount > 0 && computePriceInfo.discount < 100" class="flex-between price">
<view class="flex-row-center">
<text class="text-black text-left">会员折扣</text>
<view class="vip-tag-box">
<image :src="assetsPath+'/huiyuan.png'" mode="widthFix"></image>
<text>会员日{{computePriceInfo.discountText || computePriceInfo.discount}}折</text>
</view>
</view>
<view class="flex-row-center">
<text class="text-pink text-xl text-bold" style="margin-right: 6upx;">-</text>
<text class="text-pink text-bold">￥</text>
<text class="text-pink text-lg text-bold">{{(computePriceInfo.memberDiscount).toFixed(2)}}</text>
</view>
</view>
<view class="flex-col card-use"> <view class="flex-col card-use">
<view class="flex-between" @tap="onShowMorePayWay"> <view class="flex-between" @tap="onShowMorePayWay">
<text class="text-black text-left">钱包支付</text> <text class="text-black text-left">钱包支付</text>
...@@ -272,7 +248,8 @@ ...@@ -272,7 +248,8 @@
style="transform:scale(0.7)" /> style="transform:scale(0.7)" />
</view> </view>
</label> </label>
<label v-if="secondaryCardList.length" class="flex-between" @tap="onRadioChange('secondaryCard')"> <label v-if="secondaryCardList.length" class="flex-between"
@tap="onRadioChange('secondaryCard')">
<view class="flex-row-center"> <view class="flex-row-center">
<text>{{secondaryCard.name}}:剩 <text <text>{{secondaryCard.name}}:剩 <text
class="text-pink text-bold">{{secondaryCard.number}}</text> 次可用</text> class="text-pink text-bold">{{secondaryCard.number}}</text> 次可用</text>
...@@ -284,7 +261,7 @@ ...@@ -284,7 +261,7 @@
</view> </view>
</label> </label>
<label class="flex-between" > <label class="flex-between">
<view class="flex-1 flex-between"> <view class="flex-1 flex-between">
<view class="flex-row-center"> <view class="flex-row-center">
<text>可用余额: </text> <text>可用余额: </text>
...@@ -295,19 +272,22 @@ ...@@ -295,19 +272,22 @@
</view> </view>
</view> </view>
<view class="flex-row-center"> <view class="flex-row-center">
<text v-if="computePriceInfo.availableBalance" class="text-pink text-lg text-bold margin-right-sm">{{computePriceInfo.balance || 0}}</text> <text v-if="computePriceInfo.availableBalance"
class="text-pink text-lg text-bold margin-right-sm">{{computePriceInfo.balance || 0}}</text>
<button v-else class="cu-btn bg-pink sm" @tap="onNavToRecharge">充值</button> <button v-else class="cu-btn bg-pink sm" @tap="onNavToRecharge">充值</button>
</view> </view>
</label> </label>
<label v-if="computePriceInfo && computePriceInfo.availableDuration" class="flex-between" > <label v-if="computePriceInfo && computePriceInfo.availableDuration" class="flex-between">
<view class="flex-1 flex-between"> <view class="flex-1 flex-between">
<view class="flex-row-center"> <view class="flex-row-center">
<text>可用时长: </text> <text>可用时长: </text>
<text class="text-pink text-bold">{{Number(computePriceInfo.availableDuration).toFixed(1)}}小时</text> <text
class="text-pink text-bold">{{Number(computePriceInfo.availableDuration).toFixed(1)}}小时</text>
</view> </view>
</view> </view>
<view class="flex-row-center"> <view class="flex-row-center">
<text class="text-pink text-bold margin-right-sm">{{Number(computePriceInfo.duration)? '-'+Number(computePriceInfo.duration).toFixed(1) : 0}}</text> <text
class="text-pink text-bold margin-right-sm">{{Number(computePriceInfo.duration)? '-'+Number(computePriceInfo.duration).toFixed(1) : 0}}</text>
</view> </view>
</label> </label>
...@@ -328,6 +308,29 @@ ...@@ -328,6 +308,29 @@
<text class="cuIcon-right " :class="useCouponList.length?'text-pink':'text-gray'"></text> <text class="cuIcon-right " :class="useCouponList.length?'text-pink':'text-gray'"></text>
</view> </view>
</view> </view>
<view v-if="computePriceInfo.totalFeeNow" class="flex-between price">
<text class="text-black text-left">应付金额</text>
<view class="flex-row">
<text class="text-pink">￥</text>
<text class="text-pink text-lg text-bold">{{computePriceInfo.totalFeeNow||0}}</text>
</view>
</view>
<view v-if="computePriceInfo.discount > 0 && computePriceInfo.discount < 100" class="flex-between price">
<view class="flex-row-center">
<text class="text-black text-left">会员折扣</text>
<view class="vip-tag-box">
<image :src="assetsPath+'/huiyuan.png'" mode="widthFix"></image>
<text>会员日{{computePriceInfo.discountText || computePriceInfo.discount}}折</text>
</view>
</view>
<view class="flex-row-center">
<text class="text-pink text-xl text-bold" style="margin-right: 6upx;">-</text>
<text class="text-pink text-bold">￥</text>
<text class="text-pink text-lg text-bold">{{(computePriceInfo.memberDiscount).toFixed(2)}}</text>
</view>
</view>
<!-- <view v-if="userInfo && computePriceInfo.availableDuration" class="flex-between price"> <!-- <view v-if="userInfo && computePriceInfo.availableDuration" class="flex-between price">
<text class="text-black text-left">可用时长</text> <text class="text-black text-left">可用时长</text>
<view class="flex-row"> <view class="flex-row">
...@@ -548,7 +551,8 @@ ...@@ -548,7 +551,8 @@
import config from "@/config/index.config" import config from "@/config/index.config"
import moment from "@/common/moment_zh_cn.js"; import moment from "@/common/moment_zh_cn.js";
import { import {
dictList dictList,
getUserInfo
} from "@/api/index.js"; } from "@/api/index.js";
import { import {
getDictItem, getDictItem,
...@@ -773,14 +777,25 @@ ...@@ -773,14 +777,25 @@
this.onGetRechargeConf(); this.onGetRechargeConf();
}, },
onShow() { onShow() {
if(this.rechargeConfList.length){ if (this.rechargeConfList.length) {
this.userInfo = uni.getStorageSync("userInfo") || ''; this.onGetUserInfo();
this.onComputePrice();
} }
}, },
methods: { methods: {
onGetUserInfo() {
getUserInfo().then(res => {
if (res.data.code == 200) {
this.loginStatus = uni.getStorageSync('loginStatus') == 'login'? true: false;
this.userInfo = {
...res.data.data,
consumerWallet: res.data.data.consumerWallet? res.data.data.consumerWallet: {remainingIntegral:0}
}
this.onComputePrice();
}
})
},
onGetRechargeConf() { onGetRechargeConf() {
rechargeConf().then(res => { rechargeConf().then(res => {
if (res.data.code == 200 && res.data.rows) { if (res.data.code == 200 && res.data.rows) {
...@@ -788,9 +803,9 @@ ...@@ -788,9 +803,9 @@
} }
}) })
}, },
onNavToRecharge(){ onNavToRecharge() {
uni.switchTab({ uni.switchTab({
url:'/pages/vipCreate/vipCreate' url: '/pages/vipCreate/vipCreate'
}) })
}, },
onShowMorePayWay() { onShowMorePayWay() {
...@@ -1748,7 +1763,7 @@ ...@@ -1748,7 +1763,7 @@
this.submitBtnStatus = true; this.submitBtnStatus = true;
if(this.orderType ===1 && !uni.getStorageSync('rechargeTip')) { if (this.orderType === 1 && !uni.getStorageSync('rechargeTip')) {
this.$refs.popupRecharge.open(); this.$refs.popupRecharge.open();
return return
} }
...@@ -1766,9 +1781,9 @@ ...@@ -1766,9 +1781,9 @@
} }
}) })
}, },
onNavToCreateOrder(){ onNavToCreateOrder() {
this.$refs.popupRecharge.close(); this.$refs.popupRecharge.close();
uni.setStorageSync('rechargeTip',true) uni.setStorageSync('rechargeTip', true)
wx.requestSubscribeMessage({ wx.requestSubscribeMessage({
tmplIds: [ tmplIds: [
'UkvsRnZkZB_w3MqXPbRhi4jEk8ML4N9PWT3rnd3Bhxg', 'UkvsRnZkZB_w3MqXPbRhi4jEk8ML4N9PWT3rnd3Bhxg',
...@@ -3189,10 +3204,12 @@ ...@@ -3189,10 +3204,12 @@
.radio-group { .radio-group {
width: 100%; width: 100%;
margin: 20upx 0; margin: 20upx 0;
label{
label {
height: 32px; height: 32px;
} }
.margin-right-sm{
.margin-right-sm {
margin-right: 14upx; margin-right: 14upx;
} }
} }
...@@ -3235,21 +3252,24 @@ ...@@ -3235,21 +3252,24 @@
transform-origin: center center; transform-origin: center center;
transform: rotate(90deg); transform: rotate(90deg);
} }
.popup-recharge{
.popup-recharge {
width: 540upx; width: 540upx;
// height: 700upx; // height: 700upx;
background-color: #ffffff; background-color: #ffffff;
border-radius: 36upx; border-radius: 36upx;
overflow: hidden; overflow: hidden;
.recharge-content{
.recharge-content {
position: relative; position: relative;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
align-items: center; align-items: center;
width: 100%; width: 100%;
// height: 100%; // height: 100%;
background: linear-gradient(0deg, rgba(255,255,255,0.65), rgba(255,214,241,0.43)); background: linear-gradient(0deg, rgba(255, 255, 255, 0.65), rgba(255, 214, 241, 0.43));
.close-btn{
.close-btn {
position: absolute; position: absolute;
top: 0; top: 0;
right: 0; right: 0;
...@@ -3260,11 +3280,13 @@ ...@@ -3260,11 +3280,13 @@
height: 42px; height: 42px;
z-index: 10; z-index: 10;
margin: 0; margin: 0;
.cuIcon-close{
.cuIcon-close {
font-size: 36upx; font-size: 36upx;
} }
} }
.header-part{
.header-part {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
justify-content: center; justify-content: center;
...@@ -3272,38 +3294,46 @@ ...@@ -3272,38 +3294,46 @@
padding-bottom: 32upx; padding-bottom: 32upx;
width: 470upx; width: 470upx;
border-bottom: 1px dashed #C9CACA; border-bottom: 1px dashed #C9CACA;
.text-title{
.text-title {
margin-top: 50upx; margin-top: 50upx;
font-size: 40upx; font-size: 40upx;
} }
.text-gray{
.text-gray {
margin-top: 16upx; margin-top: 16upx;
font-size: 24upx; font-size: 24upx;
} }
} }
.content-part{
.content-part {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding: 30upx 0 0; padding: 30upx 0 0;
width: 470upx; width: 470upx;
.list-item{
.list-item {
margin: 14upx 0 14upx 18upx; margin: 14upx 0 14upx 18upx;
.recharge-icon{
.recharge-icon {
display: block; display: block;
width: 44upx; width: 44upx;
max-height: 46upx; max-height: 46upx;
margin-right: 12upx; margin-right: 12upx;
} }
.text-title{
.text-title {
color: #000000; color: #000000;
font-size: 30upx; font-size: 30upx;
} }
.text-pink{
.text-pink {
color: #E40583; color: #E40583;
font-size: 30upx; font-size: 30upx;
} }
} }
.text-des-box{
.text-des-box {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
...@@ -3312,7 +3342,8 @@ ...@@ -3312,7 +3342,8 @@
color: #666666; color: #666666;
margin: 52upx auto 52upx; margin: 52upx auto 52upx;
} }
.cu-btn{
.cu-btn {
width: 470upx; width: 470upx;
height: 88upx; height: 88upx;
background: #E40583; background: #E40583;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment