<template>
  <view class="seiminFooterBtn">
    <button :class="btn.type" :type="btn.type" v-for="(btn,i) in btns" :key="i" @click="btn.click">{{btn.name}}</button>
  </view>
</template>

<script>
  export default {
    name: "seiminFooterBtn",
    data() {
      return {};
    },
    props: {
      btns: {
        type: Array,
        default: () => []
      },
    },
    methods: {},
  };
</script>

<style lang="scss" scoped>
  .seiminFooterBtn {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100rpx;
    z-index: 9;
    background-color: #fff;
    padding: 0 25rpx;
    @include border(top);
    @include flex(space-between, center);

    uni-button {
      flex: 1;
      margin-right: 16rpx;
      height: 66rpx;
      font-size: 32rpx;
      @include flex(center, center);

      &::after {
        border: none;
      }

      &:last-of-type {
        margin-right: 0;
      }
    }

    .default {
      background-color: #fff;
      @include border($color:$defaultColor);
      color: $defaultColor;
    }

    .primary {
      @include btn_background;
      color: #fff;
    }
  }
</style>
