feat:2.6.1增加数物对应和根据颜色画图形

2025-12-23 13:35:19 +08:00
parent 9b6a0a26cc
commit 20496c3cc8
28 changed files with 940 additions and 277 deletions
@@ -0,0 +1,78 @@
+<!--
+  Canvas 页面模板
+  用于统一管理 Canvas 绘制页面的通用结构
+  
+  使用方式：
+  <import src="../../templates/canvas-page-template.wxml" />
+  <template
+      is="canvasPageTemplate"
+      data="{{boxWidth: boxWidth, boxHeight: boxHeight, hasTypeSelector: false, adType: 'focusDraw', disabled: !hasContent, showShareDialog: showShareDialog}}" />
+  
+  参数说明：
+  - boxWidth: Canvas 宽度
+  - boxHeight: Canvas 高度
+  - hasTypeSelector: 是否显示类型选择器（布尔值）
+  - showTypeSelector: 条件显示类型选择器（可选，用于 countMatch、missingNumber 等页面）
+  - currentModeName: 当前模式名称（类型选择器使用）
+  - typeActions: 类型选项数组（类型选择器使用）
+  - adType: 广告位类型（'focusDraw' 或 'mathDraw'）
+  - disabled: 底部按钮是否禁用
+  - showShareDialog: 是否显示分享弹窗
+-->
+<template name="canvasPageTemplate">
+    <view class="page-container">
+        <view class="wrapper">
+            <text class="wrapper-title">预览打印效果</text>
+
+            <!-- 预览打印效果 -->
+            <view id="canvasWrapper" class="canvas-wrapper">
+                <canvas
+                    type="2d"
+                    id="canvasContent"
+                    class="canvas-content"
+                    style="width:{{boxWidth}}px;height:{{boxHeight}}px" />
+            </view>
+
+            <!-- 类型选择器和随机生成按钮 -->
+            <!-- 支持两种方式：hasTypeSelector（布尔值）或 showTypeSelector（条件显示） -->
+            <math-type-selector
+                wx:if="{{hasTypeSelector || showTypeSelector}}"
+                current-type-name="{{currentModeName}}"
+                type-actions="{{typeActions}}"
+                bind:select="onSelectType"
+                bind:random="onRandom" />
+
+            <!-- 随机生成按钮（当没有类型选择器时显示） -->
+            <view
+                class="random-button-area"
+                wx:if="{{!hasTypeSelector && !showTypeSelector}}">
+                <toy-button
+                    class="random-button"
+                    type="primary"
+                    bind:click="onRandom"
+                    width="100%"
+                    height="80rpx"
+                    icon="refresh"
+                    icon-class-prefix="toy-icon">
+                    随机生成
+                </toy-button>
+            </view>
+
+            <!-- 广告位 -->
+            <draw-ad type="{{adType}}"></draw-ad>
+        </view>
+        <view class="empty"></view>
+    </view>
+
+    <!-- 底部按钮 -->
+    <math-bottom-buttons
+        disabled="{{disabled}}"
+        bind:share="onShareAppMessage"
+        bind:export="exportToPrint" />
+
+    <!-- 分享引导弹窗 -->
+    <share-guide-popup
+        show="{{showShareDialog}}"
+        bind:onClose="onCloseShareDialog"
+        bind:onShareSuccess="onShareSuccess" />
+</template>