smart-admin/rc-busness/pages/useraddress/openaddress.vue

<template>
<div>
<Myheader></Myheader>
   <div class="rc-top"></div>
   <div class="online bold"></div>
    <div class="usercontshow rc-max-width--xl">
 <div class="usercontend" v-for="(item, index) in list" :key="index">
  <div class="usercontshow usermain" >
    <div class="rc-cat" >
        <div class="rc-center">
      <div class=" rc-title">
        <em>
          {{ item.recipient }}
        </em>
        <span>
          {{ item.recipientPhone }}
        </span>
      </div>
      <div class="rc-address">
        <span>
        {{item.provinceName}}{{ item.districtName }}{{item.detailAddress}}
        </span>
      </div>
      <div class="rc-footer">
        <div class="rc-foot">
          <img :src="item.isDefault?require('../../assets/image/userred.png'):require('../../assets/image/userselect.png')" @click="changeadddress(item,index)"/>
          <span>设置为默认收货地址</span>

        </div>
        <div class="rc-right">
          <span @click="onEdit(item, index)">编辑</span>
          <span @click="userdelete(item, index)">删除</span>
        </div>
      </div>
    </div>
      
 
    </div>
      
  </div>
   <div class="online bold rc-md-down"></div>
  <!-- <div class="usercontend useradd">
      <img src="../../assets/image/userselect.png" alt="">
      <span>添加收货地址</span>
  </div> -->
  
 </div>
 
    <div class="usercontshow useredit">
      <div class="usercontshow alledit"  @click="onAdd()">
      <img src="../../static/images/adddress.png" alt="">
      <span>添加收货地址</span>
    </div>
    </div>
     <div class="rc-button">
      <div class="rc-footbutton" @click="onAdd()">
        <span>新增收货地址</span>
      </div>
    </div>

  </div>
    <MyFooter></MyFooter>
</div>
</template>

<script>
import Myheader from '~/components/header.vue' 
import MyFooter from '~/components/rc-footer.vue'
  import { selectaddress,editupdate,editdelete} from "../../ajax/getData";
export default {
  data() {
    return {
      chosenAddressId: "1",
      checked: true,
      userid: null,
      usermessage:null,
      list: [
        {
          id: 1,
          name: "张三",
          tel: "13000000000",
          address: "浙江省杭州市西湖区文三路 138 号",
          isDefault: true,
        },
        {
          id: 2,
          name: "李四",
          tel: "1310000000",
          address: "浙江省杭州市拱墅区莫干山路 50 号",
        },
           {
          id: 3,
          name: "李四",
          tel: "1310000000",
          address: "浙江省杭州市拱墅区莫干山路 50 号",
        },
      ],
    };
  },
  methods: { 
    changeadddress(item,index){
       console.log(item,index);
        console.log(item.isDefault)
       if(item.isDefault==false){
         item.isDefault=true
       }else{
         item.isDefault=false;
       }
       this.editupdate(this.userid,item.id,item.isDefault)
       this.editaddress();

    },
    onEdit(item, index) {
      // let userid = item.id;
      console.log(item);
      // debugger

      this.$router.push({
        path: "/useraddress/editaddress",
        query: {
          recipient: item.recipient,
          recipientPhone:item.recipientPhone,
          detailAddress:item.detailAddress,
          id:item.id
        },
      });
    },
       onAdd(item, index) {
      // let userid = item.id;
      // console.log(item);
      this.$router.push({
        path: "/useraddress/addaddress",
        // query: {
        //   id: userid,
        // },
      });
    },

    //更改地址
    async editupdate(userid,addressid,isDefault) {
          let useradd={
         memberId:userid,
        id:addressid,
        isDefault:isDefault,
      }
    
      let data = await editupdate(useradd);
    //   if(data){
    //  this.editaddress();
    //   }
    
    },

    //删除地址
    async userdelete(item) {
      console.log(item.memberId);
      let data = await editdelete(this.userid, item.id);
     this.editaddress();
      console.log(data);
    },
    //查询人的所有地址
    async editaddress(user) {
    //  user.data.id=844350;
        let data = await selectaddress(this.userid);
        console.log(data);
        // this.list=data;
        // console.log(this.list);
      console.log(data);
    },
  },
  components: {
   Myheader,
   MyFooter
  },

  mounted() {
    //地址的查询
    this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
       this.userid = this.usermessage.data.id;
       console.log(this.userid);
       this.editaddress(this.userid);

  },
};
</script>

<style lang="less" scoped >
@import url("../../assets/css/global.less");
@import url("../../assets/css/openaddress.less");
</style>