<template>
|
<view class="page-content">
|
<scroll-view class="swiper-scroll" :refresher-background='headerColor' @scroll='pagescroll' scroll-y="true"
|
:scroll-top='scrollindex' :scroll-anchoring='true' scroll-with-animation lower-threshold='500'
|
@scrolltolower="getNextPage" :refresher-threshold='75' :refresher-triggered='triggeredstate'
|
:refresher-enabled='canrefresh && canrefush' @refresherrefresh='refresh' @refresherrestore="onRestore"
|
refresher-default-style='none' :bounce='false' @refresherpulling="pulling">
|
<view class="indexbody-index-wrapper colCen borderBox">
|
<view class="topheaderCard-container colCen borderBox">
|
<view class="ellipse" :style="'background:'+ headerColor +';'"></view>
|
</view>
|
<view class="loading-img rowCenCen" :style="'margin-top:'+(Topheight-77)+'px;'">
|
<view class="imgbox defIcon">
|
<image src="../static/images/home/loading.gif" mode="aspectFill"></image>
|
</view>
|
</view>
|
<view class="pageBody-container colCen borderBox">
|
<view class="column-container">
|
<view class="bannerSwiper-container colCenCen borderBox" v-if="topBannerList.length>0">
|
<swiper class="swiper-box" :current="swpidx
|
" @change="changeColor" :autoplay="true" :interval="3000" :duration="500" :indicator-dots="true"
|
:indicator-active-color="'#fff'" circular>
|
<swiper-item v-for="(items,index) in topBannerList" :key='index'>
|
<view class="swiper-item defIcon" @click="goUrl(items)">
|
<image :src="items.image" mode="aspectFit"></image>
|
</view>
|
|
|
</swiper-item>
|
</swiper>
|
</view>
|
|
|
<!-- 金刚区 -->
|
<view class="navslider-box" v-if="navbarShowList.length > 0">
|
<swiper class="swiper-type swiper-nav"
|
:indicator-dots="navbarList.length > 10 ? true : false" indicator-color="#eaeaea"
|
indicator-active-color="#FE3A33" :duration="500" :style="sliderH">
|
<swiper-item v-for="(sliderItem, index) in navbarShowList" :key="index">
|
<view class="slider_itemslist rowSta">
|
<view class="item colCen" v-for="(item, idx) in sliderItem" :key="idx"
|
@click="goUrl(item)">
|
<image :src="item.image" :lazy-load="true" mode="aspectFit"></image>
|
<view class="desc">{{ item.mname }}</view>
|
</view>
|
</view>
|
</swiper-item>
|
</swiper>
|
</view>
|
|
<!--单列图片-->
|
<!-- <view class="centerSwiper-container colCenCen borderBox" v-if="singleLineList.length>0">
|
<swiper class="swiper-box" :autoplay="true" :interval="5000" :duration="300" circular>
|
<swiper-item v-for="(items,index) in singleLineList" :key='index'>
|
<view class="swiper-item defIcon" @click="goUrl(items)">
|
<image :src="items.image" mode="aspectFit"></image>
|
</view>
|
</swiper-item>
|
</swiper>
|
</view> -->
|
<!--快捷入口图标-->
|
<view class="c-loading-img rowCenCen">
|
<view class="imgbox defIcon" v-for="(eitem,index) in fastenter" :key="index" @click="goUrl(eitem)">
|
<image :src="eitem.image"></image>
|
</view>
|
</view>
|
<!--左轮播，右两行-->
|
<view class="centerflex f_contant">
|
<view class="f_centerSwiper-container swiper-box swiper-item f_left">
|
<swiper class="swiper-box" :autoplay="true" :interval="3000" :duration="300" :indicator-active-color="'#fff'" :indicator-dots="true" circular>
|
<swiper-item v-for="(items,index) in popBannerSList" :key='index'>
|
<view class="swiper-item defIcon" @click="goUrl(items)">
|
<image :src="items.image" mode="aspectFit"></image>
|
</view>
|
</swiper-item>
|
</swiper>
|
</view>
|
<view class="f_right">
|
<view class="f_imgcon" v-if='enterTop.length>0' >
|
<image :src="enterTop[0].image" @click="goUrl(enterTop[0])"></image>
|
</view>
|
<view class="f_imgcon" v-if='enterDown.length>0'>
|
<image :src="enterDown[0].image" @click="goUrl(enterDown[0])"></image>
|
</view>
|
</view>
|
</view>
|
|
<!--双列图片-->
|
<view class="cardsList-container rowCenBet borderBox" v-if="doubleLineList.length>0">
|
<block v-for="(items,index) in doubleLineList" :key='index'>
|
<view class="card-items defIcon" @click="goUrl(items)">
|
<image :src="items.image" mode="aspectFill" lazy-load="true"></image>
|
</view>
|
</block>
|
</view>
|
|
</view>
|
</view>
|
|
<view class="pagebottomBody-container colCen borderBox">
|
|
<view class="bottomSwiper-container colCenCen borderBox" v-if="bottomBannerList.length>0">
|
<swiper class="swiper-box" :autoplay="true" :interval="3000" :duration="300" circular>
|
<swiper-item v-for="(items,index) in bottomBannerList" :key='index'>
|
<view class="swiper-item defIcon" @click="goUrl(items)">
|
<image :src="items.image" mode="widthFix"></image>
|
</view>
|
</swiper-item>
|
</swiper>
|
</view>
|
<!--全网热销-->
|
<!-- <view class="van-row">
|
<view class="van-col van-col--12" style="padding-right: 10rpx;">
|
<view class="home-row" @click="gorxb()">
|
<view class="title"><text class="name">全网热销榜</text>
|
<view class="tag">
|
<image
|
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAOCAYAAAAmL5yKAAAAAXNSR0IArs4c6QAAASJJREFUOE+V08suBFEQxvHfGZcFVgQrli6ReBEh8RJsWHgSCzY8hsSLSMRlZ6xIWBkLl2mpntPSaY1MJ93pc6rqX199JydpPAWdRL9gCyc5vJs4q2L1ktQExLpgDBdYyfFrrCfem/mpIKWypvxU3SfwiMlc0MN8olfPj1ipoGA8L97yug0wl3jN8bIuGoeCTRxiBHuJ84IpPCBA8UThbADqPpRqCrpYyIm3WDVQ9NQGaCoOQH8whQ5i1pkMe24AwoOXgg0c4xMHFaDyI6RO/wIIcHh0haWccx+A6B5vGPMXoALHaHE6obz0YFhANVp59MOM0BytFVA3sZIajdr2vwF3WMym3GAt/19i+Z/9boywjSOMYicuTT7rH5eptn+KD+x/Adlpb2CRJ4eqAAAAAElFTkSuQmCC">
|
</image>
|
<text>实时好货</text>
|
</view>
|
</view>
|
<view class="g-row">
|
<view v-for="(items,index) in rqList.fqbGoods" :key='index'>
|
<view class="pic"><text class="num">{{index+1}}</text>
|
<view class="van-image">
|
<image class="van-image__img" :src="items.mainPic">
|
</image>
|
</view>
|
</view>
|
<view class="time">2小时抢{{items.twoHoursSales}}</view>
|
<view class="my">¥{{items.actualPrice}}</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
<view class="van-col van-col--12" style="padding-left: 6rpx;">
|
<view class="home-row two" @click="goddq()">
|
<view class="title"><text class="name">限时秒杀</text>
|
<view class="tagg" style="opacity: 1;">
|
<text class="ddq" style="white-space: nowrap;">{{rqList.ddqTime}} 点场 </text>
|
<view class="van-count-down">疯抢中</view>
|
</view>
|
</view>
|
<view class="g-row">
|
<view v-for="(items,index) in rqList.ddqGoods" :key='index'>
|
<view class="pic">
|
<view class="van-image">
|
<image :src="items.mainPic" alt="" class="van-image__img"></image>
|
</view>
|
</view>
|
<view class="time" style="opacity: 1;">
|
{{items.specialText[0] ? items.specialText[0]:'已抢'+items.monthSales+'件' }}
|
</view>
|
<view class="my">¥{{items.actualPrice}}</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view> -->
|
<!-- 大家都在买 -->
|
<!-- <view class="everysBuying-container colCen" v-if="zdmList.length>0">
|
<view class="box-bar-content rowCen">
|
<view class="title-text">
|
每日必买
|
</view>
|
<view class="tips-txt rowCenCen">
|
<view>精选爆款</view>
|
</view>
|
</view>
|
<view class="goodsScroll-container rowCen">
|
<scroll-view class="scrollgoods-box" scroll-x scroll-with-animation>
|
<view class="scrollList-content">
|
<view class="goods-items" v-for="(items,index) in zdmList" :key="index"
|
@tap="goDetails(items)">
|
<view class="items-container colCen">
|
<view class="image-content defIcon">
|
<image :src="items.mainPic" mode="aspectFill" :lazy-load="true"></image>
|
</view>
|
|
<view class="goodsinfo-content colCen borderBox">
|
<view class="goodsName-box">
|
{{items.dtitle}}
|
</view>
|
<view class="coupons-container rowCen">
|
<view class="couponbac-content rowCen">
|
<view class="textsTip">
|
爆款
|
</view>
|
<view class="coupons-value">
|
{{items.couponPrice}}元券
|
</view>
|
</view>
|
</view>
|
<view class="price-info-container rowEnd">
|
<view class="nowPrice-content rowEnd">
|
<view class="rmbicon">
|
￥
|
</view>
|
<view class="nowprice">
|
{{items.actualPrice}}
|
</view>
|
</view>
|
<view class="oldPrice-content rowEnd">
|
<view class="oldprice">
|
￥{{items.originalPrice}}
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
|
|
</view> -->
|
<!-- <view class="goodsFalling-container colCen" v-if="fallingList.length>0">
|
<view class="box-bar-content rowCen">
|
<view class="title-text">
|
好货直降
|
</view>
|
<view class="tips-txt rowCenCen">
|
<view>低过聚划算.省过淘抢购</view>
|
</view>
|
</view>
|
<view class="goodsScroll-container rowCen">
|
<scroll-view class="scrollgoods-box" scroll-x scroll-with-animation>
|
<view class="scrollList-content">
|
<view class="goods-items" v-for="(items,index) in fallingList" :key="index"
|
@tap="goDetails(items,true)">
|
<view class="items-container colCen">
|
<view class="image-content defIcon">
|
<image style="border-radius: 8rpx;" :src="items.mainPic"
|
mode="aspectFill" :lazy-load="true"></image>
|
<view class="spec-box rowCenCen" v-if="items.specialText.length>0">
|
<view>{{items.specialText[0]}}</view>
|
</view>
|
</view>
|
|
<view class="goodsinfo-content colCen borderBox">
|
<view class="goodsName-box">
|
{{items.dtitle}}
|
</view>
|
<view class="price-info-container rowEnd">
|
<view class="nowPrice-content rowEnd">
|
<view class="rmbicon">
|
￥
|
</view>
|
<view class="nowprice">
|
{{items.actualPrice}}
|
</view>
|
</view>
|
<view class="oldPrice-content rowEnd">
|
<view class="oldprice">
|
￥{{items.originalPrice}}
|
</view>
|
</view>
|
</view>
|
<view class="saleNum-container rowCen">
|
<view class="content-box rowCen">
|
<view class="txt-tips rowCenBet">
|
爆款
|
</view>
|
<view class="salenum rowCenCen">
|
<view>{{items.monthSales}}件</view>
|
</view>
|
</view>
|
</view>
|
<view class="likeNum-container rowCen">
|
<view class="like-num">
|
{{items.twoHoursSales}}
|
</view>
|
<view class="txt">
|
人想买
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</scroll-view>
|
</view>
|
</view> -->
|
|
<!-- 福利抢购 -->
|
<!-- <view class="welfare-container colCen">
|
<view class="titlebar-container rowCenBet">
|
<view class="left-content rowCen">
|
<view class="titletext">
|
福利抢购
|
</view>
|
</view>
|
</view>
|
|
<view class="goodsList-container colCen">
|
<block v-for="(items,index) in phbList.slice(0,4)" :key="index">
|
<view class="goods-items-container rowCen borderBox" @click="goDetails(items)">
|
<view class="left-imagecontent defIcon">
|
<image style="border-radius: 8rpx;" :src="items.mainPic" mode="aspectFill">
|
</image>
|
</view>
|
|
<view class="right-goodsinfo-container colCenBet borderBox">
|
<view class="top-content-box colCen">
|
<view class="goodsnameinfo-content rowSta">
|
<view class="typeIcon-content defIcon">
|
<image :src="items.labelImg" mode="heightFix"></image>
|
</view>
|
<view class="tradename">
|
{{items.dtitle}}
|
</view>
|
</view>
|
|
<view class="desc-box">
|
{{items.desc}}
|
</view>
|
</view>
|
|
<view class="btm-content-box colCen">
|
<view class="discounts-container rowCen borderBox">
|
<view class="coupon-box rowCenCen">
|
<view>
|
{{items.couponPrice}}元券
|
</view>
|
</view>
|
|
|
<view class="back-box rowCenCen">
|
<view>
|
返{{items.fanli}}元
|
</view>
|
</view>
|
</view>
|
|
<view class="price-saleNums-container rowEndBet">
|
<view class="left-price-box rowEnd">
|
<view class="nowpirce rowEnd">
|
<view class="rmb">
|
￥
|
</view>
|
<view class="num">
|
{{items.actualPrice}}
|
</view>
|
</view>
|
|
<s class="original-price">
|
￥{{items.originalPrice}}
|
</s>
|
</view>
|
|
<view class="saleNum-content">
|
爆卖{{items.monthSales}}件
|
</view>
|
</view>
|
</view>
|
</view>
|
</view>
|
</block>
|
</view>
|
</view> -->
|
|
<!-- 实时疯抢榜 -->
|
|
|
|
<!-- 抖好物 -->
|
|
|
|
</view>
|
|
<view class="goods-bottom-List colCen borderBox">
|
<view class="bottomTypebar-container colCen borderBox">
|
<view class="typeList rowCenCen borderBox">
|
<block v-for="(items,index) in typedataList" :key='index'>
|
<view class="type-items-container colCenCen" @click="switchtype(items,index)"
|
:class="bottomCurrent==index?'type-container-active':''">
|
<view class="mainTitle">
|
{{items.mainTitle}}
|
</view>
|
<view class="subtitle rowCenCen">
|
<view>{{items.subTitle}}</view>
|
</view>
|
</view>
|
</block>
|
</view>
|
</view>
|
|
<view class="bottomGoods-list-container rowCenBet borderBox"
|
v-if="bottomGoodsList.length>0">
|
<block v-for="(items,index) in bottomGoodsList" :key="index">
|
<view class="goods-items" @click="goDetails(items)">
|
<colGoods :items="items"></colGoods>
|
</view>
|
</block>
|
|
<aLoadMore :status="loadstatus" mode="loading3" :showTitle='true' color="#999999">
|
</aLoadMore>
|
</view>
|
</view>
|
</view>
|
</scroll-view>
|
<slideTop v-if="scrollTop>1000" @toTop='scrolltoTops'></slideTop>
|
</view>
|
</template>
|
|
<script>
|
import utils from '../utils/utils.js'
|
import slideTop from './slideTop.vue'
|
import colGoods from './colGoods.vue'
|
import empowerModel from './empowerModel.vue'
|
export default {
|
props: {
|
recomendType: {
|
type: Number,
|
default: 1
|
},
|
Topheight: {
|
type: Number,
|
default: 90
|
},
|
canrefush: {
|
type: Boolean
|
},
|
fixedClass: {
|
type: Boolean,
|
default: false
|
}
|
},
|
components: {
|
slideTop,
|
colGoods,
|
empowerModel
|
},
|
data() {
|
return {
|
fallingList: [],
|
pageHeight: '',
|
headerColor: '',
|
topBannerList: [],
|
singleLineList: [],
|
doubleLineList: [],
|
bottomBannerList: [],
|
navbarShowList: [],
|
navbarList: [],
|
sliderH: '',
|
scrollTop: 0,
|
scrollindex: 0,
|
zdmList: [],
|
phbList: [],
|
dyList: [],
|
rqList: [],
|
typedataList: [
|
{
|
mainTitle: '京东',
|
subTitle: '官方保障',
|
type: 2
|
},
|
{
|
mainTitle: '抖音',
|
subTitle: '好物抢购',
|
type: 6
|
},
|
{
|
mainTitle: '拼多多',
|
subTitle: '百亿补贴',
|
type: 3
|
},
|
{
|
mainTitle: '唯品会',
|
subTitle: '大牌精选',
|
type: 4
|
}
|
],
|
bottomType: 1,
|
bottomCurrent: 0,
|
bottomGoodsList: [],
|
loadingState: false,
|
currentPage: 1,
|
loadstatus: 'loading',
|
|
beanCurd: {
|
BaiYiBuTie: '',
|
JDMiaoSha: '',
|
LiveGoods: '',
|
PDDOne: ''
|
},
|
triggeredstate: true,
|
swpidx: 0,
|
canrefresh: true,
|
fastenter:[],
|
popBannerSList:[],
|
enterTop:[],
|
enterDown:[]
|
}
|
},
|
watch: {
|
|
recomendType(nval, oval){
|
if(nval != oval)this.changeRecommend()
|
},
|
navbarList(nval, oval) {
|
let index = 0;
|
while (index < nval.length) {
|
this.navbarShowList.push(nval.slice(index, (index += 10)));
|
}
|
if (this.navbarList.length > 5) {
|
this.sliderH = 'height:345rpx;';
|
} else {
|
this.sliderH = 'height:160rpx;';
|
}
|
},
|
headerColor: {
|
handler(nvl, ovl) {
|
this.$emit('passColor', nvl)
|
},
|
immediate: true
|
}
|
},
|
created() {
|
this._freshing = false;
|
this.changeRecommend();
|
uni.$emit('initpage')
|
this.getBannerInfo();
|
this.getHomeMenuList();
|
this.getrecommendGoods();
|
this.getbottomGoodsList(this.bottomType);
|
this.getGOODSfalling();
|
this.getRQList();
|
},
|
mounted() {
|
this.$emit('scrolltoTop')
|
this.fixedClass = false;
|
setTimeout(() => {
|
this.getfixedHeight()
|
}, 1500)
|
},
|
methods: {
|
changeRecommend(){
|
var tmp_1 = {
|
mainTitle: '天猫',
|
subTitle: '天猫热销',
|
type: 5
|
};
|
var tmp_2 = {
|
mainTitle: '推荐',
|
subTitle: '为你推荐',
|
type: 1
|
};
|
var open_like_recommend = uni.getStorageSync('open_like_recommend');
|
if(this.typedataList.length == 5)this.typedataList.shift()
|
if(open_like_recommend == 1){
|
this.typedataList.unshift(tmp_2);
|
this.bottomType = tmp_2.type;
|
}else{
|
this.typedataList.unshift(tmp_1);
|
this.bottomType = tmp_1.type;
|
}
|
this.currentPage = 1;
|
this.getbottomGoodsList(this.bottomType);
|
},
|
getGOODSfalling() {
|
var that = this;
|
this.$u.api.superDiscountGoods({
|
page:1,
|
pageSize:10
|
}).then(e => {
|
if(e.code != 0) return that.$alert(e.msg)
|
that.fallingList = e.data.list
|
}).catch(function (err) {
|
})
|
},
|
pulling(e) {},
|
refresh(e) {
|
this.triggeredstate = true
|
if (this._freshing) return;
|
this._freshing = true;
|
this.getBannerInfo();
|
this.getrecommendGoods();
|
this.getGOODSfalling();
|
this.getbottomGoodsList(this.bottomType);
|
setTimeout(() => {
|
this.triggeredstate = false;
|
this._freshing = false;
|
}, 8000)
|
},
|
goUrl1(e) {
|
let url = e.currentTarget.dataset.url;
|
console.log(url);
|
uni.navigateTo({
|
url: url
|
});
|
},
|
onRestore() {
|
this.swpidx = 0
|
console.log('下拉被终止');
|
},
|
pagescroll(e) {
|
this.$emit('scrollNum', e.detail.scrollTop)
|
this.scrollTop = e.detail.scrollTop
|
if (!e.detail.scrollTop > 0) {
|
setTimeout(() => {
|
this.canrefresh = true
|
})
|
} else {
|
// this.canrefresh = false
|
}
|
},
|
|
scrolltoTops() {
|
this.scrollindex = this.scrollTop
|
this.$nextTick(() => {
|
this.scrollindex = 0
|
})
|
},
|
|
onAbort() {
|
console.log('refushstop');
|
},
|
|
getBannerInfo() {
|
// banner数据
|
var that = this;
|
this.$u.api.getBanner({
|
type: '1,3,4,5,11,12,13,14'
|
}).then(e => {
|
if (e.code == 1) return that.$alert(e.msg);
|
var res = e.data.info;
|
if(res.topBannerList&&res.topBannerList.length>0)
|
{
|
this.topBannerList = res.topBannerList;
|
this.headerColor = this.topBannerList[0].colour;
|
}
|
|
this.singleLineList = res.singleLineList;
|
this.doubleLineList = res.doubleLineList;
|
this.bottomBannerList = res.bottomBannerList;
|
this.fastenter=res.indexbanner;
|
this.popBannerSList=res.popBannerSList;
|
this.enterTop=res.enterTop;
|
this.enterDown=res.enterDown;
|
setTimeout(() => {
|
this.triggeredstate = false;
|
this._freshing = false;
|
}, 300)
|
}).catch(function(err) {
|
console.log(err)
|
})
|
},
|
|
goTik() {
|
uni.navigateTo({
|
url: '../active/tiktoklist'
|
})
|
},
|
|
godydetails(itm) {
|
const info = {}
|
info.nowInfo = itm
|
info.pageCurrent = 2
|
info.type = 0
|
info.storgeList = this.dyList
|
utils.setCache('pathInfo', info)
|
uni.navigateTo({
|
url: '../active/dyvideoDetails'
|
})
|
},
|
|
getHomeMenuList() {
|
var that = this;
|
this.$u.api.getHomeMenu({
|
type: 1
|
}).then(e => {
|
if (e.code != 0) return that.$alert(e.msg)
|
that.navbarList = e.data.list;
|
}).catch(function(err) {})
|
|
},
|
|
getrecommendGoods() {
|
var that = this;
|
this.$u.api.getMQD({}).then(e => {
|
if (e.code != 0) return that.$alert(e.msg)
|
that.zdmList = e.data.zdm;
|
that.phbList = e.data.phb;
|
that.dyList = e.data.dygoods;
|
}).catch(function(err) {})
|
},
|
|
getbottomGoodsList(type) {
|
var that = this;
|
this.$u.api.getGoodThing({
|
deviceType: getApp().globalData.platform == 'android' ? (getApp().globalData.systemLevel < 10 ?
|
'IMEI' : 'OAID') : 'IDFA',
|
deviceValue: getApp().globalData.equipmentNumber,
|
pageId: 1,
|
pageSize: 10,
|
type: type
|
}).then(e => {
|
if (e.code != 0) return that.$alert(e.msg)
|
var res = e.data.list;
|
if (res.length < 10) {
|
that.loadingState = false
|
that.loadstatus = 'normal'
|
} else {
|
that.currentPage++
|
that.loadstatus = 'loading'
|
that.loadingState = true
|
}
|
that.bottomGoodsList = res
|
}).catch(function(err) {})
|
},
|
|
getNextPage() {
|
if (this.loadingState) {
|
this.loadingState = false
|
var that = this;
|
this.$u.api.getGoodThing({
|
deviceType: getApp().globalData.platform == 'android' ? (getApp().globalData.systemLevel <
|
10 ? 'IMEI' : 'OAID') : 'IDFA',
|
deviceValue: getApp().globalData.equipmentNumber,
|
pageId: this.currentPage,
|
pageSize: 10,
|
type: this.bottomType
|
}).then(e => {
|
if (e.code != 0) return that.$alert(e.msg)
|
var res = e.data.list;
|
if (res.length < 10) {
|
that.loadingState = false
|
that.loadstatus = 'normal'
|
} else {
|
that.currentPage++
|
that.loadstatus = 'loading'
|
that.loadingState = true
|
}
|
that.bottomGoodsList = that.bottomGoodsList.concat(res)
|
}).catch(function(err) {})
|
}
|
},
|
|
switchtype(info, idx) {
|
if (this.bottomCurrent != idx) {
|
this.currentPage = 1;
|
this.bottomType = info.type;
|
this.getbottomGoodsList(this.bottomType);
|
this.$nextTick(() => {
|
this.$emit('scrolltoview')
|
this.bottomCurrent = idx;
|
})
|
}
|
},
|
|
getfixedHeight(e) {
|
uni.createSelectorQuery().in(this).select('.goods-bottom-List').boundingClientRect(data => {
|
this.$emit('pushfixed', data.top)
|
}).exec();
|
},
|
|
changeColor(e) {
|
this.swpidx = e.detail.current
|
this.topBannerList.forEach((itm, idx) => {
|
if (idx == e.detail.current) {
|
this.headerColor = itm.colour
|
}
|
})
|
},
|
|
goUrl(info) {
|
utils.goUrl(info, this)
|
},
|
goFUrl(info)
|
{
|
uni.navigateTo({
|
url: info.url
|
});
|
},
|
gojgqUrl(info) {
|
if (info.urlType == '0') {
|
uni.navigateTo({
|
url: '../webView/webView?url=' + info.murl
|
})
|
} else if (info.urlType == 1) {
|
uni.navigateTo({
|
url: info.murl
|
})
|
} else if (info.urlType == '2') {
|
// #ifdef APP-PLUS
|
if (plus.os.name == 'Android') {
|
console.log(plus.os.name);
|
plus.runtime.openURL(info.murl, res => {
|
uni.navigateTo({
|
url: '../webView/webView?url=' + info.murl
|
})
|
}, 'com.taobao.taobao');
|
} else {
|
info.murl = info.murl.split('//')[1]
|
plus.runtime.openURL('taobao://' + info.murl, function(res) {
|
uni.navigateTo({
|
url: '../webView/webView?url=' + info.murl
|
})
|
}, 'taobao://');
|
}
|
// #endif
|
}
|
},
|
|
goDetails(info) {
|
//info.searchSource = 1
|
uni.navigateTo({
|
url: '../goods/goodsDetail?info=' + encodeURIComponent(JSON.stringify(info))
|
})
|
},
|
|
|
getRQList() {
|
// 金刚区
|
var that = this;
|
this.$u.api.getM({}).then(e => {
|
if (e.code != 0) return that.$alert(e.msg)
|
that.rqList = e.data;
|
}).catch(function(err) {})
|
|
// this.$http.post('tb/getM', 'application/json').then((res) => {
|
// console.log("rexiao========================" + JSON.stringify(res))
|
// this.rqList = res;
|
// })
|
},
|
gorxb() {
|
console.log("=======================" + JSON.stringify(this.rqList))
|
uni.navigateTo({
|
url: '../webView/webView?url=' + this.rqList.fqbUrl
|
})
|
},
|
goddq() {
|
uni.navigateTo({
|
url: '../webView/webView?url=' + this.rqList.ddqUrl
|
})
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss">
|
.f_contant
|
{
|
display: flex;
|
justify-content: space-between;
|
width: 96%;
|
height: 500rpx;
|
flex-direction: row;
|
padding: 20rpx 0;
|
margin: auto;
|
.f_left{
|
width:49%;
|
border-radius: 12rpx;
|
background: #fff;
|
}
|
.f_right{
|
width:49%;
|
display: flex;
|
flex-direction: column;
|
justify-content: space-between;
|
}
|
.f_imgcon
|
{
|
height: 49%;
|
border-radius: 12rpx;
|
image
|
{
|
width:100%;
|
border-radius: 12rpx;
|
height: 100%;
|
}
|
}
|
.f_centerSwiper-container {
|
|
|
.swiper-box {
|
width: 100%;
|
height: 100%;
|
|
.swiper-item {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
}
|
|
.c-loading-img {
|
width: 96%;
|
height: 132rpx;
|
background: #fff;
|
margin: auto;
|
margin-top: 20rpx;
|
border-radius: 12rpx;
|
justify-content:space-between;
|
padding:5rpx;
|
|
.imgbox {
|
width: 158rpx;
|
height: 105rpx;
|
// max-height: 72rpx;
|
}
|
}
|
.juan {
|
height: 28rpx;
|
background: linear-gradient(90deg, #ff8873 0, #ff4f4f 100%);
|
border-radius: 4rpx;
|
padding: 0 10rpx 0 2rpx;
|
font-size: 19rpx;
|
font-weight: 400;
|
color: #fff;
|
line-height: 28rpx;
|
}
|
|
.juan text {
|
background: #fff;
|
border-radius: 2rpx 0 0 2rpx;
|
font-size: 20rpx;
|
color: #FE3A33;
|
margin: auto 10rpx auto 0;
|
min-width: 24rpx;
|
max-width: 24rpx;
|
min-height: 24rpx;
|
max-height: 24rpx;
|
display: inline-block;
|
line-height: 24rpx;
|
text-align: center;
|
vertical-align: middle;
|
margin-top: -4rpx;
|
}
|
|
.loading-img {
|
width: 100%;
|
height: 150rpx;
|
margin-bottom: 16rpx;
|
|
.imgbox {
|
width: 208rpx;
|
height: 126rpx;
|
// max-height: 72rpx;
|
}
|
}
|
|
.swiper-scroll {
|
width: 100%;
|
height: 100vh;
|
}
|
|
.indexbody-index-wrapper {
|
width: 100%;
|
position: relative;
|
|
.topheaderCard-container {
|
width: 100%;
|
height: 380rpx;
|
position: absolute;
|
|
.ellipse {
|
width: 130%;
|
height: 100%;
|
border-radius: 0 0 50% 50%;
|
}
|
}
|
|
.pageBody-container {
|
width: 100%;
|
//background-color: #FFFFFF;
|
//margin-bottom: 16rpx;
|
|
.column-container {
|
width: 100%;
|
z-index: 10;
|
|
.bannerSwiper-container {
|
width: 100%;
|
height: 230rpx;
|
padding: 0 16rpx;
|
margin-bottom: 16rpx;
|
|
/deep/.swiper-box {
|
width: 100%;
|
height: 100%;
|
|
.swiper-item {
|
width: 100%;
|
height: 100%;
|
border-radius: 12rpx;
|
overflow: hidden;
|
}
|
|
.uni-swiper-dot {
|
width: 20rpx;
|
height: 6rpx;
|
border-radius: 3rpx;
|
}
|
}
|
}
|
|
|
.centerSwiper-container {
|
width: 100%;
|
height: 190rpx;
|
padding: 0 20rpx;
|
margin-bottom: 16rpx;
|
|
.swiper-box {
|
width: 100%;
|
height: 100%;
|
|
.swiper-item {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
|
.cardsList-container {
|
width: 100%;
|
flex-wrap: wrap;
|
padding: 0 20rpx;
|
margin-bottom: 16rpx;
|
|
.card-items {
|
width: 340rpx;
|
height: 135rpx;
|
overflow: hidden;
|
border-radius: 8rpx;
|
margin-bottom: 10rpx;
|
}
|
}
|
|
/deep/.navslider-box {
|
margin: auto;
|
width: 96%;
|
background-color: #FFFFFF;
|
border-radius: 12rpx;
|
|
.swiper-type {
|
width: 100%;
|
|
.slider_itemslist {
|
width: 100%;
|
flex-wrap: wrap;
|
padding: 20rpx 0;
|
|
.item {
|
width: 20%;
|
margin-bottom: 30rpx;
|
|
image {
|
width: 80rpx;
|
height: 80rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.desc {
|
font-size: 28rpx;
|
font-weight: 400;
|
color: #333333;
|
}
|
}
|
}
|
}
|
|
.uni-swiper-dot {
|
width: 20rpx;
|
height: 6rpx;
|
border-radius: none;
|
}
|
}
|
}
|
}
|
|
.pagebottomBody-container {
|
width: 100%;
|
padding: 0 20rpx;
|
margin: 6rpx 0;
|
|
.goodsFalling-container {
|
width: 100%;
|
height: 505rpx;
|
background: #FFFFFF;
|
border-radius: 16rpx;
|
margin-bottom: 20rpx;
|
|
.box-bar-content {
|
width: 100%;
|
height: 110rpx;
|
padding: 0 20rpx;
|
|
.title-text {
|
font-size: 32rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
|
.tips-txt {
|
height: 30rpx;
|
background: linear-gradient(-90deg, #7619EC, #A429F3);
|
border-radius: 15rpx 15rpx 15rpx 0px;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
margin-left: 20rpx;
|
padding: 0 20rpx;
|
}
|
}
|
|
.goodsScroll-container {
|
width: 100%;
|
height: 395rpx;
|
|
.scrollgoods-box {
|
width: 100%;
|
height: 100%;
|
|
.scrollList-content {
|
white-space: nowrap;
|
padding-left: 8rpx;
|
|
.goods-items {
|
display: inline-block;
|
width: 226rpx;
|
height: 390rpx;
|
border-radius: 8rpx;
|
overflow: hidden;
|
margin-right: 20rpx;
|
|
.items-container {
|
width: 100%;
|
height: 100%;
|
|
.image-content {
|
width: 226rpx;
|
height: 226rpx;
|
position: relative;
|
border-radius: 8rpx;
|
overflow: hidden;
|
|
.spec-box {
|
width: 100%;
|
height: 30rpx;
|
background: linear-gradient(86deg, #FD8E0E, #FFBD0A);
|
border-radius: 0px 0px 8rpx 8rpx;
|
font-size: 22rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
position: absolute;
|
bottom: 0;
|
}
|
}
|
|
.goodsinfo-content {
|
width: 100%;
|
height: 160rpx;
|
padding: 0 10rpx;
|
|
.goodsName-box {
|
width: 100%;
|
line-height: 34rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #444444;
|
margin-top: 5rpx;
|
}
|
|
.price-info-container {
|
width: 100%;
|
|
.nowPrice-content {
|
.rmbicon {
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #FF4242;
|
line-height: 34rpx;
|
}
|
|
.nowprice {
|
font-size: 26rpx;
|
font-weight: bold;
|
color: #FF4242;
|
line-height: 34rpx;
|
}
|
}
|
|
.oldPrice-content {
|
margin-left: 10rpx;
|
|
.oldprice {
|
text-decoration: line-through;
|
line-height: 34rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
}
|
}
|
|
.saleNum-container {
|
width: 100%;
|
margin-top: 5rpx;
|
|
.content-box {
|
height: 30rpx;
|
background: #FAE7AD;
|
border-radius: 5rpx;
|
overflow: hidden;
|
|
.txt-tips {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #613309;
|
padding: 0 6rpx;
|
}
|
|
.salenum {
|
height: 30rpx;
|
background: linear-gradient(9deg, #F63F4E, #FC5F13);
|
padding: 0 14rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
border-radius: 5rpx;
|
}
|
}
|
}
|
|
.likeNum-container {
|
width: 100%;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FE3738;
|
margin-top: 5rpx;
|
|
.txt {
|
color: #333333;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.welfare-container {
|
width: 100%;
|
background: #FFFFFF;
|
border-radius: 16rpx;
|
margin-bottom: 20rpx;
|
|
.titlebar-container {
|
width: 100%;
|
height: 110rpx;
|
padding: 0 20rpx;
|
|
.left-content {
|
.titletext {
|
font-size: 32rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
}
|
|
.right-arrowContent {
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
|
.goodsList-container {
|
width: 100%;
|
|
.goods-items-container {
|
width: 100%;
|
height: 260rpx;
|
padding-left: 10rpx;
|
padding-right: 35rpx;
|
background: #FFFFFF;
|
border-radius: 16rpx;
|
margin-bottom: 20rpx;
|
|
.left-imagecontent {
|
width: 220rpx;
|
height: 220rpx;
|
border-radius: 8rpx;
|
overflow: hidden;
|
}
|
|
.right-goodsinfo-container {
|
margin-left: 20rpx;
|
width: 420rpx;
|
height: 220rpx;
|
|
.top-content-box {
|
width: 100%;
|
|
.goodsnameinfo-content {
|
width: 100%;
|
margin-bottom: 12rpx;
|
|
.typeIcon-content {
|
width: 60rpx;
|
height: 24rpx;
|
margin-right: 5rpx;
|
margin-top: 8rpx;
|
}
|
|
.tradename {
|
width: 400rpx;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
white-space: nowrap;
|
font-size: 28rpx;
|
font-weight: 400;
|
color: #333333;
|
}
|
}
|
|
.desc-box {
|
width: 100%;
|
height: 60rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
line-height: 30rpx;
|
color: #999999;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
display: -webkit-box;
|
-webkit-box-orient: vertical;
|
-webkit-line-clamp: 2;
|
}
|
}
|
|
.btm-content-box {
|
width: 100%;
|
|
.discounts-container {
|
width: 100%;
|
margin-bottom: 15rpx;
|
|
.coupon-box {
|
width: 102rpx;
|
height: 30rpx;
|
background: url(@/static/images/goods/couponbac.png)no-repeat;
|
background-size: 100% 100%;
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FF4242;
|
}
|
|
.back-box {
|
height: 30rpx;
|
padding: 0 10rpx;
|
background: linear-gradient(-90deg, #7619EC, #A429F3);
|
border-radius: 5rpx;
|
margin-left: 8rpx;
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
white-space: nowrap;
|
}
|
}
|
|
.price-saleNums-container {
|
width: 100%;
|
|
.left-price-box {
|
.nowpirce {
|
.rmb {
|
font-size: 24rpx;
|
font-weight: 600;
|
color: #FF4242;
|
line-height: 30rpx;
|
}
|
|
.num {
|
font-size: 30rpx;
|
line-height: 34rpx;
|
font-weight: bold;
|
color: #FF4242;
|
}
|
}
|
|
.original-price {
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #999999;
|
margin-left: 15rpx;
|
line-height: 30rpx;
|
}
|
}
|
|
.saleNum-content {
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
.bottomSwiper-container {
|
width: 100%;
|
height: 160rpx;
|
padding: 0 20rpx;
|
background-color: #FFFFFF;
|
|
.swiper-box {
|
width: 100%;
|
height: 100%;
|
|
.swiper-item {
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
|
.van-row {
|
width: 100%;
|
|
.van-col {
|
float: left;
|
box-sizing: border-box;
|
min-height: 2rpx;
|
width: 50%;
|
|
.home-row {
|
background: #fff;
|
border-radius: 12rpx;
|
padding: 0 16rpx 0 16rpx;
|
margin-bottom: 16rpx;
|
|
.title {
|
display: flex;
|
align-items: center;
|
width: 100%;
|
justify-content: space-between;
|
height: 100rpx;
|
|
.name {
|
font-weight: 700;
|
font-size: 28rpx;
|
color: #333;
|
}
|
|
.tagg {
|
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAKoAAAAcCAYAAADx5STqAAAAAXNSR0IArs4c6QAABYhJREFUeF7tnEtsFVUYx39n5j7m3tsCbWkpLYVizaUUKAIWAgoWLUoCiY8EjejK+CJGjVa78A0mxsREE+PCjTujJsTEJQkPdaEbFy4N7jXGleFRpPfeOeabc+b2XqiJkpmkZc4kJE2BkzPf95v/95jvjGKBS7+Nx3G0Aq3focxlJgiZAu7AZ5CQAaBjof970/4uBLr74JlPoLwJKAD6pr3d1G5McQm830H/htY/4KkzBJWflBqY1VqQQymlxNptl/xF2yWQquOEEayzHAFeQrPNeia1/S/qhT1gFti9Eyb3Q+fD4K8A6mLXRb31JbC5OZT6GdRHlEZOCqRaa+9aWNusrI/gq5M09AwbgU8J2dciG0K5uEyu7HhH7lTuPK/goSkYHIfOx8BfBjQyZYoEoY9DUTtTSn2Pr4+pYvUXrbWvlBIDtwPXVNJpDqD4HOizLpJFBdDswNnqEbnrq8CeMZjYDPRC35PgdTpQkyFX+BJgxdLC2Z/4PK6C6ulWZY3ga0L6KgfRfAMUrRf8ZPayRFcR60h07y3B/feBryE/AH1Pg98J2ilqwp4Vg/ooruJ5D6jg1lMxrKoJ6QwbCPkO6LfuySW8iaW73MFdsHYNXJ2FYAhWPQu55aBdjpqCU8WoOVB/4DcmVTB6PoI1UlSNYoYzaO52StqSFEnI39wPeyegEYKeg8JaWP2cAzUFQluWtMrqnaM0MqWUitoB6GkeRfGFzRXigindrSzm1cUqYqqKB4f2QiUwnShdg+IQDLwAuRVOUdP1oSm0FEdVufqlhP6AK5wlZI9T0xY1rQH7qlAdhrkaeL5R1OI6GHyxXVFV1P5L123ZW92qqvqRUu4epWfYT8jpKIk1upFti8dV/nAFJm8HbQtSZUENhmHda5DralFUDeHf2UMp3TuOWWzghQeUfoUTwJtOTa3VxTx5YGocujuhHho1ledXiqd8D/RIB6Bsn+sQ/C7oGM/8M54Ct0ZV8d5VeppzKPa7/NRyJgXU9lUwvh7mGvJCz/yJ285K1PNKVIHi5aF+AXofhMFjJofNeEBKGFabp6pvJfSfJ6Sa+bAf90x7fJjcAn5rTSmwCoP2vYekAfJzWINCL6x/Cwp9Jod1oCbJqgn/yvtVQv8lqW+TXH3JriVm2bsO+rugXjcwRmJqoW0WTQo8DxpXYOh56D0E9UsW5CV794t344rLDlRxT1xAVcuwfb3JS+NwH8PZDP/y73PQmIUVu2HkDVtwLV4/L/mdRaBmPfTHPdOygjvXQlA04EVqakO+iftWXeVnyU8D2PA+VEaNskZpgbsStkBL6HfFlBmJ2NEFIz1Qi9VUQT0e8hFI4/DvQ/0iDD0FQ09A/bKDNGE6W5ZrKaZce8rYZZUPRemV2lwg78FwN5Tytrtsh3ukX9oxBmMfGlVtDv6k560Mr2zbU+qEa/jHFMgoRJyvinlKMtq3EjqDFhZFVRuw8QPo3ucKqHSfoGsa/u4V6jygseHFRDLoONENHUUItS2g/oKBo1B93eSlzTnydD2W0dXbX6GKEdxQyjUoNEFdDpW8UVRR0kI/bPsMgn7TQ3U90zSfofahlAhUsfg0Z+0bKpsXpLmHRb52DOqOClQKRMccpR01+h4MPQK1CyBNf3elZYHrx/zc4PQCto5B3RZARwC1i7DyXtj6sX2B52Z30iJ0fmh/ocHp+OSpO4pi7B+DujUPZemnFmDnV7BsC9RnXTsqPUr//ShKs36IYXWH++ZBva0AhTm45WXYMG2U1TX2k8b0vx/ua8Lqjkub+khaVV1lGKvD8mHY9TXkSu4wX3KI3vhx6euUNasfoIjf+6/phzFg03FYfdiM87kCKjlU51f6/x+gaIU1s5/0ib+KMroFDh+DnrvM3Km7krHADX7S5x9NQ+SquvQhJAAAAABJRU5ErkJggg==);
|
background-size: 100% 100%;
|
display: flex;
|
align-items: center;
|
font-size: 22rpx;
|
height: 38rpx;
|
color: #FFFFFF;
|
width: 186rpx;
|
|
.ddq {
|
text-align: center;
|
display: inline-block;
|
width: 76rpx;
|
font-size: 22rpx;
|
margin-left: 4rpx;
|
}
|
|
view {
|
font-size: 24rpx;
|
color: #ff6101;
|
margin-left: 14rpx;
|
}
|
}
|
|
.tag {
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIYAAAAcCAYAAACkhMe0AAAAAXNSR0IArs4c6QAAAydJREFUaEPtW0trU0EU/r5b+0BdNkHbBLqp4mPjwo0FoWJR3LvwH4iCIO4EEfwBbgSpiyqIdOHKrWiLG4X+AaH4BJtIG4VWbElqc4+c+4g3aRJuSiideAa6aJiZe853Ps5rZogmQ0Q8AEJSpFjcj/7qaQjPA5gAOQpgBCIHm6213xxFgFyHLy/h8TYzo4tsVENJQdIPyFEqXgZxE5BTEAw4qrKJnQ4BH4A6hE8gLtURQ0T6SFblR/EYfJkG5Kx6jmjfeKH+u41Q6b5ts/Y4AlsA9sHH85qBa57iZ2EKVXkGIAtAyaDEUCYZGfa4VbsmHrkeGLtGipVvF0HvBUQGAVQB9HXtY7aROwgoMWqkKBWOQvAGkEMAQpdio1cRiNODRv3UGfwLJSJClApzACbNU/QqF4II0C4liHJIfgXlQhhKSoUrEJmNcgpdbKO3EEgWDuXIzvUaBuUqXoP+XWbzHyjyZQilgTlAzpi36C02RNpo2CAE84A8BAffYmvr1zZNKxUfY2MV7V0FZad8X5pEH15FiWa4iY1eQSD0FOI9QvbwdW1FtFMsSCkAah+Lsrx0D8Qd8xa9woWaHmFVSSzgj3eOIyMbIqIFRUtyxN4i9BgrS/NR0pmMQz2H0n+oUOT95Qaz+QdKCpJabaYalFJhESJHokaWhZFUsDkzqQpPJjicX4jbEmklV2L8hsiBtAtsnlMIGDGcMtfuCGuhZHdwdu4rbZPPZKLZTDNLPp2zd0cCty1Xk/duGne1crUjnJ2cXN/g8obeoVxeRS63GVyxCHsX2ryoOz+xBpeTtu5Y6GQrogJwA5D3gD+DTP6ptsi3E8Na4h2j7OiCxkO0mCxPkFm9Sp7cVO9Ra4mrknaI5qipdy62hg0lhv71g7jFTO5+stcRX9SxY/edg+zyyshreJ+xtn6c4+OVWBm7qOOyWbslO7EJkRPM5j/G4cSu9nULXJf3aUWMIM+Inw0sF6ZAuwzssp07kL11KEluYs8HOoDU/amagOppa+vks4Ec9uDIfaOn0SDyFjKDzNq1puVq4y72RDENri7PYRnUBpdMYzj3OL4Dmmxy/QW0ErCCkfeAigAAAABJRU5ErkJggg==) no-repeat 50%;
|
background-size: 100% 100%;
|
display: flex;
|
align-items: center;
|
color: red;
|
font-size: 22rpx;
|
height: 38rpx;
|
width: 162rpx;
|
|
image {
|
width: 22rpx;
|
height: 18rpx;
|
margin: 0 8rpx 0 12rpx;
|
}
|
}
|
}
|
|
.g-row {
|
display: flex;
|
margin: 0 -12rpx;
|
|
view {
|
margin: 0 4rpx;
|
overflow: hidden;
|
|
.pic {
|
position: relative;
|
border-radius: 12rpx;
|
margin: 0;
|
|
.num {
|
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAeCAYAAAA/xX6fAAAAAXNSR0IArs4c6QAAAuFJREFUSEu9V01rFEEQfW8GFSR+oIKKoPiFiAgh5KDgQY1486bB6F2PuYiCCklAD4mIKIIoIiKaaKIIihcT4h+I4lnxKOIhXpKLxJ2S/pjZnp6endlEbAi7SXfXq3r1uqpC2CUCYnCAHBpKZKpnPVZEx4H4BES6IdwMJB3p2aV8MgMcPxWzd6IhH3pOgtEVAJ0ABIA5I+qrv9RW80h+VwDS3NOfZpcqMhIiM+eWYf7bNTRwUVshEojQ7jLFrR2d64vjK2UAEYeQyPSRYQvWMK4gzhn3AywxmN3JuEtzZiPUbE0dPo1ExiCSmPgtjTnGPAuaKofRKofsdcrksTVo/J4G0AVARWciS1OTpahdwLA3lMlDZ7CAZzmwFDEHGuCo4JSbhDLAdwdHIegDkACIaosiVa6rRP9yplCrVK3SNwe+gLIbopXph9E04T+LVOqtXobrQPYsXnfPIWL1ow6Joh06HEDRCgkZrJJ+S8CyHL7qslA1dZ2B+IqposDsUyY6QzXLmk11FNKTv6d+d5evP7NPebG/BeAiklRaamylkbF9/wiwnnOUp3v/M+CTPU5R9L2skmk7xTSl9PEuMQXGT7rKcAToeh4oQLV4KYqO8mhn+dWlBKglWezPlIfbFwdY0u8qRArKg20tAN0RoRaHTRGE2CHmKPe3ismTJxhdSJwcqjMFTbXYz981ZYn8Srm3xbheCMD7gx4EnOW3ntCQ1WxdVj0ySrm7SY1RRe+1AYeX8sZV58WbSYI8S7mzUfXBcLfIReTZ9XMUcsj43IAoMPmE5R1HKbc3lL/DOr63PqMg1U8ExH3s//mccmtd2hoDqnFzFojQpbwwEeiBTK0YEUfYP3tJj6Ryc60tbUsMxwCmEak0RXrkjDCClTuu8vzHBT10y43Vtt1XqDA4EoScpLKnJvXPYHydF369lHHE7DURU4Y72nzRpUzMA/gBYgaI3uLPqve8/H1W0YhBiPp3Qt38C/sjQ6T/3LUKAAAAAElFTkSuQmCC);
|
background-size: 100% auto;
|
position: absolute;
|
top: 0;
|
left: 0;
|
z-index: 10;
|
width: 32rpx;
|
height: 32rpx;
|
line-height: 32rpx;
|
text-align: center;
|
display: block;
|
color: #fff;
|
}
|
|
.van-image {
|
// position: relative;
|
display: inline-block;
|
border-radius: 12rpx;
|
height: 140rpx;
|
width: 140rpx;
|
|
image {
|
border-radius: 12rpx;
|
width: 100%;
|
height: 100%;
|
}
|
}
|
}
|
|
.time {
|
text-align: center;
|
height: 36rpx;
|
background-image: linear-gradient(270deg, #ff7300, #ffb717);
|
color: #fff;
|
font-size: 20rpx;
|
line-height: 36rpx;
|
padding-left: 12rpx;
|
border-radius: 12rpx;
|
white-space: nowrap;
|
text-overflow: ellipsis;
|
overflow: hidden;
|
}
|
|
.my {
|
height: 72rpx;
|
display: flex;
|
font-weight: 700;
|
justify-content: center;
|
align-items: center;
|
font-size: 26rpx;
|
color: #ff2b22;
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.everysBuying-container {
|
width: 100%;
|
height: 414rpx;
|
border-radius: 16rpx;
|
background-color: #FFFFFF;
|
margin-bottom: 20rpx;
|
|
.box-bar-content {
|
width: 100%;
|
padding: 0 20rpx;
|
|
.title-text {
|
font-size: 32rpx;
|
font-weight: 500;
|
color: #333333;
|
margin: 20rpx 0;
|
}
|
|
.tips-txt {
|
height: 30rpx;
|
background: linear-gradient(-90deg, #7619EC, #A429F3);
|
border-radius: 15rpx 15rpx 15rpx 0px;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
margin-left: 20rpx;
|
padding: 0 20rpx;
|
}
|
}
|
|
.goodsScroll-container {
|
width: 100%;
|
height: 310rpx;
|
margin-top: 20rpx;
|
|
.scrollgoods-box {
|
width: 100%;
|
height: 100%;
|
|
.scrollList-content {
|
white-space: nowrap;
|
padding-left: 8rpx;
|
|
.goods-items {
|
display: inline-block;
|
width: 220rpx;
|
height: 310rpx;
|
border-radius: 8rpx;
|
overflow: hidden;
|
|
.items-container {
|
width: 100%;
|
height: 100%;
|
|
.image-content {
|
width: 166rpx;
|
height: 166rpx;
|
margin-top: 10rpx;
|
}
|
|
.goodsinfo-content {
|
width: 100%;
|
height: 120rpx;
|
padding: 0 10rpx;
|
|
.goodsName-box {
|
width: 100%;
|
line-height: 34rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #444444;
|
margin-top: 5rpx;
|
}
|
|
.coupons-container {
|
width: 100%;
|
margin-top: 10rpx;
|
|
.couponbac-content {
|
width: 160rpx;
|
height: 30rpx;
|
background: url(../static/images/goods/quanbg.png) no-repeat;
|
background-size: 100% 100%;
|
border-radius: 5rpx;
|
|
.textsTip {
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #FFFFFF;
|
margin-left: 10rpx;
|
white-space: nowrap;
|
}
|
|
.coupons-value {
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FF4242;
|
white-space: nowrap;
|
margin-left: 30rpx;
|
}
|
}
|
}
|
|
.price-info-container {
|
width: 100%;
|
margin-top: 10rpx;
|
|
.nowPrice-content {
|
.rmbicon {
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #FF4242;
|
line-height: 34rpx;
|
}
|
|
.nowprice {
|
font-size: 26rpx;
|
font-weight: bold;
|
color: #FF4242;
|
line-height: 34rpx;
|
}
|
}
|
|
.oldPrice-content {
|
margin-left: 10rpx;
|
|
.oldprice {
|
text-decoration: line-through;
|
line-height: 34rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.looting-container {
|
width: 100%;
|
height: 600rpx;
|
background: linear-gradient(-90deg, #7619EC, #A429F3);
|
padding: 0 22rpx;
|
|
.titlebar-container {
|
width: 100%;
|
|
.iconbar-content {
|
width: 500rpx;
|
height: 53rpx;
|
margin-top: 20rpx;
|
margin-bottom: 10rpx;
|
}
|
|
.title-text {
|
font-size: 32rpx;
|
font-weight: bold;
|
font-style: italic;
|
color: #FFFFFF;
|
margin-bottom: 25rpx;
|
}
|
}
|
|
|
.goodscontents {
|
width: 100%;
|
background: #F7F7F7;
|
|
.scrollgoods-box {
|
width: 100%;
|
height: 360rpx;
|
margin-top: 20rpx;
|
|
.scrollList-content {
|
height: 360rpx;
|
padding-left: 10rpx;
|
white-space: nowrap;
|
|
.goods-items {
|
width: 220rpx;
|
height: 360rpx;
|
margin-right: 10rpx;
|
border-radius: 8rpx;
|
display: inline-block;
|
overflow: hidden;
|
background-color: #FFFFFF;
|
|
.items-container {
|
width: 100%;
|
height: 100%;
|
|
.image-content {
|
width: 220rpx;
|
height: 220rpx;
|
margin-top: 10rpx;
|
}
|
|
.goodsinfo-content {
|
width: 100%;
|
height: 140rpx;
|
padding: 0 10rpx;
|
|
.goodsName-box {
|
width: 100%;
|
line-height: 34rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #444444;
|
margin-top: 5rpx;
|
}
|
|
.coupons-container {
|
width: 100%;
|
margin-top: 10rpx;
|
|
.couponbac-content {
|
width: 100rpx;
|
height: 30rpx;
|
background: url(../static/images/goods/couponbac.png)no-repeat;
|
background-size: 100% 100%;
|
border-radius: 5rpx;
|
|
.coupons-value {
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FF4242;
|
white-space: nowrap;
|
}
|
}
|
}
|
|
.price-info-container {
|
width: 100%;
|
|
.nowPrice-content {
|
.rmbicon {
|
line-height: 34rpx;
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #FF4242;
|
}
|
|
.nowprice {
|
font-size: 28rpx;
|
font-weight: 400;
|
color: #FF4242;
|
}
|
}
|
|
.oldPrice-content {
|
margin-left: 10rpx;
|
|
.oldprice {
|
line-height: 34rpx;
|
text-decoration: line-through;
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.moreGoods-bar {
|
width: 100%;
|
height: 60rpx;
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
}
|
|
.Tiktok-container {
|
width: 100%;
|
height: 475rpx;
|
padding: 0 20rpx;
|
background-color: #FFFFFF;
|
|
.titlebar-container {
|
width: 100%;
|
height: 90rpx;
|
|
.left-content {
|
.titletext {
|
font-size: 32rpx;
|
font-weight: 500;
|
color: #333333;
|
}
|
|
.bubble-box {
|
width: 200rpx;
|
height: 25rpx;
|
margin-left: 5rpx;
|
background: linear-gradient(-90deg, #7619EC, #A429F3);
|
border-radius: 12rpx 12rpx 12rpx 0px;
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #FFFFFF;
|
}
|
}
|
|
.right-arrowContent {
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
|
.goodsTopList {
|
width: 100%;
|
height: 340rpx;
|
|
.scrollgoods-box {
|
width: 100%;
|
height: 340rpx;
|
|
.scrollList-content {
|
height: 360rpx;
|
white-space: nowrap;
|
|
.goods-items {
|
width: 220rpx;
|
height: 340rpx;
|
border-radius: 8rpx;
|
margin-right: 10rpx;
|
overflow: hidden;
|
background-color: #FFFFFF;
|
display: inline-block;
|
|
.items-container {
|
width: 100%;
|
height: 100%;
|
|
.image-content {
|
width: 220rpx;
|
height: 220rpx;
|
position: relative;
|
|
.playback-volume {
|
position: absolute;
|
z-index: 1;
|
top: 14rpx;
|
left: 14rpx;
|
background: rgba(0, 0, 0, 0.5);
|
padding: 5rpx 15rpx;
|
border-radius: 15rpx;
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FFFFFF;
|
|
text {
|
font-size: 28rpx;
|
}
|
}
|
|
.suspend {
|
position: absolute;
|
top: 90;
|
left: 90;
|
width: 40rpx;
|
height: 40rpx;
|
}
|
}
|
|
.goodsinfo-content {
|
width: 100%;
|
height: 120rpx;
|
|
.goodsName-box {
|
width: 100%;
|
line-height: 34rpx;
|
white-space: nowrap;
|
overflow: hidden;
|
text-overflow: ellipsis;
|
font-size: 24rpx;
|
font-weight: 400;
|
color: #444444;
|
margin-top: 5rpx;
|
}
|
|
.coupons-container {
|
width: 100%;
|
margin-top: 10rpx;
|
|
.couponbac-content {
|
width: 100rpx;
|
height: 30rpx;
|
background: url(../static/images/goods/couponbac.png)no-repeat;
|
background-size: 100% 100%;
|
|
.coupons-value {
|
font-size: 20rpx;
|
font-weight: 500;
|
color: #FF4242;
|
white-space: nowrap;
|
}
|
}
|
}
|
|
.price-info-container {
|
width: 100%;
|
|
.nowPrice-content {
|
.rmbicon {
|
line-height: 34rpx;
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #FF4242;
|
}
|
|
.nowprice {
|
font-size: 28rpx;
|
font-weight: 400;
|
color: #FF4242;
|
}
|
}
|
|
.oldPrice-content {
|
margin-left: 10rpx;
|
|
.oldprice {
|
line-height: 34rpx;
|
text-decoration: line-through;
|
font-size: 20rpx;
|
font-weight: 400;
|
color: #999999;
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
}
|
|
.goods-bottom-List {
|
width: 100%;
|
|
.bottomTypebar-container {
|
width: 100%;
|
height: 115rpx;
|
|
.typeList {
|
width: 100%;
|
height: 100%;
|
|
.type-items-container {
|
width: 150rpx;
|
height: 100%;
|
|
.mainTitle {
|
font-size: 30rpx;
|
font-weight: 500;
|
color: #333333;
|
margin-bottom: 5rpx;
|
}
|
|
.subtitle {
|
width: 110rpx;
|
height: 36rpx;
|
background: transparent;
|
border-radius: 18rpx;
|
font-size: 24rpx;
|
font-weight: 500;
|
color: #666666;
|
}
|
}
|
|
.type-container-active {
|
.mainTitle {
|
color: #FE3738;
|
}
|
|
.subtitle {
|
background: #FE3738;
|
color: #FFFFFF;
|
}
|
}
|
}
|
|
.imbibition {
|
width: 100%;
|
height: 115rpx;
|
z-index: 600;
|
position: fixed;
|
background-color: #FFFFFF;
|
}
|
}
|
|
|
.bottomGoods-list-container {
|
width: 100%;
|
padding: 0 20rpx;
|
flex-wrap: wrap;
|
|
.goods-items {
|
margin-bottom: 20rpx;
|
}
|
}
|
}
|
}
|
|
@-webkit-keyframes fadeInOut {
|
0% {
|
opacity: 0;
|
}
|
|
25% {
|
opacity: 0.5;
|
}
|
|
50% {
|
opacity: 1;
|
}
|
|
75% {
|
opacity: 1;
|
}
|
}
|
</style>
|
