jigesi/pages/index.vue

<template>
	<view class="container" :style="{background:`url(${picUrl+'/static/other/indexB.png'}) no-repeat;`}">
		<navBar title="GIGESI 吉格斯" :navImg="navImg" :back="false" color="#333333" background="#FFFFFF" />

		<!-- 轮播和订购区 -->
		<view class="swiperAndBook">
			<view class="tab">
				<view class="item" v-for="(item,index) in tabList" :class="[currTabIndex==index?'itemA':'']"
					@click="tabChange(item,index)">
					{{item}}
				</view>
			</view>
			<view class="bottomBtn">
				<swiper :current="currTabIndex" @change="bindChange" class='swiperImg'>
					<swiper-item class="swiperImg">
						<image class="swiperImg" :src="picBase+bannerList11[0].cover" mode="widthFix"></image>
					</swiper-item class="swiperImg">
					<swiper-item>
						<image class="swiperImg" :src="picBase+bannerList22[0].cover" mode="widthFix"></image>
					</swiper-item>
					<swiper-item class="swiperImg">
						<image class="swiperImg" :src="picBase+bannerList33[0].cover" mode="widthFix"></image>
					</swiper-item>
				</swiper>
				<view class="bookingAndIndicator">
					<view class="btn" @click="toList">
						<text class="btnTxt">一键定制</text>
						<image :src="picUrl+'/static/other/halfRight.png'" mode="" style="width: 30rpx;height: 20rpx;">
						</image>
					</view>
					<view class="indicatorBox">
						<view class="indicator">
							<view class="indicator__dot" style="" v-for="(item, index) in tabList" :key="index"
								:class="[index === currTabIndex ?'indicator__dot--active':'']">
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		<view class="bg" style="">
			<view class="controlPart" @click="toPage(1)">
				<view class="top">
					<view class="left">
						<image src="/static/index/part1_icon.png" mode="" style="width: 56rpx;height: 28rpx;">
						</image>
						<view class="title">
							智能控制系统
						</view>
					</view>
					<image src="/static/index/more.png" mode="" style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="con">
					<image :src="picBase+bannerList44[0].cover" mode="aspectFill"></image>
				</view>
			</view>

			<view class="controlPart" @click="toPage(2)">
				<view class="top">
					<view class="left">
						<image src="/static/index/part1_icon.png" mode="" style="width: 56rpx;height: 28rpx;">
						</image>
						<view class="title">
							网络规划-全屋WiFi
						</view>
					</view>
					<image src="/static/index/more.png" mode="" style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="con">
					<image :src="picBase+bannerList55[0].cover" mode="aspectFill"></image>
				</view>
			</view>

			<!-- 产品指南 -->
			<view class="productLead">
				<view class="top" @click="toPage(3)">
					<view class="left">
						<view class="bottomEng">
							PRODUCT GUIDE
						</view>
						<view class="bt">
							<view class="title">
								产品指南
							</view>
							<image src="/static/index/zhinan.png" mode="" style="width: 32rpx;height: 32rpx;">
							</image>
						</view>
					</view>
					<image src="/static/index/more.png" mode="" style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="con">
					<view class="item" v-for="(item,index) in leadList" @click="toLeadDetail(item)">
						<image :src="picBase+item.image" mode=""></image>
						<view class="bottom">
							{{item.title}}
						</view>
					</view>
				</view>
			</view>


			<!-- 展厅地址 -->
			<view class="productLead" style="padding-left: 0;">
				<view class="top" style="padding-left: 32rpx;" @click="toAddrList">
					<view class="left">
						<view class="bottomEng">
							ADDRESS
						</view>
						<view class="bt">
							<view class="title">
								城市展厅
							</view>
							<image src="/static/index/addr.png" mode="" style="width: 26rpx;height: 36rpx;"></image>
						</view>
					</view>
					<image src="/static/index/more.png" mode="" style="width: 48rpx;height: 48rpx;"></image>
				</view>
				<view class="conLast">

					<u-swiper type='def' class="swiper" :defList="bannerList1" keyName="img_url" indicator
						indicatorMode="line" :autoplay="true" previousMargin="30" nextMargin="30" height="490rpx"
						radius="40rpx" imgMode="scaleToFill" bgColor="rgba(255,255,255,0)" circular
						@change="e => currentNum1 = e.current" @click1="jumpLink">
						<view slot="indicator">
						</view>
						<view slot="defCon">
						</view>
					</u-swiper>
					<!-- 自定义轮播图指示器 -->
					<view class="indicatorBox1">
						<view class="indicator1">
							<view class="indicator1__dot1" style="" v-for="(item, index) in bannerList1" :key="index"
								:class="[index === currentNum1 ?'indicator1__dot1--active1':'']">
							</view>
						</view>
					</view>
				</view>
			</view>

			<u-loadmore style="" loadmoreText="已经到底啦" color="#CCCCCC" lineColor="#CCCCCC" line />
		</view>
		<u-loading-page :loading="loading" image="/static/index/logo.png" loading-text="页面加载中..."></u-loading-page>

		<!-- 隐私弹框 -->
		<privacy-popup @confirmP="confirmP" @cancleP="cancleP" :showPrivateBox="showPop"></privacy-popup>
	</view>
</template>

