<template>
|
<view>
|
<view class="page-index">
|
<view class="mp-header">
|
<view class="header" :style="{ paddingTop: menuTop + 'px' }">
|
<view class="serch-wrapper flex">
|
<view class="logo">
|
<image :src="logoUrl" mode="scaleToFill"></image>
|
</view>
|
<view @click="goToLink({ url: '/pages/goods_search/index', 'name': '搜索商品' }, 'search')"
|
:style="{ 'width': searchWidth + 'px', 'lineHeight': menuHeight + 'px', 'height': menuHeight + 'px', 'borderRadius': menuHeight / 2 + 'px' }"
|
class="input"><text class="iconfont icon-xiazai5"></text>
|
<text>搜索商品</text>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="mp-bg"></view>
|
<view :style="{ height: marTop + 'px' }"></view>
|
<view class="user_info" v-if="userInfoReady == 'hasUserInfo'">
|
<view class="user_head">
|
<!-- userInfo.avatar?userInfo.avatar: -->
|
<image :src="userInfo.avatar ? userInfo.avatar : defautHead"></image>
|
</view>
|
<view class="user_name">{{ userInfo.nickname ? userInfo.nickname : '微信客户' }}</view>
|
<view class="user_level" v-if="userInfo.vip">
|
<image :src="userInfo.vipIcon" mode="aspectFit"></image>
|
<!-- <text>{{userInfo.vipName}}</text> -->
|
</view>
|
<view class="user_careNum" @click="goToThird('/pages/profile/care-coupon-detail')">
|
<view class="num">{{ careBeanReady ? toThousands(myCareBean) : '-' }}</view>
|
<view class="label">悦养豆明细</view>
|
</view>
|
<navigator class="btn_vip flex" url='/pages/users/user_vip/index' hover-class='none'
|
@click="clickTrack('vip')"><text>查看会员权益</text><text class="iconfont icon-xiangyou"></text>
|
</navigator>
|
</view>
|
<view class="user_info" v-if="userInfoReady == 'needRegister'">
|
<view class="user_head">
|
<image src="https://ossacmall.bluedeer.com.cn/app/static/images/userHead_defaultNew.png"></image>
|
</view>
|
<view class="user_loginTips">未登录</view>
|
<view class="btn_toLogin flex" @click="goToLogin"><text>立即注册，登录</text><text
|
class="iconfont icon-xiangyou"></text></view>
|
</view>
|
<view v-if="buyList.length > 0" class="buy_list">
|
<view class="buy_wrapper" :style="'animation-duration:' + buyList.length * 2 + 's'">
|
<view class="buy_item" v-for="(buyItem, buyIndex) in buyList" :key="buyItem.uniKey">
|
{{ buyItem.level ? buyItem.level : '' }}
|
{{ buyItem.real_name }} 已购买{{ buyItem.product_name }}
|
</view>
|
</view>
|
</view>
|
<!-- banner -->
|
<view class="swiper" v-if="imgUrls && imgUrls.length">
|
<swiper indicator-dots="true" indicator-type="expand" :autoplay="true" :circular="circular"
|
interval="5000" :duration="duration" indicator-color="#979797" indicator-active-color="#FFE20E">
|
<block v-for="(imgUrlItem, imgUrlIndex) in imgUrls" :key="imgUrlItem.uniKey">
|
<swiper-item>
|
<view class='slide-navigator acea-row row-between-wrapper' hover-class='none'
|
@click="goToLink(imgUrlItem, 'banner')">
|
<image :src="imgUrlItem.pic" class="slide-image" lazy-load></image>
|
</view>
|
</swiper-item>
|
</block>
|
</swiper>
|
</view>
|
<!-- 新闻简报 -->
|
<view class='notice acea-row row-middle row-between' v-if="roll && roll.length">
|
<view class="pic">
|
<image src="https://ossacmall.bluedeer.com.cn/app/static/images/xinjian.png"></image>
|
</view>
|
<text class='line'>|</text>
|
<view class='swipers'>
|
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" interval="2500" duration="500"
|
vertical="true" circular="true">
|
<block v-for="(rollItem, rollIndex) in roll" :key='rollItem.uniKey'>
|
<swiper-item>
|
<navigator class='item' :url='rollItem.url' hover-class='none'
|
@click="clickTrack('news', rollItem)">
|
<view class='line1'>{{ rollItem.info }}</view>
|
</navigator>
|
</swiper-item>
|
</block>
|
</swiper>
|
</view>
|
<view class="iconfont icon-xiangyou"></view>
|
</view>
|
<!-- menu -->
|
<view class='nav acea-row' v-if="menus && menus.length">
|
<block v-for="(menuItem, menuIndex) in menus" :key="menuItem.uniKey">
|
<view class='item' v-if="menuItem.show == '2'" hover-class='none'
|
@click="goToLink(menuItem, 'menu')">
|
<view class='pictrue'>
|
<image :src='menuItem.pic' class="image"></image>
|
</view>
|
<view class="menu-txt">{{ menuItem.name }}</view>
|
</view>
|
</block>
|
</view>
|
<view class="serviceSupport"
|
v-if="serviceSupport && serviceSupport.items && serviceSupport.items.length > 0">
|
<div class="serviceSupport_item" v-for="serviceItem, serviceIndex in serviceSupport.items"
|
:key="serviceItem.uniKey">
|
<image v-if="serviceItem.image" :src="cleanUrl(serviceItem.image)" class="serviceSupport_itemImg">
|
</image>
|
<view class="serviceSupport_itemText">{{ serviceItem.name }}</view>
|
</div>
|
</view>
|
<!-- 每日特价 + 新品尝鲜 -->
|
<view class="promotion_pair"
|
v-if="(dealModule && dealModule.items && dealModule.items.length) || (newProductModule && newProductModule.items && newProductModule.items.length)">
|
<view class="pair_deal" v-if="dealModule && dealModule.items && dealModule.items.length">
|
<view class="pair_deal_head">
|
<view class="pair_deal_badge">{{ dealModule.title }}</view>
|
<view class="deal_count" v-if="dealCountdown">
|
<text class="deal_count_num">{{ dealCountdown.h }}</text>
|
<text class="deal_count_sep">:</text>
|
<text class="deal_count_num">{{ dealCountdown.m }}</text>
|
<text class="deal_count_sep">:</text>
|
<text class="deal_count_num">{{ dealCountdown.s }}</text>
|
</view>
|
</view>
|
<view class="pair_deal_sub" v-if="dealModule.subtitle">{{ dealModule.subtitle }}</view>
|
<swiper class="deal_swiper" :autoplay="true" :circular="dealModule.items.length > 1"
|
@change="dealSwiperChange">
|
<swiper-item v-for="dealItem in dealModule.items" :key="dealItem.uniKey">
|
<view class="deal_goods" @click="goModuleItem(dealItem)">
|
<view class="deal_goods_pic">
|
<image
|
:src="cleanUrl((dealItem.data && dealItem.data.image) ? dealItem.data.image : dealItem.image)"
|
mode="aspectFill"></image>
|
</view>
|
<view class="deal_goods_name">{{ dealItem.data && dealItem.data.storeName ?
|
dealItem.data.storeName : dealItem.name }}</view>
|
<view class="deal_progress">
|
<view class="deal_progress_bar">
|
<view class="deal_progress_inner"
|
:style="{ width: dealSoldPercent(dealItem) + '%' }"></view>
|
</view>
|
<text class="deal_progress_text">已抢{{ dealSold(dealItem) }}件</text>
|
</view>
|
<view class="deal_bottom">
|
<view class="deal_price">
|
<view class="deal_price_now" v-if="modulePrice(dealItem.data) !== ''">
|
<block v-if="moduleIsBean(dealItem.data)">{{ modulePrice(dealItem.data)
|
}}悦养豆</block>
|
<block v-else-if="dealItem.data.payWay == 1"><text
|
v-if="moduleCashPrice(dealItem.data)">¥ {{
|
moduleCashPrice(dealItem.data) }}</text><text
|
v-if="moduleCashPrice(dealItem.data) && moduleBeanNum(dealItem.data)">+</text><text
|
v-if="moduleBeanNum(dealItem.data)">{{ moduleBeanNum(dealItem.data)
|
}}悦养豆</text></block>
|
<block v-else>¥ {{ modulePrice(dealItem.data) }}
|
</block>
|
</view>
|
<view class="deal_price_old" v-if="moduleOldPrice(dealItem.data) !== ''">原价<text
|
v-if="moduleIsBean(dealItem.data)">{{ moduleOldPrice(dealItem.data)
|
}}悦养豆</text><text v-else>¥{{ moduleOldPrice(dealItem.data) }}</text>
|
</view>
|
</view>
|
<view class="deal_buy"></view>
|
</view>
|
</view>
|
</swiper-item>
|
</swiper>
|
<view class="deal_dots" v-if="dealModule.items.length > 1">
|
<text v-for="(dealDot, dealDotIndex) in dealModule.items" :key="dealDotIndex" class="deal_dot"
|
:class="{ on: dealDotIndex == dealCurrent }"></text>
|
</view>
|
</view>
|
<view class="pair_right"
|
v-if="(newProductModule && newProductModule.items && newProductModule.items.length) || (healthZoneModule && healthZoneModule.items && healthZoneModule.items.length)">
|
<view class="pair_new"
|
v-if="newProductModule && newProductModule.items && newProductModule.items.length">
|
<view class="pair_new_head">
|
<text class="pair_new_title">{{ newProductModule.title }}</text>
|
<text class="pair_new_sub" v-if="newProductModule.subtitle">{{ newProductModule.subtitle
|
}}</text>
|
</view>
|
<swiper class="pair_new_list" :autoplay="newProductGroups.length > 1"
|
:circular="newProductGroups.length > 1" interval="4000" duration="500"
|
@change="newProductSwiperChange">
|
<swiper-item class="pair_new_swiper_item" v-for="(group, groupIndex) in newProductGroups"
|
:key="groupIndex">
|
<view class="pair_new_list_wrapper">
|
<view class="pair_new_item" v-for="npItem in group" :key="npItem.uniKey"
|
@click="goModuleItem(npItem)">
|
<view class="pair_new_pic">
|
<image
|
:src="cleanUrl((npItem.data && npItem.data.image) ? npItem.data.image : npItem.image)"
|
mode="aspectFill"></image>
|
</view>
|
<view class="pair_new_price" v-if="modulePrice(npItem.data) !== ''">
|
<block v-if="moduleIsBean(npItem.data)">{{ modulePrice(npItem.data) }}<text
|
class="pair_new_unit">悦养豆</text></block>
|
<block v-else-if="npItem.data.payWay == 1"><text
|
v-if="moduleCashPrice(npItem.data)">¥ {{
|
moduleCashPrice(npItem.data) }}</text><text
|
v-if="moduleCashPrice(npItem.data) && moduleBeanNum(npItem.data)">+</text><text
|
v-if="moduleBeanNum(npItem.data)">{{ moduleBeanNum(npItem.data)
|
}}悦养豆</text></block>
|
<block v-else>¥ {{ modulePrice(npItem.data) }}
|
</block>
|
</view>
|
<view class="pair_new_old" v-if="moduleOldPrice(npItem.data) !== ''">
|
原价<text v-if="moduleIsBean(npItem.data)">{{ moduleOldPrice(npItem.data)
|
}}悦养豆</text><text v-else>¥{{ moduleOldPrice(npItem.data) }}</text>
|
</view>
|
</view>
|
</view>
|
</swiper-item>
|
</swiper>
|
<view class="pair_new_dots" v-if="newProductGroups.length > 1">
|
<text v-for="(dot, dotIndex) in newProductGroups" :key="dotIndex" class="pair_new_dot"
|
:class="{ on: dotIndex == newProductCurrent }"></text>
|
</view>
|
</view>
|
<view class="pair_zone"
|
v-if="healthZoneModule && healthZoneModule.items && healthZoneModule.items.length">
|
<view class="pair_zone_head">
|
<view class="pair_zone_badge">{{ healthZoneModule.title }}</view>
|
<text class="pair_zone_sub" v-if="healthZoneModule.subtitle">{{ healthZoneModule.subtitle
|
}}</text>
|
</view>
|
<swiper class="pair_zone_swiper" :autoplay="healthZoneModule.items.length > 1"
|
:circular="healthZoneModule.items.length > 1" interval="4000" duration="500"
|
:next-margin="healthZoneModule.items.length > 1 ? '40rpx' : '0'" @change="zoneSwiperChange">
|
<swiper-item class="pair_zone_swiper_item"
|
:class="healthZoneModule.items.length > 1 ? 'multi' : 'single'"
|
v-for="zoneItem in healthZoneModule.items" :key="zoneItem.uniKey">
|
<image class="pair_zone_img" :src="zoneImg(zoneItem)" mode="aspectFill"
|
@click="goModuleItem(zoneItem)"></image>
|
</swiper-item>
|
</swiper>
|
<view class="pair_zone_dots" v-if="healthZoneModule.items.length > 1">
|
<text v-for="(zoneDot, zoneDotIndex) in healthZoneModule.items" :key="zoneDotIndex"
|
class="pair_zone_dot" :class="{ on: zoneDotIndex == zoneCurrent }"></text>
|
</view>
|
</view>
|
</view>
|
</view>
|
<!-- 活动推荐banner -->
|
<view class="module_banner"
|
v-if="activityBannerModule && activityBannerModule.items && activityBannerModule.items.length">
|
<swiper class="module_banner_swiper" :autoplay="activityBannerModule.items.length > 1"
|
:circular="activityBannerModule.items.length > 1" interval="4000" duration="500"
|
@change="bannerSwiperChange">
|
<swiper-item v-for="bannerItem in activityBannerModule.items" :key="bannerItem.uniKey">
|
<image class="module_banner_img" :src="cleanUrl(bannerItem.image)" mode="aspectFill"
|
@click="goModuleItem(bannerItem)"></image>
|
</swiper-item>
|
</swiper>
|
<view class="module_banner_dots" v-if="activityBannerModule.items.length > 1">
|
<text v-for="(bannerDot, bannerDotIndex) in activityBannerModule.items" :key="bannerDotIndex"
|
class="module_banner_dot" :class="{ on: bannerDotIndex == bannerCurrent }"></text>
|
</view>
|
</view>
|
<!-- 热门榜单 -->
|
<view class="module_rank" v-if="hotRankModule && hotCategoryList && hotCategoryList.length">
|
<view class="module_rank_head">
|
<view class="module_rank_badge">{{ hotRankModule.title }}</view>
|
<text class="module_rank_sub" v-if="hotRankModule.subtitle">{{ hotRankModule.subtitle }}</text>
|
</view>
|
<view class="module_rank_body">
|
<view class="module_rank_tabs" v-if="hotCategoryList.length > 1">
|
<scroll-view class="module_rank_tabsScroll" scroll-x="true">
|
<view class="module_rank_tabs_wrapper">
|
<text v-for="(catItem, catIndex) in hotCategoryList" :key="catItem.uniKey"
|
class="module_rank_tab" :class="{ on: catIndex == hotRankIndex }"
|
@click="changeHotRank(catIndex)">{{ catItem.name }}</text>
|
</view>
|
</scroll-view>
|
</view>
|
<view class="module_rank_list" v-if="rankProducts.length">
|
<view class="module_rank_item" v-for="rankItem, rankIndex in rankProducts" :key="rankItem.id"
|
@click="goRankProduct(rankItem)"
|
:class="{ mid: (rankProducts.length >= 3 && rankIndex == 1) || (rankProducts.length == 1 && rankIndex == 0) }">
|
<!-- @click="goRankProduct(rankItem)" -->
|
<view class="rank_badge" :class="'rank' + rankItem.rank" v-if="rankIndex < 3">
|
</view>
|
<view class="rank_pic">
|
<image :src="cleanUrl(rankItem.image)" mode="aspectFill"></image>
|
</view>
|
<view class="rank_buy">{{ formatBuyCount(rankItem.buyerCount) }}人已购买</view>
|
<view class="rank_name">{{ rankItem.storeName }}</view>
|
<view class="rank_price">
|
<view class="rank_price_now" v-if="modulePrice(rankItem) !== ''">
|
<block v-if="moduleIsBean(rankItem)">{{ modulePrice(rankItem) }}悦养豆</block>
|
<block v-else-if="rankItem.payWay == 1"><text v-if="moduleCashPrice(rankItem)">¥ {{
|
moduleCashPrice(rankItem) }}</text><text
|
v-if="moduleCashPrice(rankItem) && moduleBeanNum(rankItem)">+</text><text
|
v-if="moduleBeanNum(rankItem)">{{ moduleBeanNum(rankItem) }}悦养豆</text>
|
</block>
|
<block v-else>¥ {{ modulePrice(rankItem) }}</block>
|
</view>
|
</view>
|
<view class="rank_old" v-if="moduleOldPrice(rankItem) !== ''">原价<text
|
v-if="moduleIsBean(rankItem)">{{ moduleOldPrice(rankItem) }}悦养豆</text><text
|
v-else>¥{{
|
moduleOldPrice(rankItem) }}</text></view>
|
<view class="rank_cart "></view>
|
</view>
|
<image v-if="isLoadingRank"
|
style="width: 50rpx; height: 50rpx;position:absolute;left:50%;top:50%;margin-left:-25rpx;margin-top: -25rpx;"
|
src="https://ossacmall.bluedeer.com.cn/app/static/images/loading.gif" mode="aspectFill">
|
</image>
|
</view>
|
</view>
|
</view>
|
<!-- 臻选品牌 -->
|
<view class="module_brand" v-if="brandWallModule && brandWallModule.items && brandWallModule.items.length">
|
<view class="module_brand_title">{{ brandWallModule.title }}</view>
|
<view class="module_brand_sub" v-if="brandWallModule.subtitle">{{ brandWallModule.subtitle }}</view>
|
<swiper class="module_brand_swiper" :autoplay="brandGroups.length > 1"
|
:circular="brandGroups.length > 1" interval="4000" duration="500" @change="brandSwiperChange">
|
<swiper-item class="module_brand_swiper_item" v-for="(group, groupIndex) in brandGroups"
|
:key="groupIndex">
|
<view class="module_brand_box">
|
<view class="module_brand_item" v-for="brandItem in group" :key="brandItem.uniKey"
|
@click="goModuleItem(brandItem)">
|
<image :src="cleanUrl(brandItem.image)" mode="aspectFit"></image>
|
</view>
|
</view>
|
</swiper-item>
|
</swiper>
|
<view class="module_brand_dots" v-if="brandGroups.length > 1">
|
<text v-for="(brandDot, brandDotIndex) in brandGroups" :key="brandDotIndex" class="module_brand_dot"
|
:class="{ on: brandDotIndex == brandCurrent }"></text>
|
</view>
|
</view>
|
|
<!-- 优惠券 -->
|
<!-- <view class="couponList" v-if="userInfoReady=='hasUserInfo'&&couponList&&couponList.length > 0">
|
<img :src="'https://ossacmall.bluedeer.com.cn/app/static/images/h_cImg'+((userInfo.vipName&&extVipLevelAttr.indexOf(userInfo.vipName)>0)?extVipLevelAttr.indexOf(userInfo.vipName):1)+'.png'"
|
alt="">
|
<scroll-view class="couponList_box scroll-view_H" scroll-x="true" scroll-with-animation>
|
<view class="couponList_wrapper">
|
<block v-for="couponItem, couponIndex in couponList" :key="couponItem.uniKey">
|
<view class='couponList_item' v-if="!couponItem.useTime">
|
<block v-if="couponItem.moneyType==2">
|
<view class="amount">
|
{{couponItem.money?Number(couponItem.money)*10:''}}
|
<text class="unit">折</text>
|
</view>
|
<view class="name line2">{{ couponItem.name }}</view>
|
|
</block>
|
|
<block v-else-if="couponItem.moneyType==4">
|
<view class="amount amountSmall">
|
<block v-if="couponItem.userLvType==4">
|
<text>臻享专区</text><text class="text2">惠购权</text>
|
</block>
|
<block v-else-if="couponItem.userLvType==3">
|
<text>臻享会员</text><text class="text2">权益券</text>
|
</block>
|
<block v-else-if="couponItem.userLvType==2">
|
<text>悦享会员</text><text class="text2">权益券</text>
|
</block>
|
<block v-else-if="couponItem.userLvType==1">
|
<text>畅享会员</text><text class="text2">权益券</text>
|
</block>
|
<block v-else-if="couponItem.userLvType==0">
|
<text>普通会员</text><text class="text2">权益券</text>
|
</block>
|
<block v-else-if="couponItem.userLvType==-1">
|
<text>臻享会员</text><text class="text2">体验券</text>
|
</block>
|
<block v-else>
|
{{couponItem.name}}
|
</block>
|
</view>
|
</block>
|
<block v-else>
|
<view class="amount">
|
<view class="label">¥</view>{{couponItem.money?Number(couponItem.money):''}}
|
</view>
|
|
<view class="name line2">{{ couponItem.name }}</view>
|
</block>
|
|
<view class="btn" v-if="couponItem.type=='import'" @click="getCoupon(false, couponItem, couponIndex)">
|
{{ statusMap[couponItem.validStr] }}
|
</view>
|
<view class="btn" v-else @click="getCoupon(false, couponItem, couponIndex)">
|
{{ couponItem.isUse ? '去使用' : '立即领取' }}
|
</view>
|
</view>
|
</block>
|
|
</view>
|
</scroll-view>
|
<view v-if="couponList.length > 0 && !isGetWholeCoupon" class='couponList_btn' hover-class='none'
|
@click="getCoupon(true)">一键领取全部</view>
|
<view v-else class='couponList_btn' hover-class='none' @click="goToCoupon()">我的优惠券</view>
|
</view> -->
|
|
<!-- 专区入口 -->
|
<view v-if="zoneList && zoneList.length > 0" class="zoneList_title">探索健康好物</view>
|
<scroll-view v-if="zoneList && zoneList.length > 0" class="zoneList_box scroll-view_H"
|
:class="zoneList.length == 1 ? 'isSingle' : ''" scroll-x="true">
|
<view class="zoneList_wrapper">
|
<block v-for="(zoneItem, zoneIndex) in zoneList" :key="zoneItem.uniKey">
|
<view class="zoneList_item">
|
<view
|
@click="goToLink({ 'url': '/pages/zone/index?id=' + zoneItem.id, 'name': '专区' }, 'zone')">
|
<image :src="zoneItem.homepageImage"></image>
|
</view>
|
</view>
|
</block>
|
</view>
|
</scroll-view>
|
<!--抽奖-->
|
<view v-if="homeBanner.homeBannerStatus" class="index_lottery" @click="goToLottery">
|
<image class="index_lottery_img" :src="homeBanner.homeBannerImg" mode="widthFix"></image>
|
</view>
|
<!-- 活动-->
|
<a_seckill ref="seckill" :careBeanRate="careBeanRate"></a_seckill>
|
<b_combination></b_combination>
|
<c_bargain></c_bargain>
|
<view class="goods_menuBox" v-if="categoryList && categoryList.length > 0"
|
:style="'top:' + (marTop) + 'px;'">
|
<view class="subMenu">
|
<scroll-view scroll-x="true" scroll-with-animation='true' style="width: 100%;">
|
<view class="subMenu_wrapper">
|
<block v-for="(catetem, cateIndex) in categoryList" :key="catetem.uniKey"><text
|
class="subMenu_item" :class='cateIndex == categoryIndex ? "on" : ""'
|
@click='changeCategoryTab(cateIndex, true)'><text class="text">{{ catetem.name
|
}}</text></text></block>
|
</view>
|
</scroll-view>
|
</view>
|
</view>
|
<view class="goodsSection" v-if="categoryList && categoryList.length > 0" id="goodsSection"
|
:style="loadingGood ? ('height:' + viewHeight + 'px;overflow:hidden') : ''">
|
<view class="cf list" v-if="productList && productList.length > 0">
|
<view class="list_column cfl">
|
<block v-for="(gitem, gindex) in productList" :key="gindex">
|
<GoodBlock v-if="gindex % 2 == 0" :pageName="'首页'" :moduleName="'商品推荐'"
|
:careBeanRate="careBeanRate" :size="'big'" :goodsInfo="gitem"></GoodBlock>
|
</block>
|
</view>
|
<view class="list_column cfr">
|
<block v-for="(gitem, gindex) in productList" :key="gindex">
|
<GoodBlock v-if="gindex % 2 == 1" :pageName="'首页'" :moduleName="'商品推荐'"
|
:careBeanRate="careBeanRate" :size="'big'" :goodsInfo="gitem"></GoodBlock>
|
</block>
|
</view>
|
</view>
|
<view v-if="loading" class="loadingTips">加载中...</view>
|
<view v-else-if="productList && productList.length <= 0" class="loadingTips">暂无数据</view>
|
<view v-else-if="loadend" class="loadingTips">已全部加载</view>
|
<view v-else class="loadingTips">上拉加载更多</view>
|
<view class="pauseView" v-if="isPause"></view>
|
</view>
|
<view style="height: 218rpx;"></view>
|
<tabBar :tab-id="1"></tabBar>
|
<popCoupon ref="popCoupon" :pageName="'index'" @resetCoupon="resetCoupon"></popCoupon>
|
<popActivity :activity="homeActivity" ref="popActivity" @hide="showActivity"></popActivity>
|
<popNewuser ref="popNewuserRef"></popNewuser>
|
</view>
|
</view>
|
</template>
|
|
<script>
|
import {
|
HTTP_REQUEST_URL,
|
THIRD_APPID
|
} from '@/config/app';
|
import Auth from '@/libs/wechat';
|
import Cache from '../../utils/cache';
|
var statusBarHeight = uni.getSystemSetting().statusBarHeight + 'px';
|
let app = getApp();
|
import {
|
getUserBean
|
} from '@/api/user.js';
|
import {
|
toLogin
|
} from '@/libs/login.js';
|
import {
|
getIndexModule,
|
getIndexData,
|
getIndexConfig,
|
setWholeCouponReceive,
|
setCouponReceive
|
} from '@/api/api.js';
|
// #ifdef MP-WEIXIN
|
import {
|
getTemlIds
|
} from '@/api/api.js';
|
import {
|
testAc,
|
dealUserBean,
|
testAgent,
|
handsCoupon,
|
handsList
|
} from '@/api/user.js';
|
|
// import {
|
// SUBSCRIBE_MESSAGE,
|
// TIPS_KEY
|
// } from '@/config/cache';
|
// #endif
|
// #ifdef H5
|
import {
|
follow
|
} from '@/api/public.js';
|
// #endif
|
import {
|
getShare
|
} from '@/api/public.js';
|
import a_seckill from './components/a_seckill';
|
import b_combination from './components/b_combination';
|
import c_bargain from './components/c_bargain';
|
import goodList from '@/components/goodList';
|
import ClipboardJS from "@/plugin/clipboard/clipboard.js";
|
import {
|
goShopDetail
|
} from '@/libs/order.js'
|
import {
|
mapGetters
|
} from "vuex";
|
import countDown from '@/components/countDown';
|
import {
|
getCategoryList,
|
getProductslist,
|
getStoreZoneAndCouponList,
|
getLast10Order
|
} from '@/api/store.js';
|
import recommend from '@/components/recommend';
|
import {
|
silenceBindingSpread
|
} from '@/utils';
|
// #ifndef MP
|
import {
|
kefuConfig
|
} from "@/api/public";
|
import {
|
getWechatConfig
|
} from "@/api/public";
|
// #endif
|
|
import {
|
getMdayLast
|
} from '@/api/lottery.js';
|
import GoodBlock from "@/pages/goods_block/index.vue";
|
import Loading from '@/components/Loading/index.vue';
|
import popCoupon from '@/components/popCoupon/index.vue';
|
import popActivity from '@/components/popActivity/index.vue';
|
import popNewuser from '@/components/popNewuser/index.vue';
|
const arrTemp = ["beforePay", "afterPay", "refundApply", "beforeRecharge", "createBargain", "pink"];
|
export default {
|
computed: {
|
...mapGetters(['isLogin', 'uid']),
|
// 热门榜单当前分类下的商品（按设计稿排序：TOP2、TOP1、TOP3，TOP1居中抬高）
|
// rankProducts() {
|
// let mod = this.hotRankModule;
|
// if (!mod || !mod.items || !mod.items.length) return [];
|
// let idx = Math.min(this.hotRankIndex, mod.items.length - 1);
|
// let cat = mod.items[idx];
|
// let ps = (cat && cat.data && cat.data.products) ? cat.data.products : [];
|
// let arr = ps.map((p, i) => {
|
// return {
|
// p: p,
|
// jumpType: cat.jumpType,
|
// jumpTarget: cat.jumpTarget,
|
// rank: i + 1,
|
// mid: false
|
// };
|
// });
|
// if (arr.length >= 3) {
|
// let ordered = [arr[1], arr[0], arr[2]];
|
// ordered[1].mid = true;
|
// return ordered;
|
// }
|
// if (arr.length == 1) {
|
// arr[0].mid = true;
|
// }
|
// return arr;
|
// },
|
// 臻选品牌按8个一组分页
|
brandGroups() {
|
let mod = this.brandWallModule;
|
if (!mod || !mod.items || !mod.items.length) return [];
|
let size = 8;
|
let groups = [];
|
for (let i = 0; i < mod.items.length; i += size) {
|
groups.push(mod.items.slice(i, i + size));
|
}
|
return groups;
|
},
|
// 新品尝鲜按2个一组分页
|
newProductGroups() {
|
let mod = this.newProductModule;
|
if (!mod || !mod.items || !mod.items.length) return [];
|
let size = 2;
|
let groups = [];
|
for (let i = 0; i < mod.items.length; i += size) {
|
groups.push(mod.items.slice(i, i + size));
|
}
|
return groups;
|
}
|
},
|
components: {
|
goodList,
|
countDown,
|
a_seckill,
|
b_combination,
|
c_bargain,
|
recommend,
|
Loading,
|
GoodBlock,
|
popCoupon,
|
popActivity,
|
popNewuser
|
},
|
data() {
|
return {
|
isLoadingRank: false,
|
rankProducts: [],
|
defautHead: 'https://ossacmall.bluedeer.com.cn/app/static/images/userHead_defaultNew.png',
|
buyList: [],
|
pageHeight: 0,
|
loaded: false,
|
loading: false,
|
isAuto: false, //没有授权的不会自动授权
|
isShowAuth: false, //是否隐藏授权
|
statusBarHeight: statusBarHeight,
|
navIndex: 0,
|
navTop: [],
|
followUrl: "",
|
followHid: true,
|
followCode: false,
|
logoUrl: "",
|
imgUrls: [],
|
itemNew: [],
|
menus: [],
|
zoneList: [],
|
bastInfo: '',
|
fastInfo: '',
|
fastList: [],
|
firstInfo: '',
|
salesInfo: '',
|
indicatorDots: false,
|
circular: true,
|
autoplay: true,
|
interval: 5000,
|
duration: 500,
|
window: false,
|
iShidden: false,
|
headerHeight: 0,
|
newGoodsBananr: '',
|
couponList: [],
|
liveList: [],
|
hotList: [{
|
pic: 'https://ossacmall.bluedeer.com.cn/app/static/images/hot_001.png'
|
}, {
|
pic: 'https://ossacmall.bluedeer.com.cn/app/static/images/hot_002.png'
|
}, {
|
pic: 'https://ossacmall.bluedeer.com.cn/app/static/images/hot_003.png'
|
}],
|
ProductNavindex: 0,
|
marTop: 0,
|
childID: 0,
|
loadend: false,
|
loadTitle: '加载更多',
|
sortProduct: [],
|
is_switch: true,
|
hotPage: 1,
|
hotLimit: 10,
|
hotScroll: false,
|
explosiveMoney: [],
|
prodeuctTop: 0,
|
searchH: 0,
|
isFixed: false,
|
goodScroll: true, //精品推荐开关
|
params: { //精品推荐分页
|
page: 1,
|
limit: 10,
|
},
|
tempArr: [], //精品推荐临时数组
|
roll: [], // 新闻简报
|
site_name: '', //首页title
|
iSshowH: false,
|
configApi: {}, //分享类容配置
|
spikeList: [], // 秒杀
|
point: '',
|
privacyStatus: false, // 隐私政策是否同意过
|
tabsScrollLeft: 0, // tabs当前偏移量
|
scrollLeft: 0,
|
lineColor: 'red',
|
lineStyle: {}, // 下划线位置--动态甲酸
|
listActive: 0, // 当前选中项
|
|
duration: 0.2, // 下划线动画时长
|
menuTop: 0,
|
menuHeight: 50,
|
searchWidth: 0,
|
windowWidth: 0,
|
windowHeight: 0,
|
isConfigReady: false,
|
hasLoadGroomList: false,
|
hasLoadCouponList: false,
|
isGetWholeCoupon: false,
|
isGetWholeCoupon2: false,
|
tabArr: [
|
'',
|
'更多健康好物'
|
],
|
hotCategoryList: [],
|
categoryList: [],
|
subCategoryList: [],
|
productList: [],
|
categoryIndex: 0,
|
categorySubIndex: 0,
|
where: {
|
page: 1,
|
limit: 10,
|
cid: 0,
|
},
|
userInfo: {
|
|
},
|
userInfoReady: '',
|
scrollHeight: 100,
|
scrollTop: 0,
|
oldScrollTop: 0,
|
pageScrollTop: 0,
|
viewHeight: 0,
|
loadingGood: false,
|
careBeanRate: 0,
|
tabLinkArr: [
|
'pages/index/index',
|
'pages/goods_cate/goods_cate',
|
'pages/user/index'
|
],
|
extVipLevelAttr: [
|
'非会员',
|
'普通会员',
|
'畅享会员',
|
'悦享会员',
|
'臻享会员'
|
],
|
isPageShow: false,
|
loginBackFn: null,
|
myCareBean: 0,
|
careBeanReady: false,
|
newCouponList: [],
|
isFromReturn: false,
|
hasListenReturn: false,
|
statusMap: {
|
'usable': '去使用',
|
'unusable': '已使用',
|
'overdue': '已过期',
|
'notStart': '未开始'
|
},
|
isClicking: false,
|
hasLottery: false,
|
homeBanner: {},
|
serviceSupport: {},
|
homeActivity: {},
|
dealModule: null,
|
newProductModule: null,
|
healthZoneModule: null,
|
activityBannerModule: null,
|
hotRankModule: null,
|
hotRankIndex: 0,
|
zoneCurrent: 0,
|
brandCurrent: 0,
|
newProductCurrent: 0,
|
brandWallModule: null,
|
dealCurrent: 0,
|
bannerCurrent: 0,
|
dealCountdown: null,
|
dealEndTs: 0,
|
serverTimeOffset: 0
|
}
|
},
|
watch: {},
|
mounted() { },
|
onLoad() {
|
let that = this;
|
console.log('pageIndex onLoad');
|
// 获取系统信息
|
uni.getSystemInfo({
|
success(res) {
|
that.$store.commit("SYSTEM_PLATFORM", res.platform);
|
that.windowWidth = res.windowWidth;
|
that.windowHeight = res.windowHeight;
|
that.pageHeight = (res.windowHeight - res.statusBarHeight) / res.windowWidth * 750;
|
let menuSize = uni.getMenuButtonBoundingClientRect();
|
console.log('----------------------menuSize--------------------');
|
console.log(menuSize);
|
that.menuTop = menuSize.top;
|
that.menuHeight = menuSize.height;
|
that.searchWidth = uni.getMenuButtonBoundingClientRect().left - 210 / 750 * that.windowWidth;
|
that.$nextTick(() => {
|
let query = uni.createSelectorQuery().in(that);
|
let info = query.select(".mp-header");
|
info.boundingClientRect(function (data) {
|
if (data) {
|
that.marTop = data.height;
|
that.viewHeight = that.windowHeight - data.height - 200 / 750 *
|
that.windowWidth;
|
that.poTop = Number(data.height) + 84
|
}
|
|
}).exec()
|
})
|
}
|
});
|
this.getTemlIds();
|
if (!this.hasListenReturn) {
|
uni.$on('returnEvent', function (data) {
|
console.log('listen returnEvent');
|
if (data && (data.name == 'tabBar' || data.name == 'order')) {
|
that.isFromReturn = false;
|
//强制刷新
|
// that.isFromReturn = (new Date()).getTime();
|
// console.log('listen return ' + that.isFromReturn);
|
} else if (data && data.name == 'goods_details') {
|
that.isFromReturn = (new Date()).getTime();
|
console.log('listen return ' + that.isFromReturn);
|
}
|
});
|
this.hasListenReturn = true;
|
}
|
},
|
onHide() {
|
let that = this;
|
if (that.$store.getters.isSystemHide) {
|
console.log('系统事件触发了onhide事件');
|
return false;
|
}
|
this.isPageShow = false;
|
clearInterval(this.dealTimer);
|
uni.$off('updateCareBeanRate', that.careBeanRateReadyFn);
|
uni.$off('BELONG_READY', that.belongInfoReadyFn);
|
uni.$off('loginFlSuccess', that.registerFn);
|
setTimeout(function () {
|
that.isFromReturn = (new Date()).getTime();
|
console.log('listen onUnload ' + that.isFromReturn);
|
}, 200)
|
},
|
onShow() {
|
let that = this;
|
if (that.$store.getters.isSystemHide) {
|
console.log('系统事件触发了onshow事件');
|
return false;
|
}
|
uni.$off('updateCareBeanRate', that.careBeanRateReadyFn);
|
uni.$off('BELONG_READY', that.belongInfoReadyFn);
|
uni.$off('loginFlSuccess', that.registerFn);
|
that.isPageShow = true;
|
if (that.dealEndTs) {
|
clearInterval(that.dealTimer);
|
that.updateDealCountdown();
|
that.dealTimer = setInterval(function () {
|
that.updateDealCountdown();
|
}, 1000);
|
}
|
|
uni.setNavigationBarTitle({
|
title: that.site_name
|
});
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
console.log('------------------page onShow start-----------------');
|
console.log('route', currPage.route);
|
console.log('options', currPage.options);
|
console.log('------------------page onShow end-----------------');
|
console.log('onshow return ' + this.isFromReturn + ',' + (new Date()).getTime());
|
if (that.isFromReturn && (new Date()).getTime() - that.isFromReturn < 5 * 60 * 1000 && that.$store.getters.isLogin) {
|
console.log('首页不刷新')
|
that.getUserBean();
|
} else {
|
if (that.$store.getters.careBeanRate) {
|
that.careBeanRateReadyFn();
|
} else {
|
uni.$once('updateCareBeanRate', that.careBeanRateReadyFn);
|
}
|
if (that.$store.getters.isBelong) {
|
that.belongInfoReadyFn({
|
isRegister: false
|
})
|
} else {
|
uni.$once('BELONG_READY', that.belongInfoReadyFn);
|
}
|
}
|
that.isFromReturn = false;
|
},
|
onReachBottom() {
|
console.log('onReachBottom');
|
this.get_product_list();
|
},
|
methods: {
|
goToLottery() {
|
let that = this;
|
this.clickTrack('lottery');
|
function go() {
|
let miniProgramInfo = uni.getAccountInfoSync().miniProgram;
|
let url = that.homeBanner.homeBannerUrl;
|
url = url.replace("{{token}}", that.$store.getters.token).replace("{{unionId}}", that.$store.getters.unionId)
|
uni.navigateTo({
|
url: url
|
})
|
}
|
if (!that.$store.getters.isLogin) {
|
toLogin(that);
|
that.loginBackFn = function () {
|
go();
|
}
|
} else {
|
go();
|
}
|
},
|
careBeanRateReadyFn() {
|
let that = this;
|
that.$nextTick(() => {
|
that.$set(that, 'careBeanRate', that.$store.getters.careBeanRate)
|
})
|
},
|
// 清理接口返回图片地址中的多余字符（如反引号）
|
cleanUrl(url) {
|
if (!url) return '';
|
return url.replace(/[`\s]/g, '');
|
},
|
// 模块商品价格：与秒杀getUserLvPrice同口径，按商品userLv取会员价，无则取默认价
|
modulePrice(d) {
|
if (!d) return '';
|
let price = 0;
|
if (d.zoneId) {
|
price = d.zhenXiangPrice;
|
} else {
|
let lv = d.userLv;
|
if (lv === undefined || lv === null || lv === '') {
|
lv = (this.$store.getters.userInfo && this.$store.getters.userInfo.level) || 0;
|
}
|
if (lv == 0) {
|
price = d.puTongPrice;
|
} else if (lv == 1) {
|
price = d.changXiangPrice;
|
} else if (lv == 2) {
|
price = d.yueXiangPrice;
|
} else {
|
price = d.zhenXiangPrice;
|
}
|
}
|
if (price === undefined || price === null || price === '') {
|
price = d.price;
|
}
|
if (price === undefined || price === null) return '';
|
// 悦养豆商品与秒杀一致：取整显示
|
if (d.payWay == 3) {
|
return Math.round(parseFloat(price)) + '';
|
}
|
return price;
|
},
|
// 是否悦养豆商品（与秒杀payWay==3一致）
|
moduleIsBean(d) {
|
return !!(d && d.payWay == 3);
|
},
|
// 混合支付（payWay==1）悦养豆数量
|
moduleBeanNum(d) {
|
let n = Math.round(Number(d && d.maxCareBeanNumber) || 0);
|
return n > 0 ? n : 0;
|
},
|
// 混合支付（payWay==1）现金部分：会员价 - 悦养豆抵扣（与商品卡片getSelectPrice一致）
|
moduleCashPrice(d) {
|
if (!d) return '';
|
let price = parseFloat(this.modulePrice(d)) || 0;
|
let beans = Number(d.maxCareBeanNumber) || 0;
|
if (beans > 0 && Number(this.careBeanRate) > 0) {
|
price = price - beans / Number(this.careBeanRate);
|
}
|
return price > 0 ? price.toFixed(2) : '';
|
},
|
// 模块商品原价（参考商品卡片goods_block L32-L40：现价与原价一致时不显示）
|
moduleOldPrice(d) {
|
if (!d) return '';
|
// 悦养豆商品：原价取悦养豆基础值careBeanNumber（无则回退price），与会员悦养豆价比对
|
if (this.moduleIsBean(d)) {
|
let base = (d.careBeanNumber !== undefined && d.careBeanNumber !== null && d.careBeanNumber !==
|
'') ? d.careBeanNumber : d.price;
|
if (base === undefined || base === null || base === '') return '';
|
if (Number(base) == Number(this.modulePrice(d))) return '';
|
return base + '';
|
}
|
// 人民币/混合商品：原价取基础价price
|
let base = d.price;
|
if (base === undefined || base === null || base === '') return '';
|
if (d.payWay == 1) {
|
// 混合支付：与商品卡片一致，现金部分（getSelectPrice）与原价一致时不显示
|
let cash = parseFloat(this.moduleCashPrice(d)) || 0;
|
if (cash == Number(base)) return '';
|
} else {
|
if (Number(base) == Number(this.modulePrice(d))) return '';
|
}
|
return base + '';
|
},
|
dealSold(item) {
|
return item && item.data ? (item.data.salesItemCount || 0) : 0;
|
},
|
dealSoldPercent(item) {
|
if (!item || !item.data) return 0;
|
let sold = Number(item.data.salesItemCount || 0);
|
let stock = Number(item.data.stock || 0);
|
if (sold + stock <= 0) return 0;
|
return Math.min(100, Math.round(sold / (sold + stock) * 100));
|
},
|
// 模块item跳转
|
goModuleItem(item) {
|
let that = this;
|
console.log(item);
|
if (!item || item.jumpType == 'NONE' || !item.jumpTarget) return;
|
this.clickTrack('module', item);
|
let url = item.jumpTarget;
|
|
console.log('goModuleItem', item, url);
|
if (url.indexOf('/') !== 0) {
|
url = '/' + url;
|
}
|
if (that.isTabLink(url)) {
|
uni.switchTab({
|
url: url
|
});
|
} else {
|
uni.navigateTo({
|
url: url
|
});
|
}
|
},
|
// 健康专区图片
|
zoneImg(item) {
|
let img = (item && item.image) ? (item.image) : ((item && item.data && item.data.image) ? item.data.image : (item ? item.homepageImage : ''));
|
return this.cleanUrl(img);
|
},
|
zoneSwiperChange(e) {
|
this.zoneCurrent = e.detail.current;
|
},
|
brandSwiperChange(e) {
|
this.brandCurrent = e.detail.current;
|
},
|
newProductSwiperChange(e) {
|
this.newProductCurrent = e.detail.current;
|
},
|
// 热门榜单切换分类
|
changeHotRank(index) {
|
this.hotRankIndex = index;
|
this.getRankProductList();
|
},
|
getRankProductList() {
|
let that = this;
|
let cid = this.hotCategoryList[this.hotRankIndex].id || '';
|
that.rankProducts = [];
|
that.isLoadingRank = true;
|
getProductslist({
|
cid: cid,
|
page: 1,
|
limit: 3,
|
buyerCountOrder: 'desc',
|
}).then(res => {
|
that.isLoadingRank = false;
|
if (res && res.data && res.data.list) {
|
res.data.list.forEach((item, index) => {
|
item.rank = index + 1;
|
});
|
if (res.data.list.length >= 3) {
|
that.rankProducts = [
|
res.data.list[1],
|
res.data.list[0],
|
res.data.list[2]
|
];
|
} else {
|
that.rankProducts = res.data.list;
|
}
|
}
|
}).catch(() => {
|
that.isLoadingRank = false;
|
});
|
|
},
|
// 已购人数格式化（过万显示X万+）
|
formatBuyCount(num) {
|
let n = Math.floor(Number(num) || 0);
|
if (n >= 10000) {
|
return Math.floor(n / 1000) / 10 + '万+';
|
}
|
return n + '';
|
},
|
// 榜单商品跳转详情
|
goRankProduct(p) {
|
if (!p || !p.id) return;
|
this.clickTrack('module', {
|
name: p.storeName
|
});
|
uni.navigateTo({
|
url: '/pages/goods_details/index?id=' + p.id
|
});
|
},
|
dealSwiperChange(e) {
|
this.dealCurrent = e.detail.current;
|
},
|
bannerSwiperChange(e) {
|
this.bannerCurrent = e.detail.current;
|
},
|
// 每日特价倒计时（以服务端时间为准，到当天23:59:59）
|
initDealCountdown(serverTime) {
|
let that = this;
|
let now = Number(serverTime) || Date.now();
|
that.serverTimeOffset = now - Date.now();
|
let d = new Date(now);
|
that.dealEndTs = new Date(d.getFullYear(), d.getMonth(), d.getDate(), 23, 59, 59).getTime();
|
clearInterval(that.dealTimer);
|
that.updateDealCountdown();
|
that.dealTimer = setInterval(function () {
|
that.updateDealCountdown();
|
}, 1000);
|
},
|
updateDealCountdown() {
|
let diff = Math.max(0, Math.floor((this.dealEndTs - (Date.now() + this.serverTimeOffset)) / 1000));
|
let h = Math.floor(diff / 3600);
|
let m = Math.floor((diff % 3600) / 60);
|
let s = diff % 60;
|
let pad = function (n) {
|
return n < 10 ? '0' + n : '' + n;
|
}
|
this.dealCountdown = {
|
h: pad(h),
|
m: pad(m),
|
s: pad(s)
|
};
|
},
|
belongInfoReadyFn(data) {
|
let that = this;
|
if (!data.isRegister) {
|
that.checkLoginFn();
|
}
|
},
|
checkLoginFn() {
|
let that = this;
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
that.addTrack('yy_pageView', {
|
pageTitle_var: '首页',
|
pagePath_var: currPage.route,
|
pageType_var: '首页'
|
});
|
that.getIndexData();
|
if (that.$store.getters.isLogin) {
|
that.onLoadFn();
|
} else {
|
that.userInfoReady = 'needRegister';
|
}
|
uni.$once('loginFlSuccess', that.registerFn);
|
},
|
|
registerFn() {
|
console.log('registerFn');
|
let that = this;
|
if (that.loginBackFn) {
|
that.loginBackFn();
|
}
|
that.loginBackFn = null;
|
},
|
getUserBean() {
|
let that = this;
|
getUserBean().then(res2 => {
|
that.careBeanReady = true;
|
that.myCareBean = res2.data.totalCareBeans;
|
});
|
},
|
onLoadFn() {
|
let that = this;
|
that.userInfo = that.$store.getters.userInfo;
|
that.getUserBean();
|
that.userInfoReady = 'hasUserInfo';
|
that.getBaseUserInfo();
|
|
},
|
clickTrack(type, item) {
|
var data = {
|
pageTitle_var: '首页',
|
firstTabName_var: '-'
|
};
|
if (type == 'search') {
|
data['moduleName_var'] = '页面顶部';
|
data['buttonName_var'] = '搜索商品';
|
}
|
if (type == 'third') {
|
data['moduleName_var'] = '页面顶部';
|
data['buttonName_var'] = '查看悦养豆';
|
}
|
if (type == 'vip') {
|
data['moduleName_var'] = '页面顶部';
|
data['buttonName_var'] = '查看会员权益';
|
} else if (type == 'banner') {
|
data['moduleName_var'] = '轮播卡片';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
} else if (type == 'menu') {
|
data['moduleName_var'] = '金刚位';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
} else if (type == 'zone') {
|
data['moduleName_var'] = '探索健康好物';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
} else if (type == 'lottery') {
|
data['moduleName_var'] = '抽奖';
|
data['buttonName_var'] = 'GO';
|
} else if (type == 'coupon') {
|
data['moduleName_var'] = '优惠券';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
} else if (type == 'cate') {
|
data['moduleName_var'] = '商品分类';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
} else if (type == 'module') {
|
data['moduleName_var'] = '首页运营模块';
|
data['buttonName_var'] = item.name ? item.name : '-';
|
}
|
this.addTrack('yy_marketPageClick', data);
|
},
|
goToThird(url, appId) {
|
//第三方小程序
|
// /pages/home/index?source=INSMART&sourceScene=test&agentNo=90028476&agentChannel=BK&agentCompany=123&agentBranch=123
|
|
if (url.indexOf('?') < 0) {
|
url += '?';
|
} else {
|
url += '&';
|
}
|
if (app.globalData.source) {
|
url += 'source=' + app.globalData.source;
|
} else {
|
url += 'source=MALL';
|
}
|
url += '&sourceScene=home';
|
url += '&agentNo=' + ((this.$store.getters.belong && this.$store.getters.belong.agentNo) ? this.$store
|
.getters.belong.agentNo : '');
|
url += '&agentChannel=' + ((this.$store.getters.belong && this.$store.getters.belong.channel) ? this.$store
|
.getters.belong.channel : ''); //归属代理人渠道
|
url += '&agentCompany=' + ((this.$store.getters.belong && this.$store.getters.belong.companyCode) ? this
|
.$store.getters.belong.companyCode : ''); //agentCompany
|
|
url += '&agentBranch=' + ((this.$store.getters.belong && this.$store.getters.belong.branchCode) ? this
|
.$store.getters.belong.branchCode : ''); //归属代理人支公司
|
url += '&custAgentOrgNo=' + ((this.$store.getters.belong && this.$store.getters.belong.subCode) ? this
|
.$store.getters.belong.subCode : ''); //归属代理人机构编码
|
|
url += 'unionId=' + this.$store.getters.unionId;
|
url += '&mobile=' + ((this.$store.getters.belong && this.$store.getters.belong.mobile) ? this.$store
|
.getters.belong.mobile : this.$store.getters.userInfo.mobile);
|
console.log(url);
|
|
|
|
let miniProgramInfo = uni.getAccountInfoSync().miniProgram;
|
uni.navigateToMiniProgram({
|
appId: appId ? appId : THIRD_APPID,
|
path: url,
|
envVersion: miniProgramInfo.envVersion == 'release' ? 'release' : 'trial',
|
})
|
|
// let params={};
|
// params['custAgentNo']=((this.$store.getters.belong && this.$store.getters.belong.agentNo) ? this.$store
|
// .getters.belong.agentNo : '');
|
// params['custAgentChnl']=((this.$store.getters.belong && this.$store.getters.belong.channel) ? this.$store
|
// .getters.belong.channel : '');
|
// params['custAgentCoy']=((this.$store.getters.belong && this.$store.getters.belong.companyCode) ? this
|
// .$store.getters.belong.companyCode : '');
|
// params['custAgentBranch']=((this.$store.getters.belong && this.$store.getters.belong.branchCode) ? this
|
// .$store.getters.belong.branchCode : '');
|
// params['custAgentOrgNo']=((this.$store.getters.belong && this.$store.getters.belong.subCode) ? this
|
// .$store.getters.belong.subCode : '');
|
// let webUrl='https://ossacmall.bluedeer.com.cn/qr/index.html?isMall=true'+(miniProgramInfo.envVersion == 'release' ? '' : '&isTrial=true')+'¶ms='+encodeURIComponent(JSON.stringify(params))+'&pageUrl='+encodeURIComponent(url);
|
// if(HTTP_REQUEST_URL.indexOf('tohours')>0){
|
// webUrl=webUrl.replace('https://ossacmall.bluedeer.com.cn/qr','https://sit.tohours.com/crmeb_web/qr/')
|
// }
|
// uni.navigateTo({
|
// url: '/pages/users/web_page/index?webUel='+encodeURIComponent(webUrl)
|
// })
|
|
this.clickTrack('third')
|
},
|
goToLink(item, type) {
|
let that = this;
|
function go() {
|
if (item.appid) {
|
that.goToThird(item.url, item.appid);
|
} else if (that.isTabLink(item.url)) {
|
let arr = item.url.split('?');
|
if (arr.length > 1) {
|
that.$store.commit('updateSwitchParams', {
|
switchParams: arr[1]
|
});
|
}
|
uni.switchTab({
|
url: arr[0]
|
});
|
} else {
|
uni.navigateTo({
|
url: item.url.replace("{{token}}", that.$store.getters.token).replace("{{unionId}}", that.$store.getters.unionId)
|
})
|
}
|
that.clickTrack(type, item);
|
}
|
console.log(item.url);
|
if (item.url.indexOf('needLogin=true') > 0 && !that.$store.getters.isLogin) {
|
toLogin(that);
|
that.loginBackFn = function () {
|
go();
|
}
|
} else {
|
go();
|
}
|
|
|
},
|
isTabLink(link) {
|
let isTab = false;
|
this.tabLinkArr.forEach((item) => {
|
if (link.indexOf(item) >= 0) {
|
isTab = true;
|
}
|
})
|
return isTab;
|
},
|
handleLoad() {
|
let that = this;
|
},
|
goToLogin() {
|
let that = this;
|
toLogin(that);
|
that.loginBackFn = function () {
|
that.userInfo = that.$store.getters.userInfo;
|
that.userInfoReady = 'hasUserInfo';
|
that.getBaseUserInfo();
|
that.getIndexData();
|
that.onLoadFn();
|
}
|
},
|
getBaseUserInfo() {
|
let that = this;
|
silenceBindingSpread();
|
},
|
goToCoupon: function () {
|
uni.navigateTo({
|
url: '/pages/users/user_coupon/index'
|
})
|
},
|
getCoupon: function (isWhole, orgItem, index) {
|
let that = this;
|
if (!that.$store.getters.isLogin) {
|
that.goToLogin();
|
return false;
|
}
|
if (that.isClicking) {
|
return false;
|
}
|
//领取优惠券
|
if (isWhole) {
|
this.clickTrack('coupon', {
|
'name': '一键领取'
|
})
|
let couponIds = [];
|
that.couponList.forEach((item1, index1) => {
|
if (!item1.isUse && item1.type != 'import') {
|
couponIds.push(item1.id);
|
}
|
})
|
if (couponIds.length > 0) {
|
var useNum = 0;
|
uni.showLoading();
|
that.isClicking = true;
|
setWholeCouponReceive({
|
couponIds: couponIds,
|
}).then(function (res) {
|
that.$util.Tips({
|
title: '领取成功'
|
});
|
let nameArr = [];
|
let idArr = [];
|
let hasCoupon4 = false;
|
that.couponList.forEach((item1, index1) => {
|
if (!item1.isUse && item1.type != 'import') {
|
that.couponList[index1].isUse = true;
|
nameArr.push(item1.name);
|
idArr.push(item1.id);
|
}
|
if (item1.moneyType == 4) {
|
hasCoupon4 = true;
|
}
|
});
|
that.isGetWholeCoupon = true;
|
that.addTrack('yy_getCoupon', {
|
'couponName_var': nameArr.join(','),
|
'couponId_var': idArr.join(',')
|
});
|
if (hasCoupon4) {
|
that.changeCategoryTab(that.categoryIndex);
|
}
|
uni.hideLoading();
|
that.isClicking = false;
|
}).catch(err => {
|
uni.hideLoading();
|
that.isClicking = false;
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
});
|
}
|
} else {
|
let item = orgItem || this.couponList[index]
|
if (item.isUse || (item.type == 'import' && item.validStr == 'usable')) {
|
|
that.isClicking = true;
|
var timer = setTimeout(() => {
|
that.isClicking = false;
|
clearTimeout(timer);
|
}, 500)
|
if (item.appId && item.toPath) {
|
that.goToThird(item.toPath, item.appId);
|
} else if (item.toPath) {
|
if (that.isTabLink(item.toPath)) {
|
uni.switchTab({
|
url: item.toPath
|
})
|
} else {
|
uni.navigateTo({
|
url: item.toPath
|
})
|
}
|
} else {
|
uni.switchTab({
|
url: '/pages/goods_cate/goods_cate'
|
})
|
}
|
} else if (item.type !== 'import') {
|
uni.showLoading();
|
that.isClicking = true;
|
setCouponReceive(item.id).then(function (res) {
|
that.addTrack('yy_getCoupon', {
|
'couponName_var': item.name,
|
'couponId_var': item.id
|
});
|
that.$set(that.couponList[index], 'isUse', true);
|
that.$util.Tips({
|
title: '领取成功'
|
});
|
if (item.moneyType == 4) {
|
that.changeCategoryTab(that.categoryIndex);
|
}
|
let finishNum = 0;
|
that.couponList.forEach((item1, index1) => {
|
if (item1.isUse) {
|
finishNum++;
|
}
|
});
|
if (finishNum >= that.couponList.length) {
|
that.isGetWholeCoupon = true;
|
}
|
uni.hideLoading();
|
that.isClicking = false;
|
}).catch(err => {
|
uni.hideLoading();
|
that.isClicking = false;
|
return that.$util.Tips({
|
title: (err && err.message) ? err.message : err
|
});
|
})
|
}
|
|
}
|
},
|
clickSort(index) {
|
this.listActive = index
|
},
|
// scroll-view滑动事件
|
scroll(e) {
|
this.scrollLeft = e.detail.scrollLeft;
|
},
|
// 计算下划线位置
|
setLine() {
|
let lineWidth = 0,
|
lineLeft = 0
|
this.getElementData(`#tab_item`, (data) => {
|
let el = data[this.listActive]
|
lineWidth = el.width / 2
|
// lineLeft = el.width * (this.currentIndex + 0.5) // 此种只能针对每个item长度一致的
|
lineLeft = el.width / 2 + (-data[0].left) + el.left
|
this.lineStyle = {
|
width: `${lineWidth}px`,
|
transform: `translateX(${lineLeft}px) translateX(-50%)`,
|
transitionDuration: `${this.duration}s`
|
};
|
})
|
},
|
getElementData(el, callback) {
|
uni.createSelectorQuery().in(this).selectAll(el).boundingClientRect().exec((data) => {
|
callback(data[0]);
|
});
|
},
|
xieyiApp() {
|
uni.navigateTo({
|
url: '/pages/users/web_page/index?webUel=https://admin.java.crmeb.net/useragreement/xieyi.html&title=协议内容'
|
})
|
},
|
getTemlIds() {
|
for (var i in arrTemp) {
|
this.getTem(arrTemp[i]);
|
}
|
},
|
getTem(data) {
|
getTemlIds({
|
type: data
|
}).then(res => {
|
if (res.data) {
|
let arr = res.data.map((item) => {
|
return item.tempId
|
})
|
wx.setStorageSync('tempID' + data, arr);
|
}
|
})
|
},
|
showActivity() {
|
this.$refs.popNewuserRef.show();
|
},
|
// 首页数据
|
getIndexData: function () {
|
let that = this;
|
that.hasCheckedLogin = true;
|
getIndexData().then(res => {
|
let homePopupList = []
|
if (res.data.homePopupList) {
|
homePopupList = res.data.homePopupList.map(item => {
|
return {
|
image: item.image,
|
linkUrl: item.linkUrl
|
}
|
})
|
}
|
that.$set(that, "homeActivity", {
|
// homeDate:res.data.homeDate,
|
// homeImg:res.data.homeImg,
|
// homeUrl:res.data.homeUrl,
|
homePopupList: homePopupList
|
});
|
that.$nextTick(() => {
|
that.$refs.popActivity.show();
|
})
|
that.isConfigReady = true;
|
uni.setNavigationBarTitle({
|
title: '首页'
|
})
|
that.$set(that, "logoUrl", res.data.logoUrl);
|
that.$set(that, "site_name", '首页');
|
if (res.data.banner) {
|
res.data.banner.forEach((item, index) => {
|
item.uniKey = 'banner' + index;
|
})
|
}
|
that.$set(that, "imgUrls", res.data.banner ? res.data.banner : []);
|
if (res.data.menus) {
|
res.data.menus.forEach((item, index) => {
|
item.uniKey = 'menus' + index;
|
})
|
}
|
that.$set(that, "menus", res.data.menus ? res.data.menus : []);
|
if (res.data.roll) {
|
res.data.roll.forEach((item, index) => {
|
item.uniKey = 'roll' + index;
|
})
|
}
|
that.$set(that, "roll", res.data.roll ? res.data.roll : []);
|
// #ifdef H5
|
that.$store.commit("SET_CHATURL", res.data.yzfUrl);
|
Cache.set('chatUrl', res.data.yzfUrl);
|
// #endif
|
this.shareApi();
|
this.getCategoryList();
|
this.getLast10Order();
|
this.getStoreZoneAndCouponList();
|
this.$refs.seckill.getSeckillIndexTime();
|
this.getIndexModule();
|
})
|
getIndexConfig().then(res => {
|
if (res.data) {
|
that.$set(that, "homeBanner", res.data);
|
}
|
});
|
},
|
getIndexModule: function () {
|
let that = this;
|
getIndexModule().then(res => {
|
if (res.data && res.data.modules) {
|
let modules = res.data.modules || [];
|
if (res.data.serverTime) {
|
that.initDealCountdown(res.data.serverTime);
|
}
|
modules.forEach((item, index) => {
|
if (item.items) {
|
item.items = item.items.slice().sort((a, b) => (a.sort || 0) - (b.sort || 0));
|
item.items.forEach((item1, index1) => {
|
item1.uniKey = 'module' + item.id + '_' + index1;
|
})
|
}
|
if (item.code == 'service_guarantee') {
|
that.$set(that, "serviceSupport", item);
|
} else if (item.code == 'daily_deal') {
|
that.$set(that, "dealModule", item);
|
} else if (item.code == 'new_product') {
|
that.$set(that, "newProductModule", item);
|
} else if (item.code == 'health_zone') {
|
that.$set(that, "healthZoneModule", item);
|
} else if (item.code == 'activity_banner') {
|
that.$set(that, "activityBannerModule", item);
|
} else if (item.code == 'hot_rank') {
|
that.$set(that, "hotRankModule", item);
|
that.hotRankIndex = 0;
|
that.getRankProductList();
|
} else if (item.code == 'brand_wall') {
|
that.$set(that, "brandWallModule", item);
|
}
|
})
|
}
|
});
|
},
|
shareApi: function () {
|
getShare().then(res => {
|
this.$set(this, 'configApi', res.data);
|
// #ifdef H5
|
this.setOpenShare(res.data);
|
// #endif
|
})
|
},
|
getChatUrL() {
|
kefuConfig().then(res => {
|
let data = res.data;
|
this.$store.commit("SET_CHATURL", data.yzfUrl);
|
Cache.set('chatUrl', data.yzfUrl);
|
})
|
},
|
// 微信分享；
|
setOpenShare: function (data) {
|
let that = this;
|
if (that.$wechat.isWeixin()) {
|
let configAppMessage = {
|
desc: data.synopsis,
|
title: data.title,
|
link: location.href,
|
imgUrl: data.img
|
};
|
that.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"],
|
configAppMessage);
|
}
|
},
|
// 授权关闭
|
authColse: function (e) {
|
this.isShowAuth = e
|
},
|
// 产品切换
|
changeCategoryTab(index, isClick) {
|
let that = this;
|
that.categoryIndex = index;
|
if (isClick) {
|
that.clickTrack('cate', {
|
name: that.categoryList[that.categoryIndex].name
|
})
|
}
|
that.loadingGood = true;
|
that.where.page = 1;
|
that.loadend = false;
|
that.where.cid = that.categoryList[that.categoryIndex].id;
|
that.get_product_list();
|
},
|
/**
|
* 获取专区列表
|
*/
|
getStoreZoneAndCouponList: function () {
|
let that = this;
|
// that.$set(that, 'zoneList', []);
|
// that.$set(that, 'couponList', []);
|
uni.showLoading()
|
getStoreZoneAndCouponList({}).then(res => {
|
let zoneList = [];
|
res.data.storeZoneList.forEach((item, index) => {
|
if (item.isShow) {
|
item.uniKey = 'storeZoneList' + zoneList.length;
|
zoneList.push(item);
|
}
|
})
|
that.$set(that, 'zoneList', zoneList);
|
|
let useNum = 0;
|
res.data.storeCouponList.forEach((item, index) => {
|
item.uniKey = 'storeCouponList' + index;
|
if (item.isUse) {
|
useNum++;
|
}
|
})
|
if (useNum >= res.data.storeCouponList.length) {
|
that.isGetWholeCoupon = true;
|
} else {
|
that.isGetWholeCoupon = false;
|
}
|
if (that.$store.getters.isLogin) {
|
handsList().then(giveRes => {
|
res.data.storeCouponList.push({
|
moneyType: 4,
|
userLvType: this.userInfo.level,
|
isUse: true,
|
name: ''
|
})
|
that.$set(that, 'couponList', (giveRes.data || []).concat(res.data.storeCouponList));
|
})
|
handsCoupon().then(res => {
|
if (res.code == 200) {
|
that.$refs.popCoupon.show();
|
}
|
});
|
//检查用户有可以手动领取导入优惠券记录
|
// that.$refs.popCoupon.show();
|
}
|
that.$nextTick(() => {
|
that.$forceUpdate();
|
uni.hideLoading()
|
})
|
}).catch((e) => {
|
console.log(10000001, e);
|
uni.hideLoading()
|
});
|
},
|
resetCoupon(couponIds) {
|
console.log('resetCoupon');
|
let that = this;
|
let hasCoupon4 = false;
|
let useNum = 0;
|
that.couponList.forEach((item, index) => {
|
if (couponIds.indexOf(item.id) >= 0 || couponIds.indexOf(item.id + '') >= 0) {
|
item.isUse = true;
|
that.$set(that.couponList[index], 'isUse', true);
|
if (item.moneyType == 4) {
|
hasCoupon4 = true;
|
}
|
}
|
if (item.isUse) {
|
useNum++;
|
}
|
});
|
if (useNum >= that.couponList.length) {
|
that.isGetWholeCoupon = true;
|
}
|
if (hasCoupon4) {
|
that.changeCategoryTab(that.categoryIndex);
|
}
|
},
|
getLast10Order: function () {
|
let that = this;
|
getLast10Order({}).then(res => {
|
let data = res.data.concat(JSON.parse(JSON.stringify(res.data)));
|
data.forEach((item, index) => {
|
item.uniKey = 'buyList' + index;
|
});
|
that.$set(that, 'buyList', data);
|
});
|
},
|
getCategoryList: function () {
|
let that = this;
|
getCategoryList().then(res => {
|
res.data.forEach((item, index) => {
|
// if (!item.show2Category) {
|
// item.child.sort((a, b) => {
|
// return a.sort - b.sort;
|
// });
|
// that.categoryList = that.categoryList.concat(item.child)
|
// }
|
res.data[index]['uniKey'] = 'categoryList' + index;
|
});
|
that.categoryList = res.data;
|
that.hotCategoryList = [];
|
that.hotCategoryList.unshift({
|
id: 0,
|
name: '全部'
|
});
|
res.data.forEach((item, index) => {
|
if (item.name !== '为您推荐') {
|
that.hotCategoryList.push(item);
|
}
|
});
|
that.changeCategoryTab(that.categoryIndex);
|
})
|
},
|
get_product_list: function () {
|
let that = this;
|
if (that.loadend) return;
|
if (that.loading) return;
|
that.loading = true;
|
that.loadTitle = '';
|
that.isPause = true;
|
getProductslist(that.where).then(res => {
|
let list = res.data.list;
|
|
that.loading = false;
|
if (that.where.page > 1) {
|
list = that.productList.concat(list);
|
}
|
list.forEach((item, index) => {
|
item.uniKey = 'productList' + index;
|
})
|
that.$set(that, 'productList', list);
|
if (that.productList.length > 4) {
|
that.$set(that, 'scrollHeight', that.pageHeight - 300);
|
} else {
|
that.$set(that, 'scrollHeight', 484 * Math.round(that.productList.length / 2) + 120);
|
}
|
|
if (that.where.page == 1) {
|
that.scrollTop = that.oldScrollTop;
|
that.$nextTick(() => {
|
that.scrollTop = 0;
|
});
|
}
|
|
let loadend = list.length < that.where.limit;
|
if (that.where.page >= res.data.totalPage) {
|
loadend = true;
|
that.$set(that.where, 'page', 1);
|
} else {
|
that.$set(that.where, 'page', that.where.page + 1);
|
}
|
that.loadend = loadend;
|
|
that.isPause = false;
|
that.$nextTick(() => {
|
that.loadingGood = false;
|
})
|
}).catch(err => {
|
console.log(1000000002, err);
|
that.loading = false;
|
that.isPause = false;
|
that.loadTitle = '加载更多';
|
that.$nextTick(() => {
|
that.loadingGood = false;
|
})
|
});
|
},
|
goodlistScroll: function (e) {
|
this.oldScrollTop = e.detail.scrollTop;
|
},
|
getMdayLast: function () {
|
let that = this;
|
uni.showLoading();
|
getMdayLast({}).then(res => {
|
if (res.data.mday) {
|
that.hasLottery = true;
|
}
|
});
|
},
|
},
|
mounted() {
|
let that = this
|
// #ifdef H5
|
//that.getChatUrL();
|
// 获取H5 搜索框高度
|
let appSearchH = uni.createSelectorQuery().select(".serch-wrapper");
|
appSearchH.boundingClientRect(function (data) {
|
that.searchH = data.height
|
}).exec()
|
// #endif
|
},
|
/**
|
* 用户点击右上角分享
|
*/
|
// #ifdef MP
|
onShareAppMessage: function (options) {
|
let shareUrl = '/pages/index/index';
|
if (this.$store.getters.belong) {
|
shareUrl += '?' + this.$util.setShareBelong(this.$store.getters.belong);
|
}
|
if (this.$store.getters.uid) {
|
if (shareUrl.indexOf('?') > 0) {
|
shareUrl += '&spread=' + this.$store.getters.uid;
|
} else {
|
shareUrl += '?spread=' + this.$store.getters.uid;
|
}
|
}
|
let pages = getCurrentPages(),
|
currPage = pages[pages.length - 1];
|
this.addTrack('yy_contentPageShare', {
|
'sharePosition_var': options.from == 'button' ? '页面分享按钮' : '页面顶部',
|
'shareMethod_var': '微信好友', //保存海报
|
'pageTitle_var': '首页',
|
'pageType_var': '首页',
|
'pagePath_var': currPage.route,
|
'productID_var': '-',
|
'productName_var': '-',
|
'contentId_var': '-',
|
'contentName_var': '-',
|
'contentType_var': '-',
|
'contentLabel_var': '-',
|
});
|
return {
|
title: this.configApi.title,
|
imageUrl: this.configApi.img,
|
desc: this.configApi.synopsis,
|
path: shareUrl
|
};
|
},
|
// #endif
|
}
|
</script>
|
<style>
|
page {
|
display: flex;
|
flex-direction: column;
|
height: 100%;
|
/* #ifdef H5 */
|
background-color: #fff;
|
/* #endif */
|
|
}
|
|
@font-face {
|
font-family: 'gotham';
|
src: url('gotham.ttf') format('truetype');
|
}
|
</style>
|
<style lang="scss">
|
.serviceSupport {
|
width: 690rpx;
|
display: flex;
|
margin: 0 auto;
|
margin-bottom: 20rpx;
|
border-radius: 15rpx;
|
background: linear-gradient(to right, #68ecd9, #a8f696, #cdf3ea);
|
justify-content: space-evenly;
|
align-items: center;
|
|
.serviceSupport_item {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
height: 68rpx;
|
|
.serviceSupport_itemImg {
|
width: 33rpx;
|
height: 33rpx;
|
margin-right: 12rpx;
|
}
|
|
.serviceSupport_itemText {
|
font-size: 22rpx;
|
color: #096f50;
|
line-height: 68rpx;
|
}
|
}
|
}
|
|
/* 首页运营模块 */
|
.promotion_pair {
|
width: 690rpx;
|
margin: 0 auto 20rpx;
|
display: flex;
|
justify-content: space-between;
|
align-items: flex-start;
|
|
.pair_deal {
|
width: 335rpx;
|
height: 628rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleDeal.png") center center/contain no-repeat;
|
box-sizing: border-box;
|
border-radius: 24rpx;
|
overflow: hidden;
|
position: relative;
|
|
.pair_deal_head {
|
display: flex;
|
align-items: center;
|
padding-top: 7rpx;
|
|
.pair_deal_badge {
|
width: 166rpx;
|
height: 54rpx;
|
line-height: 54rpx;
|
padding: 0 18rpx;
|
color: #fff;
|
font-size: 28rpx;
|
text-align: center;
|
font-weight: bold;
|
white-space: nowrap;
|
}
|
|
.deal_count {
|
display: flex;
|
align-items: center;
|
padding-left: 6rpx;
|
|
.deal_count_num {
|
width: 40rpx;
|
white-space: nowrap;
|
height: 40rpx;
|
line-height: 40rpx;
|
box-sizing: border-box;
|
text-align: center;
|
background: linear-gradient(180deg, #ffe95c 0%, #ffc93c 100%);
|
border-radius: 10rpx;
|
color: #000000;
|
font-size: 26rpx;
|
font-weight: bold;
|
}
|
|
.deal_count_sep {
|
margin: 0 5rpx;
|
color: #000000;
|
font-weight: bold;
|
}
|
}
|
}
|
|
.pair_deal_sub {
|
margin-top: 6rpx;
|
text-align: center;
|
font-size: 24rpx;
|
line-height: 48rpx;
|
color: #35bc62;
|
}
|
|
.deal_swiper {
|
height: 514rpx;
|
|
.deal_goods {
|
.deal_goods_pic {
|
width: 306rpx;
|
height: 306rpx;
|
margin: 0 auto;
|
background: #fff;
|
border-radius: 16rpx;
|
overflow: hidden;
|
|
image {
|
width: 306rpx;
|
height: 306rpx;
|
display: block;
|
}
|
}
|
|
.deal_goods_name {
|
padding-left: 18rpx;
|
padding-right: 18rpx;
|
margin-top: 16rpx;
|
font-size: 28rpx;
|
font-weight: bold;
|
color: #222222;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
}
|
|
.deal_progress {
|
padding-left: 18rpx;
|
padding-right: 18rpx;
|
display: flex;
|
align-items: center;
|
margin-top: 14rpx;
|
|
.deal_progress_bar {
|
flex: 1;
|
height: 12rpx;
|
border-radius: 6rpx;
|
background: rgba(255, 255, 255, .6);
|
overflow: hidden;
|
|
.deal_progress_inner {
|
height: 100%;
|
border-radius: 6rpx;
|
background: linear-gradient(90deg, #ffd53e 0%, #ffb800 100%);
|
}
|
}
|
|
.deal_progress_text {
|
margin-left: 14rpx;
|
font-size: 22rpx;
|
color: #ffffff;
|
}
|
}
|
|
.deal_bottom {
|
padding-left: 18rpx;
|
padding-right: 18rpx;
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-top: 18rpx;
|
|
.deal_price_now {
|
color: #ff0000;
|
font-size: 34rpx;
|
line-height: 48rpx;
|
font-family: 'gotham';
|
white-space: nowrap;
|
}
|
|
.deal_price_old {
|
margin-top: 2rpx;
|
font-size: 18rpx;
|
font-size: 20rpx;
|
line-height: 1;
|
color: #ffffff;
|
text-decoration: line-through;
|
}
|
|
.deal_buy {
|
width: 114rpx;
|
height: 62rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleDeal_btn.png") center center/contain no-repeat;
|
}
|
}
|
}
|
}
|
|
.deal_dots {
|
width: 100%;
|
position: absolute;
|
bottom: 14rpx;
|
left: 0;
|
display: flex;
|
justify-content: center;
|
margin-top: 12rpx;
|
|
.deal_dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
background: rgba(255, 255, 255, .7);
|
margin: 0 5rpx;
|
|
&.on {
|
width: 34rpx;
|
background: #ffd53e;
|
}
|
}
|
}
|
}
|
|
.pair_right {
|
width: 335rpx;
|
display: flex;
|
flex-direction: column;
|
}
|
|
.pair_new {
|
width: 335rpx;
|
height: 335rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleNew.png") center center/contain no-repeat;
|
box-sizing: border-box;
|
border-radius: 24rpx;
|
overflow: hidden;
|
position: relative;
|
|
.pair_new_head {
|
display: flex;
|
align-items: baseline;
|
justify-content: space-between;
|
padding-top: 7rpx;
|
|
.pair_new_title {
|
width: 162rpx;
|
text-align: center;
|
font-size: 27rpx;
|
line-height: 54rpx;
|
font-weight: bold;
|
color: #ffffff;
|
}
|
|
.pair_new_sub {
|
width: 172rpx;
|
text-align: center;
|
font-size: 27rpx;
|
line-height: 54rpx;
|
font-weight: bold;
|
color: #fe4f70;
|
}
|
}
|
|
.pair_new_list {
|
width: 100%;
|
margin-top: 15rpx;
|
height: 257rpx;
|
position: relative;
|
|
.pair_new_swiper_item {
|
height: 220rpx;
|
}
|
|
.pair_new_list_wrapper {
|
display: flex;
|
align-items: flex-start;
|
justify-content: space-around;
|
}
|
|
.pair_new_item {
|
width: 155rpx;
|
flex-shrink: 0;
|
|
.pair_new_pic {
|
border-radius: 12rpx;
|
overflow: hidden;
|
background: #f7f7f7;
|
|
image {
|
width: 142rpx;
|
height: 142rpx;
|
display: block;
|
}
|
}
|
|
.pair_new_price {
|
width: 123rpx;
|
margin: 0 auto;
|
text-align: center;
|
background: #fff0d9;
|
border-radius: 20rpx;
|
margin-top: 16rpx;
|
color: #ff5c2b;
|
font-size: 24rpx;
|
// font-weight: bold;
|
font-family: 'gotham';
|
white-space: nowrap;
|
line-height: 39rpx;
|
}
|
|
.pair_new_old {
|
font-size: 18rpx;
|
line-height: 24rpx;
|
margin-top: 10rpx;
|
color: #9e9e9e;
|
text-decoration: line-through;
|
text-align: center;
|
}
|
|
}
|
}
|
|
.pair_new_dots {
|
width: 100%;
|
position: absolute;
|
bottom: 14rpx;
|
left: 0;
|
display: flex;
|
justify-content: center;
|
margin-top: 12rpx;
|
|
.pair_new_dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
background: rgba(255, 255, 255, 0.5);
|
margin: 0 5rpx;
|
|
&.on {
|
width: 34rpx;
|
background: #ffd53e;
|
}
|
}
|
}
|
}
|
|
.pair_zone {
|
width: 335rpx;
|
height: 283rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleZone.png") center center/contain no-repeat;
|
box-sizing: border-box;
|
border-radius: 24rpx;
|
margin-top: 10rpx;
|
position: relative;
|
|
.pair_zone_head {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding-top: 7rpx;
|
|
.pair_zone_badge {
|
width: 162rpx;
|
text-align: center;
|
font-size: 27rpx;
|
line-height: 54rpx;
|
font-weight: bold;
|
white-space: nowrap;
|
color: #ffffff;
|
}
|
|
.pair_zone_sub {
|
width: 172rpx;
|
text-align: center;
|
font-size: 27rpx;
|
line-height: 54rpx;
|
font-weight: bold;
|
color: #36c8d5;
|
}
|
}
|
|
.pair_zone_swiper {
|
height: 200rpx;
|
margin-top: 26rpx;
|
border-radius: 16rpx;
|
overflow: hidden;
|
|
.pair_zone_swiper_item {
|
width: 100%;
|
height: 138rpx;
|
|
.pair_zone_img {
|
width: 300rpx;
|
height: 138rpx;
|
margin: 0 auto;
|
margin-top: 10rpx;
|
display: block;
|
border-radius: 16rpx;
|
}
|
|
&.multi .pair_zone_img {
|
margin-left: 15rpx;
|
width: 280rpx;
|
height: 128rpx;
|
}
|
|
}
|
|
|
}
|
|
.pair_zone_dots {
|
width: 100%;
|
position: absolute;
|
bottom: 24rpx;
|
left: 0;
|
display: flex;
|
justify-content: center;
|
margin-top: 12rpx;
|
|
.pair_zone_dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
background: #e0e0e0;
|
margin: 0 5rpx;
|
|
&.on {
|
width: 34rpx;
|
background: #ffd53e;
|
}
|
}
|
}
|
}
|
}
|
|
.module_rank {
|
width: 690rpx;
|
height: 580rpx;
|
margin: 0 auto 20rpx;
|
box-sizing: border-box;
|
border-radius: 24rpx;
|
padding: 0 20rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank.png") center center/contain no-repeat;
|
|
|
.module_rank_head {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
padding-top: 7rpx;
|
|
.module_rank_badge {
|
height: 47rpx;
|
line-height: 47rpx;
|
padding-left: 15rpx;
|
color: #fff;
|
font-size: 28rpx;
|
font-weight: bold;
|
}
|
|
.module_rank_sub {
|
padding-right: 15rpx;
|
text-align: right;
|
font-size: 20rpx;
|
line-height: 32rpx;
|
padding-top: 15rpx;
|
color: #d5bb00;
|
}
|
}
|
|
.module_rank_body {
|
margin-top: 16rpx;
|
border-radius: 20rpx;
|
|
.module_rank_tabs {
|
width: 640rpx;
|
margin: 0 auto;
|
background: rgba(244, 255, 196, .7);
|
border-radius: 28rpx;
|
|
.module_rank_tabsScroll {
|
width: 100%;
|
white-space: nowrap;
|
}
|
|
.module_rank_tabs_wrapper {
|
width: max-content;
|
white-space: nowrap;
|
}
|
|
.module_rank_tab {
|
display: inline-block;
|
position: relative;
|
font-size: 28rpx;
|
color: #000000;
|
line-height: 56rpx;
|
padding: 0 22rpx;
|
|
&.on {
|
font-weight: bold;
|
|
&::after {
|
content: '';
|
position: absolute;
|
left: 50%;
|
bottom: 10rpx;
|
transform: translateX(-50%);
|
width: 48rpx;
|
height: 6rpx;
|
border-radius: 3rpx;
|
background: linear-gradient(90deg, #ffd53e 0%, #ff9c00 100%);
|
}
|
}
|
}
|
}
|
|
.module_rank_list {
|
display: flex;
|
justify-content: space-between;
|
align-items: flex-start;
|
margin-top: 30rpx;
|
position: relative;
|
|
.module_rank_item {
|
position: relative;
|
width: 32%;
|
box-sizing: border-box;
|
border-radius: 16rpx;
|
padding: 14rpx 12rpx 16rpx;
|
background: linear-gradient(180deg, #ffffff 0%, #eafbe0 100%);
|
margin-top: 44rpx;
|
|
&.mid {
|
margin-top: 0;
|
}
|
|
.rank_badge {
|
position: absolute;
|
left: -8rpx;
|
top: -10rpx;
|
width: 60rpx;
|
height: 68rpx;
|
|
&.rank1 {
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank_num1.png") center center/contain no-repeat;
|
}
|
|
&.rank2 {
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank_num2.png") center center/contain no-repeat;
|
}
|
|
&.rank3 {
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank_num3.png") center center/contain no-repeat;
|
}
|
}
|
|
.rank_pic {
|
border-radius: 12rpx;
|
overflow: hidden;
|
background: #f7f7f7;
|
|
image {
|
width: 100%;
|
height: 150rpx;
|
display: block;
|
}
|
}
|
|
.rank_buy {
|
font-size: 16rpx;
|
line-height: 24rpx;
|
margin-top: 15rpx;
|
color: #ff3000;
|
padding-left: 20rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank_hot.png") left 2rpx / auto 16rpx no-repeat;
|
}
|
|
.rank_name {
|
margin-top: 4rpx;
|
font-size: 24rpx;
|
line-height: 32rpx;
|
height: 64rpx;
|
color: #222222;
|
display: -webkit-box;
|
-webkit-box-orient: vertical;
|
-webkit-line-clamp: 2;
|
overflow: hidden;
|
}
|
|
.rank_price {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
margin-top: 10rpx;
|
|
.rank_price_now {
|
color: #ff0000;
|
font-size: 24rpx;
|
font-family: 'gotham';
|
white-space: nowrap;
|
overflow: hidden;
|
max-width: 150rpx;
|
overflow: hidden;
|
}
|
}
|
|
.rank_old {
|
margin-top: 4rpx;
|
font-size: 20rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
max-width: 150rpx;
|
overflow: hidden;
|
color: #999999;
|
text-decoration: line-through;
|
}
|
|
.rank_cart {
|
position: absolute;
|
right: 12rpx;
|
bottom: 20rpx;
|
width: 34rpx;
|
height: 34rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleRank_buy.png") center center/contain no-repeat;
|
}
|
}
|
}
|
}
|
}
|
|
.module_banner {
|
width: 690rpx;
|
margin: 0 auto 20rpx;
|
position: relative;
|
|
.module_banner_swiper {
|
height: 150rpx;
|
border-radius: 20rpx;
|
overflow: hidden;
|
|
.module_banner_img {
|
width: 100%;
|
height: 150rpx;
|
display: block;
|
border-radius: 20rpx;
|
}
|
}
|
|
.module_banner_dots {
|
position: absolute;
|
left: 0;
|
right: 0;
|
bottom: 12rpx;
|
display: flex;
|
justify-content: center;
|
|
.module_banner_dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
background: #e0e0e0;
|
margin: 0 5rpx;
|
|
&.on {
|
width: 34rpx;
|
background: #ffd53e;
|
}
|
}
|
}
|
}
|
|
.module_brand {
|
width: 684rpx;
|
height: 335rpx;
|
position: relative;
|
margin: 0 auto 20rpx;
|
box-sizing: border-box;
|
border-radius: 24rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/index_moduleBrand.png") center center/contain no-repeat;
|
|
.module_brand_title {
|
text-align: center;
|
font-size: 34rpx;
|
font-weight: bold;
|
color: #0a9b4c;
|
}
|
|
.module_brand_sub {
|
text-align: center;
|
font-size: 24rpx;
|
line-height: 60rpx;
|
color: #35bc62;
|
}
|
|
.module_brand_swiper {
|
width: 645rpx;
|
height: 200rpx;
|
margin: 0 auto;
|
background: #fff;
|
border-radius: 20rpx;
|
|
.module_brand_swiper_item {
|
width: 100%;
|
}
|
}
|
|
.module_brand_box {
|
width: 645rpx;
|
height: 200rpx;
|
margin: 0 auto;
|
padding: 14rpx;
|
display: flex;
|
flex-wrap: wrap;
|
|
.module_brand_item {
|
width: 21%;
|
height: 65rpx;
|
margin: 2%;
|
box-sizing: border-box;
|
border: 1rpx solid #eeeeee;
|
border-radius: 12rpx;
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
|
image {
|
width: 90%;
|
height: 80rpx;
|
}
|
}
|
}
|
|
.module_brand_dots {
|
width: 100%;
|
left: 0;
|
bottom: 9rpx;
|
position: absolute;
|
margin-top: 16rpx;
|
display: flex;
|
justify-content: center;
|
|
.module_brand_dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
background: #e0e0e0;
|
margin: 0 6rpx;
|
|
&.on {
|
width: 34rpx;
|
background: #ffd53e;
|
}
|
}
|
}
|
}
|
|
.notice {
|
width: 100%;
|
height: 70rpx;
|
border-radius: 10rpx;
|
background-color: #fff;
|
margin-bottom: 25rpx;
|
line-height: 70rpx;
|
padding: 0 14rpx;
|
|
.line {
|
color: #CCCCCC;
|
}
|
|
.pic {
|
width: 130rpx;
|
height: 36rpx;
|
|
image {
|
width: 100%;
|
height: 100%;
|
display: block !important;
|
}
|
}
|
|
.swipers {
|
height: 100%;
|
width: 444rpx;
|
overflow: hidden;
|
|
swiper {
|
height: 100%;
|
width: 100%;
|
overflow: hidden;
|
font-size: 22rpx;
|
color: #333333;
|
}
|
}
|
|
.iconfont {
|
color: #999999;
|
font-size: 20rpx;
|
}
|
}
|
|
.sticky-box {
|
/* #ifndef APP-PLUS-NVUE */
|
display: flex;
|
position: -webkit-sticky;
|
/* #endif */
|
position: sticky;
|
/* #ifdef H5*/
|
top: var(--window-top);
|
/* #endif */
|
|
z-index: 99;
|
flex-direction: row;
|
margin: 0px;
|
background: #f5f5f5;
|
padding: 30rpx 0;
|
}
|
|
.listAll {
|
width: 20%;
|
text-indent: 62rpx;
|
font-size: 30rpx;
|
border-left: 1px #eee solid;
|
margin: 1% 0;
|
padding: 5rpx;
|
position: relative;
|
|
image {
|
position: absolute;
|
left: 20rpx;
|
top: 8rpx;
|
}
|
}
|
|
.tab {
|
position: relative;
|
display: flex;
|
font-size: 28rpx;
|
white-space: nowrap;
|
|
&__item {
|
flex: 1;
|
padding: 0 20rpx;
|
text-align: center;
|
height: 60rpx;
|
line-height: 60rpx;
|
color: #666;
|
|
&.active {
|
color: #09C2C9;
|
}
|
}
|
}
|
|
.tab__line {
|
display: block;
|
height: 6rpx;
|
position: absolute;
|
bottom: 0;
|
left: 0;
|
z-index: 1;
|
border-radius: 3rpx;
|
position: relative;
|
background: #2FC6CD;
|
}
|
|
.scroll-view_H {
|
/* 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。 */
|
white-space: nowrap;
|
width: 100%;
|
}
|
|
|
.privacy-wrapper {
|
z-index: 999;
|
position: fixed;
|
left: 0;
|
top: 0;
|
width: 100%;
|
height: 100%;
|
background: #7F7F7F;
|
|
.privacy-box {
|
position: absolute;
|
left: 50%;
|
top: 50%;
|
transform: translate(-50%, -50%);
|
width: 560rpx;
|
padding: 50rpx 45rpx 0;
|
background: #fff;
|
border-radius: 20rpx;
|
|
.title {
|
text-align: center;
|
font-size: 32rpx;
|
text-align: center;
|
color: #333;
|
font-weight: 700;
|
}
|
|
.content {
|
margin-top: 20rpx;
|
line-height: 1.5;
|
font-size: 26rpx;
|
color: #666;
|
text-indent: 54rpx;
|
|
i {
|
font-style: normal;
|
color: $theme-color;
|
}
|
}
|
|
.btn-box {
|
margin-top: 40rpx;
|
text-align: center;
|
font-size: 30rpx;
|
|
.btn-item {
|
height: 82rpx;
|
line-height: 82rpx;
|
background: linear-gradient(90deg, #F67A38 0%, #F11B09 100%);
|
color: #fff;
|
border-radius: 41rpx;
|
}
|
|
.btn {
|
padding: 30rpx 0;
|
}
|
}
|
}
|
}
|
|
.page-index {
|
background-color: #f5f5f5;
|
|
.mp-header {
|
z-index: 999;
|
position: fixed;
|
left: 0;
|
top: 0;
|
width: 100%;
|
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/page_commonBg.png") center top/100% auto no-repeat;
|
|
.header {
|
padding: 28rpx 30rpx;
|
padding-top: 88rpx;
|
}
|
|
.serch-wrapper {
|
width: 750rpx;
|
margin: 0 auto;
|
height: 100%;
|
align-items: center;
|
padding: 0 50rpx 0 160rpx;
|
box-sizing: border-box;
|
position: relative;
|
|
.logo {
|
width: 130rpx;
|
height: 130rpx;
|
border-radius: 50%;
|
position: absolute;
|
left: 0;
|
top: 50%;
|
margin-top: -65rpx;
|
}
|
|
image {
|
display: block;
|
width: 130rpx !important;
|
height: 130rpx !important;
|
box-sizing: border-box;
|
}
|
|
.input {
|
display: flex;
|
align-items: center;
|
width: 300rpx;
|
padding: 0 0 0 30rpx;
|
background: #ffffff;
|
// box-shadow:inset 0 0 0 1rpx #dcd8c5;
|
border-radius: 25rpx;
|
color: #cccccc;
|
font-size: 28rpx;
|
line-height: 30rpx;
|
height: 30rpx;
|
flex-wrap: nowrap;
|
|
.iconfont {
|
margin-right: 20rpx;
|
font-size: 26rpx;
|
color: #cccccc;
|
}
|
}
|
}
|
}
|
|
|
.swiper {
|
position: relative;
|
width: 690rpx;
|
height: 410rpx;
|
margin: 0 auto;
|
border-radius: 10rpx;
|
overflow: hidden;
|
margin-bottom: 25rpx;
|
/* #ifdef MP */
|
z-index: 10;
|
margin-top: 40rpx;
|
|
/* #endif */
|
swiper,
|
.swiper-item {
|
width: 100%;
|
height: 410rpx;
|
}
|
|
image {
|
width: 100%;
|
height: 387rpx;
|
border-radius: 10rpx;
|
}
|
|
.wx-swiper-dots {
|
bottom: 0rpx;
|
}
|
|
.wx-swiper-dots .wx-swiper-dot {
|
width: 8rpx;
|
height: 8rpx;
|
border-radius: 4rpx;
|
}
|
|
.wx-swiper-dots .wx-swiper-dot-active {
|
width: 20rpx;
|
}
|
|
.wx-swiper-dots .wx-swiper-dot:nth-of-type(n+2) {
|
margin-left: 15rpx;
|
}
|
}
|
|
.nav {
|
opacity: 1;
|
border-radius: 14rpx;
|
width: 690rpx;
|
margin: 0 auto;
|
margin-bottom: 30rpx;
|
|
.item {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
width: 20%;
|
margin-top: 15rpx;
|
|
:nth-child(1),
|
:nth-child(2),
|
:nth-child(3),
|
:nth-child(4),
|
:nth-child(5) {
|
margin-top: 0;
|
}
|
|
.image {
|
width: 136rpx;
|
height: 136rpx;
|
display: block;
|
}
|
|
.menu-txt {
|
font-size: 24rpx;
|
color: #000000;
|
}
|
}
|
}
|
|
|
.nav-bd {
|
display: flex;
|
align-items: center;
|
justify-content: space-between;
|
|
.item {
|
display: flex;
|
flex-direction: column;
|
align-items: center;
|
justify-content: center;
|
|
.txt {
|
font-size: 32rpx;
|
color: #000000;
|
}
|
|
.label {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 124rpx;
|
height: 32rpx;
|
margin-top: 5rpx;
|
font-size: 24rpx;
|
color: #999;
|
}
|
|
&.active {
|
color: $theme-color;
|
|
.txt {
|
color: $theme-color;
|
}
|
|
.label {
|
background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
|
border-radius: 16rpx;
|
color: #fff;
|
}
|
}
|
}
|
}
|
|
.index-product-wrapper {
|
margin-bottom: 110rpx;
|
|
&.on {
|
min-height: 1500rpx;
|
}
|
|
.list-box {
|
display: flex;
|
flex-wrap: wrap;
|
justify-content: space-between;
|
|
.item {
|
width: 335rpx;
|
margin-bottom: 20rpx;
|
background-color: #fff;
|
border-radius: 10rpx;
|
overflow: hidden;
|
|
image {
|
width: 100%;
|
height: 330rpx;
|
}
|
|
.text-info {
|
padding: 10rpx 20rpx 15rpx;
|
|
.title {
|
color: #222222;
|
}
|
|
.old-price {
|
margin-top: 8rpx;
|
font-size: 26rpx;
|
color: #AAAAAA;
|
text-decoration: line-through;
|
|
text {
|
margin-right: 2px;
|
font-size: 20rpx;
|
}
|
}
|
|
.price {
|
display: flex;
|
align-items: flex-end;
|
color: $theme-color;
|
font-size: 34rpx;
|
font-weight: 800;
|
|
text {
|
padding-bottom: 4rpx;
|
font-size: 24rpx;
|
font-weight: 800;
|
}
|
|
.txt {
|
display: flex;
|
align-items: center;
|
justify-content: center;
|
width: 28rpx;
|
height: 28rpx;
|
margin-left: 15rpx;
|
margin-bottom: 10rpx;
|
border: 1px solid $theme-color;
|
border-radius: 4rpx;
|
font-size: 22rpx;
|
font-weight: normal;
|
}
|
}
|
}
|
}
|
|
&.on {
|
display: flex;
|
}
|
}
|
}
|
}
|
|
.zoneList_title {
|
font-size: 34rpx;
|
line-height: 48rpx;
|
width: 690rpx;
|
margin: 0 auto;
|
margin-bottom: 15rpx;
|
font-weight: bold;
|
color: #000000;
|
}
|
|
.zoneList_box {
|
width: 100%;
|
height: 305rpx;
|
|
.zoneList_wrapper {
|
width: max-content;
|
white-space: nowrap;
|
height: 305rpx;
|
}
|
|
.zoneList_item {
|
display: inline-block;
|
width: 540rpx;
|
height: 305rpx;
|
margin-left: 30rpx;
|
|
:last-child {
|
margin-right: 30rpx;
|
}
|
|
image {
|
width: 540rpx;
|
height: 305rpx;
|
border-radius: 16rpx;
|
}
|
}
|
|
&.isSingle {
|
height: 390rpx;
|
|
.zoneList_item {
|
width: 690rpx;
|
height: 390rpx;
|
margin-right: 0;
|
|
image {
|
width: 690rpx;
|
height: 390rpx;
|
}
|
}
|
}
|
}
|
|
.pictrue {
|
position: relative;
|
}
|
|
.fixed {
|
z-index: 100;
|
position: fixed;
|
left: 0;
|
top: 0;
|
background: linear-gradient(90deg, red 50%, #ff5400 100%);
|
|
}
|
|
.mores-txt {
|
width: 100%;
|
align-items: center;
|
justify-content: center;
|
height: 70rpx;
|
color: #999;
|
font-size: 24rpx;
|
|
.iconfont {
|
margin-top: 2rpx;
|
font-size: 20rpx;
|
}
|
}
|
|
|
|
.mp-bg {
|
width: 100%;
|
height: 900rpx;
|
background-color: #f5f5f5;
|
position: absolute;
|
left: 0;
|
top: 0;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/page_commonBg.png") center top/100% auto no-repeat;
|
// border-radius: 0 0 30rpx 30rpx;
|
}
|
|
.user_info {
|
width: 690rpx;
|
height: 107rpx;
|
margin: 0 auto;
|
margin-top: 15rpx;
|
position: relative;
|
|
.user_head {
|
width: 84rpx;
|
height: 84rpx;
|
box-sizing: border-box;
|
border: 2rpx solid #FFE20E;
|
background-color: #f5f5f5;
|
border-radius: 50%;
|
overflow: hidden;
|
|
image {
|
width: 84rpx;
|
height: 84rpx;
|
}
|
}
|
|
.user_level {
|
width: 110rpx;
|
height: 45rpx;
|
position: absolute;
|
left: 106rpx;
|
top: 45rpx;
|
|
image {
|
width: 110rpx;
|
height: 45rpx;
|
}
|
}
|
|
.user_name,
|
.user_loginTips {
|
font-size: 31rpx;
|
line-height: 46rpx;
|
color: #000000;
|
font-weight: bold;
|
position: absolute;
|
left: 106rpx;
|
top: 0;
|
background: none;
|
}
|
|
.user_careNum {
|
color: #333333;
|
position: absolute;
|
right: 0;
|
top: 0;
|
text-align: right;
|
font-size: 31rpx;
|
line-height: 46rpx;
|
|
.num {
|
font-size: 40rpx;
|
font-weight: bold;
|
}
|
|
.label {
|
width: max-content;
|
font-size: 21rpx;
|
line-height: 42rpx;
|
position: absolute;
|
right: 0;
|
top: 46rpx;
|
padding-right: 30rpx;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/i_info.png") right center/20rpx auto no-repeat;
|
}
|
}
|
|
.btn_vip {
|
width: max-content;
|
position: absolute;
|
right: 0;
|
font-size: 21rpx;
|
line-height: 42rpx;
|
left: 226rpx;
|
top: 46rpx;
|
color: #333333;
|
|
.iconfont {
|
font-size: 21rpx !important;
|
}
|
}
|
|
.btn_toLogin {
|
position: absolute;
|
left: 106rpx;
|
top: 30rpx;
|
font-size: 21rpx;
|
line-height: 82rpx;
|
color: #333333;
|
|
.iconfont {
|
font-size: 21rpx !important;
|
}
|
}
|
}
|
|
.buy_list {
|
width: 100%;
|
height: 48rpx;
|
overflow: hidden;
|
position: relative;
|
margin-top: 10rpx;
|
|
@keyframes moveAni {
|
0% {
|
transform: none;
|
}
|
|
100% {
|
transform: translate(-50%, 0)
|
}
|
}
|
|
.buy_wrapper {
|
width: max-content;
|
white-space: nowrap;
|
animation: moveAni 1s linear both infinite;
|
}
|
|
.buy_item {
|
display: inline-block;
|
margin: 0 5rpx;
|
width: max-content;
|
font-size: 19rpx;
|
line-height: 48rpx;
|
background-color: rgba(255, 255, 255, .8);
|
color: #333333;
|
padding-left: 1em;
|
padding-right: 1em;
|
border-radius: 24rpx;
|
}
|
}
|
|
.stats {
|
position: absolute;
|
left: 0px;
|
top: 0px;
|
z-index: 2000000;
|
width: 750rpx;
|
height: var(--status-bar-height);
|
background: #ffffff;
|
}
|
|
.couponList {
|
width: 690rpx;
|
height: 523rpx;
|
margin: 0 auto;
|
margin-bottom: 30rpx;
|
position: relative;
|
|
.couponList_title {
|
position: absolute;
|
left: 30rpx;
|
top: 60rpx;
|
color: #ffffff;
|
font-size: 40rpx;
|
font-weight: bold;
|
}
|
|
image {
|
width: 690rpx;
|
height: 523rpx;
|
}
|
|
.couponList_btn {
|
font-size: 24rpx;
|
line-height: 48rpx;
|
color: #000000;
|
text-align: right;
|
position: absolute;
|
right: 34rpx;
|
top: 138rpx;
|
padding-right: 42rpx;
|
text-decoration: underline;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/h_hand.gif") right center/contain no-repeat;
|
}
|
|
.couponList_box {
|
width: 630rpx;
|
height: 260rpx;
|
position: absolute;
|
left: 30rpx;
|
top: 200rpx;
|
overflow: hidden;
|
|
.couponList_wrapper {
|
white-space: nowrap;
|
}
|
|
.couponList_item {
|
width: 231rpx;
|
height: 260rpx;
|
display: inline-block;
|
position: relative;
|
background: url("https://ossacmall.bluedeer.com.cn/app/static/images/coupon_itemBg.png") center center/100% 100% no-repeat;
|
margin-right: 25rpx;
|
|
:last-child {
|
margin-right: 0;
|
}
|
|
.give {
|
font-weight: bold;
|
font-size: 19rpx;
|
color: #FFFFFF;
|
text-align: center;
|
font-style: normal;
|
text-transform: none;
|
background-color: #016DCC;
|
border-radius: 14rpx 14rpx 14rpx 0;
|
width: 49rpx;
|
height: 28rpx;
|
line-height: 28rpx;
|
position: absolute;
|
left: 8rpx;
|
top: 0;
|
z-index: 2;
|
}
|
|
.amount {
|
font-size: 53rpx;
|
line-height: 95rpx;
|
width: max-content;
|
position: absolute;
|
left: 50%;
|
transform: translate(-50%, 0);
|
top: 34rpx;
|
color: #000000;
|
font-weight: bold;
|
text-align: center;
|
|
.unit {
|
font-size: 0.5em;
|
}
|
}
|
|
.amountSmall {
|
font-size: 32rpx;
|
line-height: 56rpx;
|
top: 32rpx;
|
|
.text2 {
|
display: block;
|
margin: 0 auto;
|
font-size: 28rpx;
|
line-height: 36rpx;
|
width: max-content;
|
padding: 0 21rpx;
|
border: 1rpx solid #303030;
|
}
|
}
|
|
.label {
|
font-size: 24rpx;
|
lineh-height: 30rpx;
|
color: #000000;
|
text-align: center;
|
position: absolute;
|
width: 100%;
|
left: 0;
|
top: -50rpx;
|
}
|
|
.name {
|
width: 90%;
|
left: 5%;
|
line-height: 23rpx;
|
font-size: 22rpx;
|
color: #000000;
|
text-align: center;
|
position: absolute;
|
top: 135rpx;
|
transform: translate(0, -50%);
|
white-space: normal;
|
word-break: break-all;
|
}
|
|
.btn {
|
position: absolute;
|
width: 130rpx;
|
font-size: 23rpx;
|
line-height: 45rpx;
|
text-align: center;
|
background: #FFE20E;
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
left: 50%;
|
margin-left: -65rpx;
|
bottom: 27rpx;
|
|
&used {
|
background: #efefef;
|
}
|
}
|
}
|
}
|
}
|
|
.goods_menuBox {
|
width: 100%;
|
box-sizing: border-box;
|
// background: linear-gradient(180deg, #f5f5f5 0%, #ffffff 100%);
|
background-color: #f5f5f5;
|
position: -webkit-sticky;
|
position: sticky;
|
/* #ifdef H5*/
|
top: var(--window-top);
|
/* #endif */
|
z-index: 99;
|
|
.subMenu {
|
width: 100%;
|
}
|
|
.subMenu_wrapper {
|
width: max-content;
|
white-space: nowrap;
|
padding-left: 30rpx;
|
}
|
|
.subMenu_item {
|
// display: inline-block;
|
// min-width: 3em;
|
text-align: center;
|
font-size: 27rpx;
|
color: #979797;
|
height: 100rpx;
|
box-sizing: border-box;
|
margin-right: 10rpx;
|
|
.text {
|
width: max-content;
|
display: inline-block;
|
position: relative;
|
line-height: 40rpx;
|
padding-left: 14rpx;
|
padding-right: 14rpx;
|
margin-top: 30rpx;
|
margin-bottom: 30rpx;
|
}
|
}
|
|
.subMenu_item:last-child {
|
margin-right: 30rpx;
|
}
|
|
.subMenu_item.on {
|
color: #ffffff;
|
font-weight: bold;
|
position: relative;
|
|
.text {
|
background: linear-gradient(to right, #ffdc37, #fd9b2b);
|
border-radius: 20rpx;
|
font-weight: bold;
|
}
|
}
|
|
}
|
|
.goodsSection {
|
width: 690rpx;
|
position: relative;
|
margin: 0 auto;
|
|
|
.goodsList {
|
height: 100rpx;
|
overflow: hidden;
|
}
|
|
.list {
|
.list_column {}
|
}
|
|
.loadingTips {
|
width: max-content;
|
padding-left: 60rpx;
|
font-size: 27rpx;
|
line-height: 60rpx;
|
margin: 0 auto;
|
color: #DDDDDD;
|
background: url('https://ossacmall.bluedeer.com.cn/app/static/images/h_loading.png') left center/41rpx auto no-repeat;
|
}
|
|
.pauseView {
|
width: 100%;
|
height: 100%;
|
position: absolute;
|
left: 0;
|
top: 0;
|
z-index: 2;
|
}
|
}
|
|
.specialZone_box {
|
padding: 30vw 0 0 0;
|
background-color: red;
|
|
.specialZone_item {
|
width: 33%;
|
margin-bottom: 10vw;
|
float: left;
|
|
.specialGoodItem_image {
|
display: block;
|
width: 20vw;
|
height: 20vw;
|
margin: 0 auto;
|
}
|
}
|
}
|
|
.index_lottery {
|
width: 687rpx;
|
margin: 45rpx auto 0 auto;
|
|
.index_lottery_img {
|
display: block;
|
width: 100%;
|
height: auto;
|
}
|
}
|
</style>
|
