feat: ai问答

pages/garden/index.js

@@ -7,6 +7,8 @@ Page({
         plants: [],
         dateString: '',
         greeting: '',
+        bannerList: [],
+        currentBanner: 0,
 
         // Pagination
         currentPage: 1,
@@ -21,6 +23,7 @@ Page({
     onLoad(options) {
         this.initTime();
         this.loadPlants(true);
+        this.loadBanners();
     },
 
     onShow() {
@@ -102,6 +105,16 @@ Page({
         });
     },
 
+    async loadBanners() {
+        try {
+            const res = await request.get('/plantBanner/activeList');
+            const list = (res.list || []).map(item => item.image ? item.image.url : '');
+            this.setData({ bannerList: list.filter(Boolean) });
+        } catch (err) {
+            console.error('Load banners failed', err);
+        }
+    },
+
     initTime() {
         const updateTime = () => {
             const now = new Date();
@@ -126,6 +139,10 @@ Page({
         updateTime();
     },
 
+    onBannerChange(e) {
+        this.setData({ currentBanner: e.detail.current });
+    },
+
     navigateToDetail(e) {
         const { id } = e.currentTarget.dataset;
         wx.navigateTo({

pages/garden/index.wxml

@@ -17,8 +17,26 @@
     </view>
 
     <view class="banner-container">
-        <view class="garden-banner-bg">
-            <text class="banner-deco">🌿🌸🍀🌺</text>
+        <swiper
+            class="banner-swiper"
+            indicator-dots="{{false}}"
+            autoplay="{{true}}"
+            interval="{{4000}}"
+            duration="{{600}}"
+            circular="{{true}}"
+            bindchange="onBannerChange"
+            easing-function="easeInOutCubic"
+        >
+            <swiper-item wx:for="{{bannerList}}" wx:key="*this">
+                <image src="{{item}}" mode="aspectFill" class="banner-image" />
+            </swiper-item>
+        </swiper>
+        <view class="banner-dots">
+            <view
+                wx:for="{{bannerList}}"
+                wx:key="*this"
+                class="dot {{currentBanner === index ? 'active' : ''}}"
+            />
         </view>
         <view class="banner-overlay">
             <text class="count-tag">共养护 {{total}} 盆植物</text>
@@ -64,7 +82,10 @@
                     <view class="plant-info">
                         <text class="plant-name">{{item.name}}</text>
                         <view class="status-wrap">
-                            <text class="status">生长中</text>
+                            <text class="status">{{item.desc || '生长中'}}</text>
+                            <view wx:if="{{item.carePlans && item.carePlans.length > 0}}" class="care-dot-badge">
+                                <text>{{item.carePlans.length}}项养护</text>
+                            </view>
                         </view>
                     </view>
                 </view>

pages/garden/index.wxss

@@ -83,19 +83,39 @@
   flex-shrink: 0;
 }
 
-.garden-banner-bg {
+.banner-swiper {
   width: 100%;
   height: 100%;
-  background: linear-gradient(135deg, #558B2F 0%, #7CB342 40%, #AED581 100%);
-  display: flex;
-  align-items: center;
-  justify-content: center;
 }
 
-.banner-deco {
-  font-size: 56rpx;
-  letter-spacing: 24rpx;
-  opacity: 0.4;
+.banner-image {
+  width: 100%;
+  height: 220rpx;
+  display: block;
+}
+
+/* Custom indicator dots */
+.banner-dots {
+  position: absolute;
+  bottom: 48rpx;
+  right: 32rpx;
+  display: flex;
+  gap: 10rpx;
+  z-index: 10;
+}
+
+.banner-dots .dot {
+  width: 12rpx;
+  height: 12rpx;
+  border-radius: 12rpx;
+  background: rgba(255, 255, 255, 0.4);
+  transition: all 0.3s ease;
+}
+
+.banner-dots .dot.active {
+  width: 32rpx;
+  background: rgba(255, 255, 255, 0.95);
+  box-shadow: 0 0 8rpx rgba(255, 255, 255, 0.5);
 }
 
 .banner-overlay {
@@ -201,6 +221,9 @@
 
 .status-wrap {
     display: flex;
+    align-items: center;
+    gap: 8rpx;
+    flex-wrap: wrap;
 }
 
 .status {
@@ -210,6 +233,20 @@
   padding: 4rpx 16rpx;
   border-radius: 12rpx;
   font-weight: 600;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 180rpx;
+}
+
+.care-dot-badge {
+  font-size: 20rpx;
+  color: #1565C0;
+  background: #E3F2FD;
+  padding: 4rpx 12rpx;
+  border-radius: 10rpx;
+  font-weight: 600;
+  white-space: nowrap;
 }
 
 /* Custom Floating Button */