Files
zt-closet-wxmini-frontend/miniprogram/pages/closet-share/closet-share.wxml
T
zhengchiliu f169777f4a feat(image-cache): 新增图片本地缓存并全站接入
引入 cached-image 组件与 image-cache 工具,实现签名 URL 稳定 key 剥离、downloadFile 落盘及 TTL/LRU 清理,替换 11 个页面与 clothes-card 共 22 处网络图片渲染点,减少 CDN 重复流量。
2026-09-26 19:49:54 +08:00

93 lines
3.7 KiB
Plaintext

<view class="page page-flex">
<navigation-bar title="分享" back="{{false}}" scrolled="{{navScrolled}}">
<view slot="right" class="nav-action nav-action--ink" bindtap="onCreate">新建</view>
</navigation-bar>
<scroll-view scroll-y class="scroll-body pb-tab" bindscrolltolower="onReachBottom" bindscroll="onNavScroll">
<!-- 大标题页头 -->
<view class="head">
<view class="eyebrow">Sharing</view>
<view class="display">分享</view>
</view>
<!-- 游客态提示条:未登录也可先浏览,登录由用户自行选择 -->
<view wx:if="{{guest}}" class="guest-bar" bindtap="onGuestLogin">
<view class="icon icon-lock"></view>
<text class="gb-t">浏览模式 · 以下为示例分享</text>
<text class="gb-a">登录</text>
<view class="icon icon-chevron-right"></view>
</view>
<!-- 下划线式文字分段 -->
<view class="segbar">
<view class="seg">
<view
wx:for="{{tabs}}"
wx:key="name"
class="seg-item {{activeTab === index ? 'is-on' : ''}}"
data-index="{{index}}"
bindtap="onTabTap"
>{{item.name}}</view>
</view>
</view>
<empty-state
wx:if="{{!guest && !loading && !list.length}}"
icon="icon-share"
title="{{activeTab === 0 ? '还没有分享' : '还没有收到分享'}}"
desc="{{activeTab === 0 ? '把衣橱、精选衣物或穿搭分享给好友' : '好友分享给你的衣橱或穿搭会出现在这里'}}"
buttonText="{{activeTab === 0 ? '新建分享' : ''}}"
bind:action="onCreate"
/>
<!-- 横向条目卡:左缩略图 + 右标题/有效期 -->
<view class="cs-list">
<view
class="cs-card {{item._invalid ? 'is-dead' : ''}}"
wx:for="{{list}}"
wx:key="share_uuid"
data-uuid="{{item.share_uuid}}"
data-kind="{{item.kind}}"
bindtap="onItemTap"
>
<!-- 衣柜分享:无缝四宫格 -->
<view class="cs-thumb" wx:if="{{item.kind === 'closet'}}">
<view class="c"><view class="icon icon-hanger"></view></view>
<view class="c"><view class="icon icon-hanger"></view></view>
<view class="c"><view class="icon icon-hanger"></view></view>
<view class="c"><view class="icon icon-hanger"></view></view>
</view>
<!-- 穿搭分享:封面 -->
<view class="cs-thumb is-photo" wx:else>
<cached-image wx:if="{{item.cover}}" class="pic" src="{{item.cover}}" mode="aspectFill" />
<view wx:else class="ph icon icon-hanger"></view>
</view>
<view class="cs-body">
<view class="cs-owner" wx:if="{{activeTab === 1}}">
<cached-image wx:if="{{item.owner_avatar}}" class="oav" src="{{item.owner_avatar}}" mode="aspectFill" />
<view wx:else class="oav">
<view class="icon icon-user"></view>
</view>
<text class="onm">{{item.owner_name || '好友'}}</text>
</view>
<view class="cs-t">{{item.title}}</view>
<view class="cs-tags">
<text wx:if="{{guest}}" class="pill">示例</text>
<text class="pill">{{item.typeText}}</text>
<text wx:if="{{item._invalid}}" class="pill pill--line">{{item.expireText}}</text>
<text wx:else class="cs-exp">{{item.expireText}}</text>
</view>
</view>
</view>
</view>
<view wx:if="{{!guest && list.length && !hasMore}}" class="foot-note">没有更多了</view>
<view wx:if="{{guest}}" class="guest-foot" bindtap="onGuestLogin">
<text>登录后可创建分享,并查看好友分享给你的内容</text>
<text class="gf-a">去登录</text>
</view>
<view class="gap-64"></view>
</scroll-view>
</view>