first commit

2026-04-11 14:42:14 +08:00
commit b962c9c716
62 changed files with 7323 additions and 0 deletions
--- a/pages/change-phone/change-phone.vue
+++ b/pages/change-phone/change-phone.vue
@@ -0,0 +1,152 @@
+<template>
+	<view class="container">
+		<view class="card">
+			<view class="form-item">
+				<view class="label">原手机号</view>
+				<up-input placeholder="请输入原手机号" border="surround" v-model="form.oldPhone" />
+			</view>
+
+			<view class="form-item">
+				<view class="label">验证码</view>
+				<up-input placeholder="请输入原手机号验证码" border="surround" v-model="form.oldCode">
+					<template #suffix>
+						<up-button @tap="sendOldCode" :text="oldCodeText" type="success" size="small" :disabled="oldCooldown > 0"></up-button>
+					</template>
+				</up-input>
+			</view>
+
+			<view class="form-item">
+				<view class="label">新手机号</view>
+				<up-input placeholder="请输入新手机号" border="surround" v-model="form.newPhone" />
+			</view>
+
+			<view class="form-item">
+				<view class="label">验证码</view>
+				<up-input placeholder="请输入新手机号验证码" border="surround" v-model="form.newCode">
+					<template #suffix>
+						<up-button @tap="sendNewCode" :text="newCodeText" type="success" size="small" :disabled="newCooldown > 0"></up-button>
+					</template>
+				</up-input>
+			</view>
+
+			<view class="btn-wrapper">
+				<up-button type="primary" @click="submit">确认更换</up-button>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { reactive, ref } from 'vue';
+	import { authApi } from '@/api/index.js';
+
+	const form = reactive({
+		oldPhone: '',
+		oldCode: '',
+		newPhone: '',
+		newCode: ''
+	});
+
+	let oldCooldown = ref(0);
+	let newCooldown = ref(0);
+	let oldCodeText = ref('获取验证码');
+	let newCodeText = ref('获取验证码');
+	let oldTimer = null;
+	let newTimer = null;
+
+	const sendOldCode = async () => {
+		if (oldCooldown.value > 0) return;
+		if (!form.oldPhone) {
+			uni.showToast({ title: '请输入原手机号', icon: 'none' });
+			return;
+		}
+
+		try {
+			const data = await authApi.sendCode(form.oldPhone, 'change_phone_old');
+			oldCooldown.value = data.cooldown_seconds || 60;
+			oldCodeText.value = `${oldCooldown.value}s`;
+
+			oldTimer = setInterval(() => {
+				oldCooldown.value--;
+				if (oldCooldown.value <= 0) {
+					clearInterval(oldTimer);
+					oldCodeText.value = '获取验证码';
+				} else {
+					oldCodeText.value = `${oldCooldown.value}s`;
+				}
+			}, 1000);
+
+			uni.showToast({ title: '验证码已发送', icon: 'success' });
+		} catch (e) {
+			console.error('发送验证码失败', e);
+		}
+	};
+
+	const sendNewCode = async () => {
+		if (newCooldown.value > 0) return;
+		if (!form.newPhone) {
+			uni.showToast({ title: '请输入新手机号', icon: 'none' });
+			return;
+		}
+
+		try {
+			const data = await authApi.sendCode(form.newPhone, 'change_phone_new');
+			newCooldown.value = data.cooldown_seconds || 60;
+			newCodeText.value = `${newCooldown.value}s`;
+
+			newTimer = setInterval(() => {
+				newCooldown.value--;
+				if (newCooldown.value <= 0) {
+					clearInterval(newTimer);
+					newCodeText.value = '获取验证码';
+				} else {
+					newCodeText.value = `${newCooldown.value}s`;
+				}
+			}, 1000);
+
+			uni.showToast({ title: '验证码已发送', icon: 'success' });
+		} catch (e) {
+			console.error('发送验证码失败', e);
+		}
+	};
+
+	const submit = async () => {
+		if (!form.oldPhone || !form.oldCode) {
+			uni.showToast({ title: '请填写原手机号信息', icon: 'none' });
+			return;
+		}
+		if (!form.newPhone || !form.newCode) {
+			uni.showToast({ title: '请填写新手机号信息', icon: 'none' });
+			return;
+		}
+
+		try {
+			await authApi.changePhone(form.oldPhone, form.oldCode, form.newPhone, form.newCode);
+			uni.showToast({ title: '更换成功', icon: 'success' });
+			setTimeout(() => {
+				uni.navigateBack();
+			}, 1500);
+		} catch (e) {
+			console.error('更换手机号失败', e);
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.container {
+		.card {
+			.form-item {
+				margin-bottom: var(--space-lg);
+				.label {
+					font-size: 28rpx;
+					font-weight: 500;
+					color: var(--text-primary);
+					margin-bottom: var(--space-sm);
+				}
+			}
+			.btn-wrapper {
+				margin-top: var(--space-xl);
+			}
+		}
+	}
+</style>