You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
826 lines
19 KiB
826 lines
19 KiB
<template>
|
|
<view class="content">
|
|
<view class="top-box">
|
|
<!-- 搜索 -->
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/search.png" class="search-img" @click="gotoPath('/subPackages/search/search')"></image>
|
|
|
|
<swiper class="top-banner" :circular="true" :interval="6000" :current="current" @change="swiperChange"
|
|
:duration="800" :indicator-dots="false" :autoplay="true" v-if="topBanner">
|
|
<swiper-item v-for="(item, index) in topBanner" :key="index" @click.stop="gotoUrlNew(item,index)">
|
|
<image class="top-banner" :src="showImg(item.head_img)" mode="aspectFill"></image>
|
|
</swiper-item>
|
|
</swiper>
|
|
|
|
<view class="swiper-num">
|
|
{{current + 1}}/{{topBanner.length}}
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 资讯 -->
|
|
<view class="notice-box">
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/noticeImgs.png" class="noticeImg"></image>
|
|
同里古镇今日开园
|
|
|
|
<view class="notice-top flex-between">
|
|
<view style="display: flex;align-items: center;">
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/horns.png" mode=""></image>
|
|
<view class="notice-text text-overflow">{{notice}}</view>
|
|
</view>
|
|
<view class="notice-more" @click="gotoPathMd({path: '/subPackages/notice/noticeList', text: '首页资讯'}, '1')">
|
|
更多
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcon.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="notice-bottom flex-between" v-if="Object.keys(homeUi).length > 0">
|
|
<view :style="{backgroundImage: 'url('+showImg(homeUi['mpyd'])+')'}" @click="gotoPathMd({path: '/subPackages/ticketBooking/ticketBooking', text: '门票预订'}, '1')">
|
|
<view class="title">门票预订</view>
|
|
<view class="subtitle">便民快捷购票入口</view>
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcons1.png" mode=""></image>
|
|
</view>
|
|
<view :style="{backgroundImage: 'url('+showImg(homeUi['dtdl'])+')'}" @click="gotoMap();qdTracker('navButtonClick', {buttonName: '导览', buttonSort: '1'})">
|
|
<view class="title">地图导览</view>
|
|
<view class="subtitle">随时随地发现新旅程</view>
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcons.png" mode=""></image>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 金刚区 -->
|
|
<view class="nav-box" v-if="Object.keys(homeUi).length > 0">
|
|
<view class="nav-item" v-for="(item,index) in navList" :key="index" @click="gotoPathMd(item, index)">
|
|
<image :src="showImg(homeUi[item.img])" mode="" class="nav-img"></image>
|
|
<view>{{item.text}}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 景点展览 -->
|
|
<view v-if="scenicList && scenicList.length > 0">
|
|
<view class="title-box flex-between">
|
|
景点展览
|
|
<view @click="gotoPath('/subPackages/leyou/index');qdTracker('homepageAttractionClick', {buttonName: '景点展览', buttonSort: '1'})">更多<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcon.png" mode=""></image></view>
|
|
</view>
|
|
<view class="scenic-box">
|
|
<view v-for="(item,index) in scenicList" :key="index" @click="gotoScenic(item)">
|
|
<image :src="showImg(item.exhibition_image)" mode="aspectFill" class="scenic-item"></image>
|
|
<view class="scenic-title text-overflow">{{item.title}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 精彩推荐 -->
|
|
<view v-if="eventsList && eventsList.length > 0">
|
|
<view class="title-box flex-between">
|
|
精彩推荐
|
|
<view @click="gotoPath('/subPackages/eventCalendar/eventCalendar');qdTracker('homepageRecommendClick', {buttonName: '精彩推荐', buttonSort: '1'})">更多<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcon.png" mode=""></image></view>
|
|
</view>
|
|
<view class="line-box">
|
|
<view v-for="(item,index) in eventsList" :key="index" class="line-item" @click="goLineDetail(item)">
|
|
<image :src="showImg(item.image)" mode="aspectFill" class="line-img"></image>
|
|
|
|
<!-- <view class="line-content">
|
|
<view class="line-title text-overflow">{{item.name}}</view>
|
|
<view class="line-subtitle text-overflow">{{item.points.length}}个景点</view>
|
|
</view> -->
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 盐都美食 -->
|
|
<!-- <view v-if="foodList && foodList.length > 0">
|
|
<view class="title-box flex-between">
|
|
<image :src="showImg(homeUi.ydms)" mode=""></image>
|
|
<view @click="gotoPath('/subPackages/food/foodList')">更多<image src="https://static.ticket.sz-trip.com/tongli/images/index/rightIcon.png" mode=""></image></view>
|
|
</view>
|
|
<view class="food-box">
|
|
<view v-for="(item,index) in foodList" :key="index" class="food-item" :style="{backgroundImage: 'url('+showImg(item.goods.image)+')',backgroundSize: 'cover'}" @click="gotoFood(item.goods)">
|
|
<view class="recommend" v-if="item.goods.image_tag">{{item.goods.image_tag}}</view>
|
|
<view class="food-content">
|
|
<view class="food-price">{{item.goods.money / 100}}</view>
|
|
<view class="text-overflow">{{item.goods.title}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<!-- 同里新鲜事 -->
|
|
<view>
|
|
<view class="title-box flex-between">
|
|
同里新鲜事
|
|
</view>
|
|
|
|
<view class="strategy-box">
|
|
<view v-for="(num,nums) in 2" :key="nums">
|
|
<view v-for="(item,index) in strategyList" :key="index" class="strategy-item" v-if="index % 2 === nums" @click="gotoPath('/subPackages/novelty/detail?id='+item.id)">
|
|
<image class="strategy-image" :src="showImg(item.image)" mode="widthFix"></image>
|
|
<view class="strategy-content">
|
|
<view class="strategy-title">{{item.title}}</view>
|
|
<view class="strategy-subtitle">同里旅游</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
<view class="strategy-more" @click="strategyMore();qdTracker('homepageNewsClick', {buttonName: '同里新鲜事', buttonSort: '1'})" v-show="showMore">查看更多</view>
|
|
</view>
|
|
|
|
<footer>
|
|
咨询电话:0512-63311140<br>工作时间:周一至周五8:15-17:15（17：00清园）
|
|
</footer>
|
|
|
|
<!-- 领券中心 -->
|
|
<image src="https://static.ticket.sz-trip.com/tongli/images/index/getCoupons.png" @click="gotoPathMd({path: '/subPackages/user/getCoupon', text: '领券中心'}, '1')" class="couponImg"></image>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
topBanner: [],
|
|
current: 0,
|
|
navList: [
|
|
{
|
|
img: 'syyj',
|
|
text: '近期活动',
|
|
path: '/subPackages/eventCalendar/eventCalendar'
|
|
},
|
|
{
|
|
img: 'sxly',
|
|
text: '美食推荐',
|
|
path: '/subPackages/food/foodList'
|
|
},
|
|
{
|
|
img: 'xjsg',
|
|
text: '酒店民宿',
|
|
path: '/subPackages/hotelHomestay/hotelHomestay'
|
|
},
|
|
{
|
|
img: 'fyty',
|
|
text: '特色体验',
|
|
path: '/subPackages/line/lineList'
|
|
},
|
|
{
|
|
img: 'ssfw',
|
|
text: '水乡特产',
|
|
path: '/subPackages/techan/techanList'
|
|
},
|
|
{
|
|
img: 'yzzn',
|
|
text: '游踪指南',
|
|
path: '/subPackages/novelty/index'
|
|
},
|
|
{
|
|
img: 'shtl',
|
|
text: '数绘同里',
|
|
path: '/subPackages/webPage/webPage?url='+ encodeURIComponent('https://xnlv.tongli.net/TongliPanoTours/#/mobile/pano')
|
|
},
|
|
{
|
|
img: 'lfys',
|
|
text: '找车位',
|
|
// path: '/subPackages/webPage/webPage?url='+ encodeURIComponent('https://yandumap.sz-trip.com/')
|
|
}
|
|
],
|
|
scenicList: [],
|
|
homeUi: {},
|
|
month: 0,
|
|
day: 0,
|
|
eventsList: [],
|
|
foodList: [],
|
|
strategyList: [],
|
|
showMore: true,
|
|
notice: '',
|
|
}
|
|
},
|
|
onShow() {
|
|
uni.setStorageSync('isFlag', true)
|
|
},
|
|
onReady() {
|
|
// 获取经纬度
|
|
if(!uni.getStorageSync('location')) {
|
|
this.getLocation()
|
|
}
|
|
|
|
this.getTopBanner()
|
|
this.getScenicByTag()
|
|
this.getHomeUi()
|
|
this.getNowDate()
|
|
this.getEventsList()
|
|
this.getFoodList()
|
|
this.getArticleByType()
|
|
this.getLatest()
|
|
},
|
|
// 导航栏点击事件
|
|
onTabItemTap() {
|
|
this.qdTracker('navButtonClick', {buttonName: '首页', buttonSort: '1'})
|
|
},
|
|
methods: {
|
|
// 金刚区跳转 功能埋点
|
|
gotoPathMd(item,index) {
|
|
if(item.text == '找车位') {
|
|
uni.showToast({
|
|
title: '该功能暂未开放',
|
|
icon: 'none',
|
|
duration: 2000
|
|
})
|
|
}
|
|
this.qdTracker('homepageMainButtonClick', {buttonName: item.text, buttonSort: index})
|
|
this.gotoPath(item.path)
|
|
},
|
|
// 去地图导览
|
|
gotoMap() {
|
|
// 必须登录
|
|
let userInfo = (uni.getStorageSync('userInfo') && JSON.parse(uni.getStorageSync('userInfo'))) || this.$store.state.user.userInfo || {}
|
|
if(userInfo.token) {
|
|
this.gotoPath('plugin://guide/index')
|
|
}else {
|
|
this.$store.commit('changeLoginPath')
|
|
}
|
|
},
|
|
//轮播图左右滑动
|
|
swiperChange(e) {
|
|
this.current = e.detail.current;
|
|
},
|
|
// 去活动详情
|
|
goLineDetail(item) {
|
|
this.goOtherDetail(item)
|
|
if(!item.link_type) {
|
|
uni.navigateTo({
|
|
url:'/subPackages/eventCalendar/detail?id='+item.id
|
|
})
|
|
}
|
|
},
|
|
// 公告
|
|
getLatest() {
|
|
this.Post({},'/api/anncmnt/getLatest').then(res => {
|
|
this.notice = res.data.title
|
|
})
|
|
},
|
|
// 顶部banner
|
|
getTopBanner() {
|
|
this.Post({
|
|
type_id: 3,
|
|
position: 6
|
|
},'/api/adv/getAdv').then(res => {
|
|
this.topBanner = res.data;
|
|
})
|
|
},
|
|
// 2是各种详情页，3是列表专题页面，4是小程序
|
|
gotoUrlNew(item, index) {
|
|
this.qdTracker('homepageBannerClick', {buttonName: '首页banner点击', buttonSort: index})
|
|
let url = '';
|
|
switch (item.jump_type) {
|
|
case 0:
|
|
break;
|
|
case 2:
|
|
uni.navigateTo({
|
|
url: item.tdata
|
|
});
|
|
break;
|
|
case 3:
|
|
uni.navigateTo({
|
|
url: '/subPackages/webPage/webPage?url=' + item.tdata
|
|
});
|
|
break;
|
|
case 4:
|
|
uni.navigateToMiniProgram({
|
|
appId: item.tdata.appid, // 此为appid
|
|
path: item.tdata.page, // 此为首页路径
|
|
envVersion: 'release',
|
|
success: res => {
|
|
// 打开成功
|
|
console.log('打开成功', res);
|
|
},
|
|
fail: err => {
|
|
console.log(err);
|
|
}
|
|
});
|
|
break;
|
|
default:
|
|
break;
|
|
}
|
|
},
|
|
// 景点详情
|
|
gotoScenic(item) {
|
|
this.goOtherDetail(item)
|
|
if(!item.link_type) {
|
|
uni.navigateTo({
|
|
url:'/subPackages/leyou/detail?id='+item.id
|
|
})
|
|
}
|
|
},
|
|
// 美食详情
|
|
gotoFood(item) {
|
|
this.goOtherDetail(item)
|
|
if(!item.link_type) {
|
|
uni.navigateTo({
|
|
url: '/subPackages/food/foodDetail?id=' + item.id
|
|
});
|
|
}
|
|
},
|
|
// 游记攻略、线路详情
|
|
goCalendarDetail(item,type) {
|
|
this.Post({id: item.id},'/api/article/getArticleById')
|
|
this.goOtherDetail(item)
|
|
if(!item.link_type) {
|
|
if(type) {
|
|
// 线路
|
|
uni.navigateTo({
|
|
url:'/subPackages/line/detail?id='+item.id
|
|
})
|
|
}else {
|
|
// 游记攻略
|
|
uni.navigateTo({
|
|
url:'/subPackages/travelGuide/detail?id='+item.id
|
|
})
|
|
}
|
|
}
|
|
},
|
|
// 景点推荐
|
|
getScenicByTag() {
|
|
this.Post({
|
|
scenic_type_id: 12,
|
|
offset: 0,
|
|
limit: 5
|
|
},'/api/scenic/getScenicByType').then(res => {
|
|
this.scenicList = res.data
|
|
})
|
|
},
|
|
// 首页UI
|
|
getHomeUi() {
|
|
this.Post({
|
|
type_id: 1
|
|
},'/api/adv/get_home_ui').then(res => {
|
|
res.data.content.map(item => {
|
|
this.homeUi[item.id] = item.image
|
|
})
|
|
})
|
|
},
|
|
getNowDate() {
|
|
let now = new Date();
|
|
this.month = now.getMonth() + 1;
|
|
this.day = now.getDate();
|
|
},
|
|
// 线路推荐
|
|
getEventsList() {
|
|
this.Post({
|
|
date: '',
|
|
offset: 0,
|
|
limit: 5,
|
|
type_id: '',
|
|
title: ''
|
|
},'/api/activity/getActivityCalendar').then(res => {
|
|
this.eventsList = res.data
|
|
})
|
|
},
|
|
// 盐都美食
|
|
getFoodList() {
|
|
this.Post({
|
|
offset: 0,
|
|
limit: 3,
|
|
tag_id: 56
|
|
},'/api/tag/getGoodsByTagId').then(res => {
|
|
this.foodList = res.data;
|
|
})
|
|
},
|
|
// 游记攻略
|
|
getArticleByType() {
|
|
this.Post({
|
|
type_id: 41,
|
|
offset: this.strategyList.length,
|
|
limit: 4
|
|
},'/api/Article/getArticleByType').then(res => {
|
|
this.strategyList = [...this.strategyList, ...res.data]
|
|
|
|
if(res.data.length < 4) this.showMore = false
|
|
})
|
|
},
|
|
// 游记攻略查看更多
|
|
strategyMore() {
|
|
this.getArticleByType()
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.content {
|
|
background: #f6f6f6;
|
|
min-height: 100vh;
|
|
overflow-x: hidden;
|
|
position: relative;
|
|
padding-bottom: 100rpx;
|
|
}
|
|
|
|
.top-box {
|
|
position: relative;
|
|
|
|
.search-img {
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
position: absolute;
|
|
top: 98.67rpx;
|
|
left: 28rpx;
|
|
z-index: 2;
|
|
}
|
|
|
|
.top-banner {
|
|
width: 750rpx;
|
|
height: 666.67rpx;
|
|
}
|
|
|
|
.swiper-num {
|
|
position: absolute;
|
|
bottom: 167rpx;
|
|
right: 26.67rpx;
|
|
width: 67rpx;
|
|
line-height: 45rpx;
|
|
background: rgba(22, 22, 22, .4);
|
|
border-radius: 23rpx;
|
|
text-align: center;
|
|
z-index: 2;
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
|
|
.notice-box {
|
|
width: 697rpx;
|
|
height: 440rpx;
|
|
background:linear-gradient(180deg,#f7f3ed 0%,#f8f5f1 100%);
|
|
border-radius: 30rpx;
|
|
position: relative;
|
|
margin: -140rpx auto 0;
|
|
padding: 22rpx 27rpx 0;
|
|
font-weight: bold;
|
|
font-size: 40rpx;
|
|
color: #000000;
|
|
|
|
.noticeImg {
|
|
width: 265rpx;
|
|
height: 130rpx;
|
|
position: absolute;
|
|
top: -19rpx;
|
|
right: 0;
|
|
}
|
|
|
|
.notice-top {
|
|
font-weight: 500;
|
|
font-size: 25rpx;
|
|
color:#100e0e;
|
|
margin-top: 25rpx;
|
|
position: relative;
|
|
|
|
image {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
margin-right: 10rpx;
|
|
}
|
|
|
|
.notice-text {
|
|
width: 423rpx;
|
|
font-weight: 500;
|
|
font-size: 25rpx;
|
|
color:#100e0e;
|
|
}
|
|
|
|
.notice-more {
|
|
width: 92rpx;
|
|
line-height: 27rpx;
|
|
text-align: right;
|
|
|
|
image {
|
|
width: 18rpx;
|
|
height: 18rpx;
|
|
margin-left: 5rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.notice-bottom {
|
|
margin-top: 33rpx;
|
|
|
|
&>view {
|
|
width: 369rpx;
|
|
height: 268rpx;
|
|
background-size: 100% 100%;
|
|
padding: 32rpx 0 0 29rpx;
|
|
|
|
.title {
|
|
color: #100e0e;
|
|
font-size: 30rpx;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.subtitle {
|
|
color: #100e0e;
|
|
font-size: 24rpx;
|
|
margin-top: 3rpx;
|
|
font-weight: 500;
|
|
}
|
|
|
|
image {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
}
|
|
}
|
|
|
|
&>view:first-child {
|
|
width: 245rpx;
|
|
|
|
.title {
|
|
color: #ffffff;
|
|
}
|
|
|
|
.subtitle {
|
|
color: #cccccc;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.nav-box {
|
|
margin-top: 39rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.nav-item {
|
|
width: 25%;
|
|
text-align: center;
|
|
font-weight: 400;
|
|
font-size: 25rpx;
|
|
color: #111111;
|
|
|
|
.nav-img {
|
|
width: 90rpx;
|
|
height: 90rpx;
|
|
margin-bottom: 1rpx;
|
|
}
|
|
}
|
|
.nav-item:nth-child(n+5) {
|
|
margin-top: 40rpx;
|
|
}
|
|
}
|
|
|
|
.scenic-box {
|
|
margin: 0 auto;
|
|
width: 100%;
|
|
padding-left: 26rpx;
|
|
overflow-x: auto;
|
|
display: flex;
|
|
|
|
.scenic-item {
|
|
width: 318rpx;
|
|
height: 318rpx;
|
|
border-radius: 20rpx;
|
|
margin-right: 20rpx;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.scenic-title {
|
|
padding: 0 4rpx;
|
|
color: #100e0e;
|
|
font-size: 28rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
.scenic-box::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.title-box {
|
|
margin: 55rpx 0 24rpx;
|
|
padding: 0 26rpx 0 42rpx;
|
|
font-weight: bold;
|
|
color: #100e0e;
|
|
font-size: 36rpx;
|
|
|
|
view {
|
|
color: #100e0e;
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
image {
|
|
width: 18rpx;
|
|
height: 18rpx;
|
|
margin-left: 5rpx;
|
|
}
|
|
}
|
|
|
|
.line-box {
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
display: flex;
|
|
padding-left: 26rpx;
|
|
}
|
|
.line-box::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
.line-item {
|
|
width: 658rpx;
|
|
height: 294rpx;
|
|
background: #FFFFFF;
|
|
border-radius: 20rpx;
|
|
margin-right: 20rpx;
|
|
flex-shrink: 0;
|
|
|
|
.line-img {
|
|
width: 100%;
|
|
height: 100%;
|
|
border-radius: 20rpx;
|
|
}
|
|
|
|
.line-content {
|
|
width: 368rpx;
|
|
height: 227rpx;
|
|
margin-left: 23rpx;
|
|
padding: 16rpx 0 18rpx;
|
|
|
|
.line-title {
|
|
width: 368rpx;
|
|
font-family: PingFang;
|
|
font-weight: bold;
|
|
font-size: 32rpx;
|
|
color: #000000;
|
|
}
|
|
|
|
.line-subtitle {
|
|
width: 368rpx;
|
|
font-weight: 500;
|
|
font-size: 25rpx;
|
|
color: #999999;
|
|
margin-top: 15px;
|
|
}
|
|
|
|
.line-tag {
|
|
line-height: 40rpx;
|
|
border: 1rpx solid #69AF78;
|
|
padding: 0 8rpx;
|
|
margin-right: 13rpx;
|
|
border-radius: 5rpx;
|
|
font-weight: 500;
|
|
font-size: 23rpx;
|
|
color: #71B580;
|
|
}
|
|
|
|
.line-price {
|
|
font-weight: 500;
|
|
font-size: 32rpx;
|
|
color: #EF2323;
|
|
}
|
|
.line-price::before {
|
|
font-size: 24rpx;
|
|
content: '￥';
|
|
}
|
|
}
|
|
}
|
|
|
|
.food-box {
|
|
padding-left: 26.67rpx;
|
|
overflow-x: auto;
|
|
display: flex;
|
|
|
|
.food-item {
|
|
width: 320rpx;
|
|
height: 293rpx;
|
|
border-radius: 20rpx;
|
|
opacity: 0.8;
|
|
margin-right: 20rpx;
|
|
position: relative;
|
|
flex-shrink: 0;
|
|
overflow: hidden;
|
|
|
|
.recommend {
|
|
position: absolute;
|
|
top: 13.33rpx;
|
|
line-height: 47rpx;
|
|
text-align: center;
|
|
width: 153rpx;
|
|
font-weight: 500;
|
|
font-size: 27rpx;
|
|
color: #FFFFFF;
|
|
background: #71B580;
|
|
border-radius: 0rpx 20rpx 0rpx 20rpx;
|
|
overflow-x: auto;
|
|
white-space: nowrap;
|
|
}
|
|
.recommend::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.food-content {
|
|
background: linear-gradient(to top, rgba(0,0,0,1),rgba(0,0,0,.5),rgba(0,0,0,.01));
|
|
position: absolute;
|
|
bottom: 0;
|
|
width: 100%;
|
|
height: 223rpx;
|
|
padding: 100rpx 0 0 20rpx;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
color: #FFFFFF;
|
|
|
|
.food-price {
|
|
font-size: 33rpx;
|
|
}
|
|
.food-price::before {
|
|
font-size: 24rpx;
|
|
content: '￥';
|
|
}
|
|
|
|
.text-overflow {
|
|
width: 280rpx;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.food-box::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.strategy-box {
|
|
padding: 0 26.67rpx;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.strategy-item {
|
|
width: 335rpx;
|
|
margin-bottom: 35rpx;
|
|
position: relative;
|
|
|
|
.title-tag {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 153rpx;
|
|
line-height: 47rpx;
|
|
background: #71B580;
|
|
border-radius: 20rpx 0rpx 20rpx 0rpx;
|
|
text-align: center;
|
|
font-weight: 500;
|
|
font-size: 27rpx;
|
|
color: #FFFFFF;
|
|
overflow-x: auto;
|
|
white-space: nowrap;
|
|
}
|
|
.title-tag::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.strategy-image {
|
|
width: 335rpx;
|
|
display: block;
|
|
border-radius: 13rpx;
|
|
}
|
|
|
|
.strategy-content {
|
|
margin-top: 8rpx;
|
|
|
|
.strategy-title {
|
|
font-weight: bold;
|
|
font-size: 29rpx;
|
|
color: #000000;
|
|
}
|
|
|
|
.strategy-subtitle {
|
|
font-weight: 500;
|
|
font-size: 24rpx;
|
|
color: #6b6262;
|
|
margin-top: 10rpx;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.strategy-more {
|
|
width: 200rpx;
|
|
line-height: 53rpx;
|
|
border-radius: 33rpx;
|
|
border: 1rpx solid #525251;
|
|
margin: 44rpx auto 0;
|
|
text-align: center;
|
|
font-weight: 500;
|
|
font-size: 27rpx;
|
|
color: #525251;
|
|
}
|
|
|
|
.couponImg {
|
|
position: fixed;
|
|
right: 27rpx;
|
|
bottom: 38rpx;
|
|
width: 94rpx;
|
|
height: 105.33rpx;
|
|
z-index: 100;
|
|
}
|
|
|
|
footer {
|
|
font-weight: 600;
|
|
font-size: 23rpx;
|
|
color: #333333;
|
|
line-height: 40rpx;
|
|
text-align: center;
|
|
margin-top: 72rpx;
|
|
}
|
|
</style>
|
|
|