747 lines
20 KiB
Vue
747 lines
20 KiB
Vue
<template>
|
|
<view class="content">
|
|
<!-- 导航栏 -->
|
|
<view class="navbar" :class="{active:opacity}">
|
|
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
|
|
<view class="status-bar"></view>
|
|
<view class="navbar_tow flex-between"
|
|
:style="{'height':HeighT.customBar+'px','padding-right':HeighT.custwidth + 'px'}">
|
|
<!-- #endif -->
|
|
<!-- #ifdef APP-PLUS -->
|
|
<view class="status-bar"></view>
|
|
<view class="navbar_tow flex-between">
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view class="navbar_tow flex-between"
|
|
:style="{'height':HeighT.customBar+'px','marginTop':HeighT.heightBar+'px','padding-right':HeighT.custwidth + 'px'}">
|
|
<!-- #endif -->
|
|
<!-- 标题搜索框 -->
|
|
<view class="flex-between">
|
|
<view class="navbar_tow_one flex-start" @click="uindexlist">
|
|
<text>美味抢先点</text>
|
|
<text>西安</text>
|
|
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
|
|
size="16"></u-icon>
|
|
</view>
|
|
<view class="navbar_tow_tow flex-start">
|
|
<input type="text" class="navbar_tow_towinput" v-model="keyword" placeholder="请输入关键字" />
|
|
<view class="navbar_tow_towview">搜索</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 吸顶 -->
|
|
<view v-if="isFixedTop" class="fourcontent flex-between" style="padding: 28rpx 0 28rpx 28rpx">
|
|
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index">
|
|
<text>{{item.name}}</text>
|
|
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
|
|
size="16"></u-icon>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 以上都是导航栏处理 -->
|
|
|
|
<!-- 轮播图 -->
|
|
<swipers :carousel='hometoplist.carousel'></swipers>
|
|
<!-- 广告 -->
|
|
<advertisement></advertisement>
|
|
<!-- 金刚区 -->
|
|
<diamond :district='hometoplist.district'></diamond>
|
|
<!-- 今日上线 -->
|
|
<todaylist :todayList='hometoplist.todayList' :salesList='hometoplist.salesList'></todaylist>
|
|
<!-- 类目 -->
|
|
<view class="fourcontent flex-between">
|
|
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index"
|
|
@click="viewHistory(item)">
|
|
<text>{{item.name}}</text>
|
|
<u-icon v-if="item.isChild" style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
|
|
size="16"></u-icon>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 盒子撑开 -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view v-if="isFixedTop" :style="isFixedTop?`height:${fourcontentHeighT}px`:''"></view>
|
|
<!-- #endif -->
|
|
<!-- #ifdef APP-PLUS -->
|
|
<view v-if="isFixedTop" :style="isFixedTop?`height:${fourcontentHeighT + 22}px`:''"></view>
|
|
<!-- #endif -->
|
|
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
|
|
<view v-if="isFixedTop"></view>
|
|
<!-- #endif -->
|
|
<!-- 产品 -->
|
|
<view class="fivecontent">
|
|
<view class="fivecontent_item" v-for="(item,index) in homelist" :key="index">
|
|
<view class="fivecontent_item_nav flex-start">
|
|
<image src="@/static/avatar.png" mode="aspectFill"></image>
|
|
<view class="fivecontent_item_nav_left">
|
|
<view class="fivecontent_item_nav_lefttop flex-between">
|
|
<view>
|
|
{{item.shopName}}
|
|
</view>
|
|
<view>
|
|
龙首.{{item.distances}}m
|
|
</view>
|
|
</view>
|
|
<view class="flex-start">
|
|
<view class="fivecontent_item_nav_leftlang flex-start" v-for="(s,index1) in 2"
|
|
:key="index1">
|
|
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/hong_h.png"
|
|
mode="aspectFill"></image>
|
|
<text>{{item.shopTag}}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="fivecontent_item_box">
|
|
<view class="fivecontent_item_boxitem flex-between">
|
|
<image src="@/static/avatar.png" mode=""></image>
|
|
<view class="fivecontent_item_boxitemleft flex-colum-start">
|
|
<view class="fivecontent_item_boxitemleftone flex-between">
|
|
<view>全场饮品任选</view>
|
|
<text>已抢15789份</text>
|
|
</view>
|
|
<view class="fivecontent_item_boxitemlefttow flex-start">
|
|
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/hong_h.png"
|
|
mode="aspectFill"></image>
|
|
<text>人气连锁品牌</text>
|
|
</view>
|
|
<view class="indexboxitemleftthere flex-colum-start">
|
|
<view class="indexboxitemleftthereabsolute">
|
|
马上抢
|
|
</view>
|
|
<view class="indexboxitemlefttheretext flex-start">
|
|
<view class="indexboxitemlefttheretextone">
|
|
<text>¥</text>
|
|
<text>1444</text>
|
|
</view>
|
|
<view class="indexboxitemlefttheretexttow">
|
|
¥111
|
|
</view>
|
|
|
|
</view>
|
|
<view class="indexboxitemleftthere_countdown flex-between">
|
|
<text class="indexboxitemleftthere_countdowntext">共省4元</text>
|
|
<view class="indexboxitemleftthere_countdowntexts">
|
|
<uni-countdown :show-day="false" :day="1" :hour="1" :minute="12"
|
|
:second="40" color="#FFFFFF" border-color="#00B26A"
|
|
splitorColor="#FFFFFF" :font-size="8"></uni-countdown>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<u-loadmore height='40' :status="form.status" iconSize='24' fontSize='24' />
|
|
|
|
|
|
|
|
<!-- 弹出层 -->
|
|
<u-popup mode="top" :show="showproductlist" @close="closeproductlist" @open="openproductlist">
|
|
<!-- 导航栏 -->
|
|
<view class="navbar" :class="{active:opacity}">
|
|
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
|
|
<view class="status-bar"></view>
|
|
<view class="navbar_tow flex-between"
|
|
:style="{'height':HeighT.customBar+'px','padding-right':HeighT.custwidth + 'px'}">
|
|
<!-- #endif -->
|
|
<!-- #ifdef APP-PLUS -->
|
|
<view class="status-bar"></view>
|
|
<view class="navbar_tow flex-between">
|
|
<!-- #endif -->
|
|
<!-- #ifdef MP-WEIXIN -->
|
|
<view class="navbar_tow flex-between"
|
|
:style="{'height':HeighT.customBar+'px','marginTop':HeighT.heightBar+'px','padding-right':HeighT.custwidth + 'px'}">
|
|
<!-- #endif -->
|
|
<!-- 标题搜索框 -->
|
|
<view class="flex-between">
|
|
<view class="navbar_tow_one flex-start" @click="uindexlist">
|
|
<text>八点八零</text>
|
|
<text>西安</text>
|
|
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
|
|
size="16"></u-icon>
|
|
</view>
|
|
<view class="navbar_tow_tow flex-start">
|
|
<input type="text" class="navbar_tow_towinput" v-model="keyword"
|
|
placeholder="请输入关键字" />
|
|
<view class="navbar_tow_towview">搜索</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 吸顶 -->
|
|
<view class="fourcontent flex-between" style="padding: 28rpx 0 28rpx 28rpx">
|
|
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu"
|
|
:key="index" @click="viewHistory(item)">
|
|
<text>{{item.name}}</text>
|
|
<u-icon v-if="item.isChild" style="margin-left: 8rpx;" name="arrow-down-fill"
|
|
color="#333333" size="16"></u-icon>
|
|
</view>
|
|
</view>
|
|
<!-- 显示下拉字段 -->
|
|
<view class="sixcontent" v-if="clickhometoplistmenulist.detail">
|
|
<view class="sixcontentitemP flex-colum-start">
|
|
<view class="sixcontentitemP_item"
|
|
:class="index == clickdetailindex ?'sixcontentitemP_itemactive':''"
|
|
v-for="(item,index) in clickhometoplistmenulist.detail" :key="index"
|
|
@click="clickdetail(item,index)">
|
|
{{item.label}}
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="sixcontent" v-if="clickhometoplistmenulist.districts">
|
|
<view class="sixcontentitemP flex-start">
|
|
<view class="sixcontentitemP_itembox flex-colum-start">
|
|
<view class="sixcontentitemP_itemone"
|
|
:class="index == clickdetailindex ?'sixcontentitemP_itemactive':''"
|
|
v-for="(item,index) in clickhometoplistmenulist.districts" :key="index"
|
|
@click="clickdetail(item,index)">
|
|
{{item.name}}
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</u-popup>
|
|
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import swipers from './components/swiper.vue'
|
|
import diamond from './components/diamond.vue'
|
|
import todaylist from './components/todaylist.vue'
|
|
import productlist from './components/productlist.vue'
|
|
import advertisement from './components/advertisement.vue'
|
|
export default {
|
|
components: {
|
|
swipers,
|
|
diamond,
|
|
todaylist,
|
|
productlist,
|
|
advertisement
|
|
},
|
|
data() {
|
|
return {
|
|
isFixedTop: false, //吸顶是否显示
|
|
Topdistance: 3000, //吸顶初始距离
|
|
fourcontentHeighT: 0, //高度
|
|
keyword: '',
|
|
current: 0,
|
|
opacity: false,
|
|
showproductlist: true, //弹成
|
|
clickdetailindex: 0, //默认下拉选项第一个
|
|
hometoplist: { //上面数据
|
|
carousel: [],
|
|
district: []
|
|
},
|
|
homelist: [], //下面数据
|
|
clickhometoplistmenulist: {}, //下拉点击的数据
|
|
form: {
|
|
address: '', //地址
|
|
type: '', //品类
|
|
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
|
distance: '', //附近1KM 1选中 0不选中
|
|
page: 1, //页数
|
|
size: 10, //页容量
|
|
status: 'loadmore'
|
|
}
|
|
};
|
|
},
|
|
|
|
onPageScroll(e) {
|
|
if (e.scrollTop <= 44) { //搜索导航栏
|
|
this.opacity = false
|
|
this.showproductlist = false
|
|
} else {
|
|
this.opacity = true
|
|
}
|
|
if (e.scrollTop >= this.Topdistance) { //类别导航栏
|
|
this.isFixedTop = true
|
|
} else {
|
|
this.isFixedTop = false
|
|
}
|
|
},
|
|
computed: {
|
|
HeighT() { //手机类型的尺寸
|
|
return this.$store.getters.is_BarHeight
|
|
},
|
|
},
|
|
async onLoad() {
|
|
setTimeout(() => {
|
|
this.GetTop()
|
|
}, 1000)
|
|
let res = await this.apix.locationdistrict({
|
|
keywords: '西安市'
|
|
})
|
|
this.clickhometoplistmenulist = res.data[0].districts
|
|
},
|
|
onReachBottom() {
|
|
this.onLoadhome()
|
|
},
|
|
onShow() {
|
|
this.hometop()
|
|
this.onLoadhome()
|
|
},
|
|
methods: {
|
|
closeproductlist() {
|
|
this.showproductlist = false
|
|
// console.log('close');
|
|
},
|
|
openproductlist() {
|
|
// console.log('open');
|
|
},
|
|
uindexlist() {
|
|
uni.pro.navigateTo('index/uindexlist')
|
|
},
|
|
updateCity(data) {
|
|
this.list[data].end_times = 0;
|
|
this.$forceUpdate();
|
|
},
|
|
GetTop() {
|
|
//获取元素距离顶部的距离
|
|
this.$u.getRect('.fourcontent').then(res => {
|
|
this.Topdistance = res.top - this.HeighT.heightBar //滚动距离
|
|
this.fourcontentHeighT = res.height //高度
|
|
})
|
|
|
|
},
|
|
// 首页上面数据
|
|
async hometop() {
|
|
try {
|
|
let res = await this.apix.homehomePageUp()
|
|
this.hometoplist = res.data
|
|
} catch (e) {
|
|
//TODO handle the exception
|
|
}
|
|
},
|
|
// 下面初始数据
|
|
init_fn() {
|
|
this.homelist = []
|
|
this.form.page = 1
|
|
this.form.status = 'loadmore'
|
|
this.onLoadhome()
|
|
},
|
|
async onLoadhome() {
|
|
try {
|
|
let res = await this.apix.home(this.form)
|
|
if (res.data.length == 0) {
|
|
this.form.status = 'nomore'
|
|
return false;
|
|
} else {
|
|
this.form.status = 'loading';
|
|
this.form.page = ++this.form.page;
|
|
setTimeout(() => {
|
|
this.homelist = [...this.homelist, ...res.data];
|
|
if (res.data.length == 10) {
|
|
this.form.status = 'loading';
|
|
} else {
|
|
this.form.status = 'nomore';
|
|
}
|
|
}, 500)
|
|
}
|
|
} catch (e) {
|
|
//TODO handle the exception
|
|
}
|
|
},
|
|
// 点击元素到指定位置
|
|
async viewHistory(item) {
|
|
if (item.dictName == 'allCity') {
|
|
let res = await this.apix.locationdistrict({
|
|
keywords: '西安市'
|
|
})
|
|
this.clickhometoplistmenulist = res.data[0]
|
|
} else {
|
|
this.clickhometoplistmenulist = item
|
|
}
|
|
uni.pageScrollTo({
|
|
scrollTop: this.Topdistance + 1,
|
|
duration: 300
|
|
});
|
|
if (item.isChild) {
|
|
this.showproductlist = true
|
|
} else {
|
|
|
|
}
|
|
},
|
|
// 选择元素的指定选项
|
|
clickdetail(item, index) {
|
|
this.clickdetailindex = index
|
|
this.showproductlist = false
|
|
},
|
|
}
|
|
|
|
};
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
page {
|
|
background: #F9F9F9;
|
|
}
|
|
|
|
.content {
|
|
position: -webkit-sticky;
|
|
position: sticky;
|
|
top: 0;
|
|
|
|
.active {
|
|
background: rgba(249, 249, 249, 1);
|
|
}
|
|
|
|
.status-bar {
|
|
// #ifdef APP-PLUS
|
|
height: calc(var(--status-bar-height) / 2);
|
|
// #endif
|
|
// #ifdef MP-WEIXIN
|
|
height: var(--status-bar-height);
|
|
// #endif
|
|
}
|
|
|
|
// #ifdef APP-PLUS
|
|
.statusbarmargin {
|
|
margin-top: var(--status-bar-height);
|
|
}
|
|
|
|
// #endif
|
|
.navbar {
|
|
position: fixed;
|
|
top: 0;
|
|
width: 100%;
|
|
z-index: 99;
|
|
|
|
.navbar_tow {
|
|
width: 100%;
|
|
position: relative;
|
|
font-size: 36rpx;
|
|
|
|
.flex-between {
|
|
// #ifdef APP-PLUS || H5
|
|
margin: 28rpx;
|
|
// #endif
|
|
// #ifdef MP-WEIXIN
|
|
margin-left: 28rpx;
|
|
// #endif
|
|
width: 100%;
|
|
flex-wrap: nowrap;
|
|
height: 100%;
|
|
line-height: 100%;
|
|
|
|
.navbar_tow_one {
|
|
height: 100%;
|
|
line-height: 100%;
|
|
|
|
text:nth-child(1) {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
text:nth-child(2) {
|
|
margin-left: 16rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.navbar_tow_tow {
|
|
position: relative;
|
|
height: 100%;
|
|
line-height: 100%;
|
|
flex: 1;
|
|
margin-left: 10rpx;
|
|
|
|
.navbar_tow_towview {
|
|
position: absolute;
|
|
right: 4rpx;
|
|
top: 50%;
|
|
transform: translate(0, -50%);
|
|
text-align: center;
|
|
background: #FEE06A;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
width: 116rpx;
|
|
height: 56rpx;
|
|
line-height: 56rpx;
|
|
border-radius: 34rpx 34rpx 34rpx 34rpx;
|
|
}
|
|
|
|
.navbar_tow_towinput {
|
|
padding-left: 32rpx;
|
|
padding-right: 116rpx;
|
|
height: 100%;
|
|
flex: auto;
|
|
background: #FFFFFF;
|
|
border-radius: 34rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 28rpx;
|
|
color: #999999;
|
|
overflow: hidden; //超出的文本隐藏
|
|
text-overflow: ellipsis; //溢出用省略号显示
|
|
white-space: nowrap; //溢出不换行
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.fourcontent {
|
|
padding: 32rpx 28rpx 0 28rpx;
|
|
overflow-x: auto;
|
|
flex-wrap: nowrap;
|
|
|
|
.fourcontent_item {
|
|
flex-wrap: nowrap;
|
|
margin-left: 22rpx;
|
|
padding: 4rpx 14rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
|
|
|
text {
|
|
width: max-content;
|
|
}
|
|
}
|
|
|
|
.fourcontent_item:nth-child(1) {
|
|
margin-left: 0;
|
|
}
|
|
}
|
|
|
|
.sixcontent {
|
|
.sixcontentitemP {
|
|
padding: 0 32rpx 28rpx 32rpx;
|
|
max-height: 600rpx;
|
|
overflow: auto;
|
|
|
|
.sixcontentitemP_itembox {
|
|
.sixcontentitemP_itemone {
|
|
flex: 1;
|
|
margin-top: 16rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #666666;
|
|
}
|
|
|
|
.sixcontentitemP_itemone:nth-child(1) {
|
|
margin-top: 0rpx;
|
|
}
|
|
}
|
|
|
|
.sixcontentitemP_item:nth-child(1) {
|
|
margin-top: 0rpx;
|
|
}
|
|
|
|
.sixcontentitemP_item {
|
|
margin-top: 16rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #666666;
|
|
}
|
|
|
|
.sixcontentitemP_itemactive {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 24rpx;
|
|
color: #666666;
|
|
}
|
|
}
|
|
}
|
|
|
|
.fivecontent {
|
|
padding: 0 28rpx;
|
|
|
|
.fivecontent_item {
|
|
margin-top: 32rpx;
|
|
padding: 24rpx 32rpx;
|
|
width: 100%;
|
|
background: #FFFFFF;
|
|
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
|
|
|
.fivecontent_item_nav {
|
|
image {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
border-radius: 8rpx;
|
|
}
|
|
|
|
.fivecontent_item_nav_left {
|
|
flex: auto;
|
|
margin-left: 12rpx;
|
|
|
|
.fivecontent_item_nav_lefttop {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #666666;
|
|
}
|
|
|
|
.fivecontent_item_nav_leftlang {
|
|
margin-top: 8rpx;
|
|
width: max-content;
|
|
padding: 4rpx 10rpx;
|
|
background: #FFF9E1;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
|
|
text {
|
|
margin-left: 6rpx;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 16rpx;
|
|
color: #F9A511;
|
|
}
|
|
|
|
image {
|
|
width: 10.82rpx;
|
|
height: 14.06rpx;
|
|
}
|
|
}
|
|
|
|
.fivecontent_item_nav_leftlang:nth-child(2) {
|
|
margin-left: 12rpx;
|
|
background: #FEE9DF;
|
|
}
|
|
}
|
|
}
|
|
|
|
.fivecontent_item_box {
|
|
margin-top: 20rpx;
|
|
border-top: 2rpx solid #E5E5E5;
|
|
padding-top: 14rpx;
|
|
|
|
.fivecontent_item_boxitem {
|
|
image {
|
|
width: 192rpx;
|
|
height: 192rpx;
|
|
border-radius: 12rpx;
|
|
}
|
|
|
|
.fivecontent_item_boxitemleft {
|
|
margin-left: 24rpx;
|
|
flex: auto;
|
|
|
|
.fivecontent_item_boxitemleftone {
|
|
width: 100%;
|
|
|
|
text {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
}
|
|
|
|
view {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.fivecontent_item_boxitemlefttow {
|
|
margin-top: 8rpx;
|
|
width: max-content;
|
|
padding: 4rpx 10rpx;
|
|
background: #FFF9E1;
|
|
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
|
|
|
text {
|
|
margin-left: 6rpx;
|
|
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 16rpx;
|
|
color: #F9A511;
|
|
}
|
|
|
|
image {
|
|
width: 10.82rpx;
|
|
height: 14.06rpx;
|
|
}
|
|
}
|
|
|
|
.indexboxitemleftthere {
|
|
position: relative;
|
|
margin-top: 30rpx;
|
|
padding-left: 16rpx;
|
|
width: 100%;
|
|
height: 88rpx;
|
|
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/qinggou.png) no-repeat;
|
|
background-size: 100% 100%;
|
|
|
|
.indexboxitemleftthereabsolute {
|
|
position: absolute;
|
|
top: 14rpx;
|
|
right: 12rpx;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: bold;
|
|
font-size: 24rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
|
|
.indexboxitemlefttheretext {
|
|
.indexboxitemlefttheretextone {
|
|
text {
|
|
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
|
font-weight: normal;
|
|
color: #FF5053;
|
|
}
|
|
|
|
text:nth-child(2) {
|
|
font-weight: bold;
|
|
font-size: 34rpx;
|
|
}
|
|
|
|
text:nth-child(1) {
|
|
font-size: 24rpx;
|
|
}
|
|
}
|
|
|
|
.indexboxitemlefttheretexttow {
|
|
margin-left: 12rpx;
|
|
font-size: 20rpx;
|
|
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
|
font-weight: normal;
|
|
color: #999999;
|
|
text-decoration: line-through;
|
|
}
|
|
}
|
|
|
|
.indexboxitemleftthere_countdown {
|
|
width: 100%;
|
|
|
|
.indexboxitemleftthere_countdowntext {
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
font-weight: 400;
|
|
font-size: 24rpx;
|
|
color: #999999;
|
|
}
|
|
|
|
.indexboxitemleftthere_countdowntexts {
|
|
font-family: Roboto, Roboto;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
margin-left: 16rpx;
|
|
font-size: 22rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
</style> |