h5-tiyu/pages/login/forgetPassword.vue

<template>
	<view class="page">
		<view class="title">身份验证</view>
		<view class="input u-flex" style="margin-top: 28rpx;">
			<u-input placeholder-style='font-size: 32rpx;
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			color: #222222;opacity: 0.5;' placeholder='手机号' v-model="resultPhone" type="text" :border="false" 
				:clearable='false' :disabled="true" />
		</view>
		<view class="input u-flex">
			<u-input placeholder-style='font-size: 32rpx; 
			font-family: PingFangSC, PingFang SC;
			font-weight: 400;
			color: #222222;opacity: 0.5;' placeholder='请输入验证码' v-model="code" type="text" :border="false" :clearable='false'  />
			<view class="code">
				获取验证码
			</view>
		</view>
		<view class="button" @click="changePasswoed">
			确认
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				code: '',
				phone: '',
				resultPhone: ''
			};
		},
		onLoad() {
			if (uni.getStorageSync('token')) {
				this.getUserinfo()
			}
		},
		methods: {
			changePasswoed() {
				uni.navigateTo({
					url: '/pages/login/changePasswoed'
				})
			},
			getUserinfo() {
				this.$u.post('api/user/getUserinfo').then(res => {
					this.phone = res.mobile
					this.resultPhone = res.phone_r
				})
			}
		}
	}
</script>

<style lang="scss">
	.page {
		padding: 52rpx 36rpx 0;
		border-top: 2rpx solid rgba(235, 235, 235, 1);
	}

	.code {
		font-size: 32rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #06A971;
	}

	.button {
		width: 678rpx;
		height: 84rpx;
		background: #06A971;
		border-radius: 8rpx;
		opacity: 0.5;
		text-align: center;
		margin-top: 46rpx;
		line-height: 84rpx;
		font-size: 32rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
	}

	.title {
		height: 74rpx;
		font-size: 52rpx;
		font-family: PingFangSC, PingFang SC;
		font-weight: 500;
		color: #222222;
		line-height: 74rpx;
	}

	.input {
		height: 122rpx;
		display: flex;
		align-items: center;
		border-bottom: 2rpx solid rgba(0, 0, 0, 0.14);
	}
</style>