Browse Source

添加了银行卡的列表

JXDS18FUJT 2 years ago
parent
commit
6dcea20eef
3 changed files with 140 additions and 64 deletions
  1. 50 0
      src/assets/js/wxBankList.ts
  2. 18 51
      src/views/cashout/index.vue
  3. 72 13
      src/views/cashoutBankList/index.vue

+ 50 - 0
src/assets/js/wxBankList.ts

@@ -0,0 +1,50 @@
+
+let WXBANKLIST
+export default  WXBANKLIST = [
+    { bankName: "工商银行", bankCode: 1002 },
+    { bankName: "农业银行", bankCode: 1005 },
+    { bankName: "建设银行", bankCode: 1003 },
+    { bankName: "中国银行", bankCode: 1026 },
+    { bankName: "交通银行", bankCode: 1020 },
+    { bankName: "招商银行", bankCode: 1001 },
+    { bankName: "邮储银行", bankCode: 1066 },
+    { bankName: "民生银行", bankCode: 1006 },
+    { bankName: "平安银行", bankCode: 1010 },
+    { bankName: "中信银行", bankCode: 1021 },
+    { bankName: "浦发银行", bankCode: 1004 },
+    { bankName: "兴业银行", bankCode: 1009 },
+    { bankName: "光大银行", bankCode: 1022 },
+    { bankName: "广发银行", bankCode: 1027 },
+    { bankName: "华夏银行", bankCode: 1025 },
+    { bankName: "宁波银行", bankCode: 1056 },
+    { bankName: "北京银行", bankCode: 4836 },
+    { bankName: "上海银行", bankCode: 1024 },
+    { bankName: "南京银行", bankCode: 1054 },
+    { bankName: "长子县融汇村镇银行", bankCode: 475 },
+    { bankName: "长沙银行", bankCode: 4216 },
+    { bankName: "浙江泰隆商业银行", bankCode: 4051 },
+    { bankName: "中原银行", bankCode: 4753 },
+    { bankName: "企业银行(中国)", bankCode: 4761 },
+    { bankName: "顺德农商银行", bankCode: 4036 },
+    { bankName: "衡水银行", bankCode: 4752 },
+    { bankName: "长治银行", bankCode: 4756 },
+    { bankName: "大同银行", bankCode: 4767 },
+    { bankName: "河南省农村信用社", bankCode: 4115 },
+    { bankName: "宁夏黄河农村商业银行", bankCode: 4150 },
+    { bankName: "山西省农村信用社", bankCode: 4156 },
+    { bankName: "安徽省农村信用社", bankCode: 4166 },
+    { bankName: "甘肃省农村信用社", bankCode: 4157 },
+    { bankName: "天津农村商业银行", bankCode: 4153 },
+    { bankName: "广西壮族自治区农村信用社", bankCode: 4113 },
+    { bankName: "陕西省农村信用社", bankCode: 4108 },
+    { bankName: "深圳农村商业银行", bankCode: 4076 },
+    { bankName: "宁波鄞州农村商业银行", bankCode: 4052 },
+    { bankName: "浙江省农村信用社联合社", bankCode: 4764 },
+    { bankName: "江苏省农村信用社联合社", bankCode: 4217 },
+    { bankName: "江苏紫金农村商业银行股份有限公司", bankCode: 4072 },
+    { bankName: "北京中关村银行股份有限公司", bankCode: 4769 },
+    { bankName: "星展银行(中国)有限公司", bankCode: 4778 },
+    { bankName: "枣庄银行股份有限公司", bankCode: 4766 },
+    { bankName: "海口联合农村商业银行股份有限公司", bankCode: 4758 },
+    { bankName: "南洋商业银行(中国)有限公司", bankCode: 4763 }
+]

+ 18 - 51
src/views/cashout/index.vue

@@ -40,7 +40,7 @@
 
 					</van-field>
 					<van-field type="digit" v-model="encBankNo" label="银行卡号" placeholder="请输入银行卡号" />
-					<van-field is-link url="/cashoutBankList" readonly v-model="encBankNo" label="银行卡列表"  />
+					<van-field is-link url="/cashoutBankList" readonly label="银行卡列表" />
 				</van-cell-group>
 			</van-dialog>
 
