smart-admin/rc-busness/pages/personal/useraddress.vue
2022-03-21 15:45:01 +08:00

475 lines
13 KiB
Vue

<template>
<div>
<Myheader></Myheader>
<div class="rc-top"></div>
<tabs :crumbs="crumbs"></tabs>
<div class="online bold"></div>
<div class="usercontshow rc-max-width--xl">
<div class="rc-headera">
<span
v-for="(item, index) in discountlist"
:key="index"
@click="selectGoods(item, index)"
:class="activeIndex == index ? 'active' : 'unactive'"
>
{{ item.title }}
</span>
</div>
<div class="online bold" style="height:8px;margin-top:0"></div>
<div class="rc-userheader">
<span v-for="(item, index) in message" :key="index">
{{ item.title }}
</span>
</div>
<div class="rc-center" v-for="(item, index) in useralllist" :key="index">
<div class="rc-usermaina">
<div class="rc-title">
<div>
<i>订单编号:</i><span>{{ item.orderNumber }}</span>
</div>
<div class="rc-usertitle">
<strong>订单状态:</strong>
<em>{{
item.status == "0"
? "待付款"
: item.status == "1"
? "待收货"
: item.status == "2"
? "已完成"
: item.status == "3"
? "已取消"
: "异常订单"
}}</em>
</div>
</div>
<div class="rc-usermain" >
<div class="rc-image">
<img :src= item.picFile alt="" />
</div>
<div class="rc-right" @click="usertiaozhuan(item)">
<div class="rc-usercenter">
<em>{{ item.productName }}</em>
<div class="rc-userright">
<span>规格:{{ item.specifications }}</span>
</div>
</div>
<div class="rc-userbottom">
<span>数量:{{ item.pcs }}</span>
<i>{{item.ecPrice}}</i>
</div>
<div class="rc-userbottomm">
<i>{{ item.ecPrice }}</i>
<span>{{ item.pcs }}</span>
<i>{{ item.salesAmount }}</i>
</div>
</div>
<div class="pc-bottom">
<span v-if="item.status!=1" @click="userpay(item, index)">{{
item.status == "0"
? "取消订单"
: item.status == "1"
? "确认收货"
: item.status == "2"
? "再次购买"
: item.status == "3"
? "再次购买"
: "异常订单"
}}</span>
<span @click="userfind(item)">{{
item.status == "0"
? "立即支付"
: item.status == "1"
? "查看订单"
: item.status == "2"
? "查看订单"
: item.status == "3"
? "查看订单"
: "异常订单"
}}</span>
</div>
</div>
<div class="online" style="display:none"></div>
<div class="rc-usermain rc-price">
<div class="rc-price priceleft">
<span>数量:</span>
<em>共{{item.lengthnum}}件商品</em>
</div>
<div class="rc-price priceright">
<strong>总计:</strong>
<i>¥{{item.salesAmount}}</i>
</div>
</div>
<div class="rc-bottom">
<span @click="userpay(item, index)">{{
item.status == "0"
? "取消订单"
: item.status == "1"
? "确认收货"
: item.status == "2"
? "再次购买"
: item.status == "3"
? "再次购买"
: "异常订单"
}}</span>
<span @click="userfind(item)">{{
item.status == "0"
? "立即支付"
: item.status == "1"
? "查看订单"
: item.status == "2"
? "查看订单"
: item.status == "3"
? "查看订单"
: "异常订单"
}}</span>
</div>
</div>
<div class="online bold"></div>
</div>
</div>
<el-dialog :visible.sync="showPaytypeWarning" :close-on-click-modal="false">
<div class="ts-warning-popup">
<div class="title rc-full-width">
<img src="../../assets/error.png" alt="" />
</div>
<div class="content rc-full-width rc-text--center rc-margin-y--md">
<h3>温馨提示</h3>
<span class="">{{ paytypeWarning.message}}</span>
</div>
</div>
</el-dialog>
<MyFooter></MyFooter>
</div>
</template>
<script>
import Myheader from "~/components/header.vue";
import MyFooter from '~/components/rc-footer.vue';
import tabs from "~/components/tabs.vue";
import util from "@/ajax/util";
import { customerorders, userindent, canceldanhao, repayOrde } from "../../ajax/getData";
import { mapMutations } from "vuex";
export default {
data() {
return {
util,
paytypeWarning:{result:true,message:''},
showPaytypeWarning:false,
crumbs:[
{
path:'/personal/mypersonal/',
},
{
path:'/personal/useraddress/',
}
],
activeIndex: 0,
userstype:'',
alllist:[],
obligation:[],//待付款
pending:[],//待发货
receiving :[],//待收货
allmessage:[],
useralllist: [],
usertitle:'',
useraliset:[],
userdata: [],
buttontitle: "再次购买",
discountlist: [
{
title: "全部",
},
{
title: "待付款",
},
{
title: "待发货",
},
{
title: "待收货",
},
],
message: [
{
title: "商品",
},
{
title: "单价/元",
},
{
title: "数量",
},
{
title: "实付款/元",
},
{
title: "操作",
},
],
goldmedal: [
{
ordernumber: "",
orderstype: 1,
usereat: "",
ordernum: 0,
num: "",
specification: "",
buttontitle: "",
userprice: "",
catimage: '',
}
],
};
},
mounted() {
this.checkIsLogin();
let user = this.$store.state.userInfo;
this.userdata = user.data.mobile;
let stype = this.$route.query.stype;
this.userstype=this.$route.query.stype;
if (user == "" || user == null) {
this.$message({
type: "warning",
message: "请先去登录",
});
return;
} else {
this.indet(this.userdata, stype);
}
},
components: {
Myheader,
MyFooter,
tabs
},
methods: {
...mapMutations(["changemessage","checkIsLogin"]),
async indet(mobile, stype) {
let data = await userindent(mobile,undefined,1,100);
this.activeIndex = stype;
this.goldmedal = data;
this.alllist=[];
this.allmessage=[];
this.useralllist=[];
this.obligation=[];
this.receiving=[];
this.pending=[];
for (let i = 0; i < this.goldmedal.length; i++) {
if(!this.goldmedal[i].orderDetailList)
continue;
this.useralllist.push(this.goldmedal[i].orderDetailList[0]);
this.alllist.push(this.goldmedal[i].orderDetailList[0])
this.allmessage.push(this.goldmedal[i].orderDetailList[0])
if(this.goldmedal[i].status==0){
this.obligation.push(this.goldmedal[i].orderDetailList[0]);
}else if(this.goldmedal[i].status==1){
this.receiving.push(this.goldmedal[i].orderDetailList[0]);
}
else if(this.goldmedal[i].status==2){
this.pending.push(this.goldmedal[i].orderDetailList[0]);
}
}
for (let y = 0; y < this.goldmedal.length; y++) {
if(!this.goldmedal[y].orderDetailList)
continue;
this.useralllist[y].orderNumber = this.goldmedal[y].orderNumber;
this.useralllist[y].status = this.goldmedal[y].status;
this.useralllist[y].addressUserName = this.goldmedal[y].addressUserName;
this.useralllist[y].phoneNumber = this.goldmedal[y].addressPhoneNumber;
this.useralllist[y].salesAmount = this.goldmedal[y].salesAmount;
this.useralllist[y].lengthnum=this.goldmedal[y].orderDetailList.length;
this.useralllist[y].paytype=this.goldmedal[y].paytype;
}
if(this.userstype==1){
this.useralllist=this.obligation
}else if(this.userstype==2){
this.useralllist=this.pending
}
else if(this.userstype==0){
this.useralllist=this.allmessage
}
else if(this.userstype==3){
this.useralllist=this.receiving
}
},
//订单立即支付
async getwei(item) {
let payType = this.util.pickPaytype();
let data = await this.repayOrde(item.orderNumber, payType);
if(data.code==1) {
let userPayData = {
userprice: item.salesAmount,
orderId: item.orderNumber,
userinformation: item.addressUserName + " " + item.phoneNumber,
wxPay:data.msg
};
this.$router.push({
path: "/personal/userpay",
query: {
userData: item.orderNumber,
stype: 1,
userPayData: JSON.stringify(userPayData),
},
});
} else {
this.$message({
type: "error",
message: "订单数据错误,请联系客服进行处理",
});
}
},
async repayOrde(ordernumber) {
let payType = this.util.pickPaytype();
let res = await repayOrde(ordernumber, payType);
if (res) {
return res;
}
},
usertiaozhuan(item){
this.$router.push({
path: "/myorder/usertion",
query: {
stype: item.status,
orderNumber: item.orderNumber,
},
});
},
async canceldanhao(orderNumber) {
let data = await canceldanhao(this.userdata,orderNumber);
if (data) {
this.$message({
type: "warning",
message: "取消订单成功",
});
setTimeout(() => {
this.indet(this.userdata);
this.activeIndex=0;
this.useralllist=[];
}, 500);
}
},
userpay(item, index) {
if (item.status == 0) {
if(confirm('确认取消该订单嘛?')){
this.canceldanhao(item.orderNumber);
setTimeout(() => {
this.indet(this.userdata);
this.useralllist=[];
this.alllist=[];
this.allmessage=[];
this.obligation=[];
this.receiving=[];
this.pending=[];
}, 500);
}
} else if(item.status == 1) { //确认收货
}
if (item.buttontitle == "立即支付") {
this.$router.push({
path: "/personal/userpay",
query: {
stype: 1,
},
});
} else if (item.status == 3) {
this.$router.push({
path: "/productdetails/producted",
query: {
stype: 1,
productCode:item.productId
},
});
}
},
selectGoods(item, index) {
let list=[]
this.activeIndex = index;
if(item.title=='待付款'){
list=this.obligation
} else if(item.title=='待收货'){
list=this.receiving
} else if(item.title=='待发货'){
this.useralllist=this.pending
list=this.pending
}
else if(item.title=='全部'){
list=this.alllist
}
this.useralllist=[];
for (var i = 0; i < this.useralllist.length; i++) {
this.useralllist[i].orderNumber =this.goldmedal[i].orderNumber;
this.useralllist[i].status = this.goldmedal[i].status
this.useralllist[i].addressUserName =this.goldmedal[i].addressUserName;
this.useralllist[i].phoneNumber = this.goldmedal[i].phoneNumber;
this.useralllist[i].salesAmount = this.goldmedal[i].salesAmount;
this.useralllist[i].lengthnum=this.goldmedal[i].orderDetailList.length
}
this.useralllist=list
},
userfind(item) {
this.paytypeWarning = this.util.checkPaytypeValidated(item.paytype);
this.showPaytypeWarning = !this.paytypeWarning.result;
let user = this.$store.state.userInfo;
if(this.paytypeWarning.result) {
if(item.status==0){
_hmt.push([
"_trackCustomEvent",
"order_repay",
{
"status":"success",
"member_id": user.data.id
}
])
this.getwei(item);
}else{
this.$router.push({
path: "/myorder/usertion",
query: {
stype: item.status,
orderNumber: item.orderNumber,
},
});
}
} else {
_hmt.push([
"_trackCustomEvent",
"order_repay",
{
"status":"fail",
"member_id": user.data.id
}
])
}
},
usertwo() {
this.$router.push({
path: "/myorder/userrecord",
query: {
stype: 1,
},
});
},
},
};
</script>
<style lang="less" scoped>
@import url("../../assets/css/orderquantity.less");
</style>