Commit e9f7f387 authored by 华国豪's avatar 华国豪 🙄
parents 48ca7c5b e7a2653a
This diff is collapsed.
This diff is collapsed.
<style>
.payBefore_vue{
width:1200px;
height:auto;
margin:auto;
}
.payBefore_vue .head{
padding: 4px 0;
position: relative;
height: 40px;
width:100%;
}
.payBefore_vue .icon-jinggao{
color: #49C0A1;
font-size: 38px;
position: absolute;
}
.payBefore_content{
min-height: 380px;
position: relative;
margin-top: 15px;
padding-bottom: 25px;
padding-top: 16px;
background: rgba(255, 255, 255, 1);
-webkit-box-shadow: 0px 4px 38px 0px rgba(107, 107, 107, 0.2);
box-shadow: 0px 4px 38px 0px rgba(107, 107, 107, 0.2);
}
.payBefore_content .ordernum{
position: relative;
width: 203px;
height: 35px;
line-height: 35px;
background: #49c0a1;
font-size: 14px;
font-weight: 400;
color: rgba(255, 255, 255, 1);
padding-left: 16px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
margin-left: -7px;
border-right-color: transparent;
}
.payBefore_content .triangle_border_left{
width: 0;
height: 0;
border-width: 17px 17px 17px 0;
border-style: solid;
border-color: transparent #30a19b transparent transparent;
position: absolute;
right: 0;
top: 0px;
}
.PayBefore_Left{
float:left;
margin-left:173px;
width:435px;
height:150px;
margin-top:30px;
}
.PayBefore_Right{
float:left;
margin-left:26px;
width:349px;
height:218px;
}
.PayBefore_Right img{
width:100%;
}
.PB_img{
width:54px;
height:54px;
float:left;
}
.PB_img img{
width:100%;
}
.PB_Detail{
float:left;
width:363px;
font-size:12px;
color:#333333;
margin-left:10px;
}
.PB_Detail div:first-child{
font-size:24px;
font-weight: bold;
margin-bottom:5px;
}
.HP_time{
color:#EE4454;
font-weight: bold;
}
.HP_zhifu{
width:70px;
height:30px;
background-color: #EE4454;
color:#fff;
border: none;
outline: none;
cursor: pointer;
border-radius: 4px;
margin-top:43px;
}
</style>
<template>
<div class="payBefore_vue">
<!-- 头部 -->
<div class="head" style="margin-top:20px;">
<div style="box-sizing:border-box;">
<div style="float:left;">
<i class="iconfont icon-jinggao"></i>
<div style="margin-left:50px">
<p style="font-size:14px;font-weight:600">
订单提交成功!
</p>
<p style="font-size:12px">请您在
<span style="color:#FF680B;">12小时</span>
内完成支付,否则订单会自动取消</p>
</div>
</div>
<div style="text-align:center;float:right">
<span style="font-weight:200;font-size:12px;margin-right:10px;">应付金额</span>
<span style="color:#FF680B;font-size:18px;font-weight:bold;">{{TotalPrice}}</span>
<span style="font-size:12px;color:#333333"></span>
</div>
</div>
</div>
<div class="payBefore_content" style="margin-bottom:30px;">
<div class="ordernum">
订单号 : {{bookingNumber}}
<div class="triangle_border_left"></div>
</div>
<div class="clearfix" style="margin-top:45px;">
<div class="PayBefore_Left clearfix">
<div class="PB_img">
<img src="../../assets/img/hotel/smile.png" alt=""/>
</div>
<div class="PB_Detail">
<div>
恭喜您下单成功!
</div>
<div>
为了保证您能够顺利下单,请您在<span class="HP_time">12小时</span>内完成付款,如果在此
时间内未能完成付款我们将自动取消此订单
</div>
</div>
<div>
<input v-if="isShowBtn" type="button" class="HP_zhifu" @click="gotoPay('FreePay')" value="立即支付" />
<!-- <input v-if="!isShowBtn" type="button" class="HP_zhifu" @click="gotoPay('HotelHome')" value="返回首页" /> -->
</div>
</div>
<div class="PayBefore_Right">
<img src="../../assets/img/hotel/paySuccess.png" alt=""/>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
//应付总额
TotalPrice:0,
//订单号
bookingNumber:0,
msgList:'',
isShowBtn:true,
};
},
created() {
if(sessionStorage.getItem("FreePay")){
this.msgList = JSON.parse(sessionStorage.getItem("FreePay"));
this.TotalPrice=this.msgList.total_fee;
this.bookingNumber=this.msgList.orderId;
}
},
methods: {
gotoPay(path){
this.$router.push({
path:path
})
}
}
};
</script>
<style>
</style>
......@@ -126,9 +126,13 @@ export default {
},methods:{
selectDate(item){
console.log(item)
let a=false;
a=moment(this.today).isBefore(moment(item.date_str));
if(item.date_str==this.today){
a=true;
}
console.log('a',a)
if(item.pkg_no &&item.pkg_no!="" && a){
this.$emit('SelectChild',item);
}
......
......@@ -709,6 +709,24 @@ export default new Router({
title: "自由行-订单确认"
}
},
{
path: "/FreePayBefore",
name: "FreePayBefore",
component: resolve =>
require(["@/components/FreeTravel/FreePayBefore.vue"], resolve),
meta: {
title: "自由行-订单确认"
}
},
{
path: "/FreePay",
name: "FreePay",
component: resolve =>
require(["@/components/FreeTravel/FreePay.vue"], resolve),
meta: {
title: "自由行-支付"
}
},
]
},
{
......
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