完善个人页(测试NTRP水平未做)
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { View, Text, Image, ScrollView, Picker, Input } from '@tarojs/components';
|
||||
import { View, Text, Image, ScrollView, Picker, Input, Button } from '@tarojs/components';
|
||||
import Taro from '@tarojs/taro';
|
||||
import './index.scss';
|
||||
import { UserInfo } from '@/components/UserInfo';
|
||||
@@ -67,7 +67,7 @@ const EditProfilePage: React.FC = () => {
|
||||
ntrp_level: user_data.ntrp_level || 'NTRP 4.0',
|
||||
phone: user_data.phone || '',
|
||||
gender: user_data.gender || '',
|
||||
birthday: '2000-01-01' // 默认生日,实际应该从用户数据获取
|
||||
birthday: user_data.birthday || '', // 默认生日,实际应该从用户数据获取
|
||||
});
|
||||
} catch (error) {
|
||||
console.error('加载用户信息失败:', error);
|
||||
@@ -180,9 +180,7 @@ const EditProfilePage: React.FC = () => {
|
||||
// 处理性别选择
|
||||
const handle_gender_change = (e: any) => {
|
||||
const gender_value = e.detail.value;
|
||||
// 使用工具函数转换:页面选择器值(0/1) -> 数据库值('0'/'1')
|
||||
const gender_db_value = gender_value === 0 ? '0' : '1';
|
||||
handle_field_edit('gender', gender_db_value);
|
||||
handle_field_edit('gender', gender_value);
|
||||
};
|
||||
|
||||
// 处理生日选择
|
||||
@@ -191,6 +189,17 @@ const EditProfilePage: React.FC = () => {
|
||||
handle_field_edit('birthday', birthday_value);
|
||||
};
|
||||
|
||||
// NTRP水平输入 - 实时更新本地状态
|
||||
const handle_ntrp_level_input = (e: any) => {
|
||||
const ntrp_level_value = e.detail.value;
|
||||
setFormData(prev => ({ ...prev, ntrp_level: ntrp_level_value }));
|
||||
}
|
||||
// NTRP水平输入 - 失去焦点时保存到服务器
|
||||
const handle_ntrp_level_blur = (e: any) => {
|
||||
const ntrp_level_value = e.detail.value;
|
||||
handle_field_edit('ntrp_level', ntrp_level_value);
|
||||
}
|
||||
|
||||
// 处理职业输入 - 实时更新本地状态
|
||||
const handle_occupation_input = (e: any) => {
|
||||
const occupation_value = e.detail.value;
|
||||
@@ -215,17 +224,17 @@ const EditProfilePage: React.FC = () => {
|
||||
handle_field_edit('location', location_value);
|
||||
};
|
||||
|
||||
// 处理手机号输入 - 实时更新本地状态
|
||||
const handle_phone_input = (e: any) => {
|
||||
const phone_value = e.detail.value;
|
||||
setFormData(prev => ({ ...prev, phone: phone_value }));
|
||||
};
|
||||
// // 处理手机号输入 - 实时更新本地状态
|
||||
// const handle_phone_input = (e: any) => {
|
||||
// const phone_value = e.detail.value;
|
||||
// setFormData(prev => ({ ...prev, phone: phone_value }));
|
||||
// };
|
||||
|
||||
// 处理手机号输入 - 失去焦点时保存到服务器
|
||||
const handle_phone_blur = (e: any) => {
|
||||
const phone_value = e.detail.value;
|
||||
handle_field_edit('phone', phone_value);
|
||||
};
|
||||
// // 处理手机号输入 - 失去焦点时保存到服务器
|
||||
// const handle_phone_blur = (e: any) => {
|
||||
// const phone_value = e.detail.value;
|
||||
// handle_field_edit('phone', phone_value);
|
||||
// };
|
||||
|
||||
|
||||
// 处理退出登录
|
||||
@@ -246,6 +255,29 @@ const EditProfilePage: React.FC = () => {
|
||||
});
|
||||
};
|
||||
|
||||
const onGetPhoneNumber = async (e) => {
|
||||
if (!e.detail || !e.detail.code) {
|
||||
Taro.showToast({
|
||||
title: '获取手机号失败,请重试',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log('用户手机号信息aaa:', e)
|
||||
try {
|
||||
const phone = await UserService.parse_phone(e.detail.code);
|
||||
handle_field_edit('phone', phone);
|
||||
} catch (e) {
|
||||
console.error('解析手机号失败:', e);
|
||||
Taro.showToast({
|
||||
title: '解析手机号失败,请重试',
|
||||
icon: 'none',
|
||||
duration: 2000
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<View className="edit_profile_page">
|
||||
{/* 导航栏 */}
|
||||
@@ -345,7 +377,7 @@ const EditProfilePage: React.FC = () => {
|
||||
</View>
|
||||
<View className="item_right">
|
||||
<Text className="item_value">
|
||||
{form_data.personal_profile || '介绍一下自己'}
|
||||
{form_data.personal_profile.replace(/\n/g, ' ') || '介绍一下自己'}
|
||||
</Text>
|
||||
<Image className="arrow_icon" src={require('@/static/list/icon-list-right-arrow.svg')} />
|
||||
</View>
|
||||
@@ -370,6 +402,7 @@ const EditProfilePage: React.FC = () => {
|
||||
onInput={handle_location_input}
|
||||
onBlur={handle_location_blur}
|
||||
/>
|
||||
<Image className="arrow_icon" src={require('@/static/list/icon-list-right-arrow.svg')} />
|
||||
</View>
|
||||
</View>
|
||||
<View className="divider"></View>
|
||||
@@ -381,7 +414,14 @@ const EditProfilePage: React.FC = () => {
|
||||
<Text className="item_label">NTRP 水平</Text>
|
||||
</View>
|
||||
<View className="item_right">
|
||||
<Text className="item_value">{form_data.ntrp_level}</Text>
|
||||
{/* <Text className="item_value">{form_data.ntrp_level}</Text> */}
|
||||
<Input
|
||||
className="item_input"
|
||||
value={form_data.ntrp_level}
|
||||
placeholder="请输入NTRP水平"
|
||||
onInput={handle_ntrp_level_input}
|
||||
onBlur={handle_ntrp_level_blur}
|
||||
/>
|
||||
<Image className="arrow_icon" src={require('@/static/list/icon-list-right-arrow.svg')} />
|
||||
</View>
|
||||
</View>
|
||||
@@ -401,6 +441,7 @@ const EditProfilePage: React.FC = () => {
|
||||
onInput={handle_occupation_input}
|
||||
onBlur={handle_occupation_blur}
|
||||
/>
|
||||
<Image className="arrow_icon" src={require('@/static/list/icon-list-right-arrow.svg')} />
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
@@ -415,14 +456,16 @@ const EditProfilePage: React.FC = () => {
|
||||
<Text className="item_label">手机</Text>
|
||||
</View>
|
||||
<View className="item_right">
|
||||
<Input
|
||||
{/* <Input
|
||||
className="item_input"
|
||||
value={form_data.phone}
|
||||
placeholder="请输入手机号"
|
||||
type="number"
|
||||
onInput={handle_phone_input}
|
||||
onBlur={handle_phone_blur}
|
||||
/>
|
||||
/> */}
|
||||
<Button className={form_data.phone ? '' : 'placeholer'} openType='getPhoneNumber' onGetPhoneNumber={onGetPhoneNumber}>{form_data.phone || '未绑定'}</Button>
|
||||
<Image className="arrow_icon" src={require('@/static/list/icon-list-right-arrow.svg')} />
|
||||
</View>
|
||||
</View>
|
||||
<View className="divider"></View>
|
||||
|
||||
Reference in New Issue
Block a user