91 lines
3.6 KiB
Plaintext
91 lines
3.6 KiB
Plaintext
<view class="page rec-page">
|
|
<navigation-bar title="AI 穿搭推荐" />
|
|
|
|
<!-- 生成中 -->
|
|
<view wx:if="{{state === 'generating'}}" class="generating">
|
|
<view class="gen-ani">
|
|
<view class="icon icon-shirt gen-icon"></view>
|
|
<view class="gen-ring"></view>
|
|
</view>
|
|
<view class="gen-title">AI 正在为你搭配…</view>
|
|
<view class="gen-desc">结合今日运势与你的衣橱</view>
|
|
</view>
|
|
|
|
<!-- 衣橱为空 -->
|
|
<empty-state
|
|
wx:elif="{{state === 'empty'}}"
|
|
icon="icon-hanger"
|
|
title="还没有可用衣物"
|
|
desc="先上传几件处理成功的衣物吧"
|
|
buttonText="去上传"
|
|
bind:action="onGoUpload"
|
|
/>
|
|
|
|
<!-- 结果页 -->
|
|
<scroll-view wx:elif="{{state === 'result'}}" scroll-y class="scroll-body">
|
|
<view class="card result-cover">
|
|
<view class="rc-item rc-{{index}}" wx:for="{{clothes}}" wx:key="clothes_uuid" wx:if="{{index < 5}}">
|
|
<image wx:if="{{item.processed_image}}" class="rc-img" src="{{item.processed_image}}" mode="aspectFit" />
|
|
<view wx:else class="icon icon-hanger rc-placeholder"></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="card result-info">
|
|
<view class="ri-title">{{result.outfit_name}}</view>
|
|
<view class="ri-desc">{{result.outfit_desc}}</view>
|
|
<view class="tag-row">
|
|
<text wx:if="{{result.scene}}" class="tag tag-gray">{{result.scene}}</text>
|
|
<text class="tag tag-indigo">AI 推荐</text>
|
|
</view>
|
|
|
|
<view class="items-title">推荐单品</view>
|
|
<scroll-view scroll-x class="items-scroll" show-scrollbar="{{false}}">
|
|
<view class="items-row">
|
|
<view class="item-chip" wx:for="{{clothes}}" wx:key="clothes_uuid">
|
|
<image wx:if="{{item.processed_image}}" class="item-img" src="{{item.processed_image}}" mode="aspectFill" />
|
|
<view wx:else class="item-img item-img-empty"><view class="icon icon-hanger"></view></view>
|
|
<text class="item-name">{{item.name || '未命名'}}</text>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<view class="footer">
|
|
<view class="btn btn-primary" bindtap="onSave">保存到我的穿搭</view>
|
|
<view class="btn btn-outline reroll" bindtap="onReroll">换一套</view>
|
|
<view class="reroll-tip">换一套将再消耗 1 次推荐额度</view>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<!-- 场景选择弹窗 -->
|
|
<view wx:if="{{showSceneSheet}}" class="mask" bindtap="onSkipScene">
|
|
<view class="sheet" catchtap="noop">
|
|
<view class="sheet-grabber"></view>
|
|
<view class="sheet-title">选择推荐场景</view>
|
|
|
|
<view class="scene-card {{sceneType === 1 ? 'active' : ''}}" bindtap="selectDaily">
|
|
<view class="scene-name">每日推荐</view>
|
|
<view class="scene-desc">按今日运势与衣橱自动搭配</view>
|
|
<view wx:if="{{sceneType === 1}}" class="icon icon-check scene-check"></view>
|
|
</view>
|
|
|
|
<view class="scene-card {{sceneType === 2 ? 'active' : ''}}" bindtap="selectCustom">
|
|
<view class="scene-name">自定义场景</view>
|
|
<view class="scene-desc">描述你想去的场合</view>
|
|
<view wx:if="{{sceneType === 2}}" class="icon icon-check scene-check"></view>
|
|
</view>
|
|
|
|
<input
|
|
wx:if="{{sceneType === 2}}"
|
|
class="input scene-input"
|
|
value="{{scene}}"
|
|
bindinput="onSceneInput"
|
|
placeholder="例如：海边度假、周一例会、初次约会"
|
|
/>
|
|
|
|
<view class="btn btn-primary sheet-btn" bindtap="onStartGenerate">开始生成（消耗 1 次推荐额度）</view>
|
|
<view class="sheet-skip" bindtap="onSkipScene">跳过，使用每日推荐</view>
|
|
</view>
|
|
</view>
|
|
</view>
|