Commit 3fe53dfe authored by zhengke's avatar zhengke

增加订单

parent 4c486b39
......@@ -390,8 +390,11 @@
}
},{
"path":"personal/mycollection"
},{
"path":"personal/orderList"
},{
"path":"personal/orderDetail"
}]
},
//抖音商品短视频
......
<style>
.orderDetail {
background: #f6f6f6;
font-family: 'oswald';
padding:0 5px;
padding-bottom:60px;
height:100%;
}
.orderDetail .orderItem {
background-color: #fff;
margin-bottom: 10px;
padding: 0 15px;
border-radius: 10px;
}
.orderDetail .order_big {
font-size: 14px;
color: #08090E;
font-weight: bold;
}
.orderDetail .order_mini {
font-size: 11px;
color: #919191;
margin-top: 10px;
}
.orderDetail .orderCar {
display: flex;
justify-content: space-between;
padding: 30px 0;
}
.orderDetail .order_carImg image {
width: 200rpx;
height: 130rpx;
}
.orderDetail .order_small {
font-size: 14px;
color: #919191;
}
.orderDetail .order_GName {
width: 100%;
height: 50px;
border-top: 1px solid rgba(0, 0, 0, 0.03);
display: flex;
align-items: center;
justify-content: space-between;
}
.orderDetail .order_dList {
border-bottom: 1px solid rgba(0, 0, 0, 0.03);
padding: 20px 0;
}
.order_dList:last-child {
border-bottom: 0;
}
.orderDetail .order_comLeft {
margin-left: 70px;
}
.orderDetail .order_Tprice {
display: flex;
justify-content: space-between;
}
.order_redPrice {
color: #F20707;
font-size: 14px;
}
.order_Apply,
.order_Sure {
width: 50%;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
height: 60px;
}
.orderDetail .order_ImgS {
width: 17px;
height: 17px;
margin-right: 5px;
}
.orderDetail .order_Line {
width: 1px;
height: 40px;
background-color: #e2e2e2;
}
.orderDetail .order_nonBtm {
border-bottom: 0 !important;
}
.orderDetail .btn-box {
display: flex;
flex-direction: row-reverse;
height: 60px;
padding: 10px 20px;
position: fixed;
bottom: 0;
left: 0;
right: 0;
z-index: 2;
border-top: 1px solid #f5f5f5;
background: #fff;
display: flex;
align-items: center;
}
.order_Btn_Com {
padding: 5px 10px;
border: 1px solid #888888;
border-radius: 14px;
color: #888888;
font-size: 12px;
float: right;
margin-right: 15px;
}
</style>
<template>
<view class="orderDetail">
<template>
<view class="orderItem">
<view class="orderCar">
<view class="order_carImg">
<image mode="aspectFit"/>
</image>
</view>
<view style="width:52%">
12321321
</view>
</view>
</view>
<view class="orderItem">
<view class="order_dList order_Tprice">
<text class="order_small">订单编号</text>
<text class="order_big" style="margin-left:20px;">123</text>
</view>
<view class="order_dList order_Tprice">
<text class="order_small">下单时间</text>
<text class="order_big" style="margin-left:20px;">12334</text>
</view>
<view class="order_dList order_Tprice">
<text class="order_small">支付方式</text>
<text class="order_big" style="margin-left:20px;">在线支付</text>
</view>
</view>
</template>
<after-sale :list="dataList.DetailList" v-if="showAfter" @close="closeAfterHandler"></after-sale>
<u-popup v-model="showModal" mode="center" length="80%">
<view style='display: flex;flex-direction: column;align-items: center;background: #fff;'>
<view style="display: flex;align-items: center;justify-content: center;height:70px ;">
<Text>是否取消订单?</Text>
</view>
<view style="display: flex;flex-direction: column;height:80px ;margin-left: 15px;width: 100%;" v-if='dataList.OrderStatus==2'>
<Text style='margin-left: 10px;margin-top: 5px;'>备注</Text>
<input class="uni-input inputM" style='margin-left: 10px;margin-top: 5px;' v-model="Cancelmsg.Remark" placeholder="输入备注" />
</view>
<view style="display: flex;flex-direction: row;align-items: center;height: 50px;border-top: 1px solid #F5F5F5;width: 100%;">
<view style="width: 50%;display: flex;align-items: center;justify-content: center" @click="showModal=false">
<Text>取消</Text>
</view>
<view style="width: 50%;color: #a0cfff;display: flex;align-items: center;justify-content: center" @click="confirm">
<Text>确定</Text>
</view>
</view>
</view>
</u-popup>
<payCom v-if="payBtn" :payInfo="payInfo" @closePay="closePay"></payCom>
<u-popup v-model="payExit" mode="center" :mask-close-able="false">
<view style="background:#fff;width:500rpx">
<view style="padding:10px 0 0 10px">提交失败</view>
<view style="text-align:center;padding-bottom:40rpx">
<view style="margin:80rpx 0">支付取消</view>
<span @click="exitPay" style="padding:10rpx 50rpx;color:#fff;background:#19be6b;border-radius: 12px;">确定</span>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import payCom from '@/components/pay/pay';
import afterSale from "@/components/userorder/after-sale";
export default {
components: {
afterSale,
payCom
},
data() {
return {
pageTitle: '订单详情',
mainColor: '',
msg: {
OrderId: 0,
},
dataList: {},
showAfter: false,
themCustomStyle: {
marginLeft: "20px",
padding: "0 2rpx",
color: "#FFF",
},
showModal: false,
Cancelmsg: {
OrderId: 0,
Type: 1,
Remark: '',
},
payInfo: {
OpenId: '',
OrderId: '',
OrderPayType: 1,
GoodsName: ''
},
payBtn: false,
payExit: false
}
},
created() {
this.mainColor = this.$uiConfig.mainColor;
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length - 1].route;
let pages = wx.getStorageSync("basedata") ?
wx.getStorageSync("basedata").bar_title : [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
},
onLoad(option) {
console.log(option,'optionssss');
this.u = uni.getStorageSync("mall_UserInfo");
this.msg.OrderId = option.OrderId;
this.payInfo.OpenId = uni.getStorageSync('mall_UserInfo').OpenId;
this.getData();
},
methods: {
//获取数据
getData() {
this.request2({
url: "/api/AppletEducation/GetAppletGuidecarOrderOrderInfo",
data: this.msg,
},
(res) => {
if (res.resultCode == 1) {
console.log(res,'数据');
this.dataList = res.data;
}
}
);
},
closeAfterHandler() {
this.showAfter = false;
},
//取消订单
cancel() {
this.showModal = true;
this.Cancelmsg.OrderId = this.dataList.OrderId;
this.Cancelmsg.Type = this.dataList.OrderStatus;
this.Cancelmsg.Remark = ''
},
confirm() {
let that = this
if (that.Cancelmsg.Type == 2 && that.Cancelmsg.Remark == '') {
uni.showToast({
title: '备注不能为空',
icon: 'none'
})
return
}
let pages = getCurrentPages(); // 当前页面
uni.requestSubscribeMessage({ //订阅消息 退款和审核通知
tmplIds: that.dataList.template_message_list,
complete(res) {
that.request2({
url: '/api/AppletOrder/CancelAppletGoodsOrderInfo',
data: that.Cancelmsg
},
(res) => {
that.showModal = false;
uni.showToast({
title: res.message,
icon: 'none'
})
uni.redirectTo({
url: "/pages/guidecar/orderList?status=1",
});
}
);
}
})
},
//支付
payment(e) {
this.payInfo.OrderId = e.OrderId;
this.payInfo.GoodsName = e.DetailList[0].GoodsName.slice(0, 10);
this.payInfo.PaymentWay = e.PaymentWay;
this.payInfo.total_price = e.Income;
this.payBtn = true
},
closePay() {
this.payBtn = false;
this.payExit = true;
},
exitPay() {
this.payExit = false;
},
}
}
</script>
<style>
.order_Content {
width: 100%;
}
.order_Inner {
width: 100%;
padding: 20px;
margin-bottom: 10px;
background-color: #fff;
}
.order_NContent {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 13px;
color: #121212;
}
.order_Status {
color: #FF4048;
color: 12px;
}
.order_Car {
display: flex;
justify-content: space-between;
margin-top: 15px;
}
.order_Price {
color: #121212;
font-size: 15px;
}
.order_carImg {
width: 124px;
height: 70px;
border-radius: 4px;
box-shadow: 0 4px 10px 1px #D2D2D2;
}
.order_middle {
font-size: 13px;
color: #121212;
width: 62%;
}
.order_eduName {
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin-bottom: 3px;
font-size: 14px;
color: #1B1D1E;
}
.order_BtnList {
margin-top: 20px;
position: relative;
height: 30px;
}
.order_Btn_inner {
width: 70%;
position: absolute;
right: 0;
}
.order_EduBtn_Com {
padding: 5px 10px;
border: 1px solid #9A9A9A;
border-radius: 4px;
color: #9A9A9A;
font-size: 12px;
float: right;
margin-right: 15px;
}
.payOrderBtn{
border:1px solid #00d6a6!important;
}
.order_Btn_inner .order_Btn_Com:first-child {
margin-right: 0;
}
.course-head{
width:100%;
}
</style>
<template>
<view class="quick-box" style="height:100vh;">
<view class="course-head">
<u-tabs name="Name" :list="headData" v-if="headData&&headData.length>1" :is-scroll="false" :current="current" :bar-width="80" :font-size="28"
:active-color="mainColor" :bold="false" @change="getChild"></u-tabs>
</view>
<u-empty v-if="dataList.length==0" text="暂无数据" mode="data"></u-empty>
<scroll-view v-else :scroll-y="true" style="background-color: #f0f4f7;" :enable-back-to-top="true" :enable-flex="true"
@scrolltolower="lower" :style="{ 'height': `calc(100% - ${scrollHeight})`}">
<view class="order_Content">
<view class="order_Inner" v-for="(item,index) in dataList" :key="index" @click="goDetail(item)">
<view class="order_NContent">
<view>{{getCreateTime(item.CreateDate)}}</view>
<view>订单号:{{item.OrderNo}}</view>
<view class="order_Status" v-if="item.OrderStatus==1" :style="{color:mainColor}">{{item.OrderStatusName}}</view>
<view class="order_Status" v-if="item.OrderStatus==5" style="color:#121212">{{item.OrderStatusName}}</view>
<view class="order_Status" v-if="item.OrderStatus==7" style="color:#9A9A9A">{{item.OrderStatusName}}</view>
</view>
<view class="order_Car">
<view class="order_carImg">
<image mode="aspectFit" style="width: 100%; height: 100%;border-radius: 4px;" :src="item.DetailList[0].CoverImagePath" />
</image>
</view>
<view class="order_middle">
<view class="order_eduName">{{item.DetailList[0].GoodsName}}</view>
<view style="margin-bottom:5px;">
{{item.DetailList[0].TripSTime}}
</view>
<view style="text-align: right;margin-top:15px;">
<text style="color:#9A9A9A;font-size:12px;">实付:</text>
<text style="font-size:15px;color:#121212">¥{{item.DetailList[0].Unit_Price}}</text>
</view>
</view>
</view>
<view class="order_BtnList">
<view class="order_Btn_inner">
<view class="order_EduBtn_Com payOrderBtn" v-if="item.OrderStatus==1" @click.stop="payment(item)" :style="{'color':mainColor}">立即支付</view>
<view class="order_EduBtn_Com" v-if="item.OrderStatus==1" @click.stop="cancel(item,index)">取消订单</view>
<view class="order_EduBtn_Com payOrderBtn" v-if="item.OrderStatus==5||item.OrderStatus==7" :style="{'color':mainColor}">查看详情</view>
</view>
</view>
</view>
</view>
<view style="padding:10px 0;">
<u-loadmore :status="status" :load-text="loadText" :font-size="24" :margin-top="0" :margin-bottom="0" bg-color="#f0f4f7" />
</view>
</scroll-view>
<u-popup v-model="showModal" mode="center" length="80%">
<view style='display: flex;flex-direction: column;align-items: center;background: #fff;'>
<view style="display: flex;align-items: center;justify-content: center;height:70px ;">
<Text>是否取消订单?</Text>
</view>
<view style="display: flex;flex-direction: column;height:80px ;margin-left: 15px;width: 100%;" v-if='subItem.OrderStatus==2'>
<Text style='margin-left: 10px;margin-top: 5px;'>备注</Text>
<input class="uni-input inputM" style='margin-left: 10px;margin-top: 5px;' v-model="Cancelmsg.Remark" placeholder="输入备注" />
</view>
<view style="display: flex;flex-direction: row;align-items: center;height: 50px;border-top: 1px solid #F5F5F5;width: 100%;">
<view style="width: 50%;display: flex;align-items: center;justify-content: center" @click="showModal=false">
<Text>取消</Text>
</view>
<view style="width: 50%;color: #a0cfff;display: flex;align-items: center;justify-content: center" @click="confirm">
<Text>确定</Text>
</view>
</view>
</view>
</u-popup>
<payCom v-if="payBtn" :payInfo="payInfo" @closePay="closePay"></payCom>
<u-popup v-model="payExit" mode="center" :mask-close-able="false">
<view style="background:#fff;width:500rpx">
<view style="padding:10px 0 0 10px">提交失败</view>
<view style="text-align:center;padding-bottom:40rpx">
<view style="margin:80rpx 0">支付取消</view>
<span @click="exitPay" style="padding:10rpx 50rpx;color:#fff;background:#19be6b;border-radius: 12px;">确定</span>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import payCom from '@/components/pay/pay';
import auth from "@/components/auth/index";
import tabbar from "@/components/tabbar/index";
export default {
components: {
auth,
payCom
},
data() {
return {
pageTitle: "课程订单",
loading: true,
mainColor: "",
u: {},
scrollHeight: 0,
pageCount: 1,
loadText: {
loadmore: "轻轻上拉,加载更多",
loading: "努力加载中",
nomore: "没有更多了",
},
msg:{
pageIndex:1,
pageSize:5,
StartTime:'',
EndTime:'',
OrderStatus:0
},
headData: [], //头部切换数据
current: 0,
//内容数据
dataList: [],
showModal: false,
subItem: {},
index: 0,
Cancelmsg: {
OrderId: 0,
Type: 1,
Remark: '',
},
payInfo: {
OpenId: '',
OrderId: '',
OrderPayType: 1,
GoodsName: ''
},
payBtn:false,
payExit:false,
};
},
created() {
this.mainColor = this.$uiConfig.mainColor;
},
mounted() {
let currentPages = getCurrentPages();
let u = "/" + currentPages[currentPages.length - 1].route;
let pages = wx.getStorageSync("basedata") ?
wx.getStorageSync("basedata").bar_title : [];
pages.forEach((x) => {
if (x.value == u) {
this.pageTitle = x.new_name ? x.new_name : x.name;
}
});
uni.setNavigationBarTitle({
title: this.pageTitle,
});
setTimeout(() => {
this.getHeadHeight();
}, 1000);
},
onLoad(option) {
this.current = option.status || -1;
this.getHeadList();
this.payInfo.OpenId=uni.getStorageSync('mall_UserInfo').OpenId;
this.u = uni.getStorageSync("mall_UserInfo");
},
methods: {
getHeadHeight() {
let that = this;
const query = uni.createSelectorQuery().in(this);
query
.select(".course-head")
.boundingClientRect((data) => {
that.scrollHeight = data.height + "px";
})
.exec();
},
//获取头部数据
getHeadList() {
this.request2({
url: "/api/AppletEducation/EducationOrderStatusEnumList",
data: {},
},
(res) => {
if (res.resultCode == 1) {
this.headData = res.data;
var obj = {
Id: 0,
Name: '全部'
}
this.headData.unshift(obj)
this.msg.OrderStatus=0;
this.getContent();
}
}
);
},
//点击头部切换
getChild(i) {
this.current = i;
this.msg.OrderStatus = this.headData[this.current].Id;
this.getContent(1);
},
//获取内容
getContent(num) {
if (num == 1) {
this.dataList = [];
}
uni.showLoading({
title: '加载中'
});
this.request2({
url: "/api/AppletEducation/GetAppletGoodsEducationOrderPageList",
data: this.msg,
},
(res) => {
uni.hideLoading();
if (res.resultCode == 1) {
console.log(res,'数据');
this.dataList = this.dataList.concat(res.data.pageData);
this.pageCount = res.data.pageCount;
}
}
);
},
//滚动加载
lower(e) {
if (this.msg.pageIndex < this.pageCount) {
this.msg.pageIndex++;
this.status = "loading";
this.getContent();
} else {
this.status = "nomore";
}
},
//跳转
goUrl(item) {
if (item.LinkUrl && item.LinkUrl.length > 0) {
uni.navigateTo({
url: item.LinkUrl,
});
}
},
//取消订单
cancel(e, index) {
this.showModal = true;
this.Cancelmsg.Remark = '',
this.index = index;
this.subItem = e;
this.Cancelmsg.OrderId = e.OrderId;
this.Cancelmsg.Type = e.OrderStatus == 1 ? 1 : 2;
},
//确认订单
confirm() {
let that = this
// that.showModal = false;
if (that.Cancelmsg.Type == 2 && that.Cancelmsg.Remark == '') {
uni.showToast({
title: '备注不能为空',
icon: 'none'
})
return
}
uni.requestSubscribeMessage({
tmplIds: that.dataList[0].template_message_list,
complete(res) {
that.request2({
url: '/api/AppletOrder/CancelAppletGoodsOrderInfo',
data: that.Cancelmsg
},
(res) => {
that.showModal = false;
if (that.Cancelmsg.Type == 1) {
uni.showToast({
title: res.message,
icon: 'none'
})
that.dataList.splice(that.index, 1);
} else {
uni.showToast({
title: "取消成功,请等待审核",
position: "bottom",
icon: "none",
duration: 2000,
});
that.msg.pageIndex = 1;
that.dataList = [];
that.getContent();
}
}
);
}
})
},
//再次购买
buy(y) {
let ShoppingCartIdList = [];
let forms = {};
let good = {
// MallId: y.MallId,
DetailList: [],
Use_Integral: 0,
User_Coupon_Id: 0,
DeliveryMethod: 0,
AddressId: 0,
};
y.DetailList.forEach((x) => {
ShoppingCartIdList.push(x.Id)
let g = {
GoodsId: x.GoodsId,
Number: x.Number,
SpecificationSort: x.SpecificationSort,
};
good.DetailList.push(g);
});
forms = good;
uni.navigateTo({
url: '/pages/order-submit/order-submit?formData=' + encodeURIComponent(JSON.stringify(forms)) +
'&IsFormShoppingCart=2&ShoppingCartIdList=' + JSON.stringify(ShoppingCartIdList)
});
},
payment(e){
this.payInfo.OrderId = e.OrderId;
this.payInfo.GoodsName = e.DetailList[0].GoodsName.slice(0,10);
this.payInfo.PaymentWay = e.PaymentWay;
this.payInfo.total_price = e.Income;
this.payBtn=true
},
exitPay() {
this.payExit = false;
},
closePay() {
this.payBtn = false;
this.payExit = true;
},
//跳转到详情
goDetail(item){
uni.navigateTo({ url: '/pages/school/personal/orderDetail?OrderId='+item.OrderId})
},
//格式化日期
getCreateTime(item){
if(item){
let time=''
var time1 = item.split("-").join(".");
var time2 = time1.split(" ")[0];
var time3 = item.split(" ")[1].substring(0,5);
time = time2+' '+time3;
return time;
}
}
},
};
</script>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment