|
|
|
@ -1,22 +1,9 @@ |
|
|
|
<template> |
|
|
|
<view class="bg"> |
|
|
|
<view class="bg" v-if="info"> |
|
|
|
<view class="swipe-box"> |
|
|
|
<swiper class="swiper" :autoplay="true" :interval="3000" :duration="1000" @change="swiperChange"> |
|
|
|
<swiper-item v-for="(item, index) in info.list_images.split(',')" :key="item.id"> |
|
|
|
<swiper-item v-if="info && info.videourl"> |
|
|
|
<video |
|
|
|
:src="showImg(info.videourl)" |
|
|
|
id="detailVideo" |
|
|
|
:poster=" |
|
|
|
showImg(info.image) |
|
|
|
" |
|
|
|
@play="play" |
|
|
|
@error="videoErrorCallback" |
|
|
|
controls |
|
|
|
style="width: 100%;height: 100%;" |
|
|
|
object-fit="cover" |
|
|
|
></video> |
|
|
|
</swiper-item> |
|
|
|
<swiper class="swiper" :autoplay="true" :interval="3000" :duration="1000" |
|
|
|
@change="swiperChange" circular> |
|
|
|
<swiper-item v-for="(item, index) in info.listimg" :key="item.id"> |
|
|
|
<view class="swiper-item"> |
|
|
|
<image class="item-img" :src="showImg(item)" mode="aspectFill"></image> |
|
|
|
</view> |
|
|
|
@ -24,7 +11,7 @@ |
|
|
|
</swiper> |
|
|
|
|
|
|
|
<view class="swiper-pointer"> |
|
|
|
{{swiperCurrent}}/{{info.list_images.split(',').length}} |
|
|
|
<view :class="['cricle',swiperCurrent==i?'active':'']" v-for="(item,i) in info.listimg" :key="i"></view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
@ -32,99 +19,77 @@ |
|
|
|
<view class="common-container info-container"> |
|
|
|
<view class="flex-between"> |
|
|
|
<view class="info-title text-overflowRows">{{info.title}}</view> |
|
|
|
<!-- <view class="collect" @click="collect"> |
|
|
|
<image :src="showImg('/uploads/20240827/8a55a8936b9324fa1c7b85c2da9c015b.png')" mode="" v-if="info.is_collect == 0"></image> |
|
|
|
<image v-else :src="showImg('/uploads/20240827/6bf73216f19c756961496031f8aed053.png')" mode="" ></image> |
|
|
|
<view>收藏</view> |
|
|
|
</view> --> |
|
|
|
</view> |
|
|
|
<view class="flex-between time-container"> |
|
|
|
<view class="flex flex-1 flex-shrink-0 flex-items-center"> |
|
|
|
<image class="address-icon flex-shrink-0" :src="showImg('/uploads/20241024/7fe2f8f89aec55a4009b66032b7a3f7e.png')" mode=""></image> |
|
|
|
<view class="title text-overflowRows"> |
|
|
|
<text style="margin-right: 28rpx;">营业时间</text> |
|
|
|
{{info.open_description}} |
|
|
|
</view> |
|
|
|
<view class="tags flex text-overflow" style="overflow: hidden" v-if="info.display_tags"> |
|
|
|
<view class="tag" v-for="(tagItem, tagIndex) in info.display_tags.split(',').slice(0, 2)" |
|
|
|
:key="tagIndex"> |
|
|
|
<text>{{ tagItem }}</text> |
|
|
|
<view class="tip"></view> |
|
|
|
</view> |
|
|
|
<view></view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="flex" style="margin: 30rpx 0;"> |
|
|
|
<text class="flex-shrink-0">开园时间：</text> |
|
|
|
<text class="flex-1 w-1rpx">{{info.open_time}}</text> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="flex-between" style="align-items: flex-start;"> |
|
|
|
<view class="flex flex-1 flex-shrink-0 flex-items-center" style="align-items: flex-start;"> |
|
|
|
<image class="address-icon flex-shrink-0" style="margin-top: 5rpx;" :src="showImg('/uploads/20241023/3d357e6e562de9395f373dc380a790a7.png')" mode=""></image> |
|
|
|
<view class="title address-title text-overflowRows"> |
|
|
|
<text class="flex-shrink-0" style="margin-right: 28rpx;">景区地址</text> |
|
|
|
<text class="address-detail flex-1">{{info.address}}</text> |
|
|
|
</view> |
|
|
|
<view class="flex flex-1 w-1rpx"> |
|
|
|
<text class="flex-shrink-0">地址：</text> |
|
|
|
<text class="flex-1 w-1rpx">{{info.address}}</text> |
|
|
|
</view> |
|
|
|
<view @click="goMap" class="map-icon"> |
|
|
|
<img style="width: 50rpx;height: 50rpx;" :src="showImg('/uploads/20241104/07d3dce7ad780dc9f207142887e938e8.png')"> |
|
|
|
<view>去这里</view> |
|
|
|
<view @click="goMap" class="flex-shrink-0"> |
|
|
|
<img style="width: 34.67rpx;height: 34.67rpx;" src="https://static.ticket.sz-trip.com/uploads/20250610/aefe5ce619ba00f6f1906d229effd686.png"> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="box-title" v-if="currentAudio.multimedia_url">语音讲解</view> |
|
|
|
<view class="common-container info-container" v-if="currentAudio.multimedia_url"> |
|
|
|
<view class="info-title text-overflowRows" style="font-weight: normal;">{{info.title}}</view> |
|
|
|
<view class='flex flex-between audio' > |
|
|
|
<view class='flex-shrink-0'>{{getTime(Math.round(currentAudio.currentTime.toFixed(0)))}}</view> |
|
|
|
<Voice-play :duration="133" :play="false"></Voice-play> |
|
|
|
<view class='flex-1' style="width: 10rpx;padding:0 30rpx"> |
|
|
|
<slider @change="audioSeek" @changing="audioChanging" style="width: 100%;margin: 0;" :block-size="12" backgroundColor='#E4F1F5' |
|
|
|
activeColor='#12293C' :min='0' :max='currentAudio.video_length.toFixed(0)' :value='currentAudio.currentTime.toFixed(0)' :step='0.1'></slider> |
|
|
|
|
|
|
|
<view class="w-full flex" v-if="sku.length>0"> |
|
|
|
<scroll-view class="left-container no-scrollbar" scroll-y scroll-with-animation> |
|
|
|
<view :class="['type-item',current ==i?'active':'']" |
|
|
|
v-for="(item,i) in sku" :key="i" @click="changeType(item,i)"> |
|
|
|
{{item.title}} |
|
|
|
</view> |
|
|
|
<view class='flex-shrink-0'> {{getTime(Math.round(currentAudio.video_length))}}</view> |
|
|
|
|
|
|
|
<view class='play-icon' style="height:59rpx" > |
|
|
|
<image v-if="!curPlay" @tap.stop="playVoice" :src="showImg('/uploads/20241104/d5e0afc30007b693b1880dfe49fa329e.png')" ></image> |
|
|
|
<image v-else @tap.stop="pauseVoice" :src="showImg('/uploads/20241104/986b741dfc323cf6175c34e2ca751a9a.png')" class='icon'></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
<scroll-view class="right-container no-scrollbar" scroll-y scroll-with-animation> |
|
|
|
<view style="height: 20rpx;"></view> |
|
|
|
<view class="scenic-list" v-for="(item, index) in sku" :key="index"> |
|
|
|
<view class="scenic-title">{{item.title}}</view> |
|
|
|
<view class="scenic-item " v-for="(itemSku, indexSku) in item.sku" :key="indexSku"> |
|
|
|
<view class="title text-overflow">{{ itemSku.sku_name }}</view> |
|
|
|
<view class="flex flex-1 h-1rpx flex-between"> |
|
|
|
<view class="w-1rpx flex-1"> |
|
|
|
<view class="tags-box"> |
|
|
|
<view class="tags text-overflow" v-if="itemSku.display_tags"> |
|
|
|
{{ itemSku.display_tags.split(',').join(" | ") }} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="box-title" v-if="sku.length>0">门票预定</view> |
|
|
|
<view class="w-full" v-if="sku.length>0"> |
|
|
|
<view class="scenic-list" v-for="(item, index) in sku" :key="index"> |
|
|
|
<view class="scenic-item " v-for="(itemSku, indexSku) in item.specifications" :key="indexSku"> |
|
|
|
<view class="w-1rpx flex-1 item-left"> |
|
|
|
<view class="title text-overflow">{{ itemSku.title }}</view> |
|
|
|
<view> |
|
|
|
<view class="tags-box"> |
|
|
|
<view class="tags text-overflow" v-if="itemSku.specifications_new_tag"> |
|
|
|
<view v-for="(tagSku,tagSkuIndex) in itemSku.specifications_new_tag.split(',').slice(0, 2)" |
|
|
|
:key="tagSkuIndex">{{ tagSku }}</view> |
|
|
|
<view style="color: #FF944C;" class="notice" @click="showSkuInfo(itemSku, item)"> |
|
|
|
预订须知 >> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view style="color: #12293C;" class="notice" @click="showSkuInfo(itemSku, item)"> |
|
|
|
预订须知 > |
|
|
|
<view class="item-right flex-shrink-0"> |
|
|
|
<view class="price">{{showNoPriceNew(itemSku.price)}}</view> |
|
|
|
<view class="btn" @click="changeSku(itemSku, item)">预订</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
<view class="item-right flex-shrink-0"> |
|
|
|
<view class="price"> |
|
|
|
{{showNoPriceNew(itemSku.price)}} |
|
|
|
</view> |
|
|
|
<view class="btn" @click="changeSku(itemSku, item)"> |
|
|
|
购买 |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<view style="height: 20rpx;"></view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="box-title">景点简介</view> |
|
|
|
<view class="common-container" style="padding: 30rpx;"> |
|
|
|
<view class="common-container" style="padding: 30rpx 20rpx;background: white;"> |
|
|
|
<view class="box-title">景点简介</view> |
|
|
|
<view class="" id="cpts" v-html="formateRichText(info.feature_content)"></view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- <template v-if="id"> |
|
|
|
<userReviewsVue :goodsId="id" goodsType="scenicId"></userReviewsVue> |
|
|
|
<moreGoodsVue :goodsId="id"></moreGoodsVue> |
|
|
|
</template> --> |
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
@ -204,18 +169,17 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import userReviewsVue from '../../compoents/userReviews.vue'; |
|
|
|
import moreGoodsVue from '../../compoents/moreGoods.vue' |
|
|
|
let innerAudioContext2 = null |
|
|
|
export default { |
|
|
|
components: {userReviewsVue,moreGoodsVue}, |
|
|
|
data() { |
|
|
|
return { |
|
|
|
headImg: null, |
|
|
|
swiperCurrent: 1, |
|
|
|
swiperCurrent: 0, |
|
|
|
|
|
|
|
id: null, |
|
|
|
info: {list_images:'', times_list_info: {start:'',end:''}}, |
|
|
|
info: null, |
|
|
|
|
|
|
|
current: 0, |
|
|
|
|
|
|
|
sku: [], |
|
|
|
skuInfo: {}, // 预定门票 |
|
|
|
selectGoods: {}, // 预定的商品 |
|
|
|
@ -229,10 +193,6 @@ |
|
|
|
stratDate:'',endDate: '', selected: [] |
|
|
|
}, |
|
|
|
|
|
|
|
currentAudio: {multimedia_url:'', video_length: 0, currentTime: 0}, |
|
|
|
curPlay: false, |
|
|
|
curPlayCopy: false, |
|
|
|
|
|
|
|
} |
|
|
|
}, |
|
|
|
onShow(options) { |
|
|
|
@ -241,92 +201,22 @@ |
|
|
|
onLoad(options) { |
|
|
|
this.id = options.id; |
|
|
|
this.getInfo(); |
|
|
|
this.getGoodsList() |
|
|
|
this.initPlayer() |
|
|
|
}, |
|
|
|
onHide () { |
|
|
|
if (innerAudioContext2) { |
|
|
|
try { |
|
|
|
innerAudioContext2.pause(); |
|
|
|
innerAudioContext2.destroy() |
|
|
|
innerAudioContext2 = null |
|
|
|
} catch (e) { |
|
|
|
//TODO handle the exception |
|
|
|
} |
|
|
|
} |
|
|
|
}, |
|
|
|
onUnload () { |
|
|
|
if (innerAudioContext2) { |
|
|
|
try { |
|
|
|
innerAudioContext2.pause(); |
|
|
|
innerAudioContext2.destroy() |
|
|
|
innerAudioContext2 = null |
|
|
|
} catch (e) { |
|
|
|
//TODO handle the exception |
|
|
|
} |
|
|
|
} |
|
|
|
// this.getGoodsList() |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
swiperChange (e) { |
|
|
|
this.swiperCurrent = e.detail.current+1 |
|
|
|
this.swiperCurrent = e.detail.current |
|
|
|
}, |
|
|
|
// 获取景点信息 |
|
|
|
getInfo() { |
|
|
|
this.Post({id: this.id},'/api/scenic/getScenicById').then(res => { |
|
|
|
if (res.data.flag == 0) { |
|
|
|
uni.showToast({title: '商品不存在或已下架',icon: 'none'}) |
|
|
|
setTimeout(() => {this.goBack()}, 2000) |
|
|
|
} |
|
|
|
let info = res.data; |
|
|
|
try { |
|
|
|
info.times_list_info = JSON.parse(info.times_list)[0] |
|
|
|
} catch(e) { |
|
|
|
console.log(e) |
|
|
|
info.times_list_info = {start:'',end:''} |
|
|
|
} |
|
|
|
|
|
|
|
if(Array.isArray(info.multimedia)&&info.multimedia.length>0) { |
|
|
|
this.currentAudio.multimedia_url = this.showImg(info.multimedia[0].multimedia_url) |
|
|
|
this.currentAudio.video_length = info.multimedia[0].video_length |
|
|
|
this.currentAudio.currentTime = 0 |
|
|
|
} |
|
|
|
this.info = info |
|
|
|
console.log(info) |
|
|
|
|
|
|
|
let param = { |
|
|
|
sku_id: this.info.id, |
|
|
|
sku_name: this.info.title, |
|
|
|
sku_price: this.info.price/100, |
|
|
|
category_id: this.info.scenic_type_id, |
|
|
|
category_name:this.info.scenic_type_text, |
|
|
|
visitSource: this.getVisitSource() |
|
|
|
} |
|
|
|
|
|
|
|
this.qdTracker('viewProductDetail', param) |
|
|
|
}); |
|
|
|
}, |
|
|
|
// 根据景点id获取商品列表 |
|
|
|
getGoodsList(){ |
|
|
|
this.Post({ |
|
|
|
scenic_id: this.id |
|
|
|
},'/api/scenic/getGoodsByScenicId').then(res => { |
|
|
|
this.sku = res.data || [] |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
// 收藏 2景点 |
|
|
|
collect() { |
|
|
|
this.Post({type: 2,id: this.id},'/api/scenic/collect').then(res => { |
|
|
|
if (res) { |
|
|
|
uni.showToast({title: res.msg,icon: 'none'}); |
|
|
|
this.info.is_collect = !this.info.is_collect |
|
|
|
} |
|
|
|
this.Post({id: this.id},'/api/scene/detail').then(res => { |
|
|
|
this.info = res.data |
|
|
|
this.sku = this.info.product || [] |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
goMap () { |
|
|
|
if (!this.info.tengxun_map) { |
|
|
|
if (!this.info.lat || !this.info.lon) { |
|
|
|
uni.showToast({ |
|
|
|
title: '暂未配置地理位置', |
|
|
|
icon: 'none' |
|
|
|
@ -335,8 +225,8 @@ |
|
|
|
} |
|
|
|
|
|
|
|
uni.openLocation({ |
|
|
|
latitude: Number(this.info.tengxun_map.lat), |
|
|
|
longitude: Number(this.info.tengxun_map.lon), |
|
|
|
latitude: Number(this.info.lat), |
|
|
|
longitude: Number(this.info.lon), |
|
|
|
name: this.info.title, |
|
|
|
address: this.info.address, |
|
|
|
success: function () { |
|
|
|
@ -345,6 +235,10 @@ |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
changeType (item,i) { |
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
showSkuInfo (itemSku,goods) { |
|
|
|
this.skuInfo = itemSku |
|
|
|
this.selectGoods = goods |
|
|
|
@ -450,7 +344,7 @@ |
|
|
|
seldDateIndex: this.seldDateIndex, |
|
|
|
timesArr: this.timesArr, |
|
|
|
seldTimeIndex: this.seldTimeIndex, |
|
|
|
} |
|
|
|
}; |
|
|
|
uni.setStorageSync('ticketOrder', JSON.stringify(param)); |
|
|
|
// that.gotoBuy(pInfo, sInfo); |
|
|
|
uni.navigateTo({ |
|
|
|
@ -467,9 +361,7 @@ |
|
|
|
sInfo.is_third_stock == 0 |
|
|
|
) |
|
|
|
return; |
|
|
|
// that.buryPoint("scene_order"); |
|
|
|
// that.checkIsCanBuy(that.detail.title, |
|
|
|
// function() { |
|
|
|
|
|
|
|
let params = { |
|
|
|
pInfo: pInfo, |
|
|
|
sInfo: sInfo, |
|
|
|
@ -500,13 +392,6 @@ |
|
|
|
sInfo.price; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// }, |
|
|
|
|
|
|
|
// ); |
|
|
|
}, |
|
|
|
|
|
|
|
closePopup() { |
|
|
|
@ -531,66 +416,6 @@ |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
// 播放音频 |
|
|
|
initPlayer () { |
|
|
|
let that = this; |
|
|
|
if (innerAudioContext2) { |
|
|
|
try { |
|
|
|
innerAudioContext.pause(); |
|
|
|
innerAudioContext.destroy() |
|
|
|
innerAudioContext = null |
|
|
|
} catch (e) { |
|
|
|
//TODO handle the exception |
|
|
|
} |
|
|
|
} |
|
|
|
innerAudioContext2 = uni.createInnerAudioContext(); |
|
|
|
innerAudioContext2.autoplay = false; |
|
|
|
innerAudioContext2.onPlay(() => { |
|
|
|
that.curPlay = true |
|
|
|
console.log('play') |
|
|
|
}); |
|
|
|
innerAudioContext2.onError((res) => { |
|
|
|
console.log('error',res.errMsg,res.errCode); |
|
|
|
}); |
|
|
|
innerAudioContext2.onEnded(() => { |
|
|
|
that.pauseVoice() |
|
|
|
that.curPlay = false |
|
|
|
}); |
|
|
|
innerAudioContext2.onTimeUpdate(() => { |
|
|
|
console.log('timeUpdate') |
|
|
|
that.currentAudio.video_length = innerAudioContext2.duration; |
|
|
|
that.currentAudio.currentTime = innerAudioContext2.currentTime; |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
//播放列表音频 |
|
|
|
playVoice(){ |
|
|
|
innerAudioContext2.src = this.currentAudio.multimedia_url |
|
|
|
innerAudioContext2.play() |
|
|
|
}, |
|
|
|
//暂停播放 |
|
|
|
pauseVoice(){ |
|
|
|
innerAudioContext2.pause() |
|
|
|
this.curPlay = false |
|
|
|
}, |
|
|
|
// 拖动结束 |
|
|
|
audioSeek (event) { |
|
|
|
let value = event.detail.value |
|
|
|
innerAudioContext2.seek(value) |
|
|
|
if (this.curPlayCopy) { |
|
|
|
innerAudioContext2.play() |
|
|
|
this.curPlay = this.curPlayCopy |
|
|
|
this.curPlayCopy = false |
|
|
|
} |
|
|
|
}, |
|
|
|
// 拖动 |
|
|
|
audioChanging () { |
|
|
|
// 如果正在播放 |
|
|
|
if (this.curPlay) { |
|
|
|
this.curPlayCopy = this.curPlay |
|
|
|
this.pauseVoice() |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
getTime(time) { |
|
|
|
let m = parseInt(time / 60); |
|
|
|
@ -613,6 +438,13 @@ |
|
|
|
*{ |
|
|
|
box-sizing: border-box; |
|
|
|
} |
|
|
|
::-webkit-scrollbar { |
|
|
|
display: none; |
|
|
|
width: 0 !important; |
|
|
|
height: 0 !important; |
|
|
|
-webkit-appearance: none; |
|
|
|
background: transparent; |
|
|
|
} |
|
|
|
.bg{ |
|
|
|
min-height: 100vh; |
|
|
|
background: #F8F8F8; |
|
|
|
@ -621,58 +453,43 @@ |
|
|
|
.swipe-box { |
|
|
|
height: 413rpx; |
|
|
|
position: relative; |
|
|
|
.swiper { |
|
|
|
height: 413rpx; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.swiper-pointer{ |
|
|
|
position: absolute; |
|
|
|
right: 26rpx; |
|
|
|
bottom: 46rpx; |
|
|
|
background: rgba(22,22,22,0.5); |
|
|
|
border-radius: 23rpx; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
padding: 6rpx 14rpx; |
|
|
|
.swiper-item { |
|
|
|
width: 100%; |
|
|
|
height: 413rpx; |
|
|
|
|
|
|
|
.item-img { |
|
|
|
width: 750rpx; |
|
|
|
height: 413rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.swiper-item-num { |
|
|
|
width: 90rpx; |
|
|
|
height: 40rpx; |
|
|
|
background: rgba(0, 0, 0, 0.5); |
|
|
|
border-radius: 20rpx; |
|
|
|
font-size: 24rpx; |
|
|
|
font-family: PingFangSC-Regular, PingFang SC; |
|
|
|
font-weight: 400; |
|
|
|
color: #ffffff; |
|
|
|
text-align: center; |
|
|
|
line-height: 40rpx; |
|
|
|
.swiper-pointer{ |
|
|
|
position: absolute; |
|
|
|
right: 30rpx; |
|
|
|
bottom: 50rpx; |
|
|
|
right: 10rpx; |
|
|
|
bottom: 40rpx; |
|
|
|
display: flex; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.swiper { |
|
|
|
height: 413rpx; |
|
|
|
position: relative; |
|
|
|
|
|
|
|
.swiper-item { |
|
|
|
width: 100%; |
|
|
|
height: 413rpx; |
|
|
|
|
|
|
|
.item-img { |
|
|
|
width: 750rpx; |
|
|
|
height: 413rpx; |
|
|
|
} |
|
|
|
.cricle{ |
|
|
|
width: 14rpx; |
|
|
|
height: 14rpx; |
|
|
|
background: rgba(255,255,255,0.3); |
|
|
|
border-radius: 50%; |
|
|
|
margin-left: 10rpx; |
|
|
|
} |
|
|
|
.cricle.active{ |
|
|
|
background: white; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.detail-container{ |
|
|
|
width: 100%; |
|
|
|
z-index: 2; |
|
|
|
padding: 26rpx; |
|
|
|
padding: 26rpx 0; |
|
|
|
position: relative; |
|
|
|
top: -52rpx; |
|
|
|
} |
|
|
|
@ -688,33 +505,72 @@ |
|
|
|
font-family: PingFang; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 27rpx; |
|
|
|
color: #000000; |
|
|
|
.time-container{ |
|
|
|
padding: 22rpx 0; |
|
|
|
} |
|
|
|
|
|
|
|
color: #666; |
|
|
|
.info-title{ |
|
|
|
width: 100%; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-size: 31rpx; |
|
|
|
font-size: 33rpx; |
|
|
|
height: 80rpx; |
|
|
|
font-weight: bold; |
|
|
|
color: #000; |
|
|
|
} |
|
|
|
.collect{ |
|
|
|
font-size: 23rpx; |
|
|
|
image{ |
|
|
|
width: 48rpx; |
|
|
|
height: 48rpx; |
|
|
|
|
|
|
|
.tags .tag { |
|
|
|
margin-right: 20rpx; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #6A8A27; |
|
|
|
display: inline-block; |
|
|
|
position: relative; |
|
|
|
.tip{ |
|
|
|
position: absolute; |
|
|
|
left: 0; |
|
|
|
bottom: 4rpx; |
|
|
|
width: 100%; |
|
|
|
background: #EFF7DF; |
|
|
|
height: 8rpx; |
|
|
|
z-index: 2; |
|
|
|
} |
|
|
|
text{ |
|
|
|
position: relative; |
|
|
|
z-index: 5; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.left-container{ |
|
|
|
width: 147rpx; |
|
|
|
flex-shrink: 0; |
|
|
|
.type-item{ |
|
|
|
font-weight: 500; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #000000; |
|
|
|
width: 100%; |
|
|
|
height: 133rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
text-align: center; |
|
|
|
} |
|
|
|
.type-item.active{ |
|
|
|
font-weight: bold; |
|
|
|
font-size: 24rpx; |
|
|
|
color: #6A8A27; |
|
|
|
background: #FFFFFF; |
|
|
|
} |
|
|
|
} |
|
|
|
.right-container{ |
|
|
|
flex: 1; |
|
|
|
width: 1rpx; |
|
|
|
background: white; |
|
|
|
max-height: 1000rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.box-title { |
|
|
|
margin: 60rpx 12rpx 28rpx; |
|
|
|
font-size: 37rpx; |
|
|
|
color: #000000; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: bold; |
|
|
|
font-weight: normal; |
|
|
|
font-size: 35rpx; |
|
|
|
color: #6A8A27; |
|
|
|
} |
|
|
|
|
|
|
|
.address-icon{ |
|
|
|
@ -723,83 +579,76 @@ |
|
|
|
height: 26rpx; |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.scenic-list{ |
|
|
|
padding: 10rpx 10rpx 0; |
|
|
|
.scenic-title{ |
|
|
|
font-weight: bold; |
|
|
|
font-size: 35rpx; |
|
|
|
color: #000000; |
|
|
|
padding-bottom: 20rpx; |
|
|
|
} |
|
|
|
.scenic-item { |
|
|
|
width: 100%; |
|
|
|
height: 187rpx; |
|
|
|
background: #FFFFFF; |
|
|
|
background: rgba(239, 247, 223, 0.5); |
|
|
|
border-radius: 13rpx; |
|
|
|
margin-bottom: 20rpx; |
|
|
|
padding: 26rpx; |
|
|
|
padding: 19rpx 22rpx 10rpx; |
|
|
|
display: flex; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 23rpx; |
|
|
|
color: #666666; |
|
|
|
|
|
|
|
.item-left{ |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
justify-content: space-between; |
|
|
|
padding-left: 20rpx; |
|
|
|
} |
|
|
|
flex-direction: column; |
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
.title { |
|
|
|
width: 100%; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: bold; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 31rpx; |
|
|
|
color: #000000; |
|
|
|
} |
|
|
|
.tags-box { |
|
|
|
overflow: hidden; |
|
|
|
padding-bottom: 6rpx; |
|
|
|
.tags { |
|
|
|
display: flex; |
|
|
|
flex-wrap: nowrap; |
|
|
|
flex: 1; |
|
|
|
} |
|
|
|
.tags view::after { |
|
|
|
content: '丨' |
|
|
|
} |
|
|
|
.tags view:last-of-type:after { |
|
|
|
display: none; |
|
|
|
} |
|
|
|
padding-bottom: 17rpx; |
|
|
|
padding-left: 6rpx; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 23rpx; |
|
|
|
color: #666666; |
|
|
|
} |
|
|
|
.item-right { |
|
|
|
width: 133rpx; |
|
|
|
flex-shrink: 0; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
} |
|
|
|
.price { |
|
|
|
font-family: PingFangSC; |
|
|
|
font-weight: bold; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 36rpx; |
|
|
|
color: #C3282E; |
|
|
|
} |
|
|
|
.price::before { |
|
|
|
display: inline-block; |
|
|
|
content: "￥"; |
|
|
|
font-size: 24rpx; |
|
|
|
font-weight: bold; |
|
|
|
color: #C3282E; |
|
|
|
color: #D62828; |
|
|
|
font-weight: bold; |
|
|
|
&::before { |
|
|
|
display: inline-block; |
|
|
|
content: "￥"; |
|
|
|
font-size: 24rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
.btn { |
|
|
|
margin-top: 20rpx; |
|
|
|
width: 133rpx; |
|
|
|
height: 53rpx; |
|
|
|
background: #C3282E; |
|
|
|
border-radius: 27rpx; |
|
|
|
width: 93rpx; |
|
|
|
height: 80rpx; |
|
|
|
background: #6A8A27; |
|
|
|
border-radius: 13rpx; |
|
|
|
text-align: center; |
|
|
|
line-height: 53rpx; |
|
|
|
font-weight: 500; |
|
|
|
font-family: PingFang SC; |
|
|
|
font-weight: bold; |
|
|
|
font-size: 31rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
line-height: 80rpx; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 31rpx; |
|
|
|
color: #FFFFFF; |
|
|
|
margin-left: 12rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -990,27 +839,7 @@ |
|
|
|
padding-right: 40rpx; |
|
|
|
} |
|
|
|
} |
|
|
|
.map-icon{ |
|
|
|
flex-direction: column; |
|
|
|
height: 80rpx; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
font-weight: 500; |
|
|
|
font-size: 20rpx; |
|
|
|
color: #12293C; |
|
|
|
} |
|
|
|
.audio{ |
|
|
|
.play-icon{ |
|
|
|
height: 51rpx; |
|
|
|
padding-left: 49rpx; |
|
|
|
width: 100rpx; |
|
|
|
image{ |
|
|
|
width: 51rpx; |
|
|
|
height: 51rpx; |
|
|
|
} |
|
|
|
|
|
|
|
} |
|
|
|
} |
|
|
|
/deep/ .uni-calendar-item--extra{ |
|
|
|
color: #333 !important; |
|
|
|
} |
|
|
|
|
jiazhipeng
4 months ago