90 lines
3.8 KiB
Plaintext
90 lines
3.8 KiB
Plaintext
<wxs src="../../utils/tools.wxs" module="tools" />
|
|
<view class="garden-page">
|
|
<view class="page-header with-banner">
|
|
<view class="header-content">
|
|
<text class="date-text">{{dateString}}</text>
|
|
<view class="greeting-row">
|
|
<text class="greeting-main">{{greeting}},园长</text>
|
|
</view>
|
|
<text class="subtitle">今天也要好好照顾它们哦</text>
|
|
</view>
|
|
<view class="share-btn-wrap">
|
|
<button class="share-capsule" open-type="share">
|
|
<t-icon name="share" size="32rpx" color="#558B2F" />
|
|
<text>推荐给好友</text>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="banner-container">
|
|
<image src="https://images.unsplash.com/photo-1585320806297-9794b3e4eeae?w=800" class="garden-banner" mode="aspectFill" />
|
|
<view class="banner-overlay">
|
|
<text class="count-tag">共养护 {{total}} 盆植物</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="garden-list-wrapper">
|
|
<view wx:if="{{plants.length === 0}}" class="garden-empty-state">
|
|
<view class="empty-sky-scene">
|
|
<view class="sun-small"></view>
|
|
<view class="cloud-small"></view>
|
|
</view>
|
|
<view class="empty-center-icon">
|
|
<text class="emoji-sprout">🌱</text>
|
|
<view class="soil-base"></view>
|
|
</view>
|
|
<view class="empty-message">
|
|
<text class="msg-title">花园还在沉睡中...</text>
|
|
<text class="msg-sub">快种下第一颗种子,唤醒它吧 ✨</text>
|
|
</view>
|
|
|
|
<!-- Animated Guide Arrow -->
|
|
<view class="guide-arrow-box bounce-arrow">
|
|
<text class="arrow-text">点这里添加</text>
|
|
<t-icon name="arrow-right-down" size="48rpx" color="#558B2F" />
|
|
</view>
|
|
</view>
|
|
|
|
<scroll-view wx:else scroll-y class="garden-list-container" enhanced show-scrollbar="{{false}}" bindscrolltolower="onScrollLower">
|
|
<view class="plant-grid">
|
|
<view wx:for="{{plants}}" wx:key="id" class="plant-card" bindtap="navigateToDetail" data-id="{{item.id}}">
|
|
<view class="plant-image-container">
|
|
<t-image
|
|
src="{{item.images[0]}}"
|
|
mode="aspectFill"
|
|
width="100%"
|
|
height="100%"
|
|
t-class="uploaded-img"
|
|
/>
|
|
<view class="days-badge">{{item.daysPlanted}}天</view>
|
|
</view>
|
|
<view class="plant-info">
|
|
<text class="plant-name">{{item.name}}</text>
|
|
<view class="status-wrap">
|
|
<text class="status">生长中</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Loading & No More Data Status -->
|
|
<view class="list-footer">
|
|
<t-loading wx:if="{{isLoading}}" theme="circular" size="40rpx" text="加载中..." />
|
|
<view wx:if="{{isLastPage && plants.length > 0}}" class="no-more-data">
|
|
<view class="divider-line"></view>
|
|
<text>没有更多了</text>
|
|
<view class="divider-line"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view style="height: 100rpx;"></view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<!-- Custom Floating Action Button -->
|
|
<view class="floating-add-btn" bindtap="navigateToAdd">
|
|
<t-icon name="add" size="40rpx" color="#FFF" />
|
|
<text>添加植物</text>
|
|
</view>
|
|
</view>
|