feat(store): 添加门店管理功能和订单配送功能

- 在app.config.ts中添加门店相关路由配置
- 在config/app.ts中添加租户名称常量
- 在Header.tsx中实现门店选择功能,包括定位、距离计算和门店切换
- 更新ShopOrder模型,添加门店ID、门店名称、配送员ID和仓库ID字段
- 新增ShopStore相关API和服务,支持门店的增删改查
- 新增ShopStoreRider相关API和服务,支持配送员管理
- 新增ShopStoreUser相关API和服务,支持店员管理
- 新增ShopWarehouse相关API和服务,支持仓库管理
- 添加配送订单页面,支持订单状态管理和送达确认功能
- 优化经销商页面的样式布局
This commit is contained in:
2026-02-01 01:39:49 +08:00
parent f8e689e250
commit 3d82a0f194
27 changed files with 2027 additions and 65 deletions

View File

@@ -1,10 +1,10 @@
import {useEffect, useState} from "react";
import Taro from '@tarojs/taro';
import {Button, Space, Sticky} from '@nutui/nutui-react-taro'
import {Button, Sticky, Popup, Cell, CellGroup} from '@nutui/nutui-react-taro'
import {TriangleDown} from '@nutui/icons-react-taro'
import {Avatar, NavBar} from '@nutui/nutui-react-taro'
import {getUserInfo, getWxOpenId} from "@/api/layout";
import {TenantId} from "@/config/app";
import {TenantId, TenantName} from "@/config/app";
import {getOrganization} from "@/api/system/organization";
import {myUserVerify} from "@/api/system/userVerify";
import { useShopInfo } from '@/hooks/useShopInfo';
@@ -13,6 +13,9 @@ import {View,Text} from '@tarojs/components'
import MySearch from "./MySearch";
import './Header.scss';
import {User} from "@/api/system/user/model";
import {getShopStore, listShopStore} from "@/api/shop/shopStore";
import type {ShopStore} from "@/api/shop/shopStore/model";
import {getSelectedStoreFromStorage, saveSelectedStoreToStorage} from "@/utils/storeSelection";
const Header = (_: any) => {
// 使用新的useShopInfo Hook
@@ -25,8 +28,124 @@ const Header = (_: any) => {
const [stickyStatus, setStickyStatus] = useState<boolean>(false)
const [userInfo] = useState<User>()
// 门店选择:用于首页展示“最近门店”,并在下单时写入订单 storeId
const [storePopupVisible, setStorePopupVisible] = useState(false)
const [stores, setStores] = useState<ShopStore[]>([])
const [selectedStore, setSelectedStore] = useState<ShopStore | null>(getSelectedStoreFromStorage())
const [userLocation, setUserLocation] = useState<{lng: number; lat: number} | null>(null)
const getTenantName = () => {
return userInfo?.tenantName || '商城名称'
return userInfo?.tenantName || TenantName
}
const parseStoreCoords = (s: ShopStore): {lng: number; lat: number} | null => {
const raw = (s.lngAndLat || s.location || '').trim()
if (!raw) return null
const parts = raw.split(/[,\s]+/).filter(Boolean)
if (parts.length < 2) return null
const a = parseFloat(parts[0])
const b = parseFloat(parts[1])
if (Number.isNaN(a) || Number.isNaN(b)) return null
// 常见格式是 "lng,lat";这里做一个简单兜底(经度范围更宽)
const looksLikeLngLat = Math.abs(a) <= 180 && Math.abs(b) <= 90
const looksLikeLatLng = Math.abs(a) <= 90 && Math.abs(b) <= 180
if (looksLikeLngLat) return {lng: a, lat: b}
if (looksLikeLatLng) return {lng: b, lat: a}
return null
}
const distanceMeters = (a: {lng: number; lat: number}, b: {lng: number; lat: number}) => {
const toRad = (x: number) => (x * Math.PI) / 180
const R = 6371000 // meters
const dLat = toRad(b.lat - a.lat)
const dLng = toRad(b.lng - a.lng)
const lat1 = toRad(a.lat)
const lat2 = toRad(b.lat)
const sin1 = Math.sin(dLat / 2)
const sin2 = Math.sin(dLng / 2)
const h = sin1 * sin1 + Math.cos(lat1) * Math.cos(lat2) * sin2 * sin2
return 2 * R * Math.asin(Math.min(1, Math.sqrt(h)))
}
const formatDistance = (meters?: number) => {
if (meters === undefined || Number.isNaN(meters)) return ''
if (meters < 1000) return `${Math.round(meters)}m`
return `${(meters / 1000).toFixed(1)}km`
}
const getStoreDistance = (s: ShopStore) => {
if (!userLocation) return undefined
const coords = parseStoreCoords(s)
if (!coords) return undefined
return distanceMeters(userLocation, coords)
}
const initStoreSelection = async () => {
// 先读取本地已选门店,避免页面首屏抖动
const stored = getSelectedStoreFromStorage()
if (stored?.id) {
setSelectedStore(stored)
}
// 拉取门店列表(失败时允许用户手动重试/继续使用本地门店)
let list: ShopStore[] = []
try {
list = await listShopStore()
} catch (e) {
console.error('获取门店列表失败:', e)
list = []
}
const usable = (list || []).filter(s => s?.isDelete !== 1)
setStores(usable)
// 尝试获取定位,用于计算最近门店
let loc: {lng: number; lat: number} | null = null
try {
const r = await Taro.getLocation({type: 'gcj02'})
loc = {lng: r.longitude, lat: r.latitude}
} catch (e) {
// 不强制定位授权;无定位时仍允许用户手动选择
console.warn('获取定位失败,将不显示最近门店距离:', e)
}
setUserLocation(loc)
const ensureStoreDetail = async (s: ShopStore) => {
if (!s?.id) return s
// 如果后端已经返回默认仓库等字段,就不额外请求
if (s.warehouseId) return s
try {
const full = await getShopStore(s.id)
return full || s
} catch (_e) {
return s
}
}
// 若用户没有选过门店,则自动选择最近门店(或第一个)
const alreadySelected = stored?.id
if (alreadySelected || usable.length === 0) return
let autoPick: ShopStore | undefined
if (loc) {
autoPick = [...usable]
.map(s => {
const coords = parseStoreCoords(s)
const d = coords ? distanceMeters(loc, coords) : undefined
return {s, d}
})
.sort((x, y) => (x.d ?? Number.POSITIVE_INFINITY) - (y.d ?? Number.POSITIVE_INFINITY))[0]?.s
} else {
autoPick = usable[0]
}
if (autoPick?.id) {
const full = await ensureStoreDetail(autoPick)
setSelectedStore(full)
saveSelectedStoreToStorage(full)
}
}
const reload = async () => {
@@ -187,6 +306,7 @@ const Header = (_: any) => {
useEffect(() => {
reload().then()
initStoreSelection().then()
}, [])
return (
@@ -216,31 +336,95 @@ const Header = (_: any) => {
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 ? (
<View style={{display: 'flex', alignItems: 'center'}}>
<Button style={{color: '#ffffff'}} open-type="getPhoneNumber" onGetPhoneNumber={handleGetPhoneNumber}>
<Space>
<Avatar
size="22"
src={getWebsiteLogo()}
/>
<Text style={{color: '#ffffff'}}>{getTenantName()}</Text>
<TriangleDown size={9} className={'text-white'}/>
</Space>
</Button>
</View>
) : (
<View style={{display: 'flex', alignItems: 'center', gap: '8px'}}>
<Avatar
size="22"
src={getWebsiteLogo()}
/>
<Text className={'text-white'}>{getTenantName()}</Text>
<TriangleDown className={'text-white'} size={9}/>
</View>
)}>
<Button
size="small"
fill="none"
style={{color: '#ffffff'}}
open-type="getPhoneNumber"
onGetPhoneNumber={handleGetPhoneNumber}
>
</Button>
) : null
}
>
<Text className={'text-white'}>{getTenantName()}</Text>
</NavBar>
<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>
<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>
</Sticky>
</>
)

View File

@@ -11,13 +11,14 @@ import {
People,
// AfterSaleService,
Logout,
ShoppingAdd,
Shop,
Jdl,
Service
} from '@nutui/icons-react-taro'
import {useUser} from "@/hooks/useUser";
const UserCell = () => {
const {logoutUser} = useUser();
const {logoutUser, hasRole} = useUser();
const onLogout = () => {
Taro.showModal({
@@ -49,10 +50,49 @@ const UserCell = () => {
border: 'none'
} as React.CSSProperties}
>
<Grid.Item text="配送订单" onClick={() => navTo('/rider/index', true)}>
{hasRole('store') && (
<Grid.Item text="门店中心" onClick={() => navTo('/store/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-blue-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Shop color="#3b82f6" size="20"/>
</View>
</View>
</Grid.Item>
)}
{hasRole('rider') && (
<Grid.Item text="配送中心" onClick={() => navTo('/rider/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-blue-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Jdl color="#3b82f6" size="20"/>
</View>
</View>
</Grid.Item>
)}
{(hasRole('staff') || hasRole('admin')) && (
<Grid.Item text="门店订单" onClick={() => navTo('/user/store/orders/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-orange-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Shop color="#f59e0b" size="20"/>
</View>
</View>
</Grid.Item>
)}
<Grid.Item text="收货地址" onClick={() => navTo('/user/address/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-blue-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<ShoppingAdd color="#3b82f6" size="20"/>
<View className="w-12 h-12 bg-emerald-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Location color="#3b82f6" size="20"/>
</View>
</View>
</Grid.Item>
<Grid.Item text={'常见问题'} onClick={() => navTo('/user/help/index')}>
<View className="text-center">
<View className="w-12 h-12 bg-cyan-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Ask className={'text-cyan-500'} size="20"/>
</View>
</View>
</Grid.Item>
@@ -71,14 +111,6 @@ const UserCell = () => {
</Button>
</Grid.Item>
<Grid.Item text="收货地址" onClick={() => navTo('/user/address/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-emerald-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Location color="#3b82f6" size="20"/>
</View>
</View>
</Grid.Item>
<Grid.Item text={'实名认证'} onClick={() => navTo('/user/userVerify/index', true)}>
<View className="text-center">
<View className="w-12 h-12 bg-green-50 rounded-xl flex items-center justify-center mx-auto mb-2">
@@ -111,13 +143,6 @@ const UserCell = () => {
{/* </View>*/}
{/*</Grid.Item>*/}
<Grid.Item text={'常见问题'} onClick={() => navTo('/user/help/index')}>
<View className="text-center">
<View className="w-12 h-12 bg-cyan-50 rounded-xl flex items-center justify-center mx-auto mb-2">
<Ask className={'text-cyan-500'} size="20"/>
</View>
</View>
</Grid.Item>
<Grid.Item text={'关于我们'} onClick={() => navTo('/user/about/index')}>
<View className="text-center">
@@ -189,4 +214,3 @@ const UserCell = () => {
)
}
export default UserCell