|
|
|
@ -1,33 +1,27 @@ |
|
|
|
|
<template> |
|
|
|
|
<view class="page-bottom-fixed backcor9"> |
|
|
|
|
<form @submit="form_submit" class="form-container"> |
|
|
|
|
<view class="pd-main height100"> |
|
|
|
|
<view class="pd-main border-box height100" style="overflow-y: auto;"> |
|
|
|
|
<view class="form-gorup backcolorfff"> |
|
|
|
|
<!-- <view class="form-gorup-item-left"> |
|
|
|
|
<view class="form-gorup-title marb10">联系人<text class="form-group-tips-must">*</text></view> |
|
|
|
|
<input type="text" name="name" v-model="userAddress.name" maxlength="5" |
|
|
|
|
placeholder-class="corf6" class="fcor666 " placeholder="联系人2~5个字符"> |
|
|
|
|
<view class="dis-flex"> |
|
|
|
|
<view class="form-gorup-title marRight10">收货人: |
|
|
|
|
</view> |
|
|
|
|
<view class="form-gorup-item-right"> |
|
|
|
|
<view class="form-gorup-title marb10">联系电话<text class="form-group-tips-must">*</text></view> |
|
|
|
|
<input type="number" name="tel" v-model="userAddress.tel" maxlength="11" |
|
|
|
|
placeholder-class="corf6" class="fcor666" placeholder="手机号"> |
|
|
|
|
</view> --> |
|
|
|
|
<!-- --> |
|
|
|
|
|
|
|
|
|
<view class="form-gorup-title">联系人<text class="form-group-tips-must">*</text> |
|
|
|
|
<input type="text" name="name" v-model="userAddress.name" placeholder-class="corf6" |
|
|
|
|
class="fcor666 flex-1 bs-bb" placeholder="名字"> |
|
|
|
|
</view> |
|
|
|
|
<input type="text" name="name" v-model="userAddress.name" |
|
|
|
|
placeholder-class="corf6" class="fcor666 bs-bb" placeholder="联系人2~5个字符"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view class="width100 mart10 border-b"> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="form-gorup-title">联系电话<text class="form-group-tips-must">*</text> |
|
|
|
|
<view class="dis-flex"> |
|
|
|
|
<view class="form-gorup-title marRight10">手机号码: |
|
|
|
|
</view> |
|
|
|
|
<input type="number" name="tel" v-model="userAddress.tel" maxlength="11" |
|
|
|
|
placeholder-class="corf6" class="fcor666" placeholder="手机号"> |
|
|
|
|
placeholder-class="corf6" class="fcor666 flex-1" placeholder="手机号"> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- --> |
|
|
|
|
</view> |
|
|
|
@ -35,16 +29,16 @@ |
|
|
|
|
<view class="form-gorup backcolorfff"> |
|
|
|
|
<view class=""> |
|
|
|
|
<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion"> |
|
|
|
|
<view class="dis-flex flex-sp form-gorup-title"> |
|
|
|
|
<view class=" flex-1">点击选择省市区<text class="form-group-tips-must">必选</text></view> |
|
|
|
|
|
|
|
|
|
<view class="icon-ymt to-right font14 fcor666"> |
|
|
|
|
|
|
|
|
|
<view class="dis-flex "> |
|
|
|
|
<view class=" form-gorup-title">所在地区:</view> |
|
|
|
|
<view class="dis-flex flex-1 flex-end"> |
|
|
|
|
<view class=" pickRes fcor666">{{userAddress.region || '请选择'}}</view> |
|
|
|
|
<view class="icon-ymt to-right font14 fcor666"></view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</pick-regions> |
|
|
|
|
<view class=" pickRes fcor666" >{{userAddress.region || '请选择'}}</view> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="width100 mart10 border-b"> |
|
|
|
@ -52,15 +46,30 @@ |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view style="clear: both;"> |
|
|
|
|
<view class="form-gorup-title">详细地址<text class="form-group-tips-must">*</text> |
|
|
|
|
<!-- <view style="clear: both;"> --> |
|
|
|
|
<view class="dis-flex"> |
|
|
|
|
<view class="form-gorup-title marRight10">详细地址:</view> |
|
|
|
|
|
|
|
|
|
<uni-combox @location="location" placeholderClass="corf6" :candidates="candidates" class="flex-1" :isAddress="true" :isShowIcon="false" placeholder="请输入详细地址" v-model="userAddress.address"> |
|
|
|
|
|
|
|
|
|
<view class="selector-item" v-for="(item,index) in candidates" :key="index" @click="getSelect(item)"> |
|
|
|
|
<view class="text1 name"> |
|
|
|
|
{{item.name}} |
|
|
|
|
</view> |
|
|
|
|
<view class="text1 address mart5"> |
|
|
|
|
{{item.address}} |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<input type="text" name="address" v-model="userAddress.address" maxlength="40" |
|
|
|
|
placeholder-class="corf6" :class="'fcor666 bs-bb '" placeholder="详细地址1~40个字符"> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</uni-combox> |
|
|
|
|
<!-- <input type="text" name="address" v-model="userAddress.address" maxlength="40" |
|
|
|
|
placeholder-class="corf6" :class="'fcor666 bs-bb flex-1'" placeholder="详细地址1~40个字符"> --> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<!-- </view> --> |
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
<view class="default-checkbox " @click="defaultChange"> |
|
|
|
@ -80,10 +89,16 @@ |
|
|
|
|
</view> |
|
|
|
|
</template> |
|
|
|
|
<script> |
|
|
|
|
|
|
|
|
|
import pickRegions from '@/components/pick-regions/pick-regions.vue' |
|
|
|
|
|
|
|
|
|
import {insertDeliveryAddress,findDeliveryAddressById,updateDeliveryAddress } from '@/Utils/physicalObject.js' |
|
|
|
|
import UniCombox from '@/components/uni-combox/components/uni-combox/uni-combox.vue' |
|
|
|
|
|
|
|
|
|
import { |
|
|
|
|
insertDeliveryAddress, |
|
|
|
|
findDeliveryAddressById, |
|
|
|
|
updateDeliveryAddress, |
|
|
|
|
baiduApiMapSearch |
|
|
|
|
} from '@/Utils/physicalObject.js' |
|
|
|
|
let app = getApp(); |
|
|
|
|
export default { |
|
|
|
|
data() { |
|
|
|
|
return { |
|
|
|
@ -97,30 +112,38 @@ |
|
|
|
|
dataParams: null, |
|
|
|
|
// |
|
|
|
|
region: [], |
|
|
|
|
regionId:'', |
|
|
|
|
regionId: '', |
|
|
|
|
//没用上 |
|
|
|
|
defaultRegion: ['北京市', '市辖区', '东城区'], |
|
|
|
|
defaultRegionCode: '110101', |
|
|
|
|
// defaultRegion: ['北京市', '市辖区', '东城区'], |
|
|
|
|
defaultRegionCode: '', |
|
|
|
|
|
|
|
|
|
candidates:[ |
|
|
|
|
// {"name": "重庆国贸中心-东北门","address": "重庆市渝中区中华路189号",}, |
|
|
|
|
// {"name": "重庆国贸中心-东北门","address": "重庆市渝中区中华路189号",}, |
|
|
|
|
// {"name": "重庆国贸中心-东北门","address": "重庆市渝中区中华路189号",} |
|
|
|
|
], |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}; |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
components: { |
|
|
|
|
pickRegions |
|
|
|
|
pickRegions, |
|
|
|
|
"uni-combox":UniCombox |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
onLoad(params) { |
|
|
|
|
console.log(params) |
|
|
|
|
this.dataParams = params |
|
|
|
|
}, |
|
|
|
|
watch:{ |
|
|
|
|
'userAddress.name':{ |
|
|
|
|
watch: { |
|
|
|
|
'userAddress.name': { |
|
|
|
|
handler(n) { |
|
|
|
|
if(n.length>5){ |
|
|
|
|
setTimeout(()=>{ |
|
|
|
|
this.userAddress.name = this.userAddress.name.substr(0,5) |
|
|
|
|
},0) |
|
|
|
|
if (n.length > 5) { |
|
|
|
|
setTimeout(() => { |
|
|
|
|
this.userAddress.name = this.userAddress.name.substr(0, 5) |
|
|
|
|
}, 0) |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}, |
|
|
|
@ -135,10 +158,16 @@ |
|
|
|
|
// } |
|
|
|
|
}, |
|
|
|
|
onReady() { |
|
|
|
|
let str = "" |
|
|
|
|
if (this.dataParams && this.dataParams.id) { |
|
|
|
|
str = "地址编辑" |
|
|
|
|
} else { |
|
|
|
|
str = "地址添加" |
|
|
|
|
} |
|
|
|
|
uni.setNavigationBarTitle({ |
|
|
|
|
title: '地址'+(((this.dataParams.id || null) == null) ? '添加' : '编辑') |
|
|
|
|
title: str, |
|
|
|
|
}); |
|
|
|
|
if(this.dataParams.id){ |
|
|
|
|
if (this.dataParams && this.dataParams.id) { |
|
|
|
|
this.findAddressById(this.dataParams.id) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -147,11 +176,11 @@ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
methods: { |
|
|
|
|
findAddressById(id){ |
|
|
|
|
findAddressById(id) { |
|
|
|
|
let params = { |
|
|
|
|
id:id |
|
|
|
|
id: id |
|
|
|
|
} |
|
|
|
|
findDeliveryAddressById(params).then(res=>{ |
|
|
|
|
findDeliveryAddressById(params).then(res => { |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
let resData = res.return_data; |
|
|
|
|
this.userAddress = { |
|
|
|
@ -166,7 +195,7 @@ |
|
|
|
|
this.regionId = resData.regionId; |
|
|
|
|
// console.log(this.defaultRegionCode) |
|
|
|
|
|
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: res.return_msg, |
|
|
|
|
icon: 'none', |
|
|
|
@ -178,24 +207,86 @@ |
|
|
|
|
|
|
|
|
|
// 获取选择的地区 |
|
|
|
|
handleGetRegion(region) { |
|
|
|
|
|
|
|
|
|
// let region = JSON.parse(JSON.stringify(reg)) |
|
|
|
|
this.region = region; |
|
|
|
|
this.regionId = this.region[2].code; |
|
|
|
|
if(region[0].code == region[1].code&®ion[0].code == region[2].code){ |
|
|
|
|
if (region[0].code == region[1].code && region[0].code == region[2].code) { |
|
|
|
|
this.userAddress.region = this.region[0].name |
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
this.userAddress.region = this.region.map(item => item.name).join(','); |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
console.log(this.userAddress.region,"获取选择的地区",this.regionId,this.region) |
|
|
|
|
console.log(this.userAddress.region, "获取选择的地区", this.regionId, this.region) |
|
|
|
|
}, |
|
|
|
|
// 获取数据 |
|
|
|
|
init() { |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
//点击了定位图标 |
|
|
|
|
location(){ |
|
|
|
|
this.userAddress.address = this.userAddress.address.replace(/\s+/g, "") |
|
|
|
|
|
|
|
|
|
if(app.globalData.latitude&&app.globalData.longitude){ |
|
|
|
|
this.baiduApiMap(app.globalData.longitude,app.globalData.latitude,this.userAddress.address) |
|
|
|
|
}else{ |
|
|
|
|
uni.getLocation({ |
|
|
|
|
type: 'wgs84', |
|
|
|
|
success: function(res) { |
|
|
|
|
app.globalData.latitude = res.latitude; |
|
|
|
|
app.globalData.longitude = res.longitude; |
|
|
|
|
this.baiduApiMap(app.globalData.longitude,app.globalData.latitude,this.userAddress.address) |
|
|
|
|
} |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
baiduApiMap(lng,lat,query){ |
|
|
|
|
let params; |
|
|
|
|
if(query==""){ |
|
|
|
|
params={ |
|
|
|
|
lng,lat |
|
|
|
|
} |
|
|
|
|
}else{ |
|
|
|
|
params={ |
|
|
|
|
lng,lat,query |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
baiduApiMapSearch(params).then(res=>{ |
|
|
|
|
|
|
|
|
|
console.log(res) |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
|
|
|
|
|
if(res.return_data&&res.return_data.length>0){ |
|
|
|
|
this.candidates = res.return_data; |
|
|
|
|
|
|
|
|
|
}else{ |
|
|
|
|
this.candidates=[] |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}else{ |
|
|
|
|
this.candidates=[] |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: res.return_msg, |
|
|
|
|
icon: 'none', |
|
|
|
|
duration: 2000 |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
getSelect(desc){ |
|
|
|
|
|
|
|
|
|
console.log(desc) |
|
|
|
|
this.defaultRegionCode = desc.adcode ; |
|
|
|
|
this.userAddress.address = desc.address; |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 默认地址设置改变 |
|
|
|
|
defaultChange(e) { |
|
|
|
@ -206,6 +297,10 @@ |
|
|
|
|
|
|
|
|
|
// 数据提交 |
|
|
|
|
form_submit() { |
|
|
|
|
|
|
|
|
|
this.userAddress.name = this.userAddress.name.replace(/\s+/g, "") |
|
|
|
|
this.userAddress.tel = this.userAddress.tel.replace(/\s+/g, "") |
|
|
|
|
this.userAddress.address = this.userAddress.address.replace(/\s+/g, "") |
|
|
|
|
// 数据校验 |
|
|
|
|
var validation = [{ |
|
|
|
|
fields: "name", |
|
|
|
@ -214,7 +309,7 @@ |
|
|
|
|
{ |
|
|
|
|
fields: "tel", |
|
|
|
|
msg: "请填写联系电话", |
|
|
|
|
vali:/^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/ |
|
|
|
|
vali: /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/ |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
fields: "region", |
|
|
|
@ -229,10 +324,10 @@ |
|
|
|
|
this.fields_check(this.userAddress, validation) |
|
|
|
|
|
|
|
|
|
let isVali = this.fields_check(this.userAddress, validation); |
|
|
|
|
if(isVali){ |
|
|
|
|
if(this.dataParams.id){ |
|
|
|
|
if (isVali) { |
|
|
|
|
if (this.dataParams.id) { |
|
|
|
|
this.updateAddress(this.dataParams.id) |
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
this.addAddress() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -240,22 +335,22 @@ |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
updateAddress(id){ |
|
|
|
|
updateAddress(id) { |
|
|
|
|
let _this = this; |
|
|
|
|
let params ={ |
|
|
|
|
let params = { |
|
|
|
|
"id": id, |
|
|
|
|
"address": _this.userAddress.address, |
|
|
|
|
"consignee": _this.userAddress.name, |
|
|
|
|
"phone": _this.userAddress.tel, |
|
|
|
|
"regionId": _this.regionId, |
|
|
|
|
"regionName":_this.userAddress.region, |
|
|
|
|
"regionName": _this.userAddress.region, |
|
|
|
|
"whetherDefault": _this.userAddress.is_default |
|
|
|
|
} |
|
|
|
|
updateDeliveryAddress(params).then(res=>{ |
|
|
|
|
let title ; |
|
|
|
|
updateDeliveryAddress(params).then(res => { |
|
|
|
|
let title; |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
title = res.return_data; |
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
title = res.return_msg; |
|
|
|
|
} |
|
|
|
|
uni.showToast({ |
|
|
|
@ -270,22 +365,22 @@ |
|
|
|
|
backPageRefresh() { |
|
|
|
|
uni.navigateBack({}) |
|
|
|
|
}, |
|
|
|
|
addAddress(){ |
|
|
|
|
addAddress() { |
|
|
|
|
let _this = this; |
|
|
|
|
let params={ |
|
|
|
|
let params = { |
|
|
|
|
"address": _this.userAddress.address, |
|
|
|
|
"consignee": _this.userAddress.name, |
|
|
|
|
"phone": _this.userAddress.tel, |
|
|
|
|
"regionId": _this.regionId, |
|
|
|
|
"regionName":_this.userAddress.region, |
|
|
|
|
"regionName": _this.userAddress.region, |
|
|
|
|
"whetherDefault": _this.userAddress.is_default |
|
|
|
|
} |
|
|
|
|
// console.log(params,this.userAddress) |
|
|
|
|
insertDeliveryAddress(params).then(res=>{ |
|
|
|
|
let title ; |
|
|
|
|
insertDeliveryAddress(params).then(res => { |
|
|
|
|
let title; |
|
|
|
|
if (res.return_code == '000000') { |
|
|
|
|
title = res.return_data; |
|
|
|
|
}else{ |
|
|
|
|
} else { |
|
|
|
|
title = res.return_msg; |
|
|
|
|
} |
|
|
|
|
uni.showToast({ |
|
|
|
@ -319,9 +414,9 @@ |
|
|
|
|
return false; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
if(validation[i]["vali"]){ |
|
|
|
|
if (validation[i]["vali"]) { |
|
|
|
|
// console.log(validation[i]["vali"].test(this.userAddress.tel),this.userAddress.tel) |
|
|
|
|
if(!(validation[i]["vali"].test(this.userAddress.tel))){ |
|
|
|
|
if (!(validation[i]["vali"].test(this.userAddress.tel))) { |
|
|
|
|
uni.showToast({ |
|
|
|
|
title: "请输入正确格式的手机号码", |
|
|
|
|
duration: 1000, |
|
|
|
@ -345,12 +440,13 @@ |
|
|
|
|
.bottom-fixed { |
|
|
|
|
position: fixed; |
|
|
|
|
left: 10%; |
|
|
|
|
bottom:var(--window-bottom); |
|
|
|
|
bottom: var(--window-bottom); |
|
|
|
|
border: none; |
|
|
|
|
width: 80%; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
z-index: 2; |
|
|
|
|
.btn{ |
|
|
|
|
|
|
|
|
|
.btn { |
|
|
|
|
height: 60px; |
|
|
|
|
border-radius: 30px; |
|
|
|
|
background-color: #3da7e7; |
|
|
|
@ -364,8 +460,9 @@ |
|
|
|
|
|
|
|
|
|
.page-bottom-fixed { |
|
|
|
|
height: calc(100vh - var(--window-top)); |
|
|
|
|
padding-bottom: 100px; |
|
|
|
|
padding-bottom: 75px; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
overflow-y: auto; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/*表单*/ |
|
|
|
@ -376,9 +473,10 @@ |
|
|
|
|
padding: 20rpx; |
|
|
|
|
margin-bottom: 20rpx; |
|
|
|
|
border-radius: 20rpx; |
|
|
|
|
overflow: auto; |
|
|
|
|
// overflow: auto; |
|
|
|
|
|
|
|
|
|
.pickRes , input { |
|
|
|
|
.pickRes, |
|
|
|
|
input { |
|
|
|
|
border-radius: 0; |
|
|
|
|
box-sizing: border-box; |
|
|
|
|
font-size: 18px; |
|
|
|
@ -395,6 +493,9 @@ |
|
|
|
|
margin-bottom: 5rpx; |
|
|
|
|
font-weight: 500; |
|
|
|
|
font-size: 18px; |
|
|
|
|
width: 74px; |
|
|
|
|
white-space: nowrap; |
|
|
|
|
text-align: right; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
@ -409,4 +510,30 @@ |
|
|
|
|
color: #f00; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.selector-item { |
|
|
|
|
|
|
|
|
|
font-size: 16px; |
|
|
|
|
text-align: center; |
|
|
|
|
border-bottom: solid 1px #DDDDDD; |
|
|
|
|
padding: 10px; |
|
|
|
|
cursor: pointer; |
|
|
|
|
text-align: left; |
|
|
|
|
.name{ |
|
|
|
|
height: 18px; |
|
|
|
|
line-height: 18px; |
|
|
|
|
color: #3da7e7; |
|
|
|
|
font-size: 16px; |
|
|
|
|
font-weight: bold; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
.address{ |
|
|
|
|
font-size: 14px; |
|
|
|
|
height: 16px; |
|
|
|
|
line-height: 16px; |
|
|
|
|
color: #666666; |
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
</style> |
|
|
|
|