Browse Source

新增:识别收货地址

master
科技小王子 1 month ago
parent
commit
c94eb1dcd1
  1. 166
      src/user/address/add.tsx

166
src/user/address/add.tsx

@ -1,4 +1,4 @@
import {useEffect, useState} from "react";
import {useEffect, useState, useRef} from "react";
import {useRouter} from '@tarojs/taro'
import {Button, Loading, CellGroup, Input, TextArea, Form} from '@nutui/nutui-react-taro'
import {Scan, ArrowRight} from '@nutui/icons-react-taro'
@ -16,6 +16,8 @@ const AddUserAddress = () => {
const [optionsDemo1, setOptionsDemo1] = useState([])
const [visible, setVisible] = useState(false)
const [FormData, setFormData] = useState<ShopUserAddress>({})
const [inputText, setInputText] = useState<string>('')
const formRef = useRef<any>(null)
const reload = async () => {
const address = await getShopUserAddress(Number(params.id))
@ -51,6 +53,146 @@ const AddUserAddress = () => {
}))
}
/**
*
*/
const recognizeAddress = () => {
if (!inputText.trim()) {
Taro.showToast({
title: '请输入要识别的文本',
icon: 'none'
});
return;
}
try {
const result = parseAddressText(inputText);
// 更新表单数据
const newFormData = {
...FormData,
name: result.name || FormData.name,
phone: result.phone || FormData.phone,
address: result.address || FormData.address,
province: result.province || FormData.province,
city: result.city || FormData.city,
region: result.region || FormData.region
};
setFormData(newFormData);
// 更新地区显示文本
if (result.province && result.city && result.region) {
setText(`${result.province} ${result.city} ${result.region}`);
}
// 更新表单字段值
if (formRef.current) {
formRef.current.setFieldsValue(newFormData);
}
Taro.showToast({
title: '识别成功',
icon: 'success'
});
// 清空输入框
setInputText('');
} catch (error) {
Taro.showToast({
title: '识别失败,请检查文本格式',
icon: 'none'
});
}
};
/**
*
*/
const parseAddressText = (text: string) => {
const result: any = {};
// 手机号正则 (11位数字)
const phoneRegex = /1[3-9]\d{9}/;
const phoneMatch = text.match(phoneRegex);
if (phoneMatch) {
result.phone = phoneMatch[0];
}
// 姓名正则 (2-4个中文字符,通常在开头)
const nameRegex = /^[\u4e00-\u9fa5]{2,4}/;
const nameMatch = text.match(nameRegex);
if (nameMatch) {
result.name = nameMatch[0];
}
// 省市区识别
const regionResult = parseRegion(text);
if (regionResult) {
result.province = regionResult.province;
result.city = regionResult.city;
result.region = regionResult.region;
}
// 详细地址提取 (去除姓名、手机号、省市区后的剩余部分)
let addressText = text;
if (result.name) {
addressText = addressText.replace(result.name, '');
}
if (result.phone) {
addressText = addressText.replace(result.phone, '');
}
if (result.province) {
addressText = addressText.replace(result.province, '');
}
if (result.city) {
addressText = addressText.replace(result.city, '');
}
if (result.region) {
addressText = addressText.replace(result.region, '');
}
// 清理地址文本
result.address = addressText.replace(/[,,。\s]+/g, '').trim();
return result;
};
/**
*
*/
const parseRegion = (text: string) => {
// @ts-ignore
for (const province of RegionData) {
if (text.includes(province.label)) {
const result: any = { province: province.label };
// 查找城市
if (province.children) {
for (const city of province.children) {
if (text.includes(city.label)) {
result.city = city.label;
// 查找区县
if (city.children) {
for (const region of city.children) {
if (text.includes(region.label)) {
result.region = region.label;
return result;
}
}
}
return result;
}
}
}
return result;
}
}
return null;
};
// 提交表单
const submitSucceed = async (values: any) => {
@ -98,6 +240,7 @@ const AddUserAddress = () => {
return (
<>
<Form
ref={formRef}
divider
initialValues={FormData}
labelPosition="left"
@ -128,11 +271,22 @@ const AddUserAddress = () => {
position: 'relative'
}}>
<TextArea style={{height: '100px'}}
placeholder={'请粘贴或输入文本,点击"识别"自动识别收货人姓名、地址、电话'}/>
<Button icon={<Scan/>} style={{position: 'absolute', right: '10px', bottom: '10px'}} type="success"
size={'small'}
fill="dashed"></Button>
<TextArea
style={{height: '100px'}}
value={inputText}
onChange={(value) => setInputText(value)}
placeholder={'请粘贴或输入文本,点击"识别"自动识别收货人姓名、地址、电话'}
/>
<Button
icon={<Scan/>}
style={{position: 'absolute', right: '10px', bottom: '10px'}}
type="success"
size={'small'}
fill="dashed"
onClick={recognizeAddress}
>
</Button>
</div>
</CellGroup>
<View className={'bg-gray-100 h-3'}></View>

Loading…
Cancel
Save