79 lines
2.9 KiB
Plaintext
79 lines
2.9 KiB
Plaintext
<!--
|
||
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>
|