forked from gxwebsoft/mp-10550
新增:识别收货地址
This commit is contained in:
@@ -1,4 +1,4 @@
|
|||||||
import {useEffect, useState} from "react";
|
import {useEffect, useState, useRef} from "react";
|
||||||
import {useRouter} from '@tarojs/taro'
|
import {useRouter} from '@tarojs/taro'
|
||||||
import {Button, Loading, CellGroup, Input, TextArea, Form} from '@nutui/nutui-react-taro'
|
import {Button, Loading, CellGroup, Input, TextArea, Form} from '@nutui/nutui-react-taro'
|
||||||
import {Scan, ArrowRight} from '@nutui/icons-react-taro'
|
import {Scan, ArrowRight} from '@nutui/icons-react-taro'
|
||||||
@@ -16,6 +16,8 @@ const AddUserAddress = () => {
|
|||||||
const [optionsDemo1, setOptionsDemo1] = useState([])
|
const [optionsDemo1, setOptionsDemo1] = useState([])
|
||||||
const [visible, setVisible] = useState(false)
|
const [visible, setVisible] = useState(false)
|
||||||
const [FormData, setFormData] = useState<ShopUserAddress>({})
|
const [FormData, setFormData] = useState<ShopUserAddress>({})
|
||||||
|
const [inputText, setInputText] = useState<string>('')
|
||||||
|
const formRef = useRef<any>(null)
|
||||||
|
|
||||||
const reload = async () => {
|
const reload = async () => {
|
||||||
const address = await getShopUserAddress(Number(params.id))
|
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) => {
|
const submitSucceed = async (values: any) => {
|
||||||
|
|
||||||
@@ -98,6 +240,7 @@ const AddUserAddress = () => {
|
|||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Form
|
<Form
|
||||||
|
ref={formRef}
|
||||||
divider
|
divider
|
||||||
initialValues={FormData}
|
initialValues={FormData}
|
||||||
labelPosition="left"
|
labelPosition="left"
|
||||||
@@ -128,11 +271,22 @@ const AddUserAddress = () => {
|
|||||||
position: 'relative'
|
position: 'relative'
|
||||||
}}>
|
}}>
|
||||||
|
|
||||||
<TextArea style={{height: '100px'}}
|
<TextArea
|
||||||
placeholder={'请粘贴或输入文本,点击"识别"自动识别收货人姓名、地址、电话'}/>
|
style={{height: '100px'}}
|
||||||
<Button icon={<Scan/>} style={{position: 'absolute', right: '10px', bottom: '10px'}} type="success"
|
value={inputText}
|
||||||
size={'small'}
|
onChange={(value) => setInputText(value)}
|
||||||
fill="dashed">识别</Button>
|
placeholder={'请粘贴或输入文本,点击"识别"自动识别收货人姓名、地址、电话'}
|
||||||
|
/>
|
||||||
|
<Button
|
||||||
|
icon={<Scan/>}
|
||||||
|
style={{position: 'absolute', right: '10px', bottom: '10px'}}
|
||||||
|
type="success"
|
||||||
|
size={'small'}
|
||||||
|
fill="dashed"
|
||||||
|
onClick={recognizeAddress}
|
||||||
|
>
|
||||||
|
识别
|
||||||
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</CellGroup>
|
</CellGroup>
|
||||||
<View className={'bg-gray-100 h-3'}></View>
|
<View className={'bg-gray-100 h-3'}></View>
|
||||||
|
|||||||
Reference in New Issue
Block a user