抄送人

src/components/Flow/index.tsx

@@ -43,11 +43,11 @@ import CustomFlowchartFormPanel from './node/FlowFormPanel';
 // import CustomRect from './react-node/CustomRect';
 
 import '@antv/xflow/dist/index.css';
-import { Collapse } from "antd"
+import { Collapse } from 'antd';
 import './index.less';
 import { TYPE } from './node/auditNode/mapServe';
 
-const { Panel } = Collapse
+const { Panel } = Collapse;
 
 export interface IProps {
   meta: {
@@ -99,7 +99,7 @@ export const Demo: React.FC<IProps> = props => {
                 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/auditNode/index.tsx

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

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

@@ -102,6 +102,10 @@ const Component = (props: any) => {
   const onSave = () => {
     UnityAction.emit('NODE_SAVE', nodeConfig);
   };
+
+  const current = useMemo(() => {
+    return typeOption.find(item => item.value == nodeConfig.type);
+  }, [nodeConfig.type]);
   useEffect(() => {
     setNodeConfig({
       ...defaultConfig,
@@ -182,9 +186,9 @@ const Component = (props: any) => {
             }}
           />
         </div>
-        {nodeConfig.type != TYPE.AUDIT && (
+        {nodeConfig.type == TYPE.INITIATOR && (
           <div className="group">
-            <label>{typeOption.find(item => item.value == nodeConfig.type)?.label || '-'}</label>
+            <label>{current?.label || '-'}</label>
             <TreeSelect
               showSearch
               multiple
@@ -200,9 +204,9 @@ const Component = (props: any) => {
           </div>
         )}
 
-        {nodeConfig.type == TYPE.AUDIT && (
+        {nodeConfig.type != TYPE.INITIATOR && (
           <div className={`${PREFIX}-panel-group`}>
-            <h5>审批人</h5>
+            <h5>{current?.label || '-'}</h5>
             <Radio.Group
               onChange={(e: RadioChangeEvent) => {
                 console.log(e.target.value);
@@ -217,18 +221,23 @@ const Component = (props: any) => {
             <div className="group">
               {isRole ? (
                 <>
-                  <label>审批角色</label>
+                  <label>{current?.label || '-'}角色</label>
                   <Select
                     showSearch
                     style={{ width: '100%' }}
                     value={nodeConfig.audits?.map(item => item.value)}
                     filterOption={(input, option) => option.props.children.indexOf(input) >= 0}
                     onChange={value => {
-                      onNodeConfigChange('audits', [{ type: IDTYPE.ROLE, value: Number(value) }]);
+                      onNodeConfigChange('audits', [
+                        {
+                          type: IDTYPE.ROLE,
+                          value: Number(value),
+                          is_cc: current.value == TYPE.COPYMAN ? 1 : 0,
+                        },
+                      ]);
                     }}
                   >
-                    {roleList &&
-                      roleList.map(item => (
+                    {roleList?.map(item => (
                         <Option key={item.ID} value={item.ID}>
                           {item.Name}
                         </Option>
@@ -237,13 +246,19 @@ const Component = (props: any) => {
                 </>
               ) : (
                 <>
-                  <label>审批人</label>
+                  <label>{current?.label || '-'}</label>
                   <Select
                     showSearch
                     style={{ width: '100%' }}
                     value={nodeConfig.audits?.map(item => item.value)}
                     onChange={value => {
-                      onNodeConfigChange('audits', [{ type: IDTYPE.USER, value: Number(value) }]);
+                      onNodeConfigChange('audits', [
+                        {
+                          type: IDTYPE.USER,
+                          value: Number(value),
+                          is_cc: current.value == TYPE.COPYMAN ? 1 : 0,
+                        },
+                      ]);
                     }}
                     filterOption={(input, option) => option.props.children.indexOf(input) >= 0}
                   >

src/pages/Detail/ApprovalProcess.tsx

@@ -1,9 +1,10 @@
-import React, { useMemo, useState } from 'react';
+import React, { useMemo, useRef, useState } from 'react';
 
 import { queryUserListByRoleID } from '@/services/boom';
 import { connect } from 'dva';
 import { PlusOutlined } from '@ant-design/icons';
 import { Popover, Radio, RadioChangeEvent, Spin, Steps } from 'antd';
+import list from '../List/models/list';
 
 const { Step } = Steps;
 
@@ -18,8 +19,10 @@ const ApprovalProcess = props => {
   const [curNodeIdx, setCurNodeIdx] = useState(-1);
   const [loading, setLoading] = useState(false);
 
-  const list = useMemo(() => {
+  const { auditList, ccList } = useMemo(() => {
     const newList = approvalProcess[id];
+    let auditList = [],
+      ccList = [];
     newList?.forEach(item => {
       if (item.length > 1 && item[0].type == TYPR.USER) {
         item.forEach(curUser => {
@@ -32,8 +35,14 @@ const ApprovalProcess = props => {
       } else {
         item[0].name = null;
       }
+
+      if (item[0].is_cc == 1) {
+        ccList.push(item);
+      } else {
+        auditList.push(item);
+      }
     });
-    return newList;
+    return { auditList, ccList };
   }, [approvalProcess]);
 
   const onStepsChange = async (current, list) => {
@@ -46,42 +55,69 @@ const ApprovalProcess = props => {
     setLoading(false);
   };
 
-  const selectedUserId = ({ target: { value } }: RadioChangeEvent) => {
+  const selectedUserId = ({ target: { value } }: RadioChangeEvent, list) => {
     //userId
     const name = userList.find(user => user.ID == value)?.CName || '-';
-    const data = { nowType: TYPR.USER, nowValue: Number(value), name }; //type: TYPR.USER, value: Number(value)
-    list[curNodeIdx][0] = { ...list[curNodeIdx][0], ...data };
-    console.log(list);
-    onChange?.({ ...approvalProcess, [id]: list });
+    // const data = { nowType: TYPR.USER, nowValue: Number(value), name }; //type: TYPR.USER, value: Number(value)
+    let cur = list[curNodeIdx][0];
+    cur.nowType = TYPR.USER;
+    cur.nowValue = Number(value);
+    cur.name = name;
+    onChange?.({ ...approvalProcess });
   };
 
-  const content = (
-    <Spin spinning={loading}>
-      <Radio.Group onChange={selectedUserId}>
-        {selectUserList.map(item => (
-          // <Button onClick={() => selectedUserId(item.user_id)}>{item.c_name}</Button>
-          <Radio.Button value={item.user_id}>{item.c_name}</Radio.Button>
-        ))}
-      </Radio.Group>
-    </Spin>
-  );
+  const renderContent = list => {
+    return (
+      <Spin spinning={loading}>
+        <Radio.Group onChange={e => selectedUserId(e, list)}>
+          {selectUserList.map(item => (
+            // <Button onClick={() => selectedUserId(item.user_id)}>{item.c_name}</Button>
+            <Radio.Button value={item.user_id}>{item.c_name}</Radio.Button>
+          ))}
+        </Radio.Group>
+      </Spin>
+    );
+  };
 
   return (
-    <>
-      <Steps current={-1} direction="vertical" onChange={value => onStepsChange(value, list)}>
-        {list?.map(item => (
+    <div>
+      <h3>审批列表</h3>
+      <Steps current={-1} direction="vertical" onChange={value => onStepsChange(value, auditList)}>
+        {auditList?.map(item => (
+          <Step
+            key={item[0]?.value}
+            icon={
+              <Popover
+                placement="bottomLeft"
+                title={'选择审批人'}
+                content={renderContent(auditList)}
+                trigger="click"
+                overlayStyle={{ width: '300px' }}
+              >
+                <PlusOutlined />
+              </Popover>
+            }
+            title={
+              item[0]?.name || `从${roleList?.find(cur => cur.ID == item[0]?.value)?.Name}选择`
+            }
+          />
+        ))}
+      </Steps>
+      <h3 style={{ marginTop: 20 }}>抄送人</h3>
+      <Steps current={-1} direction="vertical" onChange={value => onStepsChange(value, ccList)}>
+        {ccList?.map(item => (
           <Step
             key={item[0]?.value}
             icon={
               <Popover
-                  placement="bottomLeft"
-                  title={'选择审批人'}
-                  content={content}
-                  trigger="click"
-                  overlayStyle={{ width: '300px' }}
-                >
-                  <PlusOutlined />
-                </Popover>
+                placement="bottomLeft"
+                title={'选择审批人'}
+                content={renderContent(ccList)}
+                trigger="click"
+                overlayStyle={{ width: '300px' }}
+              >
+                <PlusOutlined />
+              </Popover>
             }
             title={
               item[0]?.name || `从${roleList?.find(cur => cur.ID == item[0]?.value)?.Name}选择`
@@ -89,10 +125,7 @@ const ApprovalProcess = props => {
           />
         ))}
       </Steps>
-      {/* {selectUserList.map(item => (
-        <Button onClick={() => selectedUserId(item.user_id)}>{item.c_name}</Button>
-      ))} */}
-    </>
+    </div>
   );
 };
 export default connect(({ xflow, detail, user }) => ({

src/pages/Detail/CommitAuditModal.js

@@ -384,15 +384,19 @@ function CommitAuditModal(props) {
       let approvalNode = flowDetail.nodes.find?.(item => item.Id == id);
       if (!approvalNode) return;
       let values = data[approvalNode.Id] || [];
-      const audit_list = approvalProcess[approvalNode.Id]?.map(item => {
-        if (item[0].type == 'role') return item[0].nowValue;
-        return item[0].value;
+      let audit_list = [],
+        cc_list = [];
+      approvalProcess[approvalNode.Id]?.forEach(item => {
+        let arr = item[0].is_cc == 1 ? cc_list : audit_list;
+        if (item[0].type == 'role') return arr.push(item[0].nowValue);
+        return arr.push(item[0].value);
       });
       const formItem = {
         flow_id: approvalNode.flow_id,
         template_node_id: approvalNode.Id,
         formComponentValues: [...values], //{ name: '附件', value: JSON.stringify(attachment) }
-        audit_list: audit_list || [],
+        audit_list,
+        cc_list,
       };
       result.push(JSON.stringify(formItem));
     });

src/pages/Detail/FlowModal.js

@@ -135,11 +135,11 @@ function FlowModal(props) {
   };
 
   const initData = async template_node_id => {
-    if (controller) {
-      // 中止上一次请求
-      controller.abort();
-    }
     try {
+      if (controller) {
+        // 中止上一次请求
+        controller.abort();
+      }
       setNodeLoading(true);
       controller = new AbortController();
       const res = await queryVserionByNode(

tsconfig.json

@@ -12,7 +12,6 @@
     "rootDirs": ["/src", "/test", "/mock", "./typings"],
     "forceConsistentCasingInFileNames": true,
     "noImplicitReturns": true,
-    "suppressImplicitAnyIndexErrors": true,
     "noUnusedLocals": true,
     "allowJs": true,
     "experimentalDecorators": true,