银行卡绑定

src/api/profile.js

@@ -12,7 +12,11 @@ export const signIn = () => request({ url: "user/sign_in", method: "post", loadi
 // 提现
 export const withdrawCoin = (params) => request({ url: "index/withdrawCoinApp", method: "get", params, loading: true });
 // 获取银行卡信息
-export const getBankInfo = () => request({ url: "index/get_bank", method: "post", loading: true });
+export const getBankInfo = () => request({ 
+  url: "index/get_bank", 
+  method: "post", 
+  loading: true 
+});
 // 获取ETH信息
 export const getEthInfo = () => request({ url: "index/get_eth_info", method: "get", loading: true });
 // 获取提现记录
@@ -52,4 +56,17 @@ export const getShareccbList = () => request({
   url: 'index/get_shareccb_list',
   method: 'get',
   loading: true
-});
+});
+// 绑定银行卡
+export const setBankInfo = (data) => {
+  const formData = new FormData();
+  Object.keys(data).forEach(key => {
+    formData.append(key, data[key]);
+  });
+  return request({
+    url: 'index/set_bank',
+    method: 'post',
+    data: formData,
+    loading: true
+  });
+};

src/views/BankCard.vue

@@ -26,7 +26,6 @@
             class="form-input"
             placeholder="输入姓名"
             v-model="formData.lastname"
-            :disabled="!!bankInfo.status"
           />
         </div>
 
@@ -37,7 +36,6 @@
             class="form-input"
             placeholder="输入银行名称"
             v-model="formData.banktype"
-            :disabled="!!bankInfo.status"
           />
         </div>
 
@@ -48,7 +46,6 @@
             class="form-input"
             placeholder="输入银行卡开户行"
             v-model="formData.address"
-            :disabled="!!bankInfo.status"
           />
         </div>
 
@@ -58,8 +55,8 @@
             type="text" 
             class="form-input"
             placeholder="输入银行卡号"
-            v-model="formData.banknum"
-            :disabled="!!bankInfo.status"
+            v-model="banknumInput"
+            @input="handleBanknumInput"
           />
         </div>
 
@@ -67,9 +64,8 @@
           <button 
             class="submit-btn"
             @click="handleSubmit"
-            :disabled="!!bankInfo.status"
           >
-            {{ bankInfo.status ? '已绑定' : '立即绑定' }}
+            {{ bankInfo.status ? '修改' : '立即绑定' }}
           </button>
         </div>
       </div>
@@ -78,7 +74,7 @@
 </template>
 
 <script>
