CommonViewNew.js
5.47 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
/**
* Created by mar105 on 2019-02-27.
*/
/* eslint-disable object-curly-newline,prefer-destructuring */
import React, { Component } from 'react';
import { UploadOutlined } from '@ant-design/icons';
import { Form } from '@ant-design/compatible';
// import '@ant-design/compatible/assets/index.css';
import { Row, Col, Button, Upload } from 'antd-v4';
import config from '@/utils/config';
import * as commonUtils from '@/utils/utils';/* 通用方法 */
import ShowType from './CommonComponent';
const FormItem = Form.Item;
export default class CommonViewNew extends Component {
/** 构造函数 */
constructor(props) {
super(props);
this.state = {
enabled: props.enabled,
masterConfig: props.masterConfig,
masterData: props.masterData,
gdsconfigformmasterId: props.gdsconfigformmasterId,
};
}
/** 渲染前只执行一次 */
componentWillMount() {
/* state和this属性赋值 */
this.assignmentWillProps(this.props);
}
/** props改变的时候触发 */
componentWillReceiveProps(nextProps) {
/* state和this属性赋值 */
this.assignmentWillProps(nextProps);
}
/** 返回true执行渲染,返回false不渲染 */
shouldComponentUpdate(nextProps, nextState) {
const {
masterConfig, masterData, enabled, token, gdsconfigformmasterId,
} = this.state;
return enabled !== nextState.enabled ||
JSON.stringify(masterConfig) !== JSON.stringify(nextState.masterConfig) ||
JSON.stringify(masterData) !== JSON.stringify(nextState.masterData) ||
JSON.stringify(token) !== JSON.stringify(nextState.token) ||
JSON.stringify(gdsconfigformmasterId) !== JSON.stringify(nextState.gdsconfigformmasterId);
}
assignmentWillProps = (props) => {
this.setState({
enabled: props.enabled,
masterConfig: props.masterConfig,
masterData: props.masterData,
gdsconfigformmasterId: props.gdsconfigformmasterId,
});
}
handleClick = (e, btnName) => {
this.props.onBtnClick(e, btnName);
}
rowReturnType = (child, masterData) => {
const formItemLayout = { labelCol: { span: 2 }, wrapperCol: { span: 18 } };
const { sModelsId, app } = this.props;
const { enabled, gdsconfigformmasterId } = this.state;
const { token } = app;
if (child.sControlName.toLowerCase().endsWith('upload') && child.sName === '') {
const { showName, sControlName, needUpload } = child;
const uploadProps = {
action: `${config.server_host}import/checkExcel?sModelsId=${sModelsId}&gdsconfigformmasterId=${gdsconfigformmasterId}&token=${token}`,
onChange: this.props.onUploadChange.bind(this, sControlName),
accept: 'xls/*', // *.xls
beforeUpload: () => {
/* 查看时不可上传 */
if (!needUpload) {
return false;
}
},
onSuccess: (response) => {
this.props.onShowData(response, sControlName);
},
showUploadList: false,
};
// 上传使用
const divProps = Object.assign({}, uploadProps);
return (
<Upload {...divProps}>
<Button >
<UploadOutlined />{ showName }
</Button>
</Upload>
);
} else if (child.sControlName.toLowerCase().startsWith('btn') && !child.sControlName.toLowerCase().endsWith('upload') && child.sName === '') {
const { sControlName, showName } = child;
return (<Button onClick={e => this.handleClick(e, sControlName)} > {showName} </Button>);
} else if (child.sName !== '') {
const sMemo = child.sName.toLowerCase().endsWith('memo');
const iColValue = sMemo ? 21 : child.iColValue * 6; /* 跨度 */
const iOrder = sMemo ? 100 : child.iOrder > 100 ? 100 : child.iOrder; /* 排序 */
let enabledNew = (enabled && !child.bReadonly && !child.specialControl);
if (child.iTag === 1) {
enabledNew = false;
} else if (child.iTag === 3) {
enabledNew = true;
}
const showTypeProps = {
form: this.props.form,
getSqlDropDownData: this.props.getSqlDropDownData,
getSqlCondition: this.props.getSqlCondition,
handleSqlDropDownNewRecord: this.props.handleSqlDropDownNewRecord,
getFloatNum: this.props.getFloatNum,
onChange: this.props.onChange,
showConfig: child,
formItemLayout: sMemo ? formItemLayout : {},
textArea: sMemo,
enabled: enabledNew,
dataValue: masterData[child.sName],
bTable: false,
};
return (
<Col span={iColValue} order={iOrder}>
<ShowType {...showTypeProps} />
</Col>
);
}
}
/** 绑定showType控件 */
rowShowType = (rowConfig, masterData) => {
const showConfig = commonUtils.isNotEmptyObject(rowConfig) ? rowConfig.gdsconfigformslave.filter(item => item.bVisible) : [];
const children = [];
for (const child of showConfig) {
children.push(this.rowReturnType(child, masterData));
}
const rowProps = {};
rowProps.children = children;
return (<Row type="flex" {... rowProps} />);
}
render() {
const { masterConfig } = this.state;
let { masterData } = this.state;
masterData = masterData === undefined ? {} : masterData;
const rowConfig = commonUtils.isNotEmptyObject(masterConfig) ? masterConfig.rowGdsconfig : [];
return (
<FormItem className="searchMainForm">
{
rowConfig.map((child) => {
return this.rowShowType(child, masterData);
})
}
</FormItem>
);
}
}