perf: 移动应用配置布局修改

src/pages/mobileConfig/index.js

@@ -26,7 +26,7 @@ import { appConnector } from '@/containers/App/store';
 const { TabPane } = Tabs;
 const MobileConfigPage = props => {
   const { userMode } = props;
-  const [activeKey, setActiveKey] = useState('0'); // tabs活动页
+  const [activeKey, setActiveKey] = useState('1'); // tabs活动页
   const [miniTitle, setMiniTitle] = useState(''); // 应用名称
   const [flag, setFlag] = useState(1); // 刷新标志
   const [showConfig, setShowConfig] = useState(true);
@@ -201,7 +201,7 @@ const MobileConfigPage = props => {
   );
   const tabArr = [
     {
-      title: '网站配置',
+      title: '应用配置',
       key: '0',
       component: (
         <SiteConfig

src/pages/mobileConfig/menuconfig/addForm.less

 .formStyle{
-  margin-bottom: 40px;
+  margin-bottom: 20px;
+  // height: 100%;
+  // overflow-y: scroll;
+}
+.formbtn{
+  position: fixed;
+  bottom: 40px;
+  right:40%
+}
+.divbox{
+  height: 100%;
+  overflow: hidden;
 }
\ No newline at end of file

src/pages/mobileConfig/menuconfig/checkBox.less

 .box{
   display: flex;
-  padding: 10px;
-  margin-top: 10px;
+  padding: 10px 10px 10px 20px;
+  margin: 20px;
   flex-wrap: wrap;
-  // border: 1px solid gray;
+  border: 1px solid #eee;
 }
 .check{
   flex-shrink: 0;

src/pages/mobileConfig/menuconfig/editForm.jsx

 import React, { useState, useEffect } from 'react';
 import { Form, Input, Button, Row, Col } from 'antd';
+import classnames from 'classnames';
 import styles from './addForm.less';
 import PicturesWall from '@/components/Upload/index';
+import CheckList from './checkBox';
 
 const { Item } = Form;
 const EditForm = props => {
-  const { submitCallback, nodeType, info } = props;
+  const { submitCallback, nodeType, info, valueCallback = () => {} } = props;
   const [form] = Form.useForm();
   const [otherForm] = Form.useForm();
   const layout = {
     layout: 'horizontal',
-    labelCol: { span: 4, offset: 1 },
-    wrapperCol: { span: 16 },
+    labelCol: { span: 2, offset: 0 },
+    wrapperCol: { span: 20 },
   };
   // 回显表单
   useEffect(() => {
@@ -53,7 +55,7 @@ const EditForm = props => {
     submit();
   };
   return (
-    <div style={{ marginTop: '10px' }}>
+    <div className={classnames({ [styles.divbox]: true })}>
       {(nodeType === 1 || nodeType === 2) && (
         <Form
           form={form}
@@ -211,7 +213,12 @@ const EditForm = props => {
           <Item label="功能参数" name="funParam">
             <Input />
           </Item>
-          <Item wrapperCol={{ offset: 10 }} style={{ marginTop: '40px' }}>
+          <CheckList
+            info={info}
+            nodeType={nodeType}
+            valueCallback={valueCallback}
+          />
+          <Item wrapperCol={{ offset: 10 }}>
             <Button type="primary" htmlType="submit">
               提交
             </Button>

src/pages/mobileConfig/menuconfig/miniMenu.jsx

@@ -146,10 +146,10 @@ const MiniMenu = props => {
       icon:
         obj.menuType !== 'MiniAppMenuThree' &&
         obj.menuType !== 'MiniAppMenu' ? (
-            <FolderFilled />
-          ) : (
-          <FileOutlined />
-          ),
+          <FolderFilled />
+        ) : (
+            <FileOutlined />
+        ),
       menuType: obj.menuType,
       children: hasChild ? obj.children.map(i => mapTree(i)) : [],
     };
@@ -600,11 +600,26 @@ const MiniMenu = props => {
         >
           菜单配置
           {nodeType ? (
-            <EditForm
-              nodeType={nodeType}
-              info={info}
-              submitCallback={editSubmitCallback}
-            />
+            <div style={{ marginTop: '10px' }}>
+              <EditForm
+                nodeType={nodeType}
+                info={info}
+                submitCallback={editSubmitCallback}
+                valueCallback={valueCallback}
+              />
+              {/* <div
+                className={classnames({
+                  [styles.rightBox]: true,
+                })}
+              >
+                关联角色
+                <CheckList
+                  info={info}
+                  nodeType={nodeType}
+                  valueCallback={valueCallback}
+                />
+              </div> */}
+            </div>
           ) : (
             <Empty
               image={Empty.PRESENTED_IMAGE_SIMPLE}
@@ -612,18 +627,6 @@ const MiniMenu = props => {
             />
           )}
         </div>
-        <div
-          className={classnames({
-            [styles.rightBox]: true,
-          })}
-        >
-          关联角色
-          <CheckList
-            info={info}
-            nodeType={nodeType}
-            valueCallback={valueCallback}
-          />
-        </div>
       </div>
     </Spin>
   );

src/pages/mobileConfig/menuconfig/miniMenu.less

@@ -43,11 +43,11 @@
 }
 .middle{
   min-width: 500px;
-  width: 500px;
+  width: 100%;
   min-height: 100%;
   border: 1px solid #eee;
   padding: 10px;
-  margin: 0 10px;
+  margin: 0 0 0 10px;
 }
 .title{
   display: flex;