151 lines
3.8 KiB
JavaScript
151 lines
3.8 KiB
JavaScript
import React, {
|
|
Component
|
|
} from 'react';
|
|
import {
|
|
observer
|
|
} from 'mobx-react';
|
|
import {
|
|
Button
|
|
} from 'antd';
|
|
import {
|
|
WeaFormItem,
|
|
WeaSearchGroup,
|
|
WeaCheckbox
|
|
} from 'ecCom';
|
|
import {
|
|
WeaSwitch
|
|
} from 'comsMobx';
|
|
import findIndex from 'lodash/findIndex';
|
|
|
|
@observer
|
|
export default class FormInfo extends Component {
|
|
renderForm = () => {
|
|
const {
|
|
formFields,
|
|
form,
|
|
colCount,
|
|
itemRender,
|
|
onSelectedChangeHandle,
|
|
showLabel,
|
|
multiColumn,
|
|
custLabelCol,
|
|
childrenComponents,
|
|
onSwitchChange,
|
|
} = 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 //labelVisible ? -30 : 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, index) => {
|
|
const customerRender = itemRender != null ? itemRender[field.domkey[0]] : null;
|
|
const showCheckbox = field.checkbox || false;
|
|
let label = field.label;
|
|
if (showCheckbox)
|
|
label = <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@1id63c@${index}`} content={label} value={field.checkboxValue} onChange={(v) => {field.checkboxValue = v === '1'; onSelectedChangeHandle && onSelectedChangeHandle(field, v)}}/>
|
|
|
|
let coms;
|
|
if (customerRender == null) {
|
|
coms = <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@7zfwo9@${index}`} fieldConfig={{...field, ...textAreaProps, hasBorder: field.viewAttr === 1}} form={form} formParams={formParams} onChange={datas => onSwitchChange && onSwitchChange(datas)}/>;
|
|
} 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 ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@rv2s0m@${index}`} {...itemProps}>
|
|
{coms}
|
|
</WeaFormItem>
|
|
),
|
|
col
|
|
})
|
|
|
|
if (childrenComponents && childrenComponents[field.domkey[0]]) {
|
|
childrenComponents[field.domkey[0]]().map(child => formItems.push(child));
|
|
}
|
|
})
|
|
|
|
groupArr.push(
|
|
(
|
|
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@zglygj@${i}`}
|
|
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,
|
|
showError
|
|
} = this.props;
|
|
if (formFields == null)
|
|
return (<div></div>)
|
|
|
|
return (
|
|
<div className={className}>
|
|
{this.renderForm()}
|
|
</div>
|
|
)
|
|
}
|
|
} |