feat:架构代码优化

2025-12-11 13:02:44 +08:00
parent 2c32235568
commit 3c0e2af10d
89 changed files with 2774 additions and 2816 deletions
@@ -0,0 +1,137 @@
+# MathPage 公共工具
+
+这个目录包含了数学页面的公共工具和复用代码。
+
+## mathPageMixin.ts
+
+提供了所有数学页面的公共功能，包括：
+
+- Canvas 初始化
+- 分享功能（小程序分享、朋友圈分享）
+- 导出打印功能
+- 页面信息初始化
+
+### 使用方法
+
+```typescript
+import { getMathPageCommonMethods } from '../common/mathPageMixin';
+import YourDrawService from '../service/yourDrawService';
+
+// 获取公共方法，传入页面路径
+const commonMethods = getMathPageCommonMethods({
+    pagePath: 'yourPage/yourPage', // 相对于 mathPages 目录的路径
+});
+
+Page({
+    // Canvas 相关属性
+    canvas: null as Canvas | null,
+    ctx: null as RenderingContext | null,
+    boxHeight: 0,
+    boxWidth: 0,
+    drawService: null as YourDrawService | null,
+
+    // 页面数据（包含公共数据）
+    data: {
+        functionId: '',
+        pageTitle: '',
+        subTitle: '',
+        hasContent: false,
+        showShareDialog: false,
+        boxWidth: 0,
+        boxHeight: 0,
+        // ... 其他页面特定的数据
+    },
+
+    onLoad(options: { id?: string }) {
+        const functionId = options.id || 'your-function-id';
+        // 使用公共方法初始化页面信息
+        this.initPageInfo(functionId, '默认标题');
+    },
+
+    onReady() {
+        // 使用公共方法初始化 Canvas
+        this.initCanvas({
+            createDrawService: (canvas, ctx, options) => {
+                return new YourDrawService(canvas, ctx, options);
+            },
+            drawServiceOptions: {
+                // 传递给绘制服务的选项
+            },
+            onCanvasReady: () => {
+                // Canvas 初始化完成后的回调
+                this.onRandom(); // 或其他初始化操作
+            },
+        });
+    },
+
+    // 实现页面特定的绘制逻辑
+    async drawCanvas() {
+        if (!this.ctx || !this.drawService || !this.yourData) {
+            return;
+        }
+        try {
+            await this.drawService.draw(this.yourData);
+            this.setData({ hasContent: true });
+        } catch (error) {
+            console.error('绘制失败:', error);
+            this.setData({ hasContent: false });
+        }
+    },
+
+    // 页面特定的方法
+    onRandom() {
+        // 生成数据逻辑
+        this.drawCanvas();
+    },
+
+    // ========== 使用公共方法 ==========
+    initCanvas: commonMethods.initCanvas,
+    exportToPrint: commonMethods.exportToPrint,
+    onShareAppMessage: commonMethods.onShareAppMessage,
+    onShareTimeline: commonMethods.onShareTimeline,
+    onCloseShareDialog: commonMethods.onCloseShareDialog,
+    onShareSuccess: commonMethods.onShareSuccess,
+    initPageInfo: commonMethods.initPageInfo,
+});
+```
+
+### 提供的公共方法
+
+1. **initCanvas(options)** - 初始化 Canvas
+
+    - `createDrawService`: 创建绘制服务的工厂函数
+    - `drawServiceOptions`: 传递给绘制服务的选项
+    - `onCanvasReady`: Canvas 初始化完成后的回调
+
+2. **drawCanvas()** - 绘制 Canvas 内容（需要子类实现）
+
+3. **exportToPrint()** - 导出打印
+
+4. **onShareAppMessage()** - 小程序分享
+
+5. **onShareTimeline()** - 朋友圈分享
+
+6. **onCloseShareDialog()** - 关闭分享引导弹窗
+
+7. **onShareSuccess()** - 分享成功回调
+
+8. **initPageInfo(functionId, defaultTitle)** - 初始化页面信息
+    - 从 `MATH_FUNCTION_TYPES` 中获取标题和描述
+    - 设置导航栏标题
+
+### 优势
+
+- ✅ **代码复用**: 消除了重复代码
+- ✅ **类型安全**: 完整的 TypeScript 类型支持
+- ✅ **易于维护**: 公共功能集中管理
+- ✅ **灵活扩展**: 每个页面可以重写特定方法
+
+### 迁移指南
+
+从旧代码迁移到使用 mixin：
+
+1. 导入公共方法
+2. 移除重复的方法（exportToPrint、分享相关等）
+3. 使用 `initCanvas` 替代原有的 Canvas 初始化代码
+4. 使用 `initPageInfo` 替代页面信息初始化代码
+5. 将公共方法添加到 Page 配置中