263 lines
		
	
	
		
			5.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
			
		
		
	
	
			263 lines
		
	
	
		
			5.9 KiB
		
	
	
	
		
			Vue
		
	
	
	
| <!--
 | ||
|  * @Descripttion: 
 | ||
|  * @version: 
 | ||
|  * @Author: 王三华
 | ||
|  * @Date: 2023-05-18 14:42:53
 | ||
| -->
 | ||
| <template>
 | ||
|   <view class="main">
 | ||
| 	 <view class="contents">
 | ||
| 	 	<u-form ref="uForm" :model="emailObj"
 | ||
| 	 	        class="paddings"
 | ||
| 	 	        labelWidth="auto">
 | ||
| 		<u-form-item :label="$t('MN_F_28')"
 | ||
| 					label-width="100px"
 | ||
| 					prop="email"
 | ||
| 					 style="display: flex;">
 | ||
| 			<u-input v-model="emailObj.oldPassword" class="border-color"
 | ||
| 												:placeholder="$t('w_0348')"
 | ||
| 												 :password="true"
 | ||
| 											   placeholder-class="place-class" />
 | ||
| 																												  
 | ||
| 		</u-form-item>
 | ||
| 		<u-form-item :label="$t('MN_F_29')"
 | ||
| 					label-width="100px"
 | ||
| 					prop="email"
 | ||
| 					 style="display: flex;">
 | ||
| 			<u-input v-model="emailObj.payPassword" class="border-color"
 | ||
| 												 :password="true"
 | ||
| 												 :placeholder="$t('w_0048')"
 | ||
| 											   placeholder-class="place-class" />
 | ||
| 																												  
 | ||
| 		</u-form-item>
 | ||
| 		<u-form-item :label="$t('w_0050')"
 | ||
| 					label-width="100px"
 | ||
| 					prop="email"
 | ||
| 					 style="display: flex;">
 | ||
| 			<u-input v-model="emailObj.loginPassword" class="border-color"
 | ||
| 			 :password="true"
 | ||
| 												:placeholder="$t('w_0050')"
 | ||
| 											   placeholder-class="place-class" />
 | ||
| 																												  
 | ||
| 		</u-form-item>
 | ||
| 	 	</u-form>
 | ||
| 	 </view>
 | ||
| 	  <u-button class="btn"
 | ||
| 	            shape="circle"
 | ||
| 	            type="success"
 | ||
| 				@click="upLoginPwd"
 | ||
| 	        >{{$t('w_0035')}}</u-button>
 | ||
| 			<view style="height: 20rpx;"></view>
 | ||
|   </view>
 | ||
| </template>
 | ||
| 
 | ||
| <script>
 | ||
| import * as api from '@/config/login.js'
 | ||
| import { setToken } from '@/config/auth.js'
 | ||
| import address from '@/components/address.vue'
 | ||
| import store from '@/store'
 | ||
