besiweb/pages/my/activity.vue

<template>
	<view class="uni-main">
		<view class="sticky-nav">
			<view class="nav-box">
				<u-icon name="arrow-left" color="#000" size="48" @click="backHome()"></u-icon>
				<text class="rule-text">我的活动</text>
			</view>
		</view>
		<view class="uni-list-warp">
			<view v-if="dataList.length>0">
				
			</view>
			<view class="uni-empty" v-else>
				<view><image class="icon" src="../../static/index/icon/empty_data_icon.png"></image></view>
				<view><text class="empty">空空如也，去装饰一下这里吧.</text></view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				dataList:[]
			}
		},
		methods:{
			backHome() {
				uni.navigateBack({
					delta: 1
				});
			},
		}
	}
</script>

<style lang="less" scoped>
	page {
		height: 100%;
	}
	.uni-main {
		width: 100%;
		height: 100%;
		background-color: #f6f7f5;
		font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	}
	
	.sticky-nav {
		position: sticky;
		width: 100%;
		top: 0;
		z-index: 1;
	}
	.nav-box {
		width: 100%;
		padding-top: 50rpx;
		display: flex;
		align-items: center;
		background: #fff;
		height: 100rpx;
		padding-bottom: 50rpx;
	    /deep/.u-icon{
			margin-left: 20rpx!important;
		}
		.rule-text {
			font-size: 38rpx;
			color: #000;
			margin-left: 250rpx;
		}
	}
	/deep/.directory-content {
	    margin: 0 0 25rpx 25rpx;
		font-size: 35rpx;
		color: rgb(118,118,118);
	}
	.uni-list-warp {
		
	}
	.uni-empty {
		// height: 100%;
		margin-top: 60%;
		text-align: center;
		font-size: 32rpx;
		color: #FF7A55;
		// height: 100%;
	}
	.uni-empty .icon {
		width: 160rpx;
		height: 100rpx;
	}
</style>