Files
zt-closet-wxmini-frontend/miniprogram/pages/notification/notification.wxml
T
2026-09-15 16:01:59 +08:00

65 lines
2.1 KiB
Plaintext

<view class="page page-flex">
<navigation-bar title="通知" scrolled="{{navScrolled}}" />
<scroll-view scroll-y class="scroll-body" bindscrolltolower="onReachBottom" bindscroll="onNavScroll">
<!-- 大标题页头 -->
<view class="head">
<view class="eyebrow">Notifications</view>
<view class="display">通知</view>
</view>
<!-- 下划线式筛选 -->
<view class="segbar">
<view class="seg">
<view
wx:for="{{filters}}"
wx:key="name"
class="seg-item {{activeFilter === index ? 'is-on' : ''}}"
data-index="{{index}}"
bindtap="onFilterTap"
>{{item.name}}</view>
</view>
</view>
<!-- 骨架屏 -->
<view wx:if="{{loading}}" class="nt-skel">
<view class="nt-skel-item" wx:for="{{[1, 2, 3]}}" wx:key="*this">
<view class="sk sk-ln" style="width: 52%;"></view>
<view class="sk sk-ln" style="width: 86%;"></view>
<view class="sk sk-ln" style="width: 30%;"></view>
</view>
</view>
<!-- 空态 -->
<empty-state
wx:elif="{{!list.length}}"
icon="icon-bell"
title="还没有消息"
desc="穿搭被点赞、订单动态都会出现在这里"
/>
<!-- 列表:未读左侧黑竖条 + 黑字标题,已读降为 ink-3 -->
<view wx:else class="nt-list">
<view
class="nt-item {{item.is_read === 1 ? 'is-unread' : ''}}"
wx:for="{{list}}"
wx:key="notification_uuid"
data-uuid="{{item.notification_uuid}}"
bindtap="onItemTap"
>
<view class="nt-ic">
<view class="icon {{item.msg_type === 1 ? 'icon-heart' : item.msg_type === 2 ? 'icon-doc' : 'icon-bell'}}"></view>
</view>
<view class="nt-body">
<view class="nt-t">{{item.title}}</view>
<view class="nt-c">{{item.content}}</view>
<view class="nt-time num">{{item._time}}</view>
</view>
</view>
</view>
<view wx:if="{{list.length && !hasMore}}" class="foot-note">没有更多了</view>
<view class="gap-32"></view>
</scroll-view>
</view>