From 9585ac4035847fe6eee8381cff8ca4d92307ef87 Mon Sep 17 00:00:00 2001
From: woody <woody@163>
Date: Thu, 4 Sep 2025 14:20:15 +0800
Subject: [PATCH] =?UTF-8?q?feat(bindBank):=20=E7=BB=91=E5=AE=9A=E9=93=B6?=
 =?UTF-8?q?=E8=A1=8C=E5=8D=A1=E9=80=BB=E8=BE=91=E8=BF=81=E7=A7=BB?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 config/balance.js                 |   6 -
 pages/mine/balance/withdrawal.vue |  51 ++-
 pages/mine/bindBank/bindBank.vue  | 649 ++++++++++++++++++------------
 pages/mine/bindBank/index.vue     | 448 +++++++++++----------
 4 files changed, 672 insertions(+), 482 deletions(-)

diff --git a/config/balance.js b/config/balance.js
index 5730f60..605a339 100644
--- a/config/balance.js
+++ b/config/balance.js
@@ -18,12 +18,6 @@ export const getDefaultBank = params =>
     params,
   })
 
-//校验是否绑定银行卡
-export const checkIsbindBank = params =>
-  http.get('/member/api/bank/is-bind', {
-    params,
-  })
-
 //提现页面展示
 export const getWidthdrawShow = params =>
   http.get('/member/api/withdraw/show/add', {
diff --git a/pages/mine/balance/withdrawal.vue b/pages/mine/balance/withdrawal.vue
index 500d827..c784a59 100644
--- a/pages/mine/balance/withdrawal.vue
+++ b/pages/mine/balance/withdrawal.vue
@@ -7,7 +7,7 @@
         :rules="rules"
         ref="uForm"
       >
-        <!-- <u-form-item
+        <u-form-item
           label-width="200rpx"
           :label="'银行卡号'"
           prop="cardNumber"
@@ -24,7 +24,7 @@
           <view v-else style="color: red" @click="goBindbank">
             {{ '请先绑定银行卡' }}
           </view>
-        </u-form-item> -->
+        </u-form-item>
         <u-form-item
           label-width="200rpx"
           :label="`${'提现金额'}(${isLocaled()})`"
@@ -134,7 +134,16 @@
       <u-button class="subbtn" @click="submit">{{ '提现' }}</u-button>
     </view>
     <u-toast ref="uToast"></u-toast>
-
+    <u-modal
+      :show="unBindDefaultModal"
+      showCancelButton
+      @cancel="unBindDefaultModal = false"
+      cancelText="取消"
+      confirmText="确定"
+      @confirm="unBindDefaultConfirm"
+    >
+      请先绑定默认银行卡
+    </u-modal>
     <!-- 提现引导弹窗 -->
     <!-- <WithdrawalGuide
       :show="showWithdrawalGuide"
@@ -193,8 +202,9 @@ export default {
       bankData: {},
       widthDrwaData: {},
       ifeye: false,
-      canbind: false,
+      canbind: true,
       showWithdrawalGuide: false,
+      unBindDefaultModal: false,
     }
   },
   watch: {
@@ -205,7 +215,7 @@ export default {
       url: '/pages/mine/balance/withdrawlDetail',
     })
   },
-  onLoad() {
+  onShow() {
     this.getList()
   },
   methods: {
@@ -233,18 +243,20 @@ export default {
           }
         })
       bal.getDefaultBank().then(res => {
-        this.bankData = res.data
-        this.dataForm.pkBank = res.data.pkId
-      })
-      //校验是否绑定银行卡
-      bal.checkIsbindBank().then(res => {
-        if (res.flag == 'Y') {
-          this.canbind = false
-        } else if (res.flag == 'N') {
-          this.canbind = true
+        if (res.data && Object.keys(res.data).length > 0) {
+          this.bankData = res.data
+          this.dataForm.pkBank = res.data.pkId
+        } else {
+          this.unBindDefaultModal = true
         }
       })
     },
+    unBindDefaultConfirm() {
+      this.unBindDefaultModal = false
+      uni.navigateTo({
+        url: '/pages/mine/bindBank/index',
+      })
+    },
     submit() {
       this.$refs.uForm
         .validate()
@@ -252,13 +264,17 @@ export default {
           bal.addWithdraw(this.dataForm).then(res => {
             if (res.code == 200) {
               this.$refs.uToast.show({
-                message: res.msg,
+                message: res.msg || '提现成功',
                 type: 'success',
               })
-              // 显示提现引导弹窗
               setTimeout(() => {
                 uni.navigateBack()
-              }, 300)
+              }, 500)
+
+              // 显示提现引导弹窗
+              // setTimeout(() => {
+              //   this.showWithdrawalGuide = true
+              // }, 300)
             }
           })
         })
