97 lines
3.4 KiB
JavaScript
97 lines
3.4 KiB
JavaScript
import React, { Component } from "react";
|
|
import { WeaCheckbox, WeaFormItem, WeaSearchGroup } from "ecCom";
|
|
import { observer } from "mobx-react";
|
|
import { WeaSwitch } from "comsMobx";
|
|
|
|
@observer
|
|
export default class FormInfo extends Component {
|
|
renderForm = () => {
|
|
const {
|
|
formFields, form, colCount, itemRender, onSelectedChangeHandle,
|
|
showLabel, multiColumn, custLabelCol, childrenComponents
|
|
} = this.props;
|
|
|
|
let groupArr = [];
|
|
const formParams = form.getFormParams();
|
|
const labelVisible = showLabel == null || showLabel == true;
|
|
const col = colCount ? colCount : 1;
|
|
const labelCol = labelVisible ? (custLabelCol || `${window.HrmEngineLabelCol}`) : 0;
|
|
const itemProps = {
|
|
ratio1to2: labelVisible && custLabelCol == null,
|
|
style: { marginLeft: 0 },
|
|
tipPosition: "bottom",
|
|
labelCol: { span: labelCol },
|
|
wrapperCol: { span: 24 - labelCol }
|
|
};
|
|
const textAreaProps = { minRows: 4, maxRows: 4 };
|
|
|
|
formFields.map((fields, i) => {
|
|
let formItems = [];
|
|
fields.items.map((field, j) => {
|
|
const customerRender = itemRender != null ? itemRender[field.domkey[0]] : null;
|
|
const showCheckbox = field.checkbox || false;
|
|
let label = field.label;
|
|
if (showCheckbox)
|
|
label = <WeaCheckbox content={label} value={field.checkboxValue} onChange={(v) => {
|
|
field.checkboxValue = v === "1";
|
|
onSelectedChangeHandle && onSelectedChangeHandle(field, v);
|
|
}}/>;
|
|
let coms;
|
|
if (customerRender == null) {
|
|
coms = <WeaSwitch fieldConfig={{ ...field, ...textAreaProps, hasBorder: field.viewAttr === 1 }} form={form}
|
|
formParams={formParams}/>;
|
|
} else {
|
|
coms = customerRender(field, textAreaProps, form, formParams);
|
|
}
|
|
Object.assign(itemProps, { label, error: form.getError(field) });
|
|
let col = 1;
|
|
if (multiColumn != null) {//检查有哪些字段需要一行显示多个
|
|
const idx = _.findIndex(multiColumn, item => item.key === field.domkey[0]);
|
|
if (idx > -1) {
|
|
col = field.colSpan || 1;
|
|
if (multiColumn[idx].labelCol != null)//检查字段是否有配置标题宽度
|
|
Object.assign(itemProps, {
|
|
labelCol: { span: multiColumn[idx].labelCol },
|
|
wrapperCol: { span: 24 - multiColumn[idx].labelCol }
|
|
});
|
|
} else {
|
|
Object.assign(itemProps, {
|
|
labelCol: { span: labelCol },
|
|
wrapperCol: { span: 24 - labelCol }
|
|
});
|
|
}
|
|
}
|
|
|
|
coms != null && formItems.push({
|
|
com: (<WeaFormItem {...itemProps}>{coms}</WeaFormItem>),
|
|
col
|
|
});
|
|
|
|
if (childrenComponents && childrenComponents[field.domkey[0]]) {
|
|
childrenComponents[field.domkey[0]]().map(child => formItems.push(child));
|
|
}
|
|
});
|
|
|
|
groupArr.push(<WeaSearchGroup
|
|
center={this.props.center != null ? this.props.center : true}
|
|
needTigger={true}
|
|
title={formFields.length < 2 ? null : fields.title}
|
|
showGroup={true}
|
|
items={formItems}
|
|
col={col}
|
|
fontSize={14}/>);
|
|
});
|
|
return groupArr;
|
|
};
|
|
|
|
render() {
|
|
const { formFields, className } = this.props;
|
|
if (formFields == null) return (<div></div>);
|
|
return (
|
|
<div className={className}>
|
|
{this.renderForm()}
|
|
</div>
|
|
);
|
|
}
|
|
}
|