Przeglądaj źródła

feat: 仪表盘加入自定义数据权限功能

lanjianrong 5 lat temu
rodzic
commit
a49305c7cc

+ 2 - 1
src/pages/Customer/Company/components/PermSelect.jsx

@@ -10,7 +10,7 @@ export const PermDataTypeEunm = {
   WORKBENCH: 'workbench'
 }
 
-const PermSelect = ({ dataType, onConfirm }) => {
+const PermSelect = ({ dataType, onConfirm, ...resetProps }) => {
   const { initialState: { permData } = { permData: {} } } = useModel('@@initialState')
   const { toggleModal, setModalProps } = useModal()
   const options = [...(permData[dataType] || [])]
@@ -19,6 +19,7 @@ const PermSelect = ({ dataType, onConfirm }) => {
   }
   return (
     <Select
+      {...resetProps}
       defaultValue="oneself"
       dropdownMatchSelectWidth={false}
       onChange={e => {

+ 37 - 20
src/pages/workbench/Dashboard/index.jsx

@@ -1,6 +1,5 @@
 import React, { useState, useEffect, useRef } from 'react'
 import ProTable from '@ant-design/pro-table'
-import { useModel } from 'umi'
 import { Row, Col, Select, Card, Skeleton } from 'antd'
 import { AddressBook, City, Finance, Comment } from '@icon-park/react'
 import consts from '@/consts'
@@ -12,12 +11,13 @@ import SoftLeaderboard from './components/SoftLeaderboard'
 import { cardTypeMap, cyclicalOp } from './consts'
 import BusinessChar from './components/BusinessChar'
 import RatioPanels from './components/RatioPanels'
+import PermSelect from '@/pages/Customer/Company/components/PermSelect'
 
 const Dashboard = () => {
   const timer = useRef(null)
-  const { initialState: { permData } = { permData: {} } } = useModel('@@initialState')
   const [state, setState] = useState({
     loading: true,
+    staffIds: null,
     immediate: false,
     visible: false,
     reminderData: [],
@@ -88,23 +88,23 @@ const Dashboard = () => {
           aggregation,
           businessChar
         })
-      } else {
-        timer.current = setTimeout(() => {
-          setState({
-            ...state,
-            loading: false,
-            reminderData,
-            leaderboard,
-            productLeaderBoard,
-            clientChainRatio,
-            customerChainRatio,
-            businessChainRatio,
-            serviceLogChainRatio,
-            aggregation,
-            businessChar
-          })
-        }, 1000)
+        return
       }
+      timer.current = setTimeout(() => {
+        setState({
+          ...state,
+          loading: false,
+          reminderData,
+          leaderboard,
+          productLeaderBoard,
+          clientChainRatio,
+          customerChainRatio,
+          businessChainRatio,
+          serviceLogChainRatio,
+          aggregation,
+          businessChar
+        })
+      }, 1000)
     }
   }
 
@@ -187,6 +187,22 @@ const Dashboard = () => {
   const handleChangeGroupId = e =>
     setState({ ...state, immediate: true, params: { ...state.params, businessGroupId: e } })
 
+  // 处理权限Select下拉组件OnChange事件
+  const handlePermChange = ({ staffIds = [], dataPermission }) => {
+    if (staffIds?.length) {
+      setState({
+        ...state,
+        immediate: true,
+        params: { ...state.params, staffIds, dataPermission: null }
+      })
+      return
+    }
+    setState({
+      ...state,
+      immediate: true,
+      params: { ...state.params, staffIds: null, dataPermission }
+    })
+  }
   return (
     <div>
       <div className="shadow-card">
@@ -207,7 +223,8 @@ const Dashboard = () => {
         />
       </div>
       <div className="mt-4">
-        <Select
+        <PermSelect loading={state.loading} onConfirm={handlePermChange} dataType="workbench" />
+        {/* <Select
           loading={state.loading}
           options={permData?.workbench || []}
           dropdownMatchSelectWidth={false}
@@ -215,7 +232,7 @@ const Dashboard = () => {
           onChange={e =>
             setState({ ...state, immediate: true, params: { ...state.params, dataPermission: e } })
           }
-        />
+        /> */}
         <span className="ml-4">
           <Select
             loading={state.loading}