<script>
	import PrivacyPopup from "@/components/privacyPopup/index.vue";
	import {
		getBannerDataReq,
		getAddressDataReq,
		getGuideDataReq,
	} from '@/api/index/index.js'
	import {
		getPricePercentReq,
		getAfterSaleCon,
		getIndexTopPics,
		addInviteReq
	} from '@/api/test/index.js'
	export default {
		components: {
			PrivacyPopup
		},
		data() {
			return {
				showPop: false,

				picUrl: this.$picUrl,
				picBase: this.$picBase,
				leadList: [],

				bannerList11: [],
				bannerList22: [],
				bannerList33: [],
				bannerList44: [],
				bannerList55: [],
				bannerList66: [],


				bannerList1: [],
				currentNum: 0,
				currentNum1: 0,

				tabList: ['无主灯', '主灯', '吸顶灯'],
				currTabIndex: 0,

				navImg: require('@/static/index/logo.png'),
				list: [],

				loading: true
			}
		},
		async onLoad(o) {

			// o.inviteId = ''
			let res55 = await getBannerDataReq()
			if (res55.code == 0) {
				console.log('首页全局配置数据:', res55);
				this.bannerList11 = [res55.data.find((item, index) => {
					return item.title == '无主灯'
				})]
				this.bannerList22 = [res55.data.find((item, index) => {
					return item.title == '主灯'
				})]
				this.bannerList33 = [res55.data.find((item, index) => {
					return item.title == '吸顶灯'
				})]

				this.bannerList44 = [res55.data.find((item, index) => {
					return item.title == '智能控制系统'
				})]
				this.bannerList55 = [res55.data.find((item, index) => {
					return item.title == '网络规划-全屋WiFi'
				})]

				console.log('全局静态资源数据', this.bannerList11, this.bannerList22, this.bannerList33, this
					.bannerList44, this.bannerList55);

				this.loading = false
			} else {
				this.loading = false
				this.$toast(res55.message)
			}

			if (o.inviteId) {
				uni.setStorageSync('inviteId', o.inviteId)
				console.log('接收到的o.inviteId', o.inviteId);
			}

			if (o.scene) {
				uni.setStorageSync('afterSaleId', o.scene)
				console.log('接收到的o.afterSaleId', o.scene);
			}
			// o.scene = 'b3f48188b03b54aeb32256c825044e35'
			if (uni.getStorageSync('token') && o.scene) {
				let res88 = await getAfterSaleCon({
					id: o.scene
				})
				if (res88.code == 0) {
					console.log('测试邀请:', res88);
				} else {
					this.$toast(res88.message)
				}
			}
			if (uni.getStorageSync('token') && o.inviteId) {
				let res99 = await addInviteReq({
					// id: o.inviteId
					inviteId: o.inviteId
				})
				if (res99.code == 0) {
					console.log('测试邀请登录态-----o.inviteId:', res99);
				} else {
					this.$toast(res99.message)
				}
			}
			console.log('首页收到的o:', JSON.stringify(o));

			let res1 = await getAddressDataReq()
			if (res1.code == 0) {
				this.bannerList1 = res1.data
				console.log('地址轮播图数据', this.bannerList1);
			} else {
				this.$toast(res1.message)
			}


			let res2 = await getGuideDataReq()
			if (res2.code == 0) {
				this.leadList = res2.data
				console.log('首页产品指南列表返回值：', this.leadList);
			} else {
				uni.showToast({
					title: res2.message,
					icon: 'none'
				})
			}

		},
		onShow() {
			this.handlePrivate()
		},
		methods: {
			confirmP() {
				this.showPop = false
				uni.showTabBar({
					animation: true, // 是否需要滚动动画，默认false
					success: function(res) {

					}
				})
			},
			cancleP() {

				console.log('cancelP()------');
				this.showPop = false
				uni.showTabBar({
					animation: true, // 是否需要滚动动画，默认false
					success: function(res) {

					}
				})
			},
			handlePrivate() {
				uni.hideTabBar()
				let _this = this
				if (uni.getPrivacySetting) {
					uni.getPrivacySetting({
						success: res => {
							console.log("是否需要授权--首页：", res.needAuthorization, "隐私协议的名称为：", res
								.privacyContractName)
							if (res.needAuthorization) {
								getApp().globalData.showPrivacy = true;
								_this.showPop = true
							} else {
								getApp().globalData.showPrivacy = false;
								uni.showTabBar({
									animation: true, // 是否需要滚动动画，默认false
									success: function(res) {}
								})
							}
						},
						fail: () => {},
						complete: () => {},
					})
				}
			},
			bindChange(e) {
				this.currTabIndex = e.detail.current
				console.log('e-----------', e.detail.current);
			},

			tabChange(item, index) {
				this.currTabIndex = index
			},
			toAddrList() {
				uni.navigateTo({
					url: '/pages/index/addrList/index'
				})
			},
			toLeadDetail(item) {
				getApp().Litem = item
				uni.navigateTo({
					url: '/pages/index/productLeadDetail/index'
				})
			},
			toList() {
				if (this.currTabIndex == 0) {
					getApp().noMainImg = this.bannerList11[0]
					uni.navigateTo({
						url: '/pages/index/customNoMian_step1/index'
					})

				} else if (this.currTabIndex == 1) {
					getApp().noMainImg = this.bannerList22[0]
					uni.navigateTo({
						url: '/pages/index/customMian_step1/index'
					})
				} else {
					getApp().noMainImg = this.bannerList33[0]
					uni.navigateTo({
						url: '/pages/index/customMian_step1/index?type=5'
					})
				}
			},
			toPage(i) {
				if (i == 2) {
					getApp().noMainImg = this.bannerList55[0]
					uni.navigateTo({
						url: '/pages/index/fullHouseWifi/index'
					})
				} else if (i == 1) {
					getApp().noMainImg = this.bannerList44[0]
					uni.navigateTo({
						url: '/pages/index/aiControlSys/index'
					})
				} else {
					uni.navigateTo({
						url: '/pages/index/productLead/index'
					})
				}
			},

			async testReq() {
				let res = await getBannerDataReq()
				this.$toast(res.msg)
				console.log('返回值', res);
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>