@ -0,0 +1,156 @@ |
|||||
|
<template> |
||||
|
<view class=""> |
||||
|
<view class="box"> |
||||
|
<view class="left" ref="left"> |
||||
|
<view class="item" v-for="(item,i) in leftList" :key="i" @click="goDetail(item)"> |
||||
|
<image class="image" :src="item.headimg" mode="widthFix"></image> |
||||
|
<view class="content"> |
||||
|
<view class="title">{{item.title}}</view> |
||||
|
<view class="flex-between"> |
||||
|
<view class="text-overflow" style="display: flex;align-items: center;width: 200rpx;"> |
||||
|
<image :src="showImg(item.author_img)" mode="" class="author-img"></image> |
||||
|
{{item.author}} |
||||
|
</view> |
||||
|
<view style="display: flex;"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/eye.png" mode="" class="eye-img"></image> |
||||
|
{{item.view}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="right" ref="right"> |
||||
|
<view class="item" v-for="(item,i) in rightList" :key="i" @click="goDetail(item)"> |
||||
|
<image class="image" :src="item.headimg" mode="widthFix"></image> |
||||
|
<view class="content"> |
||||
|
<view class="title">{{item.title}}</view> |
||||
|
<view class="flex-between"> |
||||
|
<view class="text-overflow" style="display: flex;align-items: center;width: 200rpx;"> |
||||
|
<image :src="showImg(item.author_img)" mode="" class="author-img"></image> |
||||
|
{{item.author}} |
||||
|
</view> |
||||
|
<view style="display: flex;"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/eye.png" mode="" class="eye-img"></image> |
||||
|
{{item.view}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
props: ['waterList'], |
||||
|
data() { |
||||
|
return { |
||||
|
leftList: [], //左边列图片 |
||||
|
rightList: [], //右边列图片 |
||||
|
leftHeight: 0, //左边列高度 |
||||
|
rightHeight: 0, //右边列高度 |
||||
|
} |
||||
|
}, |
||||
|
mounted() { |
||||
|
|
||||
|
}, |
||||
|
watch:{ |
||||
|
waterList: { |
||||
|
handler(newVal, oldVal) { |
||||
|
console.log(newVal, oldVal) |
||||
|
this.waterList = newVal |
||||
|
if(newVal.length > 0) { |
||||
|
this.setWaterFallLayout() |
||||
|
} |
||||
|
}, |
||||
|
immediate: true |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
//通过uni.getImageInfo,小程序支持 |
||||
|
async setWaterFallLayout() { |
||||
|
for (let item of this.waterList) { |
||||
|
try { |
||||
|
let h = await this.getImgHeight(item.headimg) |
||||
|
if (this.leftHeight <= this.rightHeight) { |
||||
|
this.leftList.push(item) |
||||
|
this.leftHeight += h |
||||
|
} else { |
||||
|
this.rightList.push(item) |
||||
|
this.rightHeight += h |
||||
|
} |
||||
|
} catch (e) {} |
||||
|
} |
||||
|
}, |
||||
|
getImgHeight(url) { |
||||
|
return new Promise((resolve, reject) => { |
||||
|
uni.getImageInfo({ |
||||
|
src: url, |
||||
|
success: e => { |
||||
|
resolve(e.height) |
||||
|
}, |
||||
|
fail: e => { |
||||
|
reject(e) |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
goDetail(item) { |
||||
|
if(item.outside_url) { |
||||
|
uni.navigateTo({ |
||||
|
url: '/subPackages/webPage/webPage?url=' + encodeURIComponent(item.outside_url) |
||||
|
}); |
||||
|
}else { |
||||
|
uni.navigateTo({ |
||||
|
url: '/subPackages/strategyDetail?id=' + item.id |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped lang="scss"> |
||||
|
.box { |
||||
|
display: flex; |
||||
|
flex-wrap: wrap; |
||||
|
justify-content: space-between; |
||||
|
|
||||
|
.left, .right { |
||||
|
width: 340rpx; |
||||
|
|
||||
|
.item { |
||||
|
width: 340rpx; |
||||
|
background: #FFFFFF; |
||||
|
box-shadow: 0rpx 0rpx 11rpx 0rpx rgba(17,17,17,0.26); |
||||
|
border-radius: 27rpx; |
||||
|
overflow: hidden; |
||||
|
margin-bottom: 13.33rpx; |
||||
|
|
||||
|
.image { |
||||
|
width: 340rpx; |
||||
|
} |
||||
|
|
||||
|
.content { |
||||
|
background: #FFFFFF; |
||||
|
padding: 20rpx; |
||||
|
|
||||
|
.title { |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
color: #000000; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.flex-between { |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #888888; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
@ -1,49 +1,767 @@ |
|||||
<template> |
<template> |
||||
<view class="content"> |
<view class="content"> |
||||
|
<view class="top-box"> |
||||
|
<!-- 搜索 --> |
||||
|
<view class="search-box"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/search.png" mode=""></image> |
||||
|
搜一搜您想要的产品 |
||||
|
</view> |
||||
|
|
||||
|
<swiper class="top-banner" :circular="true" :interval="6000" |
||||
|
:duration="800" :indicator-dots="false" :autoplay="true" v-if="topBanner"> |
||||
|
<swiper-item v-for="(item, index) in topBanner" :key="index" @click.stop="gotoUrlNew(item)"> |
||||
|
<image class="top-banner" :src="showImg(item.head_img)" mode="aspectFill"></image> |
||||
|
</swiper-item> |
||||
|
</swiper> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 金刚区 --> |
||||
|
<view class="nav-box"> |
||||
|
<view class="nav-top"> |
||||
|
<view class="nav-topLeft"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/consultImg.png" class="consultImg"></image> |
||||
|
<view class="text-overflow">通知通知通知通知通知通知通知通知通知知通知知通知知通知</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 天气 --> |
||||
|
<view class="nav-topRight"> |
||||
|
<image :src="weatherList.image" mode="" class="weather-img"></image> |
||||
|
<view style="line-height: 40rpx;"> |
||||
|
{{weatherList.low}}~{{weatherList.high}} <br> {{weatherList.type}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view style="position: relative;z-index: 2;"> |
||||
|
<view class="nav-item" v-for="(item,index) in navList" :key="index" @click="gotoPath(item.path)"> |
||||
|
<image :src="item.img" mode="" class="nav-img"></image> |
||||
|
<view>{{item.text}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 背景icon --> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/iconBg.png" mode="" class="iconBg"></image> |
||||
|
|
||||
|
<!-- 景点推荐 --> |
||||
|
<view class="scenic-box" :style="{backgroundImage: 'url('+showImg(homeUi.jdtj)+')',backgroundSize: 'cover'}" v-if="scenic"> |
||||
|
<view class="scenic-title">{{scenic.title}}</view> |
||||
|
<view class="scenic-subtitle flex-between"> |
||||
|
<view class="text-overflow" style="width: 320rpx;display: flex;align-items: center;"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/location.png" mode="" class="location"></image> |
||||
|
{{scenic.address}} |
||||
|
</view> |
||||
|
<view>>>> 发现好玩的游览宝地</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 活动日历、盐都美宿 --> |
||||
|
<view class="flex-between" style="padding: 0 27rpx;margin-top: 20rpx;" v-if="homeUi.hdrl && homeUi.ydms_hotel"> |
||||
|
<view class="calendar-box" :style="{backgroundImage: 'url('+showImg(homeUi.hdrl)+')',backgroundSize: 'cover'}"> |
||||
|
<view class="calendar-title">今日共有27个活动 >>></view> |
||||
|
<view class="calendar-line"></view> |
||||
|
<view class="calendar-subtitle">活动日历</view> |
||||
|
<view class="calendar-date"> |
||||
|
<span>{{day}}</span>日/{{month}}月 |
||||
|
</view> |
||||
|
</view> |
||||
|
<view class="calendar-box" :style="{backgroundImage: 'url('+showImg(homeUi.ydms_hotel)+')',backgroundSize: 'cover'}"> |
||||
|
<view class="calendar-title">享受家一般的舒适 >>></view> |
||||
|
<view class="calendar-line"></view> |
||||
|
<view class="calendar-subtitle">盐都美宿</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 线路推荐 --> |
||||
|
<view v-if="lineList && lineList.length > 0"> |
||||
|
<view class="title-box flex-between"> |
||||
|
<image :src="showImg(homeUi.xltj)" mode=""></image> |
||||
|
<view @click="gotoPath('/subPackages/line/lineList')">更多 ></view> |
||||
|
</view> |
||||
|
<view class="box"> |
||||
|
<view v-for="(item,index) in lineList" :key="index" class="line-item"> |
||||
|
<view class="hot flex-center">热门</view> |
||||
|
<image :src="showImg(item.goods.image)" mode="aspectFill" class="line-img"></image> |
||||
|
|
||||
|
<view class="line-content flex-between"> |
||||
|
<view class="line-title text-overflow">{{item.goods.title}}</view> |
||||
|
<view class="line-subtitle text-overflow">{{item.goods.subtitle}}</view> |
||||
|
<view style="display: flex;" v-if="item.goods.goods_new_tag"> |
||||
|
<view class="line-tag" v-for="(tagItem,tagIndex) in item.goods.goods_new_tag.split(',').slice(0,2)" :key="tagIndex">{{tagItem}}</view> |
||||
|
</view> |
||||
|
<view class="line-price">{{item.goods.low_money / 100}}</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')">更多 ></view> |
||||
|
</view> |
||||
|
<view class="food-box box"> |
||||
|
<view v-for="(item,index) in foodList" :key="index" class="food-item" :style="{backgroundImage: 'url('+showImg(item.goods.image)+')',backgroundSize: 'cover'}"> |
||||
|
<view class="recommend">人气推荐</view> |
||||
|
<view class="food-content"> |
||||
|
<view class="food-price">{{item.goods.low_money / 100}}</view> |
||||
|
<view class="text-overflow">{{item.goods.title}}</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<!-- 游记攻略 --> |
||||
|
<!-- v-if="strategyList && strategyList.length > 0" --> |
||||
|
<view> |
||||
|
<view class="title-box flex-between"> |
||||
|
<image :src="showImg(homeUi.yjgl)" mode=""></image> |
||||
|
</view> |
||||
|
|
||||
|
<view class="strategy-box 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="goDetail(item)"> |
||||
|
<view class="title-tag">近期上新</view> |
||||
|
<image class="strategy-image" :src="showImg(item.image)" mode="widthFix"></image> |
||||
|
<view class="strategy-content"> |
||||
|
<view class="strategy-title">{{item.title}}</view> |
||||
|
<view class="flex-between"> |
||||
|
<view class="text-overflow" style="display: flex;align-items: center;width: 200rpx;"> |
||||
|
<image :src="showImg(item.author_img)" mode="" class="author-img"></image> |
||||
|
{{item.author}} |
||||
|
</view> |
||||
|
<view style="display: flex;align-items: center;"> |
||||
|
<image src="https://static.ticket.sz-trip.com/yandu/images/index/eye.png" mode="" class="eye-img"></image> |
||||
|
{{item.view}} |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view class="strategy-more" @click="strategyMore" v-show="showMore">查看更多</view> |
||||
|
</view> |
||||
</view> |
</view> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
|
import waterList from "@/compoents/waterList.vue"; |
||||
|
|
||||
export default { |
export default { |
||||
|
components: { |
||||
|
waterList |
||||
|
}, |
||||
data() { |
data() { |
||||
return { |
return { |
||||
title: 'Hello' |
topBanner: [], |
||||
|
weatherList: [], |
||||
|
navList: [ |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '景区门票', |
||||
|
path: '' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '酒店民宿', |
||||
|
path: '' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '餐饮美食', |
||||
|
path: '/subPackages/food/foodList' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '文创特产', |
||||
|
path: '/subPackages/techan/techanList' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '线路推荐', |
||||
|
path: '/subPackages/line/lineList' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '智慧地图', |
||||
|
path: '' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '游记攻略', |
||||
|
path: '' |
||||
|
}, |
||||
|
{ |
||||
|
img: 'https://static.ticket.sz-trip.com/yandu/images/index/jdmp.png', |
||||
|
text: '活动日历', |
||||
|
path: '' |
||||
|
} |
||||
|
], |
||||
|
scenic: {}, |
||||
|
homeUi: {}, |
||||
|
month: 0, |
||||
|
day: 0, |
||||
|
lineList: [], |
||||
|
foodList: [], |
||||
|
strategyList: [], |
||||
|
showMore: true |
||||
} |
} |
||||
}, |
}, |
||||
onLoad() { |
onReady() { |
||||
|
// 获取经纬度 |
||||
|
if(!uni.getStorageSync('location')) { |
||||
|
this.getLocation() |
||||
|
} |
||||
|
|
||||
|
this.getTopBanner() |
||||
|
this.getWeather() |
||||
|
this.getScenicByTag() |
||||
|
this.getHomeUi() |
||||
|
this.getNowDate() |
||||
|
this.getLineList() |
||||
|
this.getFoodList() |
||||
|
this.getArticleByType() |
||||
}, |
}, |
||||
methods: { |
methods: { |
||||
|
// 顶部banner |
||||
|
getTopBanner() { |
||||
|
this.Post({ |
||||
|
type_id: 3, |
||||
|
position: 6 |
||||
|
},'/api/adv/getAdv').then(res => { |
||||
|
this.topBanner = res.data; |
||||
|
}) |
||||
|
}, |
||||
|
// 2是各种详情页,3是列表专题页面,4是小程序 |
||||
|
gotoUrlNew(item) { |
||||
|
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; |
||||
|
} |
||||
|
}, |
||||
|
// 天气 |
||||
|
getWeather() { |
||||
|
this.Post({},'/api/index/weather').then(res => { |
||||
|
this.weatherList = res.data |
||||
|
}) |
||||
|
}, |
||||
|
// 景点推荐 |
||||
|
getScenicByTag() { |
||||
|
this.Post({ |
||||
|
tag_id: 48, |
||||
|
offset: 0, |
||||
|
limit: 1 |
||||
|
},'/api/scenic/getScenicByTagId').then(res => { |
||||
|
this.scenic = res.data[0] |
||||
|
}) |
||||
|
}, |
||||
|
// 首页UI |
||||
|
getHomeUi() { |
||||
|
this.Post({ |
||||
|
type_id: 3 |
||||
|
},'/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(); |
||||
|
}, |
||||
|
// 线路推荐 |
||||
|
getLineList() { |
||||
|
this.Post({ |
||||
|
offset: 0, |
||||
|
limit: 3, |
||||
|
tag_id: 55 |
||||
|
},'/api/tag/getGoodsByTagId').then(res => { |
||||
|
this.lineList = 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> |
</script> |
||||
|
|
||||
<style> |
<style lang="scss" scoped> |
||||
.content { |
.content { |
||||
|
background: #DFEDE0; |
||||
|
min-height: 100vh; |
||||
|
overflow-x: hidden; |
||||
|
position: relative; |
||||
|
padding-bottom: 100rpx; |
||||
|
} |
||||
|
|
||||
|
.top-box { |
||||
|
position: relative; |
||||
|
|
||||
|
.search-box { |
||||
|
width: 487rpx; |
||||
|
height: 60rpx; |
||||
|
background: rgba(255, 255, 255, .4); |
||||
|
border-radius: 30rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding-left: 26rpx; |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #000000; |
||||
|
position: absolute; |
||||
|
top: 98rpx; |
||||
|
left: 26rpx; |
||||
|
z-index: 2; |
||||
|
|
||||
|
image { |
||||
|
margin-right: 14rpx; |
||||
|
width: 30.67rpx; |
||||
|
height: 30.67rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.top-banner { |
||||
|
width: 750rpx; |
||||
|
height: 800rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.nav-box { |
||||
|
width: 696.67rpx; |
||||
|
height: 520rpx; |
||||
|
background-image: url('https://static.ticket.sz-trip.com/yandu/images/index/navBg.png'); |
||||
|
background-size: 100% 100%; |
||||
|
position: relative; |
||||
|
margin: -79rpx auto 0; |
||||
|
|
||||
|
.nav-top { |
||||
|
height: 172rpx; |
||||
|
padding: 34rpx 19rpx 0 40rpx; |
||||
|
display: flex; |
||||
|
|
||||
|
.nav-topLeft { |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #111111; |
||||
|
width: 424rpx; |
||||
|
|
||||
|
.consultImg { |
||||
|
width: 296rpx; |
||||
|
height: 45.33rpx; |
||||
|
} |
||||
|
|
||||
|
.text-overflow { |
||||
|
margin-top: 12rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.nav-topRight { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 24rpx; |
||||
|
color: #000000; |
||||
|
margin: 20rpx 0 0 15rpx; |
||||
|
height: 73rpx; |
||||
|
border-left: 1rpx solid #95BE9E; |
||||
|
padding-left: 15rpx; |
||||
|
|
||||
|
.weather-img { |
||||
|
width: 46.67rpx; |
||||
|
height: 46.67rpx; |
||||
|
margin-right: 15rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.nav-item { |
||||
|
width: 25%; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 25rpx; |
||||
|
color: #111111; |
||||
|
display: inline-block; |
||||
|
|
||||
|
.nav-img { |
||||
|
width: 100rpx; |
||||
|
height: 100rpx; |
||||
|
margin-bottom: 10rpx; |
||||
|
} |
||||
|
} |
||||
|
.nav-item:nth-child(n+5) { |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.iconBg { |
||||
|
width: 750rpx; |
||||
|
height: 364.67rpx; |
||||
|
position: absolute; |
||||
|
top: 974rpx; |
||||
|
left: 0; |
||||
|
} |
||||
|
|
||||
|
.scenic-box { |
||||
|
margin: 34rpx auto 0; |
||||
|
width: 696rpx; |
||||
|
height: 280rpx; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 140rpx 39rpx 0 25rpx; |
||||
|
|
||||
|
.scenic-title { |
||||
|
text-align: right; |
||||
|
font-weight: 500; |
||||
|
font-size: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-shadow: 0rpx 1rpx 2rpx rgba(0,0,0,0.36); |
||||
|
} |
||||
|
|
||||
|
.scenic-subtitle { |
||||
|
margin-top: 30rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-shadow: 0rpx 1rpx 2rpx rgba(0,0,0,0.36); |
||||
|
|
||||
|
.location { |
||||
|
width: 20rpx; |
||||
|
height: 24.67rpx; |
||||
|
margin-right: 13rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.calendar-box { |
||||
|
width: 337rpx; |
||||
|
height: 253rpx; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx 0 0 26rpx; |
||||
|
|
||||
|
.calendar-title { |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.calendar-line { |
||||
|
width: 40rpx; |
||||
|
height: 1rpx; |
||||
|
background: #FFFFFF; |
||||
|
margin: 10rpx 0 7rpx; |
||||
|
} |
||||
|
|
||||
|
.calendar-subtitle { |
||||
|
font-weight: 500; |
||||
|
font-size: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
|
||||
|
.calendar-date { |
||||
|
margin-top: 40rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
|
||||
|
span { |
||||
|
font-size: 48rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.title-box { |
||||
|
margin-top: 60rpx; |
||||
|
padding-right: 26rpx; |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #000000; |
||||
|
|
||||
|
image { |
||||
|
width: 464.67rpx; |
||||
|
height: 120rpx; |
||||
|
} |
||||
|
|
||||
|
view { |
||||
|
margin-top: -25rpx; |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
.box { |
||||
|
margin-top: -14rpx; |
||||
|
} |
||||
|
|
||||
|
.line-item { |
||||
|
width: 697rpx; |
||||
|
height: 240rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
margin: 0 auto 20rpx; |
||||
display: flex; |
display: flex; |
||||
flex-direction: column; |
padding: 6.67rpx 0 6.67rpx 6.67rpx; |
||||
align-items: center; |
position: relative; |
||||
justify-content: center; |
|
||||
|
.line-img { |
||||
|
width: 267rpx; |
||||
|
height: 227rpx; |
||||
|
border-radius: 13rpx; |
||||
|
} |
||||
|
|
||||
|
.hot { |
||||
|
position: absolute; |
||||
|
left: 180rpx; |
||||
|
top: 6.67rpx; |
||||
|
width: 93rpx; |
||||
|
height: 47rpx; |
||||
|
background: #71B580; |
||||
|
border-radius: 0rpx 13rpx 0rpx 13rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
overflow-x: auto; |
||||
|
} |
||||
|
.hot::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.line-content { |
||||
|
width: 368rpx; |
||||
|
height: 227rpx; |
||||
|
margin-left: 23rpx; |
||||
|
padding: 16rpx 0 18rpx; |
||||
|
flex-direction: column; |
||||
|
align-items: flex-start; |
||||
|
|
||||
|
.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; |
||||
|
} |
||||
|
|
||||
|
.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: '¥'; |
||||
|
} |
||||
|
} |
||||
} |
} |
||||
|
|
||||
.logo { |
.food-box { |
||||
height: 200rpx; |
padding-left: 26.67rpx; |
||||
width: 200rpx; |
overflow-x: auto; |
||||
margin-top: 200rpx; |
display: flex; |
||||
margin-left: auto; |
|
||||
margin-right: auto; |
.food-item { |
||||
margin-bottom: 50rpx; |
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; |
||||
|
} |
||||
|
.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; |
||||
} |
} |
||||
|
|
||||
.text-area { |
.strategy-box { |
||||
|
padding: 0 26.67rpx; |
||||
|
box-sizing: border-box; |
||||
display: flex; |
display: flex; |
||||
justify-content: center; |
justify-content: space-between; |
||||
|
|
||||
|
.strategy-item { |
||||
|
width: 337rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 18rpx; |
||||
|
overflow: hidden; |
||||
|
margin-bottom: 28rpx; |
||||
|
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; |
||||
|
} |
||||
|
.title-tag::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
|
||||
|
.strategy-image { |
||||
|
width: 337rpx; |
||||
|
display: block; |
||||
|
} |
||||
|
|
||||
|
.strategy-content { |
||||
|
background: #FFFFFF; |
||||
|
padding: 20rpx; |
||||
|
|
||||
|
.strategy-title { |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
color: #000000; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
|
||||
|
.flex-between { |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #888888; |
||||
|
margin-top: 10rpx; |
||||
|
|
||||
|
.author-img { |
||||
|
width: 37rpx; |
||||
|
height: 37rpx; |
||||
|
margin-right: 6rpx; |
||||
|
} |
||||
|
|
||||
|
.eye-img { |
||||
|
width: 26.67rpx; |
||||
|
height: 18.67rpx; |
||||
|
margin-right: 6rpx; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
} |
} |
||||
|
|
||||
.title { |
.strategy-more { |
||||
font-size: 36rpx; |
width: 200rpx; |
||||
color: #8f8f94; |
line-height: 67rpx; |
||||
|
background: #DCEADD; |
||||
|
border-radius: 33rpx; |
||||
|
border: 1rpx solid #71B580; |
||||
|
margin: 44rpx auto 0; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 28rpx; |
||||
|
color: #5BA06A; |
||||
} |
} |
||||
</style> |
</style> |
||||
|
Before Width: | Height: | Size: 7.4 KiB After Width: | Height: | Size: 6.1 KiB |
After Width: | Height: | Size: 6.4 KiB |
After Width: | Height: | Size: 10 KiB |
After Width: | Height: | Size: 18 KiB |
After Width: | Height: | Size: 12 KiB |
After Width: | Height: | Size: 14 KiB |
After Width: | Height: | Size: 7.0 KiB |
After Width: | Height: | Size: 9.1 KiB |
@ -0,0 +1,29 @@ |
|||||
|
<template> |
||||
|
<web-view :src="url"></web-view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
url: '' |
||||
|
} |
||||
|
}, |
||||
|
onLoad(option) { |
||||
|
console.log(option); |
||||
|
if (option.url) { |
||||
|
this.url = decodeURIComponent(option.url) |
||||
|
}else{ |
||||
|
this.url = uni.getStorageSync('webUrl') |
||||
|
console.log(this.url); |
||||
|
} |
||||
|
console.log(this.url) |
||||
|
// 传入需要跳转的链接 使用web-view标签进行跳转 |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
|
||||
|
</style> |
||||
|
|
@ -1,5 +1,5 @@ |
|||||
|
|
||||
!function(){try{var a=Function("return this")();a&&!a.Math&&(Object.assign(a,{isFinite:isFinite,Array:Array,Date:Date,Error:Error,Function:Function,Math:Math,Object:Object,RegExp:RegExp,String:String,TypeError:TypeError,setTimeout:setTimeout,clearTimeout:clearTimeout,setInterval:setInterval,clearInterval:clearInterval}),"undefined"!=typeof Reflect&&(a.Reflect=Reflect))}catch(a){}}(); |
!function(){try{var a=Function("return this")();a&&!a.Math&&(Object.assign(a,{isFinite:isFinite,Array:Array,Date:Date,Error:Error,Function:Function,Math:Math,Object:Object,RegExp:RegExp,String:String,TypeError:TypeError,setTimeout:setTimeout,clearTimeout:clearTimeout,setInterval:setInterval,clearInterval:clearInterval}),"undefined"!=typeof Reflect&&(a.Reflect=Reflect))}catch(a){}}(); |
||||
(function(e){function r(r){for(var n,l,a=r[0],i=r[1],f=r[2],c=0,s=[];c<a.length;c++)l=a[c],Object.prototype.hasOwnProperty.call(o,l)&&o[l]&&s.push(o[l][0]),o[l]=0;for(n in i)Object.prototype.hasOwnProperty.call(i,n)&&(e[n]=i[n]);p&&p(r);while(s.length)s.shift()();return u.push.apply(u,f||[]),t()}function t(){for(var e,r=0;r<u.length;r++){for(var t=u[r],n=!0,a=1;a<t.length;a++){var i=t[a];0!==o[i]&&(n=!1)}n&&(u.splice(r--,1),e=l(l.s=t[0]))}return e}var n={},o={"common/runtime":0},u=[];function l(r){if(n[r])return n[r].exports;var t=n[r]={i:r,l:!1,exports:{}};return e[r].call(t.exports,t,t.exports,l),t.l=!0,t.exports}l.m=e,l.c=n,l.d=function(e,r,t){l.o(e,r)||Object.defineProperty(e,r,{enumerable:!0,get:t})},l.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,r){if(1&r&&(e=l(e)),8&r)return e;if(4&r&&"object"===typeof e&&e&&e.__esModule)return e;var t=Object.create(null);if(l.r(t),Object.defineProperty(t,"default",{enumerable:!0,value:e}),2&r&&"string"!=typeof e)for(var n in e)l.d(t,n,function(r){return e[r]}.bind(null,n));return t},l.n=function(e){var r=e&&e.__esModule?function(){return e["default"]}:function(){return e};return l.d(r,"a",r),r},l.o=function(e,r){return Object.prototype.hasOwnProperty.call(e,r)},l.p="/";var a=global["webpackJsonp"]=global["webpackJsonp"]||[],i=a.push.bind(a);a.push=r,a=a.slice();for(var f=0;f<a.length;f++)r(a[f]);var p=i;t()})([]); |
(function(e){function t(t){for(var n,o,i=t[0],l=t[1],c=t[2],s=0,f=[];s<i.length;s++)o=i[s],Object.prototype.hasOwnProperty.call(a,o)&&a[o]&&f.push(a[o][0]),a[o]=0;for(n in l)Object.prototype.hasOwnProperty.call(l,n)&&(e[n]=l[n]);p&&p(t);while(f.length)f.shift()();return u.push.apply(u,c||[]),r()}function r(){for(var e,t=0;t<u.length;t++){for(var r=u[t],n=!0,o=1;o<r.length;o++){var i=r[o];0!==a[i]&&(n=!1)}n&&(u.splice(t--,1),e=l(l.s=r[0]))}return e}var n={},o={"common/runtime":0},a={"common/runtime":0},u=[];function i(e){return l.p+""+e+".js"}function l(t){if(n[t])return n[t].exports;var r=n[t]={i:t,l:!1,exports:{}};return e[t].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.e=function(e){var t=[],r={"compoents/waterList":1};o[e]?t.push(o[e]):0!==o[e]&&r[e]&&t.push(o[e]=new Promise((function(t,r){for(var n=({"compoents/waterList":"compoents/waterList"}[e]||e)+".wxss",a=l.p+n,u=document.getElementsByTagName("link"),i=0;i<u.length;i++){var c=u[i],s=c.getAttribute("data-href")||c.getAttribute("href");if("stylesheet"===c.rel&&(s===n||s===a))return t()}var f=document.getElementsByTagName("style");for(i=0;i<f.length;i++){c=f[i],s=c.getAttribute("data-href");if(s===n||s===a)return t()}var p=document.createElement("link");p.rel="stylesheet",p.type="text/css",p.onload=t,p.onerror=function(t){var n=t&&t.target&&t.target.src||a,u=new Error("Loading CSS chunk "+e+" failed.\n("+n+")");u.code="CSS_CHUNK_LOAD_FAILED",u.request=n,delete o[e],p.parentNode.removeChild(p),r(u)},p.href=a;var d=document.getElementsByTagName("head")[0];d.appendChild(p)})).then((function(){o[e]=0})));var n=a[e];if(0!==n)if(n)t.push(n[2]);else{var u=new Promise((function(t,r){n=a[e]=[t,r]}));t.push(n[2]=u);var c,s=document.createElement("script");s.charset="utf-8",s.timeout=120,l.nc&&s.setAttribute("nonce",l.nc),s.src=i(e);var f=new Error;c=function(t){s.onerror=s.onload=null,clearTimeout(p);var r=a[e];if(0!==r){if(r){var n=t&&("load"===t.type?"missing":t.type),o=t&&t.target&&t.target.src;f.message="Loading chunk "+e+" failed.\n("+n+": "+o+")",f.name="ChunkLoadError",f.type=n,f.request=o,r[1](f)}a[e]=void 0}};var p=setTimeout((function(){c({type:"timeout",target:s})}),12e4);s.onerror=s.onload=c,document.head.appendChild(s)}return Promise.all(t)},l.m=e,l.c=n,l.d=function(e,t,r){l.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:r})},l.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,t){if(1&t&&(e=l(e)),8&t)return e;if(4&t&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var n in e)l.d(r,n,function(t){return e[t]}.bind(null,n));return r},l.n=function(e){var t=e&&e.__esModule?function(){return e["default"]}:function(){return e};return l.d(t,"a",t),t},l.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},l.p="/",l.oe=function(e){throw console.error(e),e};var c=global["webpackJsonp"]=global["webpackJsonp"]||[],s=c.push.bind(c);c.push=t,c=c.slice();for(var f=0;f<c.length;f++)t(c[f]);var p=s;r()})([]); |
||||
//# sourceMappingURL=../../.sourcemap/mp-weixin/common/runtime.js.map
|
//# sourceMappingURL=../../.sourcemap/mp-weixin/common/runtime.js.map
|
||||
|
|
@ -1,4 +1,7 @@ |
|||||
{ |
{ |
||||
|
"navigationStyle": "custom", |
||||
"navigationBarTitleText": "首页", |
"navigationBarTitleText": "首页", |
||||
"usingComponents": {} |
"usingComponents": { |
||||
|
"water-list": "/compoents/waterList" |
||||
|
} |
||||
} |
} |
@ -1,24 +1,399 @@ |
|||||
|
@charset "UTF-8"; |
||||
.content { |
/** |
||||
display: flex; |
* 这里是uni-app内置的常用样式变量 |
||||
flex-direction: column; |
* |
||||
align-items: center; |
* uni-app 官方扩展插件及插件市场(https://ext.dcloud.net.cn)上很多三方插件均使用了这些样式变量 |
||||
justify-content: center; |
* 如果你是插件开发者,建议你使用scss预处理,并在插件代码中直接使用这些变量(无需 import 这个文件),方便用户通过搭积木的方式开发整体风格一致的App |
||||
} |
* |
||||
.logo { |
*/ |
||||
height: 200rpx; |
/** |
||||
width: 200rpx; |
* 如果你是App开发者(插件使用者),你可以通过修改这些变量来定制自己的插件主题,实现自定义主题功能 |
||||
margin-top: 200rpx; |
* |
||||
margin-left: auto; |
* 如果你的项目同样使用了scss预处理,你也可以直接在你的 scss 代码中使用如下变量,同时无需 import 这个文件 |
||||
margin-right: auto; |
*/ |
||||
margin-bottom: 50rpx; |
/* 颜色变量 */ |
||||
} |
/* 行为相关颜色 */ |
||||
.text-area { |
/* 文字基本颜色 */ |
||||
display: flex; |
/* 背景颜色 */ |
||||
justify-content: center; |
/* 边框颜色 */ |
||||
} |
/* 尺寸变量 */ |
||||
.title { |
/* 文字尺寸 */ |
||||
font-size: 36rpx; |
/* 图片尺寸 */ |
||||
color: #8f8f94; |
/* Border Radius */ |
||||
|
/* 水平间距 */ |
||||
|
/* 垂直间距 */ |
||||
|
/* 透明度 */ |
||||
|
/* 文章场景相关 */ |
||||
|
.content.data-v-57280228 { |
||||
|
background: #DFEDE0; |
||||
|
min-height: 100vh; |
||||
|
overflow-x: hidden; |
||||
|
position: relative; |
||||
|
padding-bottom: 100rpx; |
||||
|
} |
||||
|
.top-box.data-v-57280228 { |
||||
|
position: relative; |
||||
|
} |
||||
|
.top-box .search-box.data-v-57280228 { |
||||
|
width: 487rpx; |
||||
|
height: 60rpx; |
||||
|
background: rgba(255, 255, 255, 0.4); |
||||
|
border-radius: 30rpx; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
padding-left: 26rpx; |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #000000; |
||||
|
position: absolute; |
||||
|
top: 98rpx; |
||||
|
left: 26rpx; |
||||
|
z-index: 2; |
||||
|
} |
||||
|
.top-box .search-box image.data-v-57280228 { |
||||
|
margin-right: 14rpx; |
||||
|
width: 30.67rpx; |
||||
|
height: 30.67rpx; |
||||
|
} |
||||
|
.top-box .top-banner.data-v-57280228 { |
||||
|
width: 750rpx; |
||||
|
height: 800rpx; |
||||
|
} |
||||
|
.nav-box.data-v-57280228 { |
||||
|
width: 696.67rpx; |
||||
|
height: 520rpx; |
||||
|
background-image: url("https://static.ticket.sz-trip.com/yandu/images/index/navBg.png"); |
||||
|
background-size: 100% 100%; |
||||
|
position: relative; |
||||
|
margin: -79rpx auto 0; |
||||
|
} |
||||
|
.nav-box .nav-top.data-v-57280228 { |
||||
|
height: 172rpx; |
||||
|
padding: 34rpx 19rpx 0 40rpx; |
||||
|
display: flex; |
||||
|
} |
||||
|
.nav-box .nav-top .nav-topLeft.data-v-57280228 { |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #111111; |
||||
|
width: 424rpx; |
||||
|
} |
||||
|
.nav-box .nav-top .nav-topLeft .consultImg.data-v-57280228 { |
||||
|
width: 296rpx; |
||||
|
height: 45.33rpx; |
||||
|
} |
||||
|
.nav-box .nav-top .nav-topLeft .text-overflow.data-v-57280228 { |
||||
|
margin-top: 12rpx; |
||||
|
} |
||||
|
.nav-box .nav-top .nav-topRight.data-v-57280228 { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 24rpx; |
||||
|
color: #000000; |
||||
|
margin: 20rpx 0 0 15rpx; |
||||
|
height: 73rpx; |
||||
|
border-left: 1rpx solid #95BE9E; |
||||
|
padding-left: 15rpx; |
||||
|
} |
||||
|
.nav-box .nav-top .nav-topRight .weather-img.data-v-57280228 { |
||||
|
width: 46.67rpx; |
||||
|
height: 46.67rpx; |
||||
|
margin-right: 15rpx; |
||||
|
} |
||||
|
.nav-box .nav-item.data-v-57280228 { |
||||
|
width: 25%; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 25rpx; |
||||
|
color: #111111; |
||||
|
display: inline-block; |
||||
|
} |
||||
|
.nav-box .nav-item .nav-img.data-v-57280228 { |
||||
|
width: 100rpx; |
||||
|
height: 100rpx; |
||||
|
margin-bottom: 10rpx; |
||||
|
} |
||||
|
.nav-box .nav-item.data-v-57280228:nth-child(n+5) { |
||||
|
margin-top: 20rpx; |
||||
|
} |
||||
|
.iconBg.data-v-57280228 { |
||||
|
width: 750rpx; |
||||
|
height: 364.67rpx; |
||||
|
position: absolute; |
||||
|
top: 974rpx; |
||||
|
left: 0; |
||||
|
} |
||||
|
.scenic-box.data-v-57280228 { |
||||
|
margin: 34rpx auto 0; |
||||
|
width: 696rpx; |
||||
|
height: 280rpx; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 140rpx 39rpx 0 25rpx; |
||||
|
} |
||||
|
.scenic-box .scenic-title.data-v-57280228 { |
||||
|
text-align: right; |
||||
|
font-weight: 500; |
||||
|
font-size: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-shadow: 0rpx 1rpx 2rpx rgba(0, 0, 0, 0.36); |
||||
|
} |
||||
|
.scenic-box .scenic-subtitle.data-v-57280228 { |
||||
|
margin-top: 30rpx; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
text-shadow: 0rpx 1rpx 2rpx rgba(0, 0, 0, 0.36); |
||||
|
} |
||||
|
.scenic-box .scenic-subtitle .location.data-v-57280228 { |
||||
|
width: 20rpx; |
||||
|
height: 24.67rpx; |
||||
|
margin-right: 13rpx; |
||||
|
} |
||||
|
.calendar-box.data-v-57280228 { |
||||
|
width: 337rpx; |
||||
|
height: 253rpx; |
||||
|
border-radius: 20rpx; |
||||
|
padding: 20rpx 0 0 26rpx; |
||||
|
} |
||||
|
.calendar-box .calendar-title.data-v-57280228 { |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
.calendar-box .calendar-line.data-v-57280228 { |
||||
|
width: 40rpx; |
||||
|
height: 1rpx; |
||||
|
background: #FFFFFF; |
||||
|
margin: 10rpx 0 7rpx; |
||||
|
} |
||||
|
.calendar-box .calendar-subtitle.data-v-57280228 { |
||||
|
font-weight: 500; |
||||
|
font-size: 40rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
.calendar-box .calendar-date.data-v-57280228 { |
||||
|
margin-top: 40rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #FFFFFF; |
||||
|
} |
||||
|
.calendar-box .calendar-date ._span.data-v-57280228 { |
||||
|
font-size: 48rpx; |
||||
|
} |
||||
|
.title-box.data-v-57280228 { |
||||
|
margin-top: 60rpx; |
||||
|
padding-right: 26rpx; |
||||
|
font-weight: 400; |
||||
|
font-size: 27rpx; |
||||
|
color: #000000; |
||||
|
} |
||||
|
.title-box image.data-v-57280228 { |
||||
|
width: 464.67rpx; |
||||
|
height: 120rpx; |
||||
|
} |
||||
|
.title-box view.data-v-57280228 { |
||||
|
margin-top: -25rpx; |
||||
|
} |
||||
|
.box.data-v-57280228 { |
||||
|
margin-top: -14rpx; |
||||
|
} |
||||
|
.line-item.data-v-57280228 { |
||||
|
width: 697rpx; |
||||
|
height: 240rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 20rpx; |
||||
|
margin: 0 auto 20rpx; |
||||
|
display: flex; |
||||
|
padding: 6.67rpx 0 6.67rpx 6.67rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
.line-item .line-img.data-v-57280228 { |
||||
|
width: 267rpx; |
||||
|
height: 227rpx; |
||||
|
border-radius: 13rpx; |
||||
|
} |
||||
|
.line-item .hot.data-v-57280228 { |
||||
|
position: absolute; |
||||
|
left: 180rpx; |
||||
|
top: 6.67rpx; |
||||
|
width: 93rpx; |
||||
|
height: 47rpx; |
||||
|
background: #71B580; |
||||
|
border-radius: 0rpx 13rpx 0rpx 13rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 27rpx; |
||||
|
color: #FFFFFF; |
||||
|
overflow-x: auto; |
||||
|
} |
||||
|
.line-item .hot.data-v-57280228::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
.line-item .line-content.data-v-57280228 { |
||||
|
width: 368rpx; |
||||
|
height: 227rpx; |
||||
|
margin-left: 23rpx; |
||||
|
padding: 16rpx 0 18rpx; |
||||
|
flex-direction: column; |
||||
|
align-items: flex-start; |
||||
|
} |
||||
|
.line-item .line-content .line-title.data-v-57280228 { |
||||
|
width: 368rpx; |
||||
|
font-family: PingFang; |
||||
|
font-weight: bold; |
||||
|
font-size: 32rpx; |
||||
|
color: #000000; |
||||
|
} |
||||
|
.line-item .line-content .line-subtitle.data-v-57280228 { |
||||
|
width: 368rpx; |
||||
|
font-weight: 500; |
||||
|
font-size: 25rpx; |
||||
|
color: #999999; |
||||
|
} |
||||
|
.line-item .line-content .line-tag.data-v-57280228 { |
||||
|
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-item .line-content .line-price.data-v-57280228 { |
||||
|
font-weight: 500; |
||||
|
font-size: 32rpx; |
||||
|
color: #EF2323; |
||||
|
} |
||||
|
.line-item .line-content .line-price.data-v-57280228::before { |
||||
|
font-size: 24rpx; |
||||
|
content: '¥'; |
||||
|
} |
||||
|
.food-box.data-v-57280228 { |
||||
|
padding-left: 26.67rpx; |
||||
|
overflow-x: auto; |
||||
|
display: flex; |
||||
|
} |
||||
|
.food-box .food-item.data-v-57280228 { |
||||
|
width: 320rpx; |
||||
|
height: 293rpx; |
||||
|
border-radius: 20rpx; |
||||
|
opacity: 0.8; |
||||
|
margin-right: 20rpx; |
||||
|
position: relative; |
||||
|
flex-shrink: 0; |
||||
|
overflow: hidden; |
||||
|
} |
||||
|
.food-box .food-item .recommend.data-v-57280228 { |
||||
|
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; |
||||
|
} |
||||
|
.food-box .food-item .recommend.data-v-57280228::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
.food-box .food-item .food-content.data-v-57280228 { |
||||
|
background: linear-gradient(to top, black, rgba(0, 0, 0, 0.5), rgba(0, 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-box .food-item .food-content .food-price.data-v-57280228 { |
||||
|
font-size: 33rpx; |
||||
|
} |
||||
|
.food-box .food-item .food-content .food-price.data-v-57280228::before { |
||||
|
font-size: 24rpx; |
||||
|
content: '¥'; |
||||
|
} |
||||
|
.food-box .food-item .food-content .text-overflow.data-v-57280228 { |
||||
|
width: 280rpx; |
||||
|
margin-top: 10rpx; |
||||
|
} |
||||
|
.food-box.data-v-57280228::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
.strategy-box.data-v-57280228 { |
||||
|
padding: 0 26.67rpx; |
||||
|
box-sizing: border-box; |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
} |
||||
|
.strategy-box .strategy-item.data-v-57280228 { |
||||
|
width: 337rpx; |
||||
|
background: #FFFFFF; |
||||
|
border-radius: 18rpx; |
||||
|
overflow: hidden; |
||||
|
margin-bottom: 28rpx; |
||||
|
position: relative; |
||||
|
} |
||||
|
.strategy-box .strategy-item .title-tag.data-v-57280228 { |
||||
|
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; |
||||
|
} |
||||
|
.strategy-box .strategy-item .title-tag.data-v-57280228::-webkit-scrollbar { |
||||
|
display: none; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-image.data-v-57280228 { |
||||
|
width: 337rpx; |
||||
|
display: block; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-content.data-v-57280228 { |
||||
|
background: #FFFFFF; |
||||
|
padding: 20rpx; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-content .strategy-title.data-v-57280228 { |
||||
|
font-weight: 500; |
||||
|
font-size: 28rpx; |
||||
|
color: #000000; |
||||
|
line-height: 40rpx; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-content .flex-between.data-v-57280228 { |
||||
|
font-weight: 500; |
||||
|
font-size: 24rpx; |
||||
|
color: #888888; |
||||
|
margin-top: 10rpx; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-content .flex-between .author-img.data-v-57280228 { |
||||
|
width: 37rpx; |
||||
|
height: 37rpx; |
||||
|
margin-right: 6rpx; |
||||
|
} |
||||
|
.strategy-box .strategy-item .strategy-content .flex-between .eye-img.data-v-57280228 { |
||||
|
width: 26.67rpx; |
||||
|
height: 18.67rpx; |
||||
|
margin-right: 6rpx; |
||||
|
} |
||||
|
.strategy-more.data-v-57280228 { |
||||
|
width: 200rpx; |
||||
|
line-height: 67rpx; |
||||
|
background: #DCEADD; |
||||
|
border-radius: 33rpx; |
||||
|
border: 1rpx solid #71B580; |
||||
|
margin: 44rpx auto 0; |
||||
|
text-align: center; |
||||
|
font-weight: 400; |
||||
|
font-size: 28rpx; |
||||
|
color: #5BA06A; |
||||
} |
} |
||||
|
|
||||
|
Before Width: | Height: | Size: 7.4 KiB After Width: | Height: | Size: 6.1 KiB |
Before Width: | Height: | Size: 9.4 KiB After Width: | Height: | Size: 6.4 KiB |
Before Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 6.7 KiB |
Before Width: | Height: | Size: 9.7 KiB |
Before Width: | Height: | Size: 13 KiB |
Before Width: | Height: | Size: 17 KiB |
Before Width: | Height: | Size: 3.9 KiB |