zhxg_xsbdV1.0/pages/update_pwd/update_pwd.vue

<template>
	<view class="editphone">
		<view class="row">
			<input type="text" placeholder="考生号" v-model="actForm.ksh" />
		</view>
		<view class="row">
			<input type="text" placeholder="身份证号" v-model="actForm.sfzh" />
		</view>
		<!-- <view class="row">
			<input type="text" placeholder="手机号" v-model="actForm.phone" />
		</view> -->
		<view class="row">
			<input type="password" v-model="actForm.pwd" placeholder="请输入新密码">
		</view>
		<!--    <view class="row">
      <input type="text" placeholder="手机验证码" v-model="actForm.code" />
      <button :disabled="time < 60" @click="getCode" class="mini-btn" type="primary" size="mini">{{ codeTxt }}</button>
    </view> -->
		<button type="primary" @click="changePhone" class="submit">更改</button>
	</view>
</template>

<script>
	import {
		verifyPwd,
		sendSmsUpdatePwd,
		checkPwd
	} from "@/api/toApi.js";

	export default {
		data() {
			return {
				time: 60,
				codeTxt: "获取验证码",
				actForm: {
					xh: "",
					sfzh: "",
					ksh:'',
					// phone: "",
					code: "",
					pwd: ""
				},
			}
		},
		methods: {
			async getCode() {
				// 发送短信验证码的逻辑
				let sdata = {
					SFZH: this.actForm.sfzh,
					SJH: this.actForm.phone,
					XH: this.actForm.xh
				};
				console.log(sdata)
				try {
					let res = await sendSmsUpdatePwd(sdata);
					if (res.code === 200) {
						var timer = setInterval(() => {
							if (this.time > 0) {
								this.time--;
								this.codeTxt = this.time + "S之后重新发送";
							} else {
								this.time = 60;
								this.codeTxt = "获取验证码";
								clearInterval(timer);
							}
						}, 1000);
					} else {
						console.log(res.msg)
						uni.showToast({
							title: res.msg || "发送失败",

							icon: "none"
						});
					}
				} catch (error) {
					uni.showToast({
						title: "发送失败，请稍后重试",
						icon: "none"
					});
				}
			},
			changePhone() {
				const requiredFields = {
					sfzh: '身份证号不能为空',
					// phone: "手机号不能为空",
					ksh: '考生号不能为空',
					pwd: '密码不能为空'
					// code: '验证码不能为空',
				};

				const emptyField = Object.keys(requiredFields).find(field => {
					if (field === 'pwd') {
						return !this.actForm[field] || this.actForm[field].length < 6;
					}
					return !this.actForm[field];
				});

				if (emptyField) {
					if (emptyField === 'pwd' && this.actForm['pwd'].length < 6) {
						uni.showToast({
							title: "密码必须大于等于6位",
							icon: "none"
						});
					} else {
						uni.showToast({
							title: requiredFields[emptyField],
							icon: "none"
						});
					}
					return;
				}

				// 调用后端验证接口
				checkPwd({
					KSH: this.actForm.ksh,
					// SJH: this.actForm.phone,
					SFZH: this.actForm.sfzh,
					pwd: this.actForm.pwd
				}).then(res => {
					if (res.code === 200) {
						uni.showToast({
							title: "更改成功",
							duration: 2000
						});
						uni.navigateTo({
							url: '/pages/login/index'
						});
						// 验证成功后的操作，例如跳转页面或其他处理
					} else {
						console.log(res.msg)
						uni.showToast({
							title: "更改失败，请检查输入的信息",
							icon: "none"
						});
					}
				}).catch(err => {
					uni.showToast({
						title: "更改失败，请稍后重试",
						icon: "none"
					});
				});
			}
		}
	}
</script>


<style scope lang="scss">
	.editphone {
		padding: 40rpx;

		.row {
			display: flex;
			border-bottom: 1px solid #d2d2d2;
			padding: 10rpx 0;
			align-items: center;

			input {
				height: 110rpx;
				padding-left: 20rpx;
				flex: 1;
			}

			.mini-btn {
				background-color: white;
				color: #1584FF;
				border-radius: 0;
				border-bottom: 1.5px solid #1584FF;
				font-size: 32rpx;
				padding: 0;
				height: 32px;

				&:after {
					border: none;
				}

				&[disabled] {
					color: #9ACAFF;
					border-bottom: 1.5px solid #9ACAFF;
				}
			}
		}

		.submit {
			margin-top: 150rpx;
			height: 100rpx;
			line-height: 100rpx;
		}

	}
</style>