@@ -292,6 +308,7 @@ export default {
     // 处理提现引导弹窗确认
     onWithdrawalGuideConfirm() {
       this.showWithdrawalGuide = false
+      uni.navigateBack()
     },
   },
 }
diff --git a/pages/mine/bindBank/bindBank.vue b/pages/mine/bindBank/bindBank.vue
index e3eb8e7..607f799 100644
--- a/pages/mine/bindBank/bindBank.vue
+++ b/pages/mine/bindBank/bindBank.vue
@@ -1,273 +1,412 @@
 <template>
-	<view class="content">
-		<view class="theform">
-			<u--form labelPosition="left" :model="dataForm" :rules="rules" ref="uForm">
-				<u-form-item label-width="200rpx" :label="'银行卡号'" borderBottom prop="cardNumber" ref="item1">
-					<u--input v-model="dataForm.cardNumber" disabledColor="#F5F5F5;" border="none"></u--input>
-				</u-form-item>
-				<u-form-item borderBottom label-width="200rpx" :label="'银行名称'" prop="bankName"
-					@click="showAmount = true; " ref="item1">
-					<u--input v-model="dataForm.bankName" disabledColor="#ffffff" :placeholder="'请选择'"
-						border="none"></u--input>
-					<u-icon slot="right" name="arrow-right"></u-icon>
-				</u-form-item>
+  <view class="content">
+    <view class="theform">
+      <u--form
+        labelPosition="left"
+        :model="dataForm"
+        :rules="rules"
+        ref="uForm"
+      >
+        <u-form-item
+          borderBottom
+          required
+          label-width="200rpx"
+          :label="'银行名称'"
+          prop="bankName"
+          @click="showAmount = true"
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.bankName"
+            disabledColor="#ffffff"
+            :placeholder="'请选择'"
+            border="none"
+          ></u--input>
+          <u-icon slot="right" name="arrow-right"></u-icon>
+        </u-form-item>
 
+        <u-form-item
+          label-width="200rpx"
+          :label="'开户支行'"
+          required
+          prop="subBankName"
+          borderBottom
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.subBankName"
+            disabledColor="#F5F5F5;"
+            border="none"
+          ></u--input>
+        </u-form-item>
+        <u-form-item
+          label-width="200rpx"
+          :label="'银行卡号'"
+          required
+          borderBottom
+          prop="cardNumber"
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.cardNumber"
+            disabledColor="#F5F5F5;"
+            border="none"
+          ></u--input>
+        </u-form-item>
+        <u-form-item
+          label-width="200rpx"
+          label="开户姓名"
+          required
+          prop="accountName"
+          borderBottom
+          ref="item1"
+        >
+          <u--input
+            :placeholder="'请输入'"
+            v-model="dataForm.accountName"
+            border="none"
+          ></u--input>
+        </u-form-item>
+        <u-form-item
+          label-width="200rpx"
+          :label="'证件号码'"
+          required
+          prop="idCard"
+          borderBottom
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.idCard"
+            :placeholder="'请输入'"
+            disabledColor="#F5F5F5;"
+            border="none"
+          ></u--input>
+        </u-form-item>
+        <u-form-item
+          label-width="200rpx"
+          :label="'联系方式'"
+          prop="phone"
+          required
+          borderBottom
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.phone"
+            :placeholder="'请输入'"
+            maxlength="20"
+            border="none"
+          ></u--input>
+        </u-form-item>
+        <u-form-item
+          v-if="userInfo.pkCountry == 1 && cancode"
+          label-width="200rpx"
+          :label="'验证码'"
+          required
+          prop="verificationCode"
+          borderBottom
+          ref="item1"
+        >
+          <u--input
+            v-model="dataForm.verificationCode"
+            :placeholder="'请输入'"
+            border="none"
+          ></u--input>
+          <u-button
+            @tap="getCode"
+            class="getcodes"
+            type="primary"
+            shape="circle"
+            :text="tips"
+            color="#2FBC42"
+          ></u-button>
+        </u-form-item>
 
