jingcai/pages/index/information.vue

<template>
	<view class="content">
		<view class="list" @click="navigator">
			<image class="img" src="../../static/img/zixun1.png" mode=""></image>
			<view class="text">
				{{$t('homeinformation.m1')}}
			</view>
		</view>
		<view class="">xian</view>
		<view class="list" @click="navigatorT"> 
			<image class="img" src="../../static/img/zixun2.png" mode=""></image>
			<view class="text">
				{{$t('homeinformation.m0')}}
			</view>
		</view>
		<view class="">xian</view>
		<view class="list" @click="navigatorY">
			<image class="img" src="../../static/img/zixun3.png" mode=""></image>
			<view class="text">
				{{$t('homeinformation.m2')}}
			</view>
		</view>
		<view class="">xian</view>
		<view class="list" @click="navigatorH">
			<image class="img" src="../../static/img/zixun4.png" mode=""></image>
			<view class="text">
				{{$t('login.a0')}}
			</view>
		</view>
		<view class="">xian</view>
		
		<view class="tit">
			{{$t('homeinformation.m4')}}
		</view>
		
		<view class="pro">
			<view class="im">
				<image class="image" src="../../static/img/zixun7.png" mode=""></image>
				<view class="wen">{{$t('homeinformation.m5')}}</view>
			</view>
			<view class="im">
				<image class="image" src="../../static/img/zixun8.png" mode=""></image>
				<view class="wen">{{$t('homeinformation.m6')}}</view>
			</view>
		</view>
		
		<view class="infor flex">
			<view class="im">
				<image class="image" src="../../static/img/zixun10.png" mode=""></image>
				<view class="wen">{{$t('homeinformation.m7')}}</view>
			</view>
			<view class="im">
				<image class="image" src="../../static/img/zixun6.png" mode=""></image>
				<view class="wen">{{$t('homeinformation.m8')}}</view>
			</view>
			<view class="im">
				<image class="image" src="../../static/img/zixun9.png" mode=""></image>
				<view class="wen">{{$t('homeinformation.m9')}}</view>
			</view>
		</view>
		<taber tab='information'></taber>
	</view>
</template>

<script>
	import taber from "@/components/footer/footer.vue";
	export default {
		components: {
			taber
		},
		data() {
			return {};
		},
		methods: {
			navigator() {
				uni.navigateTo({
					url: '/pages/introduce/introduce'
				})
			},
			navigatorT() {
				uni.navigateTo({
					url: '/pages/introduce/promotion'
				})
			},
			navigatorY() {
				uni.navigateTo({
					url: '/pages/introduce/game'
				})
			},
			navigatorH() {
				uni.switchTab({
					url: '/pages/entertainment/entertainment'
				})
			},
		}
	};
</script>

<style lang="scss">
.content{
	width: 750rpx;
	height: 1800rpx;
	background-color: $page-color-base;
	padding-top: var(--status-bar-height);
}

.list {
	height: 180rpx;
	display: flex;
	justify-content: start;
	.img {
		margin-left: 30rpx;
		margin-top: 20rpx;
		width: 200rpx;
		height: 160rpx;
	}
	.text {
		margin-left: 15rpx;
		margin-top: 30rpx;
		height: 29rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #FFFFFF;
		line-height: 39rpx;
	}
}
.pro {
	margin-top: 30rpx;
	display: flex;
	justify-content: center;
}
.im {
	margin-left: 30rpx;
	margin-right: 30rpx;
	width: 200rpx;
	height: 260rpx;
	// height: 100%;
	background-color: #191a1f;
}	
.image {
	margin-top: 20rpx;
	margin-left: 30rpx;
	width: 100rpx;
	height: 120rpx;
}
.wen {
	color: #FFFFFF;
	font-size: 20rpx;
	text-align: center;
	// height: 100%;
}
.infor {
	margin-top: 30rpx;
}

.tit {
	margin-top: 40rpx;
	text-align: center;
	height: 46rpx;
	font-size: 49rpx;
	font-weight: 500;
	color: #FFFFFF;
	line-height: 21rpx;
}

.img {
	margin-top: 26rpx;
	margin-left: 11rpx;
	width: 728rpx;
	height: 538rpx;
}
</style>