消息时间轴

• 样式图例

• 示例代码

  <view class="cu-item text-blue">
    <view class="bg-blue shadow-blur content">
      <view class="cu-list menu-avatar radius">
        <view class="cu-item">
          <view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);"></view>
          <view class="content">
            <view class="text-grey">文晓港</view>
            <view class="text-gray text-sm">
              <text class="cuIcon-infofill text-red"></text> 消息未送达</view>
          </view>
          <view class="action">
            <view class="text-grey text-xs">22:20</view>
            <view class="cu-tag round bg-grey sm">5</view>
          </view>
        </view>
        <view class="cu-item">
          <view class="cu-avatar round lg" style="background-image:url(https://ossweb-img.qq.com/images/lol/web201310/skin/big10006.jpg);">
            <view class="cu-tag badge">99+</view>
          </view>
          <view class="content">
            <view class="text-grey">文晓港
              <view class="cu-tag round orange sm">SVIP</view>
            </view>
            <view class="text-gray text-sm">
              <text class="cuIcon-redpacket_fill text-red"></text> 收到红包</view>
          </view>
          <view class="action">
            <view class="text-grey text-xs">22:20</view>
            <text class="cuIcon-notice_forbid_fill text-gray"></text>
          </view>
        </view>
      </view>
    </view>
  </view>