tdesign-miniprogram
Version:
TDesign Component for miniprogram
1 lines • 5.04 kB
JavaScript
import{__awaiter,__decorate}from"tslib";import props from"./props";import{validateRules,ValidateStatus}from"./form-model";import config from"../common/config";import{SuperComponent,wxComponent}from"../common/src/index";import usingConfig from"../mixins/using-config";import{isNumeric}from"../common/validator";const{prefix:prefix}=config,parentComponentName="form",componentName="form-item";function normalizeLabelWidth(e){return e?isNumeric(e)?`${e}px`:String(e):""}let FormItem=class extends SuperComponent{constructor(){super(...arguments),this.externalClasses=[`${prefix}-class`,`${prefix}-class-label`,`${prefix}-class-controls`,`${prefix}-class-help`,`${prefix}-class-extra`],this.behaviors=[usingConfig({componentName:"form"})],this.properties=props,this.data={prefix:prefix,classPrefix:`${prefix}-form-item`,formClass:`${prefix}-form`,formItemClass:`${prefix}-form__item`,labelClass:`${prefix}-form__label`,errorClasses:"",errorList:[],successList:[],verifyStatus:ValidateStatus.TO_BE_VALIDATED,needResetField:!1,resetValidating:!1,formRules:[],innerLabelAlign:"",innerLabelWidth:"",form:{},colon:!1,innerShowErrorMessage:!0,innerContentAlign:"",contentStyle:""},this.observers={contentAlign(e){e&&this.setData({innerContentAlign:e,contentStyle:`text-align: ${e}`})}},this.relations={"../form/form":{type:"parent",linked(e){var t,r,s;e.registerChild(this),this.form=e;const{globalConfig:i}=this.data,{requiredMark:a,labelAlign:o,labelWidth:n,showErrorMessage:l}=this.properties,m=null===(t=e.data.rules)||void 0===t?void 0:t[this.properties.name],p=null==m?void 0:m.some(e=>e.required),{contentAlign:c}=this.properties,h=c||e.data.contentAlign||"";this.setData({formRules:m||[],colon:e.data.colon,innerLabelAlign:o||e.data.labelAlign,innerLabelWidth:normalizeLabelWidth(n||e.data.labelWidth),innerContentAlign:h,contentStyle:h?`text-align: ${h}`:"",innerRequiredMark:null!==(s=null!==(r=null!=a?a:e.data.requiredMark)&&void 0!==r?r:i.requiredMark)&&void 0!==s?s:p,innerShowErrorMessage:"boolean"==typeof l?l:e.properties.showErrorMessage,requiredMarkPosition:e.data.requiredMarkPosition||i.requiredMarkPosition||"left"})},unlinked(){this.form&&this.form.unregisterChild(this.properties.name)}}},this.lifetimes={ready(){this.initFormItem()},detached(){this.form&&this.form.unregisterChild(this.properties.name)}},this.methods={calcErrorClasses(e=this.data.errorList){if(!this.data.innerShowErrorMessage)return"";if(!e||0===e.length)return"";return"error"===(e[0].type||"error")?`${this.data.formItemClass}--error`:`${this.data.formItemClass}--warning`},scrollIntoView(e,t=0){this.createSelectorQuery().select(`.${this.data.classPrefix}`).boundingClientRect().selectViewport().scrollOffset().exec(r=>{r[0]&&r[1]&&wx.pageScrollTo({scrollTop:r[0].top+r[1].scrollTop-t,duration:"smooth"===e?300:0})})},initFormItem(){this.setInitialValue()},setInitialValue(){const{name:e}=this.properties;if(e&&this.form){const t=this.form.properties.data||{};this.initialValue=t[e]}},getFormData(){return this.form&&this.form.properties.data||{}},getValue(){const{name:e}=this.properties;if(e&&this.form){return(this.form.properties.data||{})[e]}},getRules(){const{rules:e}=this.properties;return e&&e.length>0?e:this.data.formRules||[]},validate(e,t,r){return __awaiter(this,void 0,void 0,function*(){const s=this.getRules();if(0===s.length)return{[this.properties.name]:!0};const i="all"===t?s:s.filter(e=>(e.trigger||"change")===t);if(0===i.length)return{[this.properties.name]:!0};const a=e[this.properties.name],o={formData:e,name:this.properties.name},n=yield validateRules(a,i,o),l=this.analysisValidateResult(n);this.updateValidateStatus(l,r);const m={};return m[this.properties.name]=!(l.errorList.length>0)||l.errorList,m})},validateOnly(e){return __awaiter(this,void 0,void 0,function*(){return this.validate(this.getFormData(),e,!1)})},analysisValidateResult(e){const{globalConfig:t}=this.data,r=this.form&&this.form.properties.errorMessage||t.errorMessage,s=this.properties.label||this.properties.name;return{errorList:e.filter(e=>!0!==e.result).map(e=>(e.message||Object.keys(e).forEach(t=>{if(!e.message&&r[t]){const i=r[t];e.message=i.replace(/\$\{name\}/g,s||"").replace(/\$\{validate\}/g,String(!0===e[t]?"":e[t]))}}),e)),successList:e.filter(e=>!0===e.result&&e.message&&"success"===e.type),resultList:e}},updateValidateStatus(e){const{errorList:t,successList:r}=e;this.setData({errorClasses:this.calcErrorClasses(t),errorList:t,successList:r,verifyStatus:t.length>0?ValidateStatus.FAIL:ValidateStatus.SUCCESS})},clearValidate(){this.setData({errorClasses:"",errorList:[],successList:[],verifyStatus:ValidateStatus.TO_BE_VALIDATED})},resetField(){this.clearValidate()},setValidateMessage(e){const t=e.filter(e=>"success"!==e.type),r=e.filter(e=>"success"===e.type);let s=ValidateStatus.SUCCESS;e.length>0&&(s=t.length>0?ValidateStatus.FAIL:ValidateStatus.SUCCESS),this.setData({errorClasses:this.calcErrorClasses(t),errorList:t,successList:r,verifyStatus:s})}}}};FormItem=__decorate([wxComponent()],FormItem);export default FormItem;