feat:完成颜色选择器和button组件

miniprogram/pages/index/index.wxml

@@ -12,13 +12,15 @@
                         key="{{index}}"
                         word="{{item.word}}"
                         color="{{item.color}}"
-                        bind:onDelete="deleteWordCard" />
+                        bind:onDelete="deleteWordCard"
+                        bind:onColorTap="onColorTap" />
                     <word-card
                         wx:if="{{cardList[index + 1]}}"
                         key="{{index + 1}}"
                         word="{{cardList[index + 1].word}}"
                         color="{{cardList[index + 1].color}}"
-                        bind:onDelete="deleteWordCard" />
+                        bind:onDelete="deleteWordCard"
+                        bind:onColorTap="onColorTap" />
                 </view>
             </block>
         </view>
@@ -36,10 +38,59 @@
         </view>
     </view>
     <view class="empty"></view>
+    <color-picker
+        show="{{showColorPopup}}"
+        currentColor="{{currentColor}}"
+        bind:onClose="onCloseColorPopup" />
+    <!-- <van-popup
+        show="{{ showColorPopup }}"
+        bind:close="onClose"
+        custom-class="color-picker-popup">
+        <view class="color-picker-container">
+            <text class="color-picker-title">选择颜色</text>
+            <view class="color-options-title">
+                <text class="color-options-title-text">基础12色</text>
+                <view class="color-options-title-line"></view>
+            </view>
+            <view class="color-options">
+                <block wx:for="{{WATER_COLORS.basic12}}" wx:key="index">
+                    <view
+                        class="color-option"
+                        style="background-color: {{item.hex}};"
+                        bindtap="onSelectColor"
+                        data-color="{{item.hex}}"></view>
+                </block>
+            </view>
+            <view class="color-options-title">
+                <text class="color-options-title-text">扩展24色</text>
+                <view class="color-options-title-line"></view>
+            </view>
+            <view class="color-options">
+                <block wx:for="{{WATER_COLORS.extended24}}" wx:key="index">
+                    <view
+                        class="color-option"
+                        style="background-color: {{item.hex}};"
+                        bindtap="onSelectColor"
+                        data-color="{{item.hex}}"></view>
+                </block>
+            </view>
+        </view>
+    </van-popup> -->
 </view>
 <view class="btn-area">
-    <view class="btn btn-green" bindtap="exportToPrint">
+    <!-- <view
+        class="btn btn-green {{cardList.length > 0 ? '' : 'disabled'}}"
+        bindtap="exportToPrint">
         <van-icon class-prefix="j-icon" name="download" size="44rpx" />
         <text class="btn-text">下载打印</text>
-    </view>
+    </view> -->
+    <toy-button
+        type="green"
+        bind:click="exportToPrint"
+        width="680rpx"
+        disabled="{{cardList.length <= 0}}"
+        icon="download"
+        icon-class-prefix="j-icon">
+        下载打印
+    </toy-button>
 </view>