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.
1064 lines
31 KiB
1064 lines
31 KiB
<template>
|
|
<view>
|
|
<scroll-view class="scroll-boxs" @scroll="onScroll" scroll-y="true">
|
|
<view class="home_pic_static" id="home_pic_static">
|
|
<view class="swiper-box">
|
|
<u-swiper :interval="5000" :blur="blur" @change="e => current = e.current" :height="500" :list="images"
|
|
:autoplay="autoplay" @click="clickSwiper" :circular='true' :indicator="true" :easingFunction="'easeOutCubic'">
|
|
<view slot="indicator" class="indicator">
|
|
<view class="indicator__dot" v-for="(item, index) in images" :key="index"
|
|
:class="[index === current && 'indicator__dot--active']">
|
|
</view>
|
|
</view>
|
|
</u-swiper>
|
|
</view>
|
|
|
|
|
|
</view>
|
|
<view class="home_serch_1" id="home_serch_1"
|
|
:style="{ '-webkit-backdrop-filter': 'blur(' + blur + ')', 'backdrop-filter': 'blur(' + blur + ')', 'height': height + 'px' }">
|
|
<view class="weather-box">
|
|
<weather :show-location="false" />
|
|
</view>
|
|
<view class="sch_2" style="height: 42rpx" @click="gotoSearch">
|
|
<image src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/icon-search_2.png"></image>
|
|
<span class="sch_2_span">景区/酒店/美食</span>
|
|
</view>
|
|
</view>
|
|
<view class="no-fixed-box">
|
|
<view class="m-bankuai" id="m-bankuai">
|
|
<view class="home_nav">
|
|
<view class="dy_fx fx_warp_n h_nav_box">
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('jingqu')">
|
|
<image src="/static/animg/index/jqmp.png" class="at_size_1"></image>
|
|
<view class="at_t">景区门票</view>
|
|
</view>
|
|
</view>
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('hotel')">
|
|
<image src="/static/animg/index/hotel.png" class="at_size_1"></image>
|
|
<view class="at_t">酒店住宿</view>
|
|
</view>
|
|
</view>
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('line')">
|
|
<image src="/static/animg/index/jpxl.png" class="at_size_1"></image>
|
|
<view class="at_t">精品线路</view>
|
|
</view>
|
|
</view>
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('jiqiren')">
|
|
<image src="/static/animg/index/znkf.png" class="at_size_1"></image>
|
|
<view class="at_t">智能客服</view>
|
|
</view>
|
|
</view>
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('default')">
|
|
<image src="/static/animg/index/jdms.png" class="at_size_1"></image>
|
|
<view class="at_t">民宿客栈</view>
|
|
</view>
|
|
</view>
|
|
<view class="w_25" hover-class="checkActive">
|
|
<view class="kua_nav" @click="goToPages('youji')">
|
|
<image src="/static/animg/index/strategy-guide.png" class="at_size_1"></image>
|
|
<view class="at_t">文旅攻略</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="left" hover-class="opacity-pic" @click="goBankuai('hd')">
|
|
<view class="m-title">活动日历</view>
|
|
<view class="m-tip">更多活动敬请期待！</view>
|
|
</view>
|
|
<view class="right">
|
|
<view class="right-son meishi" hover-class="opacity-pic" @click="goBankuai('meishi')">
|
|
<view class="tit">特色美食</view>
|
|
</view>
|
|
<view class="right-son wenhua" hover-class="opacity-pic" @click="goBankuai('wenhua')">
|
|
<view class="tit">非遗文化</view>
|
|
</view>
|
|
<view class="right-son zhoubian" hover-class="opacity-pic" @click="goBankuai('zhoubian')">
|
|
<view class="tit">文创周边</view>
|
|
</view>
|
|
<view class="right-son tousu" hover-class="opacity-pic" @click="goBankuai('tousu')">
|
|
<!-- <view class="right-son tousu" hover-class="opacity-pic" > -->
|
|
<view class="tit">我要投诉</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="guanggao-swiper" id="guanggao-swiper">
|
|
<u-swiper :interval="3000" :list="guanggaoList" :autoplay="autoplay" @click="clickSwiper" :circular='true'
|
|
:indicator="true" :easingFunction="'easeOutCubic'">
|
|
</u-swiper>
|
|
</view>
|
|
<view class="quanyi-box" @click="goQuanyi" id="quanyi-box">
|
|
<image mode="widthFix" src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/quanyi.png"></image>
|
|
</view>
|
|
<view class="amt_30">
|
|
<view class="an_box an_sch" id="news-box">
|
|
<view class="dy_fx">
|
|
<view class="tips">鹿泉<span class="m-red">新闻</span></view>
|
|
<view class="fx_1 aml_30 amr_30 m-tips">
|
|
<swiper autoplay="true" class="ht_swp_xi" :duration="duration_hj" :indicator-dots="falseDots"
|
|
:interval="interval_hj" :vertical="trueVcal">
|
|
<swiper-item class="word_1 xi_txt" v-for="(item, index) in zxList" :key="index"
|
|
@click="goToZixunDetail(item.guid)">
|
|
<view class="m-title">{{ item.title }}</view>
|
|
<view class="more-ico">更多
|
|
<image class="more-icon" src="/static/animg/index/more.png" mode="scaleToFill" />
|
|
</view>
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 滑动nav -->
|
|
<view class="m-slide-nav" :class="isFixed ? 'slide-nav-fixed' : ''"
|
|
:style="{ 'top': isFixed ? height + 'px' : '' }">
|
|
<view :class="['m-slide-item', currIndex == index ? 'curr' : '']" v-for="(item, index) in slideNav"
|
|
@tap="changeIndex(index)">
|
|
{{ item }}
|
|
</view>
|
|
</view>
|
|
<!-- 景区 -->
|
|
<!-- <view class="amb_30">
|
|
<view class="an_box_2">
|
|
<view class="amt_30">
|
|
<view class="an_pbl dy_fx_row" style="flex-wrap: wrap;">
|
|
<custom-waterfalls-flow :value="currIndex == 0 ? scenicList : currIndex == 1 ? foodList : hotelList" :imageKey="currIndex == 0 ? 'slogo':currIndex == 1 ? 'logo' :'hlogo'" class="water-flow">
|
|
<view class="item" v-for="(item, index) in allDatas" :key="index" slot="slot{{index}}">
|
|
<view class="title h-name">{{ currIndex == 0 ? item.sname : currIndex == 1 ? item.title : item.hname }}</view>
|
|
</view>
|
|
</custom-waterfalls-flow>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view> -->
|
|
|
|
<view class="list-box">
|
|
<view class="mask-box" v-if="showLoading">
|
|
加载中...
|
|
</view>
|
|
<!-- 景区 -->
|
|
<view class="amb_30" v-if="scenicList && scenicList.length > 0 && currIndex == 0">
|
|
<view class="an_box_2">
|
|
<!-- <view class="an_t" @click="goToPages('jingqu')">
|
|
<view class="an_t_1">大美鹿泉</view>
|
|
<view class="an_t_2">特色文创和旅游商品</view>
|
|
</view> -->
|
|
<!-- 瀑布流 -->
|
|
<view class="amt_30">
|
|
<view class="an_pbl dy_fx_row" style="flex-wrap: wrap;">
|
|
<custom-waterfalls-flow @imageClick="goToDetail('scenic', $event)" :value="scenicList"
|
|
imageKey="slogo" class="water-flow">
|
|
<view class="item" v-for="(item, index) in scenicList" :key="index" slot="slot{{index}}">
|
|
<view class="title h-name">{{ item.sname }}</view>
|
|
</view>
|
|
</custom-waterfalls-flow>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 酒店 -->
|
|
<view class="amb_30" v-if="hotelList && hotelList.length > 0 && currIndex == 2">
|
|
<view class="an_box_2">
|
|
<!-- <view class="an_t" @click="goToPages('hotel')">
|
|
<view class="an_t_1">酒店</view>
|
|
<view class="an_t_2">特色文创和旅游商品</view>
|
|
</view> -->
|
|
<!-- 瀑布流 -->
|
|
<view class="amt_30">
|
|
<view class="an_pbl dy_fx_row" style="flex-wrap: wrap;">
|
|
<custom-waterfalls-flow @imageClick="goToDetail('xiadan', $event)" :value="hotelList" imageKey="hlogo"
|
|
class="water-flow">
|
|
<view class="item" v-for="(item, index) in hotelList" :key="index" slot="slot{{index}}">
|
|
<view class="title h-name">{{ item.hname }}</view>
|
|
</view>
|
|
</custom-waterfalls-flow>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- 美食 -->
|
|
<view class="amb_30" v-if="foodList && foodList.length > 0 && currIndex == 1">
|
|
<view class="an_box_2">
|
|
<!-- <view class="an_t" @click="goToPages('meishi')">
|
|
<view class="an_t_1">鹿泉味道</view>
|
|
<view class="an_t_2">特色文创和旅游商品</view>
|
|
</view> -->
|
|
<!-- 瀑布流 -->
|
|
<view class="amt_30">
|
|
<view class="an_pbl dy_fx_row" style="flex-wrap: wrap;">
|
|
<custom-waterfalls-flow @imageClick="goToDetail('food', $event)" :value="foodList" imageKey="logo"
|
|
class="water-flow">
|
|
<view class="item" v-for="(item, index) in foodList" :key="index" slot="slot{{index}}">
|
|
<view class="title h-name">{{ item.title }}</view>
|
|
</view>
|
|
</custom-waterfalls-flow>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</scroll-view>
|
|
<m-tabBar :activeIndex="0"></m-tabBar>
|
|
<f-login></f-login>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import weather from "@/uni_modules/jr-weather/components/jr-weather/jr-weather.vue";
|
|
import Uswiper from "@/uni_modules/uview-ui/components/u-swiper/u-swiper.vue"
|
|
import mTabBar from "@/components/m-tabBar/mTabBar.vue";
|
|
export default {
|
|
components: {
|
|
weather,
|
|
Uswiper,
|
|
mTabBar
|
|
},
|
|
data() {
|
|
return {
|
|
currIndex: 0,
|
|
slideNav: ["人气景区", "特色美食", "酒店民宿"],
|
|
|
|
trueVcal: true,
|
|
falseDots: false,
|
|
interval_hj: 4500,
|
|
duration_hj: 1000,
|
|
|
|
indicatorDots: false,
|
|
autoplay: true,
|
|
interval: 5000,
|
|
duration: 500,
|
|
//
|
|
current: 0,
|
|
swiperCurrent: 0,
|
|
|
|
video: null,
|
|
indexNum: 0,
|
|
old: {
|
|
scrollTop: 0,
|
|
markIndex: 0,
|
|
},
|
|
scenicList: [],
|
|
videoList: [],
|
|
SJZObject: {},
|
|
wcList: [],
|
|
foodList: [],
|
|
yzOneList: {},
|
|
yzList: [],
|
|
lineOneList: {},
|
|
lineList: [],
|
|
lbtList: [],
|
|
zxList: [],
|
|
|
|
feiyiList: [],//非遗
|
|
hotelList: [],//酒店
|
|
specialtyList: [],//特产
|
|
allDatas: [],
|
|
// 轮播图
|
|
image: "",
|
|
image2: "",
|
|
image3: "",
|
|
j: 0,
|
|
a: 0,
|
|
b: 1,
|
|
images: [],
|
|
guanggaoList: [
|
|
{
|
|
url: 'https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/guanggao.png'
|
|
}
|
|
],
|
|
cla: "swp_1_img dhua",
|
|
cla2: "swp_1_img dhua2",
|
|
clas: ["swp_1_img dhua", "swp_1_img dhua2"],
|
|
netType: true,
|
|
showLoading: false,
|
|
|
|
scrollTop: 0,
|
|
blur: 0,
|
|
height: 'fit-content',
|
|
isFixed: false,
|
|
sumHeight:1000
|
|
};
|
|
},
|
|
onReady() {
|
|
let menuButtonInfo = uni.getMenuButtonBoundingClientRect()
|
|
console.log(menuButtonInfo.height, 'menuButtonInfo.height')
|
|
this.height = menuButtonInfo.height + menuButtonInfo.top;
|
|
},
|
|
onLoad(option) {
|
|
var that = this;
|
|
this.$util.getNetworkType(
|
|
function (res) {
|
|
if (res.networkType === "none") {
|
|
uni.showToast({
|
|
title: that.$param.netMsg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
that.netType = false;
|
|
}
|
|
},
|
|
function () {
|
|
uni.showToast({
|
|
title: that.$param.netMsg,
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
that.netType = false;
|
|
}
|
|
);
|
|
if (!that.netType) {
|
|
return;
|
|
}
|
|
this.getRedisData();
|
|
this.getZiXunList();
|
|
let video = uni.createVideoContext("myVideo");
|
|
this.video = video;
|
|
setInterval(
|
|
function () {
|
|
if (that.j % 2 == 0) {
|
|
//这个为每次l轮换样式
|
|
that.cla = that.clas[1];
|
|
that.cla2 = that.clas[0];
|
|
|
|
that.a = that.a + 2;
|
|
if (that.a == that.images.length) {
|
|
that.a = 0;
|
|
} else if (that.a > that.images.length) {
|
|
that.a = that.a - that.images.length;
|
|
}
|
|
that.image = that.images[that.a];
|
|
} else {
|
|
that.cla = that.clas[0];
|
|
that.cla2 = that.clas[1];
|
|
|
|
that.b = that.b + 2;
|
|
if (that.b == that.images.length) {
|
|
that.b = 0;
|
|
} else if (that.b > that.images.length) {
|
|
that.b = that.b - that.images.length;
|
|
}
|
|
that.image2 = that.images[that.b];
|
|
}
|
|
that.j++;
|
|
},
|
|
1000 * 10,
|
|
that
|
|
);
|
|
},
|
|
methods: {
|
|
clickSwiper(e) {
|
|
uni.showToast({
|
|
title: "功能正在开发中~",
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
},
|
|
goQuanyi() {
|
|
uni.showToast({
|
|
title: "功能正在开发中~",
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
},
|
|
onScroll(event) {
|
|
// const query = uni.createSelectorQuery().in(this);
|
|
// let sumHeight = 0
|
|
// // 选择目标元素
|
|
// query
|
|
// .select('#home_serch_1')
|
|
// .boundingClientRect()
|
|
// .select('#m-bankuai')
|
|
// .boundingClientRect()
|
|
// .select('#guanggao-swiper')
|
|
// .boundingClientRect()
|
|
// .select('#quanyi-box')
|
|
// .boundingClientRect()
|
|
// .select('#home_pic_static')
|
|
// .boundingClientRect().
|
|
// select('#news-box')
|
|
// .boundingClientRect()
|
|
// .exec((results) => {
|
|
// results.forEach((data) => {
|
|
// if (data) {
|
|
// sumHeight += data.height;
|
|
// }
|
|
// });
|
|
// this.sumHeight = sumHeight;
|
|
// console.log('总高度:', sumHeight);
|
|
// });
|
|
// console.log(event.detail.scrollTop, 'event.detail.scrollTop')
|
|
// if (event.detail.scrollTop >= this.sumHeight) {
|
|
// this.isFixed = true;
|
|
// } else {
|
|
// this.isFixed = false;
|
|
// }
|
|
this.scrollTop = event.detail.scrollTop;
|
|
if (this.scrollTop > 150) {
|
|
this.autoplay = false;
|
|
|
|
} else {
|
|
this.autoplay = true;
|
|
}
|
|
this.updateBackgroundColor();
|
|
},
|
|
updateBackgroundColor() {
|
|
// 假设当滚动超过100px时，背景逐渐变为透明
|
|
const opacity = Math.max(0, Math.min(1, this.scrollTop / 500));
|
|
this.blur = `${opacity * 15}px`
|
|
},
|
|
waterClick(val, ss) {
|
|
console.log(val, ss, 'maxNum')
|
|
},
|
|
//图跳转
|
|
goBankuai(val) {
|
|
switch (val) {
|
|
case 'hd':
|
|
uni.navigateTo({
|
|
url: "/subPageA/hotevent/hoteventlist/hoteventlist",
|
|
});
|
|
break;
|
|
case 'meishi':
|
|
uni.navigateTo({
|
|
url: "/subPageA/food/foodlist/foodlist",
|
|
});
|
|
break;
|
|
case 'wenhua':
|
|
uni.navigateTo({
|
|
url: "/subPageA/feiyi/feiyilist/feiyilist",
|
|
});
|
|
break;
|
|
case 'zhoubian':
|
|
uni.navigateTo({
|
|
url: "/subPageA/wenchuang/wenlist/wenlist",
|
|
});
|
|
break;
|
|
case 'tousu':
|
|
this.onTokenJump('/subPageB/suggest/sug_list?type=1', 'navigateTo')
|
|
// uni.navigateTo({
|
|
// url: "/subPageB/suggest/sug_list?type=1",
|
|
// });
|
|
break;
|
|
}
|
|
},
|
|
//切换tab
|
|
changeIndex(index) {
|
|
this.showLoading = true
|
|
this.currIndex = index;
|
|
setTimeout(() => {
|
|
this.showLoading = false
|
|
}, 500);
|
|
// switch(index){
|
|
// case 0:
|
|
// this.allDatas = this.scenicList;
|
|
// break;
|
|
// case 1:
|
|
// this.allDatas = this.foodList;
|
|
// break;
|
|
// case 2:
|
|
// this.allDatas = this.hotelList;
|
|
// break;
|
|
// }
|
|
// this.$refs.waterfallsFlowRef.refresh();
|
|
},
|
|
//
|
|
changeSwiper(e) {
|
|
this.swiperCurrent = e.detail.current;
|
|
},
|
|
scroll: function (e) {
|
|
this.old.scrollTop = e.detail.scrollTop;
|
|
},
|
|
getRedisData: function (mescroll) {
|
|
var data = {
|
|
key: this.$param.userkey + "_index",
|
|
};
|
|
this.$Request.post(this.$config.getRedisData, data).then((res) => {
|
|
console.log(res);
|
|
if (res.status == 200) {
|
|
//所有的数据
|
|
var initData = res.data;
|
|
|
|
//轮播图
|
|
var lbtList = initData.lbtList;
|
|
for (let i = 0; i < lbtList.length; i++) {
|
|
lbtList[i].logo = this.$config.ROOTPATH + lbtList[i].logo;
|
|
this.images[i] = lbtList[i].logo;
|
|
}
|
|
this.image = this.images[0];
|
|
this.image2 = this.images[1];
|
|
this.image3 = this.images[0];
|
|
//景区
|
|
var scenicList = initData.scenicList;
|
|
// var scLength = scenicList.length > 4 ? 4 : scenicList.length;
|
|
var scLength = scenicList.length;
|
|
var scdata = [];
|
|
for (let i = 0; i < scLength; i++) {
|
|
scenicList[i].slogo = this.$config.ROOTPATH + scenicList[i].slogo;
|
|
scdata.push(scenicList[i]);
|
|
}
|
|
this.scenicList = scdata;
|
|
//美食
|
|
var foodList = initData.foodList;
|
|
// var foodLength = foodList.length > 4 ? 4 : foodList.length;
|
|
var foodLength = foodList.length;
|
|
for (var i = 0; i < foodLength; i++) {
|
|
var item = {
|
|
logo: this.$config.ROOTPATH + foodList[i].logo,
|
|
region: foodList[i].bm,
|
|
guid: foodList[i].guid,
|
|
title: foodList[i].title,
|
|
content: foodList[i].content
|
|
};
|
|
this.foodList.push(item);
|
|
}
|
|
|
|
//酒店
|
|
var hotelList = initData.hotelList;
|
|
// var hotelLength = hotelList.length > 4 ? 4 : hotelList.length;
|
|
var hotelLength = hotelList.length;
|
|
var list1 = [];
|
|
for (var i = 0; i < hotelLength; i++) {
|
|
hotelList[i].hlogo = this.$config.ROOTPATH + hotelList[i].hlogo;
|
|
list1.push(hotelList[i]);
|
|
}
|
|
this.hotelList = list1;
|
|
} else {
|
|
this.getImgList(); //轮播图
|
|
this.getScenicList(); //景区
|
|
this.getFoodList(); //美食
|
|
}
|
|
});
|
|
},
|
|
getImgList: function () {
|
|
var data = {
|
|
pageno: "1",
|
|
pageSize: "5",
|
|
sort: "2",
|
|
type: this.$param.imgType,
|
|
userkey: this.$param.userkey,
|
|
};
|
|
this.$Request.post(this.$config.getMessageInfoFormFilter, data).then((res) => {
|
|
var lbtList = res.data;
|
|
for (var i = 0; i < lbtList.length; i++) {
|
|
this.images[i] = this.$config.ROOTPATH + lbtList[i].logo;
|
|
}
|
|
this.image = this.images[0];
|
|
this.image2 = this.images[1];
|
|
this.image3 = this.images[0];
|
|
});
|
|
},
|
|
getZiXunList: function () {
|
|
var data = {
|
|
pageno: "1",
|
|
pageSize: "3",
|
|
sort: "2",
|
|
type: this.$param.zixunType,
|
|
userkey: this.$param.userkey,
|
|
};
|
|
this.$Request.post(this.$config.getMessageInfoFormFilter, data).then((res) => {
|
|
this.zxList = res.data;
|
|
});
|
|
},
|
|
goToZixunDetail(guid) {
|
|
console.log(guid, 'guid')
|
|
uni.navigateTo({
|
|
url: "/subPageB/zixun/zixundetail/zixundetail?id=" + guid,
|
|
});
|
|
},
|
|
getScenicList: function () {
|
|
var data = {
|
|
pageno: "1",
|
|
pagesize: "4",
|
|
sort: "2",
|
|
timestamp: 0,
|
|
areacode: this.$config.ARER_CODE,
|
|
userkey: this.$param.userkey,
|
|
};
|
|
this.$Request.post(this.$config.getscenicList, data).then((res) => {
|
|
if (res.status == 500) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
duration: 2000,
|
|
});
|
|
return;
|
|
}
|
|
var data = res.data;
|
|
for (let i = 0; i < data.length; i++) {
|
|
data[i].slogo = this.$config.ROOTPATH + data[i].slogo;
|
|
}
|
|
this.scenicList = data;
|
|
});
|
|
},
|
|
getFoodList: function () {
|
|
this.onc = "meishi";
|
|
var data = {
|
|
pageno: "1",
|
|
pageSize: "4",
|
|
sort: "2",
|
|
region: this.$config.ARER_CODE,
|
|
type: this.$param.foodType,
|
|
userkey: this.$param.userkey,
|
|
};
|
|
this.$Request.post(this.$config.getMessageInfoFormFilter, data).then((res) => {
|
|
if (res.status == 500) {
|
|
uni.showToast({
|
|
title: res.msg,
|
|
duration: 2000,
|
|
});
|
|
return;
|
|
}
|
|
var data = res.data;
|
|
for (let i = 0; i < data.length; i++) {
|
|
data[i].logo = this.$config.ROOTPATH + data[i].logo;
|
|
}
|
|
this.foodList = data;
|
|
});
|
|
},
|
|
goToPages: function (type) {
|
|
var that = this;
|
|
if (type == "jingqu") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/scenic/sceniclist/sceniclist",
|
|
});
|
|
// uni.navigateTo({
|
|
// url: "/subPageC/bookTicket/bookTicket",
|
|
// });
|
|
} else if (type == "meishi") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/food/foodlist/foodlist",
|
|
});
|
|
} else if (type == "line") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/travelroute/travelroutelist/travelroutelist",
|
|
});
|
|
} else if (type == "hotel") {
|
|
uni.navigateTo({
|
|
url: "/subPageB/hotel/hotellist/hotellist",
|
|
});
|
|
} else if (type == "more") {
|
|
uni.navigateTo({
|
|
url: "/pages/fuwu/fuwu",
|
|
});
|
|
} else if (type == "wenchuang") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/wenchuang/wenlist/wenlist",
|
|
});
|
|
} else if (type == "feiyi") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/feiyi/feiyilist/feiyilist",
|
|
});
|
|
} else if (type == "hotevent") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/hotevent/hoteventlist/hoteventlist",
|
|
});
|
|
} else if (type == "jiqiren") {
|
|
that.$util.saveOperatorLog(that, "FUN", "机器人");
|
|
uni.navigateTo({
|
|
url: "/subPageB/jiqiren/jiqiren/zhinengjiqiren",
|
|
});
|
|
} else if (type == "youji") {
|
|
uni.navigateTo({
|
|
url: "/subPageA/method/methodlist/methodlist",
|
|
});
|
|
} else if (type == "default") {
|
|
uni.showToast({
|
|
title: "功能正在开发中~",
|
|
icon: "none",
|
|
duration: 2000,
|
|
});
|
|
}
|
|
},
|
|
goToDetail: function (type, guid, region) {
|
|
if (type == "scenic") {
|
|
|
|
uni.navigateTo({
|
|
// url: "/subPageA/scenic/scenicdetial/scenicdetial?guid=" + guid + `&listA=` + list,
|
|
url: "/subPageA/scenic/scenicdetial/scenicdetial?guid=" + guid.guid,
|
|
});
|
|
} else if (type == "food") {
|
|
uni.navigateTo({
|
|
url:
|
|
"/subPageA/food/fooddetial/fooddetial?fid=" + guid.guid + "&fareacode=" + guid.region,
|
|
});
|
|
} else if (type == "line") {
|
|
uni.navigateTo({
|
|
url: "/pages/travelroute/travelroutedetail/travelroutedetail?id=" + guid,
|
|
});
|
|
} else if (type == "feiyi") {
|
|
uni.navigateTo({
|
|
url: '/subPageA/feiyi/feiyidetail/feiyidetail?guid=' + guid
|
|
});
|
|
} else if (type == "xiadan") {
|
|
uni.navigateTo({
|
|
url: '/subPageB/hotel/hoteldetail/hoteldetail?id=' + guid.guid + '®ion=' + guid.region
|
|
});
|
|
}
|
|
},
|
|
gotoSearch: function () {
|
|
var that = this;
|
|
that.$util.saveOperatorLog(that, "FUN", "搜索");
|
|
uni.navigateTo({
|
|
url: "/subPageA/search/search",
|
|
});
|
|
},
|
|
|
|
|
|
},
|
|
};
|
|
</script>
|
|
<style scoped
|
|
lang="scss">
|
|
.checkActive {
|
|
background: rgba(255, 255, 255, 0.2) !important;
|
|
box-shadow: 0upx 0upx 0upx rgba(255, 255, 255, 0.2) !important;
|
|
color: #3d3d3d !important;
|
|
transition: 0.1s ease !important;
|
|
}
|
|
|
|
.w_25 {
|
|
width: 22%;
|
|
margin: 0 1%;
|
|
background: #ffffff12;
|
|
border-radius: 20rpx;
|
|
padding: 30rpx 0;
|
|
flex: none;
|
|
|
|
.kua_nav {
|
|
border: none;
|
|
}
|
|
}
|
|
|
|
.tips {
|
|
font-family: Source Han Sans SC;
|
|
font-weight: bold;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
background-image: url("@/static/animg/index/tips_bg.png");
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
padding: 5rpx 10rpx;
|
|
}
|
|
|
|
.m-tips {
|
|
height: 45rpx;
|
|
}
|
|
|
|
.m-slide-nav {
|
|
height: 100rpx;
|
|
overflow-x: scroll;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-around;
|
|
padding: 0 20rpx;
|
|
position: relative;
|
|
margin-top: 20rpx;
|
|
|
|
.m-slide-item {
|
|
width: fit-content;
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 400;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
flex-shrink: 0;
|
|
transition: all ease-in-out 0.2s;
|
|
z-index: 1;
|
|
background-repeat: no-repeat;
|
|
background-size: 25%;
|
|
background-position: 50% 15px;
|
|
padding-bottom: 10px;
|
|
text-align: center;
|
|
}
|
|
|
|
.curr {
|
|
scale: 1.1;
|
|
|
|
padding-bottom: 10px;
|
|
position: relative;
|
|
|
|
&::after {
|
|
content: "";
|
|
width: 50rpx;
|
|
height: 60rpx;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/lu.png");
|
|
background-size: contain;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
position: absolute;
|
|
left: -15rpx;
|
|
top: -15rpx;
|
|
z-index: -1;
|
|
|
|
}
|
|
|
|
&::before {
|
|
content: "";
|
|
width: 80%;
|
|
height: 10rpx;
|
|
background: linear-gradient(-90deg, rgba(9, 131, 255, 0) 0%, #0983FF 100%);
|
|
border-radius: 5rpx;
|
|
position: absolute;
|
|
bottom: 8rpx;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
z-index: -1;
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
.slide-nav-fixed {
|
|
position: fixed;
|
|
}
|
|
|
|
.m-slide-nav::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
|
|
.an_box {
|
|
margin-bottom: 0rpx !important;
|
|
}
|
|
|
|
.w-content {
|
|
padding: 0 20rpx;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
color: #1b1b1b;
|
|
}
|
|
|
|
.m-bankuai {
|
|
background-color: #f5f5f5;
|
|
padding: 16px;
|
|
border-radius: 13px 13px 0 0;
|
|
position: relative;
|
|
z-index: 9;
|
|
top: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
.left {
|
|
width: 220rpx;
|
|
height: 320rpx;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/hd.png");
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
background-position: center;
|
|
|
|
.m-title {
|
|
font-family: Source Han Sans SC;
|
|
font-weight: bold;
|
|
font-size: 36rpx;
|
|
color: #ffffff;
|
|
font-style: italic;
|
|
margin: 0 auto;
|
|
width: fit-content;
|
|
margin-top: 29rpx;
|
|
margin-bottom: 11rpx;
|
|
}
|
|
|
|
.m-tip {
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 400;
|
|
font-size: 16rpx;
|
|
color: #ffffff;
|
|
font-style: italic;
|
|
padding: 5rpx 10rpx;
|
|
border-radius: 15rpx;
|
|
border: solid 1rpx #fff;
|
|
text-align: center;
|
|
width: fit-content;
|
|
margin: 0 auto;
|
|
}
|
|
}
|
|
|
|
.right {
|
|
margin-left: 24rpx;
|
|
flex: 1;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: space-between;
|
|
align-self: flex-start;
|
|
|
|
.right-son {
|
|
width: 48%;
|
|
height: 150rpx;
|
|
background-repeat: no-repeat;
|
|
background-size: cover;
|
|
background-position: center;
|
|
font-family: Source Han Sans SC;
|
|
font-weight: 500;
|
|
font-size: 26rpx;
|
|
border-radius: 12rpx;
|
|
overflow: hidden;
|
|
|
|
.tit {
|
|
width: fit-content;
|
|
margin-top: 18rpx;
|
|
margin-left: 26rpx;
|
|
font-weight: bolder;
|
|
}
|
|
}
|
|
|
|
.meishi {
|
|
color: #fb8314;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/meishi.png");
|
|
}
|
|
|
|
.wenhua {
|
|
color: #fc5425;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/wenhua.png");
|
|
}
|
|
|
|
.zhoubian {
|
|
margin-top: 16rpx;
|
|
color: #4781fb;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/zhoubian.png");
|
|
}
|
|
|
|
.tousu {
|
|
color: #04a3da;
|
|
margin-top: 16rpx;
|
|
background-image: url("https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/tousu.png");
|
|
}
|
|
}
|
|
}
|
|
|
|
.an_sch {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.amt_30 {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.h-name {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
padding: 20rpx 12rpx;
|
|
}
|
|
|
|
.water-flow {
|
|
width: 100%;
|
|
}
|
|
|
|
.list-box {
|
|
position: relative;
|
|
|
|
.mask-box {
|
|
width: 100%;
|
|
min-height: 85vh;
|
|
text-align: center;
|
|
height: 100%;
|
|
line-height: 85vh;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
position: absolute;
|
|
z-index: 9;
|
|
font-size: 36rpx;
|
|
transition: all ease-in-out 0.2s;
|
|
}
|
|
}
|
|
|
|
::v-deep .u-swiper {
|
|
|
|
|
|
.u-swiper__indicator {
|
|
bottom: 130px;
|
|
right: 15px;
|
|
}
|
|
|
|
.indicator {
|
|
width: 100px;
|
|
height: 4px;
|
|
display: flex;
|
|
justify-content: space-evenly;
|
|
flex-wrap: nowrap;
|
|
|
|
|
|
.indicator__dot {
|
|
background-color: #ffffff87;
|
|
height: 100%;
|
|
margin: 0 5px;
|
|
border-radius: 8px;
|
|
width: 10px;
|
|
height: 4px;
|
|
transition: all linear 0.2s;
|
|
position: relative;
|
|
overflow: hidden;
|
|
|
|
&::after {
|
|
content: '';
|
|
width: 100%;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: -100%;
|
|
transform: scaleX(0);
|
|
transform-origin: left;
|
|
transition-property: all;
|
|
transition-timing-function: linear;
|
|
background-color: #fff;
|
|
border-radius: 8px;
|
|
|
|
}
|
|
}
|
|
|
|
.indicator__dot--active {
|
|
flex: 1;
|
|
|
|
&::after {
|
|
animation: middle 5s forwards linear;
|
|
}
|
|
|
|
@keyframes middle {
|
|
0% {
|
|
transform: scaleX(0);
|
|
left: 0;
|
|
}
|
|
|
|
100% {
|
|
transform: scaleX(1);
|
|
left: 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.scroll-boxs {
|
|
height: 100vh;
|
|
overflow-y: scroll;
|
|
}
|
|
|
|
.no-fixed-box {
|
|
position: relative;
|
|
top: 500px;
|
|
background-color: #fff;
|
|
|
|
|
|
.guanggao-swiper {
|
|
margin: 20rpx 30rpx 0;
|
|
}
|
|
|
|
.quanyi-box {
|
|
margin: 30rpx 0 0;
|
|
height: fit-content;
|
|
|
|
image {
|
|
width: 100%;
|
|
}
|
|
}
|
|
}
|
|
</style>
|
|
|