添加银行卡

src/main/nine-space/.env.development

@@ -1 +1 @@
-VUE_APP_BASE_URL=https://nfttest.9space.vip
+VUE_APP_BASE_URL=http://localhost:8080

src/main/nine-space/src/views/user/Banks.vue

@@ -2,20 +2,43 @@
     <div class="page">
         <page-bar>我的银行卡</page-bar>
 
-        <div class="add" @click="add">
+        <div class="add" @click="add" v-if="list.length === 0">
             <img src="../../assets/png-tianjia.png" alt="" />
             <span>添加银行卡</span>
         </div>
+
+        <div class="list">
+            <div class="bank-info" v-for="(item, index) in list" :key="index">
+                <div class="info1">
+                    <div class="text1">{{ item.bankName }}</div>
+                    <div class="text2">{{ getNum(item.bankNo) }}</div>
+                </div>
+                <div class="info2">{{ item.cardType }}</div>
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
 export default {
+    data() {
+        return {
+            list: []
+        };
+    },
+    mounted() {
+        this.$http.get('/user/myBankCard').then(res => {
+            this.list = res;
+        });
+    },
     methods: {
         add() {
             this.checkAuth().then(() => {
                 this.$router.push('/mineBanksAdd');
             });
+        },
+        getNum(No) {
+            return '**** ' + No.substr(-4, 4);
         }
     }
 };
@@ -42,4 +65,30 @@ export default {
         margin-top: 17px;
     }
 }
+@colorList: #37b074, #ea4f56, #36a0b9, #f79439;
+.bank-info {
+    each(@colorList,{
+        &:nth-child( 4n + @{index} ){
+            background:  linear-gradient(90deg, @value, lighten(@value , 20%) 100%);
+        }
+    
+    });
+
+    height: 75px;
+    .flex-col();
+    border-radius: 8px;
+    margin: 20px 16px;
+    justify-content: center;
+    padding: 0 10px;
+
+    .info1 {
+        .flex();
+        justify-content: space-between;
+        font-size: @font2;
+        line-height: 24px;
+    }
+    .info2 {
+        font-size: @font1;
+    }
+}
 </style>

src/main/nine-space/src/views/user/BanksAdd.vue

@@ -89,11 +89,15 @@ export default {
             if (!this.form.code || this.form.code.length < 4) {
                 this.$toast('请输入验证码');
             } else {
+                this.$toast.loading({
+                    message: '加载中...',
+                    forbidClick: true
+                });
                 let bankNo = this.form.bankNo.replace(/ /g, '');
                 this.$http
                     .post(`/user/addBankCard?bankNo=${bankNo}&phone=${this.form.phone}&code=${this.form.code}`)
                     .then(res => {
-                        this.$toast.success('绑定成功');
+                        this.$toast.success('添加成功');
                         setTimeout(() => {
                             this.$router.go(-1);
                         }, 1000);