增加或条件

src/components/DDComponents/NumberField/index.js

@@ -8,9 +8,9 @@ function NumberField(props) {
     <InputNumber
       style={{ width: '100%' }}
       disabled={disabled}
-      formatter={value => `${value}${unit || ''}`}
-      onChange={e => {
-        onChange?.(String(e));
+      formatter={(value) => `${value}${unit || ''}`}
+      onChange={(e) => {
+        onChange?.(e ? String(e) : 0);
       }}
     />
   );

src/components/Flow/components/judgeComponent/index.tsx

@@ -175,6 +175,7 @@ const RenderJudge = (props: any) => {
             <Select
               options={JudgeOptions}
               defaultValue={judge?.values[0]}
+              style={{ width: '100%' }}
               onChange={(value: number) => {
                 let newCondition: Condition = null;
                 if (judge && judge.values && judge.values.length > 0) {
@@ -271,7 +272,7 @@ const RenderJudge = (props: any) => {
         );
         break;
     }
-    return component;
+    return <div style={{ margin: "10px 0" }}>{component}</div>;
   };
 
   return <>{formData.map((item) => RenderComp(item))}</>;

src/components/Flow/index.tsx

@@ -95,16 +95,14 @@ export const Demo: React.FC<IProps> = (props) => {
               const node = {
                 id: curNode.id,
                 type: curNode.type,
+                formItems: '',
                 //条件节点
-                formItems:
-                  curNode.type == TYPE.JUDGE && !curNode.formItems
-                    ? '[]'
-                    : curNode.formItems,
+                formItemsOr: curNode.formItemsOr || [],
                 priority: curNode.priority,
                 //审批节点
                 initiator:
                   curNode.type == TYPE.INITIATOR ? curNode.initiator : null,
-                audits: curNode.type == TYPE.AUDIT ? curNode.audits : null,
+                audits: curNode.audits,
                 children: children,
               };
               return node;

src/components/Flow/node/FlowFormPanel.tsx

@@ -8,7 +8,7 @@ const CustomFlowchartFormPanel = () => {
   return (
     <FlowchartFormPanel
       show={true}
-      position={{ width: 240, top: 40, bottom: 0, right: 0 }}
+      position={{ width: 320, top: 40, bottom: 0, right: 0 }}
       controlMapService={controlMapService}
       formSchemaService={formSchemaService}
     ></FlowchartFormPanel>

src/components/Flow/node/auditNode/index.tsx

@@ -50,7 +50,7 @@ const CustomRect = (props: any) => {
       }
       return name;
     };
-    if (type != TYPE.AUDIT) {
+    if (type == TYPE.INITIATOR) {
       if (initiator?.length > 0) {
         const list = initiator
           .map((item: any) => {

src/components/Flow/node/judgeNode/index.tsx

@@ -8,16 +8,25 @@ import {
   SiginSmallOptions,
 } from '../../components/judgeComponent';
 import { connect } from 'umi';
+import { Card } from 'antd';
 export { judgeServe };
 
 const JudgeRect = (props: any) => {
   const { size = { width: 130, height: 50 }, data, depUserTree } = props;
   const { width, height } = size;
-  const { label, stroke, fill, fontFill, fontSize, type, priority, formItems } =
-    data;
+  const {
+    label,
+    stroke,
+    fill,
+    fontFill,
+    fontSize,
+    type,
+    priority,
+    formItemsOr,
+  } = data;
 
   const contentText = useMemo(() => {
-    let text = [];
+    let allText: any[] = [];
     const getName = (id: any, data: any) => {
       let name = '';
       for (let i = 0; i < data.length; i++) {
@@ -32,56 +41,74 @@ const JudgeRect = (props: any) => {
       return name;
     };
 
-    if (formItems) {
-      let data: FormItem[] = JSON.parse(formItems);
-      data.forEach((item: FormItem) => {
-        let judge = item.judge;
-        const label: String = item.props.label;
-        switch (judge?.type) {
-          case ComponentName.Inner:
-            const list = judge?.values
-              ?.map((item) => {
-                return getName(item.origin, depUserTree);
-              })
-              .filter((item) => item);
-            text.push('发起人属于:' + list?.join('或'));
-            break;
-          case ComponentName.Number:
-            const type: Number = judge?.values?.[0];
-            const condition = judge.condition;
-            if (!condition) break;
-            if (type != 6) {
-              let JudgeLabel = JudgeOptions.find(
-                (item) => item.value == type,
-              )?.label;
+    if (formItemsOr?.length > 0) {
+      formItemsOr.forEach((formItems: string, index: number) => {
+        let text: any[] = [];
+        let data: FormItem[] = JSON.parse(formItems);
+        data.forEach((item: FormItem) => {
+          let judge = item.judge;
+          const label: String = item.props.label;
+          switch (judge?.type) {
+            case ComponentName.Inner:
+              const list = judge?.values
+                ?.map((item) => {
+                  return getName(item.origin, depUserTree);
+                })
+                .filter((item) => item);
+              text.push('发起人属于:' + list?.join('或'));
+              break;
+            case ComponentName.Number:
+              const type: Number = judge?.values?.[0];
+              const condition = judge.condition;
+              if (!condition) break;
+              if (type != 6) {
+                let JudgeLabel = JudgeOptions.find(
+                  (item) => item.value == type,
+                )?.label;
 
-              text.push(`${label} ${JudgeLabel} ${condition.smallValue}`);
-            } else {
-              const { smallSign, smallValue, bigSign, bigValue } = condition;
-              if (!smallSign || !smallValue || !bigSign || !bigValue) break;
-              const getSigin = (sigin: Number) =>
-                SiginOptions.find((item) => item.value == sigin)?.label;
-              const getSmallSigin = (sigin: Number) =>
-                SiginSmallOptions.find((item) => item.value == sigin)?.label;
+                text.push(`${label} ${JudgeLabel} ${condition.smallValue}`);
+              } else {
+                const { smallSign, smallValue, bigSign, bigValue } = condition;
+                if (!smallSign || !smallValue || !bigSign || !bigValue) break;
+                const getSigin = (sigin: Number) =>
+                  SiginOptions.find((item) => item.value == sigin)?.label;
+                const getSmallSigin = (sigin: Number) =>
+                  SiginSmallOptions.find((item) => item.value == sigin)?.label;
 
-              text.push(
-                `${smallValue} ${getSmallSigin(smallSign)} ${label} ${getSigin(
-                  bigSign,
-                )} ${bigValue} `,
-              );
-            }
-            break;
-          case ComponentName.Select:
-          case ComponentName.MultiSelect:
-            const values = judge.values;
-            text.push(`${label} ${values?.join(' 且 ')}`);
-            break;
+                text.push(
+                  `${smallValue} ${getSmallSigin(
+                    smallSign,
+                  )} ${label} ${getSigin(bigSign)} ${bigValue} `,
+                );
+              }
+              break;
+            case ComponentName.Select:
+            case ComponentName.MultiSelect:
+              const values = judge.values;
+              text.push(`${label} ${values?.join(' 且 ')}`);
+              break;
+          }
+        });
+        let content = (text || []).map((text, index) => (
+          <div key={index}>
+            {index != 0 && <div>并且</div>}
+            {text}
+          </div>
+        ));
+        if (formItemsOr.length == 1) {
+          allText.push(content);
+        } else {
+          allText.push(
+            <Card size="small" title={`条件组${index + 1}`}>
+              {content}
+            </Card>,
+          );
         }
       });
     }
-    if (text.length <= 0) text.push('其他条件进入此流程');
-    return text;
-  }, [formItems, depUserTree]);
+    if (allText.length == 0) allText.push('其他条件进入此流程');
+    return allText;
+  }, [formItemsOr, depUserTree]);
 
   return (
     <div
@@ -89,6 +116,7 @@ const JudgeRect = (props: any) => {
         width,
         height,
         padding: '6px',
+        overflowY: 'auto',
         boxShadow:
           '0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19)',
       }}
@@ -99,26 +127,14 @@ const JudgeRect = (props: any) => {
       <div style={{ color: '#15BC83' }}>{label}</div>
       <div
         style={{
-          height: `${height - 32}px`,
+          height: `${height - 36}px`,
           // overflow: 'hidden',
           // textOverflow: 'ellipsis',
           // whiteSpace: 'nowrap',
           fontSize,
         }}
       >
-        {(contentText || []).map((text, index) => (
-          <span key={index}>
-            {index != 0 && (
-              <>
-                <br />
-                并且
-                <br />
-              </>
-            )}
-
-            {text}
-          </span>
-        ))}
+        {contentText}
       </div>
     </div>
   );

src/components/Flow/node/judgeNode/mapServe.tsx

@@ -1,13 +1,21 @@
 import React, { useState, useEffect, useMemo } from 'react';
 import { FlowchartFormWrapper } from '@antv/xflow';
-import { Position, Size, ColorPicker, InputNumberField, InputField, SelectField } from '../fields';
+import {
+  Position,
+  Size,
+  ColorPicker,
+  InputNumberField,
+  InputField,
+  SelectField,
+} from '../fields';
 import { PREFIX } from '../constants';
-import { connect } from "umi";
+import { connect } from 'umi';
 import { UnityAction } from '@/utils/utils';
-import { Button } from 'antd';
+import { Button, Card } from 'antd';
 import AddCondition from '../../components/judgeModal';
 import RenderJudge, { JudgeType } from '../../components/judgeComponent';
 import { TYPE } from '../auditNode/mapServe';
+import { CloseOutlined, PlusOutlined } from '@ant-design/icons';
 
 // export const enum TYPE {
 //   AUDIT,
@@ -39,7 +47,10 @@ export interface IConfig {
   flow_node_id?: string;
   process_code?: string;
   type: TYPE;
+  // 条件  【此字段存在是为了兼容旧格式】
   formItems: string;
+  // 条件组 【新版用此字段】 formItems和formItemsOr同时只能存在一个
+  formItemsOr: string[];
   priority?: number; //优先级
 }
 
@@ -56,7 +67,7 @@ export interface FormItem {
 }
 
 const Component = (props: any) => {
-  const { config, plugin = {}, formItems } = props;
+  const { config, plugin = {}, formData } = props;
   const { updateNode } = plugin;
 
   // const formData: FormItem[] = [
@@ -114,6 +125,8 @@ const Component = (props: any) => {
   const [nodeConfig, setNodeConfig] = useState<IConfig>({
     ...config,
   });
+  const formItemsGroup = nodeConfig.formItemsOr || [];
+
   const onNodeConfigChange = (key: string, value: number | string | object) => {
     if (key) {
       setNodeConfig({
@@ -140,6 +153,72 @@ const Component = (props: any) => {
     UnityAction.emit('NODE_SAVE', nodeConfig);
   };
 
+  const onAddConditionGroup = () => {
+    onNodeConfigChange('formItemsOr', [...formItemsGroup, '[]']);
+  };
+  const onRemoveConditionGroup = (index: number) => {
+    let tempGroup = [...formItemsGroup];
+    tempGroup.splice(index, 1);
+    onNodeConfigChange('formItemsOr', [...tempGroup]);
+  };
+
+  const onAddCondition = (values: FormItem[], index: number) => {
+    const getFormItemsStr = (formItems: string) => {
+      let newFormItems: FormItem[] = [];
+      let oldFormItems = JSON.parse(formItems || '[]');
+      values.forEach((item) => {
+        let id = item.props.id;
+        // 判断是否含有旧的item
+        let oldItem = oldFormItems.find(
+          (formItem: FormItem) => formItem.props.id == id,
+        );
+        if (oldItem) {
+          newFormItems.push(oldItem);
+        } else {
+          newFormItems.push(item);
+        }
+      });
+      return JSON.stringify(newFormItems);
+    };
+    let tempGroup = [...formItemsGroup];
+    // 更新条件组
+    tempGroup[index] = getFormItemsStr(tempGroup[index]);
+    onNodeConfigChange('formItemsOr', tempGroup);
+  };
+
+  const renderCondition = () => {
+    let Cards: any = [];
+    formItemsGroup.forEach((formItems: string, index: number) => {
+      Cards.push(
+        <Card
+          key={index}
+          title={`条件组${index + 1}`}
+          extra={
+            <CloseOutlined onClick={() => onRemoveConditionGroup(index)} />
+          }
+        >
+          <AddCondition
+            items={formData}
+            formItems={formItems}
+            onOk={(values: FormItem[]) => onAddCondition(values, index)}
+          />
+          <RenderJudge
+            formItems={formItems}
+            onChange={(values: FormItem[]) => {
+              let tempGroup = [...formItemsGroup];
+              tempGroup[index] = JSON.stringify(values);
+              onNodeConfigChange('formItemsOr', tempGroup);
+            }}
+          />
+        </Card>,
+      );
+      if (index != formItemsGroup.length - 1) {
+        Cards.push(<div>或</div>);
+      }
+    });
+    return Cards;
+  };
+
   useEffect(() => {
     setNodeConfig({
       ...config,
@@ -153,7 +232,7 @@ const Component = (props: any) => {
         <InputField
           label="标题"
           value={nodeConfig.label}
-          onChange={value => {
+          onChange={(value) => {
             onNodeConfigChange('label', value);
           }}
         />
@@ -191,7 +270,7 @@ const Component = (props: any) => {
         <InputNumberField
           label="消息数量"
           value={nodeConfig.count}
-          onChange={value => {
+          onChange={(value) => {
             onNodeConfigChange('count', value);
           }}
         />
@@ -200,7 +279,7 @@ const Component = (props: any) => {
             label="字号"
             value={nodeConfig.fontSize}
             width={68}
-            onChange={value => {
+            onChange={(value) => {
               onNodeConfigChange('fontSize', value);
             }}
           />
@@ -215,37 +294,16 @@ const Component = (props: any) => {
           label="优先级"
           value={nodeConfig.priority}
           width={68}
-          onChange={value => {
+          onChange={(value) => {
             onNodeConfigChange('priority', value);
           }}
         />
-        <AddCondition
-          items={formItems}
-          formItems={nodeConfig.formItems}
-          onOk={(values: FormItem[]) => {
-            console.log('===formItems===', values);
-            let newFormItems = [];
-            let oldFormItems = JSON.parse(nodeConfig.formItems || '[]');
-            values.forEach(item => {
-              let id = item.props.id;
-              // 判断是否含有旧的item
-              let oldItem = oldFormItems.find(formItem => formItem.props.id == id);
-              if (oldItem) {
-                newFormItems.push(oldItem);
-              } else {
-                newFormItems.push(item);
-              }
-            });
-            onNodeConfigChange('formItems', JSON.stringify(newFormItems));
-          }}
-        />
-        <RenderJudge
-          formItems={nodeConfig.formItems}
-          onChange={(values: FormItem[]) => {
-            console.log('===formItems===', values);
-            onNodeConfigChange('formItems', JSON.stringify(values));
-          }}
-        />
+
+        <Button icon={<PlusOutlined />} onClick={() => onAddConditionGroup()}>
+          新增条件组
+        </Button>
+
+        {renderCondition()}
       </div>
 
       <Button style={{ marginTop: 20 }} type="primary" onClick={onSave}>
@@ -258,11 +316,14 @@ const Component = (props: any) => {
 function RecthServe(props: any) {
   return (
     <FlowchartFormWrapper {...props}>
-      {(config, plugin) => <Component {...props} plugin={plugin} config={config} />}
+      {(config, plugin) => (
+        <Component {...props} plugin={plugin} config={config} />
+      )}
     </FlowchartFormWrapper>
   );
 }
 
-export default connect(({ xflow }) => ({ auditList: xflow.auditList, formItems: xflow.formData }))(
-  RecthServe
-);
+export default connect(({ xflow }: any) => ({
+  auditList: xflow.auditList,
+  formData: xflow.formData,
+}))(RecthServe);

src/pages/Flow/OaDetail.js

@@ -16,6 +16,7 @@ import { useParams, useRequest, useNavigate } from 'umi';
 const OaDetail = () => {
   const [form] = Form.useForm();
   const [approvalProcess, setApprovalProcess] = useState([]);
+  const [auditCheck, setAuditCheck] = useState([]);
   const { oaId } = useParams();
   const formValueRef = useRef({
     form: '',
@@ -89,14 +90,17 @@ const OaDetail = () => {
   const submit = () => {
     form.validateFields().then((values) => {
       const { form: formCur } = formValueRef.current;
-      let audit_list = [];
-      approvalProcess?.forEach((item) => {
-        if (item[0].type == 'role') audit_list.push(item[0].nowValue);
+      let audit_list = [],
+        cc_list = [];
+      approvalProcess?.forEach((item, index) => {
+        let arr = item[0].is_cc == 1 ? cc_list : audit_list;
+
+        if (item[0].type == 'role') arr.push(auditCheck[index]);
         else if (item[0].type == 'leader')
-          audit_list.push(
+          arr.push(
             ...leaderData.slice(0, item[0].value).map((leader) => leader.ID),
           );
-        else audit_list.push(item[0].value);
+        else arr.push(item[0].value);
       });
       let files = [],
         formData = [];
@@ -107,10 +111,12 @@ const OaDetail = () => {
           formData.push(item);
         }
       });
+      console.log(audit_list, cc_list);
       createRun({
         flow_id: Number(oaId),
         form: JSON.stringify(formData),
         audit_list,
+        cc_list,
         files: files.join(','),
       });
     });
@@ -153,7 +159,7 @@ const OaDetail = () => {
             <ApprovalProcess
               leaderData={leaderData}
               approvalProcess={approvalProcess}
-              onChange={setApprovalProcess}
+              onChange={setAuditCheck}
             />
           )}
         </Col>

src/pages/Flow/components/ApprovalProcess.tsx

@@ -1,85 +1,137 @@
-import React, { useEffect, useMemo, useState } from 'react';
+import React, { CSSProperties, useEffect, useMemo, useState } from 'react';
 import { queryUserListByRoleID, queryLeader } from '@/services/boom';
 import { connect } from 'umi';
-import { PlusOutlined } from '@ant-design/icons';
+import { CheckOutlined, PlusOutlined } from '@ant-design/icons';
 import { Popover, Radio, RadioChangeEvent, Spin, Steps } from 'antd';
 import { useModel, useRequest } from '@umijs/max';
 
 const { Step } = Steps;
 
-enum TYPE {
-  ROLE = 'role',
-  USER = 'user',
-  LEADER = 'leader',
+const TYPE = {
+  ROLE: 'role',
+  USER: 'user',
+  LEADER: 'leader',
+} as const;
+
+interface AuditNode {
+  is_cc: 0 | 1;
+  seq: number;
+  type: (typeof TYPE)[keyof typeof TYPE];
+  value: number[];
+  checkValue: [];
 }
 
 const ApprovalProcess = (props: any) => {
   const {
     approvalProcess,
-    leaderData,
+    leaderData = [],
     dispatch,
     onChange,
     roleList = [],
   } = props;
-  const [selectUserList, setSelectUserList] = useState([]);
-  const [curNodeIdx, setCurNodeIdx] = useState(-1);
-  const [loading, setLoading] = useState(false);
   const { userList, run } = useModel('userList');
+  const [checkValue, setCheckValue] = useState<number[]>([]);
 
-  const list = useMemo(() => {
-    approvalProcess
-      ?.filter((item: any) => item)
-      .forEach((item: any) => {
-        if (item.length > 1 && item[0].type == TYPE.USER) {
-          item.forEach((curUser: any) => {
-            curUser.name =
-              userList?.find((user: any) => user.ID == curUser.value)?.CName ||
-              '-';
-          });
-        } else if (item.length == 1 && item[0].type == TYPE.USER) {
-          item[0].name =
-            userList?.find((user: any) => user.ID == item[0].value)?.CName ||
-            '-';
-        } else if (item.length == 1 && item[0].nowType == TYPE.USER) {
-          item[0].name =
-            userList?.find((user: any) => user.ID == item[0].nowValue)?.CName ||
-            '-';
-        } else {
-          item[0].name = null;
-        }
-      });
-    return approvalProcess?.filter((item: any) => item);
+  const { auditList, ccList } = useMemo<{
+    auditList: AuditNode[];
+    ccList: AuditNode[];
+  }>(() => {
+    let auditList: AuditNode[] = [],
+      ccList: AuditNode[] = [];
+    approvalProcess.forEach((item: any, index: number) => {
+      if (!item) return;
+      let node: AuditNode = {
+        is_cc: item[0].is_cc,
+        type: item[0].type,
+        checkValue: [],
+        seq: index,
+        value: item.map((node: any) => node.value),
+      };
+
+      if (node.is_cc == 1) {
+        ccList.push(node);
+      } else {
+        auditList.push(node);
+      }
+    });
+    return { auditList, ccList };
   }, [approvalProcess]);
 
-  const onStepsChange = async (current: any, list: any) => {
-    setLoading(true);
-    const itemNode = list[current][0];
-    if (itemNode.type !== 'role') return;
-    const data = await queryUserListByRoleID({ role_id: itemNode.value });
-    setCurNodeIdx(current);
-    setSelectUserList(data);
-    setLoading(false);
+  const onCheckValue = (value: number, index: number) => {
+    let values = [...checkValue];
+    values[index] = value;
+    setCheckValue(values);
+    onChange(values);
   };
 
-  const selectedUserId = ({ target: { value } }: RadioChangeEvent) => {
-    //userId
-    const name = userList?.find((user: any) => user.ID == value)?.CName || '-';
-    const data = { nowType: TYPE.USER, nowValue: Number(value), name }; //type: TYPE.USER, value: Number(value)
-    list[curNodeIdx][0] = { ...list[curNodeIdx][0], ...data };
-    console.log([...list]);
-    onChange?.([...list]);
+  useEffect(() => {
+    dispatch({
+      type: 'user/getRoleList',
+    });
+    run();
+  }, []);
+  const rowStyle: CSSProperties = {
+    display: 'flex',
+    flexDirection: 'column',
+    fontSize: 16,
   };
 
-  const content = (
-    <Spin spinning={loading}>
-      <Radio.Group onChange={selectedUserId}>
-        {selectUserList.map((item: any) => (
-          // <Button onClick={() => selectedUserId(item.user_id)}>{item.c_name}</Button>
-          <Radio.Button value={item.user_id}>{item.c_name}</Radio.Button>
+  return (
+    <div>
+      <div style={rowStyle}>
+        {auditList.map((item: AuditNode, index: number) => (
+          <AuditNodeStep
+            key={`${item.type}-${item.value.join('.')}-${index}`}
+            leaderData={leaderData}
+            item={item}
+            roleList={roleList}
+            userList={userList}
+            value={checkValue[item.seq]}
+            onChange={(value: number) => onCheckValue(value, item.seq)}
+          />
         ))}
-      </Radio.Group>
-    </Spin>
+      </div>
+      {ccList.length > 0 && (
+        <div style={rowStyle}>
+          <h3 style={{ margin: "20px 0", fontWeight: 'bold' }}>抄送人</h3>
+          {ccList.map((item: AuditNode, index: number) => (
+            <AuditNodeStep
+              key={`${item.type}-${item.value.join('.')}-${index}`}
+              leaderData={leaderData}
+              item={item}
+              roleList={roleList}
+              userList={userList}
+              value={checkValue[item.seq]}
+              onChange={(value: number) => onCheckValue(value, item.seq)}
+            />
+          ))}
+        </div>
+      )}
+    </div>
   );
+};
+
+interface AuditNodeStepProps {
+  item: AuditNode;
+  leaderData: any;
+  roleList: any;
+  userList: any;
+  value: number;
+  onChange: (value: number) => void;
+}
+
+const AuditNodeStep = (props: AuditNodeStepProps) => {
+  const {
+    item,
+    leaderData,
+    roleList = [],
+    userList = [],
+    value,
+    onChange,
+  } = props;
+
+  const [selectUserList, setSelectUserList] = useState([]);
+  const [loading, setLoading] = useState(false);
 
   const getLeaderContent = (length: any) => (
     <Steps
@@ -92,67 +144,84 @@ const ApprovalProcess = (props: any) => {
     ></Steps>
   );
 
-  useEffect(() => {
-    dispatch({
-      type: 'user/getRoleList',
-    });
-    run();
-  }, []);
+  const handleOpen = async () => {
+    setLoading(true);
+    if (item.type !== 'role') return;
+    const data = await queryUserListByRoleID({ role_id: item.value[0] });
+    setSelectUserList(data);
+    setLoading(false);
+  };
+
+  const selectedUserId = ({ target: { value } }: RadioChangeEvent) => {
+    onChange(Number(value));
+  };
+
+  const content = (
+    <Spin spinning={loading}>
+      <Radio.Group onChange={selectedUserId} value={value}>
+        {selectUserList.map((item: any) => (
+          <Radio.Button value={Number(item.user_id)}>
+            {item.c_name}
+          </Radio.Button>
+        ))}
+      </Radio.Group>
+    </Spin>
+  );
+
+  if (item.type == TYPE.LEADER) {
+    return (
+      <div style={{ marginBottom: 20 }}>
+        <Popover
+          placement="bottomLeft"
+          title="查看审批人"
+          content={getLeaderContent(item.value[0])}
+          overlayStyle={{ width: '300px' }}
+        >
+          <CheckOutlined style={{ marginRight: 20 }} />
+          {Math.min(item.value[0], leaderData?.length)}级主管审批
+        </Popover>
+      </div>
+    );
+  }
+  if (item.type == TYPE.ROLE) {
+    let title = '';
+    if (value) {
+      title = userList.find((cur: any) => cur.ID == value)?.CName;
+    } else {
+      const names = item.value.map((id) => {
+        const role = roleList.find((cur: any) => cur.ID == id);
+        return role?.Name;
+      });
+      title = `从${names.join('、')}选择`;
+    }
+    return (
+      <div style={{ marginBottom: 20, cursor: 'pointer' }}>
+        <Popover
+          placement="bottomLeft"
+          title={'选择审批人'}
+          content={content}
+          trigger="click"
+          overlayStyle={{ width: '300px' }}
+          onOpenChange={handleOpen}
+          style={{ marginBottom: 20 }}
+        >
+          <PlusOutlined style={{ marginRight: 20 }} /> {title}
+        </Popover>
+      </div>
+    );
+  }
+  const names = item.value.map((id) => {
+    const user = userList.find((cur: any) => cur.ID == id);
+    return user?.CName;
+  });
 
   return (
-    <>
-      <Steps
-        current={-1}
-        direction="vertical"
-        onChange={(value) => onStepsChange(value, list)}
-      >
-        {list?.map((item: any, index: Number) =>
-          item[0]?.type == TYPE.LEADER ? (
-            <Step
-              key={String(index)}
-              icon={
-                <Popover
-                  placement="bottomLeft"
-                  title="查看审批人"
-                  content={getLeaderContent(item[0]?.value)}
-                  overlayStyle={{ width: '300px' }}
-                >
-                  <PlusOutlined />
-                </Popover>
-              }
-              title={`${Math.min(
-                item[0]?.value,
-                leaderData?.length,
-              )}级主管审批`}
-            />
-          ) : (
-            <Step
-              key={String(index)}
-              icon={
-                <Popover
-                  placement="bottomLeft"
-                  title={'选择审批人'}
-                  content={content}
-                  trigger="click"
-                  overlayStyle={{ width: '300px' }}
-                >
-                  <PlusOutlined />
-                </Popover>
-              }
-              title={
-                item[0]?.name ||
-                `从${
-                  roleList?.find((cur: any) => cur.ID == item[0]?.value)
-                    ?.Name || '-'
-                }选择`
-              }
-            />
-          ),
-        )}
-      </Steps>
-    </>
+    <div style={{ marginBottom: 20 }}>
+      <CheckOutlined style={{ marginRight: 20 }} /> {names.join('、')}
+    </div>
   );
 };
+
 export default connect(({ user }: any) => ({
   roleList: user.roleList,
 }))(ApprovalProcess);

src/pages/Flow/components/AuditDetailed.js

@@ -20,7 +20,6 @@ const AuditDetailed = (props) => {
           return linked ? Object.values(linked).flat() : [];
         })
         .flat() || [];
-    console.log(linkedData, linkedList);
     return { linkedData, linkedList };
   }, [items]);
 

src/services/boom.js

@@ -137,6 +137,15 @@ export async function queryProcessFlows(params) {
     formData: data.form_json ? JSON.parse(data.form_json) : [],
     simpleFlowDteail: data.process_simple_json,
   };
+  // 旧字段formItems  替换为新字段条件组 formItemsOr
+  item.flowDetail.nodes.forEach((node) => {
+    if (node.formItems) {
+      node.formItemsOr = [node.formItems];
+      node.formItems = '';
+    } else {
+      node.formItemsOr = node.formItemsOr || [];
+    }
+  });
   return { data: item };
 }
 export async function saveAuditFlowInfo(data) {
@@ -197,6 +206,7 @@ export async function advanceSubmitNextNode(params) {
     template_id: 0,
     cur_template_id: 0,
     next_template_id: 0,
+    ...params,
     form_list: [JSON.stringify(params)],
   };
   return request(`/api/v1/oa/next/node/advance-submit`, {