discounts-minapp/components/zs-skeleton/index.vue

<template>
	<view class="zs-skeleton" v-if="loading" @touchmove.stop.prevent="clear">

		<template v-if="type == 'home'" class="home" name="skeleton">
			<view class="sk-container">
				<view class="home sk-image">
					<view  data-event-opts="^search,handleSearch">
						<view class="zs-banner">
							<view class="position-box">
								<view class="position">
									<image mode="true" class="position-icon sk-image"></image>
									<text class="city sk-transparent sk-text-14-2857-766 sk-text">成都市</text>
								</view>
								<view class="topbar sk-transparent sk-text-14-2857-508 sk-text"
									style="background-position-x: 50%;">慧研学惠生活</view>
							</view>
							<view class="top-box sk-image" style="--bg:#FE6646;">
								<view class="search-box">
									<view class="search sk-image" data-event-opts="input,__set_model,,search,$event,"
										placeholder="搜索" type="text" value="true"></view>
									<image mode="true" class="icon sk-image"></image>
									<button class="btn sk-transparent sk-button sk-pseudo sk-pseudo-circle"
										data-event-opts="tap,handleSearch,$event" type="default">搜索</button>
								</view>
								<swiper autoplay="false" circular="true" class="swiper"
									data-event-opts="change,swiperChange,$event" duration="1000" indicator-dots="true"
									interval="3000" current="0"></swiper>
							</view>
							<view class="u-notice-bar bar--u-notice-bar data-v-24c07869 bar--data-v-24c07869"
								style="background-color:none">
								<view
									class="u-notice column-notice--u-notice data-v-3bda0f19 column-notice--data-v-3bda0f19"
									data-event-opts="tap,clickHandler,$event">
									<view
										class="u-notice__left-icon column-notice--u-notice__left-icon data-v-3bda0f19 column-notice--data-v-3bda0f19">
										<view
											class="u-icon icon--u-icon data-v-2ee87dc9 icon--data-v-2ee87dc9 u-icon--right icon--u-icon--right"
											data-event-opts="tap,clickHandler,$event">
											<text
												class="u-icon__icon icon--u-icon__icon data-v-2ee87dc9 icon--data-v-2ee87dc9 uicon-volume-fill icon--uicon-volume-fill sk-transparent sk-text--35-0000-226 sk-text"
												style="font-size:10px;line-height:10px;font-weight:normal;top:0px;color:#6F4F23"></text>
										</view>
									</view>
									<swiper autoplay="false" circular="true"
										class="u-notice__swiper column-notice--u-notice__swiper data-v-3bda0f19 column-notice--data-v-3bda0f19"
										data-event-opts="change,noticeChange,$event" interval="2000" vertical="true"
										current="0"></swiper>
								</view>
							</view>
						</view>
					</view>
					<view class="login-home">
						<view class="discount-list">
							<view class="discount-item"
								data-event-opts="tap,goDetail,0,$0,$1,discountsList,,0,linkUrl,discountsList,,0,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-400 sk-text">加油充电</view>
								<view class="tag sk-transparent sk-text-14-2857-378 sk-text">大额券</view>
								<view class="desc sk-transparent sk-text-14-2857-255 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,1,$0,$1,discountsList,,1,linkUrl,discountsList,,1,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-474 sk-text">酒店民宿</view>
								<view class="tag sk-transparent sk-text-14-2857-208 sk-text">HOT</view>
								<view class="desc sk-transparent sk-text-14-2857-42 sk-text"
									style="background-position-x: 50%;">限时抢购</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,2,$0,$1,discountsList,,2,linkUrl,discountsList,,2,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-491 sk-text">景区门票</view>
								<view class="tag sk-transparent sk-text-14-2857-708 sk-text">1元秒杀</view>
								<view class="desc sk-transparent sk-text-14-2857-838 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,3,$0,$1,discountsList,,3,linkUrl,discountsList,,3,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-197 sk-text">餐饮美食</view>
								<view class="tag sk-transparent sk-text-14-2857-12 sk-text">天天领</view>
								<view class="desc sk-transparent sk-text-14-2857-720 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,4,$0,$1,discountsList,,4,linkUrl,discountsList,,4,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-798 sk-text">慧妍学</view>
								<view class="tag sk-transparent sk-text-14-2857-752 sk-text">天天领</view>
								<view class="desc sk-transparent sk-text-14-2857-150 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,5,$0,$1,discountsList,,5,linkUrl,discountsList,,5,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-543 sk-text">超市购物</view>
								<view class="tag sk-transparent sk-text-14-2857-237 sk-text">大额券</view>
								<view class="desc sk-transparent sk-text-14-2857-199 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,6,$0,$1,discountsList,,6,linkUrl,discountsList,,6,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-117 sk-text">出行</view>
								<view class="tag sk-transparent sk-text-14-2857-934 sk-text">大额券</view>
								<view class="desc sk-transparent sk-text-14-2857-245 sk-text"
									style="background-position-x: 50%;">最高优惠￥99</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,7,$0,$1,discountsList,,7,linkUrl,discountsList,,7,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-827 sk-text">健身运动</view>
								<view class="tag sk-transparent sk-text-14-2857-401 sk-text">大额券</view>
								<view class="desc sk-transparent sk-text-14-2857-188 sk-text"
									style="background-position-x: 50%;">1元秒杀</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,8,$0,$1,discountsList,,8,linkUrl,discountsList,,8,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-891 sk-text">医疗健康</view>
								<view class="tag sk-transparent sk-text-14-2857-690 sk-text">HOT</view>
								<view class="desc sk-transparent sk-text-14-2857-745 sk-text"
									style="background-position-x: 50%;">红包免费领</view>
							</view>
							<view class="discount-item"
								data-event-opts="tap,goDetail,9,$0,$1,discountsList,,9,linkUrl,discountsList,,9,id">
								<image mode="true" class="icon sk-image"></image>
								<view class="title sk-transparent sk-text-14-2857-58 sk-text">家政服务</view>
								<view class="tag sk-transparent sk-text-14-2857-97 sk-text">大额券</view>
								<view class="desc sk-transparent sk-text-14-2857-40 sk-text"
									style="background-position-x: 50%;">低至5折</view>
							</view>
						</view>
						<view class="advertise-box">
							<view class="item">
								<view>
									<view
										class="zs-img-box img-index--zs-img-box data-v-ce5cf0a6 img-index--data-v-ce5cf0a6">
										<image
											class="img1 img-index--img1 data-v-ce5cf0a6 img-index--data-v-ce5cf0a6 lazyhdi8RJYaY6nbJgkUIQXdtAkztrbZMpMPy img-index--lazyhdi8RJYaY6nbJgkUIQXdtAkztrbZMpMPy sk-image"
											data-event-opts="error,error,$event" mode="true"
											style="width:184px;height:103px;border-radius:8px 8px 0 0;"></image>
									</view>
								</view>
							</view>
							<view class="item">
								<view>
									<view
										class="zs-img-box img-index--zs-img-box data-v-ce5cf0a6 img-index--data-v-ce5cf0a6">
										<image
											class="img1 img-index--img1 data-v-ce5cf0a6 img-index--data-v-ce5cf0a6 lazyhdK28Cm50QUQHCNRkFZcp0oWoWH81MWAO img-index--lazyhdK28Cm50QUQHCNRkFZcp0oWoWH81MWAO sk-image"
											data-event-opts="error,error,$event" mode="true"
											style="width:184px;height:103px;border-radius:8px 8px 0 0;"></image>
									</view>
								</view>
							</view>
						</view>
						<view class="content">
							<view class="store-box" data-event-opts="^load,loadMore">
								<view class="zs-list list-index--zs-list" style="margin-top:0;">
									<view class="left">
										<swiper autoplay="false" circular="true" class="adv-swiper"
											indicator-active-color="#fff" indicator-color="rgba(255, 255, 255, .46)"
											current="0">
											<swiper-item data-event-opts="tap,jump,$0,advList1,,0,jumpUrl"
												style="position: absolute; width: 100%; height: 100%; transform: translate(0%, 0px) translateZ(0px);">
												<image mode="true" class="adv-item sk-image"></image>
											</swiper-item>
										</swiper>
									</view>
									<view class="right">
										<view class="store-item" data-event-opts="tap,goShopDetail,$0,list1,,0">
											<view>
												<view
													class="zs-img-box img-index--zs-img-box data-v-ce5cf0a6 img-index--data-v-ce5cf0a6">
													<image
														class="img1 img-index--img1 data-v-ce5cf0a6 img-index--data-v-ce5cf0a6 lazyhdjBepQhAe1U0jSpYNfTSNs3MVieQO4Im img-index--lazyhdjBepQhAe1U0jSpYNfTSNs3MVieQO4Im sk-image"
														data-event-opts="error,error,$event" mode="widthFix"
														style="width: 184px; height: 143.275px; border-radius: 8px 8px 0px 0px;">
													</image>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</template>


		<view name="skeleton" class="integral" v-else-if="type == 'integral'">
			<view class="sk-container">
				<view class="store">
					<view class="bg sk-image">
						<view class="info">
							<view class="num sk-transparent sk-text-14-2857-943 sk-text"
								style="background-position-x: 50%;">3399</view>
							<view class="label sk-transparent sk-text-14-2857-299 sk-text"
								style="background-position-x: 50%;">剩余积分</view>
						</view>
						<view class="rule sk-transparent sk-text-14-2857-922 sk-text">积分规则</view>
						<image mode="true" class="jump-img sk-image" data-event-opts="tap,jump,./shop"></image>
					</view>
					<view class="title sk-transparent">
						<image mode="true" class="icon sk-image"></image>积分明细
					</view>
					<view>
						<view class="zs-list list-index--zs-list" style="margin-top:0;">
							<view class="item">
								<view class="top">
									<view class="item-title sk-transparent sk-text-14-2857-830 sk-text">天天签到积分</view>
									<view class="score sk-transparent sk-text-14-2857-292 sk-text">+5</view>
								</view>
								<view class="bottom">
									<view class="time sk-transparent sk-text-14-2857-594 sk-text">2022-10-01</view>
									<view class="num sk-transparent sk-text-14-2857-398 sk-text">剩余1233</view>
								</view>
							</view>
							<view class="item">
								<view class="top">
									<view class="item-title sk-transparent sk-text-14-2857-214 sk-text">天天签到积分</view>
									<view class="score sk-transparent sk-text-14-2857-115 sk-text">+5</view>
								</view>
								<view class="bottom">
									<view class="time sk-transparent sk-text-14-2857-263 sk-text">2022-10-01</view>
									<view class="num sk-transparent sk-text-14-2857-429 sk-text">剩余1233</view>
								</view>
							</view>
							<view class="item">
								<view class="top">
									<view class="item-title sk-transparent sk-text-14-2857-97 sk-text">天天签到积分</view>
									<view class="score sk-transparent sk-text-14-2857-514 sk-text">+5</view>
								</view>
								<view class="bottom">
									<view class="time sk-transparent sk-text-14-2857-304 sk-text">2022-10-01</view>
									<view class="num sk-transparent sk-text-14-2857-940 sk-text">剩余233</view>
								</view>
							</view>
							<view class="item">
								<view class="top">
									<view class="item-title sk-transparent sk-text-14-2857-926 sk-text">天天签到积分</view>
									<view class="score sk-transparent sk-text-14-2857-255 sk-text">+5</view>
								</view>
								<view class="bottom">
									<view class="time sk-transparent sk-text-14-2857-844 sk-text">2022-10-01</view>
									<view class="num sk-transparent sk-text-14-2857-712 sk-text">剩余1233</view>
								</view>
							</view>
							<view class="item">
								<view class="top">
									<view class="item-title sk-transparent sk-text-14-2857-153 sk-text">天天签到积分</view>
									<view class="score sk-transparent sk-text-14-2857-778 sk-text">+15</view>
								</view>
								<view class="bottom">
									<view class="time sk-transparent sk-text-14-2857-605 sk-text">2022-10-01</view>
									<view class="num sk-transparent sk-text-14-2857-586 sk-text">剩余1233</view>
								</view>
							</view>
							<view class="more list-index--more">
								<view class="uni-load-more more-index--uni-load-more"
									data-event-opts="tap,onClick,$event">
									<text class="uni-load-more__text more-index--uni-load-more__text"
										style="color:#777777;"></text>
								</view>
							</view>
						</view>
					</view>
					<view></view>
				</view>
			</view>
		</view>



		<view name="skeleton" class="integralShop" v-else-if="type == 'integralShop'">
			<view class="sk-container">
				<view class="integral-shop">
					<view class="search-box">
						<view>
							<view class="zs-search search-index--zs-search">
								<view class="input search-index--input sk-image" placeholder="搜索"
									style="line-height:39px;height:39px;border-radius:36px;color:#606266;background:#efefef;"
									type="text" value="true"></view>
								<image mode="true" class="icon search-index--icon sk-image"></image>
								<button
									class="btn search-index--btn sk-transparent sk-button sk-pseudo sk-pseudo-circle"
									data-event-opts="tap,search,$event" type="default">搜索</button>
							</view>
						</view>
					</view>
					<image mode="true" class="top-banner sk-image"></image>
					<view class="list" data-event-opts="^load,loadMore">
						<view class="zs-list list-index--zs-list" style="margin-top:0;">
							<view class="item">
								<image class="icon sk-image" mode="aspectFill"></image>
								<view class="item-title sk-transparent sk-text-14-2857-302 sk-text">宅小鹿芒果干</view>
								<view class="handle-box">
									<view class="price sk-transparent sk-text-14-2857-723 sk-text">6000分</view>
									<view class="exchange-btn sk-transparent sk-image">兑换</view>
								</view>
							</view>
							<view class="item">
								<image class="icon sk-image" mode="aspectFill"></image>
								<view class="item-title sk-transparent sk-text-14-2857-958 sk-text">麻辣王子地道辣条</view>
								<view class="handle-box">
									<view class="price sk-transparent sk-text-14-2857-194 sk-text">6000分</view>
									<view class="exchange-btn sk-transparent sk-image">兑换</view>
								</view>
							</view>
							<view class="item">
								<image class="icon sk-image" mode="aspectFill"></image>
								<view class="item-title sk-transparent sk-text-14-2857-601 sk-text">良品铺子酥脆薄饼</view>
								<view class="handle-box">
									<view class="price sk-transparent sk-text-14-2857-60 sk-text">6000分</view>
									<view class="exchange-btn sk-transparent sk-image">兑换</view>
								</view>
							</view>
							<view class="item">
								<image class="icon sk-image" mode="aspectFill"></image>
								<view class="item-title sk-transparent sk-text-14-2857-403 sk-text">薄脆饼干</view>
								<view class="handle-box">
									<view class="price sk-transparent sk-text-14-2857-800 sk-text">6000分</view>
									<view class="exchange-btn sk-transparent sk-image">兑换</view>
								</view>
							</view>
							<view class="more list-index--more">
								<view class="uni-load-more more-index--uni-load-more"
									data-event-opts="tap,onClick,$event">
									<text class="uni-load-more__text more-index--uni-load-more__text"
										style="color:#777777;"></text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	export default {
		name: "zs-skeleton",
		props: {
			type: {
				type: String,
				default: 'home'
			},
			loading: {
				type: Boolean,
				default: true
			},
		},
		data() {
			return {

			};
		},
		methods: {
			clear(e) {},
		},
	}
