194 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			194 lines
		
	
	
		
			4.3 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <template>
 | |
| 	<view>
 | |
| 		<form @submit="formSubmit" @reset="formReset">
 | |
| 			<view class="form-list">
 | |
| 				<template>
 | |
| 					<view class="form-item">
 | |
| 						<view class="item-name tl">{{$t('PER_DA_44')}}</view>
 | |
| 					</view>
 | |
| 					<view class="form-item">
 | |
| 						<input v-model="oldemail" :disabled="true" type="text" value="" :placeholder="$t('w_0273')"
 | |
| 							placeholder-class="placeholderclass gray9 f28" class="form-input" />
 | |
| 					</view>
 | |
| 					<view class="form-tips"></view>
 | |
| 				</template>
 | |
| 				<template>
 | |
| 					<view class="form-item">
 | |
| 						<view class="item-name tl">{{$t('w_0043')}}</view>
 | |
| 					</view>
 | |
| 					<view class="form-item">
 | |
| 						<view class="d-b-c">
 | |
| 							<input v-model="form.code" type="text" value="" :placeholder="$t('w_0057')"
 | |
| 								placeholder-class="placeholderclass gray9 f28" class="form-input" />
 | |
| 							<button class="get-code-btn" type="default" @click="sendCode"
 | |
| 								:disabled="is_send">{{ send_btn_txt }}</button>
 | |
| 						</view>
 | |
| 					</view>
 | |
| 					<view class="form-tips"></view>
 | |
| 				</template>
 | |
| 				<template>
 | |
| 					<view class="form-item">
 | |
| 						<view class="item-name tl">{{$t('PER_DA_45')}}</view>
 | |
| 					</view>
 | |
| 					<view class="form-item">
 | |
| 						<input v-model="form.email" type="text" :placeholder="$t('w_0345')"
 | |
| 							placeholder-class="placeholderclass gray9 f28" class="form-input" />
 | |
| 					</view>
 | |
| 					<view class="form-tips"></view>
 | |
| 				</template>
 | |
| 			</view>
 | |
| 			<view class="normal-sub-btn "><button form-type="submit" class="f32 mt60 normal-sub-btn">{{$t('w_0035')}}</button></view>
 | |
| 		</form>
 | |
| 	</view>
 | |
| </template>
 | |
| 
 | |
| <script>
 | |
| 	export default {
 | |
| 		data() {
 | |
| 			return {
 | |
| 				/*是否已发验证码*/
 | |
| 				is_send: false,
 | |
| 				/*发送按钮文本*/
 | |
| 				send_btn_txt: this.$t('w_0055'),
 | |
| 				/*当前秒数*/
 | |
| 				second: 60,
 | |
| 				oldemail: '',
 | |
| 				form: {
 | |
| 					code: '',
 | |
| 					email: ''
 | |
| 				}
 | |
| 			};
 | |
| 		},
 | |
| 		onLoad(e) {
 | |
| 			this.oldemail = decodeURIComponent(e.email || '');
 | |
| 		},
 | |
| 		methods: {
 | |
| 			/*提交*/
 | |
| 			formSubmit: function(e) {
 | |
| 				let self = this;
 | |
| 				var formdata = self.form;
 | |
| 				if (formdata.code == '') {
 | |
| 					uni.showToast({
 | |
| 						title: self.$t('w_0057'),
 | |
| 						duration: 1000,
 | |
| 						icon: 'none'
 | |
| 					});
 | |
| 					return false;
 | |
| 				}
 | |
| 				if (formdata.email == '') {
 | |
| 					uni.showToast({
 | |
| 						title: self.$t('w_0345'),
 | |
| 						duration: 1000,
 | |
| 						icon: 'none'
 | |
| 					});
 | |
| 					return false;
 | |
| 				}
 | |
| 				self._putjson('member/api/member/update-email', formdata, function(res) {
 | |
| 					self.showSuccess(res.msg, function() {
 | |
| 						// #ifndef H5
 | |
| 						uni.navigateBack({
 | |
| 							delta: parseInt(1)
 | |
| 						});
 | |
| 						// #endif
 | |
| 						// #ifdef H5
 | |
| 						history.go(-1);
 | |
| 						// #endif
 | |
| 					});
 | |
| 				});
 | |
| 			},
 | |
| 			/*发送短信*/
 | |
| 			sendCode() {
 | |
| 				let self = this;
 | |
| 				console.log(2222)
 | |
| 				self._get(
 | |
| 					'member/api/sms/verification', {},
 | |
| 					result => {
 | |
| 						uni.showToast({
 | |
| 							title: self.$t('MY_WAL_49')
 | |
| 						});
 | |
| 						self.is_send = true;
 | |
| 						self.changeMsg();
 | |
| 					}
 | |
| 				);
 | |
| 			},
 | |
| 			/*改变发送验证码按钮文本*/
 | |
| 			changeMsg() {
 | |
| 				if (this.second > 0) {
 | |
| 					this.send_btn_txt = this.second + this.$t('S_L_9');
 | |
| 					this.second--;
 | |
| 					setTimeout(this.changeMsg, 1000);
 | |
| 				} else {
 | |
| 					this.send_btn_txt = this.$t('w_0055');
 | |
| 					this.second = 60;
 | |
| 					this.is_send = false;
 | |
| 				}
 | |
| 			},
 | |
| 		}
 | |
| 	};
 | |
