浏览代码

Signed-off-by: 1004749546@qq.com <1004749546@qq.com>
修改

1004749546@qq.com 4 年之前
父节点
当前提交
0ade9d2f33
共有 5 个文件被更改,包括 108 次插入69 次删除
  1. 48 40
      pages/checkOut/checkOut.vue
  2. 8 10
      pages/order/orderDetail.vue
  3. 9 7
      pages/toOrder/editAddress.vue
  4. 29 12
      pages/toOrder/index.vue
  5. 14 0
      uni.scss

+ 48 - 40
pages/checkOut/checkOut.vue

@@ -20,9 +20,9 @@
 		>
 		</u-field>
 		<view class="num-cont">
-			<text>支付数量</text>
+			<text class="u-required">支付数量</text>
 			<view class="num-input">
-				<u-input v-model="number" @click="inputNum('num')" type="number" placeholder="请输入数量" />
+				<u-input v-model="number" type="number" placeholder="请输入数量" />
 				<text>个乐豆</text>
 			</view>
 		</view>
@@ -31,7 +31,7 @@
 			<u-button  @click="handlePay" type="error" >确认支付</u-button>
 		</view>
 		 <!-- 确认支付弹窗 -->
-		 <u-popup mode="center" closeable v-model="showPayModal" width="500rpx" >
+		 <u-popup mode="center" closeable @close="closeModal" v-model="showPayModal" width="600rpx" >
 			<view class="slot-content">
 				<view>请输入支付密码</view>
 				<view class="text-cont">
@@ -39,28 +39,31 @@
 						<text>收取门店:</text>
 						<text>{{storeName}}</text>
 					</view>
-					<view>
+					<view class="num-text">
 						<text>支付数量:</text>
-						<text><text class="num-big">{{number}}</text>个乐豆</text>
+						<view>
+							<text class="num-big">{{number}}</text>乐豆
+						</view>
 					</view>
 					<view>
-						<text>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</text>
+						<text>备&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;注:</text>
 						<text>{{remarks||'--'}}</text>
 					</view>
 				</view>
 				<view class="footer">
-					<u-input v-model="password" input-align="center" @click="inputNum('psw')" type="password" placeholder="请输入支付密码" />
+					<u-input v-model="password" 
+					input-align="center" 
+					type="password" 
+					placeholder="请输入支付密码" 
+					:maxlength="30"
+					@confirm="confirm"
+					/>
+				</view>
+				<view class="fot-btn">
+					<u-button  @click="confirm" type="error" >确认支付</u-button>
 				</view>
 			</view>
 		</u-popup>
-		<u-keyboard mode="number" 
-			safe-area-inset-bottom
-			v-model="showKeyboard" 
-			@change="handleChange" 
-			@backspace="handleBack" 
-			@confirm="showKeyboard=false" 
-			@cancel="showKeyboard=false">
-		</u-keyboard>
 	</view>
 </template>
 
@@ -73,35 +76,32 @@
 				number: '',  // 支付数量
 				showPayModal: false, // 支付弹窗
 				password: '', // 支付密码
