baozhida-mall-applet/pages/mine/newAddress.vue

<template>
	<view class="content">
		<button @tap="authVerification">请选择位置</button>
		<view style="margin-left: 20rpx;">地址信息</view>
		<view class="box_new_address">
			<u-form :model="model" :rules="rules" labelPosition="left" labelWidth="80" ref="uForm" :required="true">
				<u-form-item label="姓名" prop="userInfo.name" borderBottom>
					<u-input v-model="model.userInfo.name" border="none"></u-input>
				</u-form-item>
				<u-form-item label="手机号" prop="userInfo.phone" borderBottom>
					<u-input v-model="model.userInfo.phone" border="none"></u-input>
				</u-form-item>
				<u-form-item label="所在地区" prop="userInfo.region" borderBottom>
					<u-input v-model="model.userInfo.region" border="none">
						<template slot="suffix">
							<view class="same_row_in" @tap="authVerification">
								<u-icon name="map-fill" color="#909399" size="16"></u-icon>
								<view style="color: #909399;margin-left: 5rpx;">定位</view>
							</view>
						</template>
					</u-input>
				</u-form-item>
				<u-form-item label="详细地址" prop="userInfo.address" borderBottom>
					<u-input v-model="model.userInfo.address" border="none"></u-input>
				</u-form-item>
				<u-form-item label="地址标签" prop="userInfo.tag" borderBottom>
					<view>
						<view v-for="(item,index) in "></view>
					</view>
				</u-form-item>
				<u-form-item label="设为默认收货地址" prop="userInfo.tag" borderBottom>
					<view>
						<view v-for="(item,index) in "></view>
					</view>
				</u-form-item>
			</u-form>
		</view>
		<view class="box_new_address">
			<u-textarea v-model="value1" placeholder="请粘贴或输入文本,点击" ></u-textarea>
		</view>
		<x-bottomBtn title="保存地址" @buttonClick="buttonClick"></x-bottomBtn>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				currentLocation: {},
				model: {
					userInfo: {
						name: 'uView UI',
						phone: 'uView UI',
						region: '',
						address: '',
						tag: '',
					},
				},
				rules: {
					'userInfo.name': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'userInfo.phone': {
						type: 'string',
						required: true,
						message: '请填写手机号',
						trigger: ['blur', 'change']
					},
				},
				value1:'',
			}
		},
		onShow() {
			uni.getStorage({
				key: 'currentLocation',
				success: (res) => {
					this.currentLocation = res.data
				}
			})
		},
		methods: {
			authVerification() {
				uni.getSetting({
					success: (res) => {
						if (res.authSetting['scope.userLocation']) {
							/* 用户授权成功时走这里 */
							this.handerChooseLocation()
						} else if (res.authSetting['scope.userLocation'] === undefined) {
							/* 用户未授权时走这里 */
							console.log('没有授权')
							this.handleOpenSetting()
						} else {
							/* 用户拒绝了授权后走这里 */
							console.log('拒绝了授权 false')
							this.handleOpenSetting()
						}
					},
				})
			},
			handerChooseLocation(latitude, longitude) {
				uni.chooseLocation({
					latitude: latitude || '',
					longitude: longitude || '',
					success: (res) => {
						console.log('wx.chooseLocation res=', res)
						uni.setStorageSync('currentLocation', res)
					},
					fail: function(err) {
						console.log('取消按钮', err)
					}
				})
			},
			handleOpenSetting() {
				wx.openSetting({
					success: (res) => {
						console.log('定位 openSetting', res)
						if (res.authSetting["scope.userLocation"]) {
							this.handerChooseLocation()
						}
					}
				})
			}
		}
	}
</script>
<style lang="scss">
	.box_new_address {
		margin: 20rpx;
		background-color: #fff;
		border-radius: 10rpx;
		padding: 20rpx;
	}
</style>