zhengjinyi пре 4 година
родитељ
комит
e4ec4d43fa
2 измењених фајлова са 71 додато и 64 уклоњено
  1. 3 3
      components/cm-custom/cu-custom.vue
  2. 68 61
      pages/user/order/order-payment.vue

+ 3 - 3
components/cm-custom/cu-custom.vue

@@ -7,12 +7,12 @@
 	  	</view>
 	  	<view class="navbar-icon" v-if="navbarData.showCapsule == 1 ? true : false" 
 			  :style="{top:capsule.top +'px;',left:((screenWidth-capsule.right)+5)+'px;',height:capsule.height+'px;',lineHeight:capsule.height+'px;'}">
-			  <text v-if="navbarData.haveBack" @tap="BackPage" class="iconfont icon-fanhui"></text>
-			  <text v-if="navbarData.haveHome" @tap="_goHome" class="iconfont icon-shouye"></text>
+			  <text v-if="navbarData.haveBack" @tap="BackPage" class="iconfont icon-daohangfanhui"></text>
+			  <text v-if="navbarData.haveHome" @tap="_goHome" class="iconfont icon-fanhuishouye"></text>
 	  	</view>
 		<view class="navbar-icon" v-if="navbarData.showSearch == 1 ? true : false"
 			  :style="{top:capsule.top+'px;',right:(capsule.width)+'px;',height:capsule.height+'px;',lineHeight:capsule.height+'px;'}">
-			  <text @click.stop="_goSearchPath" class="iconfont icon-iconfonticonfontsousuo1"></text>
+			  <text @click.stop="_goSearchPath" class="iconfont icon-sousuo"></text>
 	  	</view>
 	</view>
 </template>

+ 68 - 61
pages/user/order/order-payment.vue

@@ -1,6 +1,6 @@
 <template>
 	<view class="container cashier" :style="{paddingTop:CustomBar+'px'}">
-		<cu-custom :navbar-data='nvabarData' @navigateBack="hanldNavigateBack"></cu-custom>
+		<ws-custom :systeminfo='systeminfo' :navbar-data='nvabarData' :headerBtnPosi ="headerBtnPosi" :isBackType="true" :path="'/pages/user/cart/cart'"></ws-custom>
 		<template v-if="isPaySwitch">
 			<view class="container-cash clearfix">
 				<view class="pay-bring-title">线上支付功能正在维护中,请使用线下转账方式支付订单</view>
@@ -9,7 +9,8 @@
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
 							<text class="pay-sm">¥</text>
-							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
+							<text class="pay-bg">{{showIndexOfMoney | NumFormat}}</text>
+							<text class="pay-sm">{{smallMoney | NumFormat}}</text>
 						</view>
 					</view>
 				</view>
@@ -34,7 +35,8 @@
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
 							<text class="pay-sm">¥</text>
-							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
+							<text class="pay-bg">{{showIndexOfMoney | NumFormat}}</text>
+							<text class="pay-sm">{{smallMoney | NumFormat}}</text>
 						</view>
 					</view>
 				</view>
@@ -56,20 +58,17 @@
 						<view class="pay-p"><text>待付金额</text></view>
 						<view class="pay-money">
 							<text class="pay-sm">¥</text>
-							<text class="pay-bg">{{payableAmount | NumFormat}}</text>
+							<text class="pay-bg">{{showIndexOfMoney}}</text>
+							<text class="pay-sm">{{smallMoney}}</text>
 						</view>
 					</view>
 					<view class="pay-check">
-						<view class="check-title"><view class="text">选择支付方式</view></view>
 						<view class="pay-checked">
 							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 0}"   @click="tabClick(0)" >
 								<view class="item-l">
 									<view class="item-icon"><text class="iconfont icon-weixinzhifu"></text></view>
 									<view class="item-texts"><text>微信支付</text></view>
 								</view>
-								<view class="item-r">
-									<text class="iconfont icon-duigou"></text>
-								</view>
 							</view>
 							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 1}"   @click="tabClick(1)" >
 								<view class="item-l">
@@ -79,9 +78,6 @@
 										<view class="txt-t">需要在电脑端汇款</view>
 									</view>
 								</view>
-								<view class="item-r">
-									<text class="iconfont icon-duigou"></text>
-								</view>
 							</view>
 							<view  class="pay-item" :class="{ 'current' : tabCurrentIndex === 2}"   @click="tabClick(2)" >
 								<view class="item-l">
@@ -91,9 +87,6 @@
 										<view class="txt-t">需要在电脑端汇款</view>
 									</view>
 								</view>
-								<view class="item-r">
-									<text class="iconfont icon-duigou"></text>
-								</view>
 							</view>
 						</view>
 					</view>
@@ -140,17 +133,19 @@
 			return{
 				orderID:'',
 				payableAmount:0,
+				showIndexOfMoney:'0',
+				smallMoney:'.00',
 				emptyWrapperH: '',
 				bankNumber:'6217 6803 0362 0897',
 				payOrderId:'',
 				nvabarData: {		//顶部自定义导航
+					haveBack:true,
 					showCapsule:1, // 是否显示左上角图标  1表示显示  0表示不显示,
-					showSearch: 0,
 					title: '选择支付方式',  // 导航栏 中间的标题
-					haveBack:false,
-					haveHome:true,
 					textLeft:this.$store.state.isIphone
 				},
+				headerBtnPosi:this.setHeaderBtnPosi(),//获取设备顶部胶囊高度
+				systeminfo:this.setSysteminfo(),		 //获取设备信息
 				isIphoneX:this.$store.state.isIphoneX,
 				CustomBar:this.CustomBar,// 顶部导航栏高度
 				tabCurrentIndex:0,
@@ -278,6 +273,22 @@
 					}
 				}
 			},
