|
@@ -6,13 +6,17 @@
|
|
|
clearable
|
|
|
label="收货人"
|
|
|
placeholder="收货人姓名"
|
|
|
+ @change="changeName"
|
|
|
/>
|
|
|
<van-field
|
|
|
:value="address_info.phone"
|
|
|
- required
|
|
|
+ maxlength="11"
|
|
|
+ type="number"
|
|
|
clearable
|
|
|
label="手机号"
|
|
|
placeholder="收货人手机号"
|
|
|
+ @change="changePhone"
|
|
|
+ required
|
|
|
/>
|
|
|
<van-field
|
|
|
:value="address_info.city"
|
|
@@ -21,6 +25,7 @@
|
|
|
label="所在地区"
|
|
|
placeholder="选择省/市/区"
|
|
|
is-link
|
|
|
+ @click="address_show = true"
|
|
|
/>
|
|
|
<van-field
|
|
|
:value="address_info.detail"
|
|
@@ -28,14 +33,27 @@
|
|
|
clearable
|
|
|
label="详细地址"
|
|
|
placeholder="请填写详细地址"
|
|
|
+ @change="changeDetail"
|
|
|
/>
|
|
|
<div class="button_container">
|
|
|
<button class="cu-btn lg cu-btn-primary text-white text-center padding" @click="choose_ok">保存并使用</button>
|
|
|
</div>
|
|
|
+
|
|
|
+
|
|
|
+ <!-- 三级联动地址-->
|
|
|
+
|
|
|
+ <van-popup :show="address_show" @close="onClose" position="bottom">
|
|
|
+ <van-area :area-list="area_list" @confirm="confirm_address" @cancel="onClose"/>
|
|
|
+ </van-popup>
|
|
|
+ <van-notify id="van-notify"/>
|
|
|
+
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import area from "./area";
|
|
|
+import {userAddAddress, userAddressList, userUpdateAddress} from "../../../../requests/user";
|
|
|
+import Notify from '../../../../../static/vant/notify/notify';
|
|
|
|
|
|
var $this
|
|
|
export default {
|
|
@@ -48,13 +66,43 @@ export default {
|
|
|
phone: "",
|
|
|
city: "",
|
|
|
detail: ""
|
|
|
+ },
|
|
|
+ address_show: false,
|
|
|
+ area_list: [],
|
|
|
+ post_info: {
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ province: "",
|
|
|
+ city: "",
|
|
|
+ area: "",
|
|
|
+ detail: ""
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
//保存并使用
|
|
|
choose_ok() {
|
|
|
- $this.to_address_list()
|
|
|
+ console.log($this.post_info)
|
|
|
+ if ($this.post_info.address_id) {
|
|
|
+ userUpdateAddress($this.post_info).then((res) => {
|
|
|
+ let $res = res.data;
|
|
|
+ if ($res.code == 0) {
|
|
|
+ Notify({type: 'success', message: $res.errmsg});
|
|
|
+ } else {
|
|
|
+ Notify({type: 'fail', message: $res.errmsg});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+
|
|
|
+ userAddAddress($this.post_info).then((res) => {
|
|
|
+ let $res = res.data;
|
|
|
+ if ($res.code == 0) {
|
|
|
+ Notify({type: 'success', message: $res.errmsg});
|
|
|
+ } else {
|
|
|
+ Notify({type: 'fail', message: $res.errmsg});
|
|
|
+ }
|
|
|
+ })
|
|
|
+ }
|
|
|
},
|
|
|
// 跳转到地址列表
|
|
|
to_address_list() {
|
|
@@ -62,12 +110,51 @@ export default {
|
|
|
// url: "/pages/user_center/address/list/main"
|
|
|
// })
|
|
|
mpvue.navigateBack({
|
|
|
- delta:1
|
|
|
+ delta: 1
|
|
|
})
|
|
|
+ },
|
|
|
+ onClose() {
|
|
|
+ $this.address_show = false
|
|
|
+ },
|
|
|
+ //确认地址
|
|
|
+ confirm_address($val) {
|
|
|
+ let $obj = $val.mp.detail.values
|
|
|
+ console.log($obj)
|
|
|
+ $this.post_info.province = $obj[0]['name']
|
|
|
+ $this.post_info.city = $obj[1]['name']
|
|
|
+ $this.post_info.area = $obj[2]['name']
|
|
|
+ let $city_name = $obj[0]['name'] + $obj[1]['name'] + $obj[2]['name']
|
|
|
+ if ($obj[0]['name'] == $obj[1]['name']) {
|
|
|
+ $city_name = $obj[1]['name'] + $obj[2]['name']
|
|
|
+ }
|
|
|
+ $this.address_info.city = $city_name
|
|
|
+ $this.address_show = false
|
|
|
+ },
|
|
|
+ changeName($e) {
|
|
|
+ $this.address_info.username = $this.post_info.name = $e.mp.detail
|
|
|
+ },
|
|
|
+ changePhone($e) {
|
|
|
+ $this.address_info.phone = $this.post_info.phone = $e.mp.detail
|
|
|
+ },
|
|
|
+ changeDetail($e) {
|
|
|
+ $this.address_info.detail = $this.post_info.detail = $e.mp.detail
|
|
|
}
|
|
|
}
|
|
|
,
|
|
|
mounted() {
|
|
|
+ $this.area_list = area
|
|
|
+ userAddressList().then((res) => {
|
|
|
+ let $res = res.data;
|
|
|
+ if ($res.data.length > 0) {
|
|
|
+ $this.post_info = $res.data[0]
|
|
|
+ $this.address_info = {
|
|
|
+ username: $this.post_info.name,
|
|
|
+ phone: $this.post_info.phone,
|
|
|
+ city: $this.post_info.province + $this.post_info.city + $this.post_info.area,
|
|
|
+ detail: $this.post_info.detail
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
created() {
|
|
|
$this = this;
|
|
@@ -78,7 +165,7 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style scoped>
|
|
|
-.button_container{
|
|
|
+.button_container {
|
|
|
padding: 10px;
|
|
|
position: absolute;
|
|
|
bottom: 50px;
|