Skip to content

C
CivManage
Commit 4a754bef authored by 皮倩雯's avatar 皮倩雯
Browse files
Options

fix: '工单抄送，按照条件抄送'

parent 8905faae
Pipeline #83647 passed with stages
          Hide whitespace changes
          Inline Side-by-side
          Showing with 1154 additions and 119 deletions
          src/components/PeopleSelector/index.jsx
          View file @ 4a754bef
          /* eslint-disable no-else-return */
          /* eslint-disable indent */
          import React, { useState, useEffect, useCallback, useRef } from 'react'; import React, { useState, useEffect, useCallback, useRef } from 'react';
          import { Modal, Input, Button, message, Spin, Pagination, Table } from 'antd'; import {
          Modal,
          Input,
          Button,
          message,
          Spin,
          Pagination,
          Tag,
          Empty,
          Checkbox,
          notification,
          } from 'antd';
          import { DesktopOutlined, MobileOutlined, WindowsOutlined } from '@ant-design/icons';
          import { GetRoleUser, GetRoleUserNew } from '@/services/workflow/workflow';
          import { GetGroupUserTree, TestPush } from '@/services/messagemanage/messagemanage'; import { GetGroupUserTree, TestPush } from '@/services/messagemanage/messagemanage';
          import classnames from 'classnames';
          import lodash from 'lodash';
          import styles from './index.less'; import styles from './index.less';
          import CardCheck from './CardCheck'; import CardCheck from './CardCheck';
          const PeopleSelector = props => { const PeopleSelector = props => {
          const { confirmModal, onCancel, visible, onSubumit, personList } = props; const { confirmModal, onCancel, visible, onSubumit, userIds, roleIds } = props;
          const [allList, setAllist] = useState([]); // 用于展示得数据 const [allList, setAllist] = useState([]); // 用于展示得数据
          // const [checkList, setCheckList] = useState([]); // 选中得数据集合 const [checkListRoles, setCheckListRoles] = useState([]); // 选中得数据集合
          const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
          const [total, setTotal] = useState(); const [total, setTotal] = useState();
          const [currentPage, setCurrentPage] = useState(1); const [currentPage, setCurrentPage] = useState(1);
          ...@@ -16,20 +33,57 @@ const PeopleSelector = props => { ...@@ -16,20 +33,57 @@ const PeopleSelector = props => {
          const [searchName, setSearchName] = useState(); const [searchName, setSearchName] = useState();
          const [flag, setFlag] = useState(0); const [flag, setFlag] = useState(0);
          const checkList = useRef([]); const checkList = useRef([]);
          const [type, setType] = useState('人员');
          const [roleArr, setRoleArr] = useState([]); // 新角色机构选择列表
          const [delArr, setDelArr] = useState(new Map()); // 删除了的元素
          const [selected, setSelected] = useState(new Map()); // 已勾选角色列表
          useEffect(() => { useEffect(() => {
          if (visible) { if (visible) {
          setType('人员');
          setCurrentPage(1); setCurrentPage(1);
          // setCheckList(personList); checkList.current = userIds;
          checkList.current = personList;
          getData(searchName, 1, pageSize); getData(searchName, 1, pageSize);
          if (roleIds.length > 0) {
          roleIds.forEach(item => {
          selected.set(item.value, {
          roleName: item.label,
          roleId: item.value,
          type: 2,
          defauletUserName: '',
          defaultUserId: [],
          });
          });
          setSelected(selected);
          let arr = [];
          selected.forEach((val, key) => {
          arr.push({ label: val.roleName, value: val.roleId });
          });
          setCheckListRoles(arr);
          }
          } else { } else {
          // setCheckList([]);
          checkList.current = []; checkList.current = [];
          setCheckListRoles([]);
          setAllist([]); setAllist([]);
          setSearchName(''); setSearchName('');
          setSelected(new Map());
          setDelArr(new Map());
          } }
          }, [visible]); }, [visible]);
          const showTypeIcon = item => {
          if (item.type === 'mobile') {
          return <MobileOutlined />;
          }
          if (item.visibleValue == 'CS') {
          return <WindowsOutlined />;
          }
          if (item.visibleTitle.indexOf('手持') !== -1) {
          return <MobileOutlined />;
          }
          return <DesktopOutlined />;
          };
          // 选中后得回调函数 // 选中后得回调函数
          const checkCallBack = useCallback(newCheckList => { const checkCallBack = useCallback(newCheckList => {
          if (newCheckList) { if (newCheckList) {
          ...@@ -46,25 +100,28 @@ const PeopleSelector = props => { ...@@ -46,25 +100,28 @@ const PeopleSelector = props => {
          }; };
          // 提交勾选的测试人员 // 提交勾选的测试人员
          const onFinish = () => { const onFinish = () => {
          console.log(checkList.current, 'checkList'); let role = [];
          onSubumit(checkList.current); selected.forEach((val, key) => {
          role.push({ label: val.roleName, value: val.roleId });
          });
          let person = checkList.current;
          onSubumit({ person, role });
          }; };
          // 搜索 // 搜索
          const onSearch = () => { const onSearch = () => {
          setCurrentPage(1); setCurrentPage(1);
          getData(searchName, 1, pageSize); if (type === '人员') {
          }; getData(searchName, 1, pageSize);
          // 重置 } else {
          const onReset = () => { getRoleData(searchName);
          setCurrentPage(1); }
          getData('', 1, pageSize);
          setSearchName('');
          }; };
          // 搜索框监听 // 搜索框监听
          const searchChange = e => { const searchChange = e => {
          setSearchName(e.target.value); setSearchName(e.target.value);
          }; };
          // 获取数据 // 获取人员数据
          const getData = (username, page, pageSizes) => { const getData = (username, page, pageSizes) => {
          setLoading(true); setLoading(true);
          GetGroupUserTree({ GetGroupUserTree({
          ...@@ -75,7 +132,6 @@ const PeopleSelector = props => { ...@@ -75,7 +132,6 @@ const PeopleSelector = props => {
          .then(res => { .then(res => {
          setLoading(false); setLoading(false);
          if (res.code === 0) { if (res.code === 0) {
          console.log(checkList.current, 'checkList.current');
          setTotal(res.data.count); setTotal(res.data.count);
          // 数据处理成checkbox组件需要得形式 // 数据处理成checkbox组件需要得形式
          let list = res.data.data.map(item => { let list = res.data.data.map(item => {
          ...@@ -84,7 +140,6 @@ const PeopleSelector = props => { ...@@ -84,7 +140,6 @@ const PeopleSelector = props => {
          let checkAll = false; let checkAll = false;
          let options = item.users.map(val => { let options = item.users.map(val => {
          checkList.current.forEach(ele => { checkList.current.forEach(ele => {
          console.log(ele, 'elel');
          if (val.userId === ele.value) { if (val.userId === ele.value) {
          checkedList.push(ele.value); checkedList.push(ele.value);
          } }
          ...@@ -109,7 +164,6 @@ const PeopleSelector = props => { ...@@ -109,7 +164,6 @@ const PeopleSelector = props => {
          plainOptions: options, plainOptions: options,
          }; };
          }); });
          console.log(list, 'list');
          setAllist(list); setAllist(list);
          } else { } else {
          message.error(res.msg); message.error(res.msg);
          ...@@ -121,14 +175,336 @@ const PeopleSelector = props => { ...@@ -121,14 +175,336 @@ const PeopleSelector = props => {
          }); });
          }; };
          const columns = [ // 获取角色选择数据
          { const getRoleData = roleName => {
          title: '已选人员', roleName = roleName || '';
          dataIndex: 'label', setLoading(true);
          key: 'label', GetRoleUserNew({
          width: 300, roleName,
          }, }).then(res => {
          ]; setLoading(false);
          if (res.code === 0 && res.data.length) {
          let list = JSON.parse(JSON.stringify(res.data));
          list.forEach(item => {
          if (item.child.length) {
          item.child.forEach(v => {
          v.roleList.forEach(vv => {
          vv.roleID = Number(vv.roleID);
          if (selected.has(vv.roleID)) {
          vv.isChecked = true;
          } else {
          vv.isChecked = false;
          }
          });
          });
          }
          item.roleList.forEach(v => {
          v.roleID = Number(v.roleID);
          if (selected.has(v.roleID)) {
          v.isChecked = true;
          } else {
          v.isChecked = false;
          }
          });
          });
          setRoleArr(list);
          } else {
          setRoleArr([]);
          notification.error({
          message: '提示',
          duration: 3,
          description: res.msg,
          });
          }
          });
          };
          // 删除已选中列表
          const delSelected = (value, name) => {
          if (name === '人员') {
          let list = lodash.cloneDeep(checkList.current);
          let newList = list.filter(i => i.value != value.value);
          checkList.current = newList;
          let newData = allList.map(item => {
          let indeterminate = false;
          let checkedList = [];
          let checkAll = false;
          let options = item.plainOptions.map(val => {
          newList.forEach(ele => {
          if (val.value === ele.value) {
          checkedList.push(ele.value);
          }
          });
          return {
          label: val.label,
          value: val.value,
          };
          });
          if (checkedList.length === options.length && checkedList.length > 0) {
          checkAll = true;
          }
          if (checkedList.length < options.length && checkedList.length > 0) {
          indeterminate = true;
          }
          return {
          groupName: item.groupName,
          groupId: item.groupId,
          indeterminate,
          checkAll,
          checkedList,
          plainOptions: options,
          };
          });
          setAllist(newData);
          } else {
          let id = value.value;
          delArr.set(id, selected.get(id));
          selected.delete(id);
          setDelArr(delArr);
          setSelected(selected);
          let arr = [];
          selected.forEach((val, key) => {
          arr.push({ label: val.roleName, value: val.roleId });
          });
          setCheckListRoles(arr);
          let list = JSON.parse(JSON.stringify(roleArr));
          list.forEach(item => {
          if (item.child.length) {
          let newArr = [];
          item.child[0].roleList.forEach(v => {
          if (v.roleID === id) {
          v.isChecked = false;
          }
          if (v.isChecked) {
          newArr.push(v.isChecked);
          }
          });
          item.child[0].isChecked = getState(item.child[0].roleList, newArr);
          item.child[0].indeterminate = getIndeterminate(item.child[0].roleList, newArr);
          }
          item.roleList.forEach(v => {
          if (v.roleID === id) {
          v.isChecked = false;
          }
          });
          });
          setRoleArr(list);
          }
          };
          const getState = (list, check) => {
          if (list.length === check.length && check.length !== 0) {
          return true;
          } else if (list.length > check.length && check.length !== 0) {
          return false;
          } else {
          return false;
          }
          };
          const getIndeterminate = (list, check) => {
          if (list.length > check.length && check.length !== 0) {
          return true;
          }
          return false;
          };
          // 复选框监听事件
          const selectChange = (e, index, value, name, i, j) => {
          let list = JSON.parse(JSON.stringify(roleArr));
          if (name === 'child') {
          list[i].child[j].roleList[index].isChecked = e.target.checked;
          } else {
          list[i].roleList[index].isChecked = e.target.checked;
          }
          list.forEach(item => {
          if (item.child.length) {
          item.child.forEach(ele => {
          let arr = [];
          ele.roleList.forEach(v => {
          if (v.isChecked) {
          arr.push(v.isChecked);
          }
          });
          ele.isChecked = getState(ele.roleList, arr);
          ele.indeterminate = getIndeterminate(ele.roleList, arr);
          });
          }
          let arrList = [];
          item.roleList.forEach(v => {
          if (v.isChecked) {
          arrList.push(v.isChecked);
          }
          });
          item.checkAll = getState(item.roleList, arrList);
          item.indeterminate = getIndeterminate(item.roleList, arrList);
          });
          // 存储勾选角色
          if (e.target.checked) {
          // 存储已选角色或站点的默认承办人
          if (delArr.has(value.roleID)) {
          selected.set(value.roleID, delArr.get(value.roleID));
          delArr.delete(value.roleID);
          } else {
          selected.set(value.roleID, {
          roleName: value.roleName,
          type: 2,
          roleId: value.roleID,
          defauletUserName: '',
          defaultUserId: [],
          });
          }
          } else {
          delArr.set(value.roleID, selected.get(value.roleID));
          selected.delete(value.roleID);
          }
          let arr = [];
          selected.forEach((val, key) => {
          arr.push({ label: val.roleName, value: val.roleId });
          });
          setCheckListRoles(arr);
          setDelArr(delArr);
          setSelected(selected);
          setRoleArr(list);
          };
          // 全选复选框监听事件
          const selectChangeAll = (e, index, value, num, i) => {
          let list = JSON.parse(JSON.stringify(roleArr));
          list[i].child[index].checkAll = e.target.checked;
          list[i].child[index].indeterminate = false;
          list[i].child[index].roleList.map(item => {
          item.isChecked = e.target.checked;
          });
          value.roleList.map(val => {
          if (e.target.checked) {
          // 存储已选角色或站点的默认承办人
          if (delArr.has(val.roleID)) {
          selected.set(val.roleID, delArr.get(val.roleID));
          delArr.delete(val.roleID);
          } else {
          selected.set(val.roleID, {
          roleName: val.roleName,
          type: 2,
          roleId: val.roleID,
          defauletUserName: '',
          defaultUserId: [],
          });
          }
          } else {
          delArr.set(val.roleID, selected.get(val.roleID));
          selected.delete(val.roleID);
          }
          });
          console.log(list);
          debugger;
          let arr = [];
          selected.forEach((val, key) => {
          arr.push({ label: val.roleName, value: val.roleId });
          });
          setCheckListRoles(arr);
          setDelArr(delArr);
          setSelected(selected);
          setRoleArr(list);
          };
          // 角色列表样式
          const roleDom = () => (
          <>
          <div className={styles.checkContainer1}>
          {roleArr.length ? (
          <div className={styles.checkContents}>
          {roleArr.map((v, i) => {
          return (
          <div className={styles.list} key={v.visibleTitle}>
          <div className={styles.parent}>
          {/* <Checkbox
          checked={v.checkAll}
          indeterminate={v.indeterminate}
          onChange={e => {
          selectChangeAll(e, i, v, '1');
          }}
          >
          <>
          <span style={{ color: '#1890ff', marginRight: '10px' }}>
          {showTypeIcon(v)}
          </span>
          <span>{v.visibleTitle}</span>
          </>
          </Checkbox> */}
          <span>
          <span style={{ color: '#1890ff', marginRight: '10px' }}>
          {showTypeIcon(v)}
          </span>
          <span>{v.visibleTitle}</span>
          </span>
          </div>
          <div className={styles.childs}>
          {v.child.length
          ? v.child.map((item, index) => (
          <div className={styles.checkGroupContent}>
          <div className={styles.topCheckbox}>
          <Checkbox
          checked={item.isChecked}
          indeterminate={item.indeterminate}
          onChange={e => {
          selectChangeAll(e, index, item, '2', i);
          }}
          >
          {item.visibleTitle}
          </Checkbox>
          </div>
          <div className={styles.bottomCheckbox}>
          {item.roleList.length
          ? item.roleList.map((items, indexC) => (
          <div
          key={items.roleID}
          className={styles.check}
          title={items.name}
          >
          <Checkbox
          checked={items.isChecked}
          onChange={e => {
          selectChange(e, indexC, items, 'child', i, index);
          }}
          >
          {items.roleName}
          </Checkbox>
          </div>
          ))
          : null}
          </div>
          </div>
          ))
          : null}
          <div className={styles.checkContent1}>
          {v.roleList.length
          ? v.roleList.map((item, index) => (
          <div key={item.roleID} className={styles.check} title={item.name}>
          <Checkbox
          checked={item.isChecked}
          onChange={e => {
          selectChange(e, index, item, '', i);
          }}
          >
          {item.roleName}
          </Checkbox>
          </div>
          ))
          : null}
          </div>
          </div>
          </div>
          );
          })}
          </div>
          ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="未有查找到角色" />
          )}
          </div>
          </>
          );
          return ( return (
          <> <>
          <Modal <Modal
          ...@@ -136,59 +512,119 @@ const PeopleSelector = props => { ...@@ -136,59 +512,119 @@ const PeopleSelector = props => {
          visible={visible} visible={visible}
          onOk={onFinish} onOk={onFinish}
          width="900px" width="900px"
          className={styles.pushTestContent}
          onCancel={onCancel} onCancel={onCancel}
          maskClosable={false} maskClosable={false}
          destroyOnClose destroyOnClose
          centered centered
          > >
          <div className={styles.pushTestContent}> <div>
          <div className={styles.leftContent}> <div className={styles.searchHeader}>
          {/* 头部搜索框 */} <div
          <div className={styles.searchHeader}> className={classnames({
          <Input.Search [styles.people]: true,
          value={searchName} [styles.peoplePick]: type === '人员',
          placeholder="请输入部门或用户" })}
          onChange={searchChange} onClick={() => {
          onSearch={onSearch} setType('人员');
          enterButton setSearchName('');
          style={{ width: '300px', marginRight: '15px' }} getData('', 1, pageSize);
          /> }}
          <Button type="primary" htmlType="submit" onClick={onReset}> >
          重置 人员
          </Button>
          </div> </div>
          {/* 复选框模块 */} <div
          className={classnames({
          <div className={styles.checkContainer}> [styles.people]: true,
          <Spin spinning={loading}> [styles.peoplePick]: type === '角色',
          {allList.map((item, index) => ( })}
          <div className={styles.checkBoxContent} key={item.groupId}> onClick={() => {
          <CardCheck setType('角色');
          cardMsg={item} setSearchName('');
          cardIndex={index} getRoleData();
          callback={(val, newCheckList) => checkCallBack(val, newCheckList)} }}
          checkList={checkList.current} >
          /> 角色
          </div>
          ))}
          </Spin>
          </div> </div>
          </div> <Input.Search
          <div className={styles.tableRight}> value={searchName}
          <Table placeholder={type === '人员' ? '请输入部门或用户' : '请输入角色'}
          bordered onChange={searchChange}
          style={{ width: '350px', overflowX: 'hidden' }} onSearch={onSearch}
          rowKey={record => record.value} className={styles.searchInput}
          columns={columns} style={{
          dataSource={checkList.current} marginLeft: '165px',
          pagination={false} marginBottom: '4px',
          size="small" }}
          scroll={{ y: 530 }}
          ItemTypes="pushTest"
          /> />
          <div className={styles.list}>已选列表</div>
          <div className={styles.checkList}>
          <div className={styles.person} /> 人员
          <div className={styles.role} />
          角色
          </div>
          </div>
          <div className={styles.content}>
          <div className={styles.leftContent}>
          <div className={styles.checkContainer}>
          <Spin spinning={loading}>
          {type === '人员' ? (
          <>
          {' '}
          {allList.map((item, index) => (
          <div className={styles.checkBoxContent} key={item.groupId}>
          <CardCheck
          cardMsg={item}
          cardIndex={index}
          callback={(val, newCheckList) => checkCallBack(val, newCheckList)}
          checkList={checkList.current}
          />
          </div>
          ))}
          </>
          ) : (
          <>{roleDom()}</>
          )}
          </Spin>
          </div>
          </div>
          <div className={styles.tableRight}>
          {[...checkList.current].length > 0 || checkListRoles.length > 0 ? (
          <div className={styles.selectContent}>
          {[...checkList.current].map(item => (
          <div className={styles.selectValue} key={item.value}>
          <Tag closable color="cyan" onClose={() => delSelected(item, '人员')}>
          {item.label}
          </Tag>
          </div>
          ))}
          {checkListRoles.map(val => {
          return (
          <div className={styles.selectValue} key={val.value}>
          <Tag closable color="purple" onClose={() => delSelected(val)}>
          {val.label}
          </Tag>
          </div>
          );
          })}
          </div>
          ) : (
          <Empty
          image={Empty.PRESENTED_IMAGE_SIMPLE}
          description={type === '人员' ? '请选择人员' : '请选择角色'}
          />
          )}
          </div>
          </div> </div>
          </div> </div>
          <div> <div
          style={{
          display: type === '人员' ? 'block' : 'none',
          position: 'absolute',
          bottom: 15,
          left: 15,
          }}
          >
          {/* 分页 */} {/* 分页 */}
          <Pagination <Pagination
          total={total} total={total}
          ...@@ -199,7 +635,7 @@ const PeopleSelector = props => { ...@@ -199,7 +635,7 @@ const PeopleSelector = props => {
          onChange={paginationChange} onChange={paginationChange}
          style={{ width: '100%' }} style={{ width: '100%' }}
          size="small" size="small"
          showQuickJumper // showQuickJumper
          showSizeChanger showSizeChanger
          /> />
          </div> </div>
          ......
          src/components/PeopleSelector/index.less
          View file @ 4a754bef
          .pushTestContent { .pushTestContent {
          display: flex; position: relative;
          width: 900px;
          .ant-modal-header {
          border-bottom: none;
          }
          .ant-modal-title {
          margin-top: 10px;
          }
          .ant-modal-body {
          padding-bottom: 0;
          }
          :global {
          ::-webkit-scrollbar-thumb {
          border-radius: 0;
          }
          ::-webkit-scrollbar {
          display: none;
          }
          }
          .content {
          display: flex;
          }
          .searchHeader { .searchHeader {
          display: flex; display: flex;
          align-items: flex-end;
          background-color: #f2f1f1;
          height: 40px;
          margin-left: -15px;
          margin-right: -15px;
          line-height: 40px;
          .people {
          width: 62px;
          height: 38px;
          color: #666666;
          display: flex;
          align-items: center;
          justify-content: center;
          border-top-left-radius: 5px;
          border-top-right-radius: 5px;
          }
          .peoplePick {
          background: #fff;
          width: 62px;
          height: 38px;
          color: #50a9f1;
          text-align: center;
          display: flex;
          align-items: center;
          justify-content: center;
          border-top-left-radius: 5px;
          border-top-right-radius: 5px;
          }
          .list {
          height: 40px;
          line-height: 40px;
          margin-left: 45px;
          font-weight: 700;
          font-size: 14px;
          color: #00070d;
          }
          .searchInput {
          width: 200px;
          z-index: 1;
          .ant-input,
          .ant-input-affix-wrapper {
          border-top-left-radius: 20px;
          border-bottom-left-radius: 20px;
          }
          .ant-input-group-addon {
          border-top-right-radius: 20px;
          border-bottom-right-radius: 20px;
          }
          .ant-input-search-button {
          width: 40px;
          border-top-right-radius: 20px !important;
          border-bottom-right-radius: 20px !important;
          }
          }
          .checkList {
          display: flex;
          align-items: center;
          .person {
          width: 10px;
          height: 3px;
          margin-right: 5px;
          background-color: #87e8de;
          margin-left: 20px;
          }
          .role {
          width: 10px;
          height: 3px;
          margin-right: 5px;
          background-color: #a785dd;
          margin-left: 20px;
          }
          }
          .person {
          width: 10px;
          height: 3px;
          margin-right: 5px;
          background-color: #87e8de;
          margin-left: 20px;
          }
          .role {
          width: 10px;
          height: 3px;
          margin-right: 5px;
          background-color: #a785dd;
          margin-left: 20px;
          }
          } }
          .checkContainer { .checkContainer {
          height: 500px; height: 500px;
          width: 500px; width: 500px;
          overflow-y: scroll; overflow-y: scroll;
          margin: 20px 0; margin: 0 0 10px 0;
          padding-right: 5px; padding-right: 5px;
          .checkContent { .checkContent {
          display: flex; display: flex;
          ...@@ -34,6 +145,7 @@ ...@@ -34,6 +145,7 @@
          .ant-checkbox-wrapper { .ant-checkbox-wrapper {
          min-width: 150px; min-width: 150px;
          margin-left: 0; margin-left: 0;
          margin-bottom: 5px;
          } }
          // .ant-checkbox-group-item { // .ant-checkbox-group-item {
          // min-width: 150px !important; // min-width: 150px !important;
          ...@@ -48,7 +160,167 @@ ...@@ -48,7 +160,167 @@
          } }
          } }
          } }
          .checkContainer1 {
          height: 500px;
          overflow-y: scroll;
          .checkContents {
          .list {
          border: 1px solid #c2cdfd;
          border-radius: 5px;
          margin-top: 20px;
          .parent {
          margin: -20px 0 0 20px;
          height: 38px;
          line-height: 38px;
          transition: all 0.3s;
          overflow: hidden;
          span {
          color: grey;
          font-size: 12px;
          background: #fff;
          }
          .imgDown {
          display: inline-block;
          position: relative;
          top: -2px;
          margin-right: 5px;
          &:hover {
          cursor: pointer;
          }
          }
          }
          .childs {
          overflow: hidden;
          width: 490px;
          transition: all 0.3s;
          .child {
          overflow: hidden;
          height: 38px;
          line-height: 38px;
          padding-left: 30px;
          border-bottom: 1px solid #f2f2f2;
          &:hover {
          color: #0087f7;
          cursor: pointer;
          }
          &[active='true'] {
          color: #0087f7;
          }
          }
          }
          }
          .checkContent1 {
          display: flex;
          flex-wrap: wrap;
          margin-left: 15px;
          width: 475px;
          margin-top: 0px;
          flex-direction: row;
          // border: 1px solid #c2cdfd;
          // border-radius: 5px;
          min-height: 50px;
          padding: 10px 10px 0px 6px;
          .check {
          width: 130px;
          margin-bottom: 10px;
          margin-right: 10px;
          .ant-checkbox-wrapper span {
          max-width: 130px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          }
          }
          }
          .checkGroupContent {
          display: flex;
          flex-wrap: wrap;
          width: 460px;
          flex-direction: row;
          border: 1px solid #c2cdfd;
          border-radius: 5px;
          margin: 10px 15px;
          margin-right: 5px;
          min-height: 50px;
          padding: 0 10px 10px 16px;
          .ant-checkbox-wrapper {
          background-color: #fff;
          }
          .topCheckbox {
          height: 20px;
          margin: -10px 0 0 20px;
          line-height: 20px;
          > span {
          background-color: white;
          }
          }
          .topCheckbox > label :hover {
          font-weight: 600;
          }
          .bottomCheckbox {
          display: flex;
          flex-wrap: wrap;
          margin-left: -88px;
          margin-top: 15px;
          .ant-checkbox-wrapper {
          display: flex;
          margin-left: 0;
          width: 130px;
          margin-right: 10px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          margin-top: 10px;
          .ant-checkbox + span {
          display: flex;
          }
          }
          .fontlabel {
          display: inline-block;
          width: 130px;
          overflow: hidden;
          text-overflow: ellipsis;
          // white-space: nowrap;
          }
          // .ant-checkbox-group-item {
          // min-width: 150px !important;
          // }
          // .ant-checkbox-wrapper {
          // min-width: 150px !important;
          // }
          }
          .checkdiv {
          display: flex;
          flex-wrap: wrap;
          }
          }
          }
          }
          .tableRight { .tableRight {
          margin-left: 10px; margin-left: 10px;
          padding: 10px 0px 10px 10px;
          border-left: 1px solid #f0f0f0;
          height: 510px;
          width: 370px;
          overflow-y: scroll;
          .selectContent {
          display: flex;
          flex-wrap: wrap;
          flex-direction: row;
          .selectValue {
          margin-bottom: 15px;
          }
          }
          } }
          } }
          src/components/RuleConfig/index.jsx
          View file @ 4a754bef
          /* eslint-disable no-else-return */
          import React, { useEffect, useState, useRef } from 'react'; import React, { useEffect, useState, useRef } from 'react';
          import { RuleValidation, RuleValidationPost } from '@/services/workflow/workflow'; import { RuleValidation, RuleValidationPost } from '@/services/workflow/workflow';
          import { Modal, Input, Form, message, Dropdown, Menu } from 'antd'; import { Modal, Input, Form, message, Dropdown, Menu } from 'antd';
          ...@@ -9,6 +10,7 @@ const fnList = [ ...@@ -9,6 +10,7 @@ const fnList = [
          { label: '是否为工作时间', value: '$fn.isWorkTime()' }, { label: '是否为工作时间', value: '$fn.isWorkTime()' },
          { label: '上报人工单统计', value: '$fn.caseNum()' }, { label: '上报人工单统计', value: '$fn.caseNum()' },
          ]; ];
          const RuleConfig = props => { const RuleConfig = props => {
          const { const {
          visible, visible,
          ...@@ -26,6 +28,22 @@ const RuleConfig = props => { ...@@ -26,6 +28,22 @@ const RuleConfig = props => {
          const ruleText = useRef(); const ruleText = useRef();
          const chooseIndex = useRef(0); const chooseIndex = useRef(0);
          const [form] = Form.useForm(); const [form] = Form.useForm();
          const options = val => {
          if (val === '撤回') {
          return `$action.nodeAction='撤回'`;
          } else if (val === '回退') {
          return `$action.nodeAction='回退'`;
          } else if (val === '转办') {
          return `$action.nodeAction='转办'`;
          } else if (val === '移交') {
          return `$action.nextNodeName`;
          } else if (val === '挂起') {
          return `$action.nodeAction='挂起'`;
          } else if (val === '解挂') {
          return `$action.nodeAction='解挂'`;
          }
          };
          useEffect(() => { useEffect(() => {
          if (visible) { if (visible) {
          setExpandedKey(fieldList?.[0]?.TableName); setExpandedKey(fieldList?.[0]?.TableName);
          ...@@ -68,7 +86,13 @@ const RuleConfig = props => { ...@@ -68,7 +86,13 @@ const RuleConfig = props => {
          }); });
          const onSelect = (prop, treeNode) => { const onSelect = (prop, treeNode) => {
          if (!treeNode.node.children) { if (!treeNode.node.children) {
          insert(`{${treeNode.node.key}}`); let name = treeNode.node.key.split('.')[0];
          if (name === '操作动作') {
          let aa = treeNode.node.title;
          insert(options(aa));
          } else {
          insert(`{${treeNode.node.key}}`);
          }
          } }
          setCurrentSelectId(prop[0]); setCurrentSelectId(prop[0]);
          }; };
          ...@@ -115,7 +139,7 @@ const RuleConfig = props => { ...@@ -115,7 +139,7 @@ const RuleConfig = props => {
          /> />
          </div> </div>
          <div className={styles.rightContent}> <div className={styles.rightContent}>
          {flag == 1 && <div className={styles.title}>符合以下条件时工单扭转到对应的节点</div>} {/* {flag == 1 && <div className={styles.title}>符合以下条件时工单扭转到对应的节点</div>} */}
          <div className={styles.textAreaBox}> <div className={styles.textAreaBox}>
          {flag == 1 && ( {flag == 1 && (
          <Dropdown overlay={fnListRender} placement="bottom" arrow> <Dropdown overlay={fnListRender} placement="bottom" arrow>
          ......
          src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/FlowChart.jsx
          View file @ 4a754bef
          ...@@ -222,6 +222,31 @@ const FlowChart = props => { ...@@ -222,6 +222,31 @@ const FlowChart = props => {
          label: ele.userName, label: ele.userName,
          value: ele.userID, value: ele.userID,
          })); }));
          if (obj.CCRuleList?.length > 0) {
          obj.CCRuleList.map(i => {
          if (i.UserIds?.length > 0) {
          i.UserList = i.UserIds.map(ele => ({
          label: ele.UserName,
          value: ele.UserID,
          }));
          i.UserIds = i.UserIds.map(ele => ele.UserID).toString();
          } else {
          i.UserList = [];
          i.UserIds = '';
          }
          if (i.RoleIds?.length > 0) {
          i.RoleList = i.RoleIds.map(ele => ({
          label: ele.UserName,
          value: ele.UserID,
          }));
          i.RoleIds = i.RoleIds.map(ele => ele.UserID).toString();
          } else {
          i.RoleList = [];
          i.RoleIds = '';
          }
          i.PersonList = [...i.UserList, ...i.RoleList];
          });
          }
          if (obj.points === '') { if (obj.points === '') {
          if (obj.NodeType === '1') { if (obj.NodeType === '1') {
          obj.points = `${(index * 200).toString()}" 100"`; obj.points = `${(index * 200).toString()}" 100"`;
          ...@@ -344,6 +369,7 @@ const FlowChart = props => { ...@@ -344,6 +369,7 @@ const FlowChart = props => {
          RuleList: [], RuleList: [],
          roleList: [], roleList: [],
          CarbonCopyPeopleList: [], CarbonCopyPeopleList: [],
          CCRuleList: [],
          ExtendPageList: [], ExtendPageList: [],
          FlowNodeBackfillConfigs: [], FlowNodeBackfillConfigs: [],
          FlowTimerList: [], FlowTimerList: [],
          ......
          src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/FlowChartRt.jsx
          View file @ 4a754bef
          ...@@ -267,6 +267,31 @@ const FlowChart = props => { ...@@ -267,6 +267,31 @@ const FlowChart = props => {
          label: ele.userName, label: ele.userName,
          value: ele.userID, value: ele.userID,
          })); }));
          if (obj.CCRuleList?.length > 0) {
          obj.CCRuleList.map(i => {
          if (i.UserIds?.length > 0) {
          i.UserList = i.UserIds.map(ele => ({
          label: ele.UserName,
          value: ele.UserID.toString(),
          }));
          i.UserIds = i.UserIds.map(ele => ele.UserID).toString();
          } else {
          i.UserList = [];
          i.UserIds = '';
          }
          if (i.RoleIds?.length > 0) {
          i.RoleList = i.RoleIds.map(ele => ({
          label: ele.UserName,
          value: ele.UserID,
          }));
          i.RoleIds = i.RoleIds.map(ele => ele.UserID).toString();
          } else {
          i.RoleList = [];
          i.RoleIds = '';
          }
          i.PersonList = [...i.UserList, ...i.RoleList];
          });
          }
          if (obj.points === '') { if (obj.points === '') {
          if (obj.NodeType === '1') { if (obj.NodeType === '1') {
          obj.points = `${(index * 200).toString()}" 100"`; obj.points = `${(index * 200).toString()}" 100"`;
          ...@@ -418,12 +443,12 @@ const FlowChart = props => { ...@@ -418,12 +443,12 @@ const FlowChart = props => {
          RuleList: [], RuleList: [],
          roleList: [], roleList: [],
          CarbonCopyPeopleList: [], CarbonCopyPeopleList: [],
          CCRuleList: [],
          ExtendPageList: [], ExtendPageList: [],
          FlowNodeBackfillConfigs: [], FlowNodeBackfillConfigs: [],
          FlowTimerList: [], FlowTimerList: [],
          TurnOnCc: 1, TurnOnCc: 1,
          NodeAliasName: '', NodeAliasName: '',
          TableName: '', TableName: '',
          Fields: '', Fields: '',
          WebPage: '', WebPage: '',
          ...@@ -1270,9 +1295,13 @@ const FlowChart = props => { ...@@ -1270,9 +1295,13 @@ const FlowChart = props => {
          // }); // });
          // return; // return;
          // } // }
          let list = new Set([]); let list = new Set([]);
          let errorList = new Set(); let errorList = new Set();
          diagramObj.nodeDataArray.forEach(item => { diagramObj.nodeDataArray.forEach(item => {
          if ((item.NodeType !== '20' || item.NodeType !== '21') && item.RuleList) {
          item.RuleList = [];
          }
          if (item.NodeType === '1' || item.NodeType === '1' || item.NodeType === '1') { if (item.NodeType === '1' || item.NodeType === '1' || item.NodeType === '1') {
          if (!item.TableName || !item.Fields) { if (!item.TableName || !item.Fields) {
          errorList.add(item.NodeName); errorList.add(item.NodeName);
          ...@@ -1282,12 +1311,10 @@ const FlowChart = props => { ...@@ -1282,12 +1311,10 @@ const FlowChart = props => {
          item.RuleList.forEach(ele => { item.RuleList.forEach(ele => {
          if (!ele.RuleName) { if (!ele.RuleName) {
          list.add(item.NodeName); list.add(item.NodeName);
          return; return;
          } }
          if (!ele.NextNodeId && ele.NextNodeId !== 0) { if (!ele.NextNodeId && ele.NextNodeId !== 0) {
          list.add(item.NodeName); list.add(item.NodeName);
          return; return;
          } }
          if (!ele.RuleContent) { if (!ele.RuleContent) {
          ......
          src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/NodeModal.jsx
          View file @ 4a754bef
          ...@@ -70,7 +70,7 @@ const NodeModal = props => { ...@@ -70,7 +70,7 @@ const NodeModal = props => {
          return; return;
          } }
          if (!obj.Fields&&editMsg.NodeType==1) { if (!obj.Fields && editMsg.NodeType == 1) {
          message.error('请选择编辑字段'); message.error('请选择编辑字段');
          return; return;
          } }
          ...@@ -252,7 +252,13 @@ const NodeModal = props => { ...@@ -252,7 +252,13 @@ const NodeModal = props => {
          {/* 承办管理 */} {/* 承办管理 */}
          <ConfgUndertake ref={refConfgUndertake} nodeChage={nodeChage} editMsg={editMsg} /> <ConfgUndertake ref={refConfgUndertake} nodeChage={nodeChage} editMsg={editMsg} />
          {/* 节点抄送人 */} {/* 节点抄送人 */}
          <ConfigCopyPerson ref={refConfigCopyPerson} nodeChage={nodeChage} editMsg={editMsg} /> <ConfigCopyPerson
          ref={refConfigCopyPerson}
          nodeChage={nodeChage}
          flowID={flowID}
          editMsg={editMsg}
          flowData={flowData}
          />
          </div> </div>
          {/* 子流程配置 */} {/* 子流程配置 */}
          {editMsg.NodeType === '30' && ( {editMsg.NodeType === '30' && (
          ......
          src/pages/bsmanager/workOrder/workflowEdit/workFlowComponents/flowChartComponents/nodeModalComponents/ConfigCopyPerson.jsx
          View file @ 4a754bef
          import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from 'react'; import React, { useState, useEffect, useRef, forwardRef, useImperativeHandle } from 'react';
          import { Divider, Tooltip, Switch } from 'antd'; import { Divider, Tooltip, Switch, Select, Input, message } from 'antd';
          import { PlusOutlined } from '@ant-design/icons'; import lodash from 'lodash';
          import { PlusOutlined, PlusCircleOutlined, DeleteOutlined } from '@ant-design/icons';
          import RuleConfig from '@/components/RuleConfig';
          import PeopleSelector from '@/components/PeopleSelector'; import PeopleSelector from '@/components/PeopleSelector';
          import { GetFormDataSource, GetRoleUserNew } from '@/services/workflow/workflow';
          import styles from '../NodeModal.less'; import styles from '../NodeModal.less';
          let chnNumChar = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九'];
          let chnUnitSection = ['', '万', '亿', '万亿', '亿亿'];
          let chnUnitChar = ['', '十', '百', '千'];
          const ConfigCopyPerson = (props, ref) => { const ConfigCopyPerson = (props, ref) => {
          const { nodeChage, editMsg } = props; const { nodeChage, editMsg, flowID, flowData } = props;
          const [showPersonSelect, setShowPersonSelect] = useState(false); // 是否显示人员选择器 const [showPersonSelect, setShowPersonSelect] = useState(false); // 是否显示人员选择器
          const CarbonCopyPeopleList = useRef([]); // 抄送人列表
          const TurnOnCc = useRef(0); const TurnOnCc = useRef(0);
          const [fieldList, setFieldList] = useState([]); // 当规则字段
          const [ruleIndex, setRuleIndex] = useState(); // 编辑当前规则索引
          const allFieldList = useRef([]); // 所有字段列表
          const talbeList = useRef([]);
          const [showRule, setShowRule] = useState(false); // 是否显示节点扭转规则弹窗
          const RuleList = useRef([]); // 规则配置列表
          const [flag, setFlag] = useState(0); // 用于刷新界面 const [flag, setFlag] = useState(0); // 用于刷新界面
          useImperativeHandle(ref, () => ({ useImperativeHandle(ref, () => ({
          getParmar, getParmar,
          })); }));
          useEffect(() => { useEffect(() => {
          // if(editMsg)
          if (JSON.stringify(editMsg) === '{}') { if (JSON.stringify(editMsg) === '{}') {
          return; return;
          } }
          CarbonCopyPeopleList.current = []; allFieldList.current = [];
          talbeList.current = [];
          TurnOnCc.current = 0; TurnOnCc.current = 0;
          CarbonCopyPeopleList.current = editMsg.CarbonCopyPeopleList;
          TurnOnCc.current = editMsg.TurnOnCc; TurnOnCc.current = editMsg.TurnOnCc;
          RuleList.current = editMsg.CCRuleList || [];
          // 获取表数据
          GetFormDataSource({ flowID }).then(res => {
          let list = new Set(talbeList.current);
          allFieldList.current = [];
          res.data.forEach(item => {
          if (!allFieldList.current.some(ele => ele.TableName === item.TableName)) {
          let data = item.TableFieldNames.filter(i => i !== '关联表单');
          allFieldList.current.push({
          TableFieldNames: data,
          TableName: item.TableName,
          });
          }
          list.add(item.TableName);
          });
          talbeList.current = [...list];
          });
          setFlag(flag + 1); setFlag(flag + 1);
          }, [editMsg]); }, [editMsg]);
          const getParmar = () => ({ CarbonCopyPeopleList: CarbonCopyPeopleList.current }); const getParmar = () => ({ CCRuleList: RuleList.current });
          // 选择人员回填
          const savePerson = e => {
          console.log(e);
          // setCarbonCopyPeopleList(e);
          CarbonCopyPeopleList.current = e;
          nodeChage('CarbonCopyPeopleList', CarbonCopyPeopleList.current);
          setShowPersonSelect(false);
          };
          // 配置当前节点抄送人 // 配置当前节点抄送人
          const editCC = () => { const editCC = index => {
          setRuleIndex(index);
          setShowPersonSelect(true); setShowPersonSelect(true);
          }; };
          const onChange = e => { const onChange = e => {
          console.log(e, 'e');
          if (e) { if (e) {
          TurnOnCc.current = 1; TurnOnCc.current = 1;
          } else { } else {
          TurnOnCc.current = 0; TurnOnCc.current = 0;
          // CarbonCopyPeopleList.current = [];
          // nodeChage('CarbonCopyPeopleList', CarbonCopyPeopleList.current);
          } }
          console.log(TurnOnCc.current);
          nodeChage('TurnOnCc', TurnOnCc.current); nodeChage('TurnOnCc', TurnOnCc.current);
          setFlag(flag + 1); setFlag(flag + 1);
          }; };
          // 规则回填
          const saveRule = e => {
          let list = JSON.parse(JSON.stringify(RuleList.current));
          list[ruleIndex].RuleContent = e;
          RuleList.current = list;
          nodeChage('CCRuleList', list);
          setShowRule(false);
          };
          // 选择人员回填
          const savePerson = val => {
          let list = JSON.parse(JSON.stringify(RuleList.current));
          let useId = val.person?.map(i => i.value);
          let roleId = val.role?.map(i => i.value);
          list[ruleIndex].UserIds = useId.toString();
          list[ruleIndex].RoleIds = roleId.toString();
          list[ruleIndex].PersonList = [...val.person, ...val.role];
          list[ruleIndex].UserList = val.person;
          list[ruleIndex].RoleList = val.role;
          RuleList.current = list;
          nodeChage('CCRuleList', list);
          setShowPersonSelect(false);
          };
          // 网关表单配置监听
          const formChage = (e, index, field) => {
          let list = lodash.cloneDeep(RuleList.current);
          if (field === 'RuleName') {
          e.persist();
          list[index][field] = e.target.value;
          }
          RuleList.current = list;
          nodeChage('CCRuleList', list);
          setFlag(flag + 1);
          };
          // 配置当前规则
          const editRule = (msg, index) => {
          let listfleld = talbeList.current;
          let list = [
          {
          TableFieldNames: [
          '上报人名称',
          '上报人部门',
          '上报站点',
          '处理站点',
          '更新时间',
          '上报时间',
          ],
          TableName: '内部字段',
          },
          ];
          listfleld.forEach(item => {
          let obj = allFieldList.current.find(ele => ele.TableName === item);
          if (obj.TableName && obj.TableFieldNames?.length > 0) {
          list.push({
          TableFieldNames: obj.TableFieldNames,
          TableName: obj.TableName,
          });
          }
          });
          list.push({
          TableFieldNames: ['撤回', '回退', '转办', '移交', '挂起', '解挂'],
          TableName: '操作动作',
          });
          setFieldList(list);
          setRuleIndex(index);
          setShowRule(true);
          };
          // 删除规则
          const deleRule = index => {
          let list = JSON.parse(JSON.stringify(RuleList.current));
          list.splice(index, 1);
          RuleList.current = list;
          nodeChage('CCRuleList', list);
          setFlag(flag + 1);
          };
          // 数字转中文
          const SectionToChinese = section => {
          let strIns = '';
          let chnStr = '';
          let unitPos = 0;
          let zero = true;
          while (section > 0) {
          let v = section % 10;
          if (v === 0) {
          if (!zero) {
          zero = true;
          chnStr = chnNumChar[v] + chnStr;
          }
          } else {
          zero = false;
          strIns = chnNumChar[v];
          strIns += chnUnitChar[unitPos];
          chnStr = strIns + chnStr;
          }
          // eslint-disable-next-line no-plusplus
          unitPos++;
          section = Math.floor(section / 10);
          }
          return chnStr;
          };
          // 数字转中文
          const NumberToChinese = num => {
          let unitPos = 0;
          let strIns = '';
          let chnStr = '';
          let needZero = false;
          if (num === 0) {
          return chnNumChar[0];
          }
          while (num > 0) {
          let section = num % 10000;
          if (needZero) {
          chnStr = chnNumChar[0] + chnStr;
          }
          strIns = SectionToChinese(section);
          strIns += section !== 0 ? chnUnitSection[unitPos] : chnUnitSection[0];
          chnStr = strIns + chnStr;
          needZero = section < 1000 && section > 0;
          num = Math.floor(num / 10000);
          // eslint-disable-next-line no-plusplus
          unitPos++;
          }
          return chnStr;
          };
          // 添加规则
          const addRule = () => {
          let list = JSON.parse(JSON.stringify(RuleList.current));
          list.push({
          RuleContent: '',
          RuleName: '',
          PersonList: [],
          UserIds: [],
          RoleIds: [],
          UserList: [],
          RoleList: [],
          });
          RuleList.current = list;
          nodeChage('CCRuleList', list);
          setFlag(flag + 1);
          };
          return ( return (
          <div> <div>
          <Divider <Divider
          ...@@ -70,31 +240,105 @@ const ConfigCopyPerson = (props, ref) => { ...@@ -70,31 +240,105 @@ const ConfigCopyPerson = (props, ref) => {
          onChange={onChange} onChange={onChange}
          /> />
          </div> </div>
          <div className={styles.titleBox}>
          当开启”允许抄送“后，本节点具备抄送功能： 配置不同的抄送规则，可抄送给指定人员；
          当不配置规则的时候，则默认本届点任何办理操作都会抄送给指定人员。
          </div>
          <div <div
          className={styles.buttonBox} className={styles.btnAddRule}
          onClick={addRule}
          style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none' }} style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none' }}
          onClick={() => editCC()}
          > >
          <div <PlusCircleOutlined style={{ marginRight: '10px' }} />
          className={styles.setButton} 添加规则
          style={{ textAlign: CarbonCopyPeopleList?.current.length > 0 ? 'left' : 'center' }}
          >
          <Tooltip title={CarbonCopyPeopleList?.current.map(item => item.label).join(',')}>
          <span>
          {CarbonCopyPeopleList?.current.length > 0
          ? CarbonCopyPeopleList?.current.map(item => item.label).join(',')
          : '选择抄送人'}
          </span>
          </Tooltip>
          </div>
          <div className={styles.addIcon}>
          <PlusOutlined />
          </div>
          </div> </div>
          <div className={styles.ruleContent}>
          {RuleList.current.map((item, index) => (
          <div className={styles.ruleBox} key={index}>
          <div
          className={styles.ruleTitle}
          style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none' }}
          >
          <div className={styles.textContet}>规则{NumberToChinese(index + 1)}</div>
          <DeleteOutlined style={{ cursor: 'pointer' }} onClick={() => deleRule(index)} />
          </div>
          <div
          className={styles.formBox}
          style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none' }}
          >
          <div className={styles.label}>规则名称：</div>
          <div className={styles.item}>
          <Input
          style={{ width: '100%' }}
          value={item.RuleName}
          placeholder="请输入规则名称"
          onChange={e => {
          formChage(e, index, 'RuleName');
          }}
          />
          </div>
          </div>
          <div
          className={styles.buttonBox}
          style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none', marginBottom: '10px' }}
          onClick={() => editCC(index)}
          >
          <div
          className={styles.setButton}
          style={{ textAlign: item.PersonList ? 'left' : 'center' }}
          >
          <Tooltip
          title={
          item.PersonList?.length > 0 &&
          item.PersonList?.map(item => item.label).join(',')
          }
          >
          <span>
          {item.PersonList?.length > 0
          ? item.PersonList?.map(item => item.label).join(',')
          : '选择抄送人'}
          </span>
          </Tooltip>
          </div>
          <div className={styles.addIcon}>
          <PlusOutlined />
          </div>
          </div>
          <div
          className={styles.buttonBox}
          onClick={() => editRule(item, index)}
          style={{ display: TurnOnCc.current === 1 ? 'flex' : 'none' }}
          >
          <div
          className={styles.setButton}
          style={{ textAlign: item.RuleContent ? 'left' : 'center' }}
          >
          <Tooltip title={item.RuleContent}>
          <span>{item.RuleContent ? item.RuleContent : '设置条件'} </span>
          {/* <span>{item.RuleContent} </span> */}
          </Tooltip>
          </div>
          <div className={styles.addIcon}>
          <PlusOutlined />
          </div>
          </div>
          </div>
          ))}
          </div>
          <RuleConfig
          RuleContent={RuleList.current[ruleIndex]?.RuleContent}
          fieldList={fieldList}
          visible={showRule}
          handleCancel={() => setShowRule(false)}
          onSubumit={e => saveRule(e)}
          flag={1}
          flowID={flowID}
          />
          <PeopleSelector <PeopleSelector
          visible={showPersonSelect} visible={showPersonSelect}
          personList={CarbonCopyPeopleList.current} userIds={RuleList.current[ruleIndex]?.UserList}
          roleIds={RuleList.current[ruleIndex]?.RoleList}
          onCancel={() => setShowPersonSelect(false)} onCancel={() => setShowPersonSelect(false)}
          onSubumit={e => savePerson(e)} onSubumit={e => savePerson(e)}
          /> />
          ......
          Markdown is supported
          0% or
          You are about to add 0 people to the discussion. Proceed with caution.
          Finish editing this message first!
          Please register or to comment