<template> <view class="content"> <view class="container"> <headers :titles="titles"><u-icon name="arrow-left" color="#fff" size="22"></u-icon></headers> <view class="box_"> <view class="title_">日交易汇总-2024/05/13</view> <view class="size_">收银员:李莎</view> <view class="size_">实收金额:400.00</view> <view class="size_">订单金额:100.00</view> <view class="size_">会员充值:300.00</view> <view class="bottom_"> <view class="">查看详情</view> <u-icon name="arrow-right" color="#333" size="18"></u-icon> </view> </view> </view> </view> </template> <script> import headers from '../../components/header/headers.vue' export default { data() { return { titles: "消息列表", } }, onShow() { // this.actList = ["1", "1", "1", "1", "1", ] // this.status = "nomore" 底部刷新结束 }, onPullDownRefresh() { console.log("刷新"); uni.stopPullDownRefresh() }, onReachBottom() { // this.show = true setTimeout(() => { console.log("加载执行"); }, 2000) }, components: { headers }, methods: { goback() { uni.navigateBack() } } } </script> <style scoped lang="scss"> .content { background: #f8f8f8; // background: linear-gradient(180deg, #B2D2FC 0%, #B2D2FC 14%, rgba(255, 255, 255, 0.84) 24%, rgba(255, 255, 255, 0.84) 100%); height: 100vh; } .container { width: 100%; background: #f8f8f8; box-sizing: border-box; padding-top: 88px; } .img-box { image { width: 100%; height: 100%; } } .box_ { width: 95%; background: #FFFFFF; border-radius: 8px; box-sizing: border-box; margin: 10px auto; box-sizing: border-box; padding: 15px; } .title_ { font-weight: bold; font-size: 16px; color: #333333; margin-bottom: 10px; } .size_ { font-weight: 500; font-size: 14px; color: #333333; margin-bottom: 10px; } .bottom_ { border-top: 1px solid #E8E8E8; width: 100%; box-sizing: border-box; padding-top: 10px; display: flex; align-items: center; justify-content: space-between; } </style>