h5微信授权

apps/mini-user/src/pages/order-detail/index.tsx

@@ -1,9 +1,16 @@
-import { useEffect, useState } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { View, Text } from '@tarojs/components';
-import { useRouter } from '@tarojs/taro';
+import { useRouter, useShareAppMessage, useShareTimeline } from '@tarojs/taro';
 import PageShell from '../../components/PageShell';
 import SubPageHeader from '../../components/SubPageHeader';
+import ShareNavButton from '../../components/ShareNavButton';
+import WechatShareReady from '../../components/WechatShareReady';
 import { request, toast } from '../../lib/api';
+import {
+  DEFAULT_SHARE_DESC,
+  DEFAULT_SHARE_TITLE,
+  toWeappShareMessage,
+} from '../../lib/wechat-share';
 
 type OrderDetail = {
   id: string;
@@ -28,9 +35,30 @@ export default function OrderDetailPage() {
       .catch((e) => toast(e instanceof Error ? e.message : '加载失败'));
   }, [orderId]);
 
+  const sharePayload = useMemo(
+    () => ({
+      title: order?.productName
+        ? `我买了${order.productName} · 杜康好客`
+        : DEFAULT_SHARE_TITLE,
+      desc: DEFAULT_SHARE_DESC,
+      path: orderId ? `/pages/order-detail/index?id=${orderId}` : '/pages/home/index',
+    }),
+    [order, orderId],
+  );
+
+  useShareAppMessage(() => toWeappShareMessage(sharePayload));
+  useShareTimeline(() => ({
+    title: sharePayload.title || DEFAULT_SHARE_TITLE,
+    query: orderId ? `id=${orderId}` : '',
+  }));
+
   return (
     <PageShell variant="sub" className="order-detail-page">
-      <SubPageHeader title="订单详情" />
+      <WechatShareReady payload={sharePayload} />
+      <SubPageHeader
+        title="订单详情"
+        right={<ShareNavButton payload={sharePayload} />}
+      />
       <View className="sub-page-body">
         {!order ? (
           <View className="u-empty">加载中…</View>