Commit 7ee03e06 by hxx

支付成功页面优化

parent 10b16f19
......@@ -5,15 +5,15 @@
class="paySuccess_detail"
:style="{ 'padding-top': paddingTop, 'padding-bottom': paddingBottom }"
>
<div class="iconPay" :style="{'width':imgSize,'height':imgSize}">
<div class="iconPay" :style="{'width':imgSize,'height':imgSize}" v-if="iconShow">
<image mode="aspectFit" :src="icon" alt></image>
</div>
<!-- 企业要货开启了待审核 -->
<template v-if="whetherOpenEnterprisesWantGoods == 1 && whetherOpenApproval == 1">
<p class="success">提交成功,等待审核</p>
<p class="success" :style="{ fontSize: payTitleSize, color: payTitleColor }">提交成功,等待审核</p>
</template>
<template v-else>
<p class="success">{{ payTitle }}</p>
<p class="success" :style="{ fontSize: payTitleSize, color: payTitleColor }">{{ payTitle }}</p>
<p v-if="orderDetail.orderType == 5" class="tips">
您可在【我的】-【我的礼包】中进行送礼
</p>
......@@ -21,7 +21,7 @@
亦可以直接点下面按钮【立即送出】
</p>
<div v-if="orderDetail.orderType == 5"></div>
<div v-else class="orderPrice" v-html="subTitle">
<div v-else class="orderPrice" :style="subTitleStyle" v-html="subTitle">
订单金额:
<span v-if="routeQuery.multiMerchantsFlag || routeQuery.accountBalanceFlag"
>{{ routeQuery.totalMoney }}</span
......@@ -45,14 +45,14 @@
v-if="routeQuery.multiMerchantsFlag"
@click="toOrderList"
>
<van-button size="normal">查看详情</van-button>
<van-button size="normal" :style="btnStyle">查看详情</van-button>
</div>
<div v-else @click="toOrderDetail">
<van-button size="normal">查看详情</van-button>
<div v-else @click="toOrderDetail" :style="btnStyle">
<van-button size="normal" :style="btnStyle">查看详情</van-button>
</div>
</template>
<div @click="toIndex">
<van-button size="normal">回首页</van-button>
<div @click="toIndex" :style="btnStyle">
<van-button size="normal" :style="btnStyle">回首页</van-button>
</div>
</template>
</div>
......@@ -108,7 +108,7 @@
<div class="line" v-if="orderDetail.orderType == 5"></div>
<div class="bottom_box" v-if="orderDetail.orderType == 5">
<div class="bottom_item" @click="toShare">现在就分享</div>
<div class="bottom_item bottom_last" @click="backTo">回首页</div>
<div class="bottom_item bottom_last" @click="backTo">回首页</div>
</div>
</div>
</template>
......@@ -173,9 +173,18 @@ export default {
icon() {
return this.datas.componentData["icon"]||'http://mayi-newshop.oss-cn-shanghai.aliyuncs.com/public/png/83a4a0bc-37fc-411e-bc5c-6dd9c1b4a921.png';
},
iconShow() {
return this.datas.componentData["iconShow"] === undefined ? true : this.datas.componentData["iconShow"];
},
payTitle() {
return this.datas.componentData["title"];
},
payTitleSize() {
return (this.datas.componentData["titleSize"] || 16) + 'px';
},
payTitleColor() {
return this.datas.componentData["titleColor"] || '#333';
},
subTitle() {
let totalMoney = 0;
if (this.routeQuery.multiMerchantsFlag) {
......@@ -202,6 +211,12 @@ export default {
});
return subTitle;
},
subTitleStyle() {
return {
color: this.datas.componentData["subTitleColor"] || '#333',
fontSize: (this.datas.componentData['subTitleSize'] || 40) + 'px'
}
},
paddingTop() {
return this.datas.componentData["paddingTop"] + "px";
},
......@@ -216,6 +231,13 @@ export default {
},
orderSns() {
return this.render?this.routeQuery.orderSns:'----------'
},
btnStyle() {
return {
color: this.datas.componentData["btnColor"] || 'rgba(0, 0, 0, 0.4)',
backgroundColor: this.datas.componentData["btnBackgroundColor"] || 'rgba(0, 0, 0, 0)',
'border-radius': (this.datas.componentData["btnBorderRadius"] || 25) + 'px'
}
}
},
onLoad() {
......@@ -404,7 +426,7 @@ export default {
line-height: 20px;
font-size: 18px;
font-family: MicrosoftYaHei;
font-weight: 400;
font-weight: 600;
color: #191919;
}
.tips {
......@@ -415,11 +437,7 @@ export default {
.orderPrice {
text-align: center;
margin: 10px;
font-size: 14px;
span {
font-size: 18px;
color: #666;
}
font-weight: 500;
}
.price {
width: 116px;
......@@ -447,14 +465,13 @@ export default {
}
.bottom {
margin-top: 10px;
justify-content: space-between;
justify-content: center;
gap: 20px;
/deep/.van-button {
width: 140px;
height: 35px;
color: #929292;
line-height: 35px;
border-radius: 4px;
border: 1px solid rgba(146, 146, 146, 1);
height: auto;
line-height: normal;
padding: 6px 24px;
border: 1px solid;
}
.toShare {
background: var(--main-color);
......
<template>
<div v-if="isShowIntegral || isShowGifts" :style="{ 'padding-top': paddingTop, 'padding-bottom': paddingBottom }">
<div class="title">恭喜你获得</div>
<div class="pay-with-gifts__wrapper">
<template v-if="isShowGifts">
<!-- 推广类型: (0: 送优惠券 1: 抽奖大转盘 2: 优惠码) -->
......@@ -152,6 +153,13 @@
</script>
<style lang="scss" scoped>
.title {
color: #666;
font-size: 13px;
padding: 8px;
text-align: center;
}
.pay-with-gifts__wrapper {
padding: 0 12px;
......
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