smart-admin/rc-busness/pages/myorder/usertion.vue
952108534@qq.com bfa62a1cd9 添加
2022-01-22 21:58:34 +08:00

383 lines
12 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<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-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 @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>{{ 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>{{ 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">再次购买</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 {selectaddress,canceldanhao,generateOrderWX} from "../../ajax/getData";
export default {
data() {
return {
goldmedal:[],
userproductId:'',
userphone:'',
logisticsNumber:'',
customer:'',//联系客服或者取消订单
payorsucess:'', //立即支付或者再次购买,
addressstype: null,
addressUserName:'',
orderstatus: '',
goldastates:'',
userisdelivery:'待收货',
userdelivery: "派送中",
isshow:true,
usersalesAmount:'',
leftico: require("../../assets/image/rc-left.png"),
orderNumber:'',
userdata:"",
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: {
...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(){
console.log(this.payorsucess);
if(this.payorsucess=='立即支付'){
console.log('----')
this.getwei();
}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;
for(let i=0;i<this.goldmedal.length;i++){
// this.goldmedal[i].status=0
this.goldastates=this.goldmedal[i].status;
this.userproductId=this.goldmedal[i].orderDetailList[0].productId;
this.logisticsNumber=this.goldmedal[i].orderDetailList[0].logisticsNumber;
this.orderNumber=this.goldmedal[i].orderNumber
this.usersalesAmount=this.goldmedal[i].salesAmount;
this.addressUserName=this.goldmedal[i].addressUserName;
}
console.log(this.goldmedal,this.userproductId,this.usersalesAmount);
}
},
//订单立即支付
async getwei(user) {
let postData = [];
let oneProduct = {
productName: item.productName,
buyCount: item.buyCount,
productId: item.productCode,
payAmount: item.productPrice,
memberId: item.memberId,
phoneNumber: item.mobile,
orderAddress: {
addressPhoneNumber: orderAddress[0].recipientPhone,
addressUserName: orderAddress[0].recipient,
addressProvinceName: orderAddress[0].provinceName,
addressCityName: orderAddress[0].cityName,
addressCountyName: orderAddress[0].districtName,
addressDetailInfo: orderAddress[0].detailAddress,
},
};
let res = await generateOrderWX(postData);
let userPayData = {
orderId: res.data,
userprice: this.usersalesAmount, //订单总价
userinformation:
this.addressUserName+ //姓名
" " +
this.userphone, //电话
wxPay: "weixin://wxpay/bizpayurl?pr=4RJbokxzz",
};
this.$router.push({
path: "/personal/userpay",
query: {
userPayData:JSON.stringify(userPayData),
},
});
},
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.goldmedal);
// 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>