<template>
  <div class="user-main">
    <Myheader></Myheader>
    <div class="rc-top"></div>
      <div class="rc-main"  v-for="(item,index) in goldmedal" :key="item.id" >
        <div class="rc-main rc-receiving"  >
          <em>{{item.status=='0'?'待付款':item.status=='1'?'待收货':item.status=='2'?'已完成':item.status=='3'?'已取消':'异常订单'}}</em>
          <span>{{orderstatus}}</span>
        </div>
        
        <div class="delivery" v-if="isshow" >
          <div class="to-delivery">
            <span>{{ trackingstates}}</span>
          </div>
          <div class="bo-delivery">
            <span>{{ logisticsCompany }}</span>
          </div>
           <div class="viewdetails">
             <span>查看详情</span>
                <img :src="leftico" alt="" /> 
           </div>
        </div>
        <div
          class="mypersonal"
        >
          <div class="my-delivery">
            <span>{{ item.addressUserName }}</span>
            <i>{{ item.addressPhoneNumber }}</i>
          </div>
          <div class="per-delivery">
            <span>{{ item.addressProvinceName }}{{item.addressCityName}}{{item.addressCountyName}}</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= userlist.picFile alt="" />
            </div>
            <div class="rc-right">
              <div class="rc-usercenter">
                <em>{{ userlist.productName }}</em>
                <div class="rc-userright">
                  <span>规格:{{ userlist.specifications }}</span>
                </div>
              </div>
              <div class="rc-userbottom">
                <span>数量:{{ userlist.pcs }}件</span>
                <i>￥{{ userlist.ecPrice }}</i>
                 <div class="rc-bottom">
            <span @click="userpay()">{{customer}}</span>
          </div>
              </div>
                  <div class="rc-bottomm">
            <span @click="userpay()">{{customer}}</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>{{ logisticsDate }}</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>{{ 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>￥{{usersalesAmount}}</em>
               </div>
               <div style="padding-bottom:40px">
               <span @click="onceagain(item)">再次购买</span>
               </div>
          </div>

        </div>
        </div>
      </div>
         <div class="rc-full-width rc-margin-y--md">
               <i class="ts-standard-btn ts-standard-btn--two center" @click="onceagain()">
                 {{payorsucess}}
               </i>

         </div>

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

<script>
import Myheader from "~/components/header.vue";
import { mapMutations } from "vuex";
  import { userin} from "../../ajax/getData";
  import MyFooter from '~/components/rc-footer.vue';
  import Vue from 'vue';
let vm = new Vue();
  import formatConversion from '../../static/js/date'
    import {selectaddress,canceldanhao,generateOrderWX} from "../../ajax/getData";

export default {
  data() {
    return {
      goldmedal:[],
      userproductId:'',
      logisticsDate:'',
      addressPhoneNumber:'',
      userphone:'',
      logisticsNumber:'',
      customer:'',//联系客服或者取消订单
      payorsucess:'', //立即支付或者再次购买，
      addressstype: null,
      addressUserName:'',
      logisticsCompany:'',//物流公司
      orderstatus: '',
      goldastates:'',
      
      userisdelivery:'待收货',
      userdelivery: "派送中",
      isshow:true,
      usersalesAmount:'',
      leftico: require("../../assets/image/rc-left.png"),
      orderNumber:'',
      userdata:"",
       usermessage:null,
         userid: null,
         trackingstates:'',//运输状态
      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: {
...mapMutations(["checkIsLogin"]),
	refreshDesktopNav:function(){
		RCDL.navigation.currentState=null;
		RCDL.navigation.rebuild();
	},
    //取消订单
        async canceldanhao(orderNumber) {
      let data = await canceldanhao(this.userphone,this.orderNumber);
      if (data) {
        this.$message({
          type: "warning",
          message: "取消订单成功",
        });
        setTimeout(() => {
                this.$router.push({
          path: "/personal/useraddress",
          query: {
            stype: 1,
          },
        });
        }, 500);
         
      }
    },
userpay(){
  console.log('---');
 if(this.goldastates==0){
    this.canceldanhao();
 }
 else if( this.customer='联系客服申请售后'){
    	var option = {
					customer: {id: '', name: '', email: '', mobile: '', memberId: this.userdata.data.id}
				}
				dis_livchat(option);
 }
},
//订单支付和再次购买
   onceagain(item){
     console.log(this.payorsucess);
     if(this.payorsucess=='立即支付'){
       console.log('----')
      this.getwei(item);

     }else{
       this.$router.push({
				path: "/productdetails/producted",
				query: {
					stype: 1,
					productCode: this.userproductId
				},
			});
       console.log('不是立即支付');
     }

   	
   },
    async orderquantity(orderNumber){
  
 let data=await userin(orderNumber);
if(data){
  this.goldmedal=data;
  console.log(this.goldmedal);
  for(let i=0;i<this.goldmedal.length;i++){
    this.goldastates=this.goldmedal[i].status;

    this.userproductId=this.goldmedal[i].orderDetailList[0].productId;
    this.logisticsNumber=this.goldmedal[i].orderDetailList[0].logisticsNumber;  //物流单号
     this.trackingstates=this.goldmedal[i].orderDetailList[0].status//运输状态

     if( this.trackingstates==0){
              this.trackingstates='运输中'
     }else if(this.trackingstates==1){
              this.trackingstates='已签收'
     }
      else if(this.trackingstates==2){
              this.trackingstates='未发货'
     }
     this.logisticsDate=this.formatConversion(this.goldmedal[i].orderDate)//时间戳
     this.logisticsCompany=this.goldmedal[i].orderDetailList[0].logisticsCompany; //物流公司
    this.orderNumber=this.goldmedal[i].orderNumber
    this.usersalesAmount=this.goldmedal[i].salesAmount;
    this.addressUserName=this.goldmedal[i].addressUserName;
    this.addressPhoneNumber=this.goldmedal[i].addressPhoneNumber;

  }
  console.log(this.goldmedal,this.userproductId,this.usersalesAmount);
}
 

},
   //订单立即支付
    async getwei(user) {
      console.log(user);
       let userPayData = {
         
          userprice: this.usersalesAmount,
           orderId:this.orderNumber,
          userinformation:this.addressUserName +
            " "+this.addressPhoneNumber
        };
          this.$router.push({
          path: "/personal/userpay",
          query: {
            userData:this.orderNumber,
            stype:1,
           userPayData: JSON.stringify(userPayData),

          },
        });
        
    },
        async editaddress(user) {
    //  user.data.id=844350;
        let data = await selectaddress(this.userid);
        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( this.useraddress[0].recipient);

        // console.log(this.list);
    },



  },
  mounted() {
    this.checkIsLogin();
this.userdata=this.$store.state.userInfo;
console.log(this.userdata);
    this.usermessage = JSON.parse(localStorage.getItem("userInfo"));
       this.userid = this.usermessage.data.id;
       this.userphone=this.usermessage.data.mobile;
       this.editaddress(this.userid);
    this.addressstype = this.$route.query.stype;

    this.orderNumber=this.$route.query.orderNumber;
    this.orderquantity(this.orderNumber)
    if(this.addressstype==2){
          this.orderstatus='您的订单已完成';
          this.isshow=false;
          this.userisdelivery='待发货';
           this.customer='联系客服申请售后'
           this.payorsucess='再次购买'
          console.log( this.orderstatus);
    }else if(this.addressstype==0){
         this.orderstatus='您的订单还未付款，请尽快付款！';
          this.isshow=false;
          this.userisdelivery='待付款';
           this.customer='取消订单'
            this.payorsucess='立即支付'
    }
    else if(this.addressstype==1){
         this.orderstatus='您的订单已发出，请耐心等候。';
          this.isshow=true;
          this.userisdelivery='待收货';
            this.customer='联系客服申请售后'
           this.payorsucess='再次购买'
    }
      else if(this.addressstype==3){
         this.orderstatus='您的订单已取消！';
          this.isshow=false;
          this.userisdelivery='已取消';
           this.customer='联系客服申请售后'
           this.payorsucess='再次购买'
    }
    console.log(this.addressstype);
  },
  components: {
    Myheader,
    MyFooter,
  },
};
</script>

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

</style>