fix: 添加外部字段模块，修改表返回位置问题

src/pages/platformCenter/bsmanager/tablemanager/index.jsx

-import React, { useEffect, useState } from 'react'
+import React, { useEffect, useState } from 'react';
 import classnames from 'classnames';
 import {
   // Tree,
@@ -11,58 +11,92 @@ import {
   notification,
   Spin,
   Tooltip,
-    Badge, Spac
+  Badge,
+  Spac,
 } from 'antd';
-import { EditOutlined, DeleteOutlined, FontColorsOutlined, PlusSquareOutlined, SortDescendingOutlined ,PlusOutlined,BorderInnerOutlined } from '@ant-design/icons';
+import {
+  EditOutlined,
+  DeleteOutlined,
+  FontColorsOutlined,
+  PlusSquareOutlined,
+  SortDescendingOutlined,
+  PlusOutlined,
+  BorderInnerOutlined,
+} from '@ant-design/icons';
 import PageContainer from '@/components/BasePageContainer';
-import { CM_Table_LoadTable, removeTable, loadUnattachedTables } from '@/services/platform/bs'
-import styles from './index.less'
-import Editor from './components/Field/editor'
-import AddTablelList from './components/Field/addTable'
-import AffiliateAdd from './components/Field/affiliateAdd'
-import LoadGroup from './components/Field/loadGroup'
+import {
+  CM_Table_LoadTable,
+  removeTable,
+  loadUnattachedTables,
+} from '@/services/platform/bs';
+import styles from './index.less';
+import Editor from './components/Field/editor';
+import AddTablelList from './components/Field/addTable';
+import AffiliateAdd from './components/Field/affiliateAdd';
+import LoadGroup from './components/Field/loadGroup';
 import { useHistory } from 'react-router-dom';
 const { Search } = Input;
 const { Option } = Select;
-const placeholder = "请输入表名"
+const placeholder = '请输入表名';
 
-const TableManager = (props) => {
+const TableManager = props => {
   const history = useHistory();
   const [visible, setVisible] = useState(false); // 弹窗
   const [type, setType] = useState(''); // 弹窗类型
   const [formObj, setFormObj] = useState({});
   const [flag, setFlag] = useState(0); // 弹窗类型
-    const [searchValue, setSearchValue] = useState('')
-    const [treeLoading, setTreeLoading] = useState(true)
-    const [tableList, setTableList] = useState([])
-    const [groupArr, setGroupArr] = useState([])
-    const [allData, setAllData] = useState([])
-    const [tableData, setTableData] = useState([])
-    const [select, setSelect] = useState([])
-    const [selectTableName, setSelectTableName] = useState({})
-    useEffect((record) => {
-        loadTable(searchValue)
-        getField()
-        if (props.history.location.state) {
-            let template = props.history.location.state.template
-            setSelectTableName(template)
+  const [searchValue, setSearchValue] = useState('');
+  const [treeLoading, setTreeLoading] = useState(true);
+  const [tableList, setTableList] = useState([]);
+  const [groupArr, setGroupArr] = useState([]);
+  const [allData, setAllData] = useState([]);
+  const [tableData, setTableData] = useState([]);
+  const [select, setSelect] = useState([]);
+  const [selectTableName, setSelectTableName] = useState('');
+  useEffect(
+    record => {
+      loadTable(searchValue);
+      getField();
+      //   if (props.history.location.query && selectTableName !== {}) {
+      //     let { template } = props.history.location.query;
+      //     setSelectTableName(template);
+      //   }
+    },
+    [flag],
+  );
+  // 重字段配置返回后需要返回到原来的位置
+  useEffect(() => {
+    let arr = Object.keys(allData);
+    console.log(selectTableName, 'selectTableName');
+    console.log(arr, 'arr');
+    console.log(props.history.location.query, 'props.history.location.query');
+    if (
+      arr.length > 0 &&
+      props.history.location.query &&
+      selectTableName == ''
+    ) {
+      console.log(234534256342);
+      let { tableScroll, template } = props.history.location.query;
+      setSelectTableName(template);
+      setTimeout(() => {
+        document.querySelector('.ant-table-body').scrollTop = tableScroll;
+      }, 0);
     }
-    }, [flag])
-
-    //附加
-    const add = (record) => {
+  }, [allData]);
+  // 附加
+  const add = record => {
     setFormObj(record);
     setType('affiliateAdd');
     setVisible(true);
-    }
-    //修改表名
-    const changeDesc = (record) => {
+  };
+  // 修改表名
+  const changeDesc = record => {
     setType('edit');
     setVisible(true);
     setFormObj(record);
-    }
-    //删除表
-    const deleteChart = (record) => {
+  };
+  // 删除表
+  const deleteChart = record => {
     removeTable({ tableID: record.tableID, removeFields: true }).then(res => {
       if (res.msg === 'Ok' || res.msg === '') {
         notification.success({
@@ -70,138 +104,146 @@ const TableManager = (props) => {
           duration: 3,
           description: '删除成功',
         });
-                setFlag(flag + 1)
-            }
-            else {
+        setFlag(flag + 1);
+      } else {
         notification.error({
           message: '提示',
           duration: 3,
           description: res.msg,
         });
       }
-        })
-    }
+    });
+  };
 
   const onSubmit = prop => {
     setVisible(false);
-        setFlag(flag + 1)
+    setFlag(flag + 1);
   };
-    //建表
+  // 建表
   const AddTable = () => {
     setType('add');
     setVisible(true);
-    }
-    //附加表
+  };
+  // 附加表
   const AffiliateAddTable = () => {
     setType('affiliateAdd');
     setFormObj({});
     setVisible(true);
-    }
-    //字段配置
+  };
+  // 字段配置
   const fieldsConfig = (record, e) => {
-        e.stopPropagation()
+    e.stopPropagation();
     setFormObj(record);
-        history.push({ pathname: `/platformCenter/bsmanger/filedConfig/${record.tableName}`, state: { template: record } })
+    history.push({
+      pathname: `/platformCenter/bsmanger/filedConfig/${record.tableName}`,
+      state: {
+        template: record,
+        tableScroll: document.querySelector('.ant-table-body').scrollTop,
+      },
+    });
     // setType('config');
     // setVisible(true);
-    }
-    //分组与排序
-    const sort = (record) => {
+  };
+  // 分组与排序
+  const sort = record => {
     setFormObj(record);
     setType('sort');
     setVisible(true);
-    }
-    //搜索框改变时存储输入的值
-    const handleChange = (e) => {
-        setSearchValue(e.target.value)
-    }
-    //搜索
-    const handleSearch = (text) => {
-        loadTable(text)
-        setSearchValue(text)
-    }
+  };
+  // 搜索框改变时存储输入的值
+  const handleChange = e => {
+    setSearchValue(e.target.value);
+  };
+  // 搜索
+  const handleSearch = text => {
+    loadTable(text);
+    setSearchValue(text);
+  };
   const getField = () => {
     loadUnattachedTables().then(res => {
       if (res.data.root && res.data.root.length) {
-                setTableList(res.data.root)
-            }
-
-        })
+        setTableList(res.data.root);
       }
