Blizzard
104 lines
3.7 KiB
Plaintext
104 lines
3.7 KiB
Plaintext
<!--pages/wiki/index.wxml-->
|
|
<view class="wiki-page">
|
|
|
|
<scroll-view
|
|
class="wiki-scroll-area"
|
|
scroll-y
|
|
bindscrolltolower="onReachBottom"
|
|
enhanced
|
|
show-scrollbar="{{false}}"
|
|
>
|
|
<view class="search-section">
|
|
<t-search placeholder="搜索植物名称，如：龟背竹" value="{{searchQuery}}" bind:change="onSearchInput" shape="round" />
|
|
</view>
|
|
|
|
<view class="category-scroll">
|
|
<t-tag
|
|
wx:for="{{['全部', '观叶', '观花', '多肉']}}"
|
|
wx:key="*this"
|
|
variant="{{activeCategory === item ? 'dark' : 'outline'}}"
|
|
theme="{{activeCategory === item ? 'primary' : 'default'}}"
|
|
shape="mark"
|
|
size="medium"
|
|
style="margin-right: 16rpx;"
|
|
bind:tap="setCategory"
|
|
data-cat="{{item}}"
|
|
>
|
|
{{item}}
|
|
</t-tag>
|
|
</view>
|
|
|
|
<view class="wiki-list">
|
|
<view wx:for="{{displayedList}}" wx:key="id" class="wiki-card" bindtap="goToDetail" data-item="{{item}}">
|
|
<view class="wiki-image">
|
|
<t-image src="/assets/{{item.images[0]}}" mode="aspectFill" width="100%" height="100%" lazy />
|
|
</view>
|
|
<view class="wiki-info">
|
|
<view class="wiki-top">
|
|
<text class="wiki-name">{{item.name}}</text>
|
|
<text class="scientific-name">{{item.scientificName}}</text>
|
|
</view>
|
|
|
|
<!-- Tags Row -->
|
|
<view class="tags-row">
|
|
<t-tag
|
|
wx:for="{{item.tags}}"
|
|
wx:key="*this"
|
|
wx:for-item="tag"
|
|
size="small"
|
|
variant="light"
|
|
theme="primary"
|
|
style="margin-right: 8rpx; margin-bottom: 8rpx;"
|
|
>
|
|
{{tag}}
|
|
</t-tag>
|
|
</view>
|
|
</view>
|
|
<t-icon name="chevron-right" size="48rpx" color="#ccc" />
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Loading / No More Data Footer -->
|
|
<view class="loading-footer">
|
|
<t-loading wx:if="{{isLoading}}" theme="circular" size="40rpx" text="加载中..." inherit-color />
|
|
<text wx:elif="{{!hasMore && displayedList.length > 0}}" class="no-more-text">没有更多了</text>
|
|
<view wx:elif="{{!hasMore && displayedList.length === 0}}" class="empty-state">
|
|
<text>没有找到相关植物</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- Spacer -->
|
|
<view style="height: 160rpx;"></view>
|
|
</scroll-view>
|
|
|
|
<t-fab icon="scan" text="植物识别" bind:click="openIdentifyModal" aria-label="植物识别"></t-fab>
|
|
|
|
<!-- Identify Popup -->
|
|
<t-popup visible="{{showIdentifyModal}}" bind:visible-change="onPopupVisibleChange" placement="bottom">
|
|
<view class="popup-content">
|
|
<view class="popup-header">
|
|
<text class="popup-title">识别植物</text>
|
|
</view>
|
|
|
|
<view class="upload-options-grid">
|
|
<view class="upload-opt-item">
|
|
<view class="opt-icon-circle" style="background: #E8F5E9;">
|
|
<t-icon name="camera" size="64rpx" color="#2E7D32" />
|
|
</view>
|
|
<text>拍照识别</text>
|
|
</view>
|
|
<view class="upload-opt-item">
|
|
<view class="opt-icon-circle" style="background: #E3F2FD;">
|
|
<t-icon name="image" size="64rpx" color="#1565C0" />
|
|
</view>
|
|
<text>从相册上传</text>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="popup-footer">
|
|
<t-button block variant="outline" bind:tap="closeIdentifyModal">取消</t-button>
|
|
</view>
|
|
</view>
|
|
</t-popup>
|
|
</view>
|