You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
129 lines
3.1 KiB
129 lines
3.1 KiB
<!--
|
|
* @Author: ch
|
|
* @Date: 2022-03-22 14:12:18
|
|
* @LastEditors: ch
|
|
* @LastEditTime: 2022-04-09 15:03:36
|
|
* @Description: file content
|
|
-->
|
|
<template>
|
|
<view class="container">
|
|
<view class="form">
|
|
<UiCell class="form--item" title="收货人" :rightIcon="false">
|
|
<template slot="value">
|
|
<input class="form--itemInput" v-model="address.name" placeholder="请输入收货人姓名"/>
|
|
</template>
|
|
</UiCell>
|
|
<UiCell class="form--item" title="手机号码" :rightIcon="false">
|
|
<template slot="value">
|
|
<input class="form--itemInput" v-model="address.phone" placeholder="请输入收货手机号码"/>
|
|
</template>
|
|
</UiCell>
|
|
<BsSelectCity class="form--item form--city" v-model="city"></BsSelectCity>
|
|
<UiCell class="form--item form--item__last" title="详细地址" :rightIcon="false">
|
|
<template slot="value">
|
|
<input class="form--itemInput" v-model="address.detailAddress" placeholder="请输入详细地址"/>
|
|
</template>
|
|
</UiCell>
|
|
</view>
|
|
<UiCell class="form--item form--item__last" title="设为默认地址" >
|
|
<template slot="right-icon">
|
|
<u-switch space="2" v-model="address.isDefault" activeColor="$color-yellow3" inactiveColor="#F3F3F3" />
|
|
</template>
|
|
</UiCell>
|
|
<UiButton class="saveBtn" type="solid" size="max" @click="save">保存</UiButton>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import BsSelectCity from '../../../components/BsSelectCity.vue';
|
|
import UiButton from '../../../components/UiButton.vue';
|
|
import UiCell from '../../../components/UiCell.vue';
|
|
import {IsPhone} from '@/common/utils';
|
|
import {ApiPostAddress} from '@/common/api/base';
|
|
|
|
export default {
|
|
components: { UiCell, UiButton, BsSelectCity },
|
|
data (){
|
|
return {
|
|
address : {},
|
|
city : []
|
|
}
|
|
},
|
|
onShow(){
|
|
this.address.isDefault = this.$Route.query.first === 'true' ? true : false
|
|
},
|
|
methods: {
|
|
async save(){
|
|
const $toast = uni.$u.toast;
|
|
if(!this.address.name){
|
|
$toast('请填写收货人姓名');
|
|
return false;
|
|
}
|
|
if(!this.address.phone || !IsPhone(this.address.phone)){
|
|
$toast('请填写正确的手机号');
|
|
return false;
|
|
}
|
|
if(!this.city.length){
|
|
$toast('请选择地区');
|
|
return false;
|
|
}
|
|
if(!this.address.detailAddress){
|
|
$toast('请填写详细地址');
|
|
return false;
|
|
}
|
|
const areaCode = this.city[2].code;
|
|
const area = this.city[2].name;
|
|
const city = this.city[1].name;
|
|
const cityCode = this.city[1].code;
|
|
const provinceCode = this.city[0].code;
|
|
const province = this.city[0].name;
|
|
const {error} = await ApiPostAddress({
|
|
...this.address,
|
|
province,provinceCode,areaCode,area,city,cityCode
|
|
});
|
|
if(error){
|
|
$toast(error.message);
|
|
return false;
|
|
}
|
|
$toast('保存成功');
|
|
this.$Router.back();
|
|
}
|
|
}
|
|
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
page {
|
|
background: $color-grey1;
|
|
}
|
|
.form{
|
|
background: $color-grey0;
|
|
margin-bottom: 20rpx;
|
|
&--item{
|
|
padding: 0 40rpx;
|
|
&__last{
|
|
border: 0;
|
|
}
|
|
}
|
|
&--city{
|
|
padding:0 ;
|
|
}
|
|
&--itemInput{
|
|
flex: 1;
|
|
font-size: $font-size-base;
|
|
padding-left: 40rpx;
|
|
}
|
|
}
|
|
.saveBtn{
|
|
position: fixed;
|
|
bottom: 89rpx;
|
|
left: 30rpx;
|
|
}
|
|
/deep/ {
|
|
.form--city .uiCell{
|
|
padding: 0 40rpx;
|
|
}
|
|
}
|
|
</style>
|