Files
zt-closet-wxmini-frontend/miniprogram/pages/wardrobe/wardrobe.wxml
T

85 lines
2.5 KiB
Plaintext

<view class="page page-flex">
<navigation-bar title="我的衣橱" back="{{false}}" scrolled="{{navScrolled}}" />
<scroll-view
scroll-y
class="scroll-body pb-tab"
refresher-enabled
refresher-triggered="{{refreshing}}"
bindrefresherrefresh="onRefresh"
bindscrolltolower="onReachBottom"
bindscroll="onNavScroll"
>
<!-- 大标题页头 -->
<view class="head">
<view class="eyebrow">Wardrobe</view>
<view class="display">我的衣橱</view>
<view class="wd-stat num">共 {{total}} 件 · 上传额度剩余 {{uploadRemain}} 次</view>
</view>
<!-- 下划线式极简分类条 -->
<view class="segbar">
<scroll-view scroll-x class="seg-scroll" show-scrollbar="{{false}}">
<view class="seg">
<view
wx:for="{{categories}}"
wx:key="name"
class="seg-item {{activeCategory === index ? 'is-on' : ''}}"
data-index="{{index}}"
bindtap="onCategoryTap"
>{{item.name}}</view>
</view>
</scroll-view>
</view>
<!-- 骨架屏 -->
<view wx:if="{{loading}}" class="wd-grid">
<view class="wd-skel" wx:for="{{[1, 2, 3, 4, 5, 6]}}" wx:key="*this">
<view class="sk sk-img"></view>
<view class="sk sk-ln" style="width: 70%;"></view>
<view class="sk sk-ln" style="width: 46%;"></view>
</view>
</view>
<!-- 空态 -->
<empty-state
wx:elif="{{!list.length}}"
icon="icon-hanger"
title="衣橱还空着"
desc="拍照上传第一件衣物,AI 自动抠图并识别属性"
buttonText="上传衣物"
bind:action="onUpload"
/>
<!-- 衣物网格 -->
<view wx:else class="wd-grid">
<view class="wd-tile" wx:for="{{list}}" wx:key="clothes_uuid">
<clothes-card
item="{{item}}"
statusText="{{item._statusText}}"
statusType="{{item._statusType}}"
bind:select="onClothesTap"
/>
</view>
</view>
<view wx:if="{{list.length && !hasMore}}" class="foot-note">没有更多了</view>
<view class="gap-64"></view>
</scroll-view>
<view class="fab" bindtap="onUpload">
<view class="icon icon-plus"></view>
</view>
<!-- 处理失败提示:「上传后退出小程序」的失败结果回归告知 -->
<v2-overlay
visible="{{failVisible}}"
type="modal"
title="AI 识别失败"
content="{{failText}}"
buttons="{{failButtons}}"
bind:confirm="onFailConfirm"
bind:cancel="onFailCancel"
/>
</view>