address api

This commit is contained in:
2020-06-23 17:21:01 +08:00
parent fe995ced2d
commit 8c993da2cd
12 changed files with 390 additions and 55 deletions

View File

@@ -2,16 +2,20 @@
<view class="address-active">
<view class="user-info">
<view>
<input type="text" placeholder="收货人" />
<input type="text" placeholder="收货人" v-model="name" />
</view>
<view>
<input type="text" placeholder="手机号" />
<input type="text" placeholder="手机号" maxlength="11" v-model="phone" />
</view>
<view class="area" @click="show=true">
<input type="text" placeholder="省市区" disabled />
<input type="text" placeholder="省市区" v-model="address" disabled />
<view>
<image src="/static/image/mine/24.png"></image>
<text>定位</text>
</view>
</view>
<view>
<input type="text" placeholder="详细地址" />
<input type="text" placeholder="详细地址" v-model="area" />
</view>
<view class="set-default">
<view>设为默认地址</view>
@@ -20,34 +24,158 @@
</view>
</view>
</view>
<view class="edit-btn">保存地址</view>
<!-- <u-picker mode="region" v-model="show" @confirm="setArea"></u-picker> -->
<u-select v-model="show" mode="mutil-column-auto" :list="areaList" @confirm="setArea"></u-select>
<view class="edit-btn" @click="confirmBtn">保存地址</view>
<u-select v-model="show"
mode="mutil-column-auto"
:list="areaList"
value-name="area_id"
label-name="area_name"
child-name="_child"
@confirm="setArea">
</u-select>
<u-toast ref="uToast" />
</view>
</template>
<script>
export default {
data() {
return {
checked: false,
show: false,
areaList: []
areaList: [],
checked: false, // 是否设为默认地址
name: '',
phone: '',
address: '', // 选择地址
area: '', // 详细地址
area_id: '', // 地区id 省
city_id: '', // 城市id
}
},
props: {
info: Object
},
mounted() {
this.getAreaList(0);
this.getAreaData();
},
created() {
// console.log(this.info);
this.initAddressInfo();
},
methods: {
setArea(e) {
console.log(e);
// 判断是不是编辑页面 数据初始化
initAddressInfo() {
if(JSON.stringify(this.info) != '{}') {
[this.name, this.phone, this.address, this.area, this.area_id, this.city_id] = [
this.info.address_realname,
this.info.address_mob_phone,
this.info.area_info,
this.info.address_detail,
this.info.area_id,
this.info.city_id
]
this.checked = this.info.address_is_default == '0' ? false : true;
}
},
getAreaList(pid) {
this.$u.api.getAreaList({
pid: pid
// 判断是不是编辑页面 调用接口
confirmBtn() {
JSON.stringify(this.info) != '{}' ? this.editAddress() : this.addAddress();
},
// 验证
validateValue() {
if(this.$u.test.isEmpty(this.name)) {
this.showToast('姓名不能为空', 'warning');
return false;
}
if(this.$u.test.isEmpty(this.phone)) {
this.showToast('手机号不能为空', 'warning');
return false;
}
if(!this.$u.test.mobile(this.phone)) {
this.showToast('手机号错误', 'warning');
return false;
}
if(this.$u.test.isEmpty(this.address)) {
this.showToast('地址不能为空', 'warning');
return false;
}
if(this.$u.test.isEmpty(this.area)) {
this.showToast('详细地址不能为空', 'warning');
return false;
}
return true;
},
addAddress() {
if(!this.validateValue()) return false;
this.$u.api.addressAdd({
area_id: this.area_id,
city_id: this.city_id,
is_default: this.checked ? 1 : 0,
area_info: this.address,
address: this.area,
true_name: this.name,
mobile_phone: this.phone,
// longitude,
// latitude,
}).then((res)=>{
if (res.errCode == 0) {}
if (res.errCode == 0) {
this.$refs.uToast.show({
title: res.message,
type: 'success',
url: '/pageE/more/Address'
})
} else {
this.showToast(res.message, 'warning');
}
})
}
},
editAddress() {
if(!this.validateValue()) return false;
this.$u.api.addressEdit({
address_id: this.info.address_id,
area_id: this.area_id,
city_id: this.city_id,
is_default: this.checked ? 1 : 0,
area_info: this.address,
address: this.area,
true_name: this.name,
mobile_phone: this.phone,
// longitude,
// latitude,
}).then((res)=>{
if (res.errCode == 0) {
this.$refs.uToast.show({
title: res.message,
type: 'success',
url: '/pageE/more/Address'
})
} else {
this.showToast(res.message, 'warning');
}
})
},
getAreaData() {
this.$u.api.getArea().then((res)=>{
if (res.errCode == 0) {
this.areaList = res.data;
}
})
},
setArea(area) {
// console.log(area);
this.area_id = area[0].value;
this.city_id = area[1].value;
let temp = '';
area.forEach(e => {
temp += e.label;
});
this.address = temp;
},
showToast(message, type) {
this.$refs.uToast.show({
title: message,
type: type,
})
},
},
}
</script>
@@ -71,6 +199,29 @@ export default {
font-size: 30rpx;
color: rgba(51,51,51,1);
}
.area {
padding: 0 30rpx;
display: flex;
> input {
padding: 30rpx 0;
flex: 1;
}
> view {
margin-left: 30rpx;
width: 50rpx;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: 22rpx;
color: rgba(255,120,15,1);
> image {
width: 26rpx;
height: 32rpx;
margin-bottom: 10rpx;
}
}
}
}
.edit-btn {
margin: 122rpx auto 0;