银行卡

src/main/nine-space/src/components/PageBar.vue

@@ -0,0 +1,20 @@
+<template>
+    <div class="bar">
+        <span><slot>第九空间</slot></span>
+    </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="less" scoped>
+.bar {
+    height: 50px;
+    padding: 0 16px;
+    background-color: @bg;
+    font-size: 20px;
+    font-weight: bold;
+    .flex();
+}
+</style>

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

@@ -0,0 +1,37 @@
+<template>
+    <div class="page">
+        <page-bar>我的银行卡</page-bar>
+
+        <div class="add">
+            <img src="../../assets/png-tianjia.png" alt="" />
+            <span>添加银行卡</span>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {};
+</script>
+
+<style lang="less" scoped>
+.page {
+    background-color: @bg3;
+}
+.add {
+    .flex-col();
+    padding: 60px 0;
+    align-items: center;
+
+    img {
+        width: 54px;
+        height: 54px;
+    }
+
+    span {
+        font-size: 14px;
+        color: #ffffff;
+        line-height: 24px;
+        margin-top: 17px;
+    }
+}
+</style>

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

@@ -0,0 +1,44 @@
+<template>
+    <div class="page">
+        <page-bar>
+            添加银行卡
+            <template #sub>成功绑定应行卡后</template>
+            <template #sub-prim>不能修改</template>
+        </page-bar>
+        <van-form @submit="submit">
+            <van-field
+                name="用户名"
+                label="用户名"
+                placeholder="请输入用户名"
+                v-model="form"
+                :rules="[{ required: true, message: '请填写用户名' }]"
+            />
+            <van-field
+                type="password"
+                name="密码"
+                label="密码"
+                placeholder="请输入密码"
+                v-model=""
+                :rules="[{ required: true, message: '请填写密码' }]"
+            />
+            <div style="margin: 16px;">
+                <van-button round block type="info" native-type="submit">提交</van-button>
+            </div>
+        </van-form>
+    </div>
+</template>
+
+<script>
+export default {
+    data(){
+        return {
+            form:{}
+        }
+    },
+    methods: {
+        submit() {}
+    }
+};
+</script>
+
+<style lang="less" scoped></style>