-				showKeyboard: false, // 数字键盘
-				keyInputType: '' // 适用数字键盘输入关联的文本框  num:乐豆数量  psw: 支付密码
 			}
 		},
 		onLoad() {
 			
 		},
 		methods: {
-			// 打开数字键盘
-			inputNum(type) {
-				this.keyInputType = type
-				this.showKeyboard =  true
-			},
-			// 数字键盘输入改变
-			handleChange (val) {
-				if (this.keyInputType == 'num') {
-					this.number += val
+			// 确认支付
+			handlePay() {
+				if (!this.number) {
+					uni.showToast({
+						title: '请输入支付数量',
+						icon: 'none'
+					})
 				} else {
-					this.password += val
+					this.showPayModal = true
 				}
-				console.log(this.value)
 			},
-			// 数字键盘退格键
-			handleBack () {
-				
+			// 关闭弹窗
+			closeModal() {
+				this.showPayModal = false
+				this.password = ''
 			},
-			// 确认支付
-			handlePay() {
-				this.showPayModal = true
+			// 输入密码完成 支付
+			confirm(e) {
+				console.log(e,'eeeee')
+				
 			}
 		},
 	}
@@ -134,6 +134,7 @@
 	}
 	.slot-content{
 		padding: 30upx 0;
+		font-size: 32upx;
 		display: flex;
 		flex-direction: column;
 		align-items: center;
@@ -143,24 +144,31 @@
 			margin-top: 20upx;
 			border-bottom: 1px solid #F8F8F8;
 			>view {
-				padding: 20upx 40upx;
+				padding: 10upx 40upx;
 				display: flex;
 				>text{
 					&:last-child {
 						flex: 1;
 						padding-left: 30upx;
 					}
-					.num-big{
-						font-size: 36upx;
-						color: red;
-					}
+				}
+				.num-big{
+					font-size: 36upx;
+					color: red;
+					padding-left: 30upx;
 				}
 			}
+			.num-text{
+				align-items: center;
+			}
 			
 		}
 		.footer{
-			width: 50%;
+			width: 80%;
 			border-bottom: 1px solid #b1b1b1;
 		}
+		.fot-btn{
+			margin-top: 30upx;
+		}
 	}
 </style>

+ 8 - 10
pages/order/orderDetail.vue

@@ -91,7 +91,7 @@
 					<text class="num-big">{{totalPrice}}</text>乐豆
 				</view>
 				<view class="footer">
-					<u-input v-model="password" maxlength="30" input-align="center" type="password" placeholder="请输入支付密码" />
+					<u-input v-model="password" @confirm="handlePay" maxlength="30" input-align="center" type="password" placeholder="请输入支付密码" />
 				</view>
 			</view>
 		</u-popup>
@@ -129,15 +129,6 @@
 			}
 		},
 		methods: {
-			getOptionName(list, val) {
-				if (val) {
-					let p = list.find((item) => {
-						return item.code == val
-					})
-					return p ? p.dispName : '-'
-				}
-				return '-'
-			},
 			// 获取订单详情
 			getOrderDetail(id) {
 				let payTypeList = this.$store.state.vuex_payType
@@ -178,10 +169,13 @@
 			},
 			// 支付
 			toPay() {
+				// 判断用户是否设置过支付密码
 				existPayPwd().then(res=>{
 					console.log(res,'rrrrrr')
 					if(res.status == 200) {
+						// 设置过支付密码,输入密码
 						if(res.data) {
+							this.showInputPsw = true
 							// this.totalPrice = item.payGold
 							// this.showSetPswModal = true
 						}
@@ -209,6 +203,10 @@
 					}
 				})
 			},
+			// 输入支付密码完成  
+			handlePay(e) {
+				console.log(e,'eeeeeeeeee')
+			}
 		},
 	}
 </script>

+ 9 - 7
pages/toOrder/editAddress.vue

@@ -7,8 +7,8 @@
 			<u-form-item label="电话" required prop="receiverPhone">
 				<u-input placeholder="请输入电话" :maxlength="11" type="number" v-model="form.receiverPhone" />
 			</u-form-item>
-			<u-form-item label="省市区" required prop="receiveAreasName">
-				<u-input v-model="form.receiveAreasName" placeholder="请选择省市区" @click="show = true" type="select" />
+			<u-form-item label="省市区" required prop="area">
+				<u-input v-model="form.area" placeholder="请选择省市区" @click="show = true" type="select" />
 				<u-picker v-model="show" @confirm="chooseArea" mode="region"></u-picker>
 			</u-form-item>
 			<u-form-item label="详细地址" required prop="receiveAddress">
@@ -32,7 +32,7 @@
 				form: {
 					receiverName: '',
 					receiverPhone: '',
-					receiveAreasreceiverName: '', // 地址名称
+					area: '', // 地址名称
 					receiveAreas: '', // 地址编码
 					receiveAddress: '' // 详细地址
 				},
@@ -53,7 +53,7 @@
 							trigger: ['change','blur'],
 						}
 					],