| export default {
 | ||
|   data() {
 | ||
|     return {
 | ||
| 		getCodeText: this.$t('w_0055'),
 | ||
| 		disabled:false,
 | ||
| 		time:60,
 | ||
| 		yzmCheck:false,
 | ||
| 		userInfo:'',
 | ||
| 		emailObj: {
 | ||
| 				oldPassword: '',
 | ||
| 			   loginPassword: '',
 | ||
| 			   payPassword: '',
 | ||
| 		},
 | ||
| 		rules: {
 | ||
| 			oldPassword:[
 | ||
| 				{
 | ||
| 					// 必填项
 | ||
| 					required: true,
 | ||
| 					// 提示内容(会出现在u-form-item内的底部)
 | ||
| 					message: this.$t('w_0346'),
 | ||
| 					trigger: ["blur"],
 | ||
| 				}
 | ||
| 			],
 | ||
| 			loginPassword:[
 | ||
| 				{
 | ||
| 					// 必填项
 | ||
| 					required: true,
 | ||
| 					// 提示内容(会出现在u-form-item内的底部)
 | ||
| 					message: this.$t('w_0346'),
 | ||
| 					trigger: ["blur"],
 | ||
| 				}
 | ||
| 			],
 | ||
| 			payPassword:[
 | ||
| 				{
 | ||
| 					// 必填项
 | ||
| 					required: true,
 | ||
| 					// 提示内容(会出现在u-form-item内的底部)
 | ||
| 					message: this.$t('w_0346'),
 | ||
| 					trigger: ["blur"],
 | ||
| 				}
 | ||
| 			],
 | ||
| 			}
 | ||
|     }
 | ||
|   },
 | ||
|   onLoad(option) {
 | ||
|   },
 | ||
|   onReady() {
 | ||
|   	 this.$refs.uForm.setRules(this.rules);
 | ||
|   },
 | ||
|   methods: {
 | ||
| 	  upLoginPwd(index) {
 | ||
| 	        if (this.emailObj.payPassword != this.emailObj.loginPassword) {
 | ||
| 						uni.showToast({
 | ||
| 							title: '密码不一致',
 | ||
| 							icon: 'none',
 | ||
| 							duration: 1500,
 | ||
| 						})
 | ||
| 						return
 | ||
| 	        }
 | ||
| 
 | ||
| 					let data = JSON.parse(JSON.stringify(this.emailObj))
 | ||
| 
 | ||
| 					delete data.loginPassword
 | ||
| 	  
 | ||
| 	        // loginObj
 | ||
| 	        api.updatePassword(data).then((res) => {
 | ||
| 	          if (res.code == '200') {
 | ||
| 				   uni.showToast({
 | ||
| 					title: res.msg,
 | ||
| 					icon: "none"
 | ||
| 				   }); 
 | ||
| 				   setTimeout(()=>{
 | ||
| 						uni.navigateTo({
 | ||
| 							url: '/pages/userSecure/index'
 | ||
| 						})
 | ||
| 				   },2000)
 | ||
| 	          }else{
 | ||
| 				  uni.showToast({
 | ||
| 					title: res.msg,
 | ||
| 					icon: "none"
 | ||
| 				  }); 
 | ||
| 			  }
 | ||
| 	        })
 | ||
| 	      },
 | ||
| 	  submit() {
 | ||
| 		  	this.$refs.uForm.validate().then((res) => {
 | ||
| 				api.updateEmail(this.emailObj).then((res)=>{
 | ||
| 					if(res.code=='200'){
 | ||
| 						uni.showToast({
 | ||
| 							title: res.msg,
 | ||
| 							icon: "none",
 | ||
| 							success() {
 | ||
| 								setTimeout(()=>{
 | ||
| 									uni.navigateTo({
 | ||
| 										url:"/pages/login/index"
 | ||
| 									})
 | ||
| 								},2000)
 | ||
| 							}						
 | ||
| 						});
 | ||
| 					}else{
 | ||
| 						uni.showToast({
 | ||
| 							icon:"none",
 | ||
| 							title:res.msg
 | ||
| 						})
 | ||
| 					}
 | ||
| 				})  
 | ||
| 		})
 | ||
| 	  },
 | ||
| 	  getCode() {
 | ||
| 	  	// this.disabled = true
 | ||
| 	  	// this.getCodeText = "发送中..." //发送验证码
 | ||
| 	  	// this.getCodeisWaiting = true;
 | ||
| 	  	// this.getCodeBtnColor = "rgba(255,255,255,0.5)" //追加样式,修改颜色
 | ||
| 	  	this.getYzm()
 | ||
| 	  },
 | ||
| 	  getYzm() {
 | ||
| 		api.verification().then((res)=>{
 | ||
| 			if(res.code=='200'){
 | ||
| 				setTimeout(() => {
 | ||
| 					//this.$common.msg(this.$t('MY_WAL_49'))
 | ||
| 					 uni.showToast({
 | ||
| 					 	title: this.$t('MY_WAL_49'),
 | ||
| 					 	icon: "none"
 | ||
| 					 }); //弹出提示框
 | ||
| 					this.setTimer(); //调用定时器方法
 | ||
| 				}, 1000)
 | ||
| 			}
 | ||
| 		})  
 | ||
| 	  },
 | ||
| 	setTimer() {
 | ||
| 		this.disabled = true
 | ||
| 		let holdTime = 60; //定义变量并赋值
 | ||
| 		this.getCodeText = this.$t('w_0347') + "(60)"
 | ||
| 		//setInterval()是一个实现定时调用的函数,可按照指定的周期(以毫秒计)来调用函数或计算表达式。
 | ||
| 		//setInterval方法会不停地调用函数,直到 clearInterval被调用或窗口被关闭。
 | ||
| 		this.time = setInterval(() => {
 | ||
| 			if (holdTime <= 0) {
 | ||
| 				this.disabled = false
 | ||
| 				this.getCodeisWaiting = false;
 | ||
| 				this.getCodeBtnColor = "#ffffff";
 | ||
| 				this.getCodeText = this.$t('w_0055') 
 | ||
| 				clearInterval(this.time); //清除该函数
 | ||
| 				return; //返回前面
 | ||
| 			}
 | ||
| 			this.getCodeText = this.$t('w_0347') + "(" + holdTime + ")"
 | ||
| 			holdTime--;
 | ||
| 		}, 1000)
 | ||
| 	}
 | ||
|   },
 | ||
| }
 | ||
| </script>
 | ||
| 
 | ||
| <style lang="scss" scoped>
 | ||
| 	/deep/ uni-button:after{
 | ||
| 		border: none;
 | ||
| 	}
 | ||
| 	/deep/ .u-form-item__body__right__message{
 | ||
| 		margin-left: 170rpx !important;
 | ||
| 	}
 | ||
| 	.yzm{
 | ||
| 		// width: 161rpx;
 | ||
| 		height: 74rpx;
 | ||
| 		line-height: 74rpx;
 | ||
| 		text-align: center;
 | ||
| 		color: #fff;
 | ||
| 		background: #2FBC42;
 | ||
| 		border-radius: 40rpx;
 | ||
| 		margin-left: 30rpx;
 | ||
| 		font-size: 24rpx;
 | ||
| 	}
 | ||
| 	/deep/ .u-form-item:nth-child(2){
 | ||
| 		width: 670rpx;
 | ||
| 	}
 | ||
| 	.contents{
 | ||
| 		background-color: #fff;
 | ||
| 	}
 | ||
| 	page{
 | ||
| 		background-color: #f2f2f2;
 | ||
| 	}
 | ||
| 	/deep/ .width-s{
 | ||
| 		width: 200rpx !important;
 | ||
| 	}
 | ||
| 	.paddings{
 | ||
| 		padding: 30rpx 0rpx;
 | ||
| 		margin: 0 40rpx;
 | ||
| 	}
 | ||
| 	.border-color{
 | ||
| 		border-radius: 50rpx;
 | ||
| 		padding-left: 50rpx !important;
 | ||
| 		font-size: 28rpx;
 | ||
| 		width: 400rpx;
 | ||
| 		height: 60rpx;
 | ||
| 		background: #F5F6F8;
 | ||
| 		border: none;
 | ||
| 	}
 | ||
| 	.btn{
 | ||
| 		background-color: #FB3024;
 | ||
| 		border: none;
 | ||
| 		height: 92rpx;
 | ||
| 		line-height: 92rpx;
 | ||
| 		font-size:30rpx;
 | ||
| 		margin: 40rpx auto;
 | ||
| 		width: 690rpx;
 | ||
| 	}
 | ||
| </style> |