<template>
  <div class="order-footer-wrapper">
    <div class="btn1">
      <span>待支付：<span class="red">￥{{amount}}</span></span>
    </div>
    <YohoButton class="btn2" txt="去支付" @click="onClick"></YohoButton>
  </div>
</template>

<script>

export default {
  name: 'BuyerOrderFooter',
  props: ['amount'],
  methods: {
    onClick() {
      this.$createOrderPayType().show();
    }
  }
};
</script>

<style lang="scss" scoped>
.order-footer-wrapper {
  width: 100%;
  border-top: 1px solid #eee;
  height: 120px;
  display: flex;
}

.btn1 {
  flex: 1;
  font-size: 24px;
  text-align: center;
  line-height: 120px;
}

.btn2 {
  width: 300px;
  font-size: 36px;
}

.red {
  font-size: 36px;
  color: red;
  font-weight: bolder;
}
</style>