1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
| <template>
| <view class="wrapper">
| <u-tabs
| :list="list"
| :is-scroll="false"
| :current="current"
| @change="change"
| :active-color="$lightColor"
| ></u-tabs>
|
|
|
| <!-- 推广人资料 -->
| <view class="message">
| <u-form :model="ruleForm" label-width="250rpx" ref="uForm">
| <u-form-item label="会员昵称" prop="name">
| <u-input v-model="ruleForm.name" />
| </u-form-item>
| <u-form-item label="账户类型" prop="name"> </u-form-item>
| <u-form-item
| label="收款人姓名"
| placeholder="请输入收款人姓名"
| prop="name"
| >
| <u-input v-model="ruleForm.name" />
| </u-form-item>
| <u-form-item
| label="收款账号"
| placeholder="请输入收款人账号"
| prop="name"
| >
| <u-input v-model="ruleForm.name" />
| </u-form-item>
| <u-form-item
| label="银行名称"
| placeholder="请输入开户银行支行名称"
| prop="name"
| >
| <u-input v-model="ruleForm.name" />
| </u-form-item>
| </u-form>
| <u-button :customStyle="{'background':$lightColor,'color':'#fff' }" @click="submit">提交</u-button>
| </view>
| </view>
| </template>
| <script>
| import UTabs from '@/uview-components/uview-ui/components/u-tabs/u-tabs.vue';
| import UForm from '@/uview-components/uview-ui/components/u-form/u-form.vue';
| import UFormItem from '@/uview-components/uview-ui/components/u-form-item/u-form-item.vue';
| import UInput from '@/uview-components/uview-ui/components/u-input/u-input.vue';
| import UButton from '@/uview-components/uview-ui/components/u-button/u-button.vue';
|
| export default {
| components: {UTabs,UForm,UFormItem,UInput,UButton},
| // 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
| onReady() {
| this.$refs.uForm.setRules(this.rules);
| },
| data() {
| return {
| current:0,
| list: [
| {
| name: "推广人资料",
| },
| {
| name: "平台审核",
| },
| {
| name: "完成",
| },
| ],
| ruleForm: {
| name: "",
| radio: "",
| },
| rules: {
| name: [
| {
| required: true,
| message: "请输入姓名",
| // 可以单个或者同时写两个触发验证方式
| trigger: "blur",
| },
| ],
| },
| };
| },
| };
| </script>
| <style lang="scss" scoped>
| .menu {
| height: 88rpx;
| line-height: 88rpx;
| background: $main-color;
| display: flex;
| > .menu-item {
| flex: 1;
| text-align: center;
| color: $light-color;
| }
| }
| .active {
| color: #fff !important;
| }
| .message {
| padding: 0 32rpx;
| }
| </style>
|
|
