diff --git a/pages/compare_price/index.wxml b/pages/compare_price/index.wxml
index 260e7f5..4b43172 100644
--- a/pages/compare_price/index.wxml
+++ b/pages/compare_price/index.wxml
@@ -9,10 +9,25 @@
         <view style="background-color: rgba(255, 255, 255, 0.8); border-radius: 10rpx; padding: 20rpx; margin-bottom: 20rpx;">
           <text style="font-size: 32rpx; font-weight: bold; color: #333; text-align: center;">请选择想要了解的商品</text>
         </view>
-        <view style="display: flex; flex-direction: column; gap: 20rpx; width: 100%; max-width: 400rpx;">
-          <button style="background-color: rgba(255, 255, 255, 0.8); color: #333; border-radius: 8rpx; padding: 20rpx; font-size: 28rpx;" bindtap="selectOption" data-option="绿壳">绿壳</button>
-          <button style="background-color: rgba(255, 255, 255, 0.8); color: #333; border-radius: 8rpx; padding: 20rpx; font-size: 28rpx;" bindtap="selectOption" data-option="粉壳">粉壳</button>
-          <button style="background-color: rgba(255, 255, 255, 0.8); color: #333; border-radius: 8rpx; padding: 20rpx; font-size: 28rpx;" bindtap="selectOption" data-option="褐壳">褐壳</button>
+        <view style="display: flex; flex-direction: column; gap: 24rpx; width: 100%; max-width: 400rpx;">
+          <view style="position: relative; width: 100%; height: 140rpx; border-radius: 12rpx; overflow: hidden; box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15); transition: all 0.3s ease;" bindtap="selectOption" data-option="绿壳">
+            <image src="https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=fresh%20green%20shell%20eggs%20in%20a%20wooden%20box%2C%20natural%20light%2C%20soft%20focus%2C%20warm%20tones&image_size=landscape_4_3" mode="aspectFill" style="width: 100%; height: 100%;"></image>
+            <view style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.6)); display: flex; justify-content: center; align-items: center;">
+              <text style="font-size: 36rpx; font-weight: bold; color: #333; text-shadow: 0 2rpx 4rpx rgba(255, 255, 255, 0.8);">绿壳</text>
+            </view>
+          </view>
+          <view style="position: relative; width: 100%; height: 140rpx; border-radius: 12rpx; overflow: hidden; box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15); transition: all 0.3s ease;" bindtap="selectOption" data-option="粉壳">
+            <image src="https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=fresh%20pink%20shell%20eggs%20in%20a%20wooden%20box%2C%20natural%20light%2C%20soft%20focus%2C%20warm%20tones&image_size=landscape_4_3" mode="aspectFill" style="width: 100%; height: 100%;"></image>
+            <view style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.6)); display: flex; justify-content: center; align-items: center;">
+              <text style="font-size: 36rpx; font-weight: bold; color: #333; text-shadow: 0 2rpx 4rpx rgba(255, 255, 255, 0.8);">粉壳</text>
+            </view>
+          </view>
+          <view style="position: relative; width: 100%; height: 140rpx; border-radius: 12rpx; overflow: hidden; box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.15); transition: all 0.3s ease;" bindtap="selectOption" data-option="褐壳">
+            <image src="https://trae-api-cn.mchost.guru/api/ide/v1/text_to_image?prompt=fresh%20brown%20shell%20eggs%20in%20a%20wooden%20box%2C%20natural%20light%2C%20soft%20focus%2C%20warm%20tones&image_size=landscape_4_3" mode="aspectFill" style="width: 100%; height: 100%;"></image>
+            <view style="position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.6)); display: flex; justify-content: center; align-items: center;">
+              <text style="font-size: 36rpx; font-weight: bold; color: #333; text-shadow: 0 2rpx 4rpx rgba(255, 255, 255, 0.8);">褐壳</text>
+            </view>
+          </view>
         </view>
       </view>
       
@@ -27,7 +42,7 @@
       </view>
       
       <view wx:else>
-        <view wx:if="{{goods.length > 0}}" style="margin-top: 40rpx; width: 100%; max-width: 750rpx;">
+        <view wx:if="{{goods.length > 0 && selectedOption}}" style="margin-top: 40rpx; width: 100%; max-width: 750rpx;">
           <view style="background-color: rgba(255, 255, 255, 0.8); border-radius: 10rpx; padding: 20rpx; margin-bottom: 20rpx;">
             <text style="font-size: 28rpx; font-weight: bold; color: #333; text-align: center; display: block;">{{selectedOption}}在售商品</text>
           </view>
@@ -161,7 +176,7 @@
           </view>
         </view>
         
-        <view wx:else style="margin-top: 40rpx; color: #fff; text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.5);">
+        <view wx:if="{{goods.length === 0 && selectedOption}}" style="margin-top: 40rpx; color: #fff; text-shadow: 0 2rpx 4rpx rgba(0, 0, 0, 0.5);">
           <text>暂无在售数据</text>
         </view>
       </view>
@@ -172,9 +187,11 @@
     <view style="background-color: rgba(255, 255, 255, 0.9); border-radius: 16rpx; padding: 40rpx; width: 80%; max-width: 500rpx; text-align: center;">
       <text style="font-size: 32rpx; font-weight: bold; color: #333; margin-bottom: 20rpx; display: block;">欢迎使用对比价格功能</text>
       <text style="font-size: 28rpx; color: #666; line-height: 40rpx;">此页面用于对比不同商品的价格信息。</text>
-      
       <text style="font-size: 28rpx; color: #f10b0bff; line-height: 40rpx;">对比同种商品，不同规格</text>
       <text style="font-size: 28rpx; color: #666; line-height: 40rpx;">的商品价格信息。</text>
+      <text style="font-size: 28rpx; color: #666; line-height: 40rpx;">想要看到相同规格的同种类型</text>
+      <text style="font-size: 28rpx; color: #f10b0bff; line-height: 40rpx;">相同规格的同种类型</text>
+      <text style="font-size: 28rpx; color: #666; line-height: 40rpx;">点击商品内的对比价格按钮即可展示</text>
       <view style="margin-top: 40rpx;">
         <button style="background-color: #ff6b81; color: #fff; border-radius: 8rpx; padding: 12rpx 40rpx; font-size: 28rpx;" bindtap="closeTips">我知道了</button>
       </view>