-import { getBankInfo } from '@/api/profile';
+import { getBankInfo, setBankInfo } from '@/api/profile';
 import Toast from '@/components/Toast.vue';
 
 export default {
@@ -94,25 +90,34 @@ export default {
         address: '',
         lastname: '',
         banknum: ''
-      }
+      },
+      banknumInput: ''
     }
   },
   created() {
     this.getBankInfo();
   },
   methods: {
+    handleBanknumInput(event) {
+      // Remove any non-digit characters
+      const value = event.target.value.replace(/\D/g, '');
+      this.banknumInput = value;
+      this.formData.banknum = Number(value) || '';
+    },
     async getBankInfo() {
       try {
         const res = await getBankInfo();
         if (res && res.data) {
           this.bankInfo = res.data;
           if (this.bankInfo && this.bankInfo.status) {
+            // 填充表单数据，允许修改
             this.formData = {
               banktype: this.bankInfo.banktype || '',
               address: this.bankInfo.address || '',
               lastname: this.bankInfo.lastname || '',
               banknum: this.bankInfo.banknum || ''
             };
+            this.banknumInput = this.bankInfo.banknum ? String(this.bankInfo.banknum) : '';
           }
         } else {
           this.bankInfo = {
@@ -127,8 +132,6 @@ export default {
       }
     },
     async handleSubmit() {
-      if (this.bankInfo.status) return;
-      
       if (!this.formData.banktype) {
         this.$refs.toast.show('请输入开户银行', 'warning');
         return;
@@ -145,9 +148,27 @@ export default {
         this.$refs.toast.show('请输入银行账号', 'warning');
         return;
       }
-      // TODO: 实现银行卡绑定逻辑
-      this.$refs.toast.show('银行卡绑定成功', 'success');
-      await this.getBankInfo();
+
+      try {
+        // Ensure all values are strings when sending to FormData
+        const submitData = {
+          banktype: this.formData.banktype.trim(),
+          address: this.formData.address.trim(),
+          lastname: this.formData.lastname.trim(),
+          banknum: String(this.formData.banknum).trim()
+        };
+
+        const res = await setBankInfo(submitData);
+        if (res.code === 1) {
+          this.$refs.toast.show(this.bankInfo.status ? '修改成功' : '绑定成功', 'success');
+          await this.getBankInfo();
+        } else {
+          this.$refs.toast.show(res.msg || '操作失败，请重试', 'error');
+        }
+      } catch (error) {
+        console.error('操作失败:', error);
+        this.$refs.toast.show('操作失败，请重试', 'error');
+      }
     }
   }
 }
@@ -228,6 +249,8 @@ export default {
   font-weight: bold;
   color: #333;
   margin-bottom: 8px;
+  
+  
 }
 
 .form-input {
@@ -262,6 +285,7 @@ export default {
   color: #fff;
   font-size: 16px;
   font-weight: 500;
+  margin-top: 10px;
   cursor: pointer;
 }
 

src/views/Mention.vue

@@ -43,9 +43,15 @@
       <div class="form-item">
         <div class="label">提现至</div>
         <div class="form-content">
-          <div class="bank-detail">
-            <div class="bank-name">中国银行...</div>
-            <div class="bank-number">(6217...)</div>
+          <div class="bank-detail" @click="handleBankClick">
+            <template v-if="bankInfo && bankInfo.status">
+              <div class="bank-name">{{ bankInfo.banktype }}</div>
+              <div class="bank-number">{{ formatBankNumber(bankInfo.banknum) }}</div>
+            </template>
+            <template v-else>
+              <div class="bank-name no-bank">未绑定银行卡</div>
+              <div class="bank-number">点击绑定银行卡</div>
+            </template>
           </div>
         </div>
       </div>
@@ -107,13 +113,14 @@
 
 <script>
 import { getUserInfo } from '@/api/home';
-import { withdrawCoin } from '@/api/profile';
+import { withdrawCoin, getBankInfo } from '@/api/profile';
 
 export default {
   name: 'Mention',
   data() {
     return {
       userInfo: {},
+      bankInfo: null,
       amount: '',
       password: '',
       showPassword: false,
@@ -164,6 +171,7 @@ export default {
   created() {
     this.type = this.$route.query.type || '';
     this.getUserInfo();
+    this.getBankInfo();
   },
   methods: {
     async getUserInfo() {
@@ -174,6 +182,26 @@ export default {
         console.error('获取用户信息失败:', error);
       }
     },
+    async getBankInfo() {
+      try {
+        const res = await getBankInfo();
+        if (res.code === 1 && res.data) {
+          this.bankInfo = res.data;
+        }
+      } catch (error) {
+        console.error('获取银行卡信息失败:', error);
+      }
+    },
+    formatBankNumber(number) {
+      if (!number) return '';
+      const str = String(number);
+      return `(${str.slice(0, 4)}****${str.slice(-4)})`;
+    },
+    handleBankClick() {
+      if (!this.bankInfo || !this.bankInfo.status) {
+        this.$router.push('/bank-card');
+      }
+    },
     setMaxAmount() {
       this.amount = this.availableBalance;
     },
@@ -185,6 +213,12 @@ export default {
       this.showTipsDialog = true;
     },
     async handleWithdraw() {
+      // 检查是否绑定银行卡
+      if (!this.bankInfo || !this.bankInfo.status) {
+        this.showTips('请先绑定银行卡');
+        return;
+      }
+
       // 检查实名认证
       // if (this.userInfo.if_real === 0) {
       //   this.showAuthDialog = true;
@@ -362,14 +396,27 @@ export default {
 }
 
 .bank-detail {
-  padding: 5px 0;
+  padding: 12px 0;
   border-bottom: 1px solid #eee;
+  cursor: pointer;
+}
+
+.bank-name {
+  font-size: 16px;
+  color: #333;
+  line-height: 1.5;
+  font-weight: 500;
 }
 
-.bank-name, .bank-number {
+.bank-number {
   font-size: 14px;
   color: #666;
   line-height: 1.5;
+  margin-top: 4px;
+}
+
+.no-bank {
+  color: #FF6B6B;
 }
 
 .submit-btn {