<template>
	<view>
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">
				选择地址
			</block>
			<block slot="right">
				<view class="" style="color: #000000; font-size: 26rpx; margin-right: 40rpx;" @tap="jumpAddress()">
					新增地址
				</view>
			</block>
		</cu-custom>
		<view class="" style="margin-top: 15rpx;">
		</view>
		<view class="bg-ff padding-sm flex" style="">
			<view class="" style="flex: 1;margin-right: 20rpx;">
				<view class="" style="display: flex;align-items: center;" @click.stop="choose(currentAddress)">
					<view class="" style="font-size: 32rpx;color: #111;font-weight: bold;" v-if="currentAddress.title">
						{{currentAddress.title}}
					</view>
					<view class="" v-else style="font-size: 32rpx;color: #111;font-weight: bold;">
						定位失败,请手动切换
					</view>
				</view>
				<view class="margin-top-sm">
					<view class="" style="font-size: 26rpx;color: #999;">
						{{currentAddress.address}}
					</view>
				</view>
			</view>

			<view class="" style="display: flex;align-items: center;width: 160rpx;"
				@click.stop="getAddressLocation">
				<image src="../../../static/relocation.png" mode="" style="width: 34rpx;margin-right: 0.5vw;"
					mode="widthFix"></image>
				<text style="color: #FC6035;font-weight: 500;">重新定位</text>
			</view>
		</view>
		<view class="margin-top">
			<view class="" style="margin: 0 0 20rpx 20rpx;">
				我的地址
			</view>
			<view class="padding" v-for="(item,index) in myAddresses" :key="index" @click="chooseAddress(item)"
				style="border-bottom: #F3F3F3 1rpx solid; background-color: #FFFFFF;">
				<view class="flex justify-between align-center">
					<view class="flex-direction">
						<view class="" style="font-size: 31rpx;color: #111111;font-weight: bold;">
							{{item.address+item.detailed}}
						</view>
						<view class="flex align-center" style="color: #999999;margin-top: 10rpx;">
							<view class="">
								{{item.name}}
							</view>
							<view class="" style="margin-left: 30rpx;">
								{{item.phone}}
							</view>
						</view>
					</view>
					<view @click.stop="jumpUpdateAddress(item)" class="margin-right">
						<image src="../../../static/edit_2x.png" mode="" style="width: 32rpx; height: 32rpx;"></image>
					</view>
				</view>
			</view>
		</view>
		<view class="margin-top">
			<view class="" style="margin: 0 0 20rpx 20rpx;">
				附近地址
			</view>
			<view class="bg-ff" style="" v-show="nearList.length>0">
				<view class="padding-sm" v-for="(item,index2) in nearList" :key="index2">
					<view class=" flex-direction justify-around " style="border-bottom: 1rpx solid #F3F3F3;"
						@click.stop="choose(item)">
						<view class="" style="margin-bottom: 10rpx;">
							<view class="" style="font-size: 32rpx;color: #111;font-weight: bold;">
								{{item.title}}
							</view>
						</view>
						<view class="" style="margin-bottom: 20rpx;">
							<view class="" style="font-size: 26rpx;font-weight: 500;color: #999;">
								{{item.address}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	export default {

		data() {
			return {
				///1.地址列表
				myAddresses: [],
				outAddressList: [],
				flag: true,
				merchantId: '',
				currentAddress: uni.getStorageSync('addressName'),
				nearList: []
			}
		},
		onShow() {
			this.getAddressList();
			this.getAddressLocation()
		},
		onLoad(options) {
			if (options.flag) {
				this.flag = options.flag
				// console.log(this.flag, '111111')
			}
			if (options.merchantId) {
				this.merchantId = options.merchantId
			}
			// console.log(options)

		},
		methods: {
			choose(item) {
				uni.removeStorageSync('addressName')
				uni.setStorageSync('addressName', item)
				// console.log(item)
				uni.navigateBack({
					delta: 1
				})
			},
			getAddressLocation() {
				const that = this
				uni.getLocation({
					geocode: true,
					type: 'gcj02',
					success: function(res) {
						// console.log(res, 'getAddressLocation')
						let location = [res.latitude, res.longitude]
						let StringLocation = location.toString()
						let url = 'https://apis.map.qq.com/ws/geocoder/v1?&output=jsonp';
						that.$jsonp(url, {
								key: '2KVBZ-JCJC5-WWCIG-QALQX-3HLMZ-A7FPF',
								location: StringLocation,
								get_poi: 1
							})
							.then(res => {
								// 获取附近地址赋值
								// console.log(res, 'res')
								let list = res.result.pois
								list.forEach(item => {
									item.address = item.address.substring(3)
								})
								that.nearList = list
								that.currentAddress = list[0]

							})

					},

				})
			},
			// 查询地点信息
			chooseAddress(item) {
				if (this.flag == true) {
					const obj = {
						title: item.address,
						location: {
							lat: item.latitude,
							lng: item.longitude
						}
					}
					uni.setStorageSync('address', item)
					uni.setStorageSync('addressName', obj)
					uni.navigateBack({
						delta: 1
					})
				} else {
					return
				}

			},
			///1.获取地址列表
			getAddressList() {
				const param = {
					memberId: uni.getStorageSync('userInfo').memberId, //会员id
				}
				if (this.merchantId) {
					param.merchantId = this.merchantId
				}
				this.$u.api.addressList(param).then(res => {
					console.log(res, 'resresres', param)
					if (res.code == 200) {
						this.myAddresses = res.data.addressList
						this.outAddressList = res.data.outAddressList
					}
				})

			},
			///2.跳转到地址编辑
			jumpUpdateAddress(obj) {
				uni.navigateTo({
					url: "/pages/mine/minePage/updateAddress?addressInfo=" + JSON.stringify(obj),
				});
			},
			jumpAddress() {
				uni.navigateTo({
					url: "/pages/mine/minePage/updateAddress"
				});
			},

		}
	}
</script>

<style>

</style>
