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
import React, { useState, useEffect } from 'react';
import { Form, Button } from 'antd';
import Shell from '@/baseComponent/Shell';
import { ModalInfo } from '@/baseComponent/Modal';
import { addOrEditTableItem, fetchTableData, fetchTableHeader, } from '@/webPublic/Services';
import { preHandle } from '@/webPublic/one_stop_public/utils/myutils';
import { getOneStopConfig } from '@/baseComponent/utils';
import { RenderFormByContent } from '../RenderForm';
// 直接获取的表格数据的字段是明文，找换成base转换后的字段
function getBaseEncodedData(rowData, tableHeader) {
// {name: base52}
const nameBaseMap = tableHeader.reduce((acc, header) => {
return {...acc, [header.name] : header.base52};
}, {});
// 明文字段转换成base后的字段, eg. {process_status: 1} => {JbZWZHoGRsA: 1}
return Object.keys(rowData).reduce((acc, name) => {
const base52 = nameBaseMap[name];
if(!base52) return acc;
return {...acc, [base52]: rowData[name] };
}, {});
}
// 配置页面，配置数据在元数据表格的第一行
// 1. 页面显示通过模板id渲染。
// 2. 页面数据通过元数据表id, 查询和修改。
// templateCode, 页面模板id
// tableId, 元数据列表id
// children， 可以传children，但children不能是数组(不能传属性)，children里可以自定义其他组件。
function SingleDataPageInFirstRow(props) {
const { children, form, templateCode: templateCodeFromProps, dataObjId: dataObjIdFromProps, location: {pathname} } = props;
// templateCode 和 dataObjId 可以通过组件属性或者根据路径配置获取
const templateCodeFromPathname = getOneStopConfig(`${pathname}-templateCode`);
const dataObjIdFromPathname = getOneStopConfig(`${pathname}-dataObjId`);
const templateCode = templateCodeFromPathname || templateCodeFromProps;
const dataObjId = dataObjIdFromPathname || dataObjIdFromProps;
if (!templateCode || !dataObjId) {
console.warn("模板code或者元数据表格id为空，templateCode: " + templateCode + ", dataObjId: " + dataObjId);
return null;
}
const [isAdd, setIsAdd] = useState(false);
const [content, setContent] = useState({});
useEffect(
() => {
fetchTableHeader(dataObjId).then(tableHeader => {
if (!tableHeader) return;
fetchTableData({ pageNo: 1, pageSize: 10, isBase: true, dataObjId, query: {} }).then(res => {
const firstRowData = (res && res.rows && res.rows[0]) || {};
setContent(getBaseEncodedData(firstRowData, tableHeader));
setIsAdd(!!(!res || res.errMsg))
});
});
},
[dataObjId]
);
function handleSave() {
const { validateFields } = form;
validateFields((err, values) => {
if (err) return;
// console.log(JSON.stringify(values.JjvkRobXWTE), JSON.stringify(values.JjvkwLqcsyY));
preHandle(values);
// console.log(JSON.stringify(values.JjvkRobXWTE));
addOrEditTableItem({ objId: dataObjId, isAdd, data: values }).then(res => {
if (res) {
ModalInfo('保存成功！');
}
});
});
}
let ClonedChildren;
if (children) {
ClonedChildren = React.cloneElement(React.Children.only(children), {
form,
isAdd,
url: '/DataObjApi/addFormData',
});
}
return (
<Shell styleShell={{ marginTop: 0 }}>
<RenderFormByContent
content={content}
templateCode={templateCode}
form={form}
/>
{ClonedChildren || (
<div style={{ textAlign: 'center', padding: 16 }}>
<Button type="primary" shape="round" ghost onClick={handleSave}>
保存
</Button>
</div>
)}
</Shell>
);
}
export default Form.create()(SingleDataPageInFirstRow);