<!--
 * @Date: 2023-06-08 09:49:49
 * @LastEditTime: 2024-03-14 14:55:45
 * @Description: content
-->
<template>
	<view class="content">
		<view class="navLeft align-center" :style="{ top: $sys().statusBarHeight + 'px' }" @tap="$c.back(1)">
			<view class="flex" style="width: 100%">
				<view class="title1" style="width: 166rpx; height: 64rpx; margin-top: 5rpx;">
					<image :src="$img1('common/home_logo.png')" style="width: 166rpx; height: 64rpx;" mode=""></image>
				</view>
			</view>
		</view>
		<mescroll-body ref="mescrollRef" class="valbox" @init="mescrollInit" :down="downOption" @down="downCallback"
			@up="loadData">
			<view style="width: 100%;" :style="{ height: $sys().statusBarHeight + 'px' }"></view>
			<view style="width: 100%;height: 70rpx;"></view>
			<banner :type-id="9" :height="300" :img-width="94"></banner>
			<!-- 指示器 -->
			<!-- 	<view class="sw-dot relative">
				<view class="sw-dot-item" v-for="(item, i) in advert" :key="i" :class="{act: swCur == i}"></view>
			</view> -->

			<!-- 公告 -->
			<view class="news-box flex row" @click="$refs.rulePop.getRule(3, '提示')">
				<image :src="$img1('common/notice.png')" style="width: 33rpx; height: 26.05rpx; margin-left: 16rpx;"
					mode=""></image>
				<view class="news-text">
					<uni-notice-bar :style="{ width: `100%` }" :speed="8" background-color="transparent" color="#333333"
						scrollable single :text="$c.filterText(gonggao)"></uni-notice-bar>
				</view>
			</view>

			<!-- 今日推荐 -->
			<view class="flex yqhy" v-if="tuijian.length > 0" style="margin-top: 30rpx; flex-direction: column">
				<!-- <image class="img100" style=" display: flex; justify-content: center;"
					:src="$img1('/image/a6548-pw1cx.webp')"></image> -->
				<text style="color: black; font-weight: 600; margin-bottom: 20rpx">今日推荐</text>
				<view class="flex row align-center"
					style="width: 100%; height: 230rpx; justify-content: space-between; overflow: auto;">
					<view v-for="(item, index) in tuijian" class="recommend_item" :key="index">
						<image class="" style="width: 200rpx; height: 200rpx; border-radius: 10rpx" :src="item.imgurl"
							@click="$c.navTo(item, index)"></image>
					</view>
					<!-- 	<view class="" style="width: 181rpx; height: 181rpx; background-color: aquamarine;"></view>
					<view class="" style="width: 181rpx; height: 181rpx; background-color: aquamarine;"></view> -->
				</view>
			</view>

			<!-- 	<scroll-view scroll-x class="tab-list">
				<view @click="getlist(i)"
					:style="{background:tabCur == i? 'url('+ $img1('index/tabCheck.png')+') no-repeat 0 0 / 100% 100%':'none'}"
					v-for="(v, i) in tabList" :key="i" class="tab-list-item center">
					<text :class="{active: tabCur == i}">{{ v.title }}</text>
				</view>
			</scroll-view> -->
			<scroll-view class="tab" scroll-x>
				<view class="tab-item" v-for="(item, i) in tabList" :key="i" :class="{ act: tabCur == i }"
					@click="getlist(i)">
					{{ item.title }}
				</view>
			</scroll-view>

			<view class="qbt_con">
				<view v-for="(item, index) in listdata" :key="index" class="qbt_con_item" @click="todetails(item)">
					<view class="list_1 center" style="background-color: #d8d8d8;border-radius: 16rpx 16rpx 0rpx 0rpx;">
						<image :src="item.imgurl" mode="aspectFill"></image>
					</view>
					<view class="list_2">
						<view class="hang1">{{ item.title }}</view>
						<view class="redu" v-if="item.join_count">
							<text>{{ item.join_count }}次参与</text>
						</view>
						<view class="redu" v-else>快去参与吧！</view>
						<view class="qbt_con_item_3 flex_center" style="margin-top: 24rpx">
							<view class="item-price">
								￥<text style="font-size: 24rpx">{{ item.price }}</text>
							</view>
							<view v-if="item.stock" class="qbt_con_item_price">
								<text>{{ item.sale_stock }}/{{ item.stock }}</text>
								<image :src="$img1('index/box.png')" style="width: 20rpx; height: 18rpx"></image>
							</view>
						</view>
					</view>
					<image :src="$img1('common/new2.png')" class="image1" mode="widthFix"
						v-if="item.new_is == 1 && tabList[tabCur].id == 2"></image>
					<image :src="$img1('common/new1.png')" class="image1"
						style="animation: zoom 1.2s ease-in-out infinite" mode="widthFix"
						v-if="item.new_is == 1 && tabList[tabCur].id != 2"></image>
					<view class="image3 common_bg" style="padding: 0 10rpx;line-height: 32rpx;"
						:style="{ backgroundImage: tabList[tabCur].id != 2 ? `url(${$img1('common/label1.png')})` : `url(${$img1('common/label2.png')})`, }">
						<text>
							{{ item.type_text }}
						</text>
					</view>
					<view v-if="item.is_shou_zhe == 1" class="half-tag">
						<image class="img100" :src="$img1('common/chouBanjia.png')" mode="aspectFit"></image>
					</view>
					<!-- <view v-if="item.type == 1 || item.type == 6" class="lock-tag" :class="{dis: item.lock_is != 1}">
						{{ item.lock_is == 1 ? '锁箱' : '竞技' }}
					</view> -->
				</view>
			</view>
		</mescroll-body>


		<!-- 优惠券弹窗 -->
		<uni-popup ref="couponPop" type="center" maskBackgroundColor="rgba(0,0,0,0.8)">

			<view v-if="couponData" class="coupon-pop common_bg relative">
				<!-- <view class="coupon-pop-title">
					<text>新人大礼包</text>
				</view> -->
				<scroll-view class="coupon-list" scroll-y>
					<view v-for="(item, i) in couponData.goods.list" :key="i" class="coupon-item">
						<view class="center">
							<text>￥</text>
							<text>{{ Number(item.price) }}</text>
						</view>
						<view class="ml30 column">
							<text>{{ item.title }}</text>
							<text>有限期{{ item.effective_day }}天</text>
						</view>
					</view>
				</scroll-view>
				<view @click="receiveCoupon" class="get-btn center">立即收下</view>
				<!-- <view class="bt-tip">优惠券在【我的-优惠券】中查看</view> -->
				<view class="bt-close flex" @tap="$refs.couponPop.close()">
					<image class="img100" :src="$img1('common/close.png')"></image>
				</view>
			</view>

		</uni-popup>
		<!-- <tab-bar :index="0"></tab-bar> -->
		<rule-pop ref="rulePop"></rule-pop>

		<rule-pop ref="appNotice" notice-check></rule-pop>

		<float-ball v-if="!$config.GetVersion()"></float-ball>

		<!-- #ifdef MP -->
		<!-- 隐私政策弹窗 -->
		<priv-pop></priv-pop>
		<!-- #endif -->
	</view>