| </script>
 | |
| 
 | |
| <style lang="scss">
 | |
| 	.form-list {
 | |
| 		padding: 49rpx 58rpx 37rpx 52rpx;
 | |
| 		background-color: #ffffff;
 | |
| 		margin-bottom: 57rpx;
 | |
| 
 | |
| 		.form-item {
 | |
| 			display: flex;
 | |
| 			justify-content: center;
 | |
| 			align-items: center;
 | |
| 			font-size: 28rpx;
 | |
| 			color: #333;
 | |
| 
 | |
| 			.item-name {
 | |
| 				width: 130rpx;
 | |
| 				flex-shrink: 0;
 | |
| 			}
 | |
| 			.item-name.tl{
 | |
| 				text-align: left;
 | |
| 				width: 100%;
 | |
| 				margin-bottom: 10rpx;
 | |
| 			}
 | |
| 			.form-input {
 | |
| 				flex: 1;
 | |
| 				height: 76rpx;
 | |
| 				line-height: 76rpx;
 | |
| 				border-radius: 38rpx;
 | |
| 				font-size: 28rpx;
 | |
| 				color: #333;
 | |
| 				background: #f5f6f8;
 | |
| 				padding: 0 20rpx 0 51rpx;
 | |
| 			}
 | |
| 		}
 | |
| 
 | |
| 		.form-tips {
 | |
| 			color: #fb3024;
 | |
| 			line-height: 60rpx;
 | |
| 			min-height: 56rpx;
 | |
| 			padding-left: 180rpx;
 | |
| 		}
 | |
| 	}
 | |
| 
 | |
| 	.placeholderclass {}
 | |
| 
 | |
| 	.get-code-btn {
 | |
| 		min-width: 161rpx;
 | |
| 		height: 74rpx;
 | |
| 		background: #333333;
 | |
| 		line-height: 74rpx;
 | |
| 		padding: 0rpx 20rpx;
 | |
| 		border-radius: 40rpx;
 | |
| 		white-space: nowrap;
 | |
| 		// border: 1rpx solid $dominant-color;
 | |
| 		color: #ffffff;
 | |
| 		box-sizing: border-box;
 | |
| 		margin-left: 46rpx;
 | |
| 		font-size: 24rpx;
 | |
| 	}
 | |
| 
 | |
| 	.get-code-btn[disabled='true'] {
 | |
| 		// border: 1rpx solid #cccccc;
 | |
| 		color: #333;
 | |
| 		background-color: #ffffff;
 | |
| 	}
 | |
| </style> |