-					receiveAreasName: [
+					area: [
 						{
 							required: true, 
 							message: '请选择省市区', 
@@ -73,11 +73,11 @@
 		},
 		onLoad(option) {
 			this.form = this.$store.state.vuex_OrderAddress
-			if (this.form.receiveAreasName) {
+			if (this.form.area) {
 				uni.setNavigationBarTitle({
 					title: '修改地址'
 				})
-				this.form.receiveAreasName = this.form.receiveAreasName.replace(',','-')
+				this.form.area = this.form.receiveAreasName.replace(',','-')
 			} else {
 				uni.setNavigationBarTitle({
 					title: '新增地址'
@@ -90,6 +90,8 @@
 					if (valid) {
 						console.log('验证通过');
 						let params = this.form
+						params.receiveAreasName = params.area.replace('-',',')
+						delete params.area
 						saveAddress(params).then(res=>{
 							if(res.status == 200) {
 								uni.showToast({
@@ -114,7 +116,7 @@
 			// 选择地址
 			chooseArea(e){
 				console.log(e)
-				this.form.receiveAreasName = e.province.label + '-' + e.city.label + '-' + e.area.label
+				this.form.area = e.province.label + '-' + e.city.label + '-' + e.area.label
 				this.form.receiveAreas = e.province.value + ',' + e.city.value + ',' + e.area.value
 			}
 		},

+ 29 - 12
pages/toOrder/index.vue

@@ -84,7 +84,15 @@
 					<text class="num-big">{{totalPrice}}</text>乐豆
 				</view>
 				<view class="footer">
-					<u-input v-model="password" maxlength="30" input-align="center" type="password" placeholder="请输入支付密码" />
+					<u-input v-model="password" 
+					maxlength="30" 
+					input-align="center" 
+					type="password" 
+					@confirm="toSaveOrder"
+					placeholder="请输入支付密码" />
+				</view>
+				<view class="fot-btn">
+					<u-button  @click="toSaveOrder" type="error" >确认支付</u-button>
 				</view>
 			</view>
 		</u-popup>
@@ -107,11 +115,7 @@
 				},
 				goodsList: [], // 商品列表
 				// 用户信息
-				userInfo: {
-					receiveAddress: '陕西省西安市未央区华帝金座',
-					receiverName: '王明',
-					receiverPhone: '14564654551',
-				},
+				userInfo: {},
 				btnLoading: false,  // 提交按钮加载圈
 				orderId: '', // 订单id
 				password: '', // 支付密码
@@ -182,17 +186,29 @@
 				this.showLeavePsw = false
 				this.showInputPsw = true
 			},
-			// 支付  保存订单
+			// 支付  校验用户是否设置过支付密码
 			toSave(){
+				// 判断用户是否设置过支付密码
 				existPayPwd().then(res=>{
 					console.log(res,'rrrrrr')
 					if(res.status == 200) {
-						
+						// 设置过支付密码,输入密码
+						if(res.data) {
+							this.showInputPsw = true
+						} else {
+							// 没设置过支付密码,提示设置密码
+							 this.showSetPswModal = true
+						}
+					} else {
+						uni.showToast({
+							title: res.message,
+							icon: 'none'
+						})
 					}
 				})
-				return
-				// this.showSetPswModal = true
-				// return
+			},
+			// 支付  保存订单
+			toSaveOrder () {
 				let orderGoodsList = []
 				this.goodsList.map((item,index)=>{
 					orderGoodsList[index] = {
@@ -205,7 +221,8 @@
 					receiveAddress: this.userInfo.receiveAddress,
 					receiverName: this.userInfo.receiverName,
 					receiverPhone: this.userInfo.receiverPhone,
-					orderGoodsList: orderGoodsList
+					orderGoodsList: orderGoodsList,
+					password: this.password
 				}
 				saveOrder(params).then(res=>{
 					console.log(res,'rrrrrrr')

+ 14 - 0
uni.scss

@@ -91,4 +91,18 @@ $uni-font-size-paragraph:30rpx;
 	-webkit-line-clamp: 2;
 	line-clamp: 2;
 	-webkit-box-orient: vertical;
+}
+// 必填*
+.u-required{
+	position: relative;
+}
+.u-required:before{
+	content: '*';
+	position: absolute;
+	left: -8px;
+	top: 10upx;
+	font-size: 14px;
+	color: #fa3534;
+	height: 9px;
+	line-height: 1;
 }