feat:添加按钮点击效果

miniprogram/components/color-picker/color-picker.less

@@ -16,14 +16,14 @@
             font-size: 32rpx;
             color: #141414;
             font-weight: bold;
-            margin-bottom: 30rpx;
+            // margin-bottom: 30rpx;
         }
 
         .color-options-title {
             width: 100%;
             height: 1rpx;
             position: relative;
-            padding: 20rpx 0;
+            padding: 30rpx 0;
 
             .color-options-title-text {
                 position: absolute;

miniprogram/components/color-picker/color-picker.ts

@@ -19,7 +19,7 @@ Component({
      * 组件的初始数据
      */
     data: {
-        WATER_COLORS: WATER_COLORS,
+        extended24Colors: WATER_COLORS.extended24,
     },
     lifetimes: {
         attached() {},
@@ -34,11 +34,14 @@ Component({
 
         onSelectColor(e: WechatMiniprogram.TouchEvent) {
             const { color } = e.currentTarget.dataset;
-            console.log('Selected color:', color);
             this.setData({
                 currentColor: color,
             });
-            this.triggerEvent('onSelectColor', { color });
+        },
+
+        onChange(e: WechatMiniprogram.TouchEvent) {
+            const { currentColor } = this.data;
+            this.triggerEvent('onChange', { color: currentColor });
         },
     },
 });

miniprogram/components/color-picker/color-picker.wxml

@@ -4,7 +4,7 @@
     custom-class="color-picker-popup">
     <view class="color-picker-container">
         <text class="color-picker-title">选择颜色</text>
-        <view class="color-options-title">
+        <!-- <view class="color-options-title">
             <text class="color-options-title-text">基础12色</text>
             <view class="color-options-title-line"></view>
         </view>
@@ -20,9 +20,9 @@
         <view class="color-options-title">
             <text class="color-options-title-text">扩展24色</text>
             <view class="color-options-title-line"></view>
-        </view>
+        </view> -->
         <view class="color-options">
-            <block wx:for="{{WATER_COLORS.extended24}}" wx:key="index">
+            <block wx:for="{{extended24Colors}}" wx:key="index">
                 <view
                     class="color-option {{item.hex === currentColor ? 'selected' : ''}}"
                     style="background-color: {{item.hex}};"
@@ -32,7 +32,7 @@
         </view>
         <view class="btn-area">
             <!-- <view class="btn-yellow">确认选择</view> -->
-            <toy-button type="primary" bind:click="" width="400rpx">
+            <toy-button type="primary" bind:click="onChange" width="400rpx">
                 确认选择
             </toy-button>
         </view>