gxwebsoft/glt-taro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

```

Browse Source 
feat(address): 添加用户地址管理页面的定位功能

- 集成 Taro 地图选点功能，支持用户手动选择精确位置
- 新增地理位置权限处理逻辑，包括授权失败和用户取消的情况
- 实现经纬度信息在地址表单中的存储和回显功能
- 添加定位选择界面，展示已选择的位置信息
- 移除原有的实时定位功能，改为手动选择模式
- 更新地址表单提交逻辑以支持新的定位数据结构
```
This commit is contained in:
赵忠林
2026-02-09 17:15:18 +08:00
parent a1e1487d42
commit 8d2188b928
4 changed files with 256 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/pages/index/Header.scss
View File

@@ -14,10 +14,3 @@
position: absolute;
z-index: 0;
}
/* 吸顶状态下的样式 */
.nutui-sticky--fixed {
.header-bg {
height: 100%;
}
}

220
src/pages/index/Header.tsx
View File

@@ -1,6 +1,6 @@
import {useEffect, useState} from "react";
import Taro from '@tarojs/taro';
import {Button, Sticky, Popup, Cell, CellGroup} from '@nutui/nutui-react-taro'
import {Button, Popup, Cell, CellGroup} from '@nutui/nutui-react-taro'
// import {TriangleDown} from '@nutui/icons-react-taro'
import { NavBar} from '@nutui/nutui-react-taro'
import {getUserInfo, getWxOpenId} from "@/api/layout";
@@ -25,7 +25,6 @@ const Header = (_: any) => {
const [IsLogin, setIsLogin] = useState<boolean>(true)
const [statusBarHeight, setStatusBarHeight] = useState<number>()
const [stickyStatus, setStickyStatus] = useState<boolean>(false)
const [userInfo] = useState<User>()
// 门店选择：用于首页展示“最近门店”，并在下单时写入订单 storeId
@@ -291,12 +290,6 @@ const Header = (_: any) => {
})
}
// 处理粘性布局状态变化
const onStickyChange = (isSticky: boolean) => {
setStickyStatus(isSticky)
console.log('Header 粘性状态:', isSticky ? '已固定' : '取消固定')
}
// 获取小程序系统信息
// const getSystemInfo = () => {
// const systemInfo = Taro.getSystemInfoSync()
@@ -311,121 +304,114 @@ const Header = (_: any) => {
return (
<>
<Sticky
threshold={0}
onChange={onStickyChange}
<View
className={'header-bg'}
style={{
zIndex: 1000,
backgroundColor: stickyStatus ? '#03605c' : 'transparent',
transition: 'background-color 0.3s ease',
height: '180px',
paddingBottom: '12px',
}}
>
<View className={'header-bg'} style={{
height: !stickyStatus ? '180px' : `${(statusBarHeight || 0) + 44}px`,
paddingBottom: !stickyStatus ? '12px' : '0px'
}}>
{/* 只在非吸顶状态下显示搜索框 */}
{!stickyStatus && <MySearch statusBarHeight={statusBarHeight} />}
</View>
<NavBar
style={{
marginTop: `${statusBarHeight}px`,
marginBottom: '0px',
backgroundColor: 'transparent'
}}
onBackClick={() => {
}}
// left={
// <View
// style={{display: 'flex', alignItems: 'center', gap: '8px'}}
// onClick={() => setStorePopupVisible(true)}
// >
// <Avatar
// size="22"
// src={getWebsiteLogo()}
// />
// <Text className={'text-white'}>
// {selectedStore?.name || '请选择门店'}
// </Text>
// <TriangleDown className={'text-white'} size={9}/>
// </View>
// }
right={
!IsLogin ? (
<Button
size="small"
fill="none"
style={{color: '#ffffff'}}
open-type="getPhoneNumber"
onGetPhoneNumber={handleGetPhoneNumber}
>
登录
</Button>
) : null
}
>
<Text className={'text-white'}>{getTenantName()}</Text>
</NavBar>
<MySearch statusBarHeight={statusBarHeight} />
</View>
<Popup
visible={storePopupVisible}
position="bottom"
style={{height: '70vh'}}
onClose={() => setStorePopupVisible(false)}
>
<View className="p-4">
<View className="flex justify-between items-center mb-3">
<Text className="text-base font-medium">选择门店</Text>
<Text
className="text-sm text-gray-500"
onClick={() => setStorePopupVisible(false)}
>
关闭
</Text>
</View>
<NavBar
style={{
marginTop: `${statusBarHeight}px`,
marginBottom: '0px',
backgroundColor: 'transparent'
}}
onBackClick={() => {
}}
// left={
// <View
// style={{display: 'flex', alignItems: 'center', gap: '8px'}}
// onClick={() => setStorePopupVisible(true)}
// >
// <Avatar
// size="22"
// src={getWebsiteLogo()}
// />
// <Text className={'text-white'}>
// {selectedStore?.name || '请选择门店'}
// </Text>
// <TriangleDown className={'text-white'} size={9}/>
// </View>
// }
right={
!IsLogin ? (
<Button
size="small"
fill="none"
style={{color: '#ffffff'}}
open-type="getPhoneNumber"
onGetPhoneNumber={handleGetPhoneNumber}
>
登录
</Button>
) : null
}
>
<Text className={'text-white'}>{getTenantName()}</Text>
</NavBar>
<View className="text-xs text-gray-500 mb-2">
{userLocation ? '已获取定位，按距离排序' : '未获取定位，可手动选择门店'}
</View>
<CellGroup>
{[...stores]
.sort((a, b) => (getStoreDistance(a) ?? Number.POSITIVE_INFINITY) - (getStoreDistance(b) ?? Number.POSITIVE_INFINITY))
.map((s) => {
const d = getStoreDistance(s)
const isActive = !!selectedStore?.id && selectedStore.id === s.id
return (
<Cell
key={s.id}
title={
<View className="flex items-center justify-between">
<Text className={isActive ? 'text-green-600' : ''}>{s.name || `门店${s.id}`}</Text>
{d !== undefined && <Text className="text-xs text-gray-500">{formatDistance(d)}</Text>}
</View>
}
description={s.address || ''}
onClick={async () => {
let storeToSave = s
if (s?.id) {
try {
const full = await getShopStore(s.id)
if (full) storeToSave = full
} catch (_e) {
// keep base item
}
}
setSelectedStore(storeToSave)
saveSelectedStoreToStorage(storeToSave)
setStorePopupVisible(false)
Taro.showToast({title: '门店已切换', icon: 'success'})
}}
/>
)
})}
</CellGroup>
<Popup
visible={storePopupVisible}
position="bottom"
style={{height: '70vh'}}
onClose={() => setStorePopupVisible(false)}
>
<View className="p-4">
<View className="flex justify-between items-center mb-3">
<Text className="text-base font-medium">选择门店</Text>
<Text
className="text-sm text-gray-500"
onClick={() => setStorePopupVisible(false)}
>
关闭
</Text>
</View>
</Popup>
</Sticky>
<View className="text-xs text-gray-500 mb-2">
{userLocation ? '已获取定位，按距离排序' : '未获取定位，可手动选择门店'}
</View>
<CellGroup>
{[...stores]
.sort((a, b) => (getStoreDistance(a) ?? Number.POSITIVE_INFINITY) - (getStoreDistance(b) ?? Number.POSITIVE_INFINITY))
.map((s) => {
const d = getStoreDistance(s)
const isActive = !!selectedStore?.id && selectedStore.id === s.id
return (
<Cell
key={s.id}
title={
<View className="flex items-center justify-between">
<Text className={isActive ? 'text-green-600' : ''}>{s.name || `门店${s.id}`}</Text>
{d !== undefined && <Text className="text-xs text-gray-500">{formatDistance(d)}</Text>}
</View>
}
description={s.address || ''}
onClick={async () => {
let storeToSave = s
if (s?.id) {
try {
const full = await getShopStore(s.id)
if (full) storeToSave = full
} catch (_e) {
// keep base item
}
}
setSelectedStore(storeToSave)
saveSelectedStoreToStorage(storeToSave)
setStorePopupVisible(false)
Taro.showToast({title: '门店已切换', icon: 'success'})
}}
/>
)
})}
</CellGroup>
</View>
</Popup>
</>
)
}

2
src/pages/index/index.tsx
View File

@@ -234,7 +234,7 @@ function Home() {
return (
<>
{/* Header区域 - 现在由Header组件内部处理吸顶逻辑 */}
{/* Header区域 */}
<Header />
<View className="home-page">