yylib-quick-mobile/dist/yylib/textarea-item/YYTextareaItem.js

yylib-quick-mobile

import React from 'react';
import {TextareaItem} from 'antd-mobile';
import classnames from 'classnames';
import {isFunction} from '../../utils/FunctionUtil';
import YYIcon from '../icon/YYIcon'
import './YYTextareaItem.less';

class YYTextareaItem extends React.Component {
    onChange = (value) => {
        //设值到fieldStore
        let fields = {};
        fields[this.props.field] = {
            dirty: true,
            errors: undefined,
            name: this.props.field,
            touched: true,
            validating: true,
            value: value
        }
        this.props.form.setFields(fields);

        if (isFunction(this.props.onChange)) this.props.onChange(value);

    }
    onBlur = (value) => {
        if (isFunction(this.props.onBlur)) this.props.onBlur(value);
    }
    onFocus = (value) => {
        if (isFunction(this.props.onBlur)) this.props.onFocus(value);
    }
    onErrorClick = () => {
        if (isFunction(this.props.onErrorClick)) this.props.onErrorClick();
    }
    //TODO 校验暂不支持，以后支持拓展
    validateCallBack = (rule, value, callback) => {
        if(isFunction(this.props.validateCallBack)){
            this.props.validateCallBack(rule, value, callback);
            callback();
        }else{
            callback();
        }
    }
    render() {
        let {getFieldProps} = this.props.form;
        const {iconColor,icon,showIcon,field, value, required, trigger, label,direction,
            placeholder,editable,disabled,clear,rows,count,
            hasError,autoHeight,labelNumber,visible,validateCallBack,
            findUI, offline,parentType, uiorigin, RunInDesign, uititle, uitype, uikey, nid,control_event, ...restProps} = this.props;

        let wrapClz = classnames('yy-textarea-item',(!visible&&'hidden'), this.props.className);
        let requiredMsg='必填项'+ label+'未填写';
        let classz = classnames(direction,(!visible&&'hidden'), this.props.className);
        let labelCl = classnames('label',(required&&'yy-label-required'));
        return (<div className={classz}>
                {showIcon && direction==='outside'&&<YYIcon type={icon} color={iconColor} style={{float:'left',padding:'10px 0 8px 12px',marginRight:'3px'}} size="xs"/>}
                {direction==='outside'&&<div className={labelCl}>{label}</div>}
                <TextareaItem
                    {...restProps}
                    className={wrapClz}
                    {...isFunction(getFieldProps) ? getFieldProps(field, {
                        initialValue: value,
                        rules: [
                            {required, message: requiredMsg},
                            {validator: this.validateCallBack},
                        ],
                        trigger: trigger,
                        valuePropName: 'value',
                    }) : null}
                    placeholder={placeholder}
                    editable={editable}
                    disabled={disabled}
                    clear={clear}
                    rows={rows}
                    count={count}
                    onChange={this.onChange}
                    onBlur={this.onBlur}
                    onFocus={this.onFocus}
                    error={hasError}
                    onErrorClick={this.onErrorClick}
                    autoHeight={autoHeight}
                    labelNumber={labelNumber}
                    title={direction==='inside'&&label}
                    name={field}
                >
                 </TextareaItem></div>
        );
    }
}

YYTextareaItem.defaultProps = {
    field: "default",
    value: null,
    required: false,
    trigger: "onChange",
    placeholder:'',
    editable:true,
    disabled:false,
    clear:true,
    rows:1,
    count:0,
    hasError: false,
    autoHeight:false,
    labelNumber:5,
    label: "",
	  visible: true,
    direction: 'inside',
    showIcon: false,
    icon: "Home",
    iconColor: "red",
    //设计器需要的props,不添加会warning
    findUI:'',
    offline:false,
    parentType:'',
    uiorigin:'',
    RunInDesign:false,
    uititle:'',
    uitype:'',
    uikey:'',
    nid:'',
    control_event:{},
    validateCallBack:''
}
module.exports = YYTextareaItem;