cqcarbonwxapp/pages/index/index.vue

<template>
	<view class="content">
		<view class="home-top">
			<image src="../../static/img/home-top-bg.png" class="home-top-bg" mode="widthFix"></image>
			<view class="home-top-til">“碳汇+”生态产品价值实现</view>
			<view class="home-top-subtil">The value of ecological environment is realized</view>
		</view>
		<view class="swiper-wrap">
			<swiper class="swiper"
			:indicator-dots="swiper.indicatorDots" 
			:indicator-color="swiper.indicatorColor"  
			:indicator-active-color="swiper.indicatorActiveColor" 
			:autoplay="swiper.autoplay" 			
			:interval="swiper.interval" :duration="swiper.duration">
				<swiper-item>
					<view class="adv-item"><image :src="$getimg +'guide01.png'" class="pic" mode="scaleToFill"></image></view>
				</swiper-item>
				<swiper-item>
					<view class="adv-item" @click="goIndex"><image :src="$getimg +'guide02.png'" class="pic" mode="widthFix"></image></view>
				</swiper-item>
			</swiper>
		</view>
		<view class="wrap40">
			<view class="title">推荐生态产品</view>
			<view class="buy-now">
				<view class="buy-now-imgwrap">
					<image src="../../static/img/home-buy-now-img.png" class="buy-now-img" mode="aspectFit"></image>
				</view>
				<view class="buy-now-text">
					<view class="buy-now-text-big">立即购碳</view>
					<view class="buy-now-text-small">点击去购碳哟</view>
				</view>
				<view class="buy-now-icon">
					<text class="iconfont icon-down-s"></text>
				</view>
			</view>
			<!-- buy-now end -->
			<view class="type-nav">
				<view class="type-nav-item">
					<view class="type-nav-item-til">林业碳汇</view>
					<view class="type-nav-item-subtil">为您推荐</view>
				</view>
				<view class="type-nav-item">
					<view class="type-nav-item-til">新能源汽车</view>
					<view class="type-nav-item-subtil">绿色出行</view>
				</view>
				<view class="type-nav-item">
					<view class="type-nav-item-til">分布式光伏</view>
					<view class="type-nav-item-subtil">新能源</view>
				</view>
			</view>
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				$getimg:this.$getimg,
				swiper: {
					indicatorDots: true,
					autoplay: true,
					interval: 9000,
					duration: 500,
					indicatorColor:"rgba(255, 255, 255, 0.7)",
					indicatorActiveColor:"rgba(255, 255, 255, 1)",
				},
				
			}
		},
		onLoad() {
			
		},
		methods: {

		}
	}
</script>

<style>
@import url("./index.css");
</style>