39 lines
1020 B
Vue
39 lines
1020 B
Vue
|
<template>
|
|||
|
|
<!-- 底部导航 -->
|
|||
|
|
<view class="display-between-center payment-foot-box">
|
|||
|
|
<!-- 合计 -->
|
|||
|
|
<view class="payment-price">合计：￥{{totalPrice}}</view>
|
|||
|
|
<!-- 立即结算 -->
|
|||
|
|
<view @tap="immediatePaymentEv" class="payment-settlement">立即支付</view>
|
|||
|
|
</view>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
export default {
|
|||
|
|
name:"payment",
|
|||
|
|
props:{
|
|||
|
|
totalPrice:{
|
|||
|
|
type:String,
|
|||
|
|
default: "0.00"
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
|
|||
|
|
};
|
|||
|
|
},
|
|||
|
|
methods:{
|
|||
|
|
immediatePaymentEv(){
|
|||
|
|
this.$emit('immediatePayment');
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style>
|
|||
|
|
.display-between-center {display: flex;justify-content: space-between;align-items: center;}
|
|||
|
|
.payment-foot-box{position: fixed;bottom: 0;left: 0;right: 0;height: 130rpx;background-color: #efefef;font-size: 30rpx;}
|
|||
|
|
.payment-price{font-size: 36rpx;color: #f81c1c;font-weight: bold;margin-left: 60rpx;}
|
|||
|
|
.payment-settlement{width: 242rpx;height: 130rpx;background-color: #f81c1c;color: #FFFFFF;font-size: 36rpx;text-align: center;line-height: 130rpx;}
|
|||
|
|
</style>
|