fix: 调整角色权限-功能权限提交按钮为固钉

src/pages/Permission/Role/components/PermTabs/index.tsx

@@ -1,4 +1,4 @@
-import { Card, Tabs, Checkbox, Button, message, Spin } from 'antd'
+import { Card, Tabs, Checkbox, Button, message, Spin, Affix } from 'antd'
 import React, { useState } from 'react'
 import { queryRoleDetailByID, setRolePermission } from '@/services/permission'
 import { useRequest } from '@umijs/max'
@@ -18,6 +18,7 @@ export enum OperationType {
 }
 const PermTabs: React.FC<PermTabsProps> = ({ currentPermData: { ID, roleType } }) => {
   const [state, setState] = useState({
+    activeTab: OperationType.FRONT, // 默认激活的tab
     frontPermission: [], // 前台权限
     backstagePermission: [] // 后台权限
   })
@@ -56,26 +57,20 @@ const PermTabs: React.FC<PermTabsProps> = ({ currentPermData: { ID, roleType } }
       })
     }
   }
-  const handleSubmitFront = () => {
-    trySetRolePermission({
-      ID,
-      operation: OperationType.FRONT,
-      frontPermission: state.frontPermission
-    })
-  }
-
-  const handleSubmitBackstage = () => {
-    trySetRolePermission({
-      ID,
-      operation: OperationType.BACKSTAGE,
-      backstagePermission: state.backstagePermission
-    })
+  const handleSubmit = () => {
+    const params = { ID, operation: state.activeTab }
+    if (state.activeTab === OperationType.FRONT) {
+      params.frontPermission = state.frontPermission
+    } else {
+      params.backstagePermission = state.backstagePermission
+    }
+    trySetRolePermission(params)
   }
 
   return (
     <div>
-      <Tabs type="card">
-        <TabPane tab="前台" key="3" className="tab-height overflow-y-auto">
+      <Tabs type="card" onChange={tab => setState({ ...state, activeTab: tab })}>
+        <TabPane tab="前台" key={OperationType.FRONT} className="tab-height overflow-y-auto">
           <Spin spinning={loading}>
             <div className="shadow-md mb-4">
               <Card size="small" type="inner" title="待办列表">
@@ -232,11 +227,8 @@ const PermTabs: React.FC<PermTabsProps> = ({ currentPermData: { ID, roleType } }
               </Card>
             </div>
           </Spin>
-          <Button type="primary" onClick={handleSubmitFront} loading={submitStauts}>
-            提交
-          </Button>
         </TabPane>
-        <TabPane tab="后台" key="4" className="tab-height overflow-y-auto">
+        <TabPane tab="后台" key={OperationType.BACKSTAGE} className="tab-height overflow-y-auto">
           <Spin spinning={loading}>
             <div className="shadow-md mb-4">
               <Card size="small" type="inner" title="项目审批设置">
@@ -507,16 +499,13 @@ const PermTabs: React.FC<PermTabsProps> = ({ currentPermData: { ID, roleType } }
               </Card>
             </div>
           </Spin>
-          <Button type="primary" onClick={handleSubmitBackstage} loading={submitStauts}>
-            提交
-          </Button>
         </TabPane>
       </Tabs>
-      {/* <Affix offsetBottom={10}>
+      <Affix offsetBottom={10}>
         <Button type="primary" onClick={handleSubmit} loading={submitStauts}>
           提交
         </Button>
-      </Affix> */}
+      </Affix>
     </div>
   )
 }