From a993b23697d0aa04bccb48a870bebd3df35431c2 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Fri, 07 Mar 2025 12:26:55 +0800 Subject: [PATCH] 知识库,改写请求基类主要方法列表,放弃代码注释的表达方式,改用表格模式 --- forms/form/CFormItem.vue | 135 ++++++++++++++++++++++++++++----------------- 1 files changed, 84 insertions(+), 51 deletions(-) diff --git a/forms/form/CFormItem.vue b/forms/form/CFormItem.vue index 3913dc1..a47639f 100644 --- a/forms/form/CFormItem.vue +++ b/forms/form/CFormItem.vue @@ -5,12 +5,16 @@ */ <template> - <view class="c-form-item"> + <view + class="c-form-item" + ref="formItem" + > <slot :itemRes="itemRes" /> </view> </template> <script> +import { $ } from '@tarojs/extend'; import Schema from 'async-validator'; import { validateMsgs } from './validateMsgs.js'; @@ -37,10 +41,13 @@ // transform (value) => any 将字段值转换成目标值后进行校验 // message string 错误信息,不设置时会通过模板自动生成 rules: Array, + // 表单是否禁用 + disabled: Boolean, }, data() { return { error: false, + errTimer: -1, }; }, computed: { @@ -50,6 +57,7 @@ name: this.name, label: this.label, required: this.isRequired, + disabled: this.disabled, error: this.error, onChange: evt => this.onChange(evt), }; @@ -94,66 +102,91 @@ [this.name]: evt, }); }, + $setError() { + this.error = true; + clearTimeout(this.errTimer); + this.errTimer = setTimeout(() => { + this.error = false; + }, 5000); + }, }, mounted() { this.$nextTick(() => { - // 未设置验证 - if (!this.required && !this.rules) { - this.formRes.$regItemValidator(this.name, validateType => { + // 注册验证 + this.formRes.$regItemValidator(this.name, (validateType, errMsg) => { + // 直接设定错误 + if (validateType === 'setError') { + this.$setError(); + return new Promise((resolve, reject) => { + $(this.$refs.formItem) + .offset() + .then(offset => { + resolve({ + name: this.name, + passed: false, + msg: errMsg, + offset, + }); + }); + }); + } + // 未设置验证 + else if (!this.required && !this.rules) { this.error = false; return Promise.resolve({ name: this.name, passed: true, }); - }); - } else { - // 验证规则 - const descriptor = this.rules || []; - if (this.required) { - descriptor.unshift({ - required: true, + } + // 正常验证 + else { + // 验证规则 + const descriptor = this.rules || []; + if (this.required) { + descriptor.unshift({ + required: true, + }); + } + const validator = new Schema({ + [this.name]: descriptor, + }); + // 汉化通用验证消息 + validator.messages(validateMsgs); + return new Promise((resolve, reject) => { + validator + .validate({ + [this.name]: this.formRes.formData[this.name], + }) + .then( + res => { + this.error = false; + resolve({ + name: this.name, + passed: true, + }); + }, + ({ errors, fields }) => { + if (validateType !== 'msgOnly') { + this.$setError(); + } + $(this.$refs.formItem) + .offset() + .then(offset => { + resolve({ + name: this.name, + passed: false, + msg: errors[0].message.replace( + this.name, + this.label || this.name + ), + offset, + }); + }); + } + ); }); } - const validator = new Schema({ - [this.name]: descriptor, - }); - // 汉化通用验证消息 - validator.messages(validateMsgs); - // 注册验证 - let errTimer = null; - this.formRes.$regItemValidator(this.name, validateType => { - return validator - .validate({ - [this.name]: this.formRes.formData[this.name], - }) - .then( - 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, - msg: errors[0].message.replace( - this.name, - this.label || this.name - ), - }; - } - ); - }); - } + }); }); }, beforeDestroy() { -- Gitblit v1.9.1