feat: 打印预览组件化

miniprogram/focusPages/focusDraw/focusDraw.wxml

@@ -3,15 +3,29 @@
 <view class="fd-page">
     <view class="fd-main">
         <!-- 打印预览卡 -->
-        <view class="fd-preview-wrap">
-            <view class="fd-preview-card">
-                <text class="fd-preview-kicker">打印预览</text>
-                <view id="canvasWrapper" class="fd-canvas-wrap">
-                    <canvas
-                        type="2d"
-                        id="canvasContent"
-                        class="fd-canvas"
-                        style="width:{{boxWidth}}px;height:{{boxHeight}}px" />
+        <preview-card
+            id="previewCard"
+            showRefresh="{{true}}"
+            showFavorite="{{true}}"
+            favorited="{{isPreviewFavorite}}"
+            bind:canvas-ready="onCanvasReady"
+            bind:refresh="onPreviewRefresh"
+            bind:favorite="onPreviewFavorite" />
+
+        <!-- 子选项（当前类型有模式切换时显示） -->
+        <view wx:if="{{showActions}}" class="fd-section">
+            <text class="fd-section-title">{{actionsTitle}}</text>
+            <view class="fd-chip-row">
+                <view
+                    wx:for="{{currentActions}}"
+                    wx:key="value"
+                    class="fd-chip {{currentMode === item.value ? 'fd-chip--active' : ''}}"
+                    data-value="{{item.value}}"
+                    hover-class="fd-chip--pressed"
+                    hover-start-time="0"
+                    hover-stay-time="70"
+                    bindtap="onSelectMode">
+                    {{item.label}}
                 </view>
             </view>
         </view>
@@ -35,25 +49,7 @@
             </view>
         </view>
 
-        <!-- 子选项（当前类型有模式切换时显示） -->
-        <view wx:if="{{showActions}}" class="fd-section">
-            <text class="fd-section-title">{{actionsTitle}}</text>
-            <view class="fd-chip-row">
-                <view
-                    wx:for="{{currentActions}}"
-                    wx:key="value"
-                    class="fd-chip {{currentMode === item.value ? 'fd-chip--active' : ''}}"
-                    data-value="{{item.value}}"
-                    hover-class="fd-chip--pressed"
-                    hover-start-time="0"
-                    hover-stay-time="70"
-                    bindtap="onSelectMode">
-                    {{item.label}}
-                </view>
-            </view>
-        </view>
-
-        <!-- 随机生成按钮 -->
+        <!-- 随机生成按钮
         <view
             class="fd-shuffle-btn"
             hover-class="fd-shuffle-btn--hover"
@@ -66,7 +62,7 @@
                 color="#605b50"
                 custom-class="fd-shuffle-btn__icon" />
             <text class="fd-shuffle-btn__text">随机生成</text>
-        </view>
+        </view> -->
 
         <!-- 广告位 -->
         <draw-ad type="focusDraw"></draw-ad>