</script>

<style lang="scss">
	.zs-skeleton {
		position: fixed;
		top: 0;
		left: 0;
		width: 100vw;
		height: 100vh;
		z-index: 9999999;
		background: #fff;
	}

	.home {
		.sk-transparent {
			color: transparent !important;
		}

		.sk-text-14-2857-766 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text {
			background-origin: content-box !important;
			background-clip: content-box !important;
			background-color: transparent !important;
			color: transparent !important;
			background-repeat: repeat-y !important;
		}

		.sk-text-14-2857-508 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 48.1884rpx;
			position: relative !important;
		}

		.sk-text--35-0000-226 {
			background-image: linear-gradient(transparent -35.0000%, #EEEEEE 0%, #EEEEEE 135.0000%, transparent 0%) !important;
			background-size: 100% 18.1159rpx;
			position: relative !important;
		}

		.sk-text-14-2857-400 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-378 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-255 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-474 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-208 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-42 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-491 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-708 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-838 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-197 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-12 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-720 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-798 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-752 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-150 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-543 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-237 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-199 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-117 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-934 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-245 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-827 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-401 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-188 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-891 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-690 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-745 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-text-14-2857-58 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-97 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 22.8261rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-40 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 20.2899rpx;
			position: relative !important;
		}

		.sk-button {
			color: #EFEFEF !important;
			background: #EFEFEF !important;
			border: none !important;
			box-shadow: none !important;
		}

		.sk-image {
			background: #EFEFEF !important;
		}

		.sk-pseudo::before,
		.sk-pseudo::after {
			background: #EFEFEF !important;
			background-image: none !important;
			color: transparent !important;
			border-color: transparent !important;
		}

		.sk-pseudo-rect::before,
		.sk-pseudo-rect::after {
			border-radius: 0 !important;
		}

		.sk-pseudo-circle::before,
		.sk-pseudo-circle::after {
			border-radius: 50% !important;
		}

		.sk-container {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;
			background-color: transparent;
		}

	}



	.integral {
		.sk-transparent {
			color: transparent !important;
		}

		.sk-text-14-2857-943 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 76.0870rpx;
			position: relative !important;
		}

		.sk-text {
			background-origin: content-box !important;
			background-clip: content-box !important;
			background-color: transparent !important;
			color: transparent !important;
			background-repeat: repeat-y !important;
		}

		.sk-text-14-2857-299 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-922 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: absolute !important;
		}

		.sk-text-14-2857-830 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: relative !important;
		}

		.sk-text-14-2857-292 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 50.7246rpx;
			position: relative !important;
		}

		.sk-text-14-2857-594 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-398 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-214 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: relative !important;
		}

		.sk-text-14-2857-115 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 50.7246rpx;
			position: relative !important;
		}

		.sk-text-14-2857-263 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-429 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-97 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: relative !important;
		}

		.sk-text-14-2857-514 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 50.7246rpx;
			position: relative !important;
		}

		.sk-text-14-2857-304 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-940 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-926 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: relative !important;
		}

		.sk-text-14-2857-255 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 50.7246rpx;
			position: relative !important;
		}

		.sk-text-14-2857-844 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-712 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-153 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 38.0435rpx;
			position: relative !important;
		}

		.sk-text-14-2857-778 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 50.7246rpx;
			position: relative !important;
		}

		.sk-text-14-2857-605 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-text-14-2857-586 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 32.9710rpx;
			position: relative !important;
		}

		.sk-image {
			background: #EFEFEF !important;
		}

		.sk-container {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;
			background-color: transparent;
		}

	}



	.integralShop {
		.sk-transparent {
			color: transparent !important;
		}

		.sk-text-14-2857-302 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text {
			background-origin: content-box !important;
			background-clip: content-box !important;
			background-color: transparent !important;
			color: transparent !important;
			background-repeat: repeat-y !important;
		}

		.sk-text-14-2857-723 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-958 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-194 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-601 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-60 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-403 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-text-14-2857-800 {
			background-image: linear-gradient(transparent 14.2857%, #EEEEEE 0%, #EEEEEE 85.7143%, transparent 0%) !important;
			background-size: 100% 35.5072rpx;
			position: relative !important;
		}

		.sk-button {
			color: #EFEFEF !important;
			background: #EFEFEF !important;
			border: none !important;
			box-shadow: none !important;
		}

		.sk-image {
			background: #EFEFEF !important;
		}

		.sk-pseudo::before,
		.sk-pseudo::after {
			background: #EFEFEF !important;
			background-image: none !important;
			color: transparent !important;
			border-color: transparent !important;
		}

		.sk-pseudo-rect::before,
		.sk-pseudo-rect::after {
			border-radius: 0 !important;
		}

		.sk-pseudo-circle::before,
		.sk-pseudo-circle::after {
			border-radius: 50% !important;
		}

		.sk-container {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			overflow: hidden;
			background-color: transparent;
		}
	}
</style>