<template>
	<view class="index">
		<view class="header acea-row row-center-wrapper">
			<view @click="goGoodSearch()" class="search acea-row row-middle">
				<text class="iconfont icon-xiazai5"></text>
				搜索商品
			</view>
			<view class="qr" @click="startQr()">
				<image src="@/static/images/qr.png" />
			</view>
		</view>
		<view class="slider-banner banner">
			<swiper indicatorDots="true" v-if="banner.length > 0" autoplay circular >
				<block v-for="(item, bannerIndex) in banner" :key="bannerIndex">
					<swiper-item>
						<view @click="item.url ? $yrouter.push('/' + item.url) : ''" class="swiper-item">
							<image :src="item.pic" />
						</view>
					</swiper-item>
				</block>
			</swiper>
		</view>
		<view class="news acea-row row-between-wrapper">
			<view class="pictrue" v-if="$VUE_APP_RESOURCES_URL">
				<image src="@/static/images/news.png" />
			</view>
			<view class="swiper-no-swiping new-banner">
				<swiper class="swiper-wrapper" v-if="roll.length > 0" :indicator-dots="false" autoplay circular vertical>
					<block v-for="(item, rollIndex) in roll" :key="rollIndex">
						<swiper-item class="swiper-slide">
							<view @click="goRoll(item)" class="swiper-item acea-row row-between-wrapper">
								<view class="text acea-row row-between-wrapper">
									<view class="label" v-if="item.show === '是'">最新</view>
									<view class="newsTitle line1">{{ item.info }}</view>
								</view>
								<view class="iconfont icon-xiangyou"></view>
							</view>
						</swiper-item>
					</block>
				</swiper>
			</view>
		</view>
		<view class="nav acea-row">
			<view @click="goWxappUrl(item)" class="item" v-for="(item, menusIndex) in menus" :key="menusIndex">
				<view class="pictrue">
					<image :src="item.pic" />
				</view>
				<view>{{ item.name }}</view>
			</view>
		</view>
		<view class="wrapper hot" v-if="bastList.length > 0">
			<image class="bg" src="../../static/images/index-bg.png" mode="widthFix"></image>
			<view class="title acea-row row-between-wrapper">
				<view class="text">
					<view class="name line1">热门榜单</view>
				</view>
				<view @click="goHotNewGoods(2)" class="more">
					更多
					<text class="iconfont icon-jiantou"></text>
				</view>
			</view>
			<view class="newProducts">
				<scroll-view scroll-y="false" scroll-x="true">
					<view class="newProductsScroll">
						<view @click="goGoodsCon(item)" class="newProductsItem" v-for="(item, likeInfoIndex) in likeInfo" :key="likeInfoIndex">
							<view class="img-box">
								<image :src="item.image" />
							</view>
							<view class="pro-info line1"><text>{{ item.storeName }}</text></view>
							<view class="money font-color-red"><text>¥{{ item.price }}</text></view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view class="wrapper" v-if="bastList.length > 0">
			<view class="title acea-row row-between-wrapper">
				<view class="text">
					<view class="name line1">精品推荐</view>
				</view>
				<view @click="goHotNewGoods(1)" class="more">
					更多
					<text class="iconfont icon-jiantou"></text>
				</view>
			</view>
			<Good-list :good-list="bastList" :is-sort="false"></Good-list>
		</view>

		<view class="wrapper" v-if="firstList.length > 0">
			<view class="title acea-row row-between-wrapper">
				<view class="text">
					<view class="name line1">
						首发新品
						<text class="new font-color-red">NEW~</text>
					</view>
				</view>
				<view @click="goHotNewGoods(3)" class="more">
					更多
					<text class="iconfont icon-jiantou"></text>
				</view>
			</view>
			<view class="newProducts">
				<scroll-view scroll-y="false" scroll-x="true">
					<view class="newProductsScroll">
						<view @click="goGoodsCon(item)" class="newProductsItem" v-for="(item, firstListIndex) in firstList" :key="firstListIndex">
							<view class="img-box">
								<image :src="item.image" />
							</view>
							<view class="pro-info line1">{{ item.storeName }}</view>
							<view class="money font-color-red">¥{{ item.price }}</view>
						</view>
					</view>
				</scroll-view>
			</view>
		</view>
		<view class="wrapper" v-if="benefit.length > 0">
			<view class="title acea-row row-between-wrapper">
				<view class="text">
					<view class="name line1">促销单品</view>
				</view>
				<view @click="goGoodsPromotion(4)" class="more">
					更多
					<text class="iconfont icon-jiantou"></text>
				</view>
			</view>
		</view>
		<PromotionGood :benefit="benefit"></PromotionGood>
		<Coupon-window :coupon-list="couponList" v-if="showCoupon" @checked="couponClose" @close="couponClose"></Coupon-window>
	</view>
