dev/dcp-app-gate/pages/profile/personIntegrate/addAddress.vue

<template>
	<view>
		<view>
			<u-navbar :back-text="i18n('Back')" :back-text-style="backStyle" back-icon-color="#fff" title-color="#fff"
				:background="background" title-width="300" :title="i18n('addConsignee')"></u-navbar>
		</view>

		<view style="background: #fff;box-sizing:border-box;padding: 20rpx;">
			<u-form :model="form" ref="uForm">
				<u-form-item label-width="140rpx" :label="$i18n.locale == 'zh' ? '姓名:' : 'Name:'">
					<u-input maxlength="20" :placeholder="$i18n.locale == 'zh'? '请输入姓名': 'Please enter your name'"
						type="text" :border="border" v-model="form.name" />
				</u-form-item>
				<u-form-item label-width="140rpx" :label="$i18n.locale == 'zh' ? '手机号码:' : 'Phone:'">
					<u-input :placeholder="$i18n.locale == 'zh'? '请输入手机号码': 'Please enter your phone'" type="text"
						:border="border" v-model="form.phone" />
				</u-form-item>
				<u-form-item label-width="140rpx" :label="$i18n.locale == 'zh' ? '邮政编码:' : 'Code:'">
					<u-input :placeholder="$i18n.locale == 'zh'? '请输入邮政编码': 'Please enter your post code'" type="text"
						:border="border" v-model="form.postCode" />
				</u-form-item>

				<u-form-item v-if="$i18n.locale == 'zh'" label-width="140rpx"
					:label="$i18n.locale == 'zh' ?'所在区域:':'Areas:'">

					<u-input :disabled='info' :placeholder="$i18n.locale == 'zh'?'请选择地区':'Please select a region'"
						:border="border" v-model="this.form.division" @tap='cancelInfo'></u-input>

					<u-select v-model="show" mode="muitl-column-auto" child-name="child" value-name="id"
						label-name="name" :list="sysAreaList" @confirm="confirm">
					</u-select>

					<u-picker mode="region" v-model="show" :area-code='["11", "1101", "110101"]' @confirm="confirm">
					</u-picker>

				</u-form-item>

				<u-form-item label-width="140rpx" :label="$i18n.locale == 'zh' ? '详细地址:' : 'Detail:'">
					<u-input :placeholder="$i18n.locale == 'zh'? '请输入详细地址': 'Please enter detail address'" type="text"
						:border="border" v-model="form.address" />
				</u-form-item>
				<u-form-item>
					<u-checkbox-group>
						<u-checkbox v-model="form.status" shape="circle">
							{{$i18n.locale=='zh'?'设为默认地址':'Set as default address'}}
						</u-checkbox>
					</u-checkbox-group>
				</u-form-item>
			</u-form>
			<view>
				<u-button @tap="save" shape="circle" type="primary">
					<text style="margin-left:20rpx">{{$i18n.locale=='zh'?'保存':'Save'}}</text>
				</u-button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		addUmsUserCommodityAddresss
	} from "@/api/address"
	export default {
		data() {
			return {
				info: true,
				background: {
					backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
				},
				backStyle: {
					color: '#FFFFFF',
				},
				name: "name",
				id: "id",
				child: "child",
				test: [],
				form: {
					name: '',
					phone: '',
					postCode: '',
					division: "",
					address: "",
					status: false,
				},
				border: true,
				show: false,
				userId: null,
				sysAreaList: [],
			}
		},
		onShow() {
			// this.getSysAreaList()
		},
		methods: {
			cancelInfo() {
				uni.hideKeyboard()
				this.show = true
			},
			navTo(route) {
				this.$mRouter.push({
					route
				});
			},
			i18n(data) {
				return this.$t('common.' + data);
			},
			async save() {
				this.userId = JSON.parse(uni.getStorageSync("user")) || ''
				let params = {
					// id: this.addressForm.id,
					userId: this.userId.id,
					consignee: this.form.name,
					mobile: this.form.phone,
					province: this.test[0],
					city: this.test[1],
					area: this.test[2],
					address: this.form.address,
					postalCode: this.form.postCode,
					status: this.form.status ? '1' : '0',
				};
				const tokendata = await this.$myRequest({
					url: '/sys/token',
					method: 'get'
				});
				// console.log('---------++++++>>>>>>', tokendata.data);
				addUmsUserCommodityAddresss(params, tokendata.data).then((res) => {
					if (res.status == '200') {
						this.navTo('/pages/profile/personIntegrate/userAddress')
					}
				});
			},
			confirm(e) {
				console.log(e)
				this.form.division = e.province.label + '/' + e.city.label + '/' + e.area.label;
				let str = e.province.label + '/' + e.city.label + '/' + e.area.label;
				this.test = str.split('/')

			}
		}
	}
</script>

<style>
</style>