zhengchiliu
f169777f4a
引入 cached-image 组件与 image-cache 工具，实现签名 URL 稳定 key 剥离、downloadFile 落盘及 TTL/LRU 清理，替换 11 个页面与 clothes-card 共 22 处网络图片渲染点，减少 CDN 重复流量。
115 lines
3.8 KiB
Plaintext
115 lines
3.8 KiB
Plaintext
<wxs module="cl">
|
|
function cls(n) {
|
|
if (n >= 4) return ''
|
|
if (n === 3) return 'collage--3'
|
|
if (n === 2) return 'collage--2'
|
|
return 'collage--1'
|
|
}
|
|
module.exports = { cls: cls }
|
|
</wxs>
|
|
|
|
<view class="page page-flex">
|
|
<navigation-bar title="穿搭分享" scrolled="{{navScrolled}}" />
|
|
|
|
<empty-state
|
|
wx:if="{{invalid && needLogin}}"
|
|
icon="icon-user"
|
|
title="{{invalidTitle}}"
|
|
desc="{{invalidDesc}}"
|
|
buttonText="去登录"
|
|
bind:action="onGoLogin"
|
|
/>
|
|
|
|
<empty-state
|
|
wx:elif="{{invalid}}"
|
|
icon="icon-shirt"
|
|
title="{{invalidTitle}}"
|
|
desc="{{invalidDesc}}"
|
|
buttonText="返回首页"
|
|
bind:action="onBackHome"
|
|
/>
|
|
|
|
<scroll-view wx:else scroll-y class="scroll-body pb-dock" bindscroll="onNavScroll">
|
|
<!-- 分享者行 -->
|
|
<view class="head">
|
|
<view class="eyebrow">Shared Look</view>
|
|
<view class="display">{{outfit.outfit_name}}</view>
|
|
</view>
|
|
|
|
<view class="osd-owner">
|
|
<view class="osd-av">
|
|
<cached-image wx:if="{{detail.owner_avatar}}" class="pic" src="{{detail.owner_avatar}}" mode="aspectFill" />
|
|
<view wx:else class="icon icon-user"></view>
|
|
</view>
|
|
<view class="osd-owner-body">
|
|
<view class="osd-owner-n">{{detail.owner_name || '好友'}} 分享了穿搭</view>
|
|
<view class="osd-owner-e num">共 {{outfit.items.length}} 件单品</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 无缝拼图封面 -->
|
|
<view class="osd-cover">
|
|
<view class="collage {{cl.cls(outfit.items.length)}}">
|
|
<view class="cg" wx:for="{{outfit.items}}" wx:key="clothes_uuid" wx:if="{{index < 4}}">
|
|
<cached-image wx:if="{{item.processed_image}}" class="pic" src="{{item.processed_image}}" mode="aspectFill" />
|
|
<view wx:else class="ph icon icon-hanger"></view>
|
|
</view>
|
|
<view wx:if="{{outfit.items.length > 4}}" class="cg-more">+{{outfit.items.length - 4}}</view>
|
|
<text class="cg-badge num">{{outfit.items.length}} 件</text>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 信息区 -->
|
|
<view class="osd-info">
|
|
<view class="osd-tags">
|
|
<text wx:if="{{outfit.scene}}" class="pill pill--line">{{outfit.scene}}</text>
|
|
<text class="pill {{outfit.source === 2 ? 'pill--ink' : ''}}">{{outfit.source === 2 ? 'AI 推荐' : '自建'}}</text>
|
|
</view>
|
|
<view class="t-bd osd-desc" wx:if="{{outfit.outfit_desc}}">{{outfit.outfit_desc}}</view>
|
|
</view>
|
|
|
|
<!-- 包含衣物：横滑（点击只读查看） -->
|
|
<view class="osd-items">
|
|
<view class="grp-hd">
|
|
<text class="gh-cn">包含衣物</text>
|
|
<text class="gh-en">Items</text>
|
|
</view>
|
|
<scroll-view scroll-x class="osd-items-scroll" show-scrollbar="{{false}}">
|
|
<view class="osd-items-row">
|
|
<view
|
|
class="osd-chip"
|
|
wx:for="{{outfit.items}}"
|
|
wx:key="clothes_uuid"
|
|
data-uuid="{{item.clothes_uuid}}"
|
|
bindtap="onItemTap"
|
|
>
|
|
<view class="osd-thumb">
|
|
<cached-image wx:if="{{item.processed_image}}" class="pic" src="{{item.processed_image}}" mode="aspectFill" />
|
|
<view wx:else class="ph icon icon-hanger"></view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
|
|
<view class="gap-64"></view>
|
|
</scroll-view>
|
|
|
|
<!-- 悬浮玻璃操作条 -->
|
|
<view class="dock" wx:if="{{!invalid}}">
|
|
<view wx:if="{{detail.is_owner}}" class="btn--text osd-cancel" bindtap="onCancel">取消分享</view>
|
|
<button class="btn btn--ink btn--block" open-type="share">分享给好友</button>
|
|
</view>
|
|
|
|
<!-- 取消分享确认 -->
|
|
<v2-overlay
|
|
visible="{{cancelVisible}}"
|
|
type="modal"
|
|
title="取消分享"
|
|
content="{{cancelContent}}"
|
|
buttons="{{cancelButtons}}"
|
|
bind:confirm="onCancelConfirm"
|
|
bind:cancel="onCancelCancel"
|
|
/>
|
|
</view>
|