132 lines
3.7 KiB
Plaintext
132 lines
3.7 KiB
Plaintext
|
<!-- 找对象页 U19-U20（重构：ui-user-card + matchStore + recommendationService.discover） -->
|
|||
|
|
<view class="page">
|
|||
|
|
<!-- 搜索栏 -->
|
|||
|
|
<view class="search-bar">
|
|||
|
|
<view class="search-input">
|
|||
|
|
<text class="search-icon">🔍</text>
|
|||
|
|
<input
|
|||
|
|
class="search-field"
|
|||
|
|
placeholder="搜索符合条件的对象"
|
|||
|
|
placeholder-class="search-placeholder"
|
|||
|
|
value="{{keywordInput}}"
|
|||
|
|
bindinput="onKeywordInput"
|
|||
|
|
confirm-type="search"
|
|||
|
|
bindconfirm="onSearch"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
<view class="filter-btn {{showFilter ? 'active' : ''}} {{hasActiveFilter ? 'has-filter' : ''}}" bindtap="toggleFilter">
|
|||
|
|
<text>筛选</text>
|
|||
|
|
<view wx:if="{{hasActiveFilter}}" class="filter-dot"></view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 筛选面板 -->
|
|||
|
|
<view wx:if="{{showFilter}}" class="filter-panel">
|
|||
|
|
<view class="filter-section">
|
|||
|
|
<text class="filter-label">年龄范围</text>
|
|||
|
|
<view class="range-row">
|
|||
|
|
<text class="range-value">{{tempAgeMin}} 岁</text>
|
|||
|
|
<slider
|
|||
|
|
class="range-slider"
|
|||
|
|
min="{{18}}"
|
|||
|
|
max="{{60}}"
|
|||
|
|
value="{{tempAgeMin}}"
|
|||
|
|
activeColor="{{'#E96B6B'}}"
|
|||
|
|
backgroundColor="{{'#F0F0F0'}}"
|
|||
|
|
block-size="{{20}}"
|
|||
|
|
bindchange="onMinAgeChange"
|
|||
|
|
/>
|
|||
|
|
<text class="range-value">{{tempAgeMax}} 岁</text>
|
|||
|
|
</view>
|
|||
|
|
<slider
|
|||
|
|
class="range-slider"
|
|||
|
|
min="{{18}}"
|
|||
|
|
max="{{60}}"
|
|||
|
|
value="{{tempAgeMax}}"
|
|||
|
|
activeColor="{{'#E96B6B'}}"
|
|||
|
|
backgroundColor="{{'#F0F0F0'}}"
|
|||
|
|
block-size="{{20}}"
|
|||
|
|
bindchange="onMaxAgeChange"
|
|||
|
|
/>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="filter-section">
|
|||
|
|
<text class="filter-label">地区</text>
|
|||
|
|
<view class="tag-group">
|
|||
|
|
<view
|
|||
|
|
wx:for="{{regions}}"
|
|||
|
|
wx:key="*this"
|
|||
|
|
class="tag {{tempRegion === item ? 'selected' : ''}}"
|
|||
|
|
bindtap="onRegionTap"
|
|||
|
|
data-val="{{item}}"
|
|||
|
|
>{{item}}</view>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<view class="filter-actions">
|
|||
|
|
<ui-button variant="ghost" size="md" block bind:tap="onResetFilter">重置</ui-button>
|
|||
|
|
<ui-button variant="primary" size="md" block bind:tap="onApplyFilter">应用筛选</ui-button>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
<!-- 区块标题 -->
|
|||
|
|
<ui-section-header
|
|||
|
|
wx:if="{{users.length > 0 || loading}}"
|
|||
|
|
title="找对象"
|
|||
|
|
subtitle="{{hasActiveFilter ? '已应用筛选' : '共 ' + users.length + ' 位'}}"
|
|||
|
|
/>
|
|||
|
|
|
|||
|
|
<!-- 首次加载（骨架屏） -->
|
|||
|
|
<ui-loading
|
|||
|
|
wx:if="{{loading && users.length === 0}}"
|
|||
|
|
mode="skeleton"
|
|||
|
|
rows="5"
|
|||
|
|
/>
|
|||
|
|
|
|||
|
|
<!-- 用户列表 -->
|
|||
|
|
<block wx:elif="{{users.length > 0}}">
|
|||
|
|
<view class="user-list">
|
|||
|
|
<ui-user-card
|
|||
|
|
wx:for="{{users}}"
|
|||
|
|
wx:key="userId"
|
|||
|
|
user="{{item}}"
|
|||
|
|
bind:tap="onViewDetail"
|
|||
|
|
>
|
|||
|
|
<view
|
|||
|
|
slot="actions"
|
|||
|
|
class="card-action"
|
|||
|
|
catchtap="onLike"
|
|||
|
|
data-user-id="{{item.userId}}"
|
|||
|
|
>
|
|||
|
|
<ui-button
|
|||
|
|
variant="primary"
|
|||
|
|
size="sm"
|
|||
|
|
loading="{{actionLoadingUserId === item.userId}}"
|
|||
|
|
>喜欢</ui-button>
|
|||
|
|
</view>
|
|||
|
|
</ui-user-card>
|
|||
|
|
|
|||
|
|
<!-- 加载更多 -->
|
|||
|
|
<ui-loading
|
|||
|
|
wx:if="{{loadingMore}}"
|
|||
|
|
mode="spinner"
|
|||
|
|
inline
|
|||
|
|
text="加载更多…"
|
|||
|
|
/>
|
|||
|
|
<view wx:if="{{!hasMore && users.length > 0}}" class="list-end-hint">
|
|||
|
|
<text>没有更多了</text>
|
|||
|
|
</view>
|
|||
|
|
</view>
|
|||
|
|
</block>
|
|||
|
|
|
|||
|
|
<!-- 空状态 -->
|
|||
|
|
<ui-empty
|
|||
|
|
wx:elif="{{!loading}}"
|
|||
|
|
illustration="search"
|
|||
|
|
title="暂无符合条件的人选"
|
|||
|
|
description="尝试调整筛选条件，或看看今天为你推荐的人。"
|
|||
|
|
actions="{{emptyActions}}"
|
|||
|
|
bind:action="onEmptyAction"
|
|||
|
|
/>
|
|||
|
|
</view>
|