@@ -80,15 +80,17 @@
 </template>
 
 <script lang="ts">
-import { computed, defineComponent, reactive, ref } from 'vue'
+import { computed, defineComponent, reactive, ref, onMounted } from 'vue'
 import bgImgIcon from '@/assets/img/bgImg.png'
 import { useStore } from 'vuex'
 import api from '@/api'
 import { Dialog, Toast, PickerOption } from 'vant';
-
+import WXBANKLIST from '@/assets/js/wxBankList';
+import { useRoute } from 'vue-router';
 export default defineComponent({
 	setup() {
 		const store = useStore()
+		const route = useRoute()
 		const amount = ref(0)
 		const userInfo = computed(() => {
 			return store.state.userInfo
@@ -101,54 +103,7 @@ export default defineComponent({
 		const encBankNo = ref('')
 		const encTrueName = ref('')
 		const wxBankListFieldnames = { text: 'bankName', values: 'values', children: 'children' }
-		const wxBankList = reactive([
-			{ bankName: "工商银行", bankCode: 1002 },
-			{ bankName: "农业银行", bankCode: 1005 },
-			{ bankName: "建设银行", bankCode: 1003 },
-			{ bankName: "中国银行", bankCode: 1026 },
-			{ bankName: "交通银行", bankCode: 1020 },
-			{ bankName: "招商银行", bankCode: 1001 },
-			{ bankName: "邮储银行", bankCode: 1066 },
-			{ bankName: "民生银行", bankCode: 1006 },
-			{ bankName: "平安银行", bankCode: 1010 },
-			{ bankName: "中信银行", bankCode: 1021 },
-			{ bankName: "浦发银行", bankCode: 1004 },
-			{ bankName: "兴业银行", bankCode: 1009 },
-			{ bankName: "光大银行", bankCode: 1022 },
-			{ bankName: "广发银行", bankCode: 1027 },
-			{ bankName: "华夏银行", bankCode: 1025 },
-			{ bankName: "宁波银行", bankCode: 1056 },
-			{ bankName: "北京银行", bankCode: 4836 },
-			{ bankName: "上海银行", bankCode: 1024 },
-			{ bankName: "南京银行", bankCode: 1054 },
-			{ bankName: "长子县融汇村镇银行", bankCode: 475 },
-			{ bankName: "长沙银行", bankCode: 4216 },
-			{ bankName: "浙江泰隆商业银行", bankCode: 4051 },
-			{ bankName: "中原银行", bankCode: 4753 },
-			{ bankName: "企业银行(中国)", bankCode: 4761 },
-			{ bankName: "顺德农商银行", bankCode: 4036 },
-			{ bankName: "衡水银行", bankCode: 4752 },
-			{ bankName: "长治银行", bankCode: 4756 },
-			{ bankName: "大同银行", bankCode: 4767 },
-			{ bankName: "河南省农村信用社", bankCode: 4115 },
-			{ bankName: "宁夏黄河农村商业银行", bankCode: 4150 },
-			{ bankName: "山西省农村信用社", bankCode: 4156 },
-			{ bankName: "安徽省农村信用社", bankCode: 4166 },
-			{ bankName: "甘肃省农村信用社", bankCode: 4157 },
-			{ bankName: "天津农村商业银行", bankCode: 4153 },
-			{ bankName: "广西壮族自治区农村信用社", bankCode: 4113 },
-			{ bankName: "陕西省农村信用社", bankCode: 4108 },
-			{ bankName: "深圳农村商业银行", bankCode: 4076 },
-			{ bankName: "宁波鄞州农村商业银行", bankCode: 4052 },
-			{ bankName: "浙江省农村信用社联合社", bankCode: 4764 },
-			{ bankName: "江苏省农村信用社联合社", bankCode: 4217 },
-			{ bankName: "江苏紫金农村商业银行股份有限公司", bankCode: 4072 },
-			{ bankName: "北京中关村银行股份有限公司", bankCode: 4769 },
-			{ bankName: "星展银行(中国)有限公司", bankCode: 4778 },
-			{ bankName: "枣庄银行股份有限公司", bankCode: 4766 },
-			{ bankName: "海口联合农村商业银行股份有限公司", bankCode: 4758 },
-			{ bankName: "南洋商业银行(中国)有限公司", bankCode: 4763 },
-		]);
+		const wxBankList = reactive(WXBANKLIST);
 		const getBankCode = (val: {
 			bankCode: number,
 			bankName: string
@@ -234,6 +189,18 @@ export default defineComponent({
 
 
 		}
+		onMounted(() => {
+			if (route.query.cashToCardShow) {
+				cashToCardShow.value = Boolean(route.query.cashToCardShow)
+				encBankNo.value = String(route.query.encBankNo)
+				bankName.value = String(route.query.bankName)
+				bankCode.value = Number(route.query.bankCode)
+				encTrueName.value = String(route.query.encTrueName)
+
+			}
+
+
+		})
 		return {
 			wxBankList,
 			wxBankListFieldnames,

+ 72 - 13
src/views/cashoutBankList/index.vue

@@ -1,26 +1,65 @@
 <template>
     <div class="bg">
-        <m-nav-bar mode="black" background="white" title="已提现的银行卡"></m-nav-bar>
+        <m-nav-bar mode="black" background="#fff" title="我的银行卡列表"></m-nav-bar>
         <div class="card">
-            <div class="item" v-for="(item, index) in bankCardList" :key="index">
-                <div>
-
+            <div @click="goCashout(item)" class="item" v-for="(item, index) in bankCardList" :key="index">
+                <div style="width:100%;display: flex;align-items: center;">
+                    <div class="font30" style="width:30%;text-align: left"> {{ item.encTrueName }}</div>
+                    <div class="font22" style="width:70%;color: #8A9099;text-align: right;"> {{ item.createTime }}</div>
+                </div>
+                <div class="font26">
+                    {{ findBankNameByCode(item.bankCode) }}({{ item.encBankNo }})
                 </div>
-
             </div>
-
-
         </div>
     </div>
 </template>
 
 <script lang="ts">
 import api from '@/api'
-import { ref } from 'vue'
-
+import { reactive, ref } from 'vue'
+import WXBANKLIST from '@/assets/js/wxBankList';
+import { useRouter } from 'vue-router';
+import { isTemplateElement } from '@babel/types';
 export default {
     setup() {
+        const router = useRouter()
         const bankCardList = ref<any>([])
+        const findBankNameByCode = (code: number) => {
+            console.log(code)
+            let bankName = ""
+            WXBANKLIST.forEach(item => {
+                if (item.bankCode == code) {
+                    bankName = item.bankName
+                }
+
+            })
+            return bankName
+
+        }
+        const goCashout = (item: {
+            createTime: string;
+            updateTime: string;
+            id: number;
+            openid: string;
+            encTrueName: string;
+            bankCode: number;
+            encBankNo: string;
+
+        }) => {
+            router.push({
+                path: "/cashout",
+                query: {
+                    cashToCardShow: 1,
+                    bankCode: item.bankCode,
+                    bankName:findBankNameByCode(item.bankCode),
+                    encBankNo:item.encBankNo,
+                    encTrueName:item.encTrueName
+                }
+            })
+
+
+        }
         api.wx.studentWxBankList({
             pageNum: 1,
             pageSize: 1000
@@ -32,25 +71,45 @@ export default {
         })
 
         return {
-            bankCardList
+            findBankNameByCode,
+            bankCardList,
+            goCashout
+
         }
     }
 }
 </script>
 
 <style lang="scss" scoped>
-.bg{
+.font30 {
+    font-size: 30px;
+}
+
+.font22 {
+    font-size: 22px;
+}
+
+.font26 {
+    font-size: 26px;
+
+}
+
+.bg {
     background: #fff;
-    min-height:100vh ;
+    min-height: 100vh;
 }
+
 .card {
     display: flex;
     padding: 0 30px;
 
     .item {
+        display: flex;
+        flex-wrap: wrap;
         width: 100%;
-        height: 67px;
+        height: 130px;
         border-bottom: 1px solid #E8E8E8;
+        vertical-align: bottom;
     }
 }
 </style>