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.
319 lines
9.6 KiB
319 lines
9.6 KiB
<template>
|
|
<view class="centent">
|
|
<view class="topbg">
|
|
<view class="bgjb">
|
|
<image :src="$getimg('djcp-bg.png')"></image>
|
|
</view>
|
|
<view class="bgjb-jb">
|
|
<image :src="$getimg('djcp-bg-jb.png')"></image>
|
|
</view>
|
|
</view>
|
|
<view class="tbb">
|
|
<view class="tbboxs" v-for="(el,ind) in zslist" :key="ind">
|
|
<view class="tboxbot" :style="{background: 'url('+el.siteUrl+el.typeImg+') no-repeat'}"
|
|
@click="goto(el.link)">
|
|
<image :src="$getimg('720qj.png')" mode="" class="bot-img"></image>
|
|
<view class="tbtitle">
|
|
<view class="tbname">{{el.title}}</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
city:'云游常熟',
|
|
statusBarHeight: 0,
|
|
info: {
|
|
color: true,
|
|
num: false,
|
|
name:'云游常熟'
|
|
},
|
|
id: 97,
|
|
first: 0,
|
|
count: 50,
|
|
lmdata: [],
|
|
alldata: [],
|
|
xwwfind: 0,
|
|
// dc5z497skfk,dbbz007skfz
|
|
zslist:[
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dc5z497skfk.720yun.com/t/51vk6mqbgih?scene_id=106687067","title":"沙家浜风景区 ","tagStr":"沙家浜,风景区","typeImg":"/u/cms/www/202305/2516563241wi.jpg","id":334,"url":"https://dc5z497skfk.720yun.com/t/51vk6mqbgih?scene_id=106687067","topLevel":10,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://0b3m144u1t6.720yun.com/t/050j5shyzk5?scene_id=21965561","title":"虞山风景区","tagStr":"虞,山风,景区","typeImg":"/u/cms/www/202305/251657029wlx.jpg","id":321,"releaseDate":"2021-09-09 13:23:49.0","sortDate":"2021-09-09 13:23:49.0","url":"https://0b3m144u1t6.720yun.com/t/050j5shyzk5?scene_id=21965561","topLevel":9,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://529m5b6u15i.720yun.com/t/dcvkub1yO8h","title":"尚湖风景区","tagStr":"尚,湖,风景区","typeImg":"/u/cms/www/202305/25165720cyrq.jpg","id":322,"releaseDate":"2021-09-09 13:24:07.0","sortDate":"2021-09-09 13:24:07.0","url":"https://529m5b6u15i.720yun.com/t/dcvkub1yO8h","topLevel":8,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dc5z497skfk.720yun.com/t/0avk6mf908e?scene_id=106710365","title":"蒋巷乡村旅游景区","tagStr":"蒋,巷,乡村,旅游,景区","typeImg":"/u/cms/www/202305/25165736jc2o.jpg","id":335,"releaseDate":"2020-10-27 10:10:32.0","sortDate":"2020-10-27 10:10:32.0","url":"https://dc5z497skfk.720yun.com/t/0avk6mf908e?scene_id=106710365","topLevel":7,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://c8dmf6eu1er.720yun.com/t/9bvkcwrwgph?scene_id=63708131#scene_id=63708131","title":"方塔古迹名胜区 ","tagStr":"方,塔,生态园","typeImg":"/u/cms/www/202109/091334268bqd.jpg","id":323,"releaseDate":"2021-09-09 13:24:24.0","sortDate":"2021-09-09 13:24:24.0","url":"https://c8dmf6eu1er.720yun.com/t/9bvkcwrwgph?scene_id=63708131#scene_id=63708131","topLevel":6,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dc5z497skfk.720yun.com/t/dcvk6mdm77m?scene_id=107009036","title":"梅李聚沙园景区 ","tagStr":"梅,李,聚,沙,园,景区","typeImg":"/u/cms/www/202305/251659017jxt.jpg","id":336,"releaseDate":"2020-10-27 10:11:11.0","sortDate":"2020-10-27 10:11:11.0","url":"https://dc5z497skfk.720yun.com/t/dcvk6mdm77m?scene_id=107009036","topLevel":5,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dc5z497skfk.720yun.com/t/77vk6mdhzpe?scene_id=107019380","title":"古里红豆山庄景区","tagStr":"古,里,红豆,山庄,景区","typeImg":"/u/cms/www/202305/25165939vtvt.jpg","id":333,"releaseDate":"2020-10-27 10:07:02.0","sortDate":"2020-10-27 10:07:02.0","url":"https://dc5z497skfk.720yun.com/t/77vk6mdhzpe?scene_id=107019380","topLevel":4,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dbbz007skfz.720yun.com/t/ecvkiyd9zry?scene_id=40156097","title":"常熟文庙","tagStr":"常熟,文庙","typeImg":"/u/cms/www/202101/131604371utp.jpg","id":337,"releaseDate":"2020-10-27 10:12:05.0","sortDate":"2020-10-27 10:12:05.0","url":"https://dbbz007skfz.720yun.com/t/ecvkiyd9zry?scene_id=40156097","topLevel":3,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://633m500u1ea.720yun.com/t/7evkOyfedq9#scene_id=53555443","title":"燕园（灵宫殿戏楼）","tagStr":"燕园,灵,宫殿,戏楼","typeImg":"/u/cms/www/202109/09134025ec9x.jpg","id":325,"releaseDate":"2021-09-09 13:25:04.0","sortDate":"2021-09-09 13:25:04.0","url":"https://633m500u1ea.720yun.com/t/7evkOyfedq9#scene_id=53555443","topLevel":2,},
|
|
{"siteUrl":"https://qyly1.csly-travel.com/","link":"https://dbbz007skfz.720yun.com/t/b1vkc72h72b?scene_id=64824933","title":"言子旧宅","tagStr":"言,子,旧宅","typeImg":"/u/cms/www/202305/25170115s5al.jpg","id":324,"releaseDate":"2021-09-09 13:24:46.0","sortDate":"2021-09-09 13:24:46.0","url":"https://dbbz007skfz.720yun.com/t/b1vkc72h72b?scene_id=64824933","topLevel":1,}]
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
// this.getData();
|
|
// this.getDatalist();
|
|
},
|
|
onReady() {
|
|
//获取手机状态栏高度
|
|
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'];
|
|
},
|
|
|
|
onPageScroll(e) {
|
|
if (e.scrollTop > 50 && !this.info.num) {
|
|
this.info.num = true;
|
|
}
|
|
if (e.scrollTop < 50 && this.info.num) {
|
|
this.info.num = false;
|
|
}
|
|
},
|
|
methods: {
|
|
goto(link){
|
|
uni.navigateTo({
|
|
url: '/subPackages/webPage/webPage?url=' + link
|
|
});
|
|
},
|
|
geturl(url) {
|
|
return 'http://cscmp.tour-ma.com' + url;
|
|
},
|
|
ckxwwfind(ind, id) {
|
|
this.xwwfind = ind;
|
|
},
|
|
getData() {
|
|
this.Post({
|
|
apiType: 'old',
|
|
id: this.id
|
|
},'/json/channel_get.jspx').then(res => {
|
|
if (res) {
|
|
this.nowdata = res;
|
|
} else {
|
|
uni.showToast({
|
|
title: '查询失败'
|
|
});
|
|
}
|
|
})
|
|
},
|
|
getDatalist() {
|
|
this.Post({
|
|
apiType: 'old',
|
|
channelIds: this.id,
|
|
first: this.first,
|
|
count: this.count
|
|
}, '/json/content_list.jspx').then(res => {
|
|
if (res) {
|
|
if (res.length == 0) {
|
|
return
|
|
}
|
|
for (var i = 0; i < res.length; i++) {
|
|
this.zslist.push(res[i]);
|
|
}
|
|
} else {
|
|
uni.showToast({
|
|
title: '查询失败'
|
|
});
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
$url:'https://qyly1.csly-travel.com/r/cms/www/m/changshu/';
|
|
.cityicon{
|
|
width: calc(100% - 167rpx);
|
|
font-size: 32upx;
|
|
color: #FFFFFF;
|
|
left: 80upx;
|
|
display: flex;
|
|
align-items: center;
|
|
position: absolute;
|
|
z-index: 9999;
|
|
height: 80rpx;
|
|
justify-content: center;
|
|
}
|
|
.centent {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 750upx;
|
|
overflow-y: scroll;
|
|
|
|
.topbg {
|
|
width: 100%;
|
|
position: relative;
|
|
|
|
.bgjb {
|
|
width: 100%;
|
|
height: 350rpx;
|
|
position: absolute;
|
|
z-index: -2;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 350rpx;
|
|
}
|
|
}
|
|
|
|
.bgjb-jb {
|
|
position: absolute;
|
|
top: 150rpx;
|
|
z-index: -1;
|
|
width: 100%;
|
|
|
|
image {
|
|
width: 100%;
|
|
height: 250rpx;
|
|
}
|
|
}
|
|
}
|
|
.tbb{
|
|
width: 100%;
|
|
height: 100%;
|
|
.tbboxs:nth-child(1) {
|
|
margin-top: 50rpx;
|
|
}
|
|
}
|
|
.tbboxs {
|
|
max-width: 690upx;
|
|
height: 449upx;
|
|
margin: auto;
|
|
margin: 20upx auto 5%;
|
|
width: 90%;
|
|
position: relative;
|
|
|
|
.tboxbot {
|
|
width: 100%;
|
|
height: 100%;
|
|
position: relative;
|
|
background-size: 100% 100% !important;
|
|
box-shadow: 0rpx 0rpx 20rpx 0rpx rgba(121, 104, 77, 0.2);
|
|
/* position: absolute; */
|
|
/* top: 72rpx; */
|
|
/* left: 50%; */
|
|
/* margin-left: -47%; */
|
|
border-radius: 20rpx;
|
|
overflow: hidden;
|
|
|
|
.bot-img{
|
|
width: 60rpx;
|
|
height: 60rpx;
|
|
position: absolute;
|
|
top: 20rpx;
|
|
right: 20rpx;
|
|
}
|
|
.tbtitle {
|
|
width: 100%;
|
|
height: 130rpx;
|
|
position: absolute;
|
|
left: 0upx;
|
|
bottom: 0upx;
|
|
|
|
&::before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: url($url+'mask.png') no-repeat;
|
|
background-size: 100% 100% !important;
|
|
padding-bottom: 2rpx;
|
|
}
|
|
|
|
.tbname {
|
|
font-size: 36upx;
|
|
font-weight: bold;
|
|
margin-bottom: 16upx;
|
|
position: absolute;
|
|
top: 46rpx;
|
|
left: 30rpx;
|
|
}
|
|
|
|
.tbinfo {
|
|
width: 90%;
|
|
font-size: 24upx;
|
|
font-weight: 500;
|
|
line-height: 1.4;
|
|
position: absolute;
|
|
top: 120rpx;
|
|
left: 30rpx;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
display: flex;
|
|
|
|
// align-items: center;
|
|
&::before {
|
|
content: '';
|
|
display: inline-block;
|
|
width: 24rpx;
|
|
height: 28rpx;
|
|
margin-right: 10rpx;
|
|
background: url($url+'icon-add-da.png') no-repeat;
|
|
background-size: 100% 100% !important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
}
|
|
|
|
// .szra1 {
|
|
// width: 90%;
|
|
// margin: 40upx auto;
|
|
// display: flex;
|
|
// flex-direction: row;
|
|
// flex-wrap: wrap;
|
|
|
|
// .list {
|
|
// width: 48%;
|
|
// margin-bottom: 40upx;
|
|
// margin-right: 15rpx;
|
|
|
|
// .liimg {
|
|
// margin-bottom: 20upx;
|
|
|
|
// .szra_img {
|
|
// max-width: 360upx;
|
|
// width: 100%;
|
|
// height: 210upx;
|
|
// border-radius: 8upx;
|
|
// }
|
|
// }
|
|
|
|
// .sztitle {
|
|
// font-size: 32upx;
|
|
// font-weight: 600;
|
|
// color: #333333;
|
|
// margin-bottom: 20upx;
|
|
// overflow: hidden;
|
|
// text-overflow: ellipsis;
|
|
// white-space: nowrap;
|
|
// }
|
|
|
|
// .dsadk {
|
|
// font-size: 24rpx;
|
|
// font-weight: 500 !important;
|
|
// line-height: 1.6;
|
|
|
|
// &::before {
|
|
// content: '';
|
|
// display: inline-block;
|
|
// width: 24rpx;
|
|
// height: 26rpx;
|
|
// margin-right: 10rpx;
|
|
// background: url($url+'icon-add-xiao.png') no-repeat;
|
|
// background-size: 100% 100% !important;
|
|
// }
|
|
// }
|
|
// }
|
|
|
|
// }
|
|
|
|
}
|
|
|
|
|
|
</style>
|
|
|