feat:base64字体格式

miniprogram/pages/index/index.json

@@ -6,7 +6,9 @@
     "enablePullDownRefresh": false,
     "usingComponents": {
         "van-icon": "@vant/weapp/icon/index",
+        "van-popup": "@vant/weapp/popup/index",
         "word-input": "../../components/word-input/word-input",
-        "word-card": "../../components/word-card/word-card"
+        "word-card": "../../components/word-card/word-card",
+        "icon": "../../ui/icon/icon"
     }
 }

miniprogram/pages/index/index.ts

@@ -10,6 +10,7 @@ Page({
 
     data: {
         cardList: [] as Array<{ color: string; word: string }>,
+        showPopup: false,
     },
 
     onReady() {
@@ -30,37 +31,6 @@ Page({
             .exec();
     },
 
-    // renderCanvas() {
-    //     // wx.nextTick(() => {
-    //     // this.setCanvasBoxSize();
-    //     // });
-    //     console.log('this.boxWidth:', this.boxWidth);
-    //     console.log('this.boxHeight:', this.boxHeight);
-    //     if (this.boxWidth && this.boxHeight) {
-    //         this.initCanvas(this.boxWidth, this.boxHeight);
-    //     }
-    // },
-
-    // setCanvasBoxSize() {
-    //     const { windowWidth } = wx.getWindowInfo();
-    //     console.log('windowWidth---:', windowWidth);
-    //     const query = wx.createSelectorQuery();
-    //     query
-    //         .select('#canvasWrapper')
-    //         .boundingClientRect((rect) => {
-    //             if (rect) {
-    //                 const boxWidth = rect.width;
-    //                 const boxHeight = boxWidth / (width / height);
-
-    //                 console.log('boxWidth----:', boxWidth);
-    //                 console.log('boxHeight----:', boxHeight);
-
-    //                 this.initCanvas(boxHeight, boxWidth);
-    //             }
-    //         })
-    //         .exec();
-    // },
-
     initCanvas(boxWidth: number, boxHeight: number) {
         wx.createSelectorQuery()
             .select('#canvasContent')
@@ -150,4 +120,14 @@ Page({
             return;
         }
     },
+
+    onClickColor(e: WechatMiniprogram.CustomEvent) {
+        const { key, word, color } = e.detail;
+        console.log('onClickColor key:', key, 'word:', word, 'color:', color);
+        this.setData({ showPopup: true });
+    },
+
+    onClosePopup() {
+        this.setData({ showPopup: false });
+    },
 });

miniprogram/pages/index/index.wxml

@@ -12,12 +12,14 @@
                         key="{{index}}"
                         word="{{item.word}}"
                         color="{{item.color}}"
+                        bind:onClickColor="onClickColor"
                         bind:onDelete="deleteWordCard" />
                     <word-card
                         wx:if="{{cardList[index + 1]}}"
                         key="{{index + 1}}"
                         word="{{cardList[index + 1].word}}"
                         color="{{cardList[index + 1].color}}"
+                        bind:onClickColor="onClickColor"
                         bind:onDelete="deleteWordCard" />
                 </view>
             </block>
@@ -36,10 +38,14 @@
         </view>
     </view>
     <view class="empty"></view>
+    <van-popup show="{{ showPopup }}" bind:close="onClosePopup">
+        内容Joey
+    </van-popup>
 </view>
 <view class="btn-area">
     <view class="btn btn-green" bindtap="exportToPrint">
         <van-icon class-prefix="j-icon" name="download" size="44rpx" />
+        <!-- <icon name="download" size="44rpx" /> -->
         <text class="btn-text">下载打印</text>
     </view>
 </view>