</template>
<script>
	// import { swiper, swiperSlide } from "vue-awesome-swiper";

	import GoodList from '@/components/GoodList';
	import PromotionGood from '@/components/PromotionGood';
	import CouponWindow from '@/components/CouponWindow';
	import {
		getHomeData,
		getShare
	} from '@/api/public';
	import cookie from '@/utils/store/cookie';
	import {
		isWeixin,
		handleUrlParam
	} from '@/utils/index';

	const HAS_COUPON_WINDOW = 'has_coupon_window';

	export default {
		name: 'Index',
		components: {
			// swiper,
			// swiperSlide,
			GoodList,
			PromotionGood,
			CouponWindow
		},
		props: {},
		data: function() {
			return {
				showCoupon: false,
				logoUrl: '',
				banner: [],
				menus: [],
				roll: [],
				activity: [],
				activityOne: {},
				bastList: [],
				firstList: [],
				info: {
					fastList: [],
					bastBanner: [],

					bastList: []
				},
				likeInfo: [],
				lovely: [],
				benefit: [],
				couponList: [],
				swiperOption: {
					pagination: {
						el: '.swiper-pagination',
						clickable: true
					},
					autoplay: {
						disableOnInteraction: false,
						delay: 2000
					},
					loop: true,
					speed: 1000,
					observer: true,
					observeParents: true
				},
				swiperRoll: {
					direction: 'vertical',
					autoplay: {
						disableOnInteraction: false,
						delay: 2000
					},
					loop: true,
					speed: 1000,
					observer: true,
					observeParents: true
				},
				swiperScroll: {
					freeMode: true,
					freeModeMomentum: false,
					slidesPerView: 'auto',
					observer: true,
					observeParents: true
				},
				swiperBoutique: {
					pagination: {
						el: '.swiper-pagination',
						clickable: true
					},
					autoplay: {
						disableOnInteraction: false,
						delay: 2000
					},
					loop: true,
					speed: 1000,
					observer: true,
					observeParents: true
				},
				swiperProducts: {
					freeMode: true,
					freeModeMomentum: false,
					slidesPerView: 'auto',
					observer: true,
					observeParents: true
				}
			};
		},
		onShow: function() {
			let that = this;
			uni.showLoading({
				title: '加载中'
			});
			getHomeData().then(res => {
				that.logoUrl = res.data.logoUrl;
				that.$set(that, 'banner', res.data.banner);
				that.$set(that, 'menus', res.data.menus);
				that.$set(that, 'roll', res.data.roll);
				that.$set(that, 'activity', res.data.activity);
				var activityOne = res.data.activity.shift();
				that.$set(that, 'activityOne', activityOne);
				that.$set(that, 'info', res.data.info);
				that.$set(that, 'firstList', res.data.firstList);
				that.$set(that, 'bastList', res.data.bastList);
				that.$set(that, 'likeInfo', res.data.likeInfo);
				that.$set(that, 'lovely', res.data.lovely);
				that.$set(that, 'benefit', res.data.benefit);
				that.$set(that, 'couponList', res.data.couponList);
				uni.hideLoading();
				that.setOpenShare();
			});
		},
		methods: {
			goRoll(item){
				if(item.uniapp_url){
					this.$yrouter.push(item.uniapp_url)	
				} 
			},
			goGoodSearch() {
				this.$yrouter.push('/pages/shop/GoodSearch/index');
			},
			goWxappUrl(item) {
				this.$yrouter.push(item.uniapp_url);
			},
			goHotNewGoods(type) {
				this.$yrouter.push({
					path: '/pages/shop/HotNewGoods/index',
					query: {
						type
					}
				});
			},
			goGoodsCon(item) {
				this.$yrouter.push({
					path: '/pages/shop/GoodsCon/index',
					query: {
						id: item.id
					}
				});
			},
			goGoodsPromotion() {
				this.$yrouter.push('/pages/shop/GoodsPromotion/index');
			},
			setOpenShare: function() {},
			startQr: function() {
				uni.scanCode({
					success: (res) =>{
						let option = handleUrlParam(res.result)
						console.log(option)
						
						
						// {productId: "19", spread: "21", codeType: "routine"}
						// {productId: "19", spread: "21", pageType: "good", codeType: "routine"}
						switch (option.pageType) {
							case 'good':
								// 跳转商品详情
								this.$yrouter.push({path:'/pages/shop/GoodsCon/index',query:{
									q:res.result
								}});
								break;
							case 'group':
								// 跳转团购
								this.$yrouter.push({path:'/pages/activity/GroupRule/index',query:{
									q:res.result
								}});
								break;
							case 'dargain':
								// 跳转砍价
								this.$yrouter.push({path:'/pages/activity/DargainDetails/index',query:{
									q:res.result
								}});
								break;
							default:
								// 跳转分销
								this.$yrouter.push({path:'/pages/Loading/index',query:{
									
								}});
								break;
						}


					}
				});
			}
		}
	};
</script>
<style scoped lang="less">
	.index {
		background-color: #fff;
	}

	.swiper-item {
		height: 100%;
	}
</style>