- 调通 用户商品地址

mobile-web/src/page/user/address/edit.vue

@@ -1,64 +1,93 @@
 <template>
-    <div>
-     <headerNav title="修改地址"/>
-      <van-address-edit
+  <div>
+    <headerNav title="修改地址"/>
+    <van-address-edit
       :area-list="areaList"
       :showDelete="showDelete"
       show-set-default
       @save="onSave"
       @delete="onDelete"
       :addressInfo="info"
-      />
-    </div>
+    />
+  </div>
 </template>
 
 <script>
-import areaList from '../../../data/area';
-import { GetAddressById,SaveAddress,DelAddress } from "../../../api/user.js";
+  import areaList from '../../../data/area';
+  import {GetAddressById, SaveAddress, UpdateAddress, DelAddress} from "../../../api/user.js";
 
-import { AddressEdit } from 'vant';
-export default {
-    components:{
-        [AddressEdit.name]:AddressEdit,
+  import {AddressEdit} from 'vant';
+
+  export default {
+    components: {
+      [AddressEdit.name]: AddressEdit,
     },
     data() {
-    return {
-      areaList,
-      showDelete:false,
-      info:{},
-    }
-  },
+      return {
+        areaList,
+        showDelete: false,
+        info: {
+        },
+      }
+    },
 
-  methods: {
-    onSave(data) {
-      SaveAddress(data).then(response=>{
-        this.$toast('保存成功');
-        this.$router.go(-1);
-      })
+    methods: {
+      onSave(data) {
+        const params = {
+          ...data,
+          address: data.addressDetail,
+          areaNo: data.areaCode,
+          city: data.city,
+          county: data.county,
+          country: data.country,
+          mobile: data.tel,
+          name: data.name,
+          hasDefault: data.isDefault,
+        };
+
+        if (data.id !== 0) {
+          UpdateAddress(params).then(response => {
+            this.$toast('更新成功');
+            this.$router.go(-1);
+          })
+        } else {
+          SaveAddress(params).then(response => {
+            this.$toast('保存成功');
+            this.$router.go(-1);
+          })
+        }
+      },
+      onDelete(data) {
+        const params = {
+          id: data.id,
+        };
+        DelAddress(params).then(response => {
+          this.$toast('删除成功');
+          this.$router.go(-1);
+        })
+      },
     },
-    onDelete(data) {
-      DelAddress(data).then(response=>{
-        this.$toast('删除成功');
-        this.$router.go(-1);
-      })
-    },
-  },
-  created:function(){
-    var id=this.$route.query.id;
-    if(id>0){
-      this.showDelete=true;
-      GetAddressById(id).then(response=>{
-        console.log(response);
-        this.info=response;
-      })
+    created: function () {
+      const id = this.$route.query.id;
+      if (id > 0) {
+        this.showDelete = true;
+        GetAddressById(id).then(response => {
+          this.info = {
+            ...response,
+            addressDetail: response.address,
+            tel: response.mobile,
+            areaCode: response.areaNo,
+            isDefault: 0,
+          };
+        })
+      }
     }
+
   }
-
-}
 </script>
 
 <style>
-.van-picker__toolbar{
-  font-size: 16px;
-}
+  .van-picker__toolbar {
+    font-size: 16px;
+  }
 </style>

mobile-web/src/page/user/address/list.vue

@@ -1,65 +1,73 @@
 <template>
-<div>
+  <div>
 
     <headerNav title="我的地址"/>
     <van-address-list
-  v-model="chosenAddressId"
-  :class="isSelect?'':'hideselect'"
-  :list="list"
-  @add="onAdd"
-  @edit="onEdit"
-  @select="onSelect"
-/>
-</div>
+      v-model="chosenAddressId"
+      :class="isSelect?'':'hideselect'"
+      :list="list"
+      @add="onAdd"
+      @edit="onEdit"
+      @select="onSelect"
+    />
+  </div>
 </template>
 
 <script>
 
-import { GetAddressList } from "../../../api/user.js";
-import { AddressList } from 'vant';
-export default {
-    components:{
-        [AddressList.name]:AddressList,
+  import {GetAddressList} from "../../../api/user.js";
+  import {AddressList} from 'vant';
+
+  export default {
+    components: {
+      [AddressList.name]: AddressList,
     },
     data() {
-        return {
+      return {
         chosenAddressId: '1',
-        isSelect:false,
+        isSelect: false,
         list: [],
-        }
+      }
     },
 
     methods: {
-        onAdd() {
-            this.$router.push('/user/address/edit')
-        },
+      onAdd() {
+        this.$router.push('/user/address/edit')
+      },
 
-        onEdit(item, index) {
-            this.$router.push('/user/address/edit?id='+item.id);
-        },
-        onSelect(item,index){
-            if(!this.isSelect){
-                return;
-            }
-            this.$emit('selectAddress',item);
-            this.$router.go(-1);
+      onEdit(item, index) {
+        this.$router.push('/user/address/edit?id=' + item.id);
+      },
+      onSelect(item, index) {
+        if (!this.isSelect) {
+          return;
         }
+        this.$emit('selectAddress', item);
+        this.$router.go(-1);
+      }
     },
-    created:function(){
-        this.chosenAddressId=this.$route.query.id;
-        this.isSelect=this.$route.query.id>0;
-        GetAddressList().then(response=>{
-            this.list=response;
-        })
+    created: function () {
+      this.chosenAddressId = this.$route.query.id;
+      this.isSelect = this.$route.query.id > 0;
+      GetAddressList().then(response => {
+        this.list = response.map(item => {
+
+          // convert data
+          return {
+            ...item,
+            tel: item.mobile,
+          }
+        });
+      })
     }
 
-}
+  }
 </script>
 
 <style lang="less">
-.hideselect{
-    .van-radio__input{
-        display: none;
+  .hideselect {
+    .van-radio__input {
+      display: none;
     }
-}
+  }
 </style>