feat: 优化名片分享海报与详情交互

- 为律师详情页增加分享海报生成与分享封面图

- 新增律所简介入口并调整个人简介为页面整体滚动

frontend_miniprogram/miniprogram/pages/lawyer-detail/index.less

@@ -175,12 +175,6 @@
   white-space: pre-wrap;
 }
 
-.bio-scroll {
-  height: 360rpx;
-  box-sizing: border-box;
-  padding-right: 8rpx;
-}
-
 .firm-mini-card {
   background: #fff;
   padding: var(--spacing-md);
@@ -232,6 +226,16 @@
   height: 160rpx;
 }
 
+.share-poster-canvas {
+  position: fixed;
+  left: -9999px;
+  top: -9999px;
+  width: 500px;
+  height: 400px;
+  opacity: 0;
+  pointer-events: none;
+}
+
 .not-found-action {
   padding: var(--spacing-lg);
   text-align: center;

frontend_miniprogram/miniprogram/pages/lawyer-detail/index.ts

@@ -1,7 +1,38 @@
-import { getLawyerDetail, recordCardShare } from '../../api/open';
-import type { FirmInfo } from '../../types/card';
-import type { Lawyer } from '../../types/card';
+import { getFirmProfile, getLawyerDetail, recordCardShare } from '../../api/open';
+import type { FirmInfo, Lawyer } from '../../types/card';
 import { appendCardViewRecord } from '../../utils/history';
+import { generateSharePoster, SHARE_POSTER_CANVAS_ID } from '../../utils/share-poster';
+
+interface DetailPageData {
+  firm: FirmInfo;
+  lawyer: Lawyer | null;
+  notFound: boolean;
+  specialtiesText: string;
+  detailBgStyle: string;
+  loading: boolean;
+  sharePosterPath: string;
+}
+
+interface DetailPageCustom {
+  handleDockAction(event: WechatMiniprogram.CustomEvent<{ action: string }>): void;
+  saveContact(): void;
+  callPhone(): void;
+  navigateOffice(): void;
+  previewWechatQr(): void;
+  goFirmProfile(): void;
+  goLawyerList(): void;
+  getSharePosterCanvas(): Promise<WechatMiniprogram.Canvas>;
+  loadFirmForShare(): Promise<FirmInfo>;
+  prepareSharePoster(): void;
+  ensureSharePoster(): Promise<string>;
+}
+
+type DetailPageInstance = WechatMiniprogram.Page.Instance<DetailPageData, DetailPageCustom>;
+
+const sharePosterPromiseMap = new WeakMap<DetailPageInstance, Promise<string>>();
+const shareFirmPromiseMap = new WeakMap<DetailPageInstance, Promise<FirmInfo>>();
+const shareCanvasPromiseMap = new WeakMap<DetailPageInstance, Promise<WechatMiniprogram.Canvas>>();
+const pageReadyMap = new WeakMap<DetailPageInstance, boolean>();
 
 function createEmptyFirm(): FirmInfo {
   return {
@@ -29,29 +60,24 @@ function buildDetailBgStyle(coverImage?: string): string {
   return `background-image: url("${cover}"); background-size: cover; background-position: center;`;
 }
 
-function shouldUseBioScroll(bio?: string): boolean {
-  const text = typeof bio === 'string' ? bio.trim() : '';
-  return text.length > 180;
-}
-
-Page({
+Page<DetailPageData, DetailPageCustom>({
   data: {
     firm: createEmptyFirm(),
-    lawyer: null as Lawyer | null,
+    lawyer: null,
     notFound: false,
     specialtiesText: '',
     detailBgStyle: '',
-    bioScrollable: false,
     loading: false,
+    sharePosterPath: '',
   },
 
-  async onLoad(options: Record<string, string | undefined>) {
+  async onLoad(options) {
     const lawyerId = typeof options.id === 'string' ? options.id : '';
     const sourceType = typeof options.sourceType === 'string' ? options.sourceType : 'DIRECT';
     const shareFromCardId = typeof options.shareFromCardId === 'string' ? options.shareFromCardId : '';
 
     if (!lawyerId) {
-      this.setData({ notFound: true, specialtiesText: '', detailBgStyle: '', bioScrollable: false });
+      this.setData({ notFound: true, specialtiesText: '', detailBgStyle: '' });
       return;
     }
 
@@ -64,13 +90,13 @@ Page({
         notFound: false,
         specialtiesText: payload.lawyer.specialties.join('；'),
         detailBgStyle: buildDetailBgStyle(payload.lawyer.coverImage),
-        bioScrollable: shouldUseBioScroll(payload.lawyer.bio),
       });
       appendCardViewRecord(payload.lawyer);
       wx.showShareMenu({ menus: ['shareAppMessage'] });
+      this.prepareSharePoster();
     } catch (error) {
       const message = error instanceof Error ? error.message : '律师信息不存在';
-      this.setData({ notFound: true, specialtiesText: '', detailBgStyle: '', bioScrollable: false });
+      this.setData({ notFound: true, specialtiesText: '', detailBgStyle: '' });
       wx.showToast({
         title: message,
         icon: 'none',
@@ -80,9 +106,24 @@ Page({
     }
   },
 
-  handleDockAction(event: WechatMiniprogram.CustomEvent<{ action: string }>) {
+  onReady() {
+    pageReadyMap.set(this, true);
+    this.prepareSharePoster();
+  },
+
+  onUnload() {
+    pageReadyMap.delete(this);
+    sharePosterPromiseMap.delete(this);
+    shareFirmPromiseMap.delete(this);
+    shareCanvasPromiseMap.delete(this);
+  },
+
+  handleDockAction(event) {
     const action = event.detail.action;
     switch (action) {
+      case 'home':
+        this.goFirmProfile();
+        break;
       case 'save':
         this.saveContact();
         break;
@@ -137,6 +178,7 @@ Page({
       wx.showToast({ title: '暂未配置地图位置', icon: 'none' });
       return;
     }
+
     wx.openLocation({
       latitude: this.data.firm.hqLatitude,
       longitude: this.data.firm.hqLongitude,
@@ -155,21 +197,166 @@ Page({
       wx.showToast({ title: '二维码未配置', icon: 'none' });
       return;
     }
+
     wx.previewImage({
       current: url,
       urls: [url],
     });
   },
 
+  goFirmProfile() {
+    wx.navigateTo({ url: '/pages/firm/index' });
+  },
+
   goLawyerList() {
     wx.navigateTo({ url: '/pages/lawyer-list/index' });
   },
 
-  onShareAppMessage() {
+  async getSharePosterCanvas() {
+    const cachedPromise = shareCanvasPromiseMap.get(this);
+    if (cachedPromise) {
+      return cachedPromise;
+    }
+
+    const canvasPromise = new Promise<WechatMiniprogram.Canvas>((resolve, reject) => {
+      const query = wx.createSelectorQuery();
+      query
+        .in(this)
+        .select(`#${SHARE_POSTER_CANVAS_ID}`)
+        .node((result) => {
+          const canvas = result && 'node' in result ? (result.node as WechatMiniprogram.Canvas | undefined) : undefined;
+          if (canvas) {
+            resolve(canvas);
+            return;
+          }
+          reject(new Error('分享海报画布未就绪'));
+        })
+        .exec();
+    }).then(
+      (canvas) => {
+        shareCanvasPromiseMap.delete(this);
+        return canvas;
+      },
+      (error: unknown) => {
+        shareCanvasPromiseMap.delete(this);
+        throw error;
+      }
+    );
+
+    shareCanvasPromiseMap.set(this, canvasPromise);
+    return canvasPromise;
+  },
+
+  async loadFirmForShare() {
+    const cachedPromise = shareFirmPromiseMap.get(this);
+    if (cachedPromise) {
+      return cachedPromise;
+    }
+
+    const currentFirm = this.data.firm;
+    if (currentFirm.logo) {
+      return currentFirm;
+    }
+
+    const firmPromise = getFirmProfile()
+      .then((firmProfile) => ({
+        ...currentFirm,
+        ...firmProfile,
+        name: firmProfile.name || currentFirm.name,
+        hqAddress: currentFirm.hqAddress || firmProfile.hqAddress,
+      }))
+      .catch(() => currentFirm);
+
+    const firmPromiseWithCleanup = firmPromise.then(
+      (result) => {
+        shareFirmPromiseMap.delete(this);
+        return result;
+      },
+      (error: unknown) => {
+        shareFirmPromiseMap.delete(this);
+        throw error;
+      }
+    );
+
+    shareFirmPromiseMap.set(this, firmPromiseWithCleanup);
+    return firmPromiseWithCleanup;
+  },
+
+  prepareSharePoster() {
+    if (!pageReadyMap.get(this) || !this.data.lawyer || this.data.notFound) {
+      return;
+    }
+
+    this.ensureSharePoster().catch(() => {
+      // 海报生成失败时使用默认头像兜底
+    });
+  },
+
+  async ensureSharePoster() {
+    if (this.data.sharePosterPath) {
+      return this.data.sharePosterPath;
+    }
+
+    const currentPromise = sharePosterPromiseMap.get(this);
+    if (currentPromise) {
+      return currentPromise;
+    }
+
     const lawyer = this.data.lawyer;
+    if (!lawyer) {
+      throw new Error('名片数据未就绪');
+    }
+
+    const posterPromise = this.loadFirmForShare()
+      .then((firm) =>
+        this.getSharePosterCanvas().then((canvas) =>
+        generateSharePoster({
+          canvas,
+          firm: {
+            name: firm.name,
+            logo: firm.logo,
+            hqAddress: firm.hqAddress,
+          },
+          lawyer: {
+            name: lawyer.name,
+            title: lawyer.title,
+            office: lawyer.office,
+            phone: lawyer.phone,
+            email: lawyer.email,
+            address: lawyer.address,
+            avatar: lawyer.avatar,
+          },
+        })
+        )
+      )
+      .then((posterPath) => {
+        if (posterPath) {
+          this.setData({ sharePosterPath: posterPath });
+        }
+        return posterPath;
+      });
+
+    const posterPromiseWithCleanup = posterPromise.then(
+      (result) => {
+        sharePosterPromiseMap.delete(this);
+        return result;
+      },
+      (error: unknown) => {
+        sharePosterPromiseMap.delete(this);
+        throw error;
+      }
+    );
+
+    sharePosterPromiseMap.set(this, posterPromiseWithCleanup);
+    return posterPromiseWithCleanup;
+  },
+
+  onShareAppMessage() {
+    const lawyer = this.data.lawyer;
+    const firmName = this.data.firm.name || '电子名片';
     if (!lawyer) {
       return {
-        title: `${this.data.firm.name || '电子名片'}电子名片`,
+        title: firmName,
         path: '/pages/firm/index',
       };
     }
@@ -179,10 +366,33 @@ Page({
       // 分享埋点失败不阻断分享动作
     });
 
+    const title = firmName;
+    const fallbackImage = lawyer.avatar;
+    if (this.data.sharePosterPath) {
+      return {
+        title,
+        path: sharePath,
+        imageUrl: this.data.sharePosterPath,
+      };
+    }
+
+    const promise = this.ensureSharePoster()
+      .then((posterPath) => ({
+        title,
+        path: sharePath,
+        imageUrl: posterPath || fallbackImage,
+      }))
+      .catch(() => ({
+        title,
+        path: sharePath,
+        imageUrl: fallbackImage,
+      }));
+
     return {
-      title: `${lawyer.name}律师电子名片`,
+      title,
       path: sharePath,
-      imageUrl: lawyer.avatar,
+      imageUrl: fallbackImage,
+      promise,
     };
   },
 });

frontend_miniprogram/miniprogram/pages/lawyer-detail/index.wxml

@@ -61,10 +61,7 @@
         <!-- Bio -->
         <view class="section-card">
           <view class="section-header">个人简介</view>
-          <scroll-view wx:if="{{bioScrollable}}" class="bio-scroll" scroll-y="true" show-scrollbar="true">
-            <view class="bio-text">{{lawyer.bio}}</view>
-          </scroll-view>
-          <view wx:else class="bio-text">{{lawyer.bio}}</view>
+          <view class="bio-text">{{lawyer.bio}}</view>
         </view>
 
 
@@ -73,6 +70,15 @@
       </view>
     </scroll-view>
 
+    <canvas
+      id="sharePosterCanvas"
+      class="share-poster-canvas"
+      canvas-id="sharePosterCanvas"
+      disable-scroll="true"
+      type="2d"
+      style="width: 500px; height: 400px;"
+    ></canvas>
+
     <!-- Fixed Action Dock -->
     <action-dock bind:action="handleDockAction"></action-dock>
   </block>