-    //加载表
-    const loadTable = (keyword) => {
-        setTreeLoading(true)
+    });
+  };
+  // 加载表
+  const loadTable = keyword => {
+    setTreeLoading(true);
     CM_Table_LoadTable({
       _version: 9999,
-            filter: keyword || ''
-        }).then(
-            res => {
-                setTreeLoading(false)
+      filter: keyword || '',
+    })
+      .then(res => {
+        setTreeLoading(false);
         if (res.msg === 'Ok') {
-                    setTableData(res.data.root)
-                    let groupData = formateArrDataA(res.data.root, 'groupName')
-                    let newArr = []
+          setTableData(res.data.root);
+          let groupData = formateArrDataA(res.data.root, 'groupName');
+          let newArr = [];
           Object.keys(groupData).map((item, index) => {
-                        newArr.push({ type: item, key: index })
-                    })
+            newArr.push({ type: item, key: index });
+          });
 
-                    setAllData(groupData)
-                    setGroupArr(newArr)
-                    setSelect(newArr)
-                }
+          setAllData(groupData);
+          setGroupArr(newArr);
+          setSelect(newArr);
         }
-        ).catch(e => {
-            setTreeLoading(true)
       })
-    }
+      .catch(e => {
+        setTreeLoading(true);
+      });
+  };
   const formateArrDataA = (initialArr, name) => {
     // 判定传参是否符合规则
     if (!(initialArr instanceof Array)) {
-            return '请传入正确格式的数组'
+      return '请传入正确格式的数组';
     }
     if (!name) {
-            return '请传入对象属性'
+      return '请传入对象属性';
     }
-        //先获取一下这个数组中有多少个"name"
-        let nameArr = []
+    // 先获取一下这个数组中有多少个"name"
+    let nameArr = [];
     for (let i in initialArr) {
       if (nameArr.indexOf(initialArr[i][`${name}`]) === -1) {
-                nameArr.push(initialArr[i][`${name}`])
+        nameArr.push(initialArr[i][`${name}`]);
       }
     }
-        //新建一个包含多个list的结果对象
-        let tempObj = {}
+    // 新建一个包含多个list的结果对象
+    let tempObj = {};
     // 根据不同的"name"生成多个数组
     for (let k in nameArr) {
       for (let j in initialArr) {
         if (initialArr[j][`${name}`] == nameArr[k]) {
           // 每次外循环时新建一个对应"name"的数组, 内循环时当前数组不变
-                    tempObj[nameArr[k]] = tempObj[nameArr[k]] || []
-                    tempObj[nameArr[k]].push(initialArr[j])
+          tempObj[nameArr[k]] = tempObj[nameArr[k]] || [];
+          tempObj[nameArr[k]].push(initialArr[j]);
         }
       }
     }
     for (let keys in tempObj) {
-            let arr = []
+      let arr = [];
       tempObj[keys].map((item, index) => {
         tempObj[keys] = arr;
-                item.key = index
-                arr.push(item)
-            })
-        }
-        return tempObj
+        item.key = index;
+        arr.push(item);
+      });
     }