</template>

<script>
import lffBarrage from "@/components/lff-barrage/lff-barrage.vue";
import FloatBall from "@/components/float-ball/FloatBall.vue";

export default {
	components: {
		lffBarrage,
		FloatBall
	},
	data() {
		let tabList = this.$config.getGoodType();
		return {
			z_imgPath: this.$z_img2 + "shouye/",
			tabList: tabList,
			tabCur: 0,
			keyword: "",
			listdata: [],
			// 下拉刷新的配置(可选, 绝大部分情况无需配置)
			downOption: {
				auto: false,
			},
			// 上拉加载的配置(可选, 绝大部分情况无需配置)
			upOption: {
				auto: true,
				page: {
					size: 15, // 每页数据的数量,默认10
				},
			},
			advert: [], //轮播图
			tuijian: [], //推荐上新
			notice_list: [], // 弹幕
			erweima: "", // 福利群
			yushou_rili: "", // 预售日历
			jump_appid: "", // 跳转的小程序id
			aa: false,
			gonggao: "",
			couponData: "",
			canGetCoupon: false,
			swCur: 0
		};
	},

	onUnload() {
		this.aa = false;
	},
	onHide() {
		clearInterval(this.timer);
		this.aa = false;
		let pages = getCurrentPages();
		// console.log(11, this.$mp.page.route)
		uni.setStorageSync("page", this.$mp.page.route);
	},
	onLoad(v) {
		console.log("参数", v);

		if (v.pid) {
			uni.setStorageSync("pid", v.pid);
		}
		if (v.scene) {
			uni.setStorageSync("pid", v.scene);
		}
		if (v.token) {
			uni.setStorageSync("token", v.token);
		}
		/* 获取广告id */
		if (v.ad_id) {
			uni.setStorageSync("_ad_id", v.ad_id);
		}
		/* 获取click_id */
		if (v.gdt_vid) {
			uni.setStorageSync("_click_id", v.gdt_vid);
		}
	},
	onShow() {
		let that = this;
		this.aa = true;
		// setTimeout(() => {
		//   that.colrdo()
		// }, 500
		this.canGetCoupon && this.getCoupon();
		this.canGetCoupon && this.getnews();
		this.canGetCoupon = true;
		const curPages = getCurrentPages()[0]; // 获取当前页面实例
		if (typeof curPages.getTabBar === "function" && curPages.getTabBar()) {
			this.$mp.page.getTabBar().setData({
				selected: 0,
			});
		}
	},

	onReady() {
		// this.$refs.couponPop.open()
		this.getCoupon();
		// this.$refs.rulePop.open()
		this.getnews();

	},

	onShareAppMessage() {
		let that = this;
		return {
			title: this.$config.getAppSetting("app_name") + "，正版潮玩手办一番赏",
			imageUrl: that.advert[0].imgurl,
			path: "/pages/shouye/index?pid=" + uni.getStorageSync("userinfo").ID,
		};
	},
	computed: {
		// 删除getBallStyle和getPopupStyle方法
	},
	methods: {
		// 删除BallClick和getFloatBall方法
		/**
		 * @description: 是否弹公告
		 * @return {*}
		 */
		checkNotice() {
			/* 上次勾选(今日不再提醒)的日期 */
			const _last_notice_date = uni.getStorageSync("_last_notice_date");
			/* 本次打开app是否已经弹过公告弹窗 */
			const _is_this_show = uni.getStorageSync("_is_this_show");
			const nowDate = this.$c.getDateTime();

			if (_last_notice_date != nowDate && !_is_this_show) {
				this.$refs.appNotice.getRule(19, "公告");
				uni.setStorageSync("_is_this_show", true);
			}
		},
		swChange(e) {
			this.swCur = e.detail.current;
		},

		receiveCoupon() {
			let arr = this.couponData.goods.list.map((item) => item.id);

			if (arr.length <= 0) {
				return;
			}

			this.req({
				url: "receive",
				data: {
					coupon_id: arr.join(","),
				},
				success: (res) => {
					if (res.status == 1) {
						setTimeout(() => {
							uni.showToast({
								title: "领取成功",
								icon: "success",
							});
						}, 100);

						this.$refs.couponPop.close();
					}
				},
			});
		},

		getCoupon() {

			this.req({
				url: "coupon",
				data: {},
				success: (res) => {
					if (res.status == 1 && res.data.status != 2) {
						res.data.totalMoney = 0;

						if (res.data.goods.list.length > 0) {
							res.data.totalMoney = res.data.goods.list.reduce((pre, item) => {
								return pre + Number(item.price);
							}, 0);

							this.$refs.couponPop.open();
						}

						this.couponData = res.data;
					}
				},
			});
		},


		torili() {
			uni.setStorageSync("rili", this.yushou_rili);
			this.gotoPage("/pages/shouye/rili");
		},
		getnews() {
			let that = this;
			that.req({
				url: "index",
				success(res) {
					if (res.status == 1) {
						that.advert = res.data.advert;
						that.tuijian = res.data.tuijian;
						that.notice_list = res.data.new_bulletcha;
						that.erweima = res.data.other.erweima;
						that.gonggao = res.data.notice.content;
						that.yushou_rili = res.data.other.yushou_rili;
						that.jump_appid = res.data.other.jump_appid;
						uni.setStorageSync("jump_appid", res.data.other.jump_appid);
						uni.setStorageSync("wx_link", res.data.other.wx_link);
						uni.setStorageSync("corpid", res.data.other.corpid);

						if (res.data.other.is_shou_tan == 1) {
							that.checkNotice();
						}
					}
				},
			});
		},

		loadData({
			num,
			size
		}) {
			// 模拟接口
			let that = this;
			that.req({
				url: "goods",
				data: {
					page: num,
					type: that.tabList[that.tabCur].id,
					keyword: that.keyword,
				},
				success: function (res) {
				
					let _data = res.data.data;
					let isWXPay = that.$config.GetVersion()
					if (isWXPay) {
						let _data2 = [];
						for (let i = 0; i < _data.length; i++) {
							if (_data[i].title.indexOf('京东卡') == -1) {
								_data2.push(_data[i]);
							}
						}
						_data = _data2;
					}
					that.mescroll.endByPage(_data.length, res.data.last_page);
					if (num == 1) {
						that.listdata = _data;
					} else {
						that.listdata = that.listdata.concat(_data);
					}
					console.log(that.listdata);
				},
			});
		},
		todetails(e) {
			// 无限赏
			let url = "/pages/shouye/detail";
			let params = {
				goods_id: e.id,
				type_text: e.type_text
			};

			if (e.type == 2 || e.type == 8 || e.type == 16) {
				url = "/pages/shouye/detail_wuxian";
			}

			if (e.type == 9) {
				url = "/package/index/lian-ji";
			}
			if (e.type == 3) {
				url = "/package/index/leitai";
			}

			this.$customRouter.navigateTo(url, params);
		},
		getlist(v) {
			this.tabCur = v;
			this.listdata = [];
			this.mescroll.resetUpScroll();
			this.mescroll.scrollTo(0, 0);

			// this.loadData(1)
		},

		toRanking() {
			this.$customRouter.navigateTo("/pages/shouye/ranking");
		},
		toyaqingRanking() {
			this.$customRouter.navigateTo("/pages/shouye/yaoqing_ranking");
		},
	},
};
</script>

