CjyTravel/subPageA/hotevent/hoteventlist/hoteventlist.vue

<template>
	<view class="v-pages v-pages-bg">
		<view class="v-pages-search">
			<view class="search_box row flex-align-center">
				<view class="col">
					<input v-model="searchValue" @confirm="search" type="text" class="input" confirm-type="search"
						placeholder-style="color:#999" placeholder="输入活动名称" />
				</view>
				<view class="btn_img" @click="search">
					<image src="/subPageB/static/img/icon-search.png" class="img"></image>
				</view>
			</view>

			<view class="dy_fx amt_30">
				<view class="search-tip-bar">
					<view @tap="changePanel" :class="[searchItemClass, selectedParam.hiddenSortPanel ? 'active' : '']"
						data-type="hiddenSortPanel">智能排序
					</view>
					<view @tap="changePanel"
						:class="[searchItemClass, selectedParam.hiddenAttributePanel ? 'active' : '']"
						data-type="hiddenAttributePanel">分类筛选
					</view>
				</view>
			</view>
		</view>
		<view>
			<scroll-view @scroll="onReachScroll" @bindscrolltolower="lower" class="scroll-view" :scroll-top="topNum"
				scrollY="true" style="top:200rpx">
				<view class="v-pages-list" v-if="listDatas.length>0">
					<navigator hover-class="none"
						:url="'/subPageA/hotevent/hoteventdetail/hoteventdetail?id=' + item.id"
						v-for="(item, index) in listDatas" :key="index">
						<view class="list_item row">
							<view class="item_recommend hotel" v-if="item.isrecommend=='YES'">
								<image src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/tuijian.png"
									mode="widthFix"></image>
							</view>
							<view class="item_image hotel">
								<image class="img" mode="aspectFill" :src="item.elogo"></image>
							</view>
							<view class="item_content">
								<view class="content-name" v-if="item.ename">{{ item.ename }}</view>
								<view class="content-desc m-t-12" v-if="item.eventdate">活动时间：{{ item.eventdate }}</view>
							</view>
						</view>
					</navigator>
				</view>
				<view class="scroll-empty" v-else>
					<image class="empty-icon" src="https://eluyou.ailuquan.cn/upload/image/2024/mapIcon/daolan/no-data.png" mode="widthFix">
					</image>
					<view class="empty-tip">~ 暂无相关数据 ~</view>
				</view>
				<view class="data-is-bottom" v-if="param.finished">{{ this.$param.pageMsg }}</view>
				<!-- <view class="no-data-info" v-if="param.noData">{{ this.$param.dataMsg }}</view> -->
			</scroll-view>
		</view>

		<view class="sort-page" :hidden="selectedParam.hiddenSortPanel">
			<view class="sort-group">
				<view @tap="selected"
					:class="[pageClass.sortItemClass, selectedParam.sortId == item.id ? 'sort-item-active' : '']"
					data-panel="hiddenSortPanel" data-type="sortId" :data-id="item.id"
					v-for="(item, index) in filter.sort" :key="index">
					{{ item.name }}
				</view>
			</view>
		</view>

		<view class="sort-page" :hidden="selectedParam.hiddenRegionPanel">
			<view class="sort-group">
				<view @tap="regionSelected"
					:class="[pageClass.sortItemClass, selectedParam.bm == item.bm ? 'sort-item-active' : '']"
					data-panel="hiddenRegionPanel" :data-name="item.title" data-type="bm" :data-id="item.bm"
					v-for="(item, index) in regionList" :key="index">
					{{ item.title }}
				</view>
			</view>
		</view>

		<view class="filter-page" :hidden="selectedParam.hiddenAttributePanel">
			<view class="filter-box">
				<scroll-view scrollY class="filter-hd">
					<view @tap="parentLevel"
						:class="[pageClass.filterHdItemClass, parentLevelItem == 'attribute_' + items.type ? 'filter-hd-item-active' : '']"
						:data-parentLevelItem="'attribute_' + items.type" v-for="(items, index) in filter.attribute"
						:key="index">
						{{ items.name }}
					</view>
				</scroll-view>
				<scroll-view scrollY class="filter-bd">

					<view class="filter-group" v-if="parentLevelItem=='attribute_'+items.type"
						v-for="(items,index) in filter.attribute" :key="items.dicnum">
						<view @tap="childLevel"
							:class="[pageClass.filterBdItem,selectedFIlter['attribute_'+items.type]==0?'filter-bd-item-active':'']"
							data-id="0" :data-type="'attribute_'+items.type">全部
						</view>
						<view @tap="childLevel"
							:class="[pageClass.filterBdItem,selectedFIlter['attribute_'+items.type]==item.dicnum?'filter-bd-item-active':'']"
							:data-id="item.dicnum" :data-type="'attribute_'+items.type"
							v-for="(item,childIndex) in items.child" :key="childIndex">{{ item.dicname }}
						</view>

					</view>
				</scroll-view>
			</view>
			<view class="control-bar-block">
				<view @tap="resetFilter" class="control-back-btn">恢复默认</view>
				<view @tap="confirmClick" class="control-confirm-btn">确定</view>
			</view>
		</view>
	</view>
	<!-- </mescroll-uni> -->
</template>

<script>
	export default {
		data() {
			return {
				searchItemClass: 'search-tip-item',
				pageClass: {
					sortItemClass: 'sort-item',
					filterHdItemClass: 'filter-hd-item',
					filterBdItem: 'filter-bd-item'
				},
				priceSymbol: '',
				destinationBak: 'all',
				destination: 'all',
				filter: [],
				regionList: [],
				parentLevelItem: 'attribute_hoventKey',
				defaultFilter: {
					attribute_hoventKey: 0
				},
				latitude: 0,
				longitude: 0,
				selectedFIlterBak: {
					attribute_hoventKey: 0
				},
				selectedFIlter: {
					attribute_hoventKey: 0
				},
				selectedParam: {
					sortId: 3,
					bm: '',
					hiddenSortPanel: !0,
					hiddenAttributePanel: !0,
					hiddenRegionPanel: !0
				},
				param: {
					page: 1,
					noData: !1,
					loading: !1,
					finished: !1
				},
				listDatas: [],
				topNum: 0,
				rootPaht: this.$config.ROOTPATH,
				selectcondition: {
					bm: '',
					sortId: 3,
					type: ''
				},
				regionname: '区域',
				searchValue: "",
				netType: true
			};
		},
		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.$util.hideLoadingByTime();
			uni.showLoading({
				title: '加载中',
				mask: true
			});
			/* this.selectedFIlter['attribute_' + this.$param.hoteventTypeKey] = 0;
			this.parentLevelItem = 'attribute_' + this.$param.hoteventTypeKey; */
			this.initData();
			var region = option.region;
			if (region != null && region != '') {
				this.selectcondition.bm = region;
				this.get_data();
			} else {
				this.getRedisData();
			}
			this.getRedisRegion();
			this.get_attribute();
			that.$util.saveOperatorLog(that, 'FUN', '活动');
		},
		onShow() {
			this.destinationBak != this.destination && (this.initData(), this.get_data());
		},
		methods: {
			initData: function() {
				uni.showLoading({
					title: '加载中',
					mask: true
				});
				var param = {};
				param.page = 1;
				param.noData = false;
				param.finished = false;

				this.param = param;
				this.listDatas = [];
				this.destinationBak = this.destination;
			},
			selected: function(event) {
				this.initData();
				var dataset = event.currentTarget.dataset;
				var param = this.selectedParam;

				param[dataset.type] = dataset.id;
				param.hiddenSortPanel = !0;

				//console.log(dataset.id);
				this.selectedParam = param;
				this.selectcondition.sortId = dataset.id;
				this.get_data();
			},
			regionSelected: function(event) {
				this.initData();
				var dataset = event.currentTarget.dataset;
				var param = this.selectedParam;

				param[dataset.type] = dataset.id;
				param.hiddenRegionPanel = !0;

				//console.log(dataset.id);
				this.selectedParam = param;
				this.selectcondition.bm = this.selectedParam.bm;
				this.regionname = dataset.name;
				this.get_data();
			},
			changePanel: function(event) {
				var dataSet = event.currentTarget.dataset,
					selectedParam = this.selectedParam;
				'hiddenSortPanel' == dataSet.type ? (selectedParam.hiddenAttributePanel = !0, selectedParam
						.hiddenRegionPanel = !0) : (selectedParam.hiddenSortPanel = !0),
					(selectedParam[dataSet.type] = !selectedParam[dataSet.type]),
					(this.selectedParam = selectedParam);
			},
			changeRegionPanel: function(event) {
				var dataSet = event.currentTarget.dataset,
					selectedParam = this.selectedParam;
				if ('hiddenRegionPanel' == dataSet.type) {
					selectedParam.hiddenAttributePanel = !0;
					selectedParam.hiddenSortPanel = !0;
				} else {
					selectedParam.hiddenRegionPanel = !0;
				}
				(selectedParam[dataSet.type] = !selectedParam[dataSet.type]), (this.selectedParam = selectedParam);
			},

			resetFilter: function() {
				this.selectedFIlter = {
					attribute_hoventKey: 0
				}
			},
			confirmClick: function() {
				this.initData();
				//设置选中的筛选项
				var selectedParam = this.selectedParam;
				(selectedParam.hiddenAttributePanel = true), (this.selectedFIlterBak = this.selectedFIlter);
				this.parentLevelItem = 'attribute_hoventKey'
				this.selectedParam = selectedParam;

				this.get_data();
			},
			parentLevel: function(t) {
				var currentTarget = t.currentTarget.dataset;
				//console.log("aaaaaaaaaaaaaaaaa"+a.parentlevelitem);
				this.parentLevelItem = currentTarget.parentlevelitem;
			},
			childLevel: function(t) {
				var a = t.currentTarget.dataset,
					e = this.selectedFIlter;

				this.selectedFIlterBak = e;
				e[a.type] = a.id;
				this.selectedFIlter = {};
				this.selectedFIlter = e;
				this.selectcondition.type = a.id;
			},
			search: function() {
				this.initData();
				this.get_data();
			},
			getRedisRegion: function() {
				var data = {
					key: this.$param.userkey + '_mdd_list'
				};
				this.$Request.post(this.$config.getRedisData, data).then(res => {
					if (res.status == 200) {
						this.regionList = res.data.mddList;
						var all = {
							bm: '',
							title: '全部'
						};
						this.regionList.unshift(all);

						for (var i = 0; i < this.regionList.length; i++) {
							if (this.regionList[i].bm == this.selectcondition.bm) {
								this.regionname = this.regionList[i].title;
							}
						}
					} else {
						this.getRegion();
					}
				});
			},
			getRegion: function() {
				var that = this;
				var url = this.$config.getMessageInfoFormFilter;
				var data = {
					type: this.$param.mddType,
					userkey: this.$param.userkey,
					pageSize: 100,
					sort: '2'
				};
				this.$Request.post(url, data).then(res => {
					var flag = that.$util.isSuccess(res);
					if (!flag) {
						return;
					}
					that.regionList = res.data;
					for (var i = 0; i < that.regionList.length; i++) {
						if (that.regionList[i].bm == that.selectcondition.bm) {
							that.regionname = that.regionList[i].title;
						}
					}
				});
			},
			get_attribute: function() {
				var that = this;
				var url = this.$config.getCondition;
				var data = {
					type: 'hotevent',
					userkey: this.$param.userkey,
					condition: this.$param.hoteventType
				};

				this.$Request.post(url, data).then(res => {
					var flag = that.$util.isSuccess(res);
					if (!flag) {
						return;
					}
					/* if (res.data.attribute != null && res.data.attribute.length > 0) {
					  res.data.attribute[0].type = this.$param.hoteventTypeKey;
					} */
					this.filter = res.data;
				});
			},
			onReachScroll: function(t) {
				//console.log(t);
				t.detail.scrollTop > 100 ? (this.floorstatus = true) : (this.floorstatus = false);
				var a = this.param;

				a.noData || a.finished || a.loading || this.get_data();
			},
			getRedisData: function() {
				var that = this;
				var data = {
					key: this.$param.userkey + '_hotEvent_list'
				};
				that.$Request.post(that.$config.getRedisData, data).then(res => {
					if (res.status == 200) {
						var listDatas = that.listDatas,
							dataListLen = res.data.hoteventList.length,
							data = res.data.hoteventList;
						if (
							(dataListLen == 10 ? (this.param.page += 1) : (this.param.page = 1 && 0 ==
									dataListLen ? (this.param.noData = true) : (this.param.finished = true)),
								(this.param.loading = false),
								dataListLen > 0)
						) {
							for (var i = 0; i < dataListLen; i++) {
								var item = {
									id: data[i].guid,
									elogo: this.rootPaht + data[i].logo,
									ename: data[i].title,
									eventdate: data[i].jointime,
									eaddress: data[i].address,
									isrecommend: data[i].isrecommend,
									ephone: data[i][this.$param.hoteventPhoneKey],
									etype: data[i][this.$param.hoteventTypeKey].dicname,
									distance: this.$util.formatDistance(data[i].distance)
								};
								this.listDatas.push(item);
								uni.hideLoading();
							}
						}
					} else {
						that.get_data();
					}
				});
			},
			get_data: function() {
				this.param.loading = true;
				// var type = this.selectcondition.type;
				// if (type != undefined && type != null && type != '') {
				// 	if (type == 0) {
				// 		type = '';
				// 	} else {
				// 		type = this.$param.hoteventTypeKey + '&' + type + '&select';
				// 	}
				// }
				var type = this.selectedFIlterBak['attribute_hoventKey'];
				if (type != 0) {
					var sub_column1 = "sub_column1&" + type + "&select"
				}
				var that = this;
				var url = this.$config.getMessageInfoFormFilter_two;
				var data = {
					type: this.$param.hotevent,
					userkey: this.$param.userkey,
					pageno: this.param.page,
					pageSize: 10,
					region: this.selectcondition.bm,
					sort: this.selectcondition.sortId,
					lng: this.$param.clng,
					lat: this.$param.clat,
					title: this.searchValue,
					sub_column1: sub_column1
				};
				//data[this.$param.hoteventTypeKey] = type;
				this.$Request.post(url, data).then(res => {
					var flag = that.$util.isSuccess(res);
					if (!flag) {
						uni.hideLoading();
						return;
					}
					var listDatas = this.listDatas,
						dataListLen = res.data.length;
					if (
						(dataListLen == data.pageSize ? (this.param.page += 1) : (this.param.page = 1 && 0 ==
								dataListLen ? (this.param.noData = true) : (this.param.finished = true)),
							(this.param.loading = false),
							dataListLen > 0)
					) {
						for (var i = 0; i < dataListLen; i++) {
							var item = {
								id: res.data[i].guid,
								elogo: this.rootPaht + res.data[i].logo,
								ename: res.data[i].title,
								eventdate: res.data[i].jointime,
								eaddress: res.data[i].address,
								isrecommend: res.data[i].isrecommend,
								ephone: res.data[i][this.$param.hoteventPhoneKey],
								etype: res.data[i][this.$param.hoteventTypeKey].dicname,
								distance: this.$util.formatDistance(res.data[i].distance)
							};
							this.listDatas.push(item);

						}
						//console.log(this.param.finished);
					}
					uni.hideLoading();
				});
			}
			/* requestLocation:function(){
			    this.longitude = 31.22;
			    uni.getLocation({
			        type: 'wgs84',
			        success: function (res) {
			        this.longitude = res.longitude;
			        this.latitude = res.latitude;

			            console.log('当前位置的经度：' + res.longitude);
			            console.log('当前位置的纬度：' + res.latitude);
			        }
			    });
			  } */
		}
	};
</script>

<style>
	page{background-color: #fff;}
	.sort-page {
		top: 180rpx
	}

	.filter-page {
		top: 180rpx;
	}
</style>