fix: 修改主页配置bug

src/pages/productCenter/webConfig/components/HomeConfigModal.jsx

@@ -8,13 +8,13 @@ const HomeConfigModal = props => {
   const { handleCancel, productList, visible, onFinish, currentPageConfig, client } = props;
   const [form] = Form.useForm();
 
-  const [checkList, setCheckList] = useState([]);
+  const [checkList, setCheckList] = useState(null);
   useEffect(() => {
     if (visible) {
       form.setFieldsValue(currentPageConfig);
       getCheckList();
     } else {
-      setCheckList([]);
+      setCheckList(null);
       form.resetFields();
     }
   }, [visible]);
@@ -56,7 +56,6 @@ const HomeConfigModal = props => {
         const chekMap = new Set(currentPageConfig.roleId);
         res.data.forEach(item => {
           if (item.groupName !== '默认') {
-            childList.push(item);
             let checks = [];
             item.roleGroups.forEach(ele => {
               if (chekMap.has(ele.roleId)) {
@@ -73,6 +72,7 @@ const HomeConfigModal = props => {
               item.indeterminate = true;
               item.isCheck = false;
             }
+            childList.push(item);
           } else {
             defaultList = item.roleGroups;
           }
@@ -80,29 +80,26 @@ const HomeConfigModal = props => {
 
         console.log(chekMap, currentPageConfig, 'chekMap');
 
-        let list = [
-          {
-            groupName: '关联角色',
-            isCheck: false,
-            index: [0],
-            roleGroups: [...defaultList, ...childList].map((item, index) => {
-              let obj = {
-                groupName: item.groupName,
-                isCheck: item.isCheck,
-                indeterminate: item.indeterminate,
-                index: [0, index],
-                roleGroups: item.roleGroups?.map((ele, i) => ({
-                  ...ele,
-                  isCheck: chekMap.has(ele.roleId),
-                  index: [0, index, i],
-                })),
-              };
-              let ojbChild = { ...item, isCheck: chekMap.has(item.roleId), index: [0, index] };
+        let list = {
+          groupName: '关联角色',
+          isCheck: false,
+          roleGroups: [...defaultList, ...childList].map((item, index) => {
+            let obj = {
+              groupName: item.groupName,
+              isCheck: item.isCheck,
+              indeterminate: item.indeterminate,
+              index: [index],
+              roleGroups: item.roleGroups?.map((ele, i) => ({
+                ...ele,
+                isCheck: chekMap.has(ele.roleId),
+                index: [index, i],
+              })),
+            };
+            let ojbChild = { ...item, isCheck: chekMap.has(item.roleId), index: [index] };
 
-              return item.roleGroups ? obj : ojbChild;
-            }),
-          },
-        ];
+            return item.roleGroups ? obj : ojbChild;
+          }),
+        };
         console.log(list, 'list');
         setCheckList(list);
       }
@@ -110,14 +107,11 @@ const HomeConfigModal = props => {
   };
   // 多选
   const changeAll = (e, item) => {
+    console.log(item, 'itemasjdf');
     let list = lodash.cloneDeep(checkList);
-    let current = item.index.reduce(
-      (acc, cur) =>
-        acc[cur].roleGroups && cur !== item.index[item.index.length - 1]
-          ? acc[cur].roleGroups
-          : acc[cur],
-      list,
-    );
+    let current = item.index
+      ? item.index.reduce((acc, cur) => (acc.roleGroups ? acc.roleGroups[cur] : acc), list)
+      : list;
     console.log(current);
     current.isCheck = e.target.checked;
     checkAll(e.target.checked, current.roleGroups);
@@ -134,22 +128,21 @@ const HomeConfigModal = props => {
   };
   const onChange = (e, item) => {
     let list = lodash.cloneDeep(checkList);
-
+    console.log(item.index, list, 'asfd');
     let current = item.index.reduce(
-      (acc, cur) => (acc[cur].roleGroups ? acc[cur].roleGroups : acc[cur]),
+      (acc, cur) => (acc.roleGroups ? acc.roleGroups[cur] : acc),
       list,
     );
+    console.log(current, 'current');
     current.isCheck = e.target.checked;
     let parentIndex = [...item.index];
     parentIndex.pop();
 
     let allCurrent = parentIndex.reduce(
-      (acc, cur) =>
-        acc[cur].roleGroups && cur !== parentIndex[parentIndex.length - 1]
-          ? acc[cur].roleGroups
-          : acc[cur],
+      (acc, cur) => (acc.roleGroups ? acc.roleGroups[cur] : acc),
       list,
     );
+    console.log(allCurrent, 'allCurrent');
     let num = allCurrent?.roleGroups?.filter(ele => ele.isCheck).length;
 
     if (num === allCurrent.roleGroups.length) {
@@ -164,47 +157,44 @@ const HomeConfigModal = props => {
 
     setCheckList(list);
   };
-  const checkRender = list => (
-    <>
-      <div className={styles.checkList}>
-        {list.map(item => {
-          let num = item.roleGroups?.filter(ele => ele.isCheck || ele.indeterminate).length;
-
-          return (
-            <div className={styles.checkBox} key={item.groupName}>
-              {item.groupName && (
-                <div className={styles.title}>
+  const checkRender = list => {
+    console.log(list, 'fasldfjaslkdjf');
+    let num = list?.roleGroups?.filter(ele => ele.isCheck || ele.indeterminate).length;
+    return (
+      <>
+        <div className={styles.checkList}>
+          {list?.groupName && (
+            <div className={styles.title}>
+              <Checkbox
+                onChange={e => changeAll(e, list)}
+                checked={num === list?.roleGroups.length}
+                indeterminate={num > 0 && num < list?.roleGroups.length}
+              >
+                {list?.groupName}
+              </Checkbox>
+            </div>
+          )}
+          {list?.roleGroups.map(item => {
+            return (
+              <>
+                {item.roleGroups ? (
+                  checkRender(item)
+                ) : (
                   <Checkbox
-                    onChange={e => changeAll(e, item)}
-                    checked={num === item.roleGroups.length}
-                    indeterminate={num > 0 && num < item.roleGroups.length}
+                    onChange={e => onChange(e, item)}
+                    style={{ width: '150px', marginLeft: '0px', marginBottom: '10px' }}
+                    checked={item.isCheck}
                   >
-                    {item.groupName}
+                    {item.roleName}
                   </Checkbox>
-                </div>
-              )}
-              {item.roleGroups &&
-                item.roleGroups.map(ele => (
-                  <>
-                    {ele.roleGroups ? (
-                      checkRender(item.roleGroups)
-                    ) : (
-                      <Checkbox
-                        onChange={e => onChange(e, ele)}
-                        style={{ width: '150px', marginLeft: '0px', marginBottom: '10px' }}
-                        checked={ele.isCheck}
-                      >
-                        {ele.roleName}
-                      </Checkbox>
-                    )}
-                  </>
-                ))}
-            </div>
-          );
-        })}
-      </div>
-    </>
-  );
+                )}
+              </>
+            );
+          })}
+        </div>
+      </>
+    );
+  };
   return (
     <Modal
       width={800}
@@ -215,7 +205,7 @@ const HomeConfigModal = props => {
       onOk={onSubmit}
       destroyOnClose
     >
-      <div className={styles.monitorContent}>
+      <div className={styles.content}>
         <Form
           form={form}
           labelCol={{ span: 3 }}

src/pages/productCenter/webConfig/components/HomeConfigModal.less

+.content {
+  max-height: 600px;
+  overflow-y: scroll
+}
+
 .checkList {
   display: flex;
   flex-wrap: wrap;
   width: 100%;
   border: 1px solid #c2cdfd;
-  padding: 20px 15px 15px 15px;
+  padding: 20px 15px 10px 15px;
   position: relative;
   margin-top: 15px;
+  align-items: center;
+  // margin-bottom: 10px;
   border-radius: 5px;
+
   .title {
     position: absolute;
     top: -12px;
     background-color: #fff;
   }
+
+
 }
\ No newline at end of file

src/pages/productCenter/webConfig/menuconfig/editConfigFileWrapper.js

@@ -7,7 +7,7 @@ import 'ace-builds/src-noconflict/mode-json';
 import 'ace-builds/src-noconflict/theme-solarized_light';
 
 const ConfigWrapper = props => {
-  const { value, children, onChange, ...rest } = props;
+  const { value, children, onChange, id, ...rest } = props;
   const [text, setText] = useState('');
   const [visible, setVisible] = useState(false);
 
@@ -44,7 +44,7 @@ const ConfigWrapper = props => {
       err = true;
     }
     if (!err) {
-      saveConfigContent(value, JSON.stringify(JSON.parse(text), null, 4))
+      saveConfigContent(value, JSON.stringify(JSON.parse(text), null, 4), id)
         .then(res => {
           if (res.code === 0) {
             notification.success({

src/pages/productCenter/webConfig/menuconfig/editForm.jsx

@@ -49,8 +49,8 @@ const EditForm = props => {
   };
   // 回显表单
   useEffect(() => {
-    console.log(info);
-    console.log(infoAll);
+    console.log(info, 'info');
+    console.log(infoAll, 'infoalll');
     form.resetFields();
     otherForm.resetFields();
     setPlainOptions(info);
@@ -111,7 +111,6 @@ const EditForm = props => {
   const submit = () => {
     const targetForm = nodeType === 1 ? form : otherForm;
     let obj = targetForm.getFieldsValue();
-    console.log(obj);
     console.log(plainOptions);
     let data = [];
     if (nodeType == 1) {
@@ -125,7 +124,18 @@ const EditForm = props => {
       } else {
         obj.relatedRoleList = '';
       }
+      console.log(productList, 'productlIST');
+      let arr = obj.pageUrl.split('/'); // 用const声明常量
+
+      const product = productList.find(item => item.PackageName.includes(arr[0]));
+      if (product) {
+        arr.shift();
+        obj.pageUrl = arr.join('/');
+      }
+      console.log(product, 'product');
+      obj.product = product?.PackageName || 'civweb4';
     }
+    console.log(obj, 'fadas');
     submitCallback(obj);
   };
 
@@ -301,7 +311,7 @@ const EditForm = props => {
           <Item label="菜单别名" name="shortName" style={{ marginLeft: '11px' }}>
             <Input placeholder="请输入菜单别名" style={{ width: '100%' }} />
           </Item>
-          <Item label="产品类型" name="product" style={{ marginLeft: '11px' }}>
+          {/* <Item label="产品类型" name="product" style={{ marginLeft: '11px' }}>
             <Select placeholder="请选择产品类型" allowClear style={{ width: '100%' }}>
               {productList &&
                 productList.length > 0 &&
@@ -311,7 +321,7 @@ const EditForm = props => {
                   </Option>
                 ))}
             </Select>
-          </Item>
+          </Item> */}
           <Item
             label="菜单图标"
             name="imageUrl"
@@ -359,7 +369,7 @@ const EditForm = props => {
             </div>
           </Item>
           <Item label="配置文件" name="config" style={{ marginLeft: '11px' }}>
-            <EditeConfigWrapper>
+            <EditeConfigWrapper id={infoAll.menuID}>
               <Select
                 allowClear
                 showSearch

src/services/webConfig/api.js

@@ -95,8 +95,9 @@ export const getWebMenuInfo = param =>
 //     },
 //   );
 
-export const saveConfigContent = (fileName, content) =>
+export const saveConfigContent = (fileName, content, id) =>
   post(`${PUBLISH_SERVICE}/PlatformCenter/SaveConfigContent`, {
+    id,
     fileName,
     web4ConfigContent: content,
   });
@@ -333,4 +334,4 @@ export const QueryBaseMapItems = param => get(`${PANDA_GIS}/MapLayer/QueryBaseMa
 // 通过client获取角色
 export const GetRoleGroups = param => get(`${PUBLISH_SERVICE}/UserCenter/GetRoleGroups`, param);
 
-export const SortScheme = param => get(`${PANDA_GIS}/MapLayer/SortScheme`, param);
+export const SortScheme = param => get(`${PANDA_GIS}/MapLayer/SortScheme`, param);
\ No newline at end of file