<style lang="scss">
.title1 {
	width: 100%;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	color: white;
}

.recommend_item {
	width: 200rpx;
	height: 200rpx;
	flex: 0 0 auto;
	background-color: gray;
	margin-right: 40rpx;
	border-radius: 10rpx;
}

.navLeft {
	position: fixed;
	left: 30rpx;
	z-index: 100;

	>view {
		width: 200rpx;
		height: 70rpx;
	}
}

.pop {
	width: 506rpx;
	height: 380px;
	position: relative;
	background: #b198e2;

	box-shadow: 0rpx 0rpx 16rpx 0rpx rgba(137, 77, 211, 0.33);
	border-radius: 44rpx;

	>view:nth-child(1) {
		padding-top: 40rpx;

		>image {
			width: 430rpx;
			height: 430rpx;
			margin: 0 auto 0;
			background: #ffffff;
		}
	}

	&-view {
		position: absolute;
		left: 0;
		bottom: 0;
		width: 506rpx;
		height: 276rpx;
		box-sizing: border-box;
		padding: 68rpx 0 0 40rpx;
		background: url($imgurl + "index/hudu.png") no-repeat 0 0 / 100% 100%;

		>text:nth-child(1) {
			font-weight: 400;
			font-size: 52rpx;
			color: #894dd3;
			text-shadow: #fff 1px 0 0, #fff 0 1px 0, #fff -1px 0 0, #fff 0 -1px 0;
		}

		>text:nth-child(2) {
			font-weight: 400;
			font-size: 24rpx;
			color: #894dd3;
			margin-top: 10rpx;
		}
	}

	&-liwu {
		position: absolute;
		right: -160rpx;
		width: 380rpx;
		height: 260rpx;
		bottom: -60rpx;
		z-index: 10;
	}

	&-close {
		width: 94rpx;
		height: 94rpx;
		position: absolute;
		bottom: -140rpx;
		left: 50%;
		transform: translateX(-50%);
		opacity: 0.6;
	}
}

