提交 b0faa162 authored 作者: 钟是志's avatar 钟是志

28974 辅导员考核相关需求,有疑问联系我

onestop 增加 步骤条组件
上级 cdcb10b2
import React, { useState, useEffect, useMemo, useCallback } from 'react'; import React, { useState, useEffect, useMemo, useCallback } from 'react';
import { Steps } from 'antd'; import { Steps } from 'antd';
import ZdyTable from '@/webPublic/one_stop_public/Table';
const { Step } = Steps; const { Step } = Steps;
export default function StepDiy(props) { export default function StepDiy(props) {
const { value, onChange, json, form } = props; const { value, json, partFormProps, dataColumn, onChange } = props;
const diyProps = useMemo(() => { const diyProps = useMemo(() => {
let b = {}; let b = {};
if (value && typeof value === 'object') { if (value && typeof value === 'object') {
b = { b = {
...value, ...value,
}; };
delete b.formValues;
} }
if (json.otherProps && typeof json.otherProps === 'string') { if (json.otherProps && typeof json.otherProps === 'string') {
try { try {
...@@ -30,21 +32,65 @@ export default function StepDiy(props) { ...@@ -30,21 +32,65 @@ export default function StepDiy(props) {
} }
}, [json.otherProps, value]); }, [json.otherProps, value]);
/** const [current, setCurrent] = useState(diyProps?.StepsProps?.current || 0);
* 按姚鑫国的要求 在切换步骤时将表单的值保存起来 const [formValues, setFormValues] = useState({});
* */
const partFormKey = useMemo(() => {
if (typeof current !== 'undefined') {
let item = diyProps.Step.find((g, index) => {
return index === current;
});
if (item) {
return item.formKey;
}
}
return undefined;
}, [current]);
useEffect(() => { useEffect(() => {
console.log(JSON.stringify(form.getFieldsValue())); if (diyProps?.StepsProps?.current !== current) {
}, [diyProps?.StepsProps.current]); const oldValues = partFormProps.form.getFieldsValue();
let newV = {
...oldValues,
};
delete newV[dataColumn.base52];
setFormValues({
...formValues,
...newV,
});
}
setCurrent(diyProps?.StepsProps?.current);
}, [diyProps?.StepsProps?.current]);
useEffect(() => {
onChange({
...value,
formValues,
})
}, [formValues]);
console.log(value);
return ( return (
<div style={diyProps.outSideDivStyle}> <div style={diyProps.outSideDivStyle}>
<Steps {...diyProps.StepsProps}> <Steps {...diyProps.StepsProps}
current={current}>
{Array.isArray(diyProps.Step) && {Array.isArray(diyProps.Step) &&
diyProps.Step.map(g => { diyProps.Step.map(g => {
return <Step {...g} key={g.title} />; return <Step {...g} key={g.title} />;
})} })}
</Steps> </Steps>
{!!partFormKey && (
<div>
<ZdyTable
{...partFormProps}
currentFormTitle={'Steps组件的子表单' + partFormKey}
key={partFormKey}
currentFormKey={partFormKey}
{...partFormProps?.datas[partFormKey]}
/>
</div>
)}
</div> </div>
); );
} }
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论