hookehuyr

feat(editProfile): 添加手机号和验证码输入限制及验证

fix(myOrders): 修复重置列表状态时的滚动位置问题

refactor(editProfile): 移除未使用的主题配置和代码
......@@ -93,12 +93,17 @@
placeholder="请输入新手机号"
type="tel"
class="phone-input"
maxlength="11"
@input="onPhoneInput"
/>
<view class="code-row">
<nut-input
v-model="verifyCode"
placeholder="验证码"
class="code-input"
maxlength="6"
type="tel"
@input="onCodeInput"
/>
<nut-button
size="small"
......@@ -170,14 +175,8 @@
<script setup>
import { ref, reactive, onMounted } from 'vue'
import Taro from '@tarojs/taro'
import { RectLeft, Right } from '@nutui/icons-vue-taro'
import './index.less'
// 主题配置
const themeVars = ref({
navbarBackground: '#fb923c',
navbarColor: '#ffffff',
})
import { Right } from '@nutui/icons-vue-taro'
// 默认头像
const defaultAvatar = 'https://randomuser.me/api/portraits/men/32.jpg'
......@@ -256,6 +255,34 @@ const showPhoneDialog = () => {
verifyCode.value = ''
}
/**
* 手机号输入处理 - 只允许输入数字
* @param {string} value - 输入的值
*/
const onPhoneInput = ({ detail }) => {
// 只保留数字
newPhone.value = detail.value.replace(/\D/g, '')
}
/**
* 验证码输入处理 - 只允许输入数字
* @param {string} value - 输入的值
*/
const onCodeInput = ({ detail }) => {
// 只保留数字
verifyCode.value = detail.value.replace(/\D/g, '')
}
/**
* 校验手机号格式
* @param {string} phone - 手机号
* @returns {boolean} 是否有效
*/
const validatePhone = (phone) => {
const phoneRegex = /^1[3-9]\d{9}$/
return phoneRegex.test(phone)
}
// 发送验证码
const sendCode = () => {
if (!newPhone.value) {
......@@ -266,7 +293,14 @@ const sendCode = () => {
return
}
// 模拟发送验证码
if (!validatePhone(newPhone.value)) {
Taro.showToast({
title: '请输入正确的11位手机号',
icon: 'none'
})
return
}
codeCountdown.value = 60
const timer = setInterval(() => {
codeCountdown.value--
......@@ -291,8 +325,26 @@ const confirmPhoneChange = () => {
return
}
if (!validatePhone(newPhone.value)) {
Taro.showToast({
title: '请输入正确的11位手机号',
icon: 'none'
})
return
}
if (verifyCode.value.length !== 6) {
Taro.showToast({
title: '请输入6位验证码',
icon: 'none'
})
return
}
formData.phone = newPhone.value
phoneDialogVisible.value = false
newPhone.value = ''
verifyCode.value = ''
Taro.showToast({
title: '手机号绑定成功',
icon: 'success'
......@@ -306,7 +358,6 @@ const showDatePicker = () => {
// 确认日期选择
const onDateConfirm = ({ selectedValue }) => {
const date = new Date(selectedValue[0], selectedValue[1] - 1, selectedValue[2])
formData.birthday = `${selectedValue[0]}-${String(selectedValue[1]).padStart(2, '0')}-${String(selectedValue[2]).padStart(2, '0')}`
datePickerVisible.value = false
}
......@@ -325,8 +376,6 @@ const onSchoolConfirm = ({ selectedOptions }) => {
// 保存
const handleSave = () => {
// 这里可以添加表单验证
console.log('保存数据:', formData)
toastVisible.value = true
setTimeout(() => {
......@@ -337,12 +386,6 @@ const handleSave = () => {
// 初始化
onMounted(() => {
// 可以在这里加载用户数据
})
</script>
<script>
export default {
name: 'EditProfilePage'
}
})
</script>
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-07-03 21:34:36
* @LastEditTime: 2025-07-04 13:58:14
* @FilePath: /jgdl/src/pages/myOrders/index.vue
* @Description: 订单管理页面
-->
......@@ -542,20 +542,20 @@ const setActiveTab = (tab) => {
const resetListState = (resetData = false) => {
loading.value = false
hasMore.value = true
// 重置滚动位置到顶部
scrollTop.value = Math.random() // 使用随机数触发scroll-view重新渲染
if (resetData) {
// 重置已加载的数据索引
loadedBoughtIndex.value = 0
loadedSoldIndex.value = 0
// 重置订单数据到初始状态
boughtOrders.value = boughtOrders.value.slice(0, 5) // 保留前5条初始数据
soldOrders.value = soldOrders.value.slice(0, 5) // 保留前5条初始数据
}
// 延迟重置scrollTop为0,确保滚动位置正确
setTimeout(() => {
scrollTop.value = 0
......@@ -965,7 +965,7 @@ const deleteOrder = async (orderId) => {
const performDeleteOrder = async (orderId) => {
// 关闭确认弹窗
showConfirmModal.value = false
// 设置删除状态,用于显示加载效果
deletingOrderId.value = orderId
......