alipay-emulator/pages/message/list-index.vue

118 lines
1.7 KiB
Vue

<template>
<view>
<MessageNavBar :phone="data.phone" :isScroll="data.isScroll">
<!-- <view v-for="index in 100">{{ index }}</view> -->
<!-- <List :phone="data.phone"></List> -->
<MessageList></MessageList>
</MessageNavBar>
</view>
</template>
<script setup>
import MessageNavBar from '@/components/message/message-nav-bar.vue'
import MessageList from '@/components/message/list.vue'
import {
ref,
reactive
} from 'vue'
import {
onLoad,
onPageScroll
} from "@dcloudio/uni-app";
import {
util
} from '@/utils/common.js';
import List from '@/components/call-log/list/list.vue';
const data = reactive({
navBar: {
title: '信息',
bgColor: '#FFFFFF',
},
phone: 'iphone',
isScroll: false
})
const options = [{
text: '取消',
style: {
backgroundColor: '#007aff'
}
}, {
text: '确认',
style: {
backgroundColor: '#dd524d'
}
}]
onLoad((options) => {
if (options.phone) {
data.phone = options.phone
}
})
onPageScroll((e) => {
console.log(e.scrollTop)
if (e.scrollTop > 60) {
data.isScroll = true
} else {
data.isScroll = false
}
})
</script>
<style>
@import '@/common/main.css';
page {
background-color: #FFFFFF;
}
</style>
<style lang="less">
::v-deep .uni-navbar__header-btns {
width: 100px !important;
flex: 1;
}
.iphone-style {
.mg-r-30 {
margin-right: 60rpx;
}
.mg-r-5 {
margin-right: 10rpx;
}
.left-icon {
width: 40rpx;
height: 40rpx;
}
.right-icon {
width: 48rpx;
height: 48rpx;
}
.left-text {
font-size: 32rpx;
color: #0278E2;
margin-left: 10rpx;
}
.center-text {
font-size: 32rpx;
color: #1a1a1a;
}
}
.mi-style {
.right-icon {
width: 40rpx;
height: 40rpx;
margin-right: 30rpx;
}
}
</style>