fusions-ui 1.2.3 → 1.2.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/fu-avatar/fu-avatar.vue +4 -2
- package/components/fu-avatar/props.js +52 -15
- package/components/fu-avatar-group/fu-avatar-group.vue +3 -2
- package/components/fu-avatar-group/props.js +31 -9
- package/components/fu-badge/fu-badge.vue +8 -14
- package/components/fu-badge/props.js +56 -16
- package/components/fu-banner-arc/fu-banner-arc.vue +4 -5
- package/components/fu-banner-arc/props.js +15 -4
- package/components/fu-button/fu-button.vue +18 -19
- package/components/fu-button/props.js +108 -35
- package/components/fu-cell/fu-cell.vue +9 -8
- package/components/fu-cell-group/fu-cell-group.vue +2 -1
- package/components/fu-cell-group/props.js +7 -2
- package/components/fu-checkbox/fu-checkbox.vue +5 -4
- package/components/fu-checkbox/props.js +51 -14
- package/components/fu-code-input/fu-code-input.vue +10 -6
- package/components/fu-code-input/props.js +66 -17
- package/components/fu-code-verify/fu-code-verify.vue +9 -5
- package/components/fu-code-verify/props.js +64 -17
- package/components/fu-collapse/fu-collapse.vue +10 -3
- package/components/fu-collapse/props.js +9 -3
- package/components/fu-collapse-item/fu-collapse-item.vue +45 -31
- package/components/fu-collapse-item/props.js +49 -16
- package/components/fu-countdown/fu-countdown.vue +2 -1
- package/components/fu-countdown/props.js +15 -4
- package/components/fu-datetime-picker/fu-datetime-picker.vue +6 -5
- package/components/fu-datetime-picker/props.js +91 -25
- package/components/fu-form/fu-form.vue +2 -1
- package/components/fu-form/props.js +34 -6
- package/components/fu-form-item/fu-form-item.vue +46 -56
- package/components/fu-form-item/props.js +34 -7
- package/components/fu-grid/fu-grid.vue +16 -17
- package/components/fu-grid/props.js +20 -5
- package/components/fu-grid-item/fu-grid-item.vue +31 -35
- package/components/fu-grid-item/props.js +11 -3
- package/components/fu-icon/fu-icon.vue +107 -0
- package/components/fu-icon/icon.css +584 -0
- package/components/{fu-icons/icons.js → fu-icon/icon.js} +1031 -1031
- package/components/{fu-icons/fuicons.ttf → fu-icon/icon.ttf} +0 -0
- package/components/fu-icon/props.js +55 -0
- package/components/fu-image/fu-image.vue +15 -10
- package/components/fu-image/props.js +69 -18
- package/components/fu-index-anchor/fu-index-anchor.vue +6 -5
- package/components/fu-index-anchor/props.js +20 -6
- package/components/fu-index-item/fu-index-item.vue +4 -4
- package/components/fu-index-list/fu-index-list.vue +9 -9
- package/components/fu-index-list/props.js +19 -6
- package/components/fu-input/fu-input.vue +54 -68
- package/components/fu-input/props.js +145 -53
- package/components/fu-keyboard/fu-keyboard.vue +19 -9
- package/components/fu-keyboard/keyboard-car.vue +33 -22
- package/components/fu-keyboard/keyboard-number.vue +17 -9
- package/components/fu-keyboard/props.js +66 -17
- package/components/fu-line/fu-line.vue +17 -13
- package/components/fu-line/props.js +30 -5
- package/components/fu-link/fu-link.vue +14 -8
- package/components/fu-link/props.js +22 -7
- package/components/fu-loading/fu-loading.vue +32 -27
- package/components/fu-loading/props.js +28 -8
- package/components/fu-loading-more/fu-loading-more.vue +19 -23
- package/components/fu-loading-more/props.js +27 -13
- package/components/fu-modal/fu-modal.vue +11 -6
- package/components/fu-modal/props.js +61 -17
- package/components/{fu-nav-bar/fu-nav-bar.vue → fu-navbar/fu-navbar.vue} +37 -44
- package/components/fu-notice-bar/fu-notice-bar.vue +10 -8
- package/components/fu-notice-bar/notice-column.vue +187 -122
- package/components/fu-notice-bar/notice-row.vue +85 -28
- package/components/fu-notice-bar/props.js +83 -22
- package/components/fu-number-box/fu-number-box.vue +26 -28
- package/components/fu-number-box/props.js +37 -11
- package/components/fu-parse/fu-parse.vue +0 -1
- package/components/fu-picker/fu-picker.vue +22 -17
- package/components/fu-picker/props.js +70 -19
- package/components/fu-popup/fu-popup.vue +39 -44
- package/components/fu-popup/props.js +34 -9
- package/components/fu-progress/fu-progress.vue +3 -2
- package/components/fu-progress/props.js +36 -9
- package/components/fu-rate/fu-rate.vue +40 -32
- package/components/fu-rate/props.js +47 -13
- package/components/fu-read-more/fu-read-more.vue +19 -14
- package/components/fu-read-more/props.js +68 -46
- package/components/fu-ribbon/fu-ribbon.vue +8 -7
- package/components/fu-ribbon/props.js +15 -4
- package/components/fu-scroll-list/fu-scroll-list.vue +18 -34
- package/components/fu-scroll-list/props.js +19 -10
- package/components/fu-search/fu-search.vue +13 -18
- package/components/fu-search/props.js +69 -17
- package/components/fu-section/fu-section.vue +19 -22
- package/components/fu-section/props.js +30 -4
- package/components/fu-sign-board/fu-sign-board.vue +18 -3
- package/components/fu-sign-board/props.js +15 -5
- package/components/fu-skeleton/fu-skeleton.vue +8 -12
- package/components/fu-skeleton/props.js +15 -4
- package/components/fu-steps/fu-steps.vue +3 -2
- package/components/fu-steps/props.js +23 -7
- package/components/fu-steps-item/fu-steps-item.vue +3 -3
- package/components/fu-steps-item/props.js +15 -5
- package/components/fu-sticky/fu-sticky.vue +3 -3
- package/components/fu-sticky/props.js +21 -7
- package/components/fu-subsection/fu-subsection.vue +29 -22
- package/components/fu-subsection/props.js +40 -10
- package/components/fu-swipe-action-item/bindingx.js +1 -1
- package/components/fu-swipe-action-item/fu-swipe-action-item.vue +134 -123
- package/components/fu-swipe-action-item/mpwxs.js +1 -1
- package/components/fu-swipe-action-item/props.js +22 -6
- package/components/fu-swiper/fu-swiper.vue +26 -24
- package/components/fu-swiper/props.js +80 -24
- package/components/fu-switch/fu-switch.vue +20 -12
- package/components/fu-switch/props.js +48 -13
- package/components/fu-tabs/fu-tabs.vue +36 -33
- package/components/fu-tabs/props.js +46 -13
- package/components/fu-tag/fu-tag.vue +24 -21
- package/components/fu-tag/props.js +63 -17
- package/components/fu-text/fu-text.vue +72 -33
- package/components/fu-text/props.js +85 -27
- package/components/fu-text/value.js +6 -6
- package/components/fu-textarea/fu-textarea.vue +13 -17
- package/components/fu-textarea/props.js +103 -30
- package/components/fu-timeaxis/fu-timeaxis.vue +1 -1
- package/components/fu-timeaxis-item/fu-timeaxis-item.vue +8 -4
- package/components/fu-transition/fu-transition.vue +48 -49
- package/components/fu-transition/props.js +21 -0
- package/components/fu-upload/fu-upload.vue +3 -1
- package/components/fu-upload/props.js +67 -19
- package/components/fu-upload/upload-file.vue +31 -18
- package/components/fu-upload/upload-image.vue +37 -19
- package/components/fu-vtabs/fu-vtabs.vue +6 -4
- package/components/fu-vtabs/props.js +50 -15
- package/components/fu-waterfall/fu-waterfall.vue +11 -9
- package/components/fu-waterfall/props.js +37 -15
- package/index.js +17 -24
- package/index.scss +9 -7
- package/libs/config/config.js +16 -9
- package/libs/function/applyEven.js +9 -9
- package/libs/function/check.js +81 -89
- package/libs/function/{index.js → common.js} +5 -5
- package/libs/function/message.js +0 -27
- package/libs/mixin/mixin.js +26 -21
- package/libs/{utils/min.router.config.js → route/min.route.config.js} +7 -7
- package/libs/{utils/router.config.js → route/route.config.js} +10 -11
- package/libs/{css/main.scss → style/common.scss} +50 -87
- package/libs/style/style.h5.scss +8 -0
- package/libs/style/style.mp.scss +15 -0
- package/package.json +1 -1
- package/components/fu-calendar/calendar-item.vue +0 -214
- package/components/fu-calendar/calendar.js +0 -546
- package/components/fu-calendar/fu-calendar.vue +0 -536
- package/components/fu-calendar/i18n/en.json +0 -12
- package/components/fu-calendar/i18n/index.js +0 -8
- package/components/fu-calendar/i18n/zh-Hans.json +0 -12
- package/components/fu-calendar/i18n/zh-Hant.json +0 -12
- package/components/fu-calendar/util.js +0 -360
- package/components/fu-date-picker/calendar-item.vue +0 -177
- package/components/fu-date-picker/calendar.vue +0 -917
- package/components/fu-date-picker/fu-date-picker.vue +0 -1069
- package/components/fu-date-picker/i18n/en.json +0 -22
- package/components/fu-date-picker/i18n/index.js +0 -8
- package/components/fu-date-picker/i18n/zh-Hans.json +0 -22
- package/components/fu-date-picker/i18n/zh-Hant.json +0 -22
- package/components/fu-date-picker/props.js +0 -68
- package/components/fu-date-picker/time-picker.vue +0 -924
- package/components/fu-date-picker/util.js +0 -419
- package/components/fu-icons/fu-icons.vue +0 -102
- package/components/fu-icons/fuicons.css +0 -585
- package/components/fu-landscape/fu-landscape.vue +0 -167
- package/components/fu-landscape/props.js +0 -64
- package/components/fu-tabbar/fu-tabbar.vue +0 -333
- package/components/fu-tabbar/props.js +0 -78
- package/libs/css/style.h5.scss +0 -35
- package/libs/css/style.mp.scss +0 -50
- package/libs/utils/util.js +0 -58
- /package/components/{fu-nav-bar → fu-navbar}/props.js +0 -0
- /package/components/{fu-nav-bar → fu-navbar}/status-bar.vue +0 -0
- /package/{components/fu-datetime-picker → libs/function}/dayjs.js +0 -0
- /package/libs/{css → style}/color.scss +0 -0
- /package/libs/{css/component.scss → style/components.scss} +0 -0
|
@@ -1,152 +1,225 @@
|
|
|
1
1
|
export default {
|
|
2
2
|
props: {
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* @description 按钮索引,用于区分多个按钮
|
|
5
|
+
*/
|
|
4
6
|
index: {
|
|
5
7
|
type: [Number, String],
|
|
6
8
|
default: 0
|
|
7
9
|
},
|
|
8
|
-
|
|
10
|
+
/**
|
|
11
|
+
* @description 按钮的预置样式
|
|
12
|
+
* @values 'primary' - 主色, 'error' - 错误, 'success' - 成功, 'warning' - 警告, 'info' - 信息
|
|
13
|
+
* @default 'primary'
|
|
14
|
+
*/
|
|
9
15
|
type: {
|
|
10
16
|
type: String,
|
|
11
17
|
default: 'primary'
|
|
12
18
|
},
|
|
13
|
-
|
|
14
|
-
|
|
19
|
+
/**
|
|
20
|
+
* @description 按钮文字,之所以通过props传入,是因为slot传入的话
|
|
21
|
+
* nvue中无法控制文字的样式
|
|
22
|
+
*/
|
|
15
23
|
text: {
|
|
16
24
|
type: [String, Number],
|
|
17
25
|
default: ''
|
|
18
26
|
},
|
|
19
|
-
|
|
27
|
+
/**
|
|
28
|
+
* @description 按钮形状
|
|
29
|
+
* @values 'square' - 带圆角, 'circle' - 两边为半圆
|
|
30
|
+
* @default 'square'
|
|
31
|
+
*/
|
|
20
32
|
shape: {
|
|
21
33
|
type: String,
|
|
22
34
|
default: 'square'
|
|
23
35
|
},
|
|
24
|
-
|
|
36
|
+
/**
|
|
37
|
+
* @description 按钮宽度
|
|
38
|
+
*/
|
|
25
39
|
width: {
|
|
26
40
|
type: [String,Number],
|
|
27
41
|
default: ''
|
|
28
42
|
},
|
|
29
|
-
|
|
43
|
+
/**
|
|
44
|
+
* @description 按钮高度
|
|
45
|
+
*/
|
|
30
46
|
height: {
|
|
31
47
|
type: [String,Number],
|
|
32
48
|
default: ''
|
|
33
49
|
},
|
|
34
|
-
|
|
50
|
+
/**
|
|
51
|
+
* @description 按钮的尺寸
|
|
52
|
+
* @values 'large' - 16px, 'normal' - 14px, 'small' - 12px, 'mini' - 10px
|
|
53
|
+
* @default 'normal'
|
|
54
|
+
*/
|
|
35
55
|
size: {
|
|
36
56
|
type: String,
|
|
37
57
|
default: 'normal'
|
|
38
58
|
},
|
|
39
|
-
|
|
59
|
+
/**
|
|
60
|
+
* @description 外边距 与css的margin参数用法相同
|
|
61
|
+
*/
|
|
40
62
|
margin: {
|
|
41
63
|
type: String,
|
|
42
64
|
default: ''
|
|
43
65
|
},
|
|
44
|
-
|
|
66
|
+
/**
|
|
67
|
+
* @description 是否镂空
|
|
68
|
+
* @default false
|
|
69
|
+
*/
|
|
45
70
|
plain: {
|
|
46
71
|
type: Boolean,
|
|
47
72
|
default: false
|
|
48
73
|
},
|
|
49
|
-
|
|
74
|
+
/**
|
|
75
|
+
* @description 是否禁用
|
|
76
|
+
* @default false
|
|
77
|
+
*/
|
|
50
78
|
disabled: {
|
|
51
79
|
type: Boolean,
|
|
52
80
|
default: false
|
|
53
81
|
},
|
|
54
|
-
|
|
82
|
+
/**
|
|
83
|
+
* @description 是否显示加载图标
|
|
84
|
+
* @default false
|
|
85
|
+
*/
|
|
55
86
|
loading: {
|
|
56
87
|
type: Boolean,
|
|
57
88
|
default: false
|
|
58
89
|
},
|
|
59
|
-
|
|
90
|
+
/**
|
|
91
|
+
* @description 加载中提示文字
|
|
92
|
+
*/
|
|
60
93
|
loadingText: {
|
|
61
94
|
type: [String],
|
|
62
95
|
default: ''
|
|
63
96
|
},
|
|
64
|
-
|
|
97
|
+
/**
|
|
98
|
+
* @description 加载状态图标类型
|
|
99
|
+
* @default 'flower'
|
|
100
|
+
*/
|
|
65
101
|
loadingMode: {
|
|
66
102
|
type: String,
|
|
67
103
|
default: 'flower'
|
|
68
104
|
},
|
|
69
|
-
|
|
105
|
+
/**
|
|
106
|
+
* @description 加载图标大小
|
|
107
|
+
* @default 14
|
|
108
|
+
*/
|
|
70
109
|
loadingSize: {
|
|
71
110
|
type: [String, Number],
|
|
72
111
|
default: 14
|
|
73
112
|
},
|
|
74
|
-
|
|
113
|
+
/**
|
|
114
|
+
* @description 触发form表单的事件类型
|
|
115
|
+
*/
|
|
75
116
|
formType: {
|
|
76
117
|
type: String,
|
|
77
118
|
default: ''
|
|
78
119
|
},
|
|
79
|
-
|
|
80
|
-
|
|
120
|
+
/**
|
|
121
|
+
* @description 开放能力,具体请看uniapp稳定关于button组件部分说明
|
|
122
|
+
* https://uniapp.dcloud.io/component/button
|
|
123
|
+
*/
|
|
81
124
|
openType: {
|
|
82
125
|
type: String,
|
|
83
126
|
default: ''
|
|
84
127
|
},
|
|
85
|
-
|
|
128
|
+
/**
|
|
129
|
+
* @description 指定是否阻止本节点的祖先节点出现点击态,微信小程序有效
|
|
130
|
+
*/
|
|
86
131
|
hoverStopPropagation: {
|
|
87
132
|
type: Boolean,
|
|
88
133
|
default: false
|
|
89
134
|
},
|
|
90
|
-
|
|
135
|
+
/**
|
|
136
|
+
* @description 会话来源,open-type="contact"时有效。只微信小程序有效
|
|
137
|
+
*/
|
|
91
138
|
sessionFrom: {
|
|
92
139
|
type: String,
|
|
93
140
|
default: ''
|
|
94
141
|
},
|
|
95
|
-
|
|
96
|
-
|
|
142
|
+
/**
|
|
143
|
+
* @description 会话内消息卡片标题,open-type="contact"时有效
|
|
144
|
+
* 默认当前标题,只微信小程序有效
|
|
145
|
+
*/
|
|
97
146
|
sendMessageTitle: {
|
|
98
147
|
type: String,
|
|
99
148
|
default: ''
|
|
100
149
|
},
|
|
101
|
-
|
|
102
|
-
|
|
150
|
+
/**
|
|
151
|
+
* @description 会话内消息卡片点击跳转小程序路径,open-type="contact"时有效
|
|
152
|
+
* 默认当前分享路径,只微信小程序有效
|
|
153
|
+
*/
|
|
103
154
|
sendMessagePath: {
|
|
104
155
|
type: String,
|
|
105
156
|
default: ''
|
|
106
157
|
},
|
|
107
|
-
|
|
108
|
-
|
|
158
|
+
/**
|
|
159
|
+
* @description 会话内消息卡片图片,open-type="contact"时有效
|
|
160
|
+
* 默认当前页面截图,只微信小程序有效
|
|
161
|
+
*/
|
|
109
162
|
sendMessageImg: {
|
|
110
163
|
type: String,
|
|
111
164
|
default: ''
|
|
112
165
|
},
|
|
113
|
-
|
|
114
|
-
|
|
166
|
+
/**
|
|
167
|
+
* @description 是否显示会话内消息卡片,设置此参数为 true,用户进入客服会话会在右下角显示"可能要发送的小程序"提示,
|
|
168
|
+
* 用户点击后可以快速发送小程序消息,open-type="contact"时有效
|
|
169
|
+
*/
|
|
115
170
|
showMessageCard: {
|
|
116
171
|
type: Boolean,
|
|
117
172
|
default: false
|
|
118
173
|
},
|
|
119
|
-
|
|
174
|
+
/**
|
|
175
|
+
* @description 场景:none:不开启防抖节流模式 debounce:防抖模式 throttle:节流模式
|
|
176
|
+
* @default 'throttle'
|
|
177
|
+
*/
|
|
120
178
|
scene:{
|
|
121
179
|
type: String,
|
|
122
180
|
default: 'throttle'
|
|
123
181
|
},
|
|
124
|
-
|
|
182
|
+
/**
|
|
183
|
+
* @description 防抖节流间隔时间(毫秒)
|
|
184
|
+
* @default 300
|
|
185
|
+
*/
|
|
125
186
|
sceneTime:{
|
|
126
187
|
type: Number,
|
|
127
188
|
default: 300
|
|
128
189
|
},
|
|
129
|
-
|
|
190
|
+
/**
|
|
191
|
+
* @description 按住后多久出现点击态,单位毫秒
|
|
192
|
+
*/
|
|
130
193
|
hoverStartTime: {
|
|
131
194
|
type: [String, Number],
|
|
132
195
|
default: 0
|
|
133
196
|
},
|
|
134
|
-
|
|
197
|
+
/**
|
|
198
|
+
* @description 手指松开后点击态保留时间,单位毫秒
|
|
199
|
+
* @default 200
|
|
200
|
+
*/
|
|
135
201
|
hoverStayTime: {
|
|
136
202
|
type: [String, Number],
|
|
137
203
|
default: 200
|
|
138
204
|
},
|
|
139
|
-
|
|
205
|
+
/**
|
|
206
|
+
* @description 按钮颜色,支持传入linear-gradient渐变色
|
|
207
|
+
*/
|
|
140
208
|
color: {
|
|
141
209
|
type: String,
|
|
142
210
|
default: ''
|
|
143
211
|
},
|
|
144
|
-
|
|
212
|
+
/**
|
|
213
|
+
* @description 指定返回用户信息的语言,zh_CN 简体中文,zh_TW 繁体中文,en 英文。只微信小程序有效
|
|
214
|
+
* @default 'en'
|
|
215
|
+
*/
|
|
145
216
|
lang: {
|
|
146
217
|
type: String,
|
|
147
218
|
default: 'en'
|
|
148
219
|
},
|
|
149
|
-
|
|
220
|
+
/**
|
|
221
|
+
* @description 自定义按钮文本样式
|
|
222
|
+
*/
|
|
150
223
|
customTextStyle: {
|
|
151
224
|
type: [Object,String],
|
|
152
225
|
default: ''
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
class="fu-cell"
|
|
4
4
|
:hover-class="(!disabled && (clickable && isLink)) ? 'fu-cell--clickable' : ''"
|
|
5
5
|
:hover-stay-time="250"
|
|
6
|
-
@click="
|
|
6
|
+
@click="handleClick">
|
|
7
7
|
<view
|
|
8
8
|
class="fu-cell__body"
|
|
9
9
|
:class="[ center && 'fu-cell--center', size === 'large' && 'fu-cell__body--large']"
|
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
<view class="fu-cell__body__content">
|
|
12
12
|
<view class="fu-cell__left-icon-wrap">
|
|
13
13
|
<slot name="icon">
|
|
14
|
-
<fu-
|
|
14
|
+
<fu-icon :name="icon" :size="iconSize" :color="iconColor" v-if="icon" />
|
|
15
15
|
</slot>
|
|
16
16
|
</view>
|
|
17
17
|
<view class="fu-cell__title">
|
|
@@ -44,7 +44,7 @@
|
|
|
44
44
|
</slot>
|
|
45
45
|
<view class="fu-cell__right-icon-wrap" :class="[`fu-cell__right-icon-wrap--${arrowDirection}`]">
|
|
46
46
|
<slot name="right">
|
|
47
|
-
<fu-
|
|
47
|
+
<fu-icon :name="rightIcon" :color="disabled? '#d4d5d8' : rightColor" :size="rightSize" v-if="isLink" />
|
|
48
48
|
</slot>
|
|
49
49
|
</view>
|
|
50
50
|
</view>
|
|
@@ -77,6 +77,7 @@
|
|
|
77
77
|
* @property {String} size 单位元的大小,可选值为 large,normal,mini
|
|
78
78
|
* @property {Boolean} stop = [true|false] 点击cell是否阻止事件传播 (默认 true )
|
|
79
79
|
* @property {Object,String} customStyle 定义需要用到的外部样式
|
|
80
|
+
*
|
|
80
81
|
* @event {Function} click 点击cell列表时触发
|
|
81
82
|
* @example 该组件需要搭配cell-group组件使用
|
|
82
83
|
*/
|
|
@@ -90,20 +91,19 @@
|
|
|
90
91
|
}
|
|
91
92
|
},
|
|
92
93
|
methods: {
|
|
93
|
-
// 点击cell
|
|
94
|
-
|
|
94
|
+
// 点击cell触发
|
|
95
|
+
handleClick(e) {
|
|
95
96
|
if (this.disabled) return
|
|
96
97
|
this.$emit('click', {
|
|
97
98
|
name: this.name
|
|
98
99
|
})
|
|
99
|
-
}
|
|
100
|
+
}
|
|
100
101
|
}
|
|
101
102
|
}
|
|
102
103
|
</script>
|
|
103
104
|
|
|
104
105
|
<style lang="scss" scoped>
|
|
105
|
-
@import '../../libs/
|
|
106
|
-
|
|
106
|
+
@import '../../libs/style/components.scss';
|
|
107
107
|
$fu-cell-padding: 10px 15px !default;
|
|
108
108
|
$fu-cell-font-size: 15px !default;
|
|
109
109
|
$fu-cell-line-height: 24px !default;
|
|
@@ -128,6 +128,7 @@
|
|
|
128
128
|
$fu-cell-right-icon-wrap-margin-left: 4px !default;
|
|
129
129
|
$fu-cell-title-flex: 1 !default;
|
|
130
130
|
$fu-cell-label-margin-top: 5px !default;
|
|
131
|
+
|
|
131
132
|
.fu-cell {
|
|
132
133
|
|
|
133
134
|
&__body {
|
|
@@ -21,8 +21,9 @@
|
|
|
21
21
|
* @description 此组件一般用于一组列表的情况,比如个人中心页,设置页等。
|
|
22
22
|
* @property {String} title 分组标题
|
|
23
23
|
* @property {Boolean} border = [true|false] 是否显示外边框 (默认 true )
|
|
24
|
-
* @property {String} customClass
|
|
24
|
+
* @property {String} customClass 定义需要用到的外部样式类
|
|
25
25
|
* @property {Object,String} customStyle 定义需要用到的外部样式
|
|
26
|
+
*
|
|
26
27
|
* @example <fu-cell-group title="设置喜好"></fu-cell-group>
|
|
27
28
|
*/
|
|
28
29
|
export default {
|
|
@@ -88,7 +88,9 @@
|
|
|
88
88
|
* @property {Boolean} highlight = [true|false] 选中时,文本是否高亮(默认 true)
|
|
89
89
|
* @property {String} iconPos mode = list 列表模式下icon显示位置(默认 left)
|
|
90
90
|
* @property {String} activeTextColor 选中文本颜色,如为空则自动显示
|
|
91
|
+
*
|
|
91
92
|
* @event {Function} change 选中状态发生改变时触发
|
|
93
|
+
* @example<fu-checkbox :list="list"></fu-checkbox>
|
|
92
94
|
*/
|
|
93
95
|
export default {
|
|
94
96
|
name: 'FuCheckBox',
|
|
@@ -228,7 +230,7 @@
|
|
|
228
230
|
const dataList = this.$fu.deepClone(this.range);
|
|
229
231
|
let newList = [];
|
|
230
232
|
if (this.multiple) {
|
|
231
|
-
if (!this.$fu.
|
|
233
|
+
if (!this.$fu.isArray(value)) {
|
|
232
234
|
value = [];
|
|
233
235
|
}
|
|
234
236
|
}
|
|
@@ -314,9 +316,8 @@
|
|
|
314
316
|
</script>
|
|
315
317
|
|
|
316
318
|
<style lang="scss" scoped>
|
|
317
|
-
@import '../../libs/
|
|
318
|
-
@import '../../libs/
|
|
319
|
-
|
|
319
|
+
@import '../../libs/style/components.scss';
|
|
320
|
+
@import '../../libs/style/color.scss';
|
|
320
321
|
$fontSize: 14px !default;
|
|
321
322
|
$color: #666666 !default;
|
|
322
323
|
$border-color: #DCDFE6 !default;
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
export default {
|
|
2
2
|
props: {
|
|
3
|
-
|
|
3
|
+
/**
|
|
4
|
+
* @description 选中的值
|
|
5
|
+
*/
|
|
4
6
|
value: {
|
|
5
7
|
type: [Array,String,Number],
|
|
6
8
|
default () {
|
|
@@ -13,24 +15,34 @@ export default {
|
|
|
13
15
|
return '';
|
|
14
16
|
}
|
|
15
17
|
},
|
|
16
|
-
|
|
18
|
+
/**
|
|
19
|
+
* @description 显示模式
|
|
20
|
+
* @default 'default'
|
|
21
|
+
*/
|
|
17
22
|
mode: {
|
|
18
23
|
type: String,
|
|
19
24
|
default: 'default'
|
|
20
25
|
},
|
|
21
|
-
|
|
26
|
+
/**
|
|
27
|
+
* @description 是否多选
|
|
28
|
+
* @default false
|
|
29
|
+
*/
|
|
22
30
|
multiple: {
|
|
23
31
|
type: Boolean,
|
|
24
32
|
default: false
|
|
25
33
|
},
|
|
26
|
-
|
|
34
|
+
/**
|
|
35
|
+
* @description 选择项数据,默认格式 [{text:'',value:''}],可通过map字段映射
|
|
36
|
+
*/
|
|
27
37
|
list: {
|
|
28
38
|
type: Array,
|
|
29
39
|
default () {
|
|
30
40
|
return []
|
|
31
41
|
}
|
|
32
42
|
},
|
|
33
|
-
|
|
43
|
+
/**
|
|
44
|
+
* @description 字段映射(默认 { text: 'text', value: 'value' })
|
|
45
|
+
*/
|
|
34
46
|
map:{
|
|
35
47
|
type: Object,
|
|
36
48
|
default () {
|
|
@@ -40,47 +52,72 @@ export default {
|
|
|
40
52
|
}
|
|
41
53
|
}
|
|
42
54
|
},
|
|
43
|
-
|
|
55
|
+
/**
|
|
56
|
+
* @description 最小选择个数(仅multiple=true时生效)
|
|
57
|
+
*/
|
|
44
58
|
min: {
|
|
45
59
|
type: [Number,String],
|
|
46
60
|
default: ''
|
|
47
61
|
},
|
|
48
|
-
|
|
62
|
+
/**
|
|
63
|
+
* @description 最大选择个数(仅multiple=true时生效)
|
|
64
|
+
*/
|
|
49
65
|
max: {
|
|
50
66
|
type: [Number,String],
|
|
51
67
|
default: ''
|
|
52
68
|
},
|
|
53
|
-
|
|
69
|
+
/**
|
|
70
|
+
* @description 是否换行显示
|
|
71
|
+
* @default false
|
|
72
|
+
*/
|
|
54
73
|
wrap: {
|
|
55
74
|
type: Boolean,
|
|
56
75
|
default: false
|
|
57
76
|
},
|
|
58
|
-
|
|
77
|
+
/**
|
|
78
|
+
* @description 是否禁用全部checkbox
|
|
79
|
+
* @default false
|
|
80
|
+
*/
|
|
59
81
|
disabled:{
|
|
60
82
|
type: Boolean,
|
|
61
83
|
default: false
|
|
62
84
|
},
|
|
63
|
-
|
|
85
|
+
/**
|
|
86
|
+
* @description 选中状态下的颜色
|
|
87
|
+
* @default '#2979ff'
|
|
88
|
+
*/
|
|
64
89
|
activeColor: {
|
|
65
90
|
type: String,
|
|
66
91
|
default: '#2979ff'
|
|
67
92
|
},
|
|
68
|
-
|
|
93
|
+
/**
|
|
94
|
+
* @description 形状
|
|
95
|
+
* @values 'circle' - 圆形, 'square' - 方形
|
|
96
|
+
* @default 'circle'
|
|
97
|
+
*/
|
|
69
98
|
shape: {
|
|
70
99
|
type: String,
|
|
71
100
|
default: 'circle'
|
|
72
101
|
},
|
|
73
|
-
|
|
102
|
+
/**
|
|
103
|
+
* @description 选中时,文本是否高亮(仅mode=default|list时生效)
|
|
104
|
+
* @default true
|
|
105
|
+
*/
|
|
74
106
|
highlight: {
|
|
75
107
|
type: Boolean,
|
|
76
108
|
default: true
|
|
77
109
|
},
|
|
78
|
-
|
|
110
|
+
/**
|
|
111
|
+
* @description 列表模式下icon显示位置(仅mode=list时生效)
|
|
112
|
+
* @default 'left'
|
|
113
|
+
*/
|
|
79
114
|
iconPos: {
|
|
80
115
|
type: String,
|
|
81
116
|
default: 'left'
|
|
82
117
|
},
|
|
83
|
-
|
|
118
|
+
/**
|
|
119
|
+
* @description 选中文本颜色,如为空则自动显示
|
|
120
|
+
*/
|
|
84
121
|
activeTextColor: {
|
|
85
122
|
type: String,
|
|
86
123
|
default: ''
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
* CodeInput 验证码输入
|
|
37
37
|
* @description 此组件一般用于验证用户短信验证码的场景,也可以结合fuui的键盘组件使用
|
|
38
38
|
* @property {String,Number} value / v-model 预置值
|
|
39
|
-
* @property {String,Number} maxlength 最大输入长度 (默认 4
|
|
39
|
+
* @property {String,Number} maxlength 最大输入长度 (默认 4)
|
|
40
40
|
* @property {Boolean} dot = [true|false] 是否用圆点填充 (默认 false )
|
|
41
41
|
* @property {String} mode = [box|line] 显示模式 (默认 'box' )
|
|
42
42
|
* @value box 盒子模式
|
|
@@ -45,13 +45,14 @@
|
|
|
45
45
|
* @property {String,Number} space 字符间的距离 (默认 10 )
|
|
46
46
|
* @property {Boolean} focus = [true|false] 是否自动获取焦点 (默认 false )
|
|
47
47
|
* @property {Boolean} bold = [true|false] 字体和输入横线是否加粗 (默认 false )
|
|
48
|
-
* @property {String} color 字体颜色 (默认 '#
|
|
48
|
+
* @property {String} color 字体颜色 (默认 '#626468' )
|
|
49
49
|
* @property {String,Number} fontSize 字体大小,单位px (默认 18 )
|
|
50
50
|
* @property {String,Number} size 输入框的大小,宽等于高 (默认 35 )
|
|
51
51
|
* @property {Boolean} disabledKeyboard = [true|false] 是否隐藏原生键盘,如果想用自定义键盘的话,需设置此参数为true (默认 false )
|
|
52
|
-
* @property {String} borderColor 边框和线条颜色 (默认 '#
|
|
52
|
+
* @property {String} borderColor 边框和线条颜色 (默认 '#cdcdce' )
|
|
53
53
|
* @property {Boolean} disabledDot = [true|false] 是否禁止输入"."符号 (默认 true )
|
|
54
54
|
* @property {String,Number} radius 自定义圆角 仅mode为box有效(默认 '4')
|
|
55
|
+
*
|
|
55
56
|
* @event {Function} change 输入内容发生改变时触发
|
|
56
57
|
* @event {Function} finish 输入字符个数达maxlength值时触发
|
|
57
58
|
* @example <fu-code-input v-model="value" :focus="true"></fu-code-input>
|
|
@@ -59,6 +60,7 @@
|
|
|
59
60
|
export default {
|
|
60
61
|
name: 'FuCodeInput',
|
|
61
62
|
mixins: [mpMixin, mixin, props],
|
|
63
|
+
emits: ['change', 'input', 'update:modelValue', 'finish'],
|
|
62
64
|
data() {
|
|
63
65
|
return {
|
|
64
66
|
inputValue: '',
|
|
@@ -186,18 +188,20 @@
|
|
|
186
188
|
}
|
|
187
189
|
</script>
|
|
188
190
|
<style lang="scss" scoped>
|
|
189
|
-
@import '../../libs/
|
|
190
|
-
@import '../../libs/
|
|
191
|
+
@import '../../libs/style/components.scss';
|
|
192
|
+
@import '../../libs/style/color.scss';
|
|
191
193
|
$fu-code-input-cursor-width: 1px;
|
|
192
194
|
$fu-code-input-cursor-height: 40%;
|
|
193
195
|
$fu-code-input-cursor-animation-duration: 1s;
|
|
194
196
|
$fu-code-input-cursor-animation-name: fu-cursor-flicker;
|
|
195
|
-
$fu-content-color: #
|
|
197
|
+
$fu-content-color: #787a7f;
|
|
196
198
|
|
|
197
199
|
.fu-code-input {
|
|
198
200
|
@include flex;
|
|
199
201
|
position: relative;
|
|
202
|
+
/* #ifndef APP-NVUE */
|
|
200
203
|
overflow: hidden;
|
|
204
|
+
/* #endif */
|
|
201
205
|
|
|
202
206
|
&__item {
|
|
203
207
|
@include flex;
|