修改事件权限功能交互

src/pages/platformCenter/filedConfig/VerifyModal.jsx

+import React, { useState, useEffect } from 'react';
+import { Modal, Radio, Checkbox, Input, Row, Col, message } from 'antd';
+const VerifyModal = props => {
+  const { visible, onCancel, callBackSubmit, formObj } = props;
+  const [radioValue, setRadioValue] = useState();
+  const [radioOptions] = useState([
+    { lable: '数值(number)', value: 'number' },
+    { lable: '整数(digits)', value: 'digits' },
+    { lable: '邮箱(email)', value: 'email' },
+    { lable: '身份证号(identity)', value: 'identity' },
+    { lable: '手机号(mobile)', value: 'mobile' },
+    { lable: '银行卡号(bankAccount)', value: 'bankAccount' },
+    { lable: '时间控制(timeControl)', value: 'timeControl' },
+  ]); // 单选框数据
+  const [checkDefaultValue, setCheckDefaultValue] = useState([]); // 复选框选择的数据
+  const [maxLengthVlaue, setMaxLengthVlaue] = useState(''); // 最大字节长度值
+  const [hasMaxlength, setHasMaxlength] = useState(); // 是否有勾选最大字节长度规则
+  useEffect(() => {
+    if (visible) {
+      setRadioValue(formObj.numerical);
+      let chooseObj = formObj.rule.map(item => {
+        if (item.indexOf('maxLength') !== -1) {
+          setMaxLengthVlaue(item.split(':')[1]);
+          return 'maxLength';
+        }
+
+        return item;
+      });
+      setCheckDefaultValue(chooseObj);
+    }
+  }, [visible]);
+  useEffect(() => {
+    let hasMax = checkDefaultValue.some(item => item === 'maxLength');
+    setHasMaxlength(hasMax);
+    if (!hasMax) {
+      setMaxLengthVlaue('');
+    }
+  }, [checkDefaultValue]);
+  // 单选框change事件
+  const radioOnChange = e => {
+    if (e.target.value === radioValue) {
+      setRadioValue('');
+    } else {
+      setRadioValue(e.target.value);
+    }
+  };
+  // 复选框change事件
+  const CheckboxOnChange = e => {
+    setCheckDefaultValue(e);
+  };
+  // maxleng值监听
+  const maxLengthChange = e => {
+    e.persist();
+    setMaxLengthVlaue(e.target.value);
+  };
+  // 保存选择规则
+  const onOk = () => {
+    let checkList = JSON.parse(JSON.stringify(checkDefaultValue));
+    checkList = checkList.map(item => {
+      if (item === 'maxLength') {
+        return `maxLength:${maxLengthVlaue}`;
+      }
+      return item;
+    });
+    if (hasMaxlength) {
+      if (maxLengthVlaue === '') {
+        message.error('请输入字节最大长度');
+        return;
+      }
+      const posReg = /^\d+$/;
+      if (!posReg.test(Number(maxLengthVlaue))) {
+        message.error('请输入数字');
+        return;
+      }
+    }
+    let callValue = `${radioValue ? `${radioValue},` : ''}${checkList.join(
+      ',',
+    )}`;
+    callBackSubmit(callValue);
+  };
+  return (
+    <div>
+      <Modal
+        width="600px"
+        title="选择验证规则"
+        visible={visible}
+        onOk={onOk}
+        onCancel={onCancel}
+        maskClosable={false}
+        destroyOnClose
+      >
+        <Radio.Group
+          value={radioValue}
+          style={{ display: 'flex', flexWrap: 'wrap' }}
+        >
+          {radioOptions.map(item => (
+            <Radio
+              value={item.value}
+              key={item.value}
+              onClick={radioOnChange}
+              style={{ marginBottom: '10px' }}
+            >
+              {item.lable}
+            </Radio>
+          ))}
+        </Radio.Group>
+        <Checkbox.Group
+          style={{ width: '100%', margin: '10px 0' }}
+          onChange={CheckboxOnChange}
+          defaultValue={checkDefaultValue}
+        >
+          <Checkbox value="required">必填(required)</Checkbox>
+          <Checkbox value="emphasis">强调(emphasis)</Checkbox>
+          <Checkbox value="sensitive" style={{ marginBottom: '10px' }}>
+            敏感(sensitive)
+          </Checkbox>
+          <br />
+
+          <Input.Group size="small">
+            <Row gutter={16}>
+              <Col span={9}>
+                <Checkbox value="maxLength">字节最大长度(maxLength):</Checkbox>
+              </Col>
+              <Col span={8}>
+                <Input
+                  disabled={!hasMaxlength}
+                  value={maxLengthVlaue}
+                  size="small"
+                  style={{ width: '150px' }}
+                  onChange={maxLengthChange}
+                  placeholder="请输入maxLength"
+                />
+              </Col>
+            </Row>
+          </Input.Group>
+        </Checkbox.Group>
+      </Modal>
+    </div>
+  );
+};
+
+export default VerifyModal;

src/pages/platformCenter/filedConfig/fieldEditor.jsx

@@ -22,6 +22,7 @@ import {
 } from '@/services/platform/bs';
 import styles from './index.less';
 import ChangeAdd from './changeAdd';
