chenkainan
/
changshu_WeChat
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

首页改版

dev
jiazhipeng 3 months ago
parent
5747c74483
commit
fdd358b25d
8 changed files with 120 additions and 82 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      pages.json
  2. 198
      pages/index/index.vue
  3. BIN
      static/images/home.png
  4. BIN
      static/images/map.png
  5. BIN
      static/images/mine.png
  6. BIN
      static/images/selectHome.png
  7. BIN
      static/images/selectMap.png
  8. BIN
      static/images/selectMine.png

4
pages.json
View File

@ -257,8 +257,8 @@
}
],
"tabBar" : {
"color" : "#999999",
"selectedColor" : "#00AEA0",
"color" : "#CCCCCC",
"selectedColor" : "#2260F6",
"borderStyle" : "black",
"backgroundColor" : "#ffffff",
"fontSize" : "24rpx",

198
pages/index/index.vue
View File

@ -27,11 +27,12 @@
</swiper>
<!-- 常熟精选 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/title1.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<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">
{{item.title}}
<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)">
@ -49,7 +50,7 @@
<!-- 周边特惠活动 -->
<view v-if="calendarItem && calendarItem.id">
<image src="https://static.ticket.sz-trip.com/changshu/images/index/title2.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<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>
@ -63,13 +64,13 @@
</view>
<!-- 旅游助手 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/title3.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<view class="flex-between">
<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/title4.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<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>
@ -78,7 +79,7 @@
</view>
<!-- 热门推荐 -->
<image src="https://static.ticket.sz-trip.com/changshu/images/index/title5.png" mode="heightFix" class="title-img" lazy-load="true"></image>
<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}}
@ -89,11 +90,11 @@
<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="widthFix" class="hot-img" lazy-load="true"></image>
<image src="https://static.ticket.sz-trip.com/changshu/images/index/play.png" mode="widthFix" class="play-img" v-if="typeIndex == 5" lazy-load="true"></image>
<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-overflowRows">{{item.title || item.name}}</view>
<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)"
@ -149,57 +150,57 @@
menuList: [
{
title: '景点门票',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/jdmp.png',
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/fysz.png',
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/wctc.png',
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/jdzs.png',
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://static.ticket.sz-trip.com/changshu/images/index/dygp.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/cgyy.png',
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/ykyw.png',
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/hdrl.png',
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/tsxl.png',
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://static.ticket.sz-trip.com/changshu/images/index/cszb.png',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/2025/summer/cszb.png',
path: '/subPackages/rim/rimList'
}
],
@ -208,8 +209,9 @@
{
title: '景点',
id: '5',
spanColor: '#529AE7',
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'
},
{
@ -217,6 +219,7 @@
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'
}
],
@ -224,55 +227,55 @@
travelList: [
{
title: '聆听常熟',
img: 'https://static.ticket.sz-trip.com/changshu/images/index/lingting.png',
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/yunyou.png',
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/xunwei.png',
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/ggzxc.png',
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/zxts.png',
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/jqssd.png',
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/zcw.png',
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/zcs.png',
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/ggjt.png',
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/ggjt.png',
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'
}
],
@ -600,7 +603,10 @@
.content {
min-height: 100vh;
overflow-x: hidden;
background: #F2FFFE;
// 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;
}
@ -619,7 +625,7 @@
flex-wrap: wrap;
font-weight: 500;
font-size: 24rpx;
color: #111111;
color: #FFFFFF;
&>view {
width: 20%;
@ -643,30 +649,36 @@
}
.title-img {
height: 66.67rpx;
margin: 52rpx 0 24rpx;
// 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: 533rpx;
height: 625rpx;
background: linear-gradient(135deg, rgba(170, 204, 250, .5), rgba(111, 163, 252, .5));
border-radius: 13rpx;
padding: 0 20rpx;
margin-right: 26rpx;
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: 92rpx;
font-weight: normal;
font-size: 40rpx;
color: #0F74D4;
height: 32rpx;
// font-weight: normal;
// font-size: 40rpx;
// color: #0F74D4;
justify-content: baseline;
margin-bottom: 29rpx;
span {
font-size: 27rpx;
@ -714,7 +726,7 @@
.btn {
width: 93rpx;
height: 37rpx;
background: #ED1C19;
background: #FF984F;
border-radius: 19rpx;
text-align: center;
line-height: 37rpx;
@ -727,7 +739,8 @@
}
}
&>view:nth-child(2) {
background: linear-gradient(135deg, rgba(253, 171, 112, .5), rgba(254, 127, 25, .5));
// 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;
@ -739,17 +752,22 @@
}
.calendar-item {
width: 697rpx;
height: 417rpx;
background: rgba(255,255,255,0.6);
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(89,166,160,0.32);
border-radius: 13rpx;
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 {
@ -775,13 +793,13 @@
width: 240rpx;
height: 53rpx;
border-radius: 27rpx;
border: 1rpx solid #CCCCCC;
border: 1rpx solid #fff;
text-align: center;
line-height: 53rpx;
margin: 40rpx auto 0;
font-weight: 500;
font-size: 28rpx;
color: #111111;
color: #fff;
}
.travel-img {
@ -794,16 +812,17 @@
flex-wrap: wrap;
font-weight: 500;
font-size: 25rpx;
color: #111111;
color: #fff;
margin-top: -16rpx;
&>view {
width: 25%;
text-align: center;
image {
width: 57.33rpx;
height: 57.33rpx;
margin-bottom: 15rpx;
width: 117.33rpx;
height: 104rpx;
margin-bottom: 6.67rpx;
}
}
&>view:nth-child(n+5) {
@ -812,27 +831,41 @@
}
.hot-type {
font-weight: 500;
font-size: 31rpx;
color: #666666;
.type-active {
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: #111111;
position: relative;
color: #FFFFFF;
}
.type-active::after {
content: "";
position: absolute;
left: 0;
right: 0;
bottom: -10rpx;
margin: auto;
width: 35rpx;
height: 2px;
background-color: #00C1B1;
.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 {
@ -848,9 +881,12 @@
.hot-item {
width: 340rpx;
background: rgba(255,255,255,0.6);
box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(89,166,160,0.32);
border-radius: 13rpx;
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;
@ -859,6 +895,7 @@
.hot-img {
width: 340rpx;
height: 266.67rpx;
}
.play-img {
@ -889,11 +926,12 @@
.tag {
height: 37rpx;
border: 1rpx solid #82DFD8;
border-radius: 19rpx;
border: 1px solid #2260F6;
padding: 0 10rpx;
font-weight: 500;
font-size: 24rpx;
color: #00AEA0;
color: #2260F6;
overflow-y: hidden;
}
.tag:nth-child(2) {

BIN
static/images/home.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 6.6 KiB

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
static/images/map.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
static/images/mine.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 8.7 KiB

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
static/images/selectHome.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 15 KiB

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
static/images/selectMap.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 18 KiB

After

Width:  |  Height:  |  Size: 5.7 KiB

BIN
static/images/selectMine.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 14 KiB

After

Width:  |  Height:  |  Size: 4.3 KiB

Write Preview
Loading…
Cancel
Save