jiuyiUniapp/jiuyi2/pages/mine/setting/bankCardAdd.vue

106 lines
2.1 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<script setup>
// 添加银行卡
import {
reactive
} from 'vue';
import getCode from '@/components/getCode/getCode'
// 银行卡列表
const bankList = reactive([
{
name: '银行卡1',
},
{
name: '银行卡2',
},
{
name: '银行卡3',
},
])
</script>
<template>
<view class="appbw">
<!-- 表单 -->
<view class="form mtb30 mlr40">
<view class="line">
<view class="title">银行卡类型</view>
<view class="inputBox">
<picker :range="bankList" range-key="name">
<view class="rows">
<input class="input" disabled type="text" placeholder="请选择银行卡类型" />
<uni-icons type="bottom" />
</view>
</picker>
</view>
</view>
<view class="line">
<view class="title">银行卡卡号</view>
<view class="inputBox">
<input class="input" type="text" placeholder="请输入银行卡卡号" />
</view>
</view>
<view class="line">
<view class="title">姓名</view>
<view class="inputBox">
<input class="input" type="text" placeholder="请输入姓名" />
</view>
</view>
<view class="line">
<view class="title">身份证号</view>
<view class="inputBox">
<input class="input" type="text" placeholder="请输入身份证号" />
</view>
</view>
<view class="line">
<view class="title">手机号银行绑定的手机号</view>
<view class="inputBox rows">
<input class="input" type="text" placeholder="请输入手机号" />
<view class="getCode btn black plr30">
<getCode />
</view>
</view>
</view>
<view class="line">
<view class="title">验证码</view>
<view class="inputBox">
<input class="input" type="text" placeholder="请输入验证码" />
</view>
</view>
<view class="btn lg black mt50">绑定</view>
</view>
<view class="fill"></view>
</view>
</template>
<style lang="scss" scoped>
// 图表
.form {
//
.line {
margin: 30rpx 0;
//
.title {
color: #111;
font-size: 32rpx;
}
//
.inputBox {
margin-top: 15rpx;
padding: 10rpx 30rpx;
}
}
}
</style>