+import VerifyModal from './VerifyModal';
 import { PlusSquareOutlined } from '@ant-design/icons';
 import { shape } from 'prop-types';
 const AddModal = props => {
@@ -246,6 +247,7 @@ const AddModal = props => {
   };
 
   const onOK = prop => {
+    console.log(prop, 'prop');
     setVisible(false);
     if (type === 'rule') {
       form.setFieldsValue({ ValidationRule: prop });
@@ -256,11 +258,18 @@ const AddModal = props => {
   };
   const add = type => {
     let obj = form.getFieldsValue();
-    let data = { ...formObj };
+    let data = { numerical: '', rule: [] };
+    console.log(obj.ValidationRule, 'ValidationRule');
     if (obj.ValidationRule) {
       let arr = obj.ValidationRule.split(',');
-      arr.map(item => {
-        switch (item) {
+      arr.forEach(item => {
+        let value;
+        if (item.indexOf('maxLength') !== -1) {
+          value = 'maxLength';
+        } else {
+          value = item;
+        }
+        switch (value) {
           case 'required':
             data.rule.push(item);
             break;
@@ -270,6 +279,9 @@ const AddModal = props => {
           case 'sensitive':
             data.rule.push(item);
             break;
+          case 'maxLength':
+            data.rule.push(item);
+            break;
           default:
             data.numerical = item;
         }
@@ -690,7 +702,7 @@ const AddModal = props => {
                 </div>
               </Item>
             )}
-            <Item label="异常值">
+            {/* <Item label="异常值">
               <div className={styles.listEvent}>
                 <Input
                   style={{ width: '40%', height: '1.8rem' }}
@@ -748,10 +760,20 @@ const AddModal = props => {
                   />
                 </Tooltip>
               </div>
-            </Item>
+            </Item> */}
           </Form>
         )}
-        <ChangeAdd
+        {/* <ChangeAdd
+          visible={visible}
+          onCancel={() => setVisible(false)}
+          callBackSubmit={onOK}
+          newCheckedList={checkedList}
+          isType={type}
+          filed={filed}
+          characterValue={characterValue}
+          formObj={formObj}
+        /> */}
+        <VerifyModal
           visible={visible}
           onCancel={() => setVisible(false)}
           callBackSubmit={onOK}

src/pages/platformCenter/messageManage/projectManage/ProjectManage.jsx

@@ -21,6 +21,7 @@ import {
   DeleteOutlined,
   FundViewOutlined,
   FieldTimeOutlined,
+  AlertTwoTone,
 } from '@ant-design/icons';
 import { useHistory } from 'react-router-dom';
 import EditModal from './components/EditModal';
@@ -36,7 +37,7 @@ import {
 import styles from './ProjectManage.less';
 const { Search } = Input;
 const { Option } = Select;
-const ProjectManage = () => {
+const ProjectManage = props => {
   const history = useHistory();
   const [visibleParams, setvisibleParams] = useState({
     addVisible: false, // 新增弹窗
@@ -60,6 +61,7 @@ const ProjectManage = () => {
   const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
   const [value, setValue] = useState('');
   const [pushTestMsg, setPushTestMsg] = useState('');
+  const [currentPage, setCurrentPage] = useState(1);
   const columns = [
     {
       title: '方案名称',
@@ -68,8 +70,6 @@ const ProjectManage = () => {
       render: (text, record) => (
         <div>
           {record.type === '定时推送' ? (
-            searchStyle(text)
-          ) : (
             <div style={{ display: 'flex', alignItems: 'center' }}>
               <Tooltip title={text}>
                 <FieldTimeOutlined
@@ -82,6 +82,15 @@ const ProjectManage = () => {
               </Tooltip>
               {searchStyle(text)}
             </div>
+          ) : (
+            <div style={{ display: 'flex', alignItems: 'center' }}>
+              <Tooltip title={text}>
+                <AlertTwoTone
+                  style={{ fontSize: '16px', marginRight: '0.1rem' }}
+                />
+              </Tooltip>
+              {searchStyle(text)}
+            </div>
           )}
         </div>
       ),
@@ -100,6 +109,7 @@ const ProjectManage = () => {
       title: '推送组',
       dataIndex: 'receive_person',
       key: 'receive_person',
+      ellipsis: true,
     },
     {
       title: '是否启用',
@@ -155,8 +165,6 @@ const ProjectManage = () => {
 
   // 模糊查询匹配的样式
   const searchStyle = val => {
-    console.log(val);
-    console.log(value);
     let n;
     if (showSearchStyle) {
       n = val.replace(
@@ -166,7 +174,6 @@ const ProjectManage = () => {
     } else {
       n = val;
     }
-    console.log(val);
     return <div dangerouslySetInnerHTML={{ __html: n }} />;
   };
 
@@ -179,7 +186,7 @@ const ProjectManage = () => {
     setCurrentTempalte(record);
     history.push({
       pathname: `/platformCenter/schemeDetail`,
-      state: { template: record },
+      state: { template: record, currentPage },
     });
     // handleShowModal("editVisible", true)
   };
@@ -221,6 +228,7 @@ const ProjectManage = () => {
   const handleReset = () => {
     setCurrentType('全部');
     setCurrentName('全部');
+    setCurrentPage(1);
     GetMessageList({ pageSize: 10, pageIndex: 0 });
     setShowSearchStyle(false);
     setValue('');
@@ -280,12 +288,17 @@ const ProjectManage = () => {
 
   useEffect(() => {
     setTreeLoading(true);
+
     GetMsgTypeList().then(res => {
       setTreeLoading(false);
       if (res.code === 0) {
         setMessageTypes(res.data);
       }
     });
+    console.log(history.location);
+    if (history.location.query) {
+      setCurrentPage(history.location.query.currentPage);
+    }
   }, []);
   useEffect(() => {
     GetMessageList({ pageIndex, pageSize: 10 });
@@ -324,6 +337,10 @@ const ProjectManage = () => {
     defaultPageSize: 10,
     showQuickJumper: true,
     showSizeChanger: true,
+    current: currentPage,
+    onChange: page => {
+      setCurrentPage(page);
+    },
   };
   return (
     <div className={styles.project_container}>

src/pages/platformCenter/messageManage/projectManage/components/PushTest/CardCheck.jsx

@@ -48,14 +48,18 @@ const CardCheck = props => {
         // 添加新选中的元素
         currentArr.forEach(item => {
           if (someArr.indexOf(item) === -1) {
-            newCheckList.push(item);
+            let checkName = plainOptions.find(ele => ele.value === item);
+            newCheckList.push(checkName);
           }
         });
       } else if (checkType === 'del') {
         // 删除取消勾选的元素
         preArr.forEach(item => {
           if (someArr.indexOf(item) === -1) {
-            newCheckList.splice(newCheckList.findIndex(ele => ele === item), 1);
+            newCheckList.splice(
+              newCheckList.findIndex(ele => ele.value === item),
+              1,
+            );
           }
         });
       }
@@ -89,10 +93,16 @@ const CardCheck = props => {
       </div>
       <div className={styles.bottomCheckbox}>
         <CheckboxGroup
-          options={plainOptions}
           value={checkedList}
           onChange={list => onChange(list)}
-        />
+          style={{ display: 'flex', flexWrap: 'wrap' }}
+        >
+          {plainOptions.map(item => (
+            <Checkbox key={item.value} value={item.value}>
+              {item.label}
+            </Checkbox>
+          ))}
+        </CheckboxGroup>
       </div>
     </div>
   );

src/pages/platformCenter/messageManage/projectManage/components/PushTest/PushTest.jsx

 import React, { useState, useEffect, useCallback } from 'react';
-import { Modal, Form, Input, Button, message, Spin, Pagination } from 'antd';
+import { Modal, Input, Button, message, Spin, Pagination } from 'antd';
 import { GetGroupUserTree, TestPush } from '@/services/platform/messagemanage';
 import styles from './PushTest.less';
+import DragTable from '@/components/DragTable/DragTable';
 import CardCheck from './CardCheck';
 
 const PushTest = props => {
-  const [form] = Form.useForm();
   const { confirmModal, onCancel, visible, pushTestMsg } = props;
   const [allList, setAllist] = useState([]); // 用于展示得数据
   const [checkList, setCheckList] = useState([]); // 选中得数据集合
@@ -13,15 +13,16 @@ const PushTest = props => {
   const [total, setTotal] = useState();
   const [currentPage, setCurrentPage] = useState(1);
   const [pageSize, setPageSize] = useState(10);
+  const [searchName, setSearchName] = useState();
+
   useEffect(() => {
     if (visible) {
-      let username = form.getFieldValue('username');
       setCurrentPage(1);
-      getData(username, 1, pageSize);
+      getData(searchName, 1, pageSize);
     } else {
       setCheckList([]);
       setAllist([]);
-      form.setFieldsValue({ username: '' });
+      setSearchName('');
     }
   }, [visible]);
   // 选中后得回调函数
@@ -34,14 +35,14 @@ const PushTest = props => {
   const paginationChange = (page, pageSizes) => {
     setCurrentPage(page);
     setPageSize(pageSizes);
-    let username = form.getFieldValue('username');
-    getData(username, page, pageSizes);
+    getData(searchName, page, pageSizes);
   };
+  // 提交勾选的测试人员
   const onFinish = () => {
     TestPush({
       theme: pushTestMsg.ThemeName,
       msgType: pushTestMsg.MsgType,
-      tousers: checkList,
+      tousers: checkList.map(item => item.value),
       pushPath: pushTestMsg.item.AgentConfig
         ? pushTestMsg.item.AgentConfig.Url
         : '',
@@ -61,15 +62,18 @@ const PushTest = props => {
   };
   // 搜索
   const onSearch = () => {
-    let username = form.getFieldValue('username');
     setCurrentPage(1);
-    getData(username, 1, pageSize);
+    getData(searchName, 1, pageSize);
   };
   // 重置
   const onReset = () => {
     setCurrentPage(1);
     getData('', 1, pageSize);
-    form.setFieldsValue({ username: '' });
+    setSearchName('');
+  };
+  // 搜索框监听
+  const searchChange = e => {
+    setSearchName(e.target.value);
   };
   // 获取数据
   const getData = (username, page, pageSizes) => {
@@ -90,8 +94,8 @@ const PushTest = props => {
             let checkAll = false;
             let options = item.users.map(val => {
               checkList.forEach(ele => {
-                if (val.userId === ele) {
-                  checkedList.push(ele);
+                if (val.userId === ele.value) {
+                  checkedList.push(ele.value);
                 }
               });
               return {
@@ -99,10 +103,6 @@ const PushTest = props => {
                 value: val.userId,
               };
             });
-            console.log(item.groupName, '名称');
-            console.log(checkList, '所有选择得列表');
-            console.log(checkedList, '当前组件勾选');
-
             if (
               checkedList.length === options.length &&
               checkedList.length > 0
@@ -131,70 +131,95 @@ const PushTest = props => {
         message.error('网络异常，请稍后再试');
       });
   };
+  // 拖拽后的回调函数
+  const dragCallBack = val => {
+    if (val) {
+      setCheckList(val);
+    }
+  };
+  const columns = [
+    {
+      title: '已选推送人',
+      dataIndex: 'label',
+      key: 'label',
+      width: 300,
+    },
+  ];
   return (
     <>
       <Modal
         title="选择推送人"
         visible={visible}
         onOk={onFinish}
-        width="700px"
+        width="900px"
         onCancel={onCancel}
         maskClosable={false}
         destroyOnClose
         centered
       >
-        {/* 头部搜索框 */}
-        <div className={styles.searchHeader}>
-          <Form form={form} layout="inline">
-            <Form.Item name="username">
-              <Input placeholder="请输入用户名称" />
-            </Form.Item>
-            <Form.Item>
-              <Button
-                type="primary"
-                htmlType="submit"
-                onClick={onSearch}
-                style={{ marginRight: '10px' }}
-              >
-                搜索
-              </Button>
+        <div className={styles.pushTestContent}>
+          <div className={styles.leftContent}>
+            {/* 头部搜索框 */}
+            <div className={styles.searchHeader}>
+              <Input.Search
+                value={searchName}
+                placeholder="请输入部门或用户"
+                onChange={searchChange}
+                onSearch={onSearch}
+                enterButton
+                style={{ width: '300px', marginRight: '15px' }}
+              />
               <Button type="primary" htmlType="submit" onClick={onReset}>
                 重置
               </Button>
-            </Form.Item>
-          </Form>
-        </div>
-        {/* 复选框模块 */}
-        <Spin spinning={loading}>
-          <div className={styles.checkContainer}>
-            {allList.map((item, index) => (
-              <div className={styles.checkBoxContent} key={item.groupId}>
-                <CardCheck
-                  cardMsg={item}
-                  cardIndex={index}
-                  callback={(val, newCheckList) =>
-                    checkCallBack(val, newCheckList)
-                  }
-                  checkList={checkList}
-                />
+            </div>
+            {/* 复选框模块 */}
+            <Spin spinning={loading}>
+              <div className={styles.checkContainer}>
+                {allList.map((item, index) => (
+                  <div className={styles.checkBoxContent} key={item.groupId}>
+                    <CardCheck
+                      cardMsg={item}
+                      cardIndex={index}
+                      callback={(val, newCheckList) =>
+                        checkCallBack(val, newCheckList)
+                      }
+                      checkList={checkList}
+                    />
+                  </div>
+                ))}
               </div>
-            ))}
+            </Spin>
+            {/* 分页 */}
+            <Pagination
+              total={total}
+              showTotal={(totals, range) =>
+                `第${range[0]}-${range[1]} 条/共 ${totals} 条`
+              }
+              defaultPageSize={pageSize}
+              defaultCurrent={1}
+              current={currentPage}
+              onChange={paginationChange}
+              style={{ marginBottom: '10px', width: '500px' }}
+              size="small"
+              showQuickJumper
+            />
           </div>
-        </Spin>
-        {/* 分页 */}
-        <Pagination
-          total={total}
-          showTotal={(totals, range) =>
-            `第${range[0]}-${range[1]} 条/共 ${totals} 条`
-          }
-          defaultPageSize={pageSize}
-          defaultCurrent={1}
-          current={currentPage}
-          onChange={paginationChange}
-          style={{ marginBottom: '10px' }}
-          size="small"
-          showQuickJumper
-        />
+          <div className={styles.tableRight}>
+            <DragTable
+              bordered
+              style={{ width: '350px', overflowX: 'hidden' }}
+              rowKey={record => record.value}
+              columns={columns}
+              dataSource={checkList}
+              pagination={false}
+              size="small"
+              dragCallBack={dragCallBack}
+              scroll={{ y: 530 }}
+              ItemTypes="pushTest"
+            />
+          </div>
+        </div>
       </Modal>
     </>
   );

src/pages/platformCenter/messageManage/projectManage/components/PushTest/PushTest.less

-.checkContainer {
-  height: 500px;
-  overflow-y: scroll;
-  margin: 20px 0;
-  padding-right: 5px;
-}
-.checkContent {
+.pushTestContent {
   display: flex;
-  width: 100%;
-  flex-direction: column;
-
-  border: 1px solid #c2cdfd;
-  border-radius: 5px;
-  margin-top: 20px;
-  min-height: 50px;
-  padding: 0 10px 10px 20px;
-  .ant-checkbox-wrapper {
-    background-color: #fff;
-  }
-  .topCheckbox {
-    height: 20px;
-    margin: -10px 0 0 0px;
-    line-height: 20px;
-  }
-  .topCheckbox > label :hover {
-    font-weight: 600;
+  .searchHeader {
+    display: flex;
   }
-  .bottomCheckbox {
-    margin-top: 10px;
-    .ant-checkbox-group-item {
-      min-width: 150px !important;
-    }
-    .ant-checkbox-wrapper {
-      min-width: 150px !important;
+  .checkContainer {
+    height: 500px;
+    width: 500px;
+    overflow-y: scroll;
+    margin: 20px 0;
+    padding-right: 5px;
+    .checkContent {
+      display: flex;
+      width: 100%;
+      flex-direction: column;
+      border: 1px solid #c2cdfd;
+      border-radius: 5px;
+      margin-top: 20px;
+      min-height: 50px;
+      padding: 0 10px 10px 20px;
+      .ant-checkbox-wrapper {
+        background-color: #fff;
+      }
+      .topCheckbox {
+        height: 20px;
+        margin: -10px 0 0 0px;
+        line-height: 20px;
+      }
+      .topCheckbox > label :hover {
+        font-weight: 600;
+      }
+      .bottomCheckbox {
+        margin-top: 10px;
+        .ant-checkbox-wrapper {
+          min-width: 150px;
+          margin-left: 0;
+        }
+        // .ant-checkbox-group-item {
+        //   min-width: 150px !important;
+        // }
+        // .ant-checkbox-wrapper {
+        //   min-width: 150px !important;
+        // }
+      }
+      .checkdiv {
+        display: flex;
+        flex-wrap: wrap;
+      }
     }
   }
-  .checkdiv {
-    display: flex;
-    flex-wrap: wrap;
+  .tableRight {
+    margin-left: 10px;
   }
 }

src/pages/platformCenter/messageManage/projectManage/components/RolseSelect/RoleModal.jsx

+import React, { useEffect, useState } from 'react';
+import { Modal, Checkbox } from 'antd';
+import { RoleGroupList } from '@/services/platform/messagemanage';
+import styles from './RoleModal.less';
+const CheckboxGroup = Checkbox.Group;
+
+const RoleModal = porps => {
+  const { visible, rolCallBack, onCancel, selectValue } = porps;
+  const [roleList, setRoleList] = useState([]); // 角色列表
+
+  useEffect(() => {
+    if (visible) {
+      let hasCheckList = selectValue ? selectValue.split(',') : [];
+      RoleGroupList().then(res => {
+        if (res.code === 0) {
+          let roleListData = res.data.roleList;
+          // 给子角色分类放到外面来
+          roleListData.forEach((item, index) => {
+            if (item.child.length > 0) {
+              item.child.forEach((val, i) => {
+                val.visibleTitle = `${item.visibleTitle}(${val.visibleTitle})`;
+                roleListData.splice(index + 1 + i, 0, val);
+              });
+            }
+          });
+          console.log(roleListData, 'roleListData');
+          let list = roleListData.map(item => {
+            let checkedList = []; // 已选
+            let options = []; // 数据源
+            let indeterminate = false; // 有选中但没全选样式
+            let checkAll = false; // 全选样式
+            options = item.roleList.map(val => {
+              hasCheckList.forEach(ele => {
+                if (val.roleName === ele) {
+                  checkedList.push(ele);
+                }
+              });
+              return val.roleName;
+            });
+            if (
+              checkedList.length === options.length &&
+              checkedList.length > 0
+            ) {
+              checkAll = true;
+            }
+            if (checkedList.length < options.length && checkedList.length > 0) {
+              indeterminate = true;
+            }
+            return {
+              options,
+              checkedList,
+              checkAll,
+              indeterminate,
+              visibleTitle: item.visibleTitle,
+            };
+          });
+          console.log(list, 'list');
+          setRoleList(list);
+        }
+      });
+      console.log(selectValue, 'selectValue');
+    }
+  }, [visible]);
+  // 多选change事件
+  const onCheckAllChange = (e, index) => {
+    let newCheckList = JSON.parse(JSON.stringify(roleList));
+    newCheckList[index].checkedList = e.target.checked
+      ? newCheckList[index].options
+      : [];
+    newCheckList[index].indeterminate = false;
+    newCheckList[index].checkAll = e.target.checked;
+    setRoleList(newCheckList);
+  };
+  // 单选change事件
+  const onChange = (list, index) => {
+    let newCheckList = JSON.parse(JSON.stringify(roleList));
+    newCheckList[index].checkedList = list;
+    newCheckList[index].indeterminate =
+      !!list.length && list.length < newCheckList[index].options.length;
+    newCheckList[index].checkAll =
+      list.length === newCheckList[index].options.length;
+    setRoleList(newCheckList);
+  };
+  return (
+    <div>
+      <Modal
+        title="选择推送人"
+        visible={visible}
+        onOk={() => rolCallBack(roleList)}
+        width="900px"
+        onCancel={onCancel}
+        maskClosable={false}
+        destroyOnClose
+        centered
+      >
+        <div className={styles.checkContainer}>
+          {roleList.map((item, index) => (
+            <div className={styles.checkContent} key={item.visibleTitle}>
+              <div className={styles.topCheckbox}>
+                <Checkbox
+                  indeterminate={item.indeterminate}
+                  onChange={e => onCheckAllChange(e, index)}
+                  checked={item.checkAll}
+                >
+                  {item.visibleTitle}
+                </Checkbox>
+              </div>
+              <div className={styles.bottomCheckbox}>
+                <CheckboxGroup
+                  value={item.checkedList}
+                  onChange={list => onChange(list, index)}
+                  style={{ display: 'flex', flexWrap: 'wrap' }}
+                >
+                  {item.options.map(val => (
+                    <Checkbox key={val} value={val}>
+                      {val}
+                    </Checkbox>
+                  ))}
+                </CheckboxGroup>
+              </div>
+            </div>
+          ))}
+        </div>
+      </Modal>
+    </div>
+  );
+};
+
+export default RoleModal;

src/pages/platformCenter/messageManage/projectManage/components/RolseSelect/RoleModal.less

+.checkContainer {
+  height: 500px;
+  width: 90%;
+  overflow-y: scroll;
+  // margin: 20px 0;
+  margin-left: 50%;
+  margin-bottom: 20px;
+  transform: translateX(-50%);
+  padding-right: 5px;
+  .checkContent {
+    display: flex;
+    width: 100%;
+    flex-direction: column;
+    border: 1px solid #c2cdfd;
+    border-radius: 5px;
+    margin-top: 20px;
+    min-height: 50px;
+    padding: 0 10px 10px 20px;
+    .ant-checkbox-wrapper {
+      background-color: #fff;
+    }
+    .topCheckbox {
+      height: 20px;
+      margin: -10px 0 0 0px;
+      line-height: 20px;
+    }
+    .topCheckbox > label :hover {
+      font-weight: 600;
+    }
+    .bottomCheckbox {
+      margin-top: 10px;
+      .ant-checkbox-wrapper {
+        min-width: 200px;
+        margin-left: 0;
+      }
+    }
+    .checkdiv {
+      display: flex;
+      flex-wrap: wrap;
+    }
+  }
+}

src/pages/platformCenter/schemeDetail/schemeDetail.jsx

 /* eslint-disable radix */
 /* eslint-disable camelcase */
-import React, { useState, useEffect, useRef } from 'react';
+import React, { useState, useEffect, useRef, useCallback } from 'react';
 import SiteModal from '@/components/Modal/SiteModa';
 import {
   Form,
@@ -18,11 +18,12 @@ import { Switch } from 'react-router';
 import { iteratee } from 'lodash';
 import v from 'voca';
 
-import { UsergroupDeleteOutlined } from '@ant-design/icons';
+import { UsergroupDeleteOutlined, IdcardOutlined } from '@ant-design/icons';
 import moment from 'moment';
 import { useHistory } from 'react-router-dom';
 import VisibleRoleModal from '../messageManage/projectManage/components/RolseSelect/VisibleRoleModal';
 import VisibleIISAgentConfig from '../messageManage/projectManage/components/IISAgentConfig/VisibleIISAgentConfig';
+import RoleModal from '../messageManage/projectManage/components/RolseSelect/RoleModal';
 import {
   GetMessageTemplate,
   UpdateMessageConfig,
@@ -43,7 +44,7 @@ const EditModal = props => {
   const [IISConfig, setIISConfig] = useState(null);
   const [isUse, setIsUse] = useState('0');
   const [btnType, setBtnType] = useState('定时推送');
-  const { template, confirmModal } = props.location.state;
+  const { template, confirmModal, currentPage } = props.location.state;
   const [currentTrench, setCurrentTrench] = useState({
     isMessageShow: false,
     isAPPShow: false,
@@ -51,6 +52,7 @@ const EditModal = props => {
     isWXShow: false,
     isEnterpriseWXShow: false,
   });
+  const [showRoleModal, setShowRoleModal] = useState(false); // 推送组选择角色弹窗
   // eslint-disable-next-line camelcase
   const [APP_ITEMS, setAPP_ITEMS] = useState([]);
   const [WEB_ITEMS, setWEB_ITEMS] = useState([]);
@@ -259,6 +261,7 @@ const EditModal = props => {
             AddIISAgentConfig(IISConfig).then(res => {
               if (res.code === 0) {
                 message.success('保存成功');
+                back();
               } else {
                 notification.error({
                   message: '提示',
@@ -268,6 +271,7 @@ const EditModal = props => {
               }
             });
           } else {
+            back();
             message.success('保存成功');
           }
         } else {
@@ -319,6 +323,7 @@ const EditModal = props => {
             AddIISAgentConfig(IISConfig).then(res => {
               if (res.code === 0) {
                 message.success('保存成功');
+                back();
               } else {
                 notification.error({
                   message: '提示',
@@ -328,6 +333,7 @@ const EditModal = props => {
               }
             });
           } else {
+            back();
             message.success('保存成功');
           }
         } else {
@@ -362,7 +368,12 @@ const EditModal = props => {
     setIsUse(value ? '1' : '0');
   };
   const back = () => {
-    history.push('/platformCenter/notify');
+    history.push({
+      pathname: '/platformCenter/notify',
+      query: {
+        currentPage,
+      },
+    });
   };
   const tailLayout = {
     wrapperCol: { offset: 21, span: 24 },
@@ -372,6 +383,23 @@ const EditModal = props => {
     data[type] = value;
     setCurrentTrench(data);
   };
+  // 推送组选择角色
+  const rolCallBack = useCallback(list => {
+    console.log(list, 'list');
+    let strList = [];
+    if (list.length > 0) {
+      list.forEach(item => {
+        console.log(item, 'item');
+        item.checkedList.forEach(ele => {
+          strList.push(ele);
+        });
+      });
+      form.setFieldsValue({ to_person: strList.join(',') });
+      setShowRoleModal(false);
+      console.log(strList.join(','));
+    }
+  });
+
   return (
     <div className={styles.editModal_container}>
       <Form form={form} {...layout} onFinish={onSubmit}>
@@ -413,13 +441,29 @@ const EditModal = props => {
           {btnType === '定时推送' && (
             <Card title="推送信息" style={{ width: '100%', marginTop: '1rem' }}>
               <div style={{ display: 'flex', alignItems: 'center' }}>
-                <Item
-                  label="推送组"
-                  name="to_person"
-                  labelCol={{ span: 3 }}
-                  style={{ paddingTop: '1.6rem', width: '35rem' }}
-                >
-                  <VisibleRoleModal
+                <Item labelCol={{ span: 6 }}>
+                  <div style={{ display: 'flex' }}>
+                    <Item
+                      label="推送组"
+                      name="to_person"
+                      style={{ marginTop: '50px' }}
+                    >
+                      <Input disabled />
+                    </Item>
+                    <IdcardOutlined
+                      onClick={() => {
+                        setShowRoleModal(true);
+                      }}
+                      style={{
+                        marginTop: '58px',
+                        marginLeft: '10px',
+                        fontSize: '22px',
+                        color: '#1890FF',
+                        cursor: 'pointer',
+                      }}
+                    />
+                  </div>
+                  {/* <VisibleRoleModal
                     style={{
                       display: 'flex',
                       width: '35rem',
@@ -432,7 +476,7 @@ const EditModal = props => {
                     title={
                       <UsergroupDeleteOutlined style={{ fontSize: '18px' }} />
                     }
-                  />
+                  /> */}
                 </Item>
 
                 <div
@@ -676,6 +720,14 @@ const EditModal = props => {
         </Item>
       </Form>
       <div />
+      <RoleModal
+        selectValue={form.getFieldValue('to_person')}
+        visible={showRoleModal}
+        rolCallBack={roleList => rolCallBack(roleList)}
+        onCancel={() => {
+          setShowRoleModal(false);
+        }}
+      />
     </div>
   );
 };

src/pages/platformCenter/standingBook/editorModal.jsx

@@ -75,10 +75,28 @@ const AddModal = props => {
       if (validate) {
         setLoading(true);
         let obj = form.getFieldsValue();
+        console.log(obj, 'obj');
+        console.log(inputValue, 'inputValue');
+        const {
+          AddFields,
+          EditFields,
+          Fields,
+          MobileFields,
+          SearchFields,
+          WebFields,
+        } = inputValue;
+        let fieldsObj = {
+          AddFields,
+          EditFields,
+          Fields,
+          MobileFields,
+          SearchFields,
+          WebFields,
+        };
         let data =
           type == 'add'
             ? { ...obj, ...inputValue, Order: maxLength }
-            : { ...obj, Order, ID: formObj.ID };
+            : { ...obj, Order, ...fieldsObj, ID: formObj.ID };
         GetCMLedger_OperateLedger(data)
           .then(res => {
             setLoading(false);
@@ -550,9 +568,9 @@ const AddModal = props => {
               </div>
             </Item>
             <Item label="接口配置" name="Interface">
-              <div className={styles.filed_listItem}>
-                <TextArea placeholder="服务项目dll库" allowClear />
-              </div>
+              {/* <div className={styles.filed_listItem}> */}
+              <TextArea placeholder="服务项目dll库" allowClear />
+              {/* </div> */}
             </Item>
           </Form>
           <ChangeAdd

src/pages/webConfig/index.js

@@ -52,6 +52,7 @@ const WebConfigPage = props => {
   }, []);
 
   useEffect(() => {
+    console.log(curWeb, 'curWeb');
     let canceled = { cancel: false };
     if (!curWeb) return;
     const title = curWeb.text;

src/pages/webConfig/menuconfig/ImportOrExport.jsx

+import React, { useEffect, useState } from 'react';
+import { Modal, Upload, Button, Form, Input, message, Popconfirm } from 'antd';
+
+import { UploadOutlined, DownloadOutlined } from '@ant-design/icons';
+import {
+  UpLoadWebModuleTree,
+  DownLoadWebModuleTree,
+} from '@/services/webConfig/api';
+
+const ImportOrExport = props => {
+  const { visible, onFinish, onCancel, nodeObj, subSystemValue } = props;
+  const [form] = Form.useForm();
+  const [uploading, setUploading] = useState(false); // 文件是否上传成功
+  const [file, setFile] = useState(); // 上传文件信息
+  useEffect(() => {
+    if (visible) {
+      form.setFieldsValue({ fileName: '' });
+    }
+  }, [visible]);
+
+  // 本地上传文件
+  const beforeUpload = val => {
+    console.log(val);
+    form.setFieldsValue({ fileName: val.name });
+    setFile(val);
+    return false;
+  };
+  // 导出菜单
+  const hadelExport = () => {
+    window.location.href = DownLoadWebModuleTree({
+      nodeId: nodeObj ? nodeObj.menuID : '-1',
+      sysName: subSystemValue,
+    });
+  };
+  // 提交上传文件
+  const handleUpload = type => {
+    if (!form.getFieldValue('fileName')) {
+      message.info('请上传文件');
+      return;
+    }
+    const formData = new FormData();
+    formData.append('_files', file);
+    formData.append('type', type);
+    formData.append('nodeId', nodeObj ? nodeObj.menuID : '-1');
+    formData.append('visible', subSystemValue);
+    UpLoadWebModuleTree(formData)
+      .then(res => {
+        console.log(res);
+        if (res.code === 0) {
+          message.success('上传成功');
+          onCancel();
+        } else {
+          message.error(res.msg);
+        }
+      })
+      .catch(() => {
+        message.error('网络异常，请稍后再试');
+      });
+  };
+
+  return (
+    <>
+      <Modal
+        title="菜单组导入导出"
+        visible={visible}
+        onOk={onFinish}
+        width="550px"
+        onCancel={onCancel}
+        maskClosable={false}
+        destroyOnClose
+        centered
+        footer={null}
+      >
+        <div style={{ paddingBottom: '15px' }}>
+          <Form
+            name="form"
+            labelCol={{ span: 4 }}
+            wrapperCol={{ span: 20 }}
+            form={form}
+          >
+            <Form.Item label="本地导出">
+              <Button
+                type="primary"
+                onClick={hadelExport}
+                icon={<DownloadOutlined />}
+              >
+                导出菜单配置
+              </Button>
+            </Form.Item>
+            <Form.Item label="本地导入">
+              <div style={{ display: 'flex' }}>
+                <Form.Item name="fileName" style={{ marginBottom: '0' }}>
+                  <Input disabled />
+                </Form.Item>
+                <Upload
+                  beforeUpload={beforeUpload}
+                  showUploadList={false}
+                  accept=".json"
+                >
+                  <Button
+                    type="primary"
+                    style={{ marginLeft: '10px' }}
+                    icon={<UploadOutlined />}
+                    shape="circle"
+                  />
+                </Upload>
+                <Popconfirm
+                  title={
+                    <span>
+                      导入操作会覆盖所有菜单配置并且使
+                      <br />
+                      角色菜单权限失效是否继续导入？
+                    </span>
+                  }
+                  onConfirm={() => handleUpload(1)}
+                  onVisibleChange={() => console.log('visible change')}
+                >
+                  <Button
+                    type="primary"
+                    style={{
+                      marginLeft: '10px',
+                      display: nodeObj ? 'none' : 'block',
+                    }}
+                  >
+                    覆盖导入
+                  </Button>
+                </Popconfirm>
+
+                <Button
+                  type="primary"
+                  onClick={() => handleUpload(2)}
+                  loading={uploading}
+                  style={{
+                    marginLeft: '10px',
+                    display: nodeObj ? 'none' : 'block',
+                  }}
+                >
+                  增量导入
+                </Button>
+                <Button
+                  type="primary"
+                  onClick={() => handleUpload(2)}
+                  loading={uploading}
+                  style={{
+                    marginLeft: '10px',
+                    display: nodeObj ? 'block' : 'none',
+                  }}
+                >
+                  开始导入
+                </Button>
+              </div>
+            </Form.Item>
+          </Form>
+        </div>
+      </Modal>
+    </>
+  );
+};
+
+export default ImportOrExport;

src/pages/webConfig/menuconfig/webMenu.jsx

@@ -10,12 +10,14 @@ import {
   FolderFilled,
   FileOutlined,
   DeleteTwoTone,
+  DeliveredProcedureOutlined,
 } from '@ant-design/icons';
 import classnames from 'classnames';
 import styles from './webMenu.less';
 import AddForm from './AddForm';
 import EditForm from './editForm';
 import CheckList from './checkBox';
+import ImportOrExport from './ImportOrExport';
 import {
   addWebMenu, // 增
   deleteWebMenu, // 删
@@ -41,6 +43,7 @@ const MiniMenu = props => {
   const [menuID, setMenuID] = useState(''); // 选中的树ID
   const [nodeType, setNodeType] = useState(''); // 选中的节点类型
   const [info, setInfo] = useState({});
+  const [importOrExportVisible, setImportOrExportVisible] = useState(false); // 导入导出弹窗
   const [addVisible, setAddVisible] = useState(false); // 新增弹窗
   const [addTwoVisible, setAddTwoVisible] = useState(false); // 编辑弹窗
   const [delVisible, setDelVisible] = useState(false); // 删除弹窗
@@ -92,6 +95,14 @@ const MiniMenu = props => {
         <div className={styles.title}>
           <div>{obj.text}</div>
           <div className={styles.tip}>
+            {obj.menuType === 'Web4MenuGroup' && (
+              <Tooltip title="导入导出菜单组" className={styles.fs}>
+                <DeliveredProcedureOutlined
+                  style={{ color: '#178BF7' }}
+                  onClick={e => importAndExport(obj, e)}
+                />
+              </Tooltip>
+            )}
             {obj.menuType === 'Web4MenuGroup' && (
               <Tooltip title="新增菜单组" className={styles.fs}>
                 <FolderAddTwoTone onClick={e => addMenuGroupTip(obj, e)} />
@@ -205,6 +216,12 @@ const MiniMenu = props => {
         console.error(err);
       });
   };
+  // 导入导出菜单组
+  const importAndExport = (val, e) => {
+    e.stopPropagation();
+    setNodeObj(val);
+    setImportOrExportVisible(true);
+  };
   // 新增菜单组
   const addMenuGroupTip = (val, e) => {
     e.stopPropagation();
@@ -245,6 +262,8 @@ const MiniMenu = props => {
     }
     return url;
   };
+  // 导入或导出弹窗回调
+  const onFinishCallBack = () => {};
   // 新增提交的回调
   const submitCallback = (prop, item) => {
     console.log(subSystemValue, 'subSystemValue');
@@ -507,6 +526,15 @@ const MiniMenu = props => {
           >
             菜单列表
             <div className={classnames(styles.tRight)}>
+              <Tooltip title="导入导出菜单组" className={styles.fs}>
+                <DeliveredProcedureOutlined
+                  style={{ color: '#178BF7', marginRight: '10px' }}
+                  onClick={() => {
+                    setNodeObj('');
+                    setImportOrExportVisible(true);
+                  }}
+                />
+              </Tooltip>
               <Tooltip title="新增最上级菜单组">
                 <FolderAddTwoTone
                   className={`${styles.icon1} ${styles.icon}`}
@@ -620,6 +648,16 @@ const MiniMenu = props => {
             />
           )}
         </div>
+        <ImportOrExport
+          visible={importOrExportVisible}
+          onFinish={onFinishCallBack}
+          onCancel={() => {
+            setImportOrExportVisible(false);
+            getTree();
+          }}
+          subSystemValue={subSystemValue}
+          nodeObj={nodeObj}
+        />
         {/* <div
           className={classnames({
             [styles.rightBox]: true,

src/services/webConfig/api.js

 import qs from 'qs';
+import axios from 'axios';
 import { CITY_SERVICE, get, PUBLISH_SERVICE, post, postForm } from '../index';
 
 /**
@@ -302,3 +303,14 @@ export const SettingRoleWebSchema = query =>
 // 根据底图判断是否是方案最后底图
 export const GetSchemaBaseMapIsLast = query =>
   get(`${PUBLISH_SERVICE}/Maplayer/GetSchemaBaseMapIsLast`, query);
+// 上传菜单
+export const UpLoadWebModuleTree = query =>
+  post(`${PUBLISH_SERVICE}/PlatformCenter/UpLoadWebModuleTree`, query, {
+    headers: {
+      'Content-Type': 'multipart/form-data;charset=UTF-8',
+    },
+  });
+export const DownLoadWebModuleTree = query =>
+  `${PUBLISH_SERVICE}/PlatformCenter/DownLoadWebModuleTree?nodeId=${
+    query.nodeId
+  }&sysName=${query.sysName}`;