Merge branch 'master' of ssh://dev.zhiheiot.com:29418/mob-components

Tevin

2021-03-25 045b88b31958b2b639c2cb6a8476960ad5293007

 forms/form/CFormItem.vue

@@ -6,17 +6,7 @@

<template>
    <view class="c-form-item">
        <view class="c-form-item-label">
            <text
                class="required"
                v-if="required"
            >*</text>
            <text>{{label || name}}</text>
        </view>
        <slot
            :value="formData[name]"
            :onChange="evt=>onChange(evt)"
        />
        <slot :itemRes="itemRes" />
    </view>
</template>

@@ -31,10 +21,40 @@
        label: String,
        required: Boolean,
        rules: Array,
        formData: Object,
        formRes: Object,
    },
    data() {
        return {};
        return {
            error: false,
        };
    },
    computed: {
        itemRes() {
            return {
                formData: this.formRes.formData,
                name: this.name,
                label: this.label,
                required: this.isRequired,
                error: this.error,
                onChange: evt => this.onChange(evt),
            };
        },
        isRequired() {
            if (this.required) {
                return true;
            } else {
                if (!this.rules || this.rules.length === 0) {
                    return false;
                } else if (this.rules.length > 0) {
                    for (let rule of this.rules) {
                        if (rule.required) {
                            return true;
                        }
                    }
                    return false;
                }
            }
        },
    },
    methods: {
        onChange(evt) {
@@ -46,15 +66,16 @@
                    !hasOwn.call(evt, 'constructor') &&
                    !hasOwn.call(evt.constructor.prototype, 'isPrototypeOf')
                ) {
                    throw new Error('错误的表单项 onChange 参数类型！（At: ' + this.name + '）');
                    return;
                    throw new Error(
                        '错误的表单项 onChange 参数类型！（At: ' + this.name + '）'
                    );
                }
            }
            // 未改变值不触发
            if (this.formData[this.name] === evt) {
            if (this.formRes.formData[this.name] === evt) {
                return;
            }
            this.formData.$handleChange({
            this.formRes.$handleChange({
                [this.name]: evt,
            });
        },
@@ -63,13 +84,15 @@
        this.$nextTick(() => {
            // 未设置验证
            if (!this.required && !this.rules) {
                this.formData.$regItemValidator(this.name, () => {
                this.formRes.$regItemValidator(this.name, validateType => {
                    this.error = false;
                    return Promise.resolve({
                        name: this.name,
                        passed: true,
                    });
                });
            } else {
                // 验证规则
                const descriptor = this.rules || [];
                if (this.required) {
                    descriptor.unshift({
@@ -79,20 +102,31 @@
                const validator = new Schema({
                    [this.name]: descriptor,
                });
                validator.messages(validateMsgs); // 自定义验证消息
                this.formData.$regItemValidator(this.name, () => {
                // 汉化通用验证消息
                validator.messages(validateMsgs);
                // 注册验证
                let errTimer = null;
                this.formRes.$regItemValidator(this.name, validateType => {
                    return validator
                        .validate({
                            [this.name]: this.formData[this.name],
                            [this.name]: this.formRes.formData[this.name],
                        })
                        .then(
                            (res) => {
                            res => {
                                this.error = false;
                                return {
                                    name: this.name,
                                    passed: true,
                                };
                            },
                            ({ errors, fields }) => {
                                if (validateType !== 'msgOnly') {
                                    this.error = true;
                                    clearTimeout(errTimer);
                                    errTimer = setTimeout(() => {
                                        this.error = false;
                                    }, 5000);
                                }
                                return {
                                    name: this.name,
                                    passed: false,
@@ -108,7 +142,7 @@
        });
    },
    beforeDestroy() {
        this.formData.$regItemValidator(this.name, null);
        this.formRes.$regItemValidator(this.name, null);
    },
};
</script>