feat(fulfillment): 同城运费与路由修复,配送单展示商品用户地址

同城 MANUAL/ZZXFX 按小飞侠价规计费,路由查询回退仓配凭证;HQ 配送单补商品、用户和收货地址。门店核销回跳与小程序核销码一并带上。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-08-25 21:12:36 +08:00
parent 52a7d3789d
commit cc0c0a6ef8
44 changed files with 1029 additions and 218 deletions
@@ -11,10 +11,23 @@ import PackageImagesUpload from './PackageImagesUpload';
type PackageRow = StorePackageItemDto;
export type AdminStorePackagesHandle = {
/** 套餐已加载时写入;加载中则跳过,避免空数据覆盖线上套餐 */
/** 仅在用户改过套餐时写入;加载中或未改动则跳过,避免空表单覆盖刚审核通过的线上套餐 */
saveIfLoaded: (opts?: { quiet?: boolean }) => Promise<{ skipped: boolean }>;
};
function mapLiveRows(live: StorePackagesResponse['live']): PackageRow[] {
return (live ?? []).map((p, i) => {
const imageUrls = normalizeStorePackageImageUrls(p);
return {
...p,
price: String(p.price),
imageUrl: imageUrls[0] ?? '',
imageUrls,
sortOrder: i,
};
});
}
function emptyRow(index = 0): PackageRow {
return {
name: '',
@@ -37,6 +50,7 @@ const AdminStorePackagesSection = forwardRef<AdminStorePackagesHandle, { storeId
const [pendingRequest, setPendingRequest] = useState<StorePackagesResponse['pendingRequest']>(null);
const itemsRef = useRef(items);
const loadingRef = useRef(loading);
const dirtyRef = useRef(false);
const navigate = useNavigate();
useEffect(() => {
@@ -47,36 +61,33 @@ const AdminStorePackagesSection = forwardRef<AdminStorePackagesHandle, { storeId
loadingRef.current = loading;
}, [loading]);
function applyServerPackages(data: StorePackagesResponse) {
dirtyRef.current = false;
setPendingRequest(data.pendingRequest ?? null);
setItems(mapLiveRows(data.live));
}
useEffect(() => {
setLoading(true);
setPendingRequest(null);
dirtyRef.current = false;
request<StorePackagesResponse>(`/admin/stores/${storeId}/packages`)
.then((data) => {
setPendingRequest(data.pendingRequest ?? null);
setItems(
data.live?.length
? data.live.map((p, i) => {
const imageUrls = normalizeStorePackageImageUrls(p);
return {
...p,
price: String(p.price),
imageUrl: imageUrls[0] ?? '',
imageUrls,
sortOrder: i,
};
})
: [],
);
})
.then((data) => applyServerPackages(data))
.catch((e) => message.error(e instanceof Error ? e.message : '加载套餐失败'))
.finally(() => setLoading(false));
}, [storeId]);
// 审核页完成审核后,自动刷新本页「有待审核套餐」提醒
// 审核通过/驳回后刷新提醒;用户未改套餐时同步线上结果,避免抽屉里仍显示空套餐
useEffect(() => {
const onChanged = () => {
request<StorePackagesResponse>(`/admin/stores/${storeId}/packages`)
.then((data) => setPendingRequest(data.pendingRequest ?? null))
.then((data) => {
setPendingRequest(data.pendingRequest ?? null);
if (!dirtyRef.current) {
dirtyRef.current = false;
setItems(mapLiveRows(data.live));
}
})
.catch(() => undefined);
};
window.addEventListener(PACKAGE_AUDIT_CHANGED_EVENT, onChanged);
@@ -108,16 +119,19 @@ const AdminStorePackagesSection = forwardRef<AdminStorePackagesHandle, { storeId
) : null;
function updateAt(index: number, patch: Partial<PackageRow>) {
dirtyRef.current = true;
setItems((prev) => prev.map((item, i) => (i === index ? { ...item, ...patch } : item)));
}
function addRow() {
if (items.length >= STORE_PACKAGE_MAX_COUNT) return;
dirtyRef.current = true;
setItems((prev) => [...prev, emptyRow(prev.length)]);
}
function removeAt(index: number) {
const run = () => {
dirtyRef.current = true;
setItems((prev) => {
const next = prev.filter((_, i) => i !== index).map((item, i) => ({ ...item, sortOrder: i }));
return next.length ? next : [];
@@ -203,20 +217,8 @@ const AdminStorePackagesSection = forwardRef<AdminStorePackagesHandle, { storeId
}),
});
if (!opts?.quiet) message.success('套餐已保存并生效');
setItems(
data.live?.length
? data.live.map((p, i) => {
const imageUrls = normalizeStorePackageImageUrls(p);
return {
...p,
price: String(p.price),
imageUrl: imageUrls[0] ?? '',
imageUrls,
sortOrder: i,
};
})
: [],
);
dirtyRef.current = false;
setItems(mapLiveRows(data.live));
} catch (e) {
if (!opts?.quiet) message.error(e instanceof Error ? e.message : '保存失败');
throw e;
@@ -227,7 +229,7 @@ const AdminStorePackagesSection = forwardRef<AdminStorePackagesHandle, { storeId
useImperativeHandle(ref, () => ({
saveIfLoaded: async (opts) => {
if (loadingRef.current) return { skipped: true };
if (loadingRef.current || !dirtyRef.current) return { skipped: true };
await save(opts);
return { skipped: false };
},
@@ -173,7 +173,9 @@ export default function OrderTrackDrawer({
<Empty
image={Empty.PRESENTED_IMAGE_SIMPLE}
description={
track?.manualQueryUrl
track?.queryError
? track.queryError
: track?.manualQueryUrl
? '暂无实时路由节点,可使用上方物流查询链接'
: '暂无路由信息,请稍后刷新'
}
+12 -2
View File
@@ -20,7 +20,11 @@ import {
AccountBookOutlined,
ProjectOutlined,
} from '@ant-design/icons';
import { hasAnySystemSettingsPermission, hasAnyStoreMenuPermission } from '@dukang/shared-types';
import {
hasAnySystemSettingsPermission,
hasAnyStoreMenuPermission,
HQ_ADMIN_ROLES,
} from '@dukang/shared-types';
import { clearAuth, request, type HqProfile } from '../lib/api';
import { bindAdminEllipsisTitle } from '../lib/ellipsis-title';
import { AUDIT_NOTICE_CHANGED_EVENT, PACKAGE_AUDIT_CHANGED_EVENT } from '../lib/admin-events';
@@ -28,6 +32,10 @@ import { ListColumnPrefsProvider } from '../lib/ListColumnPrefsContext';
const { Header, Sider, Content } = Layout;
const HQ_ROLE_LABELS: Record<string, string> = Object.fromEntries(
HQ_ADMIN_ROLES.map((r) => [r.value, r.label]),
);
type MenuItem = NonNullable<MenuProps['items']>[number];
const MENU_ITEMS: MenuProps['items'] = [
@@ -405,7 +413,9 @@ export default function AdminLayout() {
</Typography.Title>
<Space>
<span>{profile?.name || '—'}</span>
<span style={{ color: '#999' }}>{profile?.adminRole}</span>
<span style={{ color: '#999' }}>
{HQ_ROLE_LABELS[profile?.adminRole ?? ''] || profile?.adminRole || ''}
</span>
<Button type="text" icon={<LogoutOutlined />} onClick={logout}>
退
</Button>
+2
View File
@@ -236,5 +236,7 @@ export type AdminOrderRow = {
providerOrderNo: string | null;
logisticsCompany?: string | null;
manualQueryUrl?: string | null;
/** 当次应付物流费(按瓶当量 × 承运商计价) */
logisticsFee?: number | null;
};
};
+205 -33
View File
@@ -1,16 +1,43 @@
import { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import {
Button, Descriptions, Drawer, Form, Input, Space, Table, Typography, message,
} from 'antd';
import type { ColumnsType } from 'antd/es/table';
import OrderTrackDrawer from '../components/OrderTrackDrawer';
import { request } from '../lib/api';
import { ORDER_STATUS_LABELS, fmtTime } from '../lib/constants';
import {
DELIVERY_PROVIDER_LABELS,
DELIVERY_TYPE_LABELS,
ORDER_STATUS_LABELS,
fmtTime,
} from '../lib/constants';
import { useAdminList } from '../lib/useAdminList';
import { useAdminListColumns } from '../lib/useAdminListColumns';
import { AdminListHeader } from '../components/AdminListHeader';
import { AdminPrimaryLink } from '../components/AdminPrimaryLink';
type DeliveryOrder = {
id: string;
orderNo: string;
status: string;
deliveryType: string;
productName: string;
productSpec?: string | null;
barcode69?: string | null;
quantity: number;
saleUnit?: string;
bottlesPerUnit?: number;
payAmount?: number;
receiverName: string;
receiverPhone: string;
receiverAddress?: string;
receiverProvince?: string;
receiverCity?: string;
receiverDistrict?: string;
user?: { id: string; userNo: string; phone: string | null; nickname: string | null };
imageResource?: { url: string } | null;
};
type Row = {
id: string;
@@ -19,19 +46,34 @@ type Row = {
trackingNo: string | null;
providerOrderNo: string | null;
updatedAt: string;
/** 当次应付物流费 */
logisticsFee?: number | null;
order?: {
id: string;
orderNo: string;
status: string;
receiverName: string;
receiverPhone: string;
deliveryType: string;
};
order?: DeliveryOrder;
};
function formatQty(order?: DeliveryOrder | null) {
if (!order || order.quantity == null) return '—';
const unit = order.saleUnit === 'BOX' ? '箱' : '瓶';
const bottles =
order.saleUnit === 'BOX' && order.bottlesPerUnit && order.bottlesPerUnit > 1
? `${order.quantity * order.bottlesPerUnit}瓶)`
: '';
return `${order.quantity}${unit}${bottles}`;
}
function formatAddress(order?: DeliveryOrder | null) {
if (!order) return '—';
if (order.deliveryType === 'ON_SITE_PICKUP') return '现场取货';
const region = [order.receiverProvince, order.receiverCity, order.receiverDistrict]
.filter(Boolean)
.join('');
const detail = (order.receiverAddress || '').trim();
if (!region) return detail || '—';
if (!detail || detail.startsWith(region)) return detail || region;
return `${region}${detail}`;
}
export default function DeliveriesPage() {
const navigate = useNavigate();
const [form] = Form.useForm();
const [editForm] = Form.useForm();
const [filters, setFilters] = useState<Record<string, string>>({});
@@ -65,25 +107,91 @@ export default function DeliveriesPage() {
setTrackOpen(true);
}
async function openDetail(row: Row) {
const d = await request<Row>(`/admin/deliveries/${row.id}`);
setDetail(d);
editForm.setFieldsValue({
provider: d.provider,
trackingNo: d.trackingNo,
providerOrderNo: d.providerOrderNo,
});
setDrawerOpen(true);
}
const baseColumns: ColumnsType<Row> = [
{
title: '订单号',
dataIndex: ['order', 'orderNo'],
width: 170,
render: (v, row) => (
<AdminPrimaryLink
onClick={async () => {
const d = await request<Row>(`/admin/deliveries/${row.id}`);
setDetail(d);
editForm.setFieldsValue({ provider: d.provider, trackingNo: d.trackingNo, providerOrderNo: d.providerOrderNo });
setDrawerOpen(true);
}}
>
{v}
</AdminPrimaryLink>
<AdminPrimaryLink onClick={() => void openDetail(row)}>{v}</AdminPrimaryLink>
),
},
{ title: 'provider', dataIndex: 'provider', width: 90 },
{
title: '用户',
key: 'user',
width: 140,
render: (_, row) => {
const user = row.order?.user;
if (!user) return '—';
const label = user.userNo || user.phone || '—';
return (
<div>
{user.id ? (
<AdminPrimaryLink
onClick={() => navigate('/users', { state: { openUserId: String(user.id) } })}
>
{label}
</AdminPrimaryLink>
) : (
label
)}
{user.phone && user.userNo ? (
<Typography.Text type="secondary" style={{ display: 'block', fontSize: 12 }}>
{user.phone}
</Typography.Text>
) : null}
</div>
);
},
},
{
title: '商品',
key: 'product',
width: 200,
render: (_, row) => {
const order = row.order;
if (!order?.productName) return '—';
return (
<div>
<span>{order.productName}</span>
{order.productSpec ? (
<Typography.Text type="secondary" style={{ display: 'block', fontSize: 12 }}>
{order.productSpec}
</Typography.Text>
) : null}
</div>
);
},
},
{
title: '数量',
key: 'quantity',
width: 90,
render: (_, row) => formatQty(row.order),
},
{
title: '配送方式',
dataIndex: ['order', 'deliveryType'],
width: 90,
render: (v: string | undefined) => DELIVERY_TYPE_LABELS[v ?? ''] || v || '—',
},
{
title: '承运商',
dataIndex: 'provider',
width: 90,
render: (v: string) => DELIVERY_PROVIDER_LABELS[v] || v || '—',
},
{ title: '运单号', dataIndex: 'trackingNo', width: 140, render: (v) => v || '—' },
{
title: '运费',
@@ -92,20 +200,33 @@ export default function DeliveriesPage() {
render: (v: number | null | undefined) => (v == null ? '—' : `¥${Number(v).toFixed(2)}`),
},
{ title: '第三方单号', dataIndex: 'providerOrderNo', width: 140, render: (v) => v || '—' },
{ title: '订单状态', dataIndex: ['order', 'status'], width: 100, render: (s) => ORDER_STATUS_LABELS[s] || s },
{
title: '订单状态',
dataIndex: ['order', 'status'],
width: 100,
render: (s) => ORDER_STATUS_LABELS[s] || s,
},
{ title: '收货人', dataIndex: ['order', 'receiverName'], width: 90 },
{
title: '收货电话',
dataIndex: ['order', 'receiverPhone'],
width: 120,
render: (v) => v || '—',
},
{
title: '配送地址',
key: 'address',
width: 280,
ellipsis: true,
render: (_, row) => formatAddress(row.order),
},
{ title: '更新', dataIndex: 'updatedAt', width: 160, render: fmtTime },
{
title: '操作', width: 140,
render: (_, row) => (
<Space size={0}>
<Button type="link" size="small" onClick={() => openTrack(row)}></Button>
<Button type="link" size="small" onClick={async () => {
const d = await request<Row>(`/admin/deliveries/${row.id}`);
setDetail(d);
editForm.setFieldsValue({ provider: d.provider, trackingNo: d.trackingNo, providerOrderNo: d.providerOrderNo });
setDrawerOpen(true);
}}></Button>
<Button type="link" size="small" onClick={() => void openDetail(row)}></Button>
</Space>
),
},
@@ -113,19 +234,21 @@ export default function DeliveriesPage() {
const { columns, settingsButton, settingsModal } = useAdminListColumns('deliveries', baseColumns, { page, pageSize });
const order = detail?.order;
return (
<div>
{settingsModal}
<AdminListHeader title="快递/配送单" settings={settingsButton} />
<Form form={form} layout="inline" style={{ marginBottom: 16 }} onFinish={(v) => { setFilters(v); setPage(1); }}>
<Form.Item name="orderNo" label="订单号"><Input allowClear /></Form.Item>
<Form.Item name="provider" label="provider"><Input allowClear placeholder="MOCK" /></Form.Item>
<Form.Item name="provider" label="承运商"><Input allowClear placeholder="XFX" /></Form.Item>
<Form.Item name="trackingNo" label="运单号"><Input allowClear /></Form.Item>
<Form.Item><Button type="primary" htmlType="submit"></Button></Form.Item>
</Form>
<Table rowKey="id" loading={loading} columns={columns} dataSource={data?.items ?? []} scroll={{ x: 'max-content' }}
pagination={{ current: page, pageSize, total: data?.total ?? 0, showSizeChanger: true, onChange: (p, ps) => { setPage(p); setPageSize(ps); } }} />
<Drawer title="配送单编辑" width={480} open={drawerOpen} onClose={() => setDrawerOpen(false)}
<Drawer title="配送单编辑" width={560} open={drawerOpen} onClose={() => setDrawerOpen(false)}
extra={
<Space>
<Button onClick={() => setDrawerOpen(false)}></Button>
@@ -142,14 +265,63 @@ export default function DeliveriesPage() {
{detail && (
<>
<Descriptions column={1} bordered size="small" style={{ marginBottom: 16 }}>
<Descriptions.Item label="订单">{detail.order?.orderNo}</Descriptions.Item>
<Descriptions.Item label="收货">{detail.order?.receiverName} {detail.order?.receiverPhone}</Descriptions.Item>
<Descriptions.Item label="订单">{order?.orderNo || '—'}</Descriptions.Item>
<Descriptions.Item label="用户">
{order?.user ? (
<Space size={8} wrap>
{order.user.id ? (
<AdminPrimaryLink
onClick={() => navigate('/users', { state: { openUserId: String(order.user!.id) } })}
>
{order.user.userNo}
</AdminPrimaryLink>
) : (
order.user.userNo || '—'
)}
<Typography.Text type="secondary">
{[order.user.nickname, order.user.phone].filter(Boolean).join(' / ') || ''}
</Typography.Text>
</Space>
) : '—'}
</Descriptions.Item>
<Descriptions.Item label="商品">
<Space align="start">
{order?.imageResource?.url ? (
<img
src={order.imageResource.url}
alt=""
style={{ width: 48, height: 48, objectFit: 'cover', borderRadius: 4 }}
/>
) : null}
<span>
{order?.productName || '—'}
{order?.productSpec ? (
<Typography.Text type="secondary" style={{ display: 'block', fontSize: 12 }}>
{order.productSpec}
</Typography.Text>
) : null}
{order?.barcode69 ? (
<Typography.Text type="secondary" style={{ display: 'block', fontSize: 12 }}>
{order.barcode69}
</Typography.Text>
) : null}
</span>
</Space>
</Descriptions.Item>
<Descriptions.Item label="数量">{formatQty(order)}</Descriptions.Item>
<Descriptions.Item label="配送方式">
{DELIVERY_TYPE_LABELS[order?.deliveryType ?? ''] || order?.deliveryType || '—'}
</Descriptions.Item>
<Descriptions.Item label="收货人">
{[order?.receiverName, order?.receiverPhone].filter(Boolean).join(' ') || '—'}
</Descriptions.Item>
<Descriptions.Item label="配送地址">{formatAddress(order)}</Descriptions.Item>
<Descriptions.Item label="运费">
{detail.logisticsFee == null ? '—' : `¥${Number(detail.logisticsFee).toFixed(2)}`}
</Descriptions.Item>
</Descriptions>
<Form form={editForm} layout="vertical">
<Form.Item name="provider" label="provider" rules={[{ required: true }]}><Input /></Form.Item>
<Form.Item name="provider" label="承运商" rules={[{ required: true }]}><Input /></Form.Item>
<Form.Item name="providerOrderNo" label="第三方单号"><Input /></Form.Item>
<Form.Item name="trackingNo" label="运单号"><Input /></Form.Item>
</Form>
+12
View File
@@ -674,6 +674,13 @@ export default function OrdersPage() {
width: 90,
render: (v: number) => `¥${v}`,
},
{
title: '运费',
key: 'logisticsFee',
width: 90,
render: (_, row) =>
row.delivery?.logisticsFee == null ? '—' : `¥${Number(row.delivery.logisticsFee).toFixed(2)}`,
},
{
title: '好客权益',
width: 200,
@@ -1158,6 +1165,11 @@ export default function OrdersPage() {
</Descriptions.Item>
<Descriptions.Item label="运单号">{detail.delivery.trackingNo || '—'}</Descriptions.Item>
<Descriptions.Item label="三方单号">{detail.delivery.providerOrderNo || '—'}</Descriptions.Item>
<Descriptions.Item label="运费">
{detail.delivery.logisticsFee == null
? '—'
: `¥${Number(detail.delivery.logisticsFee).toFixed(2)}`}
</Descriptions.Item>
{detail.delivery.manualQueryUrl && (
<Descriptions.Item label="查询链接">
<a href={detail.delivery.manualQueryUrl} target="_blank" rel="noreferrer">
+5 -1
View File
@@ -1,6 +1,7 @@
import { Navigate, useLocation } from 'react-router-dom';
import { getStoreProfile, hasShopWxSession } from '../lib/api';
import { useStoreSession } from '../contexts/StoreSessionContext';
import { peekShopReturnTo, rememberShopReturnPath } from '../lib/shop-redeem-return';
const PUBLIC_PATHS = new Set(['/login', '/legal/user-agreement', '/legal/privacy-policy']);
const SELECT_STORE_PATH = '/select-store';
@@ -18,14 +19,17 @@ export default function AuthGate({ children }: { children: React.ReactNode }) {
}
if (authenticated && location.pathname === '/login') {
return <Navigate to={needsSelectStore ? SELECT_STORE_PATH : '/'} replace />;
const next = needsSelectStore ? SELECT_STORE_PATH : (peekShopReturnTo() || '/');
return <Navigate to={next} replace />;
}
if (authenticated && needsSelectStore && location.pathname !== SELECT_STORE_PATH) {
rememberShopReturnPath(location);
return <Navigate to={SELECT_STORE_PATH} replace />;
}
if (!authenticated && !PUBLIC_PATHS.has(location.pathname)) {
rememberShopReturnPath(location);
const profile = getStoreProfile();
if (profile && hasShopWxSession() && location.pathname !== '/login') {
return <Navigate to="/login?quick=1" replace state={{ from: location }} />;
+1 -22
View File
@@ -1,22 +1 @@
/** 从微信扫码结果解析核销 token32 位 hex 或带 token 参数的 URL */
export function parseRedeemTokenFromScan(raw: string): string | null {
const trimmed = raw.trim();
if (!trimmed) return null;
if (/^[a-f0-9]{32}$/i.test(trimmed)) {
return trimmed.toLowerCase();
}
try {
const url = trimmed.startsWith('http') ? new URL(trimmed) : new URL(trimmed, 'https://local.invalid');
const fromQuery = url.searchParams.get('token');
if (fromQuery && /^[a-f0-9]{32}$/i.test(fromQuery)) {
return fromQuery.toLowerCase();
}
} catch {
/* not a URL */
}
const hexMatch = trimmed.match(/[a-f0-9]{32}/i);
return hexMatch ? hexMatch[0].toLowerCase() : null;
}
export { parseRedeemTokenFromScan } from '@dukang/shared-types';
+14
View File
@@ -0,0 +1,14 @@
import { hardNavigateInWechat, shouldHardNavigateForJssdk } from '@dukang/weixin-sdk';
/** iOS 微信内用整页跳转,避免 JSSDK 入场 URL 与 SPA 路径不一致 */
export function goShopPath(
path: string,
navigate: (path: string, opts?: { replace?: boolean }) => void,
opts?: { replace?: boolean },
): void {
if (shouldHardNavigateForJssdk()) {
hardNavigateInWechat(path);
return;
}
navigate(path, { replace: opts?.replace ?? true });
}
@@ -0,0 +1,45 @@
/** 扫核销码落地 /redeem?token= 后未登录或需选店,记下回跳路径(OAuth 整页跳转会丢掉 location.state */
export const SHOP_REDEEM_RETURN_KEY = 'shop_redeem_return';
function isRedeemReturnPath(path: string): boolean {
if (!path.startsWith('/redeem')) return false;
if (path.startsWith('/redeem/')) return false;
try {
const url = new URL(path, 'https://local.invalid');
return !!url.searchParams.get('token')?.trim();
} catch {
return false;
}
}
export function rememberShopReturnTo(path: string): void {
if (!isRedeemReturnPath(path)) return;
try {
sessionStorage.setItem(SHOP_REDEEM_RETURN_KEY, path);
} catch {
/* ignore */
}
}
export function rememberShopReturnPath(location: { pathname: string; search: string }): void {
rememberShopReturnTo(`${location.pathname}${location.search}`);
}
export function peekShopReturnTo(): string | null {
try {
const path = sessionStorage.getItem(SHOP_REDEEM_RETURN_KEY);
return path && isRedeemReturnPath(path) ? path : null;
} catch {
return null;
}
}
export function consumeShopReturnTo(): string | null {
const path = peekShopReturnTo();
try {
sessionStorage.removeItem(SHOP_REDEEM_RETURN_KEY);
} catch {
/* ignore */
}
return path;
}
@@ -3,6 +3,7 @@ import { useNavigate, useSearchParams } from 'react-router-dom';
import WeakNetFallbackPanel from '../components/WeakNetFallbackPanel';
import { request } from '../lib/api';
import { reportRedeemFailure } from '../lib/redeem-failure';
import { consumeShopReturnTo } from '../lib/shop-redeem-return';
import { toastError } from '../lib/toast';
import { useStorePageView } from '../lib/usePageView';
@@ -47,6 +48,7 @@ export default function RedeemConfirmPage() {
navigate('/', { replace: true });
return;
}
consumeShopReturnTo();
setToken(scanned);
}, [searchParams, navigate]);
+6 -3
View File
@@ -1,5 +1,6 @@
import { useEffect, useMemo } from 'react';
import { useLocation, useNavigate } from 'react-router-dom';
import { goShopPath } from '../lib/shop-nav';
import { notifyRedeemSuccess } from '../lib/useRedeemSuccessBus';
import { formatMoney, toMoneyNumber } from '../lib/money';
@@ -35,10 +36,12 @@ export default function RedeemSuccessPage() {
});
}, [redeemNo, amount]);
const goHome = () => goShopPath('/', navigate, { replace: true });
return (
<div className="shop-success-page">
<header className="shop-success-header">
<button type="button" className="shop-redeem-back" onClick={() => navigate('/')} aria-label="返回">
<button type="button" className="shop-redeem-back" onClick={goHome} aria-label="返回">
<span className="material-symbols-outlined">arrow_back</span>
</button>
<h1 className="app-page-title"></h1>
@@ -85,11 +88,11 @@ export default function RedeemSuccessPage() {
</div>
<div className="shop-success-actions">
<button type="button" className="shop-success-primary-btn" onClick={() => navigate('/')}>
<button type="button" className="shop-success-primary-btn" onClick={goHome}>
<span></span>
<span className="material-symbols-outlined" style={{ fontSize: 20 }}>qr_code_scanner</span>
</button>
<button type="button" className="shop-success-outline-btn" onClick={() => navigate('/')}>
<button type="button" className="shop-success-outline-btn" onClick={goHome}>
<span></span>
<span className="material-symbols-outlined" style={{ fontSize: 20 }}>home</span>
</button>
+10 -15
View File
@@ -1,7 +1,6 @@
import { useCallback, useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
import PullToRefresh from '@dukang/shared-ui/PullToRefresh';
import { hardNavigateInWechat, shouldHardNavigateForJssdk } from '@dukang/weixin-sdk';
import { useStoreSession } from '../contexts/StoreSessionContext';
import {
needsStoreSelection,
@@ -10,13 +9,11 @@ import {
type ShopSessionPayload,
type ShopStoreOption,
} from '../lib/api';
import { goShopPath } from '../lib/shop-nav';
import { consumeShopReturnTo, peekShopReturnTo } from '../lib/shop-redeem-return';
function goShopHome(navigate: (path: string, opts?: { replace?: boolean }) => void) {
if (shouldHardNavigateForJssdk()) {
hardNavigateInWechat('/');
return;
}
navigate('/', { replace: true });
function goAfterSelectStore(navigate: (path: string, opts?: { replace?: boolean }) => void) {
goShopPath(consumeShopReturnTo() || '/', navigate);
}
export default function SelectStorePage() {
@@ -46,7 +43,7 @@ export default function SelectStorePage() {
async function onSelect(storeId: string) {
if (loadingId) return;
if (storeId === currentStoreId) {
goShopHome(navigate);
goAfterSelectStore(navigate);
return;
}
setLoadingId(storeId);
@@ -54,7 +51,7 @@ export default function SelectStorePage() {
try {
const session = await selectStore(storeId);
applySession(session);
goShopHome(navigate);
goAfterSelectStore(navigate);
} catch (e) {
setMsg(e instanceof Error ? e.message : '选店失败');
} finally {
@@ -170,16 +167,14 @@ export default function SelectStorePage() {
);
}
/** After login/wechat: route to select-store or home */
/** After login/wechat: route to select-store, redeem return, or home */
export function routeAfterShopLogin(
session: ShopSessionPayload,
navigate: (path: string, opts?: { replace?: boolean }) => void,
) {
const path = needsStoreSelection(session) ? '/select-store' : '/';
// iOS 微信:必须整页跳转,让业务页成为 JSSDK 新入场 URL,否则扫码验签必挂
if (shouldHardNavigateForJssdk()) {
hardNavigateInWechat(path);
if (needsStoreSelection(session)) {
goShopPath('/select-store', navigate);
return;
}
navigate(path, { replace: true });
goShopPath(peekShopReturnTo() || '/', navigate);
}
@@ -10,10 +10,11 @@ import {
const CANVAS_ID = 'redeem-qr-canvas';
type RedeemQrCodeProps = {
token: string;
/** 二维码内容:门店 H5 落地 URL,缺省回退 token */
payload: string;
};
function drawOnWeappCanvas(token: string) {
function drawOnWeappCanvas(payload: string) {
const page = Taro.getCurrentInstance().page;
const query = page ? Taro.createSelectorQuery().in(page) : Taro.createSelectorQuery();
query
@@ -33,33 +34,33 @@ function drawOnWeappCanvas(token: string) {
canvas.width = layoutW * dpr;
canvas.height = layoutH * dpr;
ctx.scale(dpr, dpr);
drawRedeemQrOnCanvas(ctx, token, drawSize);
drawRedeemQrOnCanvas(ctx, payload, drawSize);
});
}
export default function RedeemQrCode({ token }: RedeemQrCodeProps) {
export default function RedeemQrCode({ payload }: RedeemQrCodeProps) {
const [imgSrc, setImgSrc] = useState('');
const isWeapp = process.env.TARO_ENV === 'weapp';
useEffect(() => {
if (!token) {
if (!payload) {
setImgSrc('');
return;
}
if (isWeapp) {
const timer = setTimeout(() => drawOnWeappCanvas(token), 120);
const timer = setTimeout(() => drawOnWeappCanvas(payload), 120);
return () => clearTimeout(timer);
}
let cancelled = false;
void buildRedeemQrDataUrl(token).then((url) => {
void buildRedeemQrDataUrl(payload).then((url) => {
if (!cancelled) setImgSrc(url);
});
return () => {
cancelled = true;
};
}, [token, isWeapp]);
}, [payload, isWeapp]);
return (
<View className="redeem-qr-box">
+8
View File
@@ -3,6 +3,7 @@ import {
BRAND_LOGO_URL,
BRAND_LOGO_WIDE_URL,
CUSTOMER_SERVICE_PHONE,
CUSTOMER_SERVICE_WECOM_URL,
QUALIFICATION_DISCLOSURE_URL,
type ClientRuntimeConfig,
} from '@dukang/shared-types';
@@ -14,6 +15,8 @@ export type BrandAssets = {
brandLogoMarkUrl: string;
qualificationDisclosureUrl: string;
customerServicePhone: string;
customerServiceWecomUrl: string;
wecomCorpId: string;
};
const FALLBACK: BrandAssets = {
@@ -22,6 +25,8 @@ const FALLBACK: BrandAssets = {
brandLogoMarkUrl: BRAND_LOGO_MARK_URL,
qualificationDisclosureUrl: QUALIFICATION_DISCLOSURE_URL,
customerServicePhone: CUSTOMER_SERVICE_PHONE,
customerServiceWecomUrl: CUSTOMER_SERVICE_WECOM_URL,
wecomCorpId: '',
};
let cached: BrandAssets | null = null;
@@ -35,6 +40,9 @@ function fromConfig(config: ClientRuntimeConfig | null | undefined): BrandAssets
qualificationDisclosureUrl:
config?.qualificationDisclosureUrl?.trim() || FALLBACK.qualificationDisclosureUrl,
customerServicePhone: config?.customerServicePhone?.trim() || FALLBACK.customerServicePhone,
customerServiceWecomUrl:
config?.customerServiceWecomUrl?.trim() || FALLBACK.customerServiceWecomUrl,
wecomCorpId: config?.wecomCorpId?.trim() || FALLBACK.wecomCorpId,
};
}
+6 -6
View File
@@ -8,13 +8,13 @@ const QR_OPTIONS = {
color: { dark: '#1f1a17', light: '#ffffff' },
} as const;
/** 在 2d Canvas 上绘制二维码(小程序 / H5 通用) */
/** 在 2d Canvas 上绘制二维码(小程序 / H5 通用payload 为落地 URL 或纯 token */
export function drawRedeemQrOnCanvas(
ctx: CanvasRenderingContext2D,
token: string,
payload: string,
sizePx = QR_SIZE,
) {
const qr = QRCode.create(token, { errorCorrectionLevel: 'M' });
const qr = QRCode.create(payload, { errorCorrectionLevel: 'M' });
const count = qr.modules.size;
const cell = sizePx / count;
@@ -31,11 +31,11 @@ export function drawRedeemQrOnCanvas(
}
/** H5Data URL;失败时回退到与 h5-user 相同的外部 QR 服务 */
export async function buildRedeemQrDataUrl(token: string): Promise<string> {
export async function buildRedeemQrDataUrl(payload: string): Promise<string> {
try {
return await QRCode.toDataURL(token, QR_OPTIONS);
return await QRCode.toDataURL(payload, QR_OPTIONS);
} catch {
return `https://api.qrserver.com/v1/create-qr-code/?size=${QR_SIZE * 2}x${QR_SIZE * 2}&data=${encodeURIComponent(token)}`;
return `https://api.qrserver.com/v1/create-qr-code/?size=${QR_SIZE * 2}x${QR_SIZE * 2}&data=${encodeURIComponent(payload)}`;
}
}
@@ -39,6 +39,10 @@ export default function RedeemCodePage() {
const router = useRouter();
const token = decodeURIComponent(router.params.token ?? '');
const amount = Number(router.params.amount ?? 0);
const landingUrl = router.params.landingUrl
? decodeURIComponent(router.params.landingUrl)
: '';
const qrPayload = landingUrl || token;
const [timerSec, setTimerSec] = useState(REDEEM_TOKEN_TTL_SECONDS);
const timerRef = useRef<ReturnType<typeof setInterval> | null>(null);
@@ -148,7 +152,7 @@ export default function RedeemCodePage() {
<View className="redeem-code-panel">
<Text className="redeem-code-head"></Text>
<View className="redeem-qr-wrap">
<RedeemQrCode token={token} />
<RedeemQrCode payload={qrPayload} />
</View>
<View className={`redeem-timer${timerSec > 0 && timerSec < REDEEM_TOKEN_TTL_SECONDS ? ' redeem-timer--active' : ''}`}>
<Text className="redeem-timer-value">{formatTimer(timerSec)}</Text>
+5 -2
View File
@@ -113,12 +113,15 @@ export default function RedeemPage() {
const body: { amount: number; couponId?: string } = { amount: value };
if (couponId) body.couponId = couponId;
const data = await request<{ token: string; amount: number }>('/redeem/tokens', {
const data = await request<{ token: string; amount: number; landingUrl?: string }>('/redeem/tokens', {
method: 'POST',
data: body,
});
const landingQs = data.landingUrl
? `&landingUrl=${encodeURIComponent(data.landingUrl)}`
: '';
Taro.navigateTo({
url: `/pages/redeem-code/index?token=${encodeURIComponent(data.token)}&amount=${data.amount}`,
url: `/pages/redeem-code/index?token=${encodeURIComponent(data.token)}&amount=${data.amount}${landingQs}`,
});
} catch (e) {
toast(e instanceof Error ? e.message : '生成失败');