+			initAbleUserMoney(money){//拆分金额并转千分位格式显示
+				if(money == 0){
+					this.showIndexOfMoney ='0';
+					this.smallMoney=".00"
+				}else{
+					this.ableUserMoney = this.$api.FormatMoney(money) ;
+					let i =  this.ableUserMoney.toString().lastIndexOf('.');
+					if(i==-1){
+						this.showIndexOfMoney=this.$api.FormatMoney( this.ableUserMoney)
+						this.smallMoney=".00"
+					}else{
+						this.smallMoney = this.ableUserMoney.toString().substring(i);
+						this.showIndexOfMoney= this.$api.FormatMoney(this.ableUserMoney.toString().substring(0,i))
+					}
+				}
+			},
 			tabClick(index) {//tab切换
 				this.tabCurrentIndex = index;
 				switch(index){
@@ -312,6 +323,20 @@
 					}
 				})
 			},
+			setHeaderBtnPosi(){
+				// 获得胶囊按钮位置信息
+				let headerBtnPosi = uni.getMenuButtonBoundingClientRect();
+				return headerBtnPosi
+			},
+			setSysteminfo(){
+				let systeminfo;
+				uni.getSystemInfo({ // 获取设备信息
+					success: (res) => {
+						systeminfo = res
+					},
+				})
+				return systeminfo
+			},
 		},
 		onShow() {
 
@@ -338,39 +363,32 @@
 			color: $color-system;
 		}
 		.container-wrapper{
-			width:662rpx;
+			width:100%;
 			margin: 0 auto;
-			.pay-title{
-				font-size: $font-size-32;
-				line-height: 44rpx;
-				text-align: center;
-				color: #2A86FF;
-				margin: 40rpx 0 0 0;
-				width: 100%;
-				float: left;
-			}
 			.pay-content{
-				width: 574rpx;
-				height: 136rpx;
-				padding: 52rpx 44rpx;
-				background: url(https://img.caimei365.com/group1/M00/03/BD/Cmis218ekFyAHoAzAALhR3oBpDI049.png) no-repeat;
+				width: 100%;
+				height: 220rpx;
+				background: url(https://static-b.caimei365.com/app/wisa/img/icon/pay_bg.png) no-repeat;
 				background-size: cover;
 				float: left;
-				margin-top: 40rpx;
+				margin-top: 15rpx;
+				box-sizing: border-box;
+				padding: 40rpx 84rpx;
 				.pay-p{
 					font-size: $font-size-26;
-					color: #FFFFFF;
+					color: #fff3e2;
 					line-height: 36rpx;
 				}
 				.pay-money{
-					color: #FFFFFF;
-					line-height: 84rpx;
+					color: #ff9723;
+					line-height: 100rpx;
 					font-weight: bold;
 					.pay-sm{
-						font-size: $font-size-26;
+						font-size: 42rpx;
+						font-weight: normal;
 					}
 					.pay-bg{
-						font-size: 50rpx;
+						font-size: 64rpx;
 					}
 				}
 			}
@@ -405,34 +423,32 @@
 				.pay-checked{
 					width: 100%;
 					height: auto;
+					box-sizing: border-box;
+					padding: 0 24rpx;
 					.pay-item{
-						width: 618rpx;
-						height: 96rpx;
-						border: 2px solid #F5F5F5;
-						border-radius: 30rpx;
+						width: 100%;
+						height: 120rpx;
+						border: 1px solid #F5F5F5;
+						border-radius: 8rpx;
 						padding: 20rpx;
 						margin: 24rpx 0;
 						display: flex;
 						background-color: #FFFFFF;
+						box-sizing: border-box;
 						&.current{
 							border-color:$color-system;
-							.item-r{
-								.icon-duigou{
-									color: $color-system;
-								}
-							}
 						}
 						.item-l{
 							flex: 8;
 							.item-icon{
-								width: 96rpx;
-								height: 96rpx;
+								width: 76rpx;
+								height: 76rpx;
 								float: left;
 								text-align: center;
-								line-height: 96rpx;
+								line-height: 76rpx;
 								margin-right: 20rpx;
 								.iconfont{
-									font-size:88rpx;
+									font-size:66rpx;
 								}
 								.icon-weixinzhifu{
 									color: #09BB07;
@@ -445,12 +461,12 @@
 								}
 							}
 							.item-texts{
-								line-height: 96rpx;
+								line-height: 76rpx;
 								font-size:$font-size-26;
 								color: $text-color;
 							}
 							.item-text{
-								line-height: 48rpx;
+								line-height: 38rpx;
 								font-size:$font-size-26;
 								.txt-p{
 									color: $text-color;
@@ -460,15 +476,6 @@
 								}
 							}
 						}
-						.item-r{
-							flex: 2;
-							text-align: center;
-							line-height: 96rpx;
-							.icon-duigou{
-								font-size: 60rpx;
-								color: #FFFFFF;
-							}
-						}
 					}
 				}
 			}