From f649ec294553dba7f6bfaad10c88eb6be5a70cfc Mon Sep 17 00:00:00 2001
From: User <user@example.com>
Date: Sat, 28 Feb 2026 10:45:23 +0800
Subject: [PATCH] =?UTF-8?q?=E6=8F=90=E4=BA=A4=E4=BC=98=E5=8C=96=EF=BC=88?=
 =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E7=B1=BB=E5=9E=8B=E6=B2=A1=E6=9C=89=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/compare_price/index.wxml | 31 ++++++++++++++++++++++++-------
 1 file changed, 24 insertions(+), 7 deletions(-)

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>