<template>
  <view class="component-bank-card-box">
    <view class="bank-info">
      <view class="bank-name-number">
        <view class="name">
          {{ item.bankName }}
        </view>
        <view class="credit-card-numbers">
          **** {{ item.bankCardNo.slice(-4) }}
        </view>
      </view>
      <view class="bank-type">
        {{ item.cardTypeString }}
      </view>
    </view>
  </view>
</template>

<script setup>
defineProps({
  item: {
    default: () => (
      {
        bankName: '',
        bankType: '',
        cardId: ''
      }
    ),
    type: Object
  }
})
</script>

<style lang="scss" scoped>
@use "./index.scss";
</style>
