소스 검색

feat(cfc-frontend): SharePoster 家庭邀请卡加 familyName 文案与邀请语,字号缩小2px

iwt 1 개월 전
부모
커밋
bf5d1f5196
1개의 변경된 파일20개의 추가작업 그리고 11개의 파일을 삭제
  1. 20 11
      cfc-frontend/components/SharePoster.vue

+ 20 - 11
cfc-frontend/components/SharePoster.vue

@@ -18,6 +18,7 @@ export default {
     userAvatar: { type: String, default: '' },
     nickname: { type: String, default: '' },
     referralCode: { type: String, default: '' },
+    familyName: { type: String, default: '' },
     qrCodeBase64: { type: String, default: '' }
   },
   watch: {
@@ -116,13 +117,13 @@ export default {
 
       // Brand name
       ctx.setFillStyle('#ffffff')
-      ctx.setFontSize(20)
+      ctx.setFontSize(18)
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
       ctx.fillText('浠艾福', centerX, 52)
 
       // Tagline
-      ctx.setFontSize(14)
+      ctx.setFontSize(12)
       ctx.setFillStyle('rgba(255,255,255,0.8)')
       ctx.fillText('给全家的一站式幸福提案', centerX, 76)
 
@@ -262,21 +263,21 @@ export default {
       // --- Nickname ---
       var nameY = avatarY + 70
       ctx.setFillStyle('#1C1917')
-      ctx.setFontSize(24)
+      ctx.setFontSize(22)
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
       ctx.fillText(this.nickname || '好友', w / 2, nameY)
 
       // --- "我的邀请码" label ---
       var labelY = nameY + 42
-      ctx.setFontSize(17)
+      ctx.setFontSize(15)
       ctx.setFillStyle('#A8A29E')
       ctx.fillText('我的邀请码', w / 2, labelY)
 
       // --- Referral code (prominent, warm orange) ---
       var codeY = labelY + 38
       var codeText = this.referralCode || '------'
-      ctx.setFontSize(46)
+      ctx.setFontSize(44)
       ctx.setFillStyle('#F97316')
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
@@ -298,13 +299,21 @@ export default {
 
       ctx.fillText(codeText, w / 2, codeY)
 
-      // --- Small hint above QR ---
+      // --- 邀请文案(二维码上方)---
       var hintY = codeY + 80
-      ctx.setFontSize(14)
+      ctx.setFontSize(12)
       ctx.setFillStyle('#D6D3D1')
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
-      ctx.fillText('长按识别二维码 · 一起加入浠艾福', w / 2, hintY)
+      var inviteText = ''
+      if (this.nickname && this.familyName) {
+        inviteText = this.nickname + '邀请你来' + this.familyName
+      } else if (this.nickname) {
+        inviteText = this.nickname + '邀请你加入浠艾福'
+      } else {
+        inviteText = '长按识别二维码 · 一起加入浠艾福'
+      }
+      ctx.fillText(inviteText, w / 2, hintY)
 
       // --- QR code ---
       var qrSize = 180
@@ -367,7 +376,7 @@ export default {
       ctx.stroke()
 
       ctx.setFillStyle('#A8A29E')
-      ctx.setFontSize(16)
+      ctx.setFontSize(14)
       ctx.setTextAlign('center')
       ctx.setTextBaseline('middle')
       ctx.fillText('二维码加载中', x + size / 2, y + size / 2)
@@ -402,7 +411,7 @@ export default {
 
       // CTA text
       ctx.setFillStyle('#F97316')
-      ctx.setFontSize(19)
+      ctx.setFontSize(17)
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
       ctx.fillText('扫码邀请好友加入', centerX, bottomY)
@@ -424,7 +433,7 @@ export default {
 
       // Footer brand text
       ctx.setFillStyle('rgba(255,255,255,0.45)')
-      ctx.setFontSize(12)
+      ctx.setFontSize(10)
       ctx.setTextAlign('center')
       ctx.setTextBaseline('top')
       ctx.fillText('浠艾福 · 家庭健康俱乐部', centerX, dotY + 7)