feat:修改手机号

pages/my/userinfo.vue

@@ -20,12 +20,12 @@
 					<!-- #ifdef MP-WEIXIN -->
 					<button open-type="chooseAvatar" class="avatar-button" @chooseavatar="onChooseAvatar">
 						<image style="width: 78rpx;height: 78rpx;border-radius: 50%"
-							:src="avatar?avatar:'../../static/logo.png'"></image>
+							:src="avatar ? avatar : '../../static/logo.png'"></image>
 					</button>
 					<!-- #endif -->
 					<!-- #ifndef MP-WEIXIN -->
 					<view @click="uploadImg()">
-						<image src="../../static/logo.png" v-if="avatar==null" mode=""
+						<image src="../../static/logo.png" v-if="avatar == null" mode=""
 							style="width: 78rpx;height: 78rpx;border-radius: 50%;"></image>
 						<image v-else :src="avatar" mode="" style="width: 78rpx;height: 78rpx;border-radius: 50%;">
 						</image>
@@ -72,7 +72,7 @@
 			<view class="usermain-item item-padding contact-structure">
 				<view class="usermain-item-title">联系方式</view>
 				<view class="contact-wrapper">
-					<text class="phone-display">{{phoneWithMask}}</text>
+					<text class="phone-display">{{ phoneWithMask }}</text>
 					<text class="modify-link" @click="modifyPhone">修改手机号</text>
 				</view>
 			</view>
@@ -140,613 +140,618 @@
 </template>
 
 <script>
