feat: ui update

This commit is contained in:
2026-09-15 16:01:59 +08:00
parent 1a11816839
commit 26c392d612
89 changed files with 10377 additions and 4861 deletions
@@ -1,67 +1,79 @@
<view class="page page-flex">
<navigation-bar title="分享" back="{{false}}" />
<navigation-bar title="分享" back="{{false}}" scrolled="{{navScrolled}}">
<view slot="right" class="nav-action nav-action--ink" bindtap="onCreate">新建</view>
</navigation-bar>
<!-- 分段切换 -->
<view class="seg-wrap">
<view class="seg-control">
<view
wx:for="{{tabs}}"
wx:key="name"
class="seg-item {{activeTab === index ? 'active' : ''}}"
data-index="{{index}}"
bindtap="onTabTap"
>{{item.name}}</view>
<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>
<scroll-view scroll-y class="scroll-body" bindscrolltolower="onReachBottom">
<view wx:if="{{activeTab === 0}}" class="new-btn btn btn-outline" bindtap="onCreate">+ 新建分享</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="{{!loading && !list.length}}"
icon="icon-share"
title="{{activeTab === 0 ? '还没有分享' : '还没有收到分享'}}"
desc="{{activeTab === 0 ? '把衣橱或精选衣物分享给好友' : '好友分享给你的衣橱或穿搭会出现在这里'}}"
desc="{{activeTab === 0 ? '把衣橱、精选衣物或穿搭分享给好友' : '好友分享给你的衣橱或穿搭会出现在这里'}}"
buttonText="{{activeTab === 0 ? '新建分享' : ''}}"
bind:action="onCreate"
/>
<view class="list">
<!-- 横向条目卡:左缩略图 + 右标题/有效期 -->
<view class="cs-list">
<view
class="share-card card {{item._invalid ? 'invalid' : ''}}"
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="preview-grid" wx:if="{{item.kind === 'closet'}}">
<view class="pg-cell"><view class="icon icon-hanger"></view></view>
<view class="pg-cell"><view class="icon icon-hanger"></view></view>
<view class="pg-cell"><view class="icon icon-hanger"></view></view>
<view class="pg-cell"><view class="icon icon-hanger"></view></view>
<!-- 衣柜分享:无缝四宫格 -->
<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="preview-cover" wx:else>
<image wx:if="{{item.cover}}" class="preview-cover-img" src="{{item.cover}}" mode="aspectFill" />
<view wx:else class="icon icon-hanger preview-cover-ph"></view>
<view class="cs-thumb is-photo" wx:else>
<image wx:if="{{item.cover}}" class="pic" src="{{item.cover}}" mode="aspectFill" />
<view wx:else class="ph icon icon-hanger"></view>
</view>
<view class="share-info">
<view wx:if="{{activeTab === 1}}" class="owner-row">
<image wx:if="{{item.owner_avatar}}" class="owner-avatar" src="{{item.owner_avatar}}" mode="aspectFill" />
<view wx:else class="owner-avatar owner-avatar-placeholder">
<view class="icon icon-user owner-avatar-icon"></view>
<view class="cs-body">
<view class="cs-owner" wx:if="{{activeTab === 1}}">
<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="owner-name">{{item.owner_name || '好友'}}</text>
<text class="onm">{{item.owner_name || '好友'}}</text>
</view>
<view class="cs-t">{{item.title}}</view>
<view class="cs-tags">
<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 class="share-title">{{item.title}}</view>
<view class="tag tag-gray share-type">{{item.typeText}}</view>
<view class="share-expire">{{item.expireText}}</view>
</view>
<view wx:if="{{item._invalid}}" class="share-badge">{{item.status === 2 ? '已取消' : '已失效'}}</view>
</view>
</view>
<view wx:if="{{list.length && !hasMore}}" class="foot-note">没有更多了</view>
<view class="gap-64"></view>
</scroll-view>
</view>