+    return tempObj;
+  };
   const setRowClassName = record =>
-        Object.entries(record).toString() === Object.entries(selectTableName).toString() ? styles.clickRowStyle : '';
-    const expandedRowRender = (item) => {
+    Object.entries(record).toString() ===
+    Object.entries(selectTableName).toString()
+      ? styles.clickRowStyle
+      : '';
+  const expandedRowRender = item => {
     const columns1 = [
       {
         title: '名称',
         dataIndex: 'tableName',
         key: 'tableName',
         width: 300,
-                render: (text, record) => <div onClick={e => fieldsConfig(record, e)}>{text}</div>,
-
+        render: (text, record) => (
+          <div onClick={e => fieldsConfig(record, e)}>{text}</div>
+        ),
       },
       {
         title: '别名',
@@ -213,7 +255,7 @@ const TableManager = (props) => {
         title: '表格样式',
         dataIndex: 'tableStyle',
         key: 'tableStyle',
-                align: 'center'
+        align: 'center',
       },
       {
         title: '附加字段',
@@ -227,10 +269,16 @@ const TableManager = (props) => {
         key: 'missingFieldCount',
         align: 'center',
         render: text => {
-                    return (<div className={classnames({
-                        [styles.lack]:text!=='(无)' ,
-                    })} >{text}</div>)
-                }
+          return (
+            <div
+              className={classnames({
+                [styles.lack]: text !== '(无)',
+              })}
+            >
+              {text}
+            </div>
+          );
+        },
       },
       {
         title: '未附加',
@@ -294,30 +342,53 @@ const TableManager = (props) => {
           </Space>
         ),
       },
-
     ];
 
-        return <Table columns={columns1} bordered size="small" onRow={record => {
+    return (
+      <Table
+        columns={columns1}
+        bordered
+        size="small"
+        onRow={record => {
           return {
             onDoubleClick: event => {
-                    event.stopPropagation()
-                    history.push({ pathname: `/platformCenter/bsmanger/filedConfig/${record.tableName}`, state: { template: record } })
+              event.stopPropagation();
+              history.push({
+                pathname: `/platformCenter/bsmanger/filedConfig/${
+                  record.tableName
+                }`,
+                state: {
+                  template: record,
+                  tableScroll: document.querySelector('.ant-table-body')
+                    .scrollTop,
+                },
+              });
             },
             onClick: event => {
-                    event.stopPropagation()
-                    setSelectTableName(record)
+              event.stopPropagation();
+              setSelectTableName(record);
             }, // 点击行
-            }
+          };
         }}
         rowClassName={setRowClassName}
-            showHeader={false} dataSource={allData[item.type]} pagination={false} />;
+        showHeader={false}
+        dataSource={allData[item.type]}
+        pagination={false}
+      />
+    );
   };
 
   const columns = [
     {
-            title: '名称', dataIndex: 'type', key: 'type',
+      title: '名称',
+      dataIndex: 'type',
+      key: 'type',
       render: text => {
-                return (<a style={{ fontWeight:'bold' }}>{text}({allData && allData[text] ? allData[text].length : 0}个)</a>)
+        return (
+          <a style={{ fontWeight: 'bold' }}>
+            {text}({allData && allData[text] ? allData[text].length : 0}个)
+          </a>
+        );
       },
       width: 260,
     },
@@ -345,8 +416,8 @@ const TableManager = (props) => {
       key: 'missingFieldCount',
       align: 'center',
       render: text => {
-                return (<div>{text}</div>)
-            }
+        return <div>{text}</div>;
+      },
     },
     {
       title: '未附加',
@@ -359,27 +430,24 @@ const TableManager = (props) => {
       dataIndex: 'groupCount',
       key: 'groupCount',
       align: 'center',
-
     },
     {
       title: '操作',
       dataIndex: 'title',
       key: 'title',
       align: 'center',
-
     },
-
   ];
   const onUnfold = (expanded, record) => {
-        const data = [...select]
-        let index = data.indexOf(record)
+    const data = [...select];
+    let index = data.indexOf(record);
     if (expanded) {
-            data.push(record)
+      data.push(record);
     } else {
-            data.splice(index, 1)
-        }
-        setSelect(data)
+      data.splice(index, 1);
     }
+    setSelect(data);
+  };
   return (
     <Spin tip="loading..." spinning={treeLoading}>
       <PageContainer>
@@ -394,15 +462,34 @@ const TableManager = (props) => {
                 onChange={handleChange}
                 value={searchValue}
                 enterButton
-                                style={{ width: "300px" }}
+                style={{ width: '300px' }}
               />
             </div>
 
-                        <Button type="primary" style={{ marginLeft: "10px" }}  icon={<BorderInnerOutlined />}  onClick={AddTable}>建表</Button>
-                        <Button type="primary" style={{ marginLeft: "10px" }}  icon={<PlusOutlined />}  onClick={AffiliateAddTable}>附加表</Button>
-
+            <Button
+              type="primary"
+              style={{ marginLeft: '10px' }}
+              icon={<BorderInnerOutlined />}
+              onClick={AddTable}
+            >
+              建表
+            </Button>
+            <Button
+              type="primary"
+              style={{ marginLeft: '10px' }}
+              icon={<PlusOutlined />}
+              onClick={AffiliateAddTable}
+            >
+              附加表
+            </Button>
           </div>
-                    <div style={{ width: '100vm', height: 'calc(100vh - 150px) ', background: '#ffffff' }}>
+          <div
+            style={{
+              width: '100vm',
+              height: 'calc(100vh - 150px) ',
+              background: '#ffffff',
+            }}
+          >
             {/* <Table
                             columns={columns}
                             dataSource={tableData}
@@ -424,7 +511,7 @@ const TableManager = (props) => {
               className="components-table-demo-nested"
               columns={columns}
               expandable={{ expandedRowRender }}
-                            expandedRowKeys={select.map(item => item.key)} //展开的行
+              expandedRowKeys={select.map(item => item.key)} // 展开的行
               expandRowByClick={true}
               defaultExpandAllRows={true}
               dataSource={groupArr}
@@ -443,7 +530,8 @@ const TableManager = (props) => {
             onCancel={() => setVisible(false)}
             callBackSubmit={onSubmit}
             type={type}
-                        formObj={formObj} />
+            formObj={formObj}
+          />
         )}
         {visible && type === 'add' && (
           <AddTablelList
@@ -474,7 +562,6 @@ const TableManager = (props) => {
         )}
       </PageContainer>
     </Spin>
-    )
-
-}
+  );
+};
 export default TableManager;

src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNode.jsx

@@ -85,7 +85,7 @@ const FlowNode = () => {
   // 控制表格的展开跟收起
   const onUnfold = (expanded, record) => {
     const data = [...expandedRowKeys];
-    let index = data.indexOf(record);
+    let index = data.indexOf(record.GroupName);
     if (expanded) {
       data.push(record.GroupName);
     } else {

src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNode.less

@@ -113,7 +113,16 @@
     margin-bottom: 10px;
     font-weight: 700;
     color: #15428b;
+    line-height: 100%;
     border-top-color: #99bbe8;
+    .groupName {
+      display: inline-block;
+      margin-right: 10px;
+      max-width: 200px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+    }
   }
 }
 

src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNodeComponents/NodeEdit.jsx

@@ -100,19 +100,36 @@ const NodeEdit = props => {
     loadEventFields({ eventTableName: value.TableName }).then(res => {
       if (res.code === 0) {
         let defaultCheckedList = value[val] ? value[val].split(',') : [];
+        let allFields = []; // 所有得字段用来判断是否为外部字段
         // 处理树形结构
         let checkList = res.data.map(item => {
           let plainOptions = [];
+          // 存入没个组得字段
           item.root.forEach(ele => {
             plainOptions = [...plainOptions, ele.fieldName];
           });
+          // 存所有得字段
+          allFields = [...allFields, ...plainOptions];
           return {
             groupName: item.groupName,
             plainOptions,
             defaultCheckedList: [],
           };
         });
+        let externalFields = {
+          groupName: '外部字段',
+          indeterminate: false,
+          checkAll: true,
+          plainOptions: [],
+          defaultCheckedList: [],
+        }; // 外部字段
         defaultCheckedList.forEach(item => {
+          // 添加外部字段
+          let isExternal = allFields.some(checkName => checkName === item);
+          if (!isExternal) {
+            externalFields.plainOptions.push(item);
+            externalFields.defaultCheckedList.push(item);
+          }
           checkList.forEach(element => {
             // 当前得模块是否有当前字段
             let indeterminate = element.plainOptions.some(
@@ -140,7 +157,10 @@ const NodeEdit = props => {
             }
           });
         });
-        console.log(checkList, 'checkList');
+        // 添加外部字段
+        if (externalFields.plainOptions.length > 0) {
+          checkList.push(externalFields);
+        }
         setFieldList(checkList);
         setTimeout(() => {
           setShowField(true);

src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNodeComponents/nodeEditComponents/Fieldselection.jsx

@@ -98,9 +98,7 @@ const Fieldselection = props => {
               <div className={styles.cardBox} key={index}>
                 <div className={styles.title}>
                   <Divider orientation="left" className={styles.cardDivider}>
-                    <span style={{ marginRight: '10px' }}>
-                      {item.groupName}
-                    </span>
+                    <span className={styles.groupName}>{item.groupName}</span>
                     <Checkbox
                       indeterminate={item.indeterminate}
                       onChange={e => onCheckAllChange(e, index)}

src/pages/platformCenter/filedConfig/filedConfig.jsx

@@ -358,11 +358,13 @@ const AddModal = props => {
   };
   // 返回上一级
   const back = () => {
-    console.log(props)
-    let template = props.location.state.template;
+    let { template, tableScroll } = props.location.state;
     history.push({
       pathname: '/platformCenter/bsmanger/tablemanger',
-      state: { template },
+      query: {
+        template,
+        tableScroll,
+      },
     });
   };
   const onUnfold = (expanded, record) => {

src/pages/platformCenter/standingBook/editorModal.jsx

+/* eslint-disable guard-for-in */
+/* eslint-disable no-restricted-syntax */
 import React, { useState, useEffect } from 'react';
 import {
   Form,
@@ -64,6 +66,7 @@ const AddModal = props => {
   const [Type, setType] = useState('');
   const [characterValue, setCharacterValue] = useState('');
   const [standingType, setStandingType] = useState(['台账', '反馈', '设备']);
+  const [allFileds, setAllFileds] = useState([]); // 当前表所有的字段
   const [form] = Form.useForm();
   const { Item } = Form;
   // 提交
@@ -166,14 +169,18 @@ const AddModal = props => {
     if (!name) {
       return '请传入对象属性';
     }
-    //先获取一下这个数组中有多少个"name"
+    // 先获取一下这个数组中有多少个"name"
     let nameArr = [];
+    let allFile = [];
     for (let i in initialArr) {
+      allFile.push(initialArr[i].fieldName);
       if (nameArr.indexOf(initialArr[i][`${name}`]) === -1) {
         nameArr.push(initialArr[i][`${name}`]);
       }
     }
-    //新建一个包含多个list的结果对象
+    // 保存所有的字段用来比较是否有外部字段
+    setAllFileds(allFile);
+    // 新建一个包含多个list的结果对象
     let tempObj = {};
     // 根据不同的"name"生成多个数组
     console.log(initialArr);
@@ -204,9 +211,26 @@ const AddModal = props => {
     setInputVaule(inputText);
   };
   const pickFiled = fileds => {
+    // 添加外部字段
+    let fil = { ...filed };
+    fil['外部字段'] = [];
+    let isExternal;
+    inputValue[fileds].split(',').forEach(item => {
+      isExternal = allFileds.some(val => val === item);
+      if (!isExternal && item !== '') {
+        fil['外部字段'].push(item);
+      }
+    });
+    if (fil['外部字段'].length === 0) {
+      delete fil['外部字段'];
+    }
+
+    setFiled(fil);
+
     setTypes('add');
     setCharacterValue(inputValue[fileds]);
     setCheckedList(inputValue[fileds].split(','));
+
     setPickItem(fileds);
     setIsVisible(true);
   };

src/pages/webConfig/utils.js

@@ -69,6 +69,7 @@ export const defaultWebConfigObj = {
   mapPlan: '',
   qrcode: '',
   loginTemplate: 'Default.html',
+  alarmWays: notificationTypes.MQTT,
 };
 
 export const getDefaultGetWebconfig = ({

src/services/platform/bs.jsx

@@ -25,11 +25,11 @@ export const loadUnattachedTables = () =>
 
 //7.附加表
 export const addTables = (param) =>
-    get(`${PUBLISH_SERVICE}/CaseManage/AddTables`, param);
+    post(`${PUBLISH_SERVICE}/CaseManage/AddTables`, param);
 
 //8.添加表字段
 export const addFields = (param) =>
-    get(`${PUBLISH_SERVICE}/CaseManage/AddFields`, param);
+    post(`${PUBLISH_SERVICE}/CaseManage/AddFields`, param);
 
 
 //9.获取表信息