321 lines
7.7 KiB
Vue
321 lines
7.7 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="content_box">
|
|
<view class="content_box_item flex-start">
|
|
<view class="content_box_item_one">
|
|
联系人
|
|
</view>
|
|
<view class="content_box_item_tow">
|
|
<input type="text" v-model="form.name" placeholder="请填写收货人姓名" />
|
|
</view>
|
|
</view>
|
|
<view class="content_box_item flex-start">
|
|
<view class="content_box_item_one">
|
|
联系电话
|
|
</view>
|
|
<view class="content_box_item_tow">
|
|
<input type="number" v-model="form.mobile" maxlength="11"
|
|
placeholder="请填写收货人手机号码" />
|
|
</view>
|
|
</view>
|
|
<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion">
|
|
<view class="content_box_item flex-start">
|
|
<view class="content_box_item_one">
|
|
所在地区
|
|
</view>
|
|
<view class="content_box_item_tow flex-start">
|
|
<input type="text" v-model="regionName" disabled="disabled" placeholder="省市区、乡镇等" />
|
|
<!-- <image class="content_box_itemimage" @click="chooseLocation" src="@/static/address.png" mode="aspectFill">
|
|
</image> -->
|
|
</view>
|
|
</view>
|
|
</pick-regions>
|
|
<!-- <view class="content_box_item flex-start">
|
|
<view class="content_box_item_one">
|
|
所在街道
|
|
</view>
|
|
<view class="content_box_item_tow">
|
|
<input type="text" v-model="form.name" placeholder="填写街道" />
|
|
</view>
|
|
</view> -->
|
|
<view class="content_box_item flex-start">
|
|
<view class="content_box_item_one">
|
|
详细地址
|
|
</view>
|
|
<view class="content_box_item_tow">
|
|
<input type="text" v-model="form.address" placeholder="请填写详细地址" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="content_box_tow flex-between">
|
|
<view class="content_box_tow_one">
|
|
设为默认地址
|
|
</view>
|
|
<u-switch v-model="showis_default" size="20" @change="change"></u-switch>
|
|
</view>
|
|
<view class="positionfixed flex-center" @click="usereditaddress">
|
|
保存
|
|
</view>
|
|
</view>
|
|
</template>
|
|
<script>
|
|
import pickRegions from '@/components/pick-regions/pick-regions.vue'
|
|
export default {
|
|
components: {
|
|
pickRegions
|
|
},
|
|
data() {
|
|
return {
|
|
region: [],
|
|
showis_default: true,
|
|
defaultRegionCode: '610112', //默认未央区
|
|
height: '',
|
|
form: {
|
|
regionName: '',
|
|
type: ''
|
|
},
|
|
valueswitch: false
|
|
};
|
|
},
|
|
async onLoad(e) {
|
|
this.form.id = e.id
|
|
if (e.type == 1) {
|
|
uni.setNavigationBarTitle({
|
|
title: '添加地址'
|
|
})
|
|
} else {
|
|
uni.setNavigationBarTitle({
|
|
title: '修改地址'
|
|
})
|
|
let res = await this.api.usereaddressshow({
|
|
id: this.form.id
|
|
})
|
|
console.log(res)
|
|
if (res) {
|
|
this.form = res
|
|
if (res.is_default == 1) {
|
|
this.showis_default = true
|
|
} else {
|
|
this.showis_default = false
|
|
}
|
|
}
|
|
}
|
|
this.form.type = e.type
|
|
},
|
|
onShow() {},
|
|
watch: {},
|
|
computed: {
|
|
regionName() {
|
|
// 转为字符串
|
|
let res = null
|
|
if (this.region.length == 0) {
|
|
res = this.form.province + this.form.city + this.form.area
|
|
} else {
|
|
res = this.region.map(item => item.name).join(' ')
|
|
}
|
|
return res
|
|
}
|
|
},
|
|
methods: {
|
|
change(e) {
|
|
this.showis_default = e
|
|
console.log('change', e);
|
|
},
|
|
async usereditaddress() {
|
|
if (this.form.name == null || this.form.name == '') {
|
|
uni.showToast({
|
|
title: '请输入姓名',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
if (this.form.mobile == null || this.form.mobile == '') {
|
|
uni.showToast({
|
|
title: '请输入电话号码',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
if (this.form.province == null || this.form.province == '') {
|
|
uni.showToast({
|
|
title: '请选择省，市，区',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
if (this.form.address == null || this.form.address == '') {
|
|
uni.showToast({
|
|
title: '请输入详细地址',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
|
|
let res = await this.api.usereditaddress({
|
|
id: this.form.id, //地址ID
|
|
province: this.form.province, //省
|
|
city: this.form.city, //市
|
|
area: this.form.area, //区
|
|
address: this.form.address, //详细地址
|
|
name: this.form.name, //姓名
|
|
mobile: this.form.mobile, //电话
|
|
lng: this.form.lng, //经度
|
|
is_default: this.showis_default == true ? 1 : '', //1 默认
|
|
lat: this.form.lat, //维度
|
|
type: this.form.type //1 添加 2修改
|
|
})
|
|
console.log(res)
|
|
if (res == 1) {
|
|
uni.showToast({
|
|
title: this.form.type == 1 ? '添加成功' : '修改成功',
|
|
icon: 'none'
|
|
});
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
}, 1000);
|
|
}
|
|
},
|
|
handleGetRegion(region) {
|
|
console.log(111, region)
|
|
this.region = region
|
|
this.form.province = region[0].name
|
|
this.form.city = region[1].name
|
|
this.form.area = region[2].name
|
|
|
|
},
|
|
chooseLocation() {
|
|
uni.chooseAddress({
|
|
success: (res) => {
|
|
console.log(res)
|
|
this.form.address = res.address
|
|
this.form.lat = res.latitude
|
|
this.form.lng = res.longitude
|
|
this.lnglat = res.latitude + '-' + res.longitude
|
|
console.log('位置名称：' + res.name);
|
|
console.log('详细地址：' + res.address);
|
|
console.log('纬度：' + res.latitude);
|
|
console.log('经度：' + res.longitude);
|
|
},
|
|
fail: (e) => {
|
|
console.log(e)
|
|
// uni.getSetting({
|
|
// success: function(res) {
|
|
// var statu = res.authSetting;
|
|
// console.log(statu);
|
|
// if (!statu['scope.userLocation']) {
|
|
// console.log(123);
|
|
// uni.showModal({
|
|
// title: '是否授权当前位置',
|
|
// content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
|
|
// success(tip) {
|
|
// if (tip.confirm) {
|
|
// uni.authorize({
|
|
// scope: 'scope.userLocation',
|
|
// success:()=> {
|
|
// this.chooseLocation()
|
|
// }
|
|
// })
|
|
// } else {
|
|
// uni.showToast({
|
|
// title: '授权失败',
|
|
// icon: 'none',
|
|
// duration: 1000
|
|
// })
|
|
// }
|
|
// }
|
|
// })
|
|
|
|
// }
|
|
// }
|
|
// })
|
|
}
|
|
})
|
|
},
|
|
edit(e) {
|
|
uni.pro.navigateTo('my/address/edit', e.id)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
page {
|
|
background: #F9F9F9;
|
|
}
|
|
|
|
.content {
|
|
padding: 0 30rpx;
|
|
|
|
.content_box {
|
|
padding-left: 40rpx;
|
|
background: #FFF;
|
|
|
|
.content_box_item {
|
|
margin-top: 24rpx;
|
|
width: 100%;
|
|
padding: 32rpx;
|
|
border-bottom: 1rpx solid #F6F6F6;
|
|
|
|
.content_box_item_one {
|
|
width: 112rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
|
|
.content_box_item_tow {
|
|
flex: auto;
|
|
padding-left: 80rpx;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #CCCCCC;
|
|
|
|
input {
|
|
flex: auto;
|
|
height: 100%;
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #CCCCCC;
|
|
}
|
|
}
|
|
|
|
.content_box_itemimage {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.content_box_tow {
|
|
margin-top: 24rpx;
|
|
padding: 34rpx 44rpx;
|
|
background: #FFF;
|
|
|
|
.content_box_tow_one {
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #333333;
|
|
}
|
|
}
|
|
|
|
.positionfixed {
|
|
position: fixed;
|
|
background: #f6f6f6;
|
|
width: 90%;
|
|
bottom: 50rpx;
|
|
left: 5%;
|
|
padding: 24rpx 34rpx;
|
|
text-align: center;
|
|
background:#f0cb66;
|
|
border-radius: 46rpx;
|
|
font-size: 30rpx;
|
|
font-family: PingFang SC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #FFFFFF;
|
|
}
|
|
}
|
|
</style> |