-				<u-form-item label-width="200rpx" :label="'开户支行'" prop="subBankName" borderBottom ref="item1">
-					<u--input v-model="dataForm.subBankName" disabledColor="#F5F5F5;" border="none"></u--input>
-				</u-form-item>
-				<u-form-item label-width="200rpx" :label="'真实姓名'" prop="accountName" borderBottom ref="item1">
-					<u--input :placeholder="'请输入'" v-model="dataForm.accountName" border="none"></u--input>
-				</u-form-item>
-				<u-form-item label-width="200rpx" :label="'证件号码'" prop="idCard" borderBottom ref="item1">
-					<u--input v-model="dataForm.idCard" :placeholder="'请输入'" disabledColor="#F5F5F5;"
-						border="none"></u--input>
-				</u-form-item>
-				<u-form-item label-width="200rpx" :label="'联系方式'" prop="phone" borderBottom ref="item1">
-					<u--input  v-model="dataForm.phone" :placeholder="'请输入'" maxlength="20" border="none"></u--input>
-				</u-form-item>
-				<u-form-item v-if="userInfo.pkCountry==1&&cancode" label-width="200rpx" :label="'验证码'"
-					prop="verificationCode" borderBottom ref="item1">
-					<u--input v-model="dataForm.verificationCode" :placeholder="'请输入'" border="none"></u--input>
-					<u-button @tap='getCode' class="getcodes" type="primary" shape="circle" :text="tips"
-						color="#2FBC42"></u-button>
-				</u-form-item>
-
-				<u-code :seconds="seconds" @end="end" @start="start" ref="uCode" @change="codeChange"></u-code>
-				<u-picker @cancel='showAmount=false' :show="showAmount" ref="uPicker" :columns="bankCardChioceList"
-					@confirm="confirm" keyName='bankName'></u-picker>
-			</u--form>
-
-		</view>
-		<view class="btnbox">
-			<u-button class="subbtn" @click="submit">{{'确定'}}</u-button>
-		</view>
-		<u-toast ref="uToast"></u-toast>
-	</view>
+        <u-code
+          :seconds="seconds"
+          @end="end"
+          @start="start"
+          ref="uCode"
+          @change="codeChange"
+        ></u-code>
+        <u-picker
+          @cancel="showAmount = false"
+          :show="showAmount"
+          ref="uPicker"
+          :columns="bankCardChioceList"
+          @confirm="confirm"
+          keyName="bankName"
+        ></u-picker>
+      </u--form>
+    </view>
+    <view class="tip-wrapper">
+      <view class="tip-content">
+        <view class="tip-text"
+          >银行卡号、真实姓名、证件号码、联系方式，请与银行预留信息保持一致</view
+        >
+      </view>
+    </view>
+    <view class="btnbox">
+      <u-button class="subbtn" @click="submit">{{ '确定' }}</u-button>
+    </view>
+    <u-toast ref="uToast"></u-toast>
+  </view>
 </template>
 
 <script>