-	import configdata from '../../common/config.js';
-	import navBar from "@/components/nav-bar/index.vue";
-	export default {
-		components: {
-			navBar
+import configdata from '../../common/config.js';
+import navBar from "@/components/nav-bar/index.vue";
+export default {
+	components: {
+		navBar
+	},
+	data() {
+		return {
+			statusBarHeight: 0, // 状态栏高度
+			phone: '',
+			weChatNum: '', //微信号
+			email: '', //接收简历邮箱
+			selectedCompany: '深圳市汉瑞国际猎头服务有限公司', // 我的公司
+			selectedPosition: '人事总监', // 我的职务
+			avatar: '../../static/logo.png',
+			userName: '',
+			nickName: '',
+			userId: '',
+			realName: '',
+			weChatId: "",
+			password: '',
+			platform: '',
+			createTime: '',
+			money: '',
+			jiFen: '',
+			status: '',
+			zhiFuBao: '',
+			zhiFuBaoName: '',
+			sex: 1,
+			age: 0,
+			hrInfo: {},
+			hrPosition: '',
+			hrEmail: '',
+			inputKey: ''
+		};
+	},
+	computed: {
+		phoneWithMask() {
+			if (this.phone && this.phone.length >= 11) {
+				return this.phone.substring(0, 3) + '******' + this.phone.substring(9);
+			}
+			return this.phone || '请设置手机号';
+		}
+	},
+	onLoad(e) {
+		// 获取状态栏高度
+		let systemInfo = uni.getSystemInfoSync();
+		this.statusBarHeight = systemInfo.statusBarHeight || 0;
+
+		// this.getUserInfo()
+		// this.getUserHr()
+		this.inputKey = new Date().getTime()
+		// this.avatar = uni.getStorageSync('avatar')
+	},
+	onShow() {
+		this.getUserInfo()
+		this.getUserHr()
+	},
+	methods: {
+		filterSymbols(e) {
+			// 使用正则表达式过滤掉所有符号（只保留中文、英文、数字）
+			let value = e.detail.value
+			// 允许：中文、英文、数字
+			let filteredValue = value.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '')
+			console.log(this.hrPosition);
+			// 如果值被修改了
+			this.hrPosition = filteredValue
+			if (value !== filteredValue) {
+				this.inputKey = new Date().getTime()
+				uni.showToast({
+					title: '禁止输入符号',
+					icon: "none"
+				})
+			}
 		},
-		data() {
-			return {
-				statusBarHeight: 0, // 状态栏高度
-				phone: '',
-				weChatNum: '', //微信号
-				email: '', //接收简历邮箱
-				selectedCompany: '深圳市汉瑞国际猎头服务有限公司', // 我的公司
-				selectedPosition: '人事总监', // 我的职务
-				avatar: '../../static/logo.png',
-				userName: '',
-				nickName: '',
-				userId: '',
-				realName: '',
-				weChatId: "",
-				password: '',
-				platform: '',
-				createTime: '',
-				money: '',
-				jiFen: '',
-				status: '',
-				zhiFuBao: '',
-				zhiFuBaoName: '',
-				sex: 1,
-				age: 0,
-				hrInfo: {},
-				hrPosition: '',
-				hrEmail: '',
-				inputKey: ''
-			};
+		// 返回上一页
+		goBack() {
+			uni.navigateBack();
 		},
-		computed: {
-			phoneWithMask() {
-				if (this.phone && this.phone.length >= 11) {
-					return this.phone.substring(0, 3) + '******' + this.phone.substring(9);
-				}
-				return this.phone || '请设置手机号';
-			}
+		// 修改手机号
+		modifyPhone() {
+			console.log('点击修改手机号，当前手机号：', this.phone);
+			const url = `/pages/my/userphone?currentPhone=${this.phone}`;
+			console.log('跳转路径：', url);
+
+			uni.navigateTo({
+				url: url,
+			});
+		},
+		// 选择公司
+		selectCompany() {
+			uni.navigateTo({
+				url: '/pages/my/myCompany'
+			});
 		},
-		onLoad(e) {
-			// 获取状态栏高度
-			let systemInfo = uni.getSystemInfoSync();
-			this.statusBarHeight = systemInfo.statusBarHeight || 0;
-
-			this.getUserInfo()
-			this.getUserHr()
-			this.inputKey = new Date().getTime()
-			// this.avatar = uni.getStorageSync('avatar')
+		// 选择职务
+		selectPosition() {
+			// 这里可以跳转到职务选择页面或显示职务选择弹窗
+			console.log('选择职务');
 		},
-		methods: {
-			filterSymbols(e) {
-				// 使用正则表达式过滤掉所有符号（只保留中文、英文、数字）
-				let value = e.detail.value
-				// 允许：中文、英文、数字
-				let filteredValue = value.replace(/[^\u4e00-\u9fa5a-zA-Z0-9]/g, '')
-				console.log(this.hrPosition);
-				// 如果值被修改了
-				this.hrPosition = filteredValue
-				if (value !== filteredValue) {
-					this.inputKey = new Date().getTime()
-					uni.showToast({
-						title: '禁止输入符号',
-						icon: "none"
-					})
+		onChooseAvatar(e) {
+			let that = this;
+			let token = uni.getStorageSync('token');
+			uni.uploadFile({
+				url: that.config("APIHOST1") +
+					'/alioss/upload', //真实的接口地址
+				filePath: e.detail.avatarUrl,
+				header: {
+					token: token
+				},
+				name: 'file',
+				success: uploadFileRes => {
+					let url = JSON.parse(uploadFileRes.data);
+					that.avatar = url.data
+					uni.hideLoading();
 				}
-			},
-			// 返回上一页
-			goBack() {
-				uni.navigateBack();
-			},
-			// 修改手机号
-			modifyPhone() {
-				console.log('点击修改手机号，当前手机号：', this.phone);
-				const url = `/pages/my/userphone?currentPhone=${this.phone}`;
-				console.log('跳转路径：', url);
-
-				uni.navigateTo({
-					url: url,
-				});
-			},
-			// 选择公司
-			selectCompany() {
-				uni.navigateTo({
-					url: '/pages/my/myCompany'
-				});
-			},
-			// 选择职务
-			selectPosition() {
-				// 这里可以跳转到职务选择页面或显示职务选择弹窗
-				console.log('选择职务');
-			},
-			onChooseAvatar(e) {
-				let that = this;
-				let token = uni.getStorageSync('token');
-				uni.uploadFile({
-					url: that.config("APIHOST1") +
-						'/alioss/upload', //真实的接口地址
-					filePath: e.detail.avatarUrl,
-					header: {
-						token: token
-					},
-					name: 'file',
-					success: uploadFileRes => {
-						let url = JSON.parse(uploadFileRes.data);
-						that.avatar = url.data
-						uni.hideLoading();
-					}
-				});
+			});
 
-			},
-			goMyAddress() {
-				uni.navigateTo({
-					url: '../jifen/myaddress'
-				});
-			},
-			async uploadImg() {
-				let token = uni.getStorageSync('token')
+		},
+		goMyAddress() {
+			uni.navigateTo({
+				url: '../jifen/myaddress'
+			});
+		},
+		async uploadImg() {
+			let token = uni.getStorageSync('token')
 
-				if (!token) {
-					this.goLoginInfo();
-					return;
-				}
+			if (!token) {
+				this.goLoginInfo();
+				return;
+			}
 
-				let that = this;
-				var url = null;
-				uni.showActionSheet({
-					// itemList按钮的文字接受的是数组
-					itemList: ["查看头像", "从相册选择图片"],
-					async success(e) {
-						var index = e.tapIndex
-						if (index === 0) {
-							// 用户点击了预览当前图片
-							// 可以自己实现当前头像链接的读取
-							let url = that.avatar;
-							let arr = []
-							arr.push(url)
-							uni.previewImage({
-								// 预览功能图片也必须是数组的
-								urls: arr
-							})
-						} else if (index === 1) {
-							const hasPermission = await that.$queue.checkPermission(
-								'camera',
-								'选择/拍摄照片需要相机/相册权限，用于上传用户头像',
-								that
-							);
-
-							// 2. 如果未授权或者用户拒绝，显示提示
-							if (!hasPermission) {
-								return;
-							}
-							uni.chooseImage({
-								count: 1, //默认9
-								sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
-								sourceType: ['album'], //从相册选择
-								success: function(res) {
-									uni.showLoading({
-										title: '上传中...'
-									});
-									let token = uni.getStorageSync('token');
-									let userId = uni.getStorageSync('userId');
-									uni.uploadFile({
-										url: that.config("APIHOST1") +
-											'/alioss/upload', //真实的接口地址
-
-										filePath: res.tempFilePaths[0],
-										header: {
-											token: token
-										},
-										name: 'file',
-										success: uploadFileRes => {
-											url = JSON.parse(uploadFileRes.data);
-											that.avatar = url.data
-											uni.hideLoading();
-										}
-									});
-								}
-							});
+			let that = this;
+			var url = null;
+			uni.showActionSheet({
+				// itemList按钮的文字接受的是数组
+				itemList: ["查看头像", "从相册选择图片"],
+				async success(e) {
+					var index = e.tapIndex
+					if (index === 0) {
+						// 用户点击了预览当前图片
+						// 可以自己实现当前头像链接的读取
+						let url = that.avatar;
+						let arr = []
+						arr.push(url)
+						uni.previewImage({
+							// 预览功能图片也必须是数组的
+							urls: arr
+						})
+					} else if (index === 1) {
+						const hasPermission = await that.$queue.checkPermission(
+							'camera',
+							'选择/拍摄照片需要相机/相册权限，用于上传用户头像',
+							that
+						);
+
+						// 2. 如果未授权或者用户拒绝，显示提示
+						if (!hasPermission) {
+							return;
 						}
-					}
-				})
-			},
-			config: function(name) {
-				var info = null;
-				if (name) {
-					var name2 = name.split("."); //字符分割
-					if (name2.length > 1) {
-						info = configdata[name2[0]][name2[1]] || null;
-					} else {
-						info = configdata[name] || null;
-					}
-					if (info == null) {
-						let web_config = cache.get("web_config");
-						if (web_config) {
-							if (name2.length > 1) {
-								info = web_config[name2[0]][name2[1]] || null;
-							} else {
-								info = web_config[name] || null;
+						uni.chooseImage({
+							count: 1, //默认9
+							sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+							sourceType: ['album'], //从相册选择
+							success: function (res) {
+								uni.showLoading({
+									title: '上传中...'
+								});
+								let token = uni.getStorageSync('token');
+								let userId = uni.getStorageSync('userId');
+								uni.uploadFile({
+									url: that.config("APIHOST1") +
+										'/alioss/upload', //真实的接口地址
+
+									filePath: res.tempFilePaths[0],
+									header: {
+										token: token
+									},
+									name: 'file',
+									success: uploadFileRes => {
+										url = JSON.parse(uploadFileRes.data);
+										that.avatar = url.data
+										uni.hideLoading();
+									}
+								});
 							}
-						}
+						});
 					}
 				}
-				return info;
-			},
-			getUserHr() {
-				this.$Request.get("/app/HrFirst/getUserHr").then(res => {
-					if (res.code === 0) {
-						this.hrInfo = res.data.HrEntity
-						this.hrPosition = res.data.HrEntity.hrPosition
-						this.hrEmail = res.data.HrEntity.hrEmail
-					}
-				})
-			},
-			getUserInfo() {
-				let userId = uni.getStorageSync('userId')
-				this.$Request.get("/app/user/selectUserById").then(res => {
-					if (res.code == 0) {
-						this.$queue.setData('avatar', res.data.avatar);
-						this.$queue.setData('userId', res.data.userId);
-						this.$queue.setData('userName', res.data.userName);
-						this.$queue.setData('phone', res.data.phone);
-						this.$queue.setData('age', res.data.age);
-						this.$queue.setData('weChatNum', res.data.weChatNum)
-						this.weChatNum = res.data.weChatNum
-						this.sex = res.data.sex
-						this.age = res.data.age
-						this.phone = res.data.phone;
-						this.avatar = res.data.avatar;
-						this.userName = res.data.userName;
-						if (this.userName == null) {
-							this.userName = res.data.nickName;
+			})
+		},
+		config: function (name) {
+			var info = null;
+			if (name) {
+				var name2 = name.split("."); //字符分割
+				if (name2.length > 1) {
+					info = configdata[name2[0]][name2[1]] || null;
+				} else {
+					info = configdata[name] || null;
+				}
+				if (info == null) {
+					let web_config = cache.get("web_config");
+					if (web_config) {
+						if (name2.length > 1) {
+							info = web_config[name2[0]][name2[1]] || null;
 						} else {
-							this.userName = res.data.userName;
+							info = web_config[name] || null;
 						}
-						this.selectedCompany = this.$queue.getData('companyName')
 					}
-					uni.hideLoading();
-				});
-			},
-
-			// 保存
-			messagebtn() {
-				if (!this.userName) {
-					// this.$queue.showToast('用户名不能为空');
-					uni.showToast({
-						title: "用户名不能为空",
-						icon: "none"
-					})
-				} else if (!this.phone) {
-					// this.$queue.showToast('用户名不能为空');
-					uni.showToast({
-						title: "联系电话不能为空",
-						icon: "none"
-					})
-				} else {
-					let that = this
-					uni.showModal({
-						title: '温馨提示',
-						content: '确定保存信息',
-						success: e => {
-							if (e.confirm) {
-								let phone = that.$queue.getData('newPhone') ? this.$queue.getData('newPhone') :
-									that.phone
-								that.$Request.postJson("/app/user/updateUser", {
-									userName: that.userName,
-									avatar: that.avatar,
-									phone,
-									sex: that.sex,
-									age: that.age,
-									weChatNum: that.weChatNum
-								}).then(res => {
-									if (res.code === 0) {
-										that.$Request.postJson("/app/HrFirst/addHr", {
-											hrPosition: this.hrPosition,
-											hrEmail: this.hrEmail,
-										}).then(res => {
-											if (res.code === 0) {
-												uni.showToast({
-													title: '保存成功',
-													icon: "none"
-												})
-												that.getUserInfo()
-												setTimeout(function() {
-													uni.navigateBack()
-												}, 1000)
-											} else {
-												uni.showToast({
-													title: res.msg,
-													icon: "none"
-												})
-											}
-										})
-										// uni.showToast({
-										// 	title: '保存成功',
-										// 	icon: "none"
-										// })
-										// that.getUserInfo()
-										// setTimeout(function() {
-										// 	uni.navigateBack()
-										// }, 1000)
-									} else {
-										uni.showToast({
-											title: res.msg,
-											icon: "none"
-										})
-									}
-								})
-							}
-						}
-					});
 				}
 			}
+			return info;
+		},
+		getUserHr() {
+			this.$Request.get("/app/HrFirst/getUserHr").then(res => {
+				if (res.code === 0) {
+					this.hrInfo = res.data.HrEntity
+					this.hrPosition = res.data.HrEntity.hrPosition
+					this.hrEmail = res.data.HrEntity.hrEmail
+				}
+			})
+		},
+		getUserInfo() {
+			let userId = uni.getStorageSync('userId')
+			this.$Request.get("/app/user/selectUserById").then(res => {
+				if (res.code == 0) {
+					this.$queue.setData('avatar', res.data.avatar);
+					this.$queue.setData('userId', res.data.userId);
+					this.$queue.setData('userName', res.data.userName);
+					this.$queue.setData('phone', res.data.phone);
+					this.$queue.setData('age', res.data.age);
+					this.$queue.setData('weChatNum', res.data.weChatNum)
+					this.weChatNum = res.data.weChatNum
+					this.sex = res.data.sex
+					this.age = res.data.age
+					this.phone = res.data.phone;
+					this.avatar = res.data.avatar;
+					this.userName = res.data.userName;
+					if (this.userName == null) {
+						this.userName = res.data.nickName;
+					} else {
+						this.userName = res.data.userName;
+					}
+					this.selectedCompany = this.$queue.getData('companyName')
+				}
+				uni.hideLoading();
+			});
 		},
-		// userphone(){
-		// 	uni.navigateTo({
-		// 		url:'/pages/my/userphone'
-		// 	})
-		// }
 
-	};
+		// 保存
+		messagebtn() {
+			if (!this.userName) {
+				// this.$queue.showToast('用户名不能为空');
+				uni.showToast({
+					title: "用户名不能为空",
+					icon: "none"
+				})
+			} else if (!this.phone) {
+				// this.$queue.showToast('用户名不能为空');
+				uni.showToast({
+					title: "联系电话不能为空",
+					icon: "none"
+				})
+			} else {
+				let that = this
+				uni.showModal({
+					title: '温馨提示',
+					content: '确定保存信息',
+					success: e => {
+						if (e.confirm) {
+							let phone = that.$queue.getData('newPhone') ? this.$queue.getData('newPhone') :
+								that.phone
+							that.$Request.postJson("/app/user/updateUser", {
+								userName: that.userName,
+								avatar: that.avatar,
+								phone,
+								sex: that.sex,
+								age: that.age,
+								weChatNum: that.weChatNum
+							}).then(res => {
+								if (res.code === 0) {
+									that.$Request.postJson("/app/HrFirst/addHr", {
+										hrPosition: this.hrPosition,
+										hrEmail: this.hrEmail,
+									}).then(res => {
+										if (res.code === 0) {
+											uni.showToast({
+												title: '保存成功',
+												icon: "none"
+											})
+											that.getUserInfo()
+											setTimeout(function () {
+												uni.navigateBack()
+											}, 1000)
+										} else {
+											uni.showToast({
+												title: res.msg,
+												icon: "none"
+											})
+										}
+									})
+									// uni.showToast({
+									// 	title: '保存成功',
+									// 	icon: "none"
+									// })
+									// that.getUserInfo()
+									// setTimeout(function() {
+									// 	uni.navigateBack()
+									// }, 1000)
+								} else {
+									uni.showToast({
+										title: res.msg,
+										icon: "none"
+									})
+								}
+							})
+						}
+					}
+				});
+			}
+		}
+	},
+	// userphone(){
+	// 	uni.navigateTo({
+	// 		url:'/pages/my/userphone'
+	// 	})
+	// }
+
+};
 </script>
 
 <style lang="scss" scoped>
-	page {
-		/* background: #1c1b20; */
-	}
-
-	.navbar {
-		position: fixed;
-		top: 0;
-		left: 0;
-		right: 0;
-		z-index: 999;
-		background: #fff;
-		padding: 0 0 40rpx 20rpx;
+page {
+	/* background: #1c1b20; */
+}
+
+.navbar {
+	position: fixed;
+	top: 0;
+	left: 0;
+	right: 0;
+	z-index: 999;
+	background: #fff;
+	padding: 0 0 40rpx 20rpx;
+
+	.navbar-content {
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 30rpx;
+		height: 60rpx;
 
-		.navbar-content {
+		.navbar-left {
+			width: 60rpx;
+			height: 60rpx;
 			display: flex;
 			align-items: center;
-			justify-content: space-between;
-			padding: 0 30rpx;
-			height: 60rpx;
-			.navbar-left {
-				width: 60rpx;
-				height: 60rpx;
-				display: flex;
-				align-items: center;
-				justify-content: center;
-			}
-
-			.navbar-title {
-				color: rgba(23, 23, 37, 1);
-				font-family: DM Sans;
-				font-size: 36rpx;
-				font-weight: 700;
-				line-height: 52rpx;
-				letter-spacing: 0%;
-				text-align: center;
-			}
-
-			.navbar-right {
-				width: 60rpx;
-				height: 60rpx;
-			}
+			justify-content: center;
 		}
-	}
 
-	button::after {
-		border: none;
-		background-color: none;
-	}
-
-	button {
-		position: relative;
-		display: block;
-		margin-left: auto;
-		margin-right: auto;
-		padding-left: 0px;
-		padding-right: 0px;
-		box-sizing: border-box;
-		text-decoration: none;
-		line-height: 1.35;
-		overflow: hidden;
-		color: #666666;
-		/* background-color: #fff; */
-		background-color: rgba(255, 255, 255, 0) !important;
-		width: 100%;
-		height: 100%;
-	}
-
-	.usermain {
-		background: #ffffff;
-		/* color: #fff; */
-		margin-top: 120rpx;
-		/* 为固定导航栏留出空间 */
-		/* #ifdef APP*/
-		margin-top: calc(120rpx + var(--status-bar-height));
-		/* #endif*/
-	}
-
-	.usermain-item {
-		display: flex;
-		flex-direction: column;
-		margin: 0 40rpx;
-		padding: 20rpx 0;
-		// border-bottom: 1rpx solid rgba(229, 229, 229, 0.3);
-		gap: 16rpx;
-	}
-
-	.usermain-item-title {
-		color: rgba(31, 44, 55, 1);
-		font-family: DM Sans;
-		font-size: 28rpx;
-		font-weight: 500;
-		line-height: 44rpx;
-		text-align: left;
-	}
-
-	.usermain-item.item-padding {
-		/* padding: 0; */
-	}
-
-	.cu-form-group {
-		padding: 0;
-		background: #ffffff;
-		text-align: right;
-	}
-
-	.cu-form-group input {
-		background: #ffffff;
-		font-size: 28rpx;
-		/* color: #fff; */
-
-	}
-
-	/* 姓名字段样式 - 参考basicInfo.vue */
-	.usermain-item .form-label {
-		color: rgba(31, 44, 55, 1);
-		font-family: DM Sans;
-		font-size: 32rpx;
-		font-weight: 500;
-		line-height: 44rpx;
-		letter-spacing: 0.5%;
-		text-align: left;
-		display: flex;
-		align-items: center;
-		margin-bottom: 16rpx;
-	}
-
-	.usermain-item .required-mark {
-		color: #FF3B30;
-		font-size: 36rpx;
-		font-weight: 600;
-		margin-right: 8rpx;
-	}
-
-	.usermain-item .cu-form-group {
-		background: transparent;
-		text-align: left;
-		padding: 0;
-	}
-
-	.usermain-item .cu-form-group input {
-		width: 100%;
-		height: 68rpx;
-		font-size: 28rpx;
-		border: 1rpx solid rgba(227, 231, 236, 1);
-		border-radius: 44rpx;
-		color: rgba(23, 23, 37, 1);
-		padding: 0 32rpx;
-		background: #ffffff;
-		font-family: DM Sans;
-		font-weight: 400;
-	}
-
-	.usermain-item .cu-form-group input::placeholder {
-		color: rgba(155, 155, 155, 1);
-		font-size: 28rpx;
-	}
-
-	/* 联系方式样式 */
-	.contact-structure {
-		border-bottom: none !important;
-	}
+		.navbar-title {
+			color: rgba(23, 23, 37, 1);
+			font-family: DM Sans;
+			font-size: 36rpx;
+			font-weight: 700;
+			line-height: 52rpx;
+			letter-spacing: 0%;
+			text-align: center;
+		}
 
-	.contact-wrapper {
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		padding: 0;
-		margin-top: 8rpx;
+		.navbar-right {
+			width: 60rpx;
+			height: 60rpx;
+		}
 	}
-
-	.phone-display {
-		color: rgba(23, 23, 37, 1);
+}
+
+button::after {
+	border: none;
+	background-color: none;
+}
+
+button {
+	position: relative;
+	display: block;
+	margin-left: auto;
+	margin-right: auto;
+	padding-left: 0px;
+	padding-right: 0px;
+	box-sizing: border-box;
+	text-decoration: none;
+	line-height: 1.35;
+	overflow: hidden;
+	color: #666666;
+	/* background-color: #fff; */
+	background-color: rgba(255, 255, 255, 0) !important;
+	width: 100%;
+	height: 100%;
+}
+
+.usermain {
+	background: #ffffff;
+	/* color: #fff; */
+	margin-top: 120rpx;
+	/* 为固定导航栏留出空间 */
+	/* #ifdef APP*/
+	margin-top: calc(120rpx + var(--status-bar-height));
+	/* #endif*/
+}
+
+.usermain-item {
+	display: flex;
+	flex-direction: column;
+	margin: 0 40rpx;
+	padding: 20rpx 0;
+	// border-bottom: 1rpx solid rgba(229, 229, 229, 0.3);
+	gap: 16rpx;
+}
+
+.usermain-item-title {
+	color: rgba(31, 44, 55, 1);
+	font-family: DM Sans;
+	font-size: 28rpx;
+	font-weight: 500;
+	line-height: 44rpx;
+	text-align: left;
+}
+
+.usermain-item.item-padding {
+	/* padding: 0; */
+}
+
+.cu-form-group {
+	padding: 0;
+	background: #ffffff;
+	text-align: right;
+}
+
+.cu-form-group input {
+	background: #ffffff;
+	font-size: 28rpx;
+	/* color: #fff; */
+
+}
+
+/* 姓名字段样式 - 参考basicInfo.vue */
+.usermain-item .form-label {
+	color: rgba(31, 44, 55, 1);
+	font-family: DM Sans;
+	font-size: 32rpx;
+	font-weight: 500;
+	line-height: 44rpx;
+	letter-spacing: 0.5%;
+	text-align: left;
+	display: flex;
+	align-items: center;
+	margin-bottom: 16rpx;
+}
+
+.usermain-item .required-mark {
+	color: #FF3B30;
+	font-size: 36rpx;
+	font-weight: 600;
+	margin-right: 8rpx;
+}
+
+.usermain-item .cu-form-group {
+	background: transparent;
+	text-align: left;
+	padding: 0;
+}
+
+.usermain-item .cu-form-group input {
+	width: 100%;
+	height: 68rpx;
+	font-size: 28rpx;
+	border: 1rpx solid rgba(227, 231, 236, 1);
+	border-radius: 44rpx;
+	color: rgba(23, 23, 37, 1);
+	padding: 0 32rpx;
+	background: #ffffff;
+	font-family: DM Sans;
+	font-weight: 400;
+}
+
+.usermain-item .cu-form-group input::placeholder {
+	color: rgba(155, 155, 155, 1);
+	font-size: 28rpx;
+}
+
+/* 联系方式样式 */
+.contact-structure {
+	border-bottom: none !important;
+}
+
+.contact-wrapper {
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	padding: 0;
+	margin-top: 8rpx;
+}
+
+.phone-display {
+	color: rgba(23, 23, 37, 1);
+	font-family: DM Sans;
+	font-size: 28rpx;
+	font-weight: 400;
+	line-height: 40rpx;
+	letter-spacing: 0.5%;
+}
+
+.modify-link {
+	color: rgba(24, 144, 255, 1);
+	font-family: DM Sans;
+	font-size: 28rpx;
+	font-weight: 400;
+	line-height: 40rpx;
+	letter-spacing: 0.5%;
+	cursor: pointer;
+	text-decoration: none;
+}
+
+.modify-link:active {
+	opacity: 0.7;
+}
+
+/* 头像编辑图标样式 */
+.avatar-wrapper {
+	position: relative;
+	display: inline-block;
+}
+
+.edit-avatar-icon {
+	position: absolute;
+	bottom: 10rpx;
+	left: 60rpx;
+	width: 24rpx;
+	height: 24rpx;
+	// background: #fff;
+	border-radius: 50%;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+}
+
+.avatar-button {
+	position: relative;
+	padding: 0;
+	margin: 0;
+	background: transparent;
+	border: none;
+}
+
+.footer-btn {
+	margin-top: 40rpx;
+	padding-bottom: 40rpx;
+}
+
+.footer-btn .usermain-btn {
+	color: rgba(255, 255, 255, 1);
+	background: rgba(1, 107, 246, 1);
+	text-align: center;
+	width: 90%;
+	height: 80rpx;
+	font-size: 32rpx;
+	line-height: 80rpx;
+	margin: 20rpx auto;
+	border-radius: 40rpx;
+}
+
+/* 选择器样式 - 参考workExperience页面 */
+.form-input-selector {
+	width: 100%;
+	height: 68rpx;
+	padding: 0 40rpx;
+	border: 1px solid rgba(227, 231, 236, 1);
+	border-radius: 24px;
+	background: rgba(255, 255, 255, 1);
+	display: flex;
+	align-items: center;
+	justify-content: space-between;
+	cursor: pointer;
+	transition: all 0.2s ease;
+
+	.placeholder {
+		color: #999999;
 		font-family: DM Sans;
 		font-size: 28rpx;
 		font-weight: 400;
 		line-height: 40rpx;
-		letter-spacing: 0.5%;
 	}
 
-	.modify-link {
-		color: rgba(24, 144, 255, 1);
+	text {
+		color: rgba(23, 23, 37, 1);
 		font-family: DM Sans;
 		font-size: 28rpx;
 		font-weight: 400;
 		line-height: 40rpx;
-		letter-spacing: 0.5%;
-		cursor: pointer;
-		text-decoration: none;
-	}
-
-	.modify-link:active {
-		opacity: 0.7;
-	}
-
-	/* 头像编辑图标样式 */
-	.avatar-wrapper {
-		position: relative;
-		display: inline-block;
-	}
-
-	.edit-avatar-icon {
-		position: absolute;
-		bottom: 10rpx;
-		left: 60rpx;
-		width: 24rpx;
-		height: 24rpx;
-		// background: #fff;
-		border-radius: 50%;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
-	}
-
-	.avatar-button {
-		position: relative;
-		padding: 0;
-		margin: 0;
-		background: transparent;
-		border: none;
-	}
-
-	.footer-btn {
-		margin-top: 40rpx;
-		padding-bottom: 40rpx;
-	}
-
-	.footer-btn .usermain-btn {
-		color: rgba(255, 255, 255, 1);
-		background: rgba(1, 107, 246, 1);
-		text-align: center;
-		width: 90%;
-		height: 80rpx;
-		font-size: 32rpx;
-		line-height: 80rpx;
-		margin: 20rpx auto;
-		border-radius: 40rpx;
-	}
-
-	/* 选择器样式 - 参考workExperience页面 */
-	.form-input-selector {
-		width: 100%;
-		height: 68rpx;
-		padding: 0 40rpx;
-		border: 1px solid rgba(227, 231, 236, 1);
-		border-radius: 24px;
-		background: rgba(255, 255, 255, 1);
-		display: flex;
-		align-items: center;
-		justify-content: space-between;
-		cursor: pointer;
-		transition: all 0.2s ease;
-
-		.placeholder {
-			color: #999999;
-			font-family: DM Sans;
-			font-size: 28rpx;
-			font-weight: 400;
-			line-height: 40rpx;
-		}
-
-		text {
-			color: rgba(23, 23, 37, 1);
-			font-family: DM Sans;
-			font-size: 28rpx;
-			font-weight: 400;
-			line-height: 40rpx;
-		}
-	}
-
-	.arrow-down {
-		color: rgba(96, 98, 102, 1);
-		font-size: 24rpx;
-		font-weight: 400;
-		transform: scale(1.5);
-	}
-
-	.selector-group:active {
-		background: #f5f7fa !important;
-		transform: scale(0.99);
 	}
+}
+
+.arrow-down {
+	color: rgba(96, 98, 102, 1);
+	font-size: 24rpx;
+	font-weight: 400;
+	transform: scale(1.5);
+}
+
+.selector-group:active {
+	background: #f5f7fa !important;
+	transform: scale(0.99);
+}
 </style>

pages/my/userphone.vue

@@ -10,23 +10,23 @@
 				<view class="nav-right"></view>
 			</view>
 		</view>
-		
+
 		<!-- 主要内容 -->
 		<view class="main-content">
 			<!-- 页面标题 -->
 			<view class="page-title">修改手机号</view>
-			
+
 			<!-- 说明文字 -->
 			<view class="description">
 				<text>修改手机号后,可以使用新手机号登录亿职赞,聊天时"交换电话"功能的手机号会统一修改</text>
 			</view>
-			
+
 			<!-- 当前手机号显示 -->
 			<view class="current-phone-section">
 				<text class="current-label">当前手机号:</text>
-				<text class="current-phone">{{currentPhoneMask}}</text>
+				<text class="current-phone">{{ currentPhoneMask }}</text>
 			</view>
-			
+
 			<!-- 新手机号输入 -->
 			<view class="input-section">
 				<view class="phone-input-container">
@@ -34,31 +34,18 @@
 						<text class="country-code">+ 86</text>
 						<u-icon name="arrow-down" color="#999" size="24"></u-icon>
 					</view>
-					<input 
-						v-model="newPhone" 
-						type="number" 
-						placeholder="请输入新手机号" 
-						maxlength="11"
-						class="phone-input"
-					/>
+					<input v-model="newPhone" type="number" placeholder="请输入新手机号" maxlength="11" class="phone-input" />
 				</view>
 			</view>
-			
+
 			<!-- 验证码输入 -->
 			<view class="verification-section">
 				<view class="verify-input-container">
 					<view class="verify-boxes">
-						<input 
-							v-for="(digit, index) in verificationDigits" 
-							:key="index"
-							v-model="verificationDigits[index]"
-							type="number"
-							maxlength="1"
-							:focus="focusIndex === index"
-							class="verify-box"
-							@input="handleDigitInput(index, $event)"
-							@keyup.delete="handleDelete(index)"
-						/>
+						<input v-for="(digit, index) in verificationDigits" :key="index"
+							v-model="verificationDigits[index]" type="number" maxlength="1"
+							:focus="focusIndex === index" class="verify-box" @input="handleDigitInput(index, $event)"
+							@keyup.delete="handleDelete(index)" />
 					</view>
 					<view class="get-code-btn" @click="getVerificationCode" :class="{ disabled: isCountingDown }">
 						<text>{{ countdownText }}</text>
@@ -66,7 +53,7 @@
 				</view>
 			</view>
 		</view>
-		
+
 		<!-- 底部确定按钮 -->
 		<view class="bottom-btn-container">
 			<view class="confirm-btn" @click="confirmChange" :class="{ disabled: !canConfirm }">
@@ -82,9 +69,9 @@ import configdata from '../../common/config.js';
 export default {
 	data() {
 		return {
-			currentPhone: '18800000097', // 当前手机号
+			currentPhone: '', // 当前手机号
 			newPhone: '', // 新手机号
-			verificationDigits: ['', '', '', '', ''], // 验证码
+			verificationDigits: ['', '', '', '', '', ''], // 验证码
 			focusIndex: 0,
 			isCountingDown: false,
 			countdown: 60,
@@ -101,7 +88,7 @@ export default {
 		},
 		// 是否可以确认
 		canConfirm() {
-			return this.newPhone.length === 11 && this.verificationDigits.join('').length === 5;
+			return this.newPhone.length === 11 && this.verificationDigits.join('').length === 6;
 		}
 	},
 	onLoad(options) {
@@ -115,7 +102,7 @@ export default {
 		goBack() {
 			uni.navigateBack();
 		},
-		
+
 		// 显示国家选择器
 		showCountrySelector() {
 			uni.showToast({
@@ -123,14 +110,14 @@ export default {
 				icon: 'none'
 			});
 		},
-		
+
 		// 验证码输入处理
 		handleDigitInput(index, event) {
 			const value = event.detail.value;
 			this.verificationDigits[index] = value;
-			
+
 			// 自动跳转到下一框
-			if (value && index < 4) {
+			if (value && index < 5) {
 				this.$nextTick(() => {
 					this.focusIndex = index + 1;
 					return;
@@ -140,7 +127,7 @@ export default {
 				});
 			}
 		},
-		
+
 		// 删除处理
 		handleDelete(index) {
 			if (!this.verificationDigits[index] && index > 0) {
@@ -152,7 +139,7 @@ export default {
 				});
 			}
 		},
-		
+
 		// 获取验证码
 		async getVerificationCode() {
 			if (!this.newPhone) {
@@ -162,7 +149,7 @@ export default {
 				});
 				return;
 			}
-			
+
 			if (this.newPhone.length !== 11) {
 				uni.showToast({
 					title: '请输入正确的手机号',
@@ -170,11 +157,11 @@ export default {
 				});
 				return;
 			}
-			
+
 			uni.showLoading({
 				title: '发送中...'
 			});
-			
+
 			try {
 				// 调用发送验证码API
 				this.$Request.getT("/app/Login/sendMsg/" + this.newPhone + "/1").then((res) => {
@@ -193,9 +180,9 @@ export default {
 					}
 				});
 				// const res = await this.$Request.getT("/app/Login/sendMsg/" + this.newPhone + "/1")
-				
+
 				// uni.hideLoading();
-				
+
 				// if (res.status === 0) {
 				// 	uni.showToast({
 				// 		title: '验证码发送成功',
@@ -216,17 +203,17 @@ export default {
 				});
 			}
 		},
-		
+
 		// 开始倒计时
 		startCountdown() {
 			this.isCountingDown = true;
 			this.countdown = 60;
 			this.countdownText = '60秒后重新获取';
-			
+
 			const timer = setInterval(() => {
 				this.countdown--;
 				this.countdownText = `${this.countdown}秒后重新获取`;
-				
+
 				if (this.countdown <= 0) {
 					clearInterval(timer);
 					this.isCountingDown = false;
@@ -234,7 +221,7 @@ export default {
 				}
 			}, 1000);
 		},
-		
+
 		// 确认修改
 		async confirmChange() {
 			if (!this.canConfirm) {
@@ -244,22 +231,23 @@ export default {
 				});
 				return;
 			}
-			
+
 			uni.showLoading({
 				title: '处理中...'
 			});
-			
+
 			try {
 				const userId = uni.getStorageSync('userId');
 				// 验证手机号接口  
-				const res = await this.$Request.postJson("/xxx/xxx/xxx", {
-											phone: this.newPhone,
-											code: this.verificationDigits.join(''),
-										})
+				// const res = await this.$Request.postJson("/app/user/updatePhone", {
+				// 							phone: this.newPhone,
+				// 							code: this.verificationDigits.join(''),
+				// 						})
+				const res = await this.$Request.post(`/app/user/updatePhone?phone=${this.newPhone}&msg=${this.verificationDigits.join('')}`)
 				uni.hideLoading();
 				if (res.code === 0) {
 					uni.showToast({
-						title: '手机号验证成功',
+						title: '手机号修改成功',
 						icon: 'success'
 					});
 					setTimeout(() => {
@@ -280,7 +268,7 @@ export default {
 				});
 			}
 		},
-		
+
 		// 请求封装
 		request(options) {
 			return new Promise((resolve, reject) => {
@@ -313,22 +301,23 @@ export default {
 	background-color: #ffffff;
 	z-index: 9999;
 	// border-bottom: 1rpx solid #f0f0f0;
-	
+
 	.navbar-content {
 		display: flex;
 		align-items: center;
 		justify-content: space-between;
 		height: 88rpx;
 		padding: 0 40rpx;
-		
-		.nav-left, .nav-right {
+
+		.nav-left,
+		.nav-right {
 			width: 60rpx;
 			height: 60rpx;
 			display: flex;
 			align-items: center;
 			justify-content: center;
 		}
-		
+
 		.nav-title {
 			color: rgba(51, 51, 51, 1);
 			font-family: PingFang SC;
@@ -373,8 +362,9 @@ export default {
 	align-items: center;
 	margin-bottom: 20rpx;
 	gap: 16rpx;
-	
-	.current-label , .current-phone{
+
+	.current-label,
+	.current-phone {
 		color: rgba(102, 102, 102, 1);
 		font-family: DM Sans;
 		font-size: 24rpx;
@@ -399,7 +389,7 @@ export default {
 	display: flex;
 	align-items: center;
 	// padding: 0 20rpx;
-	
+
 	.country-selector {
 		display: flex;
 		align-items: center;
@@ -411,7 +401,7 @@ export default {
 		// border-right: 1rpx solid #e4e6ea;
 		margin-right: 20rpx;
 		gap: 26rpx;
-		
+
 		.country-code {
 			color: rgba(56, 59, 70, 1);
 			font-family: DM Sans;
@@ -422,7 +412,7 @@ export default {
 			text-align: center;
 		}
 	}
-	
+
 	.phone-input {
 		flex: 1;
 		width: 446rpx;
@@ -437,7 +427,7 @@ export default {
 		line-height: 48rpx;
 		letter-spacing: 0%;
 		text-align: left;
-		
+
 		&::placeholder {
 			color: rgba(195, 196, 199, 1);
 		}
@@ -462,7 +452,7 @@ export default {
 	gap: 20rpx;
 	justify-content: space-between;
 	width: 100%;
-	
+
 	.verify-box {
 		width: 110rpx;
 		height: 96rpx;
@@ -475,12 +465,12 @@ export default {
 		font-size: 32rpx;
 		font-weight: 500;
 		line-height: 80rpx;
-		
+
 		&:focus {
 			border-color: rgba(24, 144, 255, 1);
 			background: rgba(255, 255, 255, 1);
 		}
-		
+
 		&::placeholder {
 			color: rgba(155, 155, 155, 1);
 		}
@@ -488,14 +478,14 @@ export default {
 }
 
 .get-code-btn {
-	color:rgba(1, 107, 246, 1);
+	color: rgba(1, 107, 246, 1);
 	font-family: DM Sans;
 	font-size: 26rpx;
 	font-weight: 400;
 	line-height: 32rpx;
 	letter-spacing: 0.5%;
 	text-align: left;
-	
+
 	&.disabled {
 		color: rgba(155, 155, 155, 1);
 	}
@@ -512,16 +502,16 @@ export default {
 .confirm-btn {
 	width: 100%;
 	height: 88rpx;
-	background: var(--线性渐变, linear-gradient(90.00deg, rgba(13, 39, 247, 1),rgba(19, 193, 234, 1) 100%));
+	background: var(--线性渐变, linear-gradient(90.00deg, rgba(13, 39, 247, 1), rgba(19, 193, 234, 1) 100%));
 	border-radius: 44rpx;
 	display: flex;
 	align-items: center;
 	justify-content: center;
-	
+
 	&.disabled {
 		opacity: 0.4;
 	}
-	
+
 	text {
 		color: rgba(255, 255, 255, 1);
 		font-family: PingFang SC;