index.js 3.5 KB
Newer Older
王绍森's avatar
王绍森 committed
1 2 3 4
import React, { useState, useEffect } from 'react';
import { Form, Button } from 'antd';
import Shell from '@/baseComponent/Shell';
import { ModalInfo } from '@/baseComponent/Modal';
5
import { addOrEditTableItem, fetchTableData, fetchTableHeader } from '@/webPublic/Services';
王绍森's avatar
王绍森 committed
6 7 8 9 10 11
import { preHandle } from '@/webPublic/one_stop_public/utils/myutils';
import { getOneStopConfig } from '@/baseComponent/utils';
import { RenderFormByContent } from '../RenderForm';

// 直接获取的表格数据的字段是明文,找换成base转换后的字段
function getBaseEncodedData(rowData, tableHeader) {
12 13 14 15 16 17 18 19 20 21
	// {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] };
	}, {});
王绍森's avatar
王绍森 committed
22 23 24 25 26 27 28 29 30 31
}

// 配置页面,配置数据在元数据表格的第一行
// 1. 页面显示通过模板id渲染。
// 2. 页面数据通过元数据表id, 查询和修改。
// templateCode, 页面模板id
// tableId, 元数据列表id
// children, 可以传children,但children不能是数组(不能传属性),children里可以自定义其他组件。

function SingleDataPageInFirstRow(props) {
32 33 34 35 36 37 38 39 40 41
	const {
		children,
		form,
		templateCode: templateCodeFromProps,
		dataObjId: dataObjIdFromProps,
		location: { pathname },
	} = props;
	// templateCode 和 dataObjId 可以通过组件属性或者根据路径配置获取
	const templateCodeFromPathname = getOneStopConfig(`${pathname}-templateCode`);
	const dataObjIdFromPathname = getOneStopConfig(`${pathname}-dataObjId`);
王绍森's avatar
王绍森 committed
42

43 44
	const templateCode = templateCodeFromPathname || templateCodeFromProps;
	const dataObjId = dataObjIdFromPathname || dataObjIdFromProps;
王绍森's avatar
王绍森 committed
45

46 47 48 49 50 51
	if (!templateCode || !dataObjId) {
		console.warn(
			'模板code或者元数据表格id为空,templateCode: ' + templateCode + ', dataObjId: ' + dataObjId,
		);
		return null;
	}
王绍森's avatar
王绍森 committed
52

53 54
	const [isAdd, setIsAdd] = useState(false);
	const [content, setContent] = useState({});
王绍森's avatar
王绍森 committed
55

56 57 58 59 60 61 62 63 64 65 66 67 68 69 70
	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],
	);
王绍森's avatar
王绍森 committed
71

72 73
	function handleSave() {
		const { validateFields } = form;
王绍森's avatar
王绍森 committed
74

75 76 77 78 79 80 81 82 83 84 85 86
		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('保存成功!');
				}
			});
		});
	}
王绍森's avatar
王绍森 committed
87

88 89 90 91 92 93 94 95
	let ClonedChildren;
	if (children) {
		ClonedChildren = React.cloneElement(React.Children.only(children), {
			form,
			isAdd,
			url: '/DataObjApi/addFormData',
		});
	}
王绍森's avatar
王绍森 committed
96

97 98 99 100 101 102 103 104 105 106 107 108
	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>
	);
王绍森's avatar
王绍森 committed
109 110 111
}

export default Form.create()(SingleDataPageInFirstRow);