@vtj/materials 0.13.15 → 0.13.17
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/dist/assets/antdv/index.umd.js +2 -2
- package/dist/assets/charts/index.umd.js +2 -2
- package/dist/assets/element/index.umd.js +3 -3
- package/dist/assets/icons/index.umd.js +2 -2
- package/dist/assets/ui/index.umd.js +2 -2
- package/dist/assets/uni-h5/index.umd.js +2 -2
- package/dist/assets/uni-ui/index.umd.js +2 -2
- package/dist/assets/vant/index.umd.js +2 -2
- package/dist/deps/@vtj/charts/index.umd.js +2 -2
- package/dist/deps/@vtj/icons/index.umd.js +2 -2
- package/dist/deps/@vtj/ui/index.umd.js +4 -4
- package/dist/deps/@vtj/ui/style.css +1 -1
- package/dist/deps/@vtj/utils/index.umd.js +28 -33
- package/dist/deps/@vueuse/core/index.iife.min.js +1 -1
- package/dist/deps/element-plus/index.css +1 -1
- package/dist/deps/element-plus/index.full.min.js +14 -14
- package/dist/deps/element-plus/zh-cn.js +1 -1
- package/dist/deps/uni-app/index.umd.js +1 -1
- package/dist/deps/uni-h5/index.umd.js +8 -8
- package/dist/deps/uni-h5/style.css +1 -1
- package/dist/deps/uni-h5-vue/index.umd.js +1 -1
- package/dist/deps/uni-ui/index.umd.js +6 -1
- package/dist/deps/uni-ui/style.css +1 -1
- package/dist/deps/vue/vue.global.js +88 -53
- package/dist/deps/vue/vue.global.prod.js +9 -9
- package/package.json +12 -12
- package/src/antdv/image.ts +1 -1
- package/src/element/image.ts +1 -1
- package/src/element/virtualizedTable.ts +6 -6
- package/src/manifest.json +69 -0
- package/src/pages/index.vue +2 -0
- package/src/pages.json +19 -0
- package/src/uni-ui/index.ts +88 -58
- package/src/{uni-ui/lib/uni.scss → uni.scss} +4 -0
- package/src/version.ts +2 -2
- package/src/uni-ui/lib/uni-col/uni-col.vue +0 -324
- package/src/uni-ui/lib/uni-collapse/uni-collapse.vue +0 -153
- package/src/uni-ui/lib/uni-collapse-item/uni-collapse-item.vue +0 -425
- package/src/uni-ui/lib/uni-data-picker/keypress.js +0 -45
- package/src/uni-ui/lib/uni-data-picker/uni-data-picker.vue +0 -604
- package/src/uni-ui/lib/uni-data-pickerview/uni-data-picker.js +0 -622
- package/src/uni-ui/lib/uni-data-pickerview/uni-data-pickerview.css +0 -76
- package/src/uni-ui/lib/uni-data-pickerview/uni-data-pickerview.vue +0 -335
- package/src/uni-ui/lib/uni-data-select/uni-data-select.vue +0 -590
- package/src/uni-ui/lib/uni-datetime-picker/calendar-item.vue +0 -188
- package/src/uni-ui/lib/uni-datetime-picker/calendar.vue +0 -985
- package/src/uni-ui/lib/uni-datetime-picker/i18n/en.json +0 -22
- package/src/uni-ui/lib/uni-datetime-picker/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-datetime-picker/i18n/zh-Hans.json +0 -22
- package/src/uni-ui/lib/uni-datetime-picker/i18n/zh-Hant.json +0 -22
- package/src/uni-ui/lib/uni-datetime-picker/time-picker.vue +0 -1032
- package/src/uni-ui/lib/uni-datetime-picker/uni-datetime-picker.vue +0 -1230
- package/src/uni-ui/lib/uni-datetime-picker/util.js +0 -448
- package/src/uni-ui/lib/uni-easyinput/common.js +0 -54
- package/src/uni-ui/lib/uni-easyinput/uni-easyinput.vue +0 -790
- package/src/uni-ui/lib/uni-fav/i18n/en.json +0 -4
- package/src/uni-ui/lib/uni-fav/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-fav/i18n/zh-Hans.json +0 -4
- package/src/uni-ui/lib/uni-fav/i18n/zh-Hant.json +0 -4
- package/src/uni-ui/lib/uni-fav/uni-fav.vue +0 -170
- package/src/uni-ui/lib/uni-file-picker/choose-and-upload-file.js +0 -280
- package/src/uni-ui/lib/uni-file-picker/uni-file-picker.vue +0 -668
- package/src/uni-ui/lib/uni-file-picker/upload-file.vue +0 -325
- package/src/uni-ui/lib/uni-file-picker/upload-image.vue +0 -292
- package/src/uni-ui/lib/uni-file-picker/utils.js +0 -110
- package/src/uni-ui/lib/uni-forms/uni-forms.vue +0 -416
- package/src/uni-ui/lib/uni-forms/utils.js +0 -293
- package/src/uni-ui/lib/uni-forms/validate.js +0 -486
- package/src/uni-ui/lib/uni-forms-item/uni-forms-item.vue +0 -630
- package/src/uni-ui/lib/uni-goods-nav/i18n/en.json +0 -6
- package/src/uni-ui/lib/uni-goods-nav/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-goods-nav/i18n/zh-Hans.json +0 -6
- package/src/uni-ui/lib/uni-goods-nav/i18n/zh-Hant.json +0 -6
- package/src/uni-ui/lib/uni-goods-nav/uni-goods-nav.vue +0 -231
- package/src/uni-ui/lib/uni-grid/uni-grid.vue +0 -148
- package/src/uni-ui/lib/uni-icons/uni-icons.uvue +0 -91
- package/src/uni-ui/lib/uni-icons/uni-icons.vue +0 -114
- package/src/uni-ui/lib/uni-icons/uniicons.css +0 -664
- package/src/uni-ui/lib/uni-icons/uniicons.ttf +0 -0
- package/src/uni-ui/lib/uni-icons/uniicons_file.ts +0 -664
- package/src/uni-ui/lib/uni-icons/uniicons_file_vue.js +0 -649
- package/src/uni-ui/lib/uni-indexed-list/uni-indexed-list-item.vue +0 -168
- package/src/uni-ui/lib/uni-indexed-list/uni-indexed-list.vue +0 -404
- package/src/uni-ui/lib/uni-list/uni-list.vue +0 -123
- package/src/uni-ui/lib/uni-list/uni-refresh.vue +0 -65
- package/src/uni-ui/lib/uni-list/uni-refresh.wxs +0 -87
- package/src/uni-ui/lib/uni-load-more/i18n/en.json +0 -5
- package/src/uni-ui/lib/uni-load-more/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-load-more/i18n/zh-Hans.json +0 -5
- package/src/uni-ui/lib/uni-load-more/i18n/zh-Hant.json +0 -5
- package/src/uni-ui/lib/uni-load-more/uni-load-more.vue +0 -456
- package/src/uni-ui/lib/uni-notice-bar/uni-notice-bar.vue +0 -484
- package/src/uni-ui/lib/uni-popup/i18n/en.json +0 -7
- package/src/uni-ui/lib/uni-popup/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-popup/i18n/zh-Hans.json +0 -7
- package/src/uni-ui/lib/uni-popup/i18n/zh-Hant.json +0 -7
- package/src/uni-ui/lib/uni-popup/keypress.js +0 -45
- package/src/uni-ui/lib/uni-popup/popup.js +0 -26
- package/src/uni-ui/lib/uni-popup/uni-popup.uvue +0 -90
- package/src/uni-ui/lib/uni-popup/uni-popup.vue +0 -552
- package/src/uni-ui/lib/uni-popup-dialog/keypress.js +0 -45
- package/src/uni-ui/lib/uni-popup-dialog/uni-popup-dialog.vue +0 -324
- package/src/uni-ui/lib/uni-popup-message/uni-popup-message.vue +0 -149
- package/src/uni-ui/lib/uni-rate/uni-rate.vue +0 -380
- package/src/uni-ui/lib/uni-row/uni-row.vue +0 -193
- package/src/uni-ui/lib/uni-search-bar/i18n/en.json +0 -4
- package/src/uni-ui/lib/uni-search-bar/i18n/index.js +0 -8
- package/src/uni-ui/lib/uni-search-bar/i18n/zh-Hans.json +0 -4
- package/src/uni-ui/lib/uni-search-bar/i18n/zh-Hant.json +0 -4
- package/src/uni-ui/lib/uni-search-bar/uni-search-bar.vue +0 -339
- package/src/uni-ui/lib/uni-swipe-action-item/bindingx.js +0 -311
- package/src/uni-ui/lib/uni-swipe-action-item/isPC.js +0 -12
- package/src/uni-ui/lib/uni-swipe-action-item/mpalipay.js +0 -195
- package/src/uni-ui/lib/uni-swipe-action-item/mpother.js +0 -260
- package/src/uni-ui/lib/uni-swipe-action-item/mpwxs.js +0 -84
- package/src/uni-ui/lib/uni-swipe-action-item/render.js +0 -270
- package/src/uni-ui/lib/uni-swipe-action-item/uni-swipe-action-item.vue +0 -493
- package/src/uni-ui/lib/uni-swipe-action-item/wx.wxs +0 -341
- package/src/uni-ui/lib/uni-table/uni-table.vue +0 -496
- package/src/uni-ui/lib/uni-td/uni-td.vue +0 -99
- package/src/uni-ui/lib/uni-th/filter-dropdown.vue +0 -559
- package/src/uni-ui/lib/uni-th/uni-th.vue +0 -322
- package/src/uni-ui/lib/uni-tr/table-checkbox.vue +0 -181
- package/src/uni-ui/lib/uni-tr/uni-tr.vue +0 -208
- package/src/uni-ui/lib/uni-transition/createAnimation.js +0 -131
- package/src/uni-ui/lib/uni-transition/uni-transition.vue +0 -310
- package/src/uni-ui/polyfill.ts +0 -41
@@ -1,630 +0,0 @@
|
|
1
|
-
<template>
|
2
|
-
<view
|
3
|
-
class="uni-forms-item"
|
4
|
-
:class="[
|
5
|
-
'is-direction-' + localLabelPos,
|
6
|
-
border ? 'uni-forms-item--border' : '',
|
7
|
-
border && isFirstBorder ? 'is-first-border' : ''
|
8
|
-
]">
|
9
|
-
<slot name="label">
|
10
|
-
<view
|
11
|
-
class="uni-forms-item__label"
|
12
|
-
:class="{ 'no-label': !label && !required }"
|
13
|
-
:style="{ width: localLabelWidth, justifyContent: localLabelAlign }">
|
14
|
-
<text v-if="required" class="is-required">*</text>
|
15
|
-
<text>{{ label }}</text>
|
16
|
-
</view>
|
17
|
-
</slot>
|
18
|
-
<!-- #ifndef APP-NVUE -->
|
19
|
-
<!-- <view class="uni-forms-item__content">
|
20
|
-
<slot></slot>
|
21
|
-
<view class="uni-forms-item__error" :class="{'msg--active':msg}">
|
22
|
-
<text>{{msg}}</text>
|
23
|
-
</view>
|
24
|
-
</view> -->
|
25
|
-
<!-- #endif -->
|
26
|
-
<!-- #ifdef APP-NVUE -->
|
27
|
-
<view class="uni-forms-item__nuve-content">
|
28
|
-
<view class="uni-forms-item__content">
|
29
|
-
<slot></slot>
|
30
|
-
</view>
|
31
|
-
<view class="uni-forms-item__error" :class="{ 'msg--active': msg }">
|
32
|
-
<text class="error-text">{{ msg }}</text>
|
33
|
-
</view>
|
34
|
-
</view>
|
35
|
-
<!-- #endif -->
|
36
|
-
</view>
|
37
|
-
</template>
|
38
|
-
|
39
|
-
<script>
|
40
|
-
/**
|
41
|
-
* uni-fomrs-item 表单子组件
|
42
|
-
* @description uni-fomrs-item 表单子组件,提供了基础布局已经校验能力
|
43
|
-
* @tutorial https://ext.dcloud.net.cn/plugin?id=2773
|
44
|
-
* @property {Boolean} required 是否必填,左边显示红色"*"号
|
45
|
-
* @property {String } label 输入框左边的文字提示
|
46
|
-
* @property {Number } labelWidth label的宽度,单位px(默认70)
|
47
|
-
* @property {String } labelAlign = [left|center|right] label的文字对齐方式(默认left)
|
48
|
-
* @value left label 左侧显示
|
49
|
-
* @value center label 居中
|
50
|
-
* @value right label 右侧对齐
|
51
|
-
* @property {String } errorMessage 显示的错误提示内容,如果为空字符串或者false,则不显示错误信息
|
52
|
-
* @property {String } name 表单域的属性名,在使用校验规则时必填
|
53
|
-
* @property {String } leftIcon 【1.4.0废弃】label左边的图标,限 uni-ui 的图标名称
|
54
|
-
* @property {String } iconColor 【1.4.0废弃】左边通过icon配置的图标的颜色(默认#606266)
|
55
|
-
* @property {String} validateTrigger = [bind|submit|blur] 【1.4.0废弃】校验触发器方式 默认 submit
|
56
|
-
* @value bind 发生变化时触发
|
57
|
-
* @value submit 提交时触发
|
58
|
-
* @value blur 失去焦点触发
|
59
|
-
* @property {String } labelPosition = [top|left] 【1.4.0废弃】label的文字的位置(默认left)
|
60
|
-
* @value top 顶部显示 label
|
61
|
-
* @value left 左侧显示 label
|
62
|
-
*/
|
63
|
-
|
64
|
-
export default {
|
65
|
-
name: 'uniFormsItem',
|
66
|
-
options: {
|
67
|
-
// #ifdef MP-TOUTIAO
|
68
|
-
virtualHost: false,
|
69
|
-
// #endif
|
70
|
-
// #ifndef MP-TOUTIAO
|
71
|
-
virtualHost: true
|
72
|
-
// #endif
|
73
|
-
},
|
74
|
-
provide() {
|
75
|
-
return {
|
76
|
-
uniFormItem: this
|
77
|
-
};
|
78
|
-
},
|
79
|
-
inject: {
|
80
|
-
form: {
|
81
|
-
from: 'uniForm',
|
82
|
-
default: null
|
83
|
-
}
|
84
|
-
},
|
85
|
-
props: {
|
86
|
-
// 表单校验规则
|
87
|
-
rules: {
|
88
|
-
type: Array,
|
89
|
-
default() {
|
90
|
-
return null;
|
91
|
-
}
|
92
|
-
},
|
93
|
-
// 表单域的属性名,在使用校验规则时必填
|
94
|
-
name: {
|
95
|
-
type: [String, Array],
|
96
|
-
default: ''
|
97
|
-
},
|
98
|
-
required: {
|
99
|
-
type: Boolean,
|
100
|
-
default: false
|
101
|
-
},
|
102
|
-
label: {
|
103
|
-
type: String,
|
104
|
-
default: ''
|
105
|
-
},
|
106
|
-
// label的宽度
|
107
|
-
labelWidth: {
|
108
|
-
type: [String, Number],
|
109
|
-
default: ''
|
110
|
-
},
|
111
|
-
// label 居中方式,默认 left 取值 left/center/right
|
112
|
-
labelAlign: {
|
113
|
-
type: String,
|
114
|
-
default: ''
|
115
|
-
},
|
116
|
-
// 强制显示错误信息
|
117
|
-
errorMessage: {
|
118
|
-
type: [String, Boolean],
|
119
|
-
default: ''
|
120
|
-
},
|
121
|
-
// 1.4.0 弃用,统一使用 form 的校验时机
|
122
|
-
// validateTrigger: {
|
123
|
-
// type: String,
|
124
|
-
// default: ''
|
125
|
-
// },
|
126
|
-
// 1.4.0 弃用,统一使用 form 的label 位置
|
127
|
-
// labelPosition: {
|
128
|
-
// type: String,
|
129
|
-
// default: ''
|
130
|
-
// },
|
131
|
-
// 1.4.0 以下属性已经废弃,请使用 #label 插槽代替
|
132
|
-
leftIcon: String,
|
133
|
-
iconColor: {
|
134
|
-
type: String,
|
135
|
-
default: '#606266'
|
136
|
-
}
|
137
|
-
},
|
138
|
-
data() {
|
139
|
-
return {
|
140
|
-
errMsg: '',
|
141
|
-
userRules: null,
|
142
|
-
localLabelAlign: 'left',
|
143
|
-
localLabelWidth: '70px',
|
144
|
-
localLabelPos: 'left',
|
145
|
-
border: false,
|
146
|
-
isFirstBorder: false
|
147
|
-
};
|
148
|
-
},
|
149
|
-
computed: {
|
150
|
-
// 处理错误信息
|
151
|
-
msg() {
|
152
|
-
return this.errorMessage || this.errMsg;
|
153
|
-
}
|
154
|
-
},
|
155
|
-
watch: {
|
156
|
-
// 规则发生变化通知子组件更新
|
157
|
-
'form.formRules'(val) {
|
158
|
-
// TODO 处理头条vue3 watch不生效的问题
|
159
|
-
// #ifndef MP-TOUTIAO
|
160
|
-
this.init();
|
161
|
-
// #endif
|
162
|
-
},
|
163
|
-
'form.labelWidth'(val) {
|
164
|
-
// 宽度
|
165
|
-
this.localLabelWidth = this._labelWidthUnit(val);
|
166
|
-
},
|
167
|
-
'form.labelPosition'(val) {
|
168
|
-
// 标签位置
|
169
|
-
this.localLabelPos = this._labelPosition();
|
170
|
-
},
|
171
|
-
'form.labelAlign'(val) {}
|
172
|
-
},
|
173
|
-
created() {
|
174
|
-
this.init(true);
|
175
|
-
if (this.name && this.form) {
|
176
|
-
// TODO 处理头条vue3 watch不生效的问题
|
177
|
-
// #ifdef MP-TOUTIAO
|
178
|
-
this.$watch('form.formRules', () => {
|
179
|
-
this.init();
|
180
|
-
});
|
181
|
-
// #endif
|
182
|
-
|
183
|
-
// 监听变化
|
184
|
-
this.$watch(
|
185
|
-
() => {
|
186
|
-
const val = this.form._getDataValue(this.name, this.form.localData);
|
187
|
-
return val;
|
188
|
-
},
|
189
|
-
(value, oldVal) => {
|
190
|
-
const isEqual = this.form._isEqual(value, oldVal);
|
191
|
-
// 简单判断前后值的变化,只有发生变化才会发生校验
|
192
|
-
// TODO 如果 oldVal = undefined ,那么大概率是源数据里没有值导致 ,这个情况不哦校验 ,可能不严谨 ,需要在做观察
|
193
|
-
// fix by mehaotian 暂时取消 && oldVal !== undefined ,如果formData 中不存在,可能会不校验
|
194
|
-
if (!isEqual) {
|
195
|
-
const val = this.itemSetValue(value);
|
196
|
-
this.onFieldChange(val, false);
|
197
|
-
}
|
198
|
-
},
|
199
|
-
{
|
200
|
-
immediate: false
|
201
|
-
}
|
202
|
-
);
|
203
|
-
}
|
204
|
-
},
|
205
|
-
// #ifndef VUE3
|
206
|
-
destroyed() {
|
207
|
-
if (this.__isUnmounted) return;
|
208
|
-
this.unInit();
|
209
|
-
},
|
210
|
-
// #endif
|
211
|
-
// #ifdef VUE3
|
212
|
-
unmounted() {
|
213
|
-
this.__isUnmounted = true;
|
214
|
-
this.unInit();
|
215
|
-
},
|
216
|
-
// #endif
|
217
|
-
methods: {
|
218
|
-
/**
|
219
|
-
* 外部调用方法
|
220
|
-
* 设置规则 ,主要用于小程序自定义检验规则
|
221
|
-
* @param {Array} rules 规则源数据
|
222
|
-
*/
|
223
|
-
setRules(rules = null) {
|
224
|
-
this.userRules = rules;
|
225
|
-
this.init(false);
|
226
|
-
},
|
227
|
-
// 兼容老版本表单组件
|
228
|
-
setValue() {
|
229
|
-
// console.log('setValue 方法已经弃用,请使用最新版本的 uni-forms 表单组件以及其他关联组件。');
|
230
|
-
},
|
231
|
-
/**
|
232
|
-
* 外部调用方法
|
233
|
-
* 校验数据
|
234
|
-
* @param {any} value 需要校验的数据
|
235
|
-
* @param {boolean} 是否立即校验
|
236
|
-
* @return {Array|null} 校验内容
|
237
|
-
*/
|
238
|
-
async onFieldChange(value, formtrigger = true) {
|
239
|
-
const {
|
240
|
-
formData,
|
241
|
-
localData,
|
242
|
-
errShowType,
|
243
|
-
validateCheck,
|
244
|
-
validateTrigger,
|
245
|
-
_isRequiredField,
|
246
|
-
_realName
|
247
|
-
} = this.form;
|
248
|
-
const name = _realName(this.name);
|
249
|
-
if (!value) {
|
250
|
-
value = this.form.formData[name];
|
251
|
-
}
|
252
|
-
// fixd by mehaotian 不在校验前清空信息,解决闪屏的问题
|
253
|
-
// this.errMsg = '';
|
254
|
-
|
255
|
-
// fix by mehaotian 解决没有检验规则的情况下,抛出错误的问题
|
256
|
-
const ruleLen = this.itemRules.rules && this.itemRules.rules.length;
|
257
|
-
if (!this.validator || !ruleLen || ruleLen === 0) return;
|
258
|
-
|
259
|
-
// 检验时机
|
260
|
-
// let trigger = this.isTrigger(this.itemRules.validateTrigger, this.validateTrigger, validateTrigger);
|
261
|
-
const isRequiredField = _isRequiredField(this.itemRules.rules || []);
|
262
|
-
let result = null;
|
263
|
-
// 只有等于 bind 时 ,才能开启时实校验
|
264
|
-
if (validateTrigger === 'bind' || formtrigger) {
|
265
|
-
// 校验当前表单项
|
266
|
-
result = await this.validator.validateUpdate(
|
267
|
-
{
|
268
|
-
[name]: value
|
269
|
-
},
|
270
|
-
formData
|
271
|
-
);
|
272
|
-
|
273
|
-
// 判断是否必填,非必填,不填不校验,填写才校验 ,暂时只处理 undefined 和空的情况
|
274
|
-
if (!isRequiredField && (value === undefined || value === '')) {
|
275
|
-
result = null;
|
276
|
-
}
|
277
|
-
|
278
|
-
// 判断错误信息显示类型
|
279
|
-
if (result && result.errorMessage) {
|
280
|
-
if (errShowType === 'undertext') {
|
281
|
-
// 获取错误信息
|
282
|
-
this.errMsg = !result ? '' : result.errorMessage;
|
283
|
-
}
|
284
|
-
if (errShowType === 'toast') {
|
285
|
-
uni.showToast({
|
286
|
-
title: result.errorMessage || '校验错误',
|
287
|
-
icon: 'none'
|
288
|
-
});
|
289
|
-
}
|
290
|
-
if (errShowType === 'modal') {
|
291
|
-
uni.showModal({
|
292
|
-
title: '提示',
|
293
|
-
content: result.errorMessage || '校验错误'
|
294
|
-
});
|
295
|
-
}
|
296
|
-
} else {
|
297
|
-
this.errMsg = '';
|
298
|
-
}
|
299
|
-
// 通知 form 组件更新事件
|
300
|
-
validateCheck(result ? result : null);
|
301
|
-
} else {
|
302
|
-
this.errMsg = '';
|
303
|
-
}
|
304
|
-
return result ? result : null;
|
305
|
-
},
|
306
|
-
/**
|
307
|
-
* 初始组件数据
|
308
|
-
*/
|
309
|
-
init(type = false) {
|
310
|
-
const {
|
311
|
-
validator,
|
312
|
-
formRules,
|
313
|
-
childrens,
|
314
|
-
formData,
|
315
|
-
localData,
|
316
|
-
_realName,
|
317
|
-
labelWidth,
|
318
|
-
_getDataValue,
|
319
|
-
_setDataValue
|
320
|
-
} = this.form || {};
|
321
|
-
// 对齐方式
|
322
|
-
this.localLabelAlign = this._justifyContent();
|
323
|
-
// 宽度
|
324
|
-
this.localLabelWidth = this._labelWidthUnit(labelWidth);
|
325
|
-
// 标签位置
|
326
|
-
this.localLabelPos = this._labelPosition();
|
327
|
-
// 将需要校验的子组件加入form 队列
|
328
|
-
this.form && type && childrens.push(this);
|
329
|
-
|
330
|
-
if (!validator || !formRules) return;
|
331
|
-
// 判断第一个 item
|
332
|
-
if (!this.form.isFirstBorder) {
|
333
|
-
this.form.isFirstBorder = true;
|
334
|
-
this.isFirstBorder = true;
|
335
|
-
}
|
336
|
-
|
337
|
-
// 判断 group 里的第一个 item
|
338
|
-
if (this.group) {
|
339
|
-
if (!this.group.isFirstBorder) {
|
340
|
-
this.group.isFirstBorder = true;
|
341
|
-
this.isFirstBorder = true;
|
342
|
-
}
|
343
|
-
}
|
344
|
-
this.border = this.form.border;
|
345
|
-
// 获取子域的真实名称
|
346
|
-
const name = _realName(this.name);
|
347
|
-
const itemRule = this.userRules || this.rules;
|
348
|
-
if (typeof formRules === 'object' && itemRule) {
|
349
|
-
// 子规则替换父规则
|
350
|
-
formRules[name] = {
|
351
|
-
rules: itemRule
|
352
|
-
};
|
353
|
-
validator.updateSchema(formRules);
|
354
|
-
}
|
355
|
-
// 注册校验规则
|
356
|
-
const itemRules = formRules[name] || {};
|
357
|
-
this.itemRules = itemRules;
|
358
|
-
// 注册校验函数
|
359
|
-
this.validator = validator;
|
360
|
-
// 默认值赋予
|
361
|
-
this.itemSetValue(_getDataValue(this.name, localData));
|
362
|
-
},
|
363
|
-
unInit() {
|
364
|
-
if (this.form) {
|
365
|
-
const { childrens, formData, _realName } = this.form;
|
366
|
-
childrens.forEach((item, index) => {
|
367
|
-
if (item === this) {
|
368
|
-
this.form.childrens.splice(index, 1);
|
369
|
-
delete formData[_realName(item.name)];
|
370
|
-
}
|
371
|
-
});
|
372
|
-
}
|
373
|
-
},
|
374
|
-
// 设置item 的值
|
375
|
-
itemSetValue(value) {
|
376
|
-
const name = this.form._realName(this.name);
|
377
|
-
const rules = this.itemRules.rules || [];
|
378
|
-
const val = this.form._getValue(name, value, rules);
|
379
|
-
this.form._setDataValue(name, this.form.formData, val);
|
380
|
-
return val;
|
381
|
-
},
|
382
|
-
|
383
|
-
/**
|
384
|
-
* 移除该表单项的校验结果
|
385
|
-
*/
|
386
|
-
clearValidate() {
|
387
|
-
this.errMsg = '';
|
388
|
-
},
|
389
|
-
|
390
|
-
// 是否显示星号
|
391
|
-
_isRequired() {
|
392
|
-
// TODO 不根据规则显示 星号,考虑后续兼容
|
393
|
-
// if (this.form) {
|
394
|
-
// if (this.form._isRequiredField(this.itemRules.rules || []) && this.required) {
|
395
|
-
// return true
|
396
|
-
// }
|
397
|
-
// return false
|
398
|
-
// }
|
399
|
-
return this.required;
|
400
|
-
},
|
401
|
-
|
402
|
-
// 处理对齐方式
|
403
|
-
_justifyContent() {
|
404
|
-
if (this.form) {
|
405
|
-
const { labelAlign } = this.form;
|
406
|
-
let labelAli = this.labelAlign ? this.labelAlign : labelAlign;
|
407
|
-
if (labelAli === 'left') return 'flex-start';
|
408
|
-
if (labelAli === 'center') return 'center';
|
409
|
-
if (labelAli === 'right') return 'flex-end';
|
410
|
-
}
|
411
|
-
return 'flex-start';
|
412
|
-
},
|
413
|
-
// 处理 label宽度单位 ,继承父元素的值
|
414
|
-
_labelWidthUnit(labelWidth) {
|
415
|
-
// if (this.form) {
|
416
|
-
// const {
|
417
|
-
// labelWidth
|
418
|
-
// } = this.form
|
419
|
-
return this.num2px(
|
420
|
-
this.labelWidth
|
421
|
-
? this.labelWidth
|
422
|
-
: labelWidth || (this.label ? 70 : 'auto')
|
423
|
-
);
|
424
|
-
// }
|
425
|
-
// return '70px'
|
426
|
-
},
|
427
|
-
// 处理 label 位置
|
428
|
-
_labelPosition() {
|
429
|
-
if (this.form) return this.form.labelPosition || 'left';
|
430
|
-
return 'left';
|
431
|
-
},
|
432
|
-
|
433
|
-
/**
|
434
|
-
* 触发时机
|
435
|
-
* @param {Object} rule 当前规则内时机
|
436
|
-
* @param {Object} itemRlue 当前组件时机
|
437
|
-
* @param {Object} parentRule 父组件时机
|
438
|
-
*/
|
439
|
-
isTrigger(rule, itemRlue, parentRule) {
|
440
|
-
// bind submit
|
441
|
-
if (rule === 'submit' || !rule) {
|
442
|
-
if (rule === undefined) {
|
443
|
-
if (itemRlue !== 'bind') {
|
444
|
-
if (!itemRlue) {
|
445
|
-
return parentRule === '' ? 'bind' : 'submit';
|
446
|
-
}
|
447
|
-
return 'submit';
|
448
|
-
}
|
449
|
-
return 'bind';
|
450
|
-
}
|
451
|
-
return 'submit';
|
452
|
-
}
|
453
|
-
return 'bind';
|
454
|
-
},
|
455
|
-
num2px(num) {
|
456
|
-
if (typeof num === 'number') {
|
457
|
-
return `${num}px`;
|
458
|
-
}
|
459
|
-
return num;
|
460
|
-
}
|
461
|
-
}
|
462
|
-
};
|
463
|
-
</script>
|
464
|
-
|
465
|
-
<style lang="scss">
|
466
|
-
.uni-forms-item {
|
467
|
-
position: relative;
|
468
|
-
display: flex;
|
469
|
-
/* #ifdef APP-NVUE */
|
470
|
-
// 在 nvue 中,使用 margin-bottom error 信息会被隐藏
|
471
|
-
padding-bottom: 22px;
|
472
|
-
/* #endif */
|
473
|
-
/* #ifndef APP-NVUE */
|
474
|
-
margin-bottom: 22px;
|
475
|
-
/* #endif */
|
476
|
-
flex-direction: row;
|
477
|
-
|
478
|
-
&__label {
|
479
|
-
display: flex;
|
480
|
-
flex-direction: row;
|
481
|
-
align-items: center;
|
482
|
-
text-align: left;
|
483
|
-
font-size: 14px;
|
484
|
-
color: #606266;
|
485
|
-
height: 36px;
|
486
|
-
padding: 0 12px 0 0;
|
487
|
-
/* #ifndef APP-NVUE */
|
488
|
-
vertical-align: middle;
|
489
|
-
flex-shrink: 0;
|
490
|
-
/* #endif */
|
491
|
-
|
492
|
-
/* #ifndef APP-NVUE */
|
493
|
-
box-sizing: border-box;
|
494
|
-
|
495
|
-
/* #endif */
|
496
|
-
&.no-label {
|
497
|
-
padding: 0;
|
498
|
-
}
|
499
|
-
}
|
500
|
-
|
501
|
-
&__content {
|
502
|
-
/* #ifndef MP-TOUTIAO */
|
503
|
-
// display: flex;
|
504
|
-
// align-items: center;
|
505
|
-
/* #endif */
|
506
|
-
position: relative;
|
507
|
-
font-size: 14px;
|
508
|
-
flex: 1;
|
509
|
-
/* #ifndef APP-NVUE */
|
510
|
-
box-sizing: border-box;
|
511
|
-
/* #endif */
|
512
|
-
flex-direction: row;
|
513
|
-
|
514
|
-
/* #ifndef APP || H5 || MP-WEIXIN || APP-NVUE */
|
515
|
-
// TODO 因为小程序平台会多一层标签节点 ,所以需要在多余节点继承当前样式
|
516
|
-
& > uni-easyinput,
|
517
|
-
& > uni-data-picker {
|
518
|
-
width: 100%;
|
519
|
-
}
|
520
|
-
|
521
|
-
/* #endif */
|
522
|
-
}
|
523
|
-
|
524
|
-
& .uni-forms-item__nuve-content {
|
525
|
-
display: flex;
|
526
|
-
flex-direction: column;
|
527
|
-
flex: 1;
|
528
|
-
}
|
529
|
-
|
530
|
-
&__error {
|
531
|
-
color: #f56c6c;
|
532
|
-
font-size: 12px;
|
533
|
-
line-height: 1;
|
534
|
-
padding-top: 4px;
|
535
|
-
position: absolute;
|
536
|
-
/* #ifndef APP-NVUE */
|
537
|
-
top: 100%;
|
538
|
-
left: 0;
|
539
|
-
transition: transform 0.3s;
|
540
|
-
transform: translateY(-100%);
|
541
|
-
/* #endif */
|
542
|
-
/* #ifdef APP-NVUE */
|
543
|
-
bottom: 5px;
|
544
|
-
/* #endif */
|
545
|
-
|
546
|
-
opacity: 0;
|
547
|
-
|
548
|
-
.error-text {
|
549
|
-
// 只有 nvue 下这个样式才生效
|
550
|
-
color: #f56c6c;
|
551
|
-
font-size: 12px;
|
552
|
-
}
|
553
|
-
|
554
|
-
&.msg--active {
|
555
|
-
opacity: 1;
|
556
|
-
transform: translateY(0%);
|
557
|
-
}
|
558
|
-
}
|
559
|
-
|
560
|
-
// 位置修饰样式
|
561
|
-
&.is-direction-left {
|
562
|
-
flex-direction: row;
|
563
|
-
}
|
564
|
-
|
565
|
-
&.is-direction-top {
|
566
|
-
flex-direction: column;
|
567
|
-
|
568
|
-
.uni-forms-item__label {
|
569
|
-
padding: 0 0 8px;
|
570
|
-
line-height: 1.5715;
|
571
|
-
text-align: left;
|
572
|
-
/* #ifndef APP-NVUE */
|
573
|
-
white-space: initial;
|
574
|
-
/* #endif */
|
575
|
-
}
|
576
|
-
}
|
577
|
-
|
578
|
-
.is-required {
|
579
|
-
// color: $uni-color-error;
|
580
|
-
color: #dd524d;
|
581
|
-
font-weight: bold;
|
582
|
-
}
|
583
|
-
}
|
584
|
-
|
585
|
-
.uni-forms-item--border {
|
586
|
-
margin-bottom: 0;
|
587
|
-
padding: 10px 0;
|
588
|
-
// padding-bottom: 0;
|
589
|
-
border-top: 1px #eee solid;
|
590
|
-
|
591
|
-
/* #ifndef APP-NVUE */
|
592
|
-
.uni-forms-item__content {
|
593
|
-
flex-direction: column;
|
594
|
-
justify-content: flex-start;
|
595
|
-
align-items: flex-start;
|
596
|
-
|
597
|
-
.uni-forms-item__error {
|
598
|
-
position: relative;
|
599
|
-
top: 5px;
|
600
|
-
left: 0;
|
601
|
-
padding-top: 0;
|
602
|
-
}
|
603
|
-
}
|
604
|
-
|
605
|
-
/* #endif */
|
606
|
-
|
607
|
-
/* #ifdef APP-NVUE */
|
608
|
-
display: flex;
|
609
|
-
flex-direction: column;
|
610
|
-
|
611
|
-
.uni-forms-item__error {
|
612
|
-
position: relative;
|
613
|
-
top: 0px;
|
614
|
-
left: 0;
|
615
|
-
padding-top: 0;
|
616
|
-
margin-top: 5px;
|
617
|
-
}
|
618
|
-
|
619
|
-
/* #endif */
|
620
|
-
}
|
621
|
-
|
622
|
-
.is-first-border {
|
623
|
-
/* #ifndef APP-NVUE */
|
624
|
-
border: none;
|
625
|
-
/* #endif */
|
626
|
-
/* #ifdef APP-NVUE */
|
627
|
-
border-width: 0;
|
628
|
-
/* #endif */
|
629
|
-
}
|
630
|
-
</style>
|