-	import * as ban from "@/config/balance.js"
-	export default {
-		data() {
-			return {
-				showAmount: false,
-				dataForm: {
-					bankName: "",
-					cardNumber: "",
-					pkBank: "",
-					subBankName: "",
-					accountName: "",
-					idCard: "",
+import * as ban from '@/config/balance.js'
+export default {
+  data() {
+    return {
+      showAmount: false,
+      dataForm: {
+        bankName: '',
+        cardNumber: '',
+        pkBank: '',
+        subBankName: '',
+        accountName: '',
+        idCard: '',
+      },
+      bankCardChioceList: [],
+      rules: {
+        cardNumber: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        subBankName: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        accountName: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        idCard: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        phone: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        verificationCode: [
+          {
+            type: 'string',
+            required: true,
+            message: '请输入',
+            trigger: ['blur', 'change'],
+          },
+        ],
+        bankName: [
+          {
+            required: true,
+            message: '请选择',
+            trigger: ['change'],
+          },
+        ],
+      },
+      tips: '',
+      // refCode: null,
+      seconds: 60,
+      ifpass: false,
+      userInfo: {},
+      cancode: true, //判断是否是白名单
+    }
+  },
+  onLoad() {
+    this.userInfo = uni.getStorageSync('User')
+    this.getList()
+  },
+  methods: {
+    codeChange(text) {
+      this.tips = text
+    },
+    getCode() {
+      if (this.dataForm.phone && this.$u.test.mobile(this.dataForm.phone)) {
+        if (this.$refs.uCode.canGetCode) {
+          // 模拟向后端请求验证码
+          uni.showLoading({
+            title: '正在获取验证码',
+          })
+          ban
+            .getVerification({
+              phone: this.dataForm.phone,
+            })
+            .then(res => {
+              uni.hideLoading()
+              // 这里此提示会被this.start()方法中的提示覆盖
+              uni.$u.toast('验证码已发送')
+              // 通知验证码组件内部开始倒计时
+              this.$refs.uCode.start()
+            })
+        } else {
+          uni.$u.toast('倒计时结束后再发送')
+        }
+      } else {
+        uni.$u.toast(
+          this.dataForm.phone ? '手机号格式不正确' : '请先输入手机号'
+        )
+        return
+      }
+    },
+    end() {
+      // uni.$u.toast('倒计时结束');
+    },
+    start() {
+      // uni.$u.toast('倒计时开始');
+    },
+    getList() {
+      ban.getBankCardChoiceList().then(res => {
+        this.bankCardChioceList = [res.data]
+      })
+    },
+    bindBank() {
+      if (!this.ifpass && this.cancode && this.userInfo.pkCountry == 1) {
+        uni.$u.toast('验证码错误')
+        return
+      }
+      ban.bindWalletBankAdd(this.dataForm).then(res => {
+        if (res.code == 200) {
+          uni.$u.toast(res.msg)
+          setTimeout(() => {
+            uni.navigateBack()
+          }, 1000)
+        }
+      })
+    },
+    submit() {
+      this.$refs.uForm
+        .validate()
+        .then(res => {
+          // 没有三方接口 临机写死
+          this.ifpass = true
 
-				},
-				bankCardChioceList: [],
-				rules: {
-					cardNumber: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					subBankName: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					accountName: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					idCard: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					phone: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					verificationCode: [{
-						type: 'string',
-						required: true,
-						message: '请输入',
-						trigger: ['blur', 'change']
-					}],
-					bankName: [{
-						required: true,
-						message: '请选择',
-						trigger: ['change']
-					}],
-				},
-				tips: '',
-				// refCode: null,
-				seconds: 60,
-				ifpass: false,
-				userInfo: {},
-				cancode: true, //判断是否是白名单
-
-			}
-		},
-		onLoad() {
-			this.userInfo = uni.getStorageSync('User')
-			this.getList()
-			this.checkIfWhite();
-
-		},
-		methods: {
-			checkIfWhite() {
-				ban.checkIfWhite().then((res) => {
-					if (res.code == 200 && res.flag == "N") {
-						this.cancode = true;
-					} else if (res.code == 200 && res.flag == "Y") {
-						this.cancode = false;
-					}
-				});
-			},
-			codeChange(text) {
-				this.tips = text;
-			},
-			getCode() {
-				if (this.dataForm.phone && this.$u.test.mobile(this.dataForm.phone)) {
-					if (this.$refs.uCode.canGetCode) {
-						// 模拟向后端请求验证码
-						uni.showLoading({
-							title: '正在获取验证码'
-						})
-						ban.getVerification({
-							phone: this.dataForm.phone
-						}).then((res) => {
-							uni.hideLoading();
-							// 这里此提示会被this.start()方法中的提示覆盖
-							uni.$u.toast('验证码已发送');
-							// 通知验证码组件内部开始倒计时
-							this.$refs.uCode.start();
-						})
-					} else {
-						uni.$u.toast('倒计时结束后再发送');
-					}
-				} else {
-					uni.$u.toast(this.dataForm.phone ? '手机号格式不正确' : '请先输入手机号')
-					return
-				}
-			},
-			end() {
-				// uni.$u.toast('倒计时结束');
-			},
-			start() {
-				// uni.$u.toast('倒计时开始');
-			},
-			getList() {
-				ban.getBankCardChoiceList().then(res => {
-					this.bankCardChioceList = [res.data]
-				})
-
-			},
-			bindBank() {
-				if (!this.ifpass &&this.cancode &&this.userInfo.pkCountry == 1) {
-					uni.$u.toast('验证码错误')
-					return
-				}
-				ban.bindWalletBankAdd(this.dataForm).then(res => {
-					if (res.code == 200) {
-						uni.$u.toast(res.msg)
-						setTimeout(() => {
-							uni.navigateBack()
-						}, 1000)
-					}
-				})
-
-			},
-			submit() {
-				this.$refs.uForm.validate().then(res => {
-					// 没有三方接口 临机写死
-					this.ifpass = true;
-					this.bindBank();
-
-					return
-					if (this.userInfo.pkCountry == 1) {
-						if(this.cancode){
-							ban.verifyBankCard(this.dataForm).then((res) => {
-									if (res.code == 200) {
-										this.ifpass = true;
-										this.bindBank();
-									} else {
-										this.ifpass = false;
-										uni.$u.toast(res.msg)
-									}
-								})
-								.catch((err) => {
-									this.ifpass = false;
-								});
-						}else{
-							this.ifpass = true;
-							this.bindBank();
-						}
-					} else {
-						this.bindBank()
-					}
-
-				}).catch(errors => {
-					uni.$u.toast('校验失败')
-					return false
-				})
-			},
-			confirm(e) {
-				this.dataForm.bankName = e.value[0].bankName
-				this.dataForm.pkBank = e.value[0].pkId
-				this.showAmount = false
-			},
-
-		}
-	}
+          if (this.userInfo.pkCountry == 1) {
+            if (this.cancode) {
+              ban
+                .verifyBankCard(this.dataForm)
+                .then(res => {
+                  if (res.code == 200) {
+                    this.ifpass = true
+                    this.bindBank()
+                  } else {
+                    this.ifpass = false
+                    uni.$u.toast(res.msg)
+                  }
+                })
+                .catch(err => {
+                  this.ifpass = false
+                })
+            } else {
+              this.ifpass = true
+              this.bindBank()
+            }
+          } else {
+            this.bindBank()
+          }
+        })
+        .catch(errors => {
+          uni.$u.toast('校验失败')
+          return false
+        })
+    },
+    confirm(e) {
+      this.dataForm.bankName = e.value[0].bankName
+      this.dataForm.pkBank = e.value[0].pkId
+      this.showAmount = false
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>
-	.content {
-		background: #F2F2F2;
+.content {
+  background: #f2f2f2;
 
-		.theform {
-			margin-top: 6rpx;
-			background: #FFFFFF;
-			padding: 20rpx 23rpx 0rpx 23rpx;
+  .theform {
+    margin-top: 6rpx;
+    background: #ffffff;
+    padding: 20rpx 23rpx 0rpx 23rpx;
 
-			.contentye {
-				font-size: 28rpx;
-				margin-left: 200rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-			}
+    .contentye {
+      font-size: 28rpx;
+      margin-left: 200rpx;
+      font-family: Source Han Sans CN;
+      font-weight: 400;
+    }
+  }
 
-		}
+  .btnbox {
+    margin-top: 38rpx;
+    padding: 0 20rpx;
 
-		.btnbox {
-			margin-top: 38rpx;
-			padding: 0 20rpx;
+    .subbtn {
+      background: #005bac;
+      border-radius: 46rpx;
+      font-size: 30rpx;
+      font-family: Source Han Sans CN;
+      font-weight: 400;
+      color: #ffffff;
+    }
+  }
 
-			.subbtn {
-				background: #005BAC;
-				border-radius: 46rpx;
-				font-size: 30rpx;
-				font-family: Source Han Sans CN;
-				font-weight: 400;
-				color: #FFFFFF;
-			}
-		}
+  .getcodes {
+    width: 197rpx;
+    height: 76rpx;
+    background: #2fbc42;
+    border-radius: 38rpx;
+    color: #fff;
+  }
 
-		.getcodes {
-			width: 197rpx;
-			height: 76rpx;
-			background: #2FBC42;
-			border-radius: 38rpx;
-			color: #fff;
-		}
+  .tip-wrapper {
+    margin: 20rpx 20rpx 0 20rpx;
 
+    .tip-content {
+      display: flex;
+      align-items: flex-start;
+      background: linear-gradient(135deg, #fff3e0 0%, #fff8f0 100%);
+      border: 2rpx solid #ffb74d;
+      border-radius: 16rpx;
+      padding: 20rpx 24rpx;
+      box-shadow: 0 4rpx 12rpx rgba(255, 183, 77, 0.1);
 
-	}
-</style>
\ No newline at end of file
+      .tip-icon {
+        color: #ff9800;
+        font-size: 28rpx;
+        font-weight: bold;
+        margin-right: 16rpx;
+        margin-top: 2rpx;
+        flex-shrink: 0;
+      }
+
+      .tip-text {
+        flex: 1;
+        font-size: 24rpx;
+        line-height: 36rpx;
+        color: #e65100;
+        font-weight: 500;
+        letter-spacing: 0.5rpx;
+      }
+    }
+  }
+}
+</style>
diff --git a/pages/mine/bindBank/index.vue b/pages/mine/bindBank/index.vue
index 762bb3d..975470c 100644
--- a/pages/mine/bindBank/index.vue
+++ b/pages/mine/bindBank/index.vue
@@ -1,225 +1,265 @@
 <template>
-	<view class="content">
-		<view class="tablebox" v-if="tableData.length > 0">
-			<view class="card" v-for="(item, index) in tableData"
-				:style="{ backgroundImage: 'url(' + item.backgroundImg + ')'}" :key="index">
-				<view class="cardtopflex">
-					<view class="cardtopflex2">
-						<view class="imgbox"><img :src="item.logo" alt="" /></view>
-						<view class="titlebox">
-							<view class="cardtitle">{{item.bankName}}</view>
-							<view class="cardtitle2">{{'储蓄卡'}}</view>
-						</view>
-					</view>
-					<view class="flexs_1" v-if="item.defaultCard==1">
-						<view class="qiu"></view>
-						<view v-if="userInfo.pkCountry == 1">{{'默认'}}</view>
-						<view v-else style="color: #000;font-weight: bold;" class="cardfooter">{{'默认'}}</view>
-					</view>
-					<view class="flexs_1" v-else>
+  <view class="content">
+    <view class="tablebox" v-if="tableData.length > 0">
+      <view
+        class="card"
+        v-for="(item, index) in tableData"
+        :style="{ backgroundImage: 'url(' + item.backgroundImg + ')' }"
+        :key="index"
+      >
+        <view class="cardtopflex">
+          <view class="cardtopflex2">
+            <view class="imgbox"><img :src="item.logo" alt="" /></view>
+            <view class="titlebox">
+              <view class="cardtitle">{{ item.bankName }}</view>
+              <view class="cardtitle2">{{ '储蓄卡' }}</view>
+            </view>
+          </view>
+          <view class="flexs_1" v-if="item.defaultCard == 1">
+            <view class="qiu"></view>
+            <view v-if="userInfo.pkCountry == 1">{{ '默认' }}</view>
+            <view
+              v-else
+              style="color: #000; font-weight: bold"
+              class="cardfooter"
+              >{{ '默认' }}</view
+            >
+          </view>
+          <view class="flexs_1" v-else>
+            <view
+              style="color: #fff; font-weight: bold; cursor: pointer"
+              @click="setDefault(item.pkId)"
+              class="cardfooter"
+              >{{ '设为默认' }}</view
+            >
+          </view>
+        </view>
+        <view class="cardNumber">{{ item.cardNumber }}</view>
+        <view
+          v-if="userInfo.pkCountry == 1"
+          class="cardfooter"
+          @click="removeBind(item)"
+        >
+          [{{ '解绑' }}]</view
+        >
+        <view
+          v-else
+          style="color: #000; font-weight: bold"
+          class="cardfooter"
+          @click="removeBind(item)"
+        >
+          [{{ '解绑' }}]</view
+        >
+      </view>
+    </view>
+    <u-modal
+      :showCancelButton="true"
+      @cancel="modalShow = false"
+      :content="'是否确认解绑银行卡'"
+      :show="modalShow"
+      @confirm="confirmRemove"
+      ref="uModal"
+      :asyncClose="true"
+    ></u-modal>
+    <view class="footerbtn" @click="goAdd"> +{{ '添加银行卡' }} </view>
 
-						<view style="color: #fff; font-weight: bold; cursor: pointer" @click="setDefault(item.pkId)"
-							class="cardfooter">{{'设为默认'}}</view>
-					</view>
-				</view>
-				<view class="cardNumber">{{ item.cardNumber }}</view>
-				<view v-if="userInfo.pkCountry == 1" class="cardfooter" @click="removeBind(item)">
-					[{{'解绑'}}]</view>
-				<view v-else style="color: #000;font-weight: bold;" class="cardfooter" @click="removeBind(item)">
-					[{{'解绑'}}]</view>
-			</view>
-		</view>
-		<u-modal :showCancelButton="true" @cancel="modalShow=false" :content="'是否确认解绑银行卡'" :show="modalShow"
-			@confirm="confirmRemove" ref="uModal" :asyncClose="true"></u-modal>
-		<view class="footerbtn" @click="goAdd">
-			+{{'添加银行卡'}}
-		</view>
-
-		<u-modal :showCancelButton="true" @cancel="modalShow2=false" content="当前解绑为默银行卡，请设置为另一张卡为默认银行卡"
-			:show="modalShow2" @confirm="confirmRemove2" ref="uModal" :asyncClose="true"></u-modal>
-		<!-- <el-button class="footerbtn" @click="bindBank(true)">{{'绑定银行卡'}}</el-button> -->
-	</view>
+    <u-modal
+      :showCancelButton="true"
+      @cancel="modalShow2 = false"
+      content="当前解绑为默银行卡，请设置为另一张卡为默认银行卡"
+      :show="modalShow2"
+      @confirm="confirmRemove2"
+      ref="uModal"
+      :asyncClose="true"
+    ></u-modal>
+    <!-- <el-button class="footerbtn" @click="bindBank(true)">{{'绑定银行卡'}}</el-button> -->
+  </view>
 </template>
 
 <script>
-	import * as ban from "@/config/balance.js"
-	export default {
-		data() {
-			return {
-				tableData: [],
-				modalShow: false,
-				modalShow2: false,
-				pkId: "",
-				userInfo: {}
-			}
-		},
-		onLoad() {
-			this.userInfo = uni.getStorageSync('User')
-		},
-		onShow() {
-			this.getSearch()
-		},
-		methods: {
-			setDefault(pkId) {
-				ban.updateDefault({
-					pkId: pkId
-				}).then((res) => {
-					if (res.code == 200) {
-						uni.$u.toast(res.msg)
-						this.getSearch();
-					} else {
-						uni.$u.toast(res.msg)
-					}
-				});
-			},
-			goAdd() {
-				uni.navigateTo({
-					url: '/pages/mine/bindBank/bindBank'
-				})
-			},
-			removeBind(item) {
-				this.pkId = item.pkId
-				if (item.defaultCard == 1) {
-					this.modalShow2 = true
-				} else {
-					this.modalShow = true
-				}
-
-			},
-			confirmRemove2() {
-				this.modalShow2 =false
-				this.modalShow = true
-			},
-			//解除绑定
-			confirmRemove() {
-				ban.removeBankBind({
-					pkId: this.pkId
-				}).then((res) => {
-					if (res.code == 200) {
-						uni.$u.toast(res.msg)
-						this.modalShow = false
-						this.getSearch();
-					} else {
-						uni.$u.toast(res.msg)
-						this.modalShow = false
-					}
-				});
-			},
-			//点击绑定银行卡
-			bindBank(val) {
-				// this.isAdd = true;
-				// this.jdTl = val;
-			},
-			getSearch() {
-				ban.getBankList().then((res) => {
-					this.tableData = res.data;
-				});
-			},
-		}
-	}
+import * as ban from '@/config/balance.js'
+export default {
+  data() {
+    return {
+      tableData: [],
+      modalShow: false,
+      modalShow2: false,
+      pkId: '',
+      userInfo: {},
+    }
+  },
+  onLoad() {
+    this.userInfo = uni.getStorageSync('User')
+  },
+  onShow() {
+    this.getSearch()
+  },
+  methods: {
+    setDefault(pkId) {
+      ban
+        .updateDefault({
+          pkId: pkId,
+        })
+        .then(res => {
+          if (res.code == 200) {
+            uni.$u.toast(res.msg)
+            this.getSearch()
+          } else {
+            uni.$u.toast(res.msg)
+          }
+        })
+    },
+    goAdd() {
+      uni.navigateTo({
+        url: '/pages/mine/bindBank/bindBank',
+      })
+    },
+    removeBind(item) {
+      this.pkId = item.pkId
+      if (item.defaultCard == 1) {
+        this.modalShow2 = true
+      } else {
+        this.modalShow = true
+      }
+    },
+    confirmRemove2() {
+      this.modalShow2 = false
+      // this.modalShow = true
+    },
+    //解除绑定
+    confirmRemove() {
+      ban
+        .removeBankBind({
+          pkId: this.pkId,
+        })
+        .then(res => {
+          if (res.code == 200) {
+            uni.$u.toast(res.msg)
+            this.modalShow = false
+            this.getSearch()
+          } else {
+            uni.$u.toast(res.msg)
+            this.modalShow = false
+          }
+        })
+    },
+    //点击绑定银行卡
+    bindBank(val) {
+      // this.isAdd = true;
+      // this.jdTl = val;
+    },
+    getSearch() {
+      ban.getBankList().then(res => {
+        this.tableData = res.data
+      })
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>
-	.content {
-		background-color: #f9f9f9;
-		padding: 22rpx;
+.content {
+  background-color: #f9f9f9;
+  padding: 22rpx;
 
-		.tablebox {
-			display: flex;
-			flex-wrap: wrap;
-			justify-content: space-between;
+  .tablebox {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
 
-			.card {
-				width: 100%;
-				background-color: rgba(170, 45, 42, 0.9);
-				background-size: 100% 100%;
-				border-radius: 20rpx;
-				margin: 20rpx 0;
-				padding: 28rpx 32rpx 40rpx 32rpx;
-				margin-top: 20rpx;
+    .card {
+      width: 100%;
+      background-color: rgba(170, 45, 42, 0.9);
+      background-size: 100% 100%;
+      border-radius: 20rpx;
+      margin: 20rpx 0;
+      padding: 28rpx 32rpx 40rpx 32rpx;
+      margin-top: 20rpx;
 
-				.cardtopflex {
-					display: flex;
-					align-items: center;
-					justify-content: space-between;
+      .cardtopflex {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
 
-					.flexs_1 {
-						display: flex;
-						align-items: center;
-						margin-right: 20rpx;
-						color: #ffffff;
-						font-size: 24rpx;
+        .flexs_1 {
+          display: flex;
+          align-items: center;
+          margin-right: 20rpx;
+          color: #ffffff;
+          font-size: 24rpx;
 
-						.qiu {
-							margin-right: 10rpx;
-							width: 20rpx;
-							height: 20rpx;
-							border-radius: 50%;
-							background: rgb(47, 236, 47);
-						}
-					}
+          .qiu {
+            margin-right: 10rpx;
+            width: 20rpx;
+            height: 20rpx;
+            border-radius: 50%;
+            background: rgb(47, 236, 47);
+          }
+        }
 
-					.cardtopflex2 {
-						.imgbox {
-							margin-right: 20rpx;
+        .cardtopflex2 {
+          .imgbox {
+            margin-right: 20rpx;
 
-							img {
-								width: 68rpx;
-								height: 68rpx;
-							}
-						}
+            img {
+              width: 68rpx;
+              height: 68rpx;
+            }
+          }
 
-						.titlebox {
-							color: #ffffff;
-							text-align: left;
+          .titlebox {
+            color: #ffffff;
+            text-align: left;
 
-							.cardtitle {
-								font-size: 36rpx;
-								font-weight: 600;
-							}
+            .cardtitle {
+              font-size: 36rpx;
+              font-weight: 600;
+            }
 
-							.cardtitle2 {
-								font-size: 20rpx;
-								margin-top: 8rpx;
-								font-weight: 400;
-							}
-						}
-					}
+            .cardtitle2 {
+              font-size: 20rpx;
+              margin-top: 8rpx;
+              font-weight: 400;
+            }
+          }
+        }
+      }
 
-				}
+      .cardNumber {
+        font-size: 32rpx;
+        font-family:
+          PingFang SC-Medium,
+          PingFang SC;
+        font-weight: 600;
+        color: #ffffff;
+        margin-top: 100rpx;
+        margin-left: 36rpx;
+      }
 
-				.cardNumber {
-					font-size: 32rpx;
-					font-family: PingFang SC-Medium, PingFang SC;
-					font-weight: 600;
-					color: #ffffff;
-					margin-top: 100rpx;
-					margin-left: 36rpx;
-				}
+      .cardfooter {
+        text-align: right;
+        font-size: 24rpx;
+        font-family:
+          PingFang SC-Regular,
+          PingFang SC;
+        font-weight: 400;
+        color: #ffffff;
+        margin-top: 24rpx;
+        cursor: pointer;
+      }
+    }
+  }
 
-				.cardfooter {
-					text-align: right;
-					font-size: 24rpx;
-					font-family: PingFang SC-Regular, PingFang SC;
-					font-weight: 400;
-					color: #ffffff;
-					margin-top: 24rpx;
-					cursor: pointer;
-				}
-			}
-		}
-
-		.footerbtn {
-
-			display: flex;
-			align-items: center;
-			padding: 40rpx;
-			background: #ffffff;
-			font-size: 24rpx;
-			font-weight: 600;
-			border-radius: 20rpx;
-			margin-top: 32rpx;
-			width: 100%;
-		}
-	}
-</style>
\ No newline at end of file
+  .footerbtn {
+    display: flex;
+    align-items: center;
+    padding: 40rpx;
+    background: #ffffff;
+    font-size: 24rpx;
+    font-weight: 600;
+    border-radius: 20rpx;
+    margin-top: 32rpx;
+    width: 100%;
+  }
+}
+</style>