chenkainan
/
changshu_WeChat
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
常熟
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.
70 Commits
2 Branches
0 Tags
2.9 MiB
 
 
 
 
Tree: bdecc22400
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'bdecc22400'
${ noResults }
changshu_WeChat/pages/index/index.vue

1014 lines
28 KiB
Raw Blame History

<template>
<view class="content" v-if="isShow">
<view style="height: 20rpx;"></view>
<view class="back_search" @tap="goPath({path:'/subPackages/search/search'})" >
<image class="search_image"
:src="showImg('/uploads/20250721/b1435669ed4396a078a507c03de883e5.png')"></image>
<span class="search_text">请输入搜索关键字</span>
</view>
<!-- 头部banner -->
<view class="top-box">
<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" lazy-load="true"></image>
</swiper-item>
</swiper>
</view>
<!-- 金刚区 -->
<view class="menu-box flex-between">
<view v-for="(item,index) in menuList" :key="index" @click="goPath(item)">
<image :src="item.img" mode="aspectFill" lazy-load="true"></image>
<view>{{item.title}}</view>
</view>
</view>
<!-- 小banner -->
<swiper class="small-banner" :circular="true" :interval="6000"
:duration="800" :indicator-dots="false" :autoplay="true" v-if="smallBanner">
<swiper-item v-for="(item, index) in smallBanner" :key="index" @click.stop="gotoUrlNew(item)">
<image class="small-banner" :src="showImg(item.head_img)" mode="aspectFill" lazy-load="true"></image>
</swiper-item>
</swiper>
<!-- 常熟精选 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/title1.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="winnow-box">
<view v-for="(item,index) in winnowList" :key="index">
<view class="winnow-title flex-between">
<image style="height: 32rpx;" mode="heightFix" :src="item.titleImg"></image>
<span :style="{color: item.spanColor}" @click.stop="gotoPath(item.path)">查看更多产品 ></span>
</view>
<view class="winnow-item" v-for="(pItem, pIndex) in item.list" :key="pIndex" @click="gotoDetailByTypeToJdsz(pItem)">
<image :src="showImgs(pItem.headimg)" mode="aspectFill" class="winnow-img" lazy-load="true"></image>
<view class="winnow-content flex-column">
<view class="title text-overflowRows">{{pItem.title}}</view>
<view class="price-box flex-between">
<view class="price">{{pItem.price / 100}}</view>
<view class="btn">购买</view>
</view>
</view>
</view>
</view>
</view>
<!-- 周边特惠活动 -->
<view v-if="calendarItem && calendarItem.id">
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/title2.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="calendar-item" @click="gotoWebUrl(calendarItem)">
<image :src="showImg(calendarItem.image)" mode="aspectFill" class="calendar-img" lazy-load="true"></image>
<view class="calendar-content flex-column">
<view class="title text-overflow">{{calendarItem.title}}</view>
<view class="subtitle text-overflow">活动时间：{{ calendarItem.start_time }}—{{ calendarItem.end_time }}</view>
</view>
</view>
<view class="calendar-more" @click="gotoPath('/subPackages/peripheralActivity/peripheralActivity')">查看更多</view>
</view>
<!-- 旅游助手 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/title3.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="flex-between" style="margin-top: -16rpx;">
<image :src="item.img" mode="aspectFill" class="travel-img" v-for="(item,index) in travelList" :key="index" @click="goPath(item)" lazy-load="true"></image>
</view>
<!-- 公共服务 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/title4.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="public-box">
<view v-for="(item,index) in publicList" :key="index" @click="goPath(item)">
<image :src="item.img" mode="aspectFill" lazy-load="true"></image>
<view>{{item.title}}</view>
</view>
</view>
<!-- 热门推荐 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/title5.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="hot-type flex-between">
<view v-for="(item,index) in hotType" :key="index" :class="index == typeIndex ? 'type-active' : ''" @click="changeType(index)">
{{item.title}}
</view>
</view>
<view class="hot-box">
<view class="hot-column" v-for="(column, index) in 2" :key="index">
<view v-for="(item,indexs) in getColumnItems(index)" :key="indexs" class="hot-item" @click="gotoHotDetail(item)">
<view class="image-container">
<image :src="item.src" mode="aspectFill" class="hot-img" lazy-load="true"></image>
<image src="https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/play.png" mode="widthFix" class="play-img" v-if="typeIndex == 5" lazy-load="true"></image>
</view>
<view class="hot-content">
<view class="title text-overflow">{{item.title || item.name}}</view>
<view class="tags" v-if="item.display_tags && typeIndex == 0">
<view class="tag text-overflow"
v-for="(tags,tagsIndex) in item.display_tags.split(',').slice(0,2)"
:key="tagsIndex">{{tags}}</view>
</view>
<view class="subtitle text-overflow" v-if="typeIndex == 1">
{{ item.start_time }}—{{ item.end_time }}
</view>
<view class="price" v-if="typeIndex == 2 || typeIndex == 4">
￥{{ item.price / 100 }}
</view>
<view class="subtitle text-overflow" v-if="typeIndex == 3">{{item.cateType}}</view>
</view>
</view>
</view>
</view>
</view>
<view class="content" v-else>
<!-- 头部banner -->
<view class="top-box">
<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">
<image class="top-banner" :src="showImg(item.head_img)" mode="aspectFill" lazy-load="true"></image>
</swiper-item>
</swiper>
</view>
<!-- 金刚区 -->
<view class="menu-box flex-between">
<view v-for="(item,index) in menuList" :key="index" @click="goPath(item)" v-if="[5,6,7].includes(index)">
<image :src="item.img" mode="aspectFill" lazy-load="true"></image>
<view>{{item.title}}</view>
</view>
</view>
<!-- 小banner -->
<swiper class="small-banner" :circular="true" :interval="6000"
:duration="800" :indicator-dots="false" :autoplay="true" v-if="smallBanner">
<swiper-item v-for="(item, index) in smallBanner" :key="index">
<image class="small-banner" :src="showImg(item.head_img)" mode="aspectFill" lazy-load="true"></image>
</swiper-item>
</swiper>
</view>
</template>
<script>
export default {
data() {
return {
topBanner: [],
menuList: [
{
title: '景点门票',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/jdmp.png',
path: '',
url: 'https://m.cloud.sz-trip.com/AttractionsTickets'
},
{
title: '非遗手作',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/fysz.png',
path: '/subPackages/other/feiyi',
},
{
title: '文创特产',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/wctc.png',
path: '',
url: 'https://m.cloud.sz-trip.com/CulturalCreation',
},
{
title: '酒店住宿',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/jdzs.png',
path: '',
url: 'https://m.cloud.sz-trip.com/nightMooring',
},
{
title: '电影购票',
img: "https://changshu.js-dyyj.com/uploads/20250710/f56d7812dbefa3526b3f3653cd8b93b0.png",
// img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/dygp.png',
url: 'https://m.cloud.sz-trip.com/MoviesChangShu',
},
{
title: '场馆预约',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/cgyy.png',
path: '/subPackages/venue/venueList'
},
{
title: '一卡游玩',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/ykyw.png',
path: '',
shortLink: '#小程序://旅游年卡/bgJOy4DGeuOXBMg',
},
{
title: '活动日历',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/hdrl.png',
path: '/subPackages/eventCalendar/eventCalendar'
},
{
title: '特色线路',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/tsxl.png',
path: '',
url: 'https://m.cloud.sz-trip.com/OneDayTravelNew',
},
{
title: '常熟周边',
img: "https://changshu.js-dyyj.com/uploads/20250710/0bbce4dc23632d14cc3ff59134f82dba.png",
// img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/cszb.png',
path: '/subPackages/rim/rimList'
}
],
smallBanner: [],
winnowList: [
{
title: '景点',
id: '5',
spanColor: '#2260F6',
list: [],
titleImg: "https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/JXTitle1.png",
path: '/subPackages/webPage/webPage?url=https://m.cloud.sz-trip.com/AttractionsTickets'
},
{
title: '特产',
id: '11',
spanColor: '#EE710C',
list: [],
titleImg: "https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/JXTitle2.png",
path: '/subPackages/webPage/webPage?url=https://m.cloud.sz-trip.com/CulturalCreation'
}
],
calendarItem: {},
travelList: [
{
title: '聆听常熟',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/lingting.png',
path: '/subPackages/webPage/webPage?url='+encodeURIComponent("https://qyly1.csly-travel.com/qytshopwebchat/#/jiangKouTheme/soundNew?pageId=966&miniKey=70&source=APPLET_CHANGSHU")
},
{
title: '云游常熟',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/yunyou.png',
path: '/subPackages/other/virtual'
},
{
title: '寻味常熟',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/xunwei.png',
path: '/subPackages/other/foodList'
}
],
publicList: [
{
title: '公共自行车',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/ggzxc.png',
path: '/subPackages/other/gonggtcc'
},
{
title: '公共咨询',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/zxts.png',
path: '/subPackages/other/consulting'
},
{
title: '景区舒适度',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/jqssd.png',
path: '/subPackages/other/shusd'
},
{
title: '找车位',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/zcw.png',
path: '/subPackages/other/tingchechang'
},
{
title: '找厕所',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/zcs.png',
path: '/subPackages/other/fjtcc'
},
{
title: '公共交通',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/ggjt.png',
path: '/subPackages/webPage/webPage?url='+encodeURIComponent('https://www.changshuxing.cn/csxing-h5/pages/wentilv/index.html')
// path: '/subPackages/other/gonggjt'
},
{
title: '文物资源',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/wwzy.png',
path:'/subPackages/webPage/webPage?url=https://changshuwwaq.hwtcloud.cn/wechat/home'
}
],
hotType: [
{title: '景点', id: '25'},
{title: '活动', id: '617'},
{title: '文创', id: '26'},
{title: '非遗', id: '619'},
{title: '线路', id: '27'},
{title: '视频', id: '18'}
],
typeIndex: 0,
hotList: [],
pageNo: 1,
limit: 6,
isLoading: false,
isShow: true
}
},
onLoad() {
},
onShow() {
// 后台文章id 4,副标题(subtitle)和地址(address)切换
this.Post({
id: 4
},'/api/article/getArticleById').then(res => {
this.isShow = res.data.subtitle == 1 ? true : false
// this.isShow = res.data.address == 1 ? true : false
})
},
onReady() {
this.getBanner()
this.getWinnowList()
this.getCalendarList()
this.changeType(0)
this.getLocation()
},
onReachBottom() {
setTimeout(() => {
if (!this.isLoading) this.getHotList();
}, 1000);
},
methods: {
goPath (item) {
if (item.shortLink) {
uni.navigateToMiniProgram({
shortLink: item.shortLink
})
}
if (item.url) {
let isJDSZ = this.goJDSZMiniProgram(item.url)
if (isJDSZ) return
uni.navigateTo({
url: '/subPackages/webPage/webPage?url=' + encodeURIComponent(item.url)
});
}
if(item.path) {
this.gotoPath(item.path)
}
if(!item.url && !item.path && !item.shortLink) {
uni.showToast({
title: '开发中',
icon: 'none'
})
}
},
// banner跳转
// 2是各种详情页，3是列表专题页面，4是小程序
gotoUrlNew(item) {
console.log(item);
let that = this;
let url = '';
switch (item.jump_type) {
case 0:
break;
case 2:
uni.navigateTo({
url: item.tdata
});
break;
case 3:
let isJDSZ = this.goJDSZMiniProgram(item.tdata)
if (isJDSZ) return
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;
}
},
// 判断是否跳转君到苏州专题页
goJDSZMiniProgram (tpage) {
if (tpage.indexOf('m.cloud.sz-trip.com') > -1) {
// 如果已登录但没有手机号，直接去授权页面
let userInfo = null
try {
userInfo = JSON.parse(uni.getStorageSync('userInfo'))
} catch(e) {}
if (userInfo && userInfo.token && !userInfo.mobile) {
uni.showToast({
title: '未授权手机号',
icon: 'none'
})
// 去登录页面授权
setTimeout(()=>{
uni.navigateTo({
url: '/pages/login/login?needAuth=1'
})
},200)
return true
}
uni.navigateTo({
url: '/subPackages/webPage/webPage?url=' + encodeURIComponent(`${tpage}?token=2d50b941-e204-4e5d-97c9-868430711459`)
});
// 获取授权code
// this.checkIsLoginJdsz().then(res => {
// if(res) {
// uni.navigateTo({
// url: '/subPackages/webPage/webPage?url=' + encodeURIComponent(`${tpage}?token=` + res)
// });
// }
// })
return true
}
return false
},
// 瀑布流
getColumnItems(columnIndex) {
const columnItems = [];
this.hotList.forEach((item, index) => {
switch (this.typeIndex) {
case 1:
item.src = this.showImg(item.image);
break;
case 3:
item.src = item.typeImg == '' || item.typeImg == null ? 'https://qyly1.csly-travel.com/r/cms/www/m/changshu/noimg.png' : this.$geturl480(item.typeImg)
break
case 5:
item.src = this.showImg(item.head_img);
break;
default:
item.src = item.headimg;
}
if (index % 2 === columnIndex) {
columnItems.push(item);
}
});
return columnItems;
},
getBanner() {
// 获取顶部banner
this.Post({
type_id: 3,
position: 6,
}, '/api/adv/getAdv').then(res => {
if(res) {
this.topBanner = res.data
}
})
// 小banner
this.Post({
type_id: 3,
position: 1,
}, '/api/adv/getAdv').then(res => {
if(res) {
this.smallBanner = res.data
}
})
},
// 获取景点和特产
getWinnowList() {
this.winnowList.map((item,index) => {
this.Post({
apiType: 'jdsz',
tag_id: item.id,
offset: 0,
limit: 3,
}, index ? '/api/product/get_product_by_tag_partners' : '/api/scene/get_scene_by_tag_partners').then(res => {
if(res) {
item.list = res.data.list
}
})
})
},
// 周边特惠活动
getCalendarList() {
this.Post({
date: '',
offset: 0,
limit: 1,
type_id: 6
},'/api/activity/getActivityCalendar').then(res => {
this.calendarItem = res.data[0]
})
},
getNowTime(time, type) {
var date = time,
year = date.getFullYear(),
month = date.getMonth() + 1,
day = date.getDate(),
hour = date.getHours() < 10 ? "0" + date.getHours() : date.getHours(),
minute = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes(),
second = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
month >= 1 && month <= 9 ? (month = "0" + month) : "";
day >= 0 && day <= 9 ? (day = "0" + day) : "";
if (type == 1) {
if(uni.getSystemInfoSync().platform == 'ios'){
var timer = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second;
}else{
var timer = year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
}
} else {
var timer = year + '/' + month + '/' + day;
}
return timer;
},
// 更改热门推荐类型
changeType(index) {
this.typeIndex = index
this.pageNo = 1
this.isLoading = false
this.hotList = []
this.getHotList()
},
getHotList() {
if(this.typeIndex == 1) {
this.Post({
date: this.getNowTime(new Date()),
offset: this.hotList.length,
limit:this.limit,
type_id: 7,
}, '/api/activity/getActivityCalendar').then(res => {
if(res) {
if(res.data.length < this.limit) this.isLoading = true
this.hotList = this.hotList.concat(res.data)
}
})
}else if(this.typeIndex == 3) {
this.Post({
apiType: 'old',
channelIds: 76,
first: this.hotList.length,
count: this.limit
}, '/json/content_list.jspx').then(res => {
if(res) {
if(res.length < this.limit) this.isLoading = true
const newArr = [...this.hotList];
for (const item of res) {
let isDuplicate = false;
for (const existingItem of newArr) {
if (existingItem.id === item.id) {
isDuplicate = true;
break;
}
}
if (!isDuplicate) {
newArr.push(item);
}
}
this.hotList = newArr
}
})
}else if(this.typeIndex == 5) {
// 视频
this.Post({
tag_id: this.hotType[this.typeIndex].id,
page: this.pageNo,
limit: this.limit,
}, '/api/multimedia/getMultimediaListByTag').then(res => {
if(res) {
if(res.data.length < this.limit) this.isLoading = true
this.hotList = this.hotList.concat(res.data)
this.pageNo++
}
})
}else if(this.typeIndex == 2 || this.typeIndex == 4) {
this.Post({
apiType: 'jdsz',
tag_id: this.hotType[this.typeIndex].id,
offset: this.hotList.length,
limit: this.limit,
}, '/api/product/get_product_by_tag_partners').then(res => {
if(res) {
if(res.data.list.length < this.limit) this.isLoading = true
this.hotList = this.hotList.concat(res.data.list)
}
})
}else {
this.Post({
apiType: 'jdsz',
tag_id: this.hotType[this.typeIndex].id,
offset: this.hotList.length,
limit: this.limit,
}, '/api/scene/get_scene_by_tag_partners').then(res => {
if(res) {
if(res.data.list.length < this.limit) this.isLoading = true
this.hotList = this.hotList.concat(res.data.list)
}
})
}
},
gotoHotDetail(item) {
if(this.typeIndex == 1) {
// 活动
uni.navigateTo({
url:'/subPackages/eventCalendar/detail?id='+item.id
})
}else if(this.typeIndex == 3) {
uni.navigateTo({
url:'/subPackages/other/foodDetail?id='+item.id
})
}else if(this.typeIndex == 5) {
// 视频
uni.navigateTo({
url: '/subPackages/video/video?item=' + encodeURIComponent(JSON.stringify(item))
})
}else {
this.gotoDetailByTypeToJdsz(item)
}
}
}
}
</script>
<style lang="scss" scoped>
.content {
min-height: 100vh;
overflow-x: hidden;
// background: #F2FFFE;
background-image: url("https://static.ticket.sz-trip.com/uploads/20250709/d12a86f95b15f73f3b8ec7784a233d11.png");
background-size: 100% auto;
background-repeat: repeat-y;
padding: 0 26.67rpx 66rpx;
}
.back_search {
width: 100%;
height: 67rpx;
background: #ffffff;
opacity: 0.5;
border-radius: 33rpx;
.search_image {
width: 31rpx;
height: 31rpx;
margin: 18rpx 0 0 20rpx;
}
.search_text {
height: 23rpx;
font-size: 24rpx;
font-family: PingFang SC;
font-weight: 500;
color: #999999;
line-height: 16rpx;
margin: 22rpx 0 0 18rpx;
position: absolute;
}
}
.top-box {
margin-top: 26.67rpx;
.top-banner {
width: 100%;
height: 367rpx;
border-radius: 13rpx;
}
}
.menu-box {
margin: 40rpx 0 40rpx;
flex-wrap: wrap;
font-weight: 500;
font-size: 24rpx;
color: #FFFFFF;
&>view {
width: 20%;
text-align: center;
image {
width: 93.33rpx;
height: 93.33rpx;
margin-bottom: 17rpx;
}
}
&>view:nth-child(n+6) {
margin-top: 24rpx;
}
}
.small-banner {
width: 697rpx;
height: 153rpx;
border-radius: 13rpx;
}
.title-img {
// height: 66.67rpx;
// margin: 52rpx 0 24rpx;
height:100rpx;
margin: 52rpx 0 0;
}
.winnow-box {
width: calc(100vw - 26.67rpx);
display: flex;
overflow-x: auto;
margin-top: -16rpx;
&>view {
width: 555.33rpx;
height: 646.67rpx;
// background: linear-gradient(135deg, rgba(170, 204, 250, .5), rgba(111, 163, 252, .5));
background-image: url("https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/JXBG1.png");
background-size: 100% 100%;
// border-radius: 13rpx;
padding: 38rpx 30rpx 0;
// margin-right: 26rpx;
flex-shrink: 0;
.winnow-title {
height: 32rpx;
// font-weight: normal;
// font-size: 40rpx;
// color: #0F74D4;
justify-content: baseline;
margin-bottom: 29rpx;
span {
font-size: 27rpx;
}
}
.winnow-item {
width: 493rpx;
height: 153rpx;
background: #FFFFFF;
border-radius: 13rpx;
display: flex;
margin-bottom: 20rpx;
.winnow-img {
width: 157rpx;
height: 153rpx;
border-radius: 13rpx 0rpx 0rpx 13rpx;
}
.winnow-content {
margin-left: 13rpx;
width: 310rpx;
height: 153rpx;
padding: 12rpx 0;
justify-content: space-between;
.title {
font-weight: 500;
font-size: 27rpx;
color: #333333;
}
.price-box {
.price {
font-weight: bold;
font-size: 30rpx;
color: #ED1C19;
}
.price::before {
content: '￥';
font-size: 24rpx;
}
.btn {
width: 93rpx;
height: 37rpx;
background: #FF984F;
border-radius: 19rpx;
text-align: center;
line-height: 37rpx;
font-weight: 500;
font-size: 27rpx;
color: #FFFFFF;
}
}
}
}
}
&>view:nth-child(2) {
// background: linear-gradient(135deg, rgba(253, 171, 112, .5), rgba(254, 127, 25, .5));
background-image: url("https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/JXBG2.png");
.winnow-title {
color: #EE710C;
}
}
}
.winnow-box::-webkit-scrollbar {
display: none;
}
.calendar-item {
width: 718.67rpx;
height: 439.33rpx;
// background: rgba(255,255,255,0.6);
// box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(89,166,160,0.32);
background-image: url("https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/THBG.png");
background-size: 100% 100%;
// border-radius: 13rpx;
overflow: hidden;
margin-top: -16rpx;
padding: 8rpx 11.33rpx 0 10.67rpx;
.calendar-img {
width: 100%;
height: 300rpx;
display: block;
border-radius: 27rpx 27rpx 0rpx 0rpx;
}
.calendar-content {
height: 117rpx;
padding: 0 20rpx;
justify-content: space-around;
.title {
font-weight: bold;
font-size: 31rpx;
color: #111111;
}
.subtitle {
font-weight: 500;
font-size: 24rpx;
color: #111111;
}
}
}
.calendar-more {
width: 240rpx;
height: 53rpx;
border-radius: 27rpx;
border: 1rpx solid #fff;
text-align: center;
line-height: 53rpx;
margin: 40rpx auto 0;
font-weight: 500;
font-size: 28rpx;
color: #fff;
}
.travel-img {
width: 220rpx;
height: 173.33rpx;
}
.public-box {
display: flex;
flex-wrap: wrap;
font-weight: 500;
font-size: 25rpx;
color: #fff;
margin-top: -16rpx;
&>view {
width: 25%;
text-align: center;
image {
width: 117.33rpx;
height: 104rpx;
margin-bottom: 6.67rpx;
}
}
&>view:nth-child(n+5) {
margin-top: 40rpx;
}
}
.hot-type {
margin-top: -16rpx;
&>view{
width: 107rpx;
height: 60rpx;
background: linear-gradient(180deg, #6DE1FF, #45B1FF);
box-shadow: 0rpx 1rpx 4rpx 0rpx rgba(2,115,176,0.36);
border-radius: 20rpx;
text-align: center;
line-height: 60rpx;
box-sizing: border-box;
font-weight: bold;
font-size: 31rpx;
color: #FFFFFF;
}
.type-active {
// font-weight: bold;
// font-size: 31rpx;
// color: #111111;
// position: relative;
background: linear-gradient(180deg, #FCFBC9, #FFEF26);
box-shadow: 0rpx 1rpx 4rpx 0rpx rgba(2,115,176,0.36);
color: #111111;
}
// .type-active::after {
// content: "";
// position: absolute;
// left: 0;
// right: 0;
// bottom: -10rpx;
// margin: auto;
// width: 35rpx;
// height: 2px;
// background-color: #00C1B1;
// }
}
.hot-box {
margin-top: 30rpx;
display: flex;
justify-content: space-between;
.hot-column {
width: 340rpx;
display: flex;
flex-direction: column;
}
.hot-item {
width: 340rpx;
height: 400rpx;
background: rgba(255,255,255,0.7);
box-shadow: 0rpx 3rpx 11rpx 0rpx rgba(1,95,145,0.39);
// background-image: url("https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/RMBG.png");
// background-size: 100% 100%;
border-radius: 27rpx;
overflow: hidden;
margin-bottom: 20rpx;
.image-container {
position: relative;
.hot-img {
width: 340rpx;
height: 266.67rpx;
}
.play-img {
width: 66.67rpx;
height: 66.67rpx;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
.hot-content {
padding: 10rpx 15rpx 20rpx;
.title {
font-weight: bold;
font-size: 31rpx;
color: #111111;
}
&>view:nth-child(2) {
margin-top: 15rpx;
}
.tags {
display: flex;
.tag {
height: 37rpx;
border-radius: 19rpx;
border: 1px solid #2260F6;
padding: 0 10rpx;
font-weight: 500;
font-size: 24rpx;
color: #2260F6;
overflow-y: hidden;
}
.tag:nth-child(2) {
margin-left: 10rpx;
}
}
.subtitle {
font-weight: 500;
font-size: 24rpx;
color: #666666;
}
.price {
font-weight: bold;
font-size: 31rpx;
color: #ED1C18;
}
}
}
}
</style>