<template>
	<view>
		<view v-if="storeList == '' " class="mart60 fotct font14 fcor666">
			<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
		</view>
		<view class="store-head width90" v-for="(goods,i) in storeList" :key="i">
			<image class="mart10 flleft" :src='imageUrl+goods.ext1'></image>
			<view class="storefig">
				<view class="store-cont-le flleft" @click="jumpdetails(goods.id)">
					<view class="text1 fcor333 font14 store-title paddtop10">{{goods.storeName}}</view>
					<view class="width100 mart5 height22">
						<view class="store-labl flleft fcor999 marglerig fotct font12">在线加油</view>
						<view class="store-labl flleft fcor999 marglerig fotct font12">{{goods.operatorName}}</view>
					</view>
					<view class="text1 font13 fcor666 width100">{{goods.address}}</view>
				</view>
				<view class="store-cont-rg flright fotrt mart20" @click="seeloaction(goods)">
					<image
						src="data:image/png;base64,[encoded data, 10084 characters]">
					</image>
					<view class="font12 fcor666">{{goods.distance}}km</view>
				</view>
			</view>
		</view>
		<view class="loading-text">{{ loadingText }}</view>
	</view>
</template>

<script>
	import {
		getStoreListByCoupon
	} from "../../../Utils/Api.js";
	let app = getApp()
	export default {
		data() {
			return {
				storeList: [],
				storeId: '',
				imageUrl: app.globalData.imgUrl,
				pageNum: 1,
				pageSize: 10,
				isNoMoreData: false,
				loadingText: ''
			}
		},
		onLoad(options) {
			this.storeId = options.id;
			this.getStoreListByCoupon();
		},
		onReachBottom() {
			// this.getStoreListByCoupon();
		},
		methods: {
			/**
			 * 查询门店列表
			 */
			getStoreListByCoupon() {
				uni.showLoading({
					title: '加载中...'
				})
				if (this.isNoMoreData) {
					uni.hideLoading()
					this.loadingText = '到底了';
					return false;
				}
				// let pagenum = this.pageNum;
				let params = {
					couponId: this.storeId,
					longitude: app.globalData.longitude,
					latitude: app.globalData.latitude
				}
				getStoreListByCoupon(params).then(res => {
					if (res.return_code == '000000') {
						this.storeList = res.return_data
						setTimeout(function() {
							uni.hideLoading();
						}, 2000);
						// this.isNoMoreData = res.return_data.length == this.pageSize ? false : true;
						// this.pageNum = res.return_data.length == this.pageSize ? ++pagenum : pagenum;
						// this.storeList = this.storeList.concat(res.return_data);
					} else {
						uni.hideLoading()
					}
				})
			},
			/**
			 * 定位
			 */
			seeloaction(e) {
				uni.openLocation({
					latitude: Number(e.latitude), //目的地的定位
					longitude: Number(e.longitude), //目的地的定位
					name: e.storeName,
					address: e.address
				})
			},
			/**
			 * 跳转门店详情
			 */
			jumpdetails(e) {
				uni.navigateTo({
					url: './store-details?id=' + e
				})
			}
		}
	}
</script>

<style lang="scss">
	.loading-text {
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		height: 60upx;
		color: #979797;
		font-size: 24upx;
	}

	.store-head {
		height: 80px;
		border-bottom: 1px solid #f4f4f4;

		image {
			width: 60px;
			height: 60px;
		}
	}

	.storefig {
		margin-left: 70px;
	}

	.store-cont-le {
		width: 80%;
	}

	.store-cont-rg {
		width: 20%;

		image {
			width: 30px;
			height: 30px;
		}
	}

	.store-title {
		font-weight: 600;
	}

	.store-labl {
		border: 1px solid #f5f5f5;
		box-shadow: 0px 0px 2px 0px;
	}
</style>