.image2 {
	width: 115rpx;
	height: 62rpx;
	position: absolute;
	top: 10rpx;
	right: 10rpx;
}

.gonggao {
	width: 750rpx;
	height: 300rpx;
	border-radius: 39rpx;
	margin: 0rpx auto;
	overflow: hidden;
	display: flex;
	align-items: center;
	padding: 0 20rpx;
	box-sizing: border-box;
	/* position: relative; */
	position: absolute;
	top: 330rpx;
	z-index: 16;
	pointer-events: none;
}

.status_bar {
	height: var(--status-bar-height);
	width: 100%;
}

.header {
	width: 750rpx;
}

.header-left-title {
	position: fixed;
	left: 0;
	top: 0;
	z-index: 10;
	height: 88rpx;
	font-weight: bold;
	color: #ffffff;
	display: flex;
	align-items: center;
	padding-left: 10rpx;

	image {
		width: 230rpx;
		height: 70rpx;
	}
}

.swiper-box {
	width: 750rpx;
	height: 460rpx;
	margin: 40rpx auto;
	overflow: hidden;
}

.sw-dot {
	display: flex;
	justify-content: center;
	margin-top: -40rpx;
	z-index: 10;

	.sw-dot-item {
		width: 8rpx;
		height: 8rpx;
		border-radius: 8rpx;
		background: #fff;
		margin: 0 8rpx;
		transition: 0.3s;

		&.act {
			width: 18rpx;
			background-color: #ff873a;
		}
	}
}

