<template>
	<view>
		<!-- 搜索框 -->
		<unisearchbar v-model="searchValue" class="mart20" @input="getBankList" placeholder="搜索内容" radius="100">
		</unisearchbar>
		<!-- 商户名字 -->
		<view v-if="!taryBankList" class="mart60 fotct font14 fcor666">
			<image mode="widthFix" style="width: 70vw;" src="../../../static/img/noorder.png"></image>
		</view>
		<view class="width100">
			<view class=" mcclist font15 fcor666" v-for="(item,index) in taryBankList" :key="index"
				@click="changebank(item)">
				{{item.branchBankName}}
			</view>
		</view>

	</view>
</template>

<script>
	import {
		getBankList
	} from '../../../Utils/Api.js';
	import unisearchbar from '../../../components/uni-search-bar/components/uni-search-bar/uni-search-bar.vue';
	let app = getApp();
	export default {
		components: {
			unisearchbar
		},
		data() {
			return {
				//列表数据
				taryBankList: [],
				searchValue: ''
			}
		},
		onLoad() {
			if (app.globalData.depositaryBank) {
				this.searchValue = app.globalData.depositaryBank;
			}
			this.getBankList();
		},

		methods: {
			//查询mcc商户
			getBankList() {
				uni.showLoading({
					title: '加载中...'
				})
				let datas = {
					regionId: app.globalData.bankareaCode,
					bankName: this.searchValue
				}
				getBankList(datas).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000') {
						this.taryBankList = res.return_data;
					} else {
						uni.showToast({
							title: res.return_msg,
							duration: 2000,
							icon: 'none'
						})
					}
				});
			},

			//选择某个mcc 并返回
			changebank(item) {
				app.globalData.depositaryBank = item.branchBankName;
				app.globalData.branchBankNo = item.branchBankNo;
				app.globalData.clearNo = item.clearNo;
				uni.navigateBack({})
			}
		}
	}
</script>

<style lang="scss">
	.mcclist {
		width: calc(100% - 50upx);
		height: 100upx;
		display: flex;
		align-items: center;
		background-color: rgba($color: #ffffff, $alpha: 0.1);
		border-bottom: 1px solid #f6f6f6;
		padding: 12upx 25upx;
	}
</style>