wxappb2b/GuangZuan/miniprogram/mMine/pages/bank/index.wxml

<view class="topView">
  <!-- 导航栏 -->
  <van-nav-bar custom-style="background-color: #fff">
    <van-icon slot="left" name="arrow-left" size="25px" color="#333" bind:click="backToParent"/>
    <text slot="title" style="color: #333;">添加签约账户</text>
  </van-nav-bar>
</view>

<!-- 内容 -->
<van-cell-group>
  <!-- 开户银行 -->
  <van-field model:value="{{ bankName }}" adjust-position is-link label="开户银行" required clearable placeholder="请选择开户银行" bind:click-input="showBankInfos">
  </van-field>
  <!-- 银行卡号 -->
  <van-field model:value="{{ bankNo }}" adjust-position type="number" label="银行卡号" required clearable placeholder="请输入银行卡号"/>
  <!-- 姓名 -->
  <van-field model:value="{{ accountName }}" adjust-position label="姓名" required clearable placeholder="请输入姓名"/>
  <!-- 支行名称 -->
  <van-field model:value="{{ branchBankName }}" adjust-position label="支行名称" required clearable placeholder="请填写开户支行名称"/>
</van-cell-group>

<!-- 按钮 -->
<view class="button-view">
  <van-button custom-class="submit" id="submit" round color="linear-gradient(to right, #4bb0ff, #6149f6)" block bind:click="onButtonPressed">提交</van-button>
  <van-button wx:if="{{ bankAccountSign }}" custom-class="cancel" id="cancel" round color="linear-gradient(to right, #4bb0ff, #D91D34)" block bind:click="onButtonPressed">解约</van-button>
</view>

<!-- 选择开户行 -->
<van-popup show="{{ showBank }}" position="bottom" custom-style="height: 30%" bind:click-overlay="onCancel">
  <!-- picker --> 
  <van-picker show-toolbar title="请选择开户行" default-index="{{ 1 }}" columns="{{ bankNames }}" bind:cancel="onCancel" bind:confirm="onConfirm"/>
</van-popup>

<!-- toast --> 
<van-toast id="van-toast" />