Newer
Older
xinJiangMiniProgranm / pages / messageList / messageList.vue
<!-- 网信信息列表 -->
<template>
	<view class="message-list">
		<view class="tab-area">
			<u-tabs 
				:list="tabList" 
				:scrollable="false" 
				:current="currentTab"
				lineColor="#0096e0"
				lineWidth="50"
				lineHeight="5"
				@click="clickTab">
			</u-tabs>
		</view>
		
		<view class="event-area">
			<EventList :list="eventList"/>
		</view>
		<u-loadmore :status="status" />
		<!-- 返回顶部 -->
		<u-back-top 
			:scroll-top="scrollTop" 
			icon="arrow-up" 
			duration="200"
		></u-back-top>
	</view>
</template>

<script>
	import EventList from '../../components/index/eventList.vue';
	import { getLocationParams } from '../../common/utils.js';
	export default {
		name: 'MessageList',
		components: {
			EventList
		},
		data() {
			return {
				scrollTop: 0,
				currentTab: '0', //当前选中的标签的索引
				status: 'nomore', //上滑加载状态 loading加载中,nomore没有更多了
				tabList: [
					{
						name: '法律法规'
					},
					{
						name: '工作动态'
					},
					{
						name: '网络辟谣'
					},
				],
				eventList: [{
							title: '法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},],  //事件数据
			}
		},
		mounted() {
			uni.showShareMenu({
				withShareTicket: true,
				menus: ["shareAppMessage", "shareTimeline"]
			});
			
			this.currentTab = getLocationParams('tabIndex');
			this.clickTab(null, this.currentTab);
		},
		//分享好友
		onShareAppMessage() {
			return {
				title: ' ',
				// imageUrl: '../../static/share.png',
				path: "/pages/messageList/messageList",
			};
		},
		//分享朋友圈
		onShareTimeline() {
			return {
				title: '新疆网络举报',
			}
		},
		// 监听滚动条位置
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		//下拉刷新
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		//上滑加载
		onReachBottom() {
			
		},
		methods: {
			clickTab(val, currentTab) {
				console.log(val)
				if((val && val.index === 0) || currentTab === '0') {
					this.eventList = [
						{
							title: '法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '法律法规法律法规法律法规法律法规',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
					]
				} else if((val && val.index === 1) || currentTab === '1') {
					this.eventList = [
						{
							title: '工作动态',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '工作动态工作动态工作动态工作动态工作动态工作动态',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '工作动态工作动态工作动态',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
					]
				} else if((val && val.index === 2) || currentTab === '2') {
					this.eventList = [
						{
							title: '网络辟谣',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '网络辟谣网络辟谣网络辟谣网络辟谣',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
						{
							title: '网络辟谣网络辟谣网络辟谣',
							time: '2121-12-12 12:02:20',
							img: '../../static/share.png'
						},
					]
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.message-list {
		padding-bottom: 40rpx;
		.tab-area {
			padding: 20rpx;
			background-color: #fff;
		}
	}

</style>