<!--
  银行编码code 

  @author terrfly
  @site https://www.jeequan.com
  @date 2022/03/01 14:57
-->

<template>
  <a-select
    show-search
    :value="props.value"
    placeholder="选择开户银行"
    :disabled="props.readonly"
    @change="changeFunc"
  >
    <a-select-option v-for="(item) in allList" :key="item.bank_alias" :value="item.bank_alias">
      {{ item.bank_alias }}
    </a-select-option>
  </a-select>
</template>
<script lang="ts" setup>
import { defineProps, computed} from 'vue'
import personalList from './bankCodeSftPersonal.json'
import corporateList from './bankCodeSftCorporate.json'

const props = defineProps({
    value: { type: Array, default: null },
    settAccountType: { type: String, default: null },
    readonly: { type: Boolean, default: false }
})

// 计算属性 
let allList = computed(() => {
  return props.settAccountType == 'B' ? corporateList : personalList
}) as any

// emit 父组件使用： v-model="val" 进行双向绑定。
const emit = defineEmits(['update:value', 'change'])

// 当属性发生了变化， 需要通过函数向父组件通信 --》 父组件再通知子组件进行数据的变化。 
function changeFunc(value){
  const bankInfo = allList.value.find(item => item.bank_alias == value) || {} as any
  emit('update:value', bankInfo.bank_alias)
  emit('change', bankInfo)
}

</script>

