crm-app-vue3/components/bank-icon/bank-icon.vue

<template>
	<image :src="src" mode="" class="bank_icon" :style="{width : size , height : size}"></image>
</template>

<script>
	export default {
		props : {
			bankName : {
				type : String | undefined | null,
				required : true,
			},
			size : {
				type : String,
				required : false,
				default : ()=> "28rpx"
			},
			type : {
				type : String,
				required : false,
				default : ()=> "bankName"
			},
		},
		computed : {
			src(){
				const bankIconList = this.type === "bankName" ? this.bankNameIconList : this.bankSystemIconList;
				const bank = bankIconList.find(v=>{
					return this.bankName ? this.bankName.includes(v.name) : false;
				});
				return bank ? bank.src : "";
			},
		},
		data(){
			return {
				bankNameIconList : [
					{ name : "建设", src : "../../static/outbound/icon-ccb.png" },
					{ name : "浦发", src : "../../static/outbound/icon-spdb.png" },
					{ name : "农业", src : "../../static/outbound/icon-abc.png" },
				],
				bankSystemIconList : [
					// { name : "建行", src : "../../static/outbound/icon-ccb.png" },
					// { name : "浦发", src : "../../static/outbound/icon-spdb.png" },
					// { name : "农行", src : "../../static/outbound/icon-abc.png" },
					{ name : "建行", src : "../../static/outbound/icon-zycs.png" },
					{ name : "浦发", src : "../../static/outbound/icon-zycs.png" },
					{ name : "农行", src : "../../static/outbound/icon-zycs.png" },
					{ name : "专业", src : "../../static/outbound/icon-zycs.png" },
					{ name : "商账催收", src : "../../static/outbound/icon-zycs.png" },
					{ name : "兴业催收", src : "../../static/outbound/icon-zycs.png" },
					{ name : "工行催收", src : "../../static/outbound/icon-zycs.png" },
					{ name : "调催系统", src : "../../static/outbound/icon-zycs.png" },
				],
			}
		}
	}
</script>

<style>
</style>