yiliangyiyun-app/pages/grain_pulse/position/position.vue

<template>
	<view class="">
		<view class="header">
			<view class="city Medium">
				<text class="select-city" @click="loadCity">{{city}}</text>
				<u-icon name="arrow-down"></u-icon>
			</view>
			<u-search input-align="left" :disabled="true" @click="searchAddress" :show-action="false" height="70"
				placeholder="请输入位置信息" v-model="addressName"></u-search>
		</view>
		<view class="header2">
			<view class="header2-tip Regular">
				当前定位
			</view>
			<view class="header2-content">
				<view class="left Medium">
					<u-icon name="arrow-down"></u-icon>
					<view class="">{{address}}</view>
					<view class="" v-if="isposition">{{text}}</view>
				</view>
				<view class="reposition Regular" @click="reloadPosition">重新定位</view>
			</view>

		</view>

		<view class="position-list Regular">
			<view class="search">
				<view>最近搜索</view>
				<u-icon name="trash-fill" color="#AFB3BF" size="28" @click="delList"></u-icon>
			</view>
			<view class="search-list">
				<view v-for="(item,index) in list" class="search-list-item" @click="toHome(item)">
					{{item}}
				</view>
			</view>

		</view>

	</view>
</template>

<script>
	import permision from "@/js_sdk/wa-permission/permission.js"
	import uniSegmentedControl from "@/components/uni-segmented-control/uni-segmented-control.vue"
	export default {
		components: {
			uniSegmentedControl
		},
		data() {
			return {
				addressName: "",
				isposition: false,
				isIos: true,
				address: "定位失败,请点击重新定位",
				city: '营口市',
				list: [],
				src: {},
				addressObj: {}
			}
		},
		onLoad(e) {
			debugger
			if (e.city) {
				this.city = e.city
			}
			let that = this
			uni.getStorage({
				key: 'SearchList_key',
				success: function(res) {
					debugger
					that.list = res.data
				}
			});
			// 获取定位
			this.utils.getLocation().then(function(res) {
				debugger
				console.log("定位信息",res)
				if (res.errMsg != "getLocation:ok") {
					// 定位权限未开启，引导设置
					uni.showModal({
						title: '温馨提示',
						content: '您已拒绝定位,请开启',
						confirmText: '去设置',
						success(res) {
							if (res.confirm) {
								//打开授权设置
								this.utils.openSetting()
							}
						}
					})
				}
			})
		},
		methods: {
			// 删除最近搜索
			delList() {
				uni.setStorage({
					key: 'SearchList_key',
					data: []
				});
			},
			// 重新定位
			reloadPosition() {
				// this.getLocation()
			},
			openSetting() {
				// App跳转系统的设置界面
				// #ifdef APP-PLUS
				uni.getSystemInfo({
					success(res) {
						if (res.platform == 'ios') { //IOS
							plus.runtime.openURL("app-settings://");
						} else if (res.platform == 'android') { //安卓
							let main = plus.android.runtimeMainActivity();
							let Intent = plus.android.importClass("android.content.Intent");
							let mIntent = new Intent('android.settings.ACTION_SETTINGS');
							main.startActivity(mIntent);
						}
					}
				});
				// #endif
			},
			// 跳转ios权限界面
			judgeIosPermission: function(permisionID) {
				var result = permision.judgeIosPermission(permisionID)
				console.log(result);
				var strStatus = (result) ? "已" : "未"
				uni.showModal({
					content: permisionID + '权限' + strStatus + "获得授权",
					showCancel: false
				});
			},
			// 跳转安卓权限界面
			async requestAndroidPermission(permisionID) {
				var result = await permision.requestAndroidPermission(permisionID)
				var strStatus
				if (result == 1) {
					strStatus = "已获得授权"
				} else if (result == 0) {
					strStatus = "未获得授权"
				} else {
					strStatus = "被永久拒绝权限"
				}
				uni.showModal({
					content: permisionID + strStatus,
					showCancel: false
				});
			},
			// 搜索
			searchAddress(val) {
				console.log(val)
				let that = this;
				uni.chooseLocation({
					success: function(res) {
						console.log('位置名称：' + res.name);
						console.log('详细地址：' + res.address);
						console.log('纬度：' + res.latitude);
						console.log('经度：' + res.longitude);
						that.list.push(res.name)
						this.src = res
						uni.setStorage({
							key: 'SearchList_key',
							data: that.list
						});
					}
				});

			},
			// 切换城市
			loadCity() {
				uni.navigateTo({
					url: "../selectCity/selectCity"
				})
			},
			toHome(item) {
				uni.navigateTo({
					url: "../home?src=" + this.src
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	/deep/.u-content {
		padding-left: 170rpx;
	}

	.header {
		position: relative;
		display: flex;
		background: white;
		padding: 20rpx;

		.city {
			top: 0;
			bottom: 0;
			left: 50rpx;
			margin: auto;
			position: absolute;
			display: flex;
			align-items: center;

			.select-city {
				margin-right: 4rpx;
			}

		}
	}

	.header2 {
		background: white;
		border-radius: 0 0 20rpx 20rpx;
		padding: 0 20rpx 34rpx 20rpx;

		.header2-tip {
			font-size: 28rpx;
			color: #AFB3BF;
		}

		.header2-content {
			font-size: 32rpx;
			color: #333333;
			display: flex;
			justify-content: space-between;
			margin-top: 12rpx;

			.left {
				display: flex;
			}

			.reposition {
				font-size: 28rpx;
				color: #22C572;
			}
		}
	}

	.position-list {
		margin-top: 20rpx;
		background: white;
		border-radius: 20rpx 20rpx 0 0;
		padding: 10rpx;


	}

	.search {
		display: flex;
		justify-content: space-between;
		padding: 0 20rpx;
	}

	.search-list {
		padding: 20rpx;
	}

	.search-list-item {
		display: inline-block;
		background: #F5F6F9;
		border-radius: 32rpx;
		padding: 16rpx 24rpx;
		margin: 0 20rpx 20rpx 0;
	}
</style>