feat: 完成文字涂色卡功能

miniprogram/components/word-picker/word-picker.less

@@ -86,6 +86,7 @@
         display: flex;
         justify-content: space-between;
         margin-bottom: 96rpx;
+        padding: 0 28rpx;
     }
 
 }

miniprogram/components/word-picker/word-picker.ts

@@ -27,7 +27,6 @@ Component({
     },
     lifetimes: {
         ready() {
-            console.log('selectedWords', this.data.selectedWords);
         },
     },
     /**
@@ -38,6 +37,12 @@ Component({
             this.triggerEvent('onClose');
         },
 
+        onClear() {
+            this.setData({
+                selectedWords: [],
+            });
+        },
+
         onChange() {
             this.triggerEvent('onChange', { selectedWords: this.data.selectedWords });
         },

miniprogram/components/word-picker/word-picker.wxml

@@ -4,13 +4,15 @@
     show="{{ show }}"
     bind:close="onClose"
     round
-    close-on-click-overlay="{{false}}"
+    closeable="{{true}}"
+    close-on-click-overlay="{{true}}"
     safe-area-inset-bottom="{{true}}"
     position="bottom"
     custom-style="height: 70%"
     custom-class="word-picker">
     <view class="word-picker-title">请选择文字</view>
     <van-tabs
+        wx:if="{{show}}"
         id="tabs"
         animated
         color="#93d333"
@@ -54,15 +56,16 @@
         >
     </view>
     <view class="btn-area">
-        <toy-button
-            type="primary"
-            bind:click="onChange"
-            width="420rpx"
-            disabled="{{selectedWords.length <= 0}}">
+        <toy-button type="primary" bind:click="onChange" width="400rpx">
             （已选{{selectedWords.length}}个） 确定
         </toy-button>
-        <toy-button type="white" bind:click="onClose" width="220rpx">
-            取消
+        <toy-button
+            type="white"
+            bind:click="onClear"
+            width="210rpx"
+            icon="clear"
+            icon-class-prefix="toy-icon">
+            清空
         </toy-button>
     </view>
 </van-popup>