.yh_bg {
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background-color: #FFFFFF;
}

.news-box {
	width: 686rpx;
	height: 52rpx;
	margin: 40rpx auto 0;
	display: flex;
	background-color: #F8F8F8;
	align-items: center;
	border-radius: 16rpx;
	background-size: 100% 100%;

	.news-text {
		width: 600rpx;
		height: 90rpx;
		display: flex;
		align-items: center;
		margin-left: 18rpx;

		/deep/.uni-noticebar__content-text {
			font-size: 24rpx;
		}
	}
}

.nav1 {
	width: 710rpx;
	margin: 30rpx auto 0;

	>view:nth-child(1) {
		width: 284rpx;
		height: 349rpx;
	}

	>view:nth-child(2) {
		height: 349rpx;

		>image:nth-child(1) {
			width: 423rpx;
			height: 183rpx;
		}

		>image:nth-child(2) {
			width: 423rpx;
			height: 170rpx;
		}
	}
}

.yqhy {
	width: 100%;
	height: 300rpx;
	margin-top: 30rpx;
	margin-left: 32rpx;
}

.nav2 {
	width: 710rpx;
	height: 170rpx;
	margin: 0 auto;

	image {
		width: 100%;
		height: 100%;
	}
}

.tab-list {
	white-space: nowrap;
	width: 100%;
	position: relative;
	margin: 50rpx 0 30rpx;
	padding-left: 30rpx;
	box-sizing: border-box;

	.tab-list-item {
		display: inline-flex;
		align-items: center;
		background-size: auto 100%;
		background-position: center center;
		padding: 0 30rpx;
		font-weight: 400;
		color: #ffffff;
		font-weight: 400;
		font-size: 36rpx;
		color: #cccccc;
		height: 70rpx;
		margin-right: 20rpx;

		.active {
			font-weight: 400;
			font-size: 36rpx;
			color: #ffffff;
		}
	}
}

.tab {
	white-space: nowrap;
	margin-top: 10rpx;
	margin-left: 30rpx;

	.tab-item {
		position: relative;
		display: inline-flex;
		margin-right: 50rpx;
		padding: 20rpx 0;

		&:last-child {
			margin-right: 30rpx;
		}

		font-size: 24rpx;
		color: #999999;

		&.act {
			color: #333333;
			font-weight: 600;
			font-size: 28rpx;

			&::before {
				content: "";
				display: block;
				width: 60rpx;
				height: 4rpx;
				background: #333333;
				border-radius: 30rpx;
				position: absolute;
				left: 50%;
				bottom: 4rpx;
				transform: translateX(-50%);
			}
		}
	}
}

