账户设置密码，转账

pages/account/resetPassword.vue

@@ -0,0 +1,203 @@
+<template>
+	<view class="content">
+		<!-- 设置支付密码 -->
+		<view class="password">
+			<view class="prompt">
+				<view class="prompt-code">验证码已发送至{{phone}} <button size="mini" :disabled="getCodeState" @click="getCode">{{sendCode}}</button></view>
+				<view>请设置6位数字密码。建议不要使用连续的数字。</view>
+			</view>
+			<view class="group">
+				<view class="inputs">
+					<label>设密码</label>
+					<input type="number" v-model="password" maxlength="6" password placeholder="请设置支付密码" />
+				</view>
+				<view class="inputs">
+					<label>确认密码</label>
+					<input type="number" v-model="verify" maxlength="6" password placeholder="请确认支付密码" />
+				</view>
+				<view class="inputs">
+					<label>验证码</label>
+					<input type="number" v-model="code" maxlength="4" placeholder="请输入验证码" />
+				</view>
+			</view>
+		</view>
+		<!-- 按钮 -->
+		<view class="buttons">
+			<button type="default" form-type="submit" @click="createWallet">确认</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	import { setpassword, getSms } from '@/apis/interfaces/account'
+	export default {
+		data() {
+			return {
+				sendCode	: '',
+				getCodeState: false,
+				phone		: '',
+				code		: '',
+				password	: '',
+				verify		: ''
+			}
+		},
+		onLoad() {
+			this.phone = this.$Route.query.phone
+			this.getCode()
+		},
+		methods: {
+			// 获取验证码
+			getCode(){
+				let outTime;
+				let smsTime = 60;
+				getSms().then(res => {
+					uni.showToast({
+						title: res,
+						icon: "none",
+					});
+					this.getCodeState   = true;
+					this.sendCode = smsTime + 's后重新获取';
+					outTime = setInterval(() => {
+						if (smsTime <= 1) {
+							this.getCodeState   = false;
+							this.sendCode = '重新获取';
+							clearInterval(outTime);
+							return
+						}
+						this.sendCode = smsTime + 's后重新获取';
+						smsTime -= 1;
+					}, 1000);
+				}).catch((err) => {
+					uni.showToast({
+						title: err.message,
+						icon: "none",
+					});
+				});
+			},
+			// 激活钱包
+			createWallet() {
+				if (this.password === '' || this.verify === '') {
+					uni.showToast({
+						icon: 'none',
+						title: '请设置支付密码'
+					})
+					return
+				}
+				if (this.password !== this.verify) {
+					uni.showToast({
+						icon: 'none',
+						title: '两次输入密码不一致'
+					})
+					return
+				}
+				setpassword({
+					password: this.password,
+					password_confirmation: this.verify,
+					code: this.code
+				}).then(res => {
+					uni.showModal({
+						title: '提示',
+						content: '支付密码设置成功',
+						showCancel:false,
+						success: res=> {
+							uni.navigateBack()
+						}
+					})
+				}).catch(err => {
+					console.log(err)
+					uni.showToast({
+						icon: 'none',
+						title: err.message
+					})
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.content{
+		background: $window-color;
+		min-height: 100vh;
+		overflow: hidden;
+	}
+	// 副标题
+	.sub-title {
+		color: $text-gray;
+		text-align: center;
+		margin: $margin * 2 $margin;
+		font-size: $title-size-m;
+	}
+	// 设置密码
+	.password {
+		padding: 0 $padding;
+
+		.prompt {
+			margin-top: $margin * 2;
+			font-size: $title-size-m;
+			color: gray;
+			text-align: center;
+			&-code{
+				line-height: 50rpx;
+				button[size="mini"]{
+					vertical-align: top;
+					margin-left: 20rpx;
+					font-size: $title-size-m;
+					background: transparent;
+					color: $main-color;
+					height: 50rpx;
+					line-height: 50rpx;
+					width: auto;
+					padding: 0;
+					&::after{
+						display: none;
+					}
+				}
+			}
+		}
+
+		.group {
+			margin-top: $margin;
+			border-radius: $radius-m;
+			box-shadow: 0 0 4rpx 4rpx rgba($color: $text-color, $alpha: .02);
+			background-color: white;
+
+			.inputs {
+				padding: $padding $padding + 10;
+				border-bottom: solid 1rpx $border-color;
+
+				&:last-child {
+					border-bottom: none;
+				}
+
+				label {
+					color: $text-gray;
+					font-size: $title-size-m;
+				}
+
+				input {
+					height: 70rpx;
+					line-height: 70rpx;
+					font-size: $title-size;
+				}
+			}
+		}
+	}
+
+	// 按钮
+	.buttons {
+		padding: $padding*2 $padding;
+		button {
+			border-radius: 45rpx;
+			height: 90rpx;
+			line-height: 90rpx;
+			background-color: $main-color;
+			color: white;
+			font-weight: bold;
+			font-size: $title-size;
+			&::after{
+				display: none;
+			}
+		}
+	}
+</style>