smart-admin/rc-busness/pages/myorder/usertion.vue

<template>
  <div>
    <Myheader></Myheader>
      <div class="rc-main"  v-for="(item,index) in goldmedal" :key="item.id" >
        <div class="rc-receiving"  >
          <em>{{item.status=='0'?'待付款':item.status=='1'?'待收货':item.status=='2'?'已完成':item.status=='3'?'已取消':'异常订单'}}</em>
          <span>{{orderstatus}}</span>
        </div>
        <div class="rc-border"></div>
        <div  v-if="isshow">
        <div class="delivery" v-for="(userdata,index) in delivery" :key="index" >
            
          <div class="to-delivery">
            <span>{{ userdata.state }}</span>
            <i>{{ userdata.time }}</i>
          </div>
          <div class="bo-delivery">
            <span>{{ userdata.address }}</span>
          </div>
           <div class="viewdetails">
             <span>查看详情</span>
                <img :src="leftico" alt="" /> 
           </div>
        </div>
</div>
        <div
          class="mypersonal"
          v-for="(datddress, index) in useraddress"
          :key="datddress.id"
        >
          <div class="my-delivery">
            <span>{{ datddress.recipient }}</span>
            <i>{{ datddress.recipientPhone }}</i>
          </div>
          <div class="per-delivery">
            <span>{{ datddress.provinceName }}{{datddress.cityName}}{{datddress.districtName}}{{datddress.detailAddress}}</span>
          </div>
        </div>
        <div >
        <div class="rc-center">
          <div class="rc-usermain" v-for="(userlist,index) in item.orderDetailList" :key="index">
            <div class="rc-image">
             <img :src="item.catimage" alt="" /> 
            </div>
            <div class="rc-right">
              <div class="rc-usercenter">
                <em>{{ userlist.productName }}</em>
                <div class="rc-userright">
                  <span>规格:{{ item.productId }}</span>
                </div>
              </div>
              <div class="rc-userbottom">
                <span>数量:{{ item.pcs }}件</span>
                <i>￥{{ item.ecPrice }}</i>
                 <div class="rc-bottom">
            <span>联系客服申请售后</span>
          </div>
              </div>
                  <div class="rc-bottomm">
            <span>联系客服申请售后</span>
          </div>
              <!-- <div class="rc-userbottomm">
                <i>￥{{ item.userprice }}</i>
                <span>{{ item.orderstype }}</span>
                <i>￥{{ item.userprice }}</i>
              </div> -->
            </div>
          </div>
        </div>
        <div class="rc-merchandise">
          <ul>
            <li>
              <span>商品总价:</span>
              <i>￥{{ item.salesAmount }}</i>
            </li>
            <li>
              <span>配送费用:</span>
              <i>{{ shopprice.distribution }}</i>
            </li>
            <li>
              <span>活动促销:</span>
              <i>{{ shopprice.promotion }}</i>
            </li>
            <li>
              <span>实际付款:</span>
              <i>{{ shopprice.payment }}</i>
            </li>
          </ul>
        </div>

            <div class="rc-payment">
          <ul>
            <li>
              <span>订单编号::</span>
              <i>{{ item.orderNumber }}</i>
            </li>
            <li>
              <span>下单时间::</span>
              <i>{{ item.orderDate }}</i>
            </li>
            <li>
              <span>付款方式::</span>
              <i>{{ information.paymentmethod }}</i>
            </li>
            <li>
              <span>配送方式::</span>
              <i>{{ information.distribution }}</i>
            </li>
            <li>
              <span>快递单号:</span>
              <div class="u-trackingnumber">
              <!-- <i>{{ userlist.logisticsNumber }}
                  </i> -->
                   <!-- <img :src="information.catimage" alt=""> -->
                  </div>
            </li>
            
          </ul>
        </div>

        <div class="rc-foot">
          <div class="rc-foo">
              <div style="padding-top:55px">
              <i>合计金额:</i>
               <em>￥167.00</em>
               </div>
               <div style="padding-bottom:40px">
               <span>再次购买</span>
               </div>
          </div>

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

<script>
import Myheader from "~/components/header.vue";
  import { userin} from "../../ajax/getData";
    import {selectaddress} from "../../ajax/getData";
export default {
  data() {
    return {
      goldmedal:[],
      addressstype: null,
      orderstatus: '',
      userisdelivery:'待收货',
      userdelivery: "派送中",
      isshow:true,
      leftico: require("../../assets/image/rc-left.png"),
      orderNumber:'',
       usermessage:null,
         userid: null,
      useralllist:[],
      delivery: [
      
      ],

      useraddress: [
       
      ],

      goldmedal: [
     
      ],
      shopprice: {
    
      },
      information: {
        reference: "1111111111111111",
        ordertime: "2012-12-01    11:20:00",
        paymentmethod: "微信支付",
        distribution: "快递",
        trackingnumber: "11111111111111",
         catimage: require("../../assets/image/rc-left.png"),
      },
    };
  },
  methods: {

    async canceldanhao(orderNumber){
 let data=await userin(orderNumber);
 this.goldmedal=data;
 console.log(this.goldmedal[0].orderDetailList);

 for(let i =0;i<this.goldmedal[i].length;i++){
   console.log(this.goldmedal[i].orderDetailList);
  //  this.useralllist.push(this.goldmedal[i].orderDetailList);
 }
 console.log(this.useralllist);
},
   //查询人的所有地址
    async editaddress(user) {
    //  user.data.id=844350;
        let data = await selectaddress(this.userid);
        console.log(data);
        let list=[]
        this.useraddress=data.data;
        for(let i =0;i<this.useraddress.length;i++){
          if(this.useraddress[i].isDefault==true){
            list.push(this.useraddress[i]);
          }
        }
        this.useraddress=list;
        console.log(list);
        // console.log(this.list);
    },



  },
  mounted() {
    this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
       this.userid = this.usermessage.data.id;
       console.log(this.userid);
       this.editaddress(this.userid);
    this.addressstype = this.$route.query.stype;
    this.orderNumber=this.$route.query.orderNumber;
    this.canceldanhao(this.orderNumber)
    console.log(this.orderNumber);
    if(this.addressstype==2){
          this.orderstatus='您的订单已付款成功，请耐心等候，我们会尽快安排给您发货！';
          this.isshow=false;
          this.userisdelivery='待发货';
          console.log( this.orderstatus);
    }else if(this.addressstype==0){
         this.orderstatus='您的订单尚未支付';
          this.isshow=false;
          this.userisdelivery='待付款';
    }
    else if(this.addressstype==1){
         this.orderstatus='您的订单发货，请您耐心等候！';
          this.isshow=true;
          this.userisdelivery='待收货';
    }
      else if(this.addressstype==3){
         this.orderstatus='您的订单已取消！';
          this.isshow=false;
          this.userisdelivery='已取消';
    }
    console.log(this.addressstype);
  },
  components: {
    Myheader,
  },
};
</script>

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

</style>