.content {
	width: 100vw;
	box-sizing: border-box;
	position: relative;
	background-attachment: fixed;
	position: relative;
	background-color: #ffffff;
}

.title_ipt {
	display: flex;
	align-items: center;
	margin: 20rpx auto;
	border-radius: 30rpx;
	padding-left: 30rpx;
	width: 620rpx;
	height: 58rpx;
	background: rgba(255, 255, 255, 0.2);
	border-radius: 10rpx;
	box-sizing: border-box;
}

.title_ipt>image {
	width: 33rpx;
	height: 33rpx;
}

.title_ipt>input {
	width: 90%;
	height: 58rpx;
	box-sizing: border-box;
	border-radius: 105rpx;
	font-size: 28rpx;
	line-height: 58rpx;
	font-size: 28rpx;
	font-weight: 400;
	color: rgba(255, 255, 255, 0.6);
	padding-left: 20rpx;
}

.title_ipt>view {
	width: 90rpx;
	height: 40rpx;
	background: linear-gradient(0deg, #1ac762 0%, #35ed85 100%);
	border-radius: 18rpx;
	font-size: 26rpx;
	color: #111111;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 20rpx;
}

.qiehuan {
	display: flex;
	/* 	justify-content: space-between; */
	align-items: center;
	width: 690rpx;
	margin: 20rpx auto 0;
	box-sizing: border-box;
	font-weight: bold;
}

.qiehuan_line {
	margin: -10rpx auto;
	width: 50rpx;
	height: 20rpx;
	border-bottom: 4rpx solid #ff7514;
	border-radius: 2rpx;
}

.qiehuan>view {
	margin-right: 10rpx;
	/* flex: 1;
		text-align: center; */
}

.wzs {
	font-size: 32rpx;
	color: rgba(255, 255, 255, 0.6);
}

.xzs {
	font-size: 34rpx;
	color: #ff7514;
}

.qbt_con {
	padding: 1rpx 30rpx 100rpx;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}

.qbt_con_item {
	width: 330rpx;
	height: 505rpx;
	margin-top: 30rpx;
	// border: 1px solid #4a4951;
	position: relative;
	background-color: #f8f8f8;
	border-radius: 16rpx;
	// background: url($imgurl+'common/goodsBg.png') no-repeat 0 0 / 100% 100%;

	.image1 {
		width: 32rpx;
		height: 32rpx;
		position: absolute;
		z-index: 10;
		top: 10rpx;
		right: 10rpx;
	}

	.image3 {
		position: absolute;
		z-index: 1;
		top: 10rpx;
		left: 10rpx;
		min-width: 68rpx;
		padding: 0 6rpx;
		height: 32rpx;
		justify-content: center;
		display: flex;
		align-items: center;

		text {
			font-size: 16rpx;
			font-weight: 400;
			color: #ffffff;
		}
	}

	.half-tag {
		width: 160rpx;
		height: 60rpx;
		position: absolute;
		left: 0;
		top: 250rpx;
		z-index: 1;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.lock-tag {
		position: absolute;
		right: 0;
		top: 294rpx;
		z-index: 1;
		padding: 0 14rpx;
		height: 36rpx;
		background: linear-gradient(90deg, #6adeff 0%, #7ab5ff 50%, #ff7feb 100%);
		border-radius: 4rpx;
		display: flex;
		align-items: center;

		font-size: 22rpx;
		font-weight: 400;
		color: #222222;

		&.dis {
			background: linear-gradient(90deg, #729fdb 0%, #d0dbff 100%);
		}
	}
}

.list_1 {
	width: 100%;
	height: 332rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}

.list_1>image {
	// width: 290rpx;
	// height: 290rpx;
	width: 100%;
	height: 100%;
}

.list_2 {
	padding: 28rpx 20rpx 0;
	font-size: 20rpx;
	font-weight: 500;
	color: #333333;
}

.redu {
	margin-top: 24rpx;
	font-size: 18rpx;
	font-weight: 500;
	color: #6C6C6C;
}

.qbt_con_item_3 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	color: #fff;
	// text-shadow: 0px 2px 8px rgba(233, 18, 252, 0.41);

	.item-price {
		font-size: 16rpx;
		font-weight: 400;
		color: #333333;

		text {
			font-size: 36rpx;
		}
	}
}

.qbt_con_item_price {
	display: flex;
	align-items: center;
	font-size: 18rpx;
	font-weight: 400;
	color: #6c6c6c;
}

.qbt_con_item_price>image {
	width: 26rpx;
	height: 26rpx;
	margin-left: 6rpx;
}

.redu>image {
	width: 32rpx;
	height: 32rpx;
	border: 2rpx solid rgba(255, 255, 255, 0.8);
	border-radius: 50%;
}

/* .redu>text {} */

// .nav-wrap {
//   width: 720rpx;
//   height: 268rpx;
//   display: flex;
//   justify-content: space-between;
//   position: relative;
//   margin: 0 auto;

//   .nav-lg {
//     width: 365rpx;
//     height: 268rpx;
//   }

//   .nav-sm {
//     position: absolute;
//     right: 0;
//     top: 0;
//     width: 365rpx;
//     height: 143rpx;
//   }

//   .nav-sm + .nav-sm {
//     top: auto;
//     bottom: 0;
//   }
// }

.coupon-pop {
	width: 604rpx;
	height: 598rpx;
	position: relative;
	background: url($imgurl + "index/couponBg.png") no-repeat 0 0 / 100% 100%;
	// background: #281C50;
	// border-radius: 30rpx;
	// border: 1px solid #7776AD;

	.coupon-pop-title {
		display: flex;
		justify-content: center;
		padding: 40rpx 0 30rpx;

		text {
			font-weight: 500;
			font-size: 40rpx;
			color: #ffffff;
		}
	}

	.coupon-list {
		padding-top: 128rpx;
		height: 400rpx;

		.coupon-item {
			width: 530rpx;
			height: 160rpx;
			margin: 0 auto 20rpx;
			display: flex;
			align-items: center;
			position: relative;
			background: url($imgurl + "index/couponItem.png") no-repeat 0 0 / 100% 100%;

			>view:nth-child(1) {
				width: 168rpx;
				height: 168rpx;


				>text:nth-child(1) {
					font-weight: 400;
					font-size: 24rpx;
					color: #FDB075;
					padding-top: 20rpx;
				}

				>text:nth-child(2) {
					font-weight: 700;
					font-size: 64rpx;
					color: #FDB075;
				}
			}

			>view:nth-child(2) {
				>text:nth-child(1) {
					font-weight: 400;
					font-size: 28rpx;
					color: #FDB075;
				}

				>text:nth-child(2) {
					font-weight: 400;
					font-size: 24rpx;
					color: #FDB075;
				}
			}
		}

		.gap-box {
			width: 100%;
			height: 60rpx;
		}
	}

	.get-btn {
		margin: 120rpx auto 0;
		width: 386rpx;
		height: 102rpx;
		background: #D8FD24;
		border-radius: 26rpx;
		font-weight: 600;
		font-size: 32rpx;
		color: #333333;
	}

	.bt-tip {
		white-space: nowrap;
		position: absolute;
		bottom: -50rpx;
		left: 50%;
		transform: translateX(-50%);
		font-weight: 400;
		font-size: 24rpx;
		color: #ffffff;
	}

	.bt-close {
		position: absolute;
		bottom: -230rpx;
		left: 50%;
		transform: translateX(-50%);
		width: 48rpx;
		height: 48rpx;
		opacity: 0.6;
	}
}

@keyframes zoom {
	0% {
		transform: scale(1);
	}

	50% {
		transform: scale(0.9);
	}

	100% {
		transform: scale(1);
	}
}

.group-fixed1 {
	// 删除此样式
}

.pop-ball {
	// 删除此样式
}

.pop-ball-close {
	// 删除此样式
}
</style>