<template>
	<view class="">
		<view class="an_box_mes wc_sbox">
			<view class="dy_fx an_sch amb_30">
				<view class="fx_1">
					<input v-model="searchValue" @confirm="search" type="text" class="an_sch_ipt" confirm-type="search" placeholder-style="color:#999" placeholder="输入720全景名称" />
				</view>
				<view class="an_sch_img" @click="search"><image src="../../static/animg/icon-search.png" class="ac_size_1"></image></view>
			</view>
			<!-- <view class="search-container">
				<view class="search-tip-bar">
					<view @tap="changeRegionPanel" :class="[searchItemClass, selectedParam.hiddenRegionPanel ? 'active' : '']" data-type="hiddenRegionPanel">{{ regionname }}</view>
				</view>
			</view> -->
		</view>
		<!-- <view class="an_box_mes wc_sbox">
			<view class="dy_fx an_sch">
				<view class="fx_1">
					<input v-model="searchValue" @confirm="search" type="text" class="an_sch_ipt" confirm-type="search" placeholder-style="color:#999" placeholder="输入线路名称" />
				</view>
				<view class="an_sch_img" @click="search"><image src="../../static/animg/icon-search.png" class="ac_size_1"></image></view>
			</view>

			<view class="dy_fx amt_30 amb_30">
				<view @tap="changeRegionPanel" :class="[searchItemClass, selectedParam.hiddenRegionPanel ? 'active' : '']" data-type="hiddenRegionPanel">{{ regionname }}</view>

				<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> -->
		<scroll-view @scroll="onReachScroll" @bindscrolltolower="lower" class="scroll-view" :scroll-top="topNum" scrollY="true">
			<view class="mode_com">
				<!-- <navigator class="list-item" hover-class="none" :url="'/pages/scenic/scenicdetial/url720/url720?url='+itemName.address" v-for="(itemName,index) in listDatas" :key="index">
						<image class="item-pic" mode="aspectFill" :src="itemName.logo"></image>
						<view class="item-desc">{{itemName.title}}</view>
					</navigator> -->
				<view class="quanj_lst">
					<view class="shij_list">
						<view class="shij_img">
							<image @click="url720(listDatas[0].address, listDatas[0].id)" :src="listDatas[0].logo" class="shij_pic" mode="aspectFill"></image>
							<text class="hd_bqa">热门</text>
							<view class="quanj_inf">
								<text class="ht_text">{{ listDatas[0].title }}</text>
							</view>
							<!-- <image src="../../static/images/icn_voice.png" class="voe_btn"></image> -->
						</view>
					</view>

					<view class="dly_flex_c h_zbian ">
						<view
							@click="url720(itemName.address, itemName.id)"
							class="half_unit"
							v-if="index != 0"
							:url="'/pages/scenic/scenicdetial/url720/url720?url=' + itemName.address"
							v-for="(itemName, index) in listDatas"
							:key="index"
						>
							<image :src="itemName.logo" class="h_zb_pic" mode="aspectFill"></image>
							<view class="ht_text control_2">{{ itemName.title }}</view>
						</view>
					</view>
				</view>
			</view>

			<view class="data-loading" v-if="param.loading">
				<image class="icon" src="../../static/images/loading-icon.png"></image>
				加载中…
			</view>
			<view class="data-is-bottom" style="text-align: center;" v-if="param.finished">{{ this.$param.pageMsg }}</view>
			<view class="no-data-info" v-if="param.noData">{{ this.$param.dataMsg }}</view>
		</scroll-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.mc"
					data-type="bm"
					:data-id="item.bm"
					v-for="(item, index) in filter.regionList"
					:key="index"
				>
					{{ item.mc }}
				</view>
			</view>
		</view>
	</view>
</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: [],
			parentLevelItem: 'attribute_ltype',
			defaultFilter: {},
			latitude: 0,
			longitude: 0,
			selectedFIlterBak: {
				price: 0
			},
			selectedFIlter: {
				attribute_ltype: 0
			},
			selectedParam: {
				sortId: 1,
				bm: '',
				hiddenSortPanel: !0,
				hiddenAttributePanel: !0,
				hiddenRegionPanel: !0
			},
			param: {
				page: 1,
				noData: !1,
				loading: !1,
				finished: !1
			},
			listDatas: [],
			topNum: 0,
			rootPaht: this.$config.ROOTPATH,
			stype: '',
			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
		});
		var region = option.region;
		this.initData();
		if (region != null && region != '') {
			this.get_data(region);
		} else {
			this.getRedisData();
		}
		that.$util.saveOperatorLog(that, 'FUN', '720全景');
	},
	onShow() {
		this.destinationBak != this.destination && (this.initData(), this.get_data());
	},
	methods: {
		search: function() {
			uni.showLoading({
				title: '加载中',
				mask: true
			});
			this.initData();
			this.get_data();
		},
		getRedisData: function() {
			var that = this;
			var data = {
				key: this.$param.userkey + '_VR_list'
			};

			that.$Request.post(that.$config.getRedisData, data).then(res => {
				if (res.status == 200) {
					var listDatas = this.listDatas,
						dataListLen = res.data.hoteventList.length;
					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++) {
							if (res.data.hoteventList[i].address.length > 10) {
								var item = {
									id: res.data.hoteventList[i].guid,
									logo: this.rootPaht + res.data.hoteventList[i].logo,
									title: res.data.hoteventList[i].title,
									address: res.data.hoteventList[i].address
								};
								this.listDatas.push(item);
								uni.hideLoading();
							}
						}
					}
				} else {
					that.get_data();
				}
			});
		},
		initData: function() {
			
			var param = {};
			param.page = 1;
			param.noData = false;
			param.finished = false;

			this.param = param;
			this.listDatas = [];
			this.destinationBak = this.destination;
		},
		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.regionname = dataset.name;
			this.get_data(this.selectedParam.bm);
		},
		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);
		},
		get_attribute: function() {
			var url = this.$config.quyuList;
			var data = {
				type: 'line'
			};

			this.$Request.post(url, data).then(res => {
				var e = {
					price: 0
				};
				var all = {
					bm: this.$config.ARER_CODE,
					mc: '邯郸'
				};

				this.filter = res.data;
				//this.selectedFIlter = e;
				this.defaultFilter = e;
				this.filter.regionList.unshift(all);
			});
		},
		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();
		},
		get_data: function(selectRegion) {
			this.param.loading = true;
			//var level = this.selectedFIlterBak['attribute_hlevel'];
			var region = selectRegion;
			if (region == undefined || region == null) {
				region = '';
			}
			var that = this;
			var url = this.$config.getMessageInfoFormFilter;
			var requestData = {
				type: this.$param.vrType,
				userkey: this.$param.userkey,
				pageno: this.param.page,
				pageSize: 10,
				sort: 2,
				region: region,
				title:this.searchValue
			};
			this.$Request.post(url, requestData).then(res => {
				console.log(res);
				var flag = that.$util.isSuccess(res);
				if (!flag) {
					uni.hideLoading();
					return;
				}
				var listDatas = this.listDatas,
					dataListLen = res.data.length;
				if (
					(dataListLen == requestData.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++) {
						if (res.data[i].address.length > 10) {
							var item = {
								id: res.data[i].guid,
								logo: this.rootPaht + res.data[i].logo,
								title: res.data[i].title,
								address: res.data[i].address
							};
							this.listDatas.push(item);
						
						}
					}
				}
				uni.hideLoading();
			});
		},
		url720: function(e, guid) {
			uni.navigateTo({
				url: '/pages/scenic/scenicdetial/url720/url720?url=' + this.$base64.encode(e) + '&guid=' + guid
			});
		}
	}
};
</script>

<style>
@import url('../../static/css/common.css');
@import url('../index/index.css');
@import url('url720list.css');
</style>
