feat: 增加下载分享检查功能

miniprogram/pages/copyBook/copyBook.json

@@ -7,6 +7,7 @@
     "usingComponents": {
         "toy-button": "/ui/button/button",
         "van-icon": "@vant/weapp/icon/index",
+        "van-dialog": "@vant/weapp/dialog/index",
         "word-input": "/components/word-input/word-input",
         "word-card": "/components/word-card/word-card",
         "word-picker": "/components/word-picker/word-picker",

miniprogram/pages/copyBook/copyBook.ts

@@ -1,5 +1,9 @@
 import WordDrawService from '../../service/wordDrawService';
 import { checkAndSaveImage } from '../../utils/saveImage';
+import {
+    shouldShowShareGuide,
+    recordShareSuccess,
+} from '../../utils/shareGuide';
 import { PAPER_SIZE } from '../../constants/colors';
 import { getWordsSvgData } from '../../utils/getWordsSvgJson';
 import { WORDS } from '../../constants/words';
@@ -22,6 +26,7 @@ Page({
         currentColor: '',
         boxWidth: 0,
         boxHeight: 0,
+        showShareDialog: false, // 显示分享引导弹窗
     },
 
     async onLoad() {
@@ -29,14 +34,17 @@ Page({
         const hasShowPracticeDemo =
             wx.getStorageSync('hasShowPracticeDemo') || false;
         if (!hasShowPracticeDemo) {
-            this.setData({
-                words: ['好', '好', '学', '习', '天', '天', '向', '上']
-            }, () => {
-                wx.setStorageSync('hasShowPracticeDemo', true);
-            })
+            this.setData(
+                {
+                    words: ['好', '好', '学', '习', '天', '天', '向', '上'],
+                },
+                () => {
+                    wx.setStorageSync('hasShowPracticeDemo', true);
+                },
+            );
         }
         await this.setCanvasBoxSize();
-        await this.initCanvas()
+        await this.initCanvas();
     },
 
     async loadSvgWords() {
@@ -48,7 +56,11 @@ Page({
             this.svgWords = svgWordsData;
             wx.hideToast();
 
-            console.log('SVG汉字数据加载成功，共', Object.keys(this.svgWords).length, '个汉字');
+            console.log(
+                'SVG汉字数据加载成功，共',
+                Object.keys(this.svgWords).length,
+                '个汉字',
+            );
 
             const { words } = this.data as any;
             if (words && words.length > 0) {
@@ -70,7 +82,7 @@ Page({
                         // 用户点击重试，重新加载
                         this.loadSvgWords();
                     }
-                }
+                },
             });
         }
     },
@@ -143,18 +155,25 @@ Page({
         const { key } = e.detail;
         const { words } = this.data as any;
         const next = words.filter((_: string, index: number) => index !== key);
-        this.setData({ words: next }, () => this.renderPracticeContent().catch(console.error));
+        this.setData({ words: next }, () =>
+            this.renderPracticeContent().catch(console.error),
+        );
     },
 
     // 清空
     clearWords() {
-        this.setData({ words: [] }, () => this.renderPracticeContent().catch(console.error));
+        this.setData({ words: [] }, () =>
+            this.renderPracticeContent().catch(console.error),
+        );
     },
 
     // 随机生成（取基础分类，过滤为可用SVG字，最多11个）
     refreshWords() {
         // 选取较简单的几个分类（如 0:基础独体字，1:生活高频字，2:自然与动作）
-        const candidate = WORDS.slice(0, 3).reduce((acc: string[], c: any) => acc.concat(c.words), [] as string[]);
+        const candidate = WORDS.slice(0, 3).reduce(
+            (acc: string[], c: any) => acc.concat(c.words),
+            [] as string[],
+        );
         // 去重
         const unique = Array.from(new Set(candidate));
         // 打乱
@@ -164,10 +183,15 @@ Page({
         // 过滤为支持的SVG字
         const supported = this.getSupportedWords(picked);
         if (supported.length === 0) {
-            wx.showToast({ title: '随机到的字暂不支持，重试一下', icon: 'none' });
+            wx.showToast({
+                title: '随机到的字暂不支持，重试一下',
+                icon: 'none',
+            });
             return;
         }
-        this.setData({ words: supported }, () => this.renderPracticeContent().catch(console.error));
+        this.setData({ words: supported }, () =>
+            this.renderPracticeContent().catch(console.error),
+        );
     },
 
     // 校验 & 分割
@@ -181,7 +205,6 @@ Page({
         return matches || [];
     },
 
-
     setCanvasBoxSize() {
         const query = wx.createSelectorQuery();
         query
@@ -212,13 +235,17 @@ Page({
                         if (ctx) {
                             this.canvas = canvas;
                             this.ctx = ctx;
-                            this.wordDrawService = new WordDrawService(canvas, ctx);
+                            this.wordDrawService = new WordDrawService(
+                                canvas,
+                                ctx,
+                            );
 
                             // 初始化时只绘制页眉和布局
                             await this.wordDrawService.drawLayout();
 
                             // 绘制完成后计算并缓存最大行列数（与实际绘制一致）
-                            const { maxRow, maxCol } = this.wordDrawService.getMaxGridLayout();
+                            const { maxRow, maxCol } =
+                                this.wordDrawService.getMaxGridLayout();
                             this.maxRow = maxRow;
                             this.maxCol = maxCol;
 
@@ -269,18 +296,25 @@ Page({
         }
 
         // 处理布局和生成练字数据（基于实际最大行列数）
-        const characterData = this.processCharacterLayout(supportedWords, maxRow, maxCol);
+        const characterData = this.processCharacterLayout(
+            supportedWords,
+            maxRow,
+            maxCol,
+        );
         this.wordDrawService.drawPracticeContent(characterData);
     },
 
-
     /** 检查汉字是否支持，返回支持的汉字列表 */
     getSupportedWords(words: string[]): string[] {
-        return words.filter(word => this.svgWords[word]);
+        return words.filter((word) => this.svgWords[word]);
     },
 
     /** 处理汉字布局，生成练字数据 */
-    processCharacterLayout(words: string[], maxRow: number, maxCol: number): CharacterItem[] {
+    processCharacterLayout(
+        words: string[],
+        maxRow: number,
+        maxCol: number,
+    ): CharacterItem[] {
         let rowIndex = 0;
         const characterData: CharacterItem[] = [];
         const boundaryWords: string[] = [];
@@ -319,11 +353,58 @@ Page({
             wx.showToast({ title: '请先生成练字贴', icon: 'none' });
             return;
         }
+
+        // 检查是否需要显示分享引导
+        if (shouldShowShareGuide()) {
+            this.setData({ showShareDialog: true });
+            return;
+        }
+
+        // 直接下载
         checkAndSaveImage(this.canvas);
     },
 
+    /** 关闭分享引导弹窗 */
+    onCloseShareDialog() {
+        this.setData({ showShareDialog: false });
+    },
+
+    /** 点击转发按钮 */
+    onShareToFriend() {
+        // 记录分享成功（用户点击了分享按钮，视为已分享）
+        recordShareSuccess();
+        this.setData({ showShareDialog: false });
+        // 允许继续下载
+        if (this.canvas) {
+            checkAndSaveImage(this.canvas);
+        }
+        wx.showToast({
+            title: '分享后即可继续下载',
+            icon: 'success',
+            duration: 2000,
+        });
+    },
+
+    /** 点击分享到朋友圈按钮 */
+    onShareToTimeline() {
+        // 记录分享成功（用户点击了分享按钮，视为已分享）
+        recordShareSuccess();
+        this.setData({ showShareDialog: false });
+        // 允许继续下载
+        if (this.canvas) {
+            checkAndSaveImage(this.canvas);
+        }
+        wx.showToast({
+            title: '分享后即可继续下载',
+            icon: 'success',
+            duration: 2000,
+        });
+    },
+
     // 分享功能
     onShareAppMessage() {
+        // 记录分享成功（用户真正分享了）
+        recordShareSuccess();
         return {
             title: '涂鸦丫-练字|识字|打印',
             path: '/pages/copyBook/index',
@@ -331,11 +412,11 @@ Page({
     },
 
     onShareTimeline() {
+        // 记录分享成功（用户真正分享了）
+        recordShareSuccess();
         return {
             title: '涂鸦丫-练字|识字|打印',
             query: '/pages/copyBook/index',
         };
     },
 });
-
-

miniprogram/pages/copyBook/copyBook.wxml

@@ -91,6 +91,16 @@
         max="11"
         bind:onClose="closeSelectWordPopup"
         bind:onChange="onChangeWord" />
+    <van-dialog
+        show="{{showShareDialog}}"
+        title="分享解锁下载"
+        message="今日免费下载次数已用完，分享给好友或朋友圈后即可继续免费下载"
+        show-cancel-button
+        confirm-button-text="转发给好友"
+        cancel-button-text="分享到朋友圈"
+        bind:confirm="onShareToFriend"
+        bind:cancel="onShareToTimeline"
+        bind:close="onCloseShareDialog" />
 
     <view class="empty"></view>
 </view>