feat: 仪表盘bug修复

src/pages/Customer/Business/index.jsx

@@ -30,13 +30,15 @@ const Business = ({ dispatch, groupList, shouldUpdate, loading }) => {
     }
     if (groupList) {
       const group = groupList[0]
-      setState({
-        ...state,
-        params: { ...state.params, businessGroupId: group.value },
-        funnelData: group.items
-          ?.filter(item => !item.endProcess)
-          ?.map(item => ({ ...item, percentage: parseInt(item.percentage, 10) }))
-      })
+      if (group) {
+        setState({
+          ...state,
+          params: { ...state.params, businessGroupId: group.value },
+          funnelData: group.items
+            ?.filter(item => !item.endProcess)
+            ?.map(item => ({ ...item, percentage: parseInt(item.percentage, 10) }))
+        })
+      }
     }
   }, [groupList])
   useEffect(() => {
@@ -147,7 +149,7 @@ const Business = ({ dispatch, groupList, shouldUpdate, loading }) => {
                 onChange={(id, option) => {
                   setState({
                     ...state,
-                    businessGroupId: id,
+                    params: { ...state.params, businessGroupId: id },
                     funnelData: option.items
                       .filter(item => !item.endProcess)
                       .map(item => ({ ...item, percentage: parseInt(item.percentage, 10) }))

src/pages/Customer/Client/components/AddClient/index.jsx

@@ -61,7 +61,7 @@ const AddClient = props => {
         label="联系人地区"
         name="district"
         rules={[{ required: true, message: '请选择地区' }, { validator: validCascaderRule }]}>
-        <LazyCascader />
+        <LazyCascader showFooter={true} />
       </Form.Item>
       <Row>
         <Col span={12}>

src/pages/Customer/Client/index.jsx

@@ -433,8 +433,9 @@ const Client = props => {
   }
 
   const onDistrictChange = value => {
+    if (!value) return
     tRef.current.reset()
-    const [province = '', city = '', area = ''] = value
+    const [province = '', city = '', area = ''] = value || []
     setState({ ...state, params: { ...state.params, province, city, area } })
   }
 

src/pages/Customer/Company/components/AddCompany/index.jsx

@@ -77,7 +77,7 @@ const AddCompanyModal = ({ dataId, dataType, onConfirm, dispatch, natures }) =>
         label="客户地区"
         required={true}
         rules={[{ validator: validCascaderRule }]}>
-        <LazyCascader />
+        <LazyCascader showFooter={true} />
       </Form.Item>
       <ProFormText
         name="phone"

src/pages/Customer/Company/index.jsx

@@ -123,6 +123,7 @@ const Company = props => {
     setState({ ...state, params: { ...state.params, search: value } })
   }
   const onDistrictChange = value => {
+    if (!value) return
     tRef.current.reset()
     const [province = '', city = '', area = ''] = value
     setState({ ...state, params: { ...state.params, province, city, area } })

src/pages/workbench/Dashboard/index.jsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useRef } from 'react'
 import ProTable from '@ant-design/pro-table'
 import { connect, useModel } from 'umi'
 import { Row, Col, Select, Card, Skeleton } from 'antd'
@@ -12,9 +12,11 @@ import LeaderBoard from './components/LeaderBoard'
 import { cyclicalOp } from './consts'
 
 const Dashboard = ({ dispatch, groupList = [] }) => {
+  const timer = useRef(null)
   const { initialState: { permData } = { permData: {} } } = useModel('@@initialState')
   const [state, setState] = useState({
     loading: true,
+    immediate: false,
     visible: false,
     reminderData: [],
     leaderboard: [],
@@ -24,7 +26,7 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
     serviceLogChainRatio: {},
     aggregation: {},
     businessChar: {},
-    params: { businessGroupId: null, dataPermission: 'oneself', cyclical: 'month' }
+    params: { businessGroupId: '', dataPermission: 'oneself', cyclical: 'month' }
   })
   const { toggleModal, setModalProps } = useModal()
   // 展示服务弹窗详情
@@ -37,6 +39,7 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
     toggleModal()
   }
   const initData = async payload => {
+    if (timer.current) clearTimeout(timer.current)
     const {
       code = -1,
       data: {
@@ -51,10 +54,11 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
       }
     } = await queryDashboard(payload)
     if (code === consts.RET_CODE.SUCCESS) {
-      setTimeout(() => {
+      if (state.immediate) {
         setState({
           ...state,
           loading: false,
+          immediate: false,
           reminderData,
           leaderboard,
           clientChainRatio,
@@ -64,7 +68,22 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
           aggregation,
           businessChar
         })
-      }, 1000)
+      } else {
+        timer.current = setTimeout(() => {
+          setState({
+            ...state,
+            loading: false,
+            reminderData,
+            leaderboard,
+            clientChainRatio,
+            customerChainRatio,
+            businessChainRatio,
+            serviceLogChainRatio,
+            aggregation,
+            businessChar
+          })
+        }, 1000)
+      }
     }
   }
   useEffect(() => {
@@ -78,8 +97,8 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
     }
   }, [groupList])
   useEffect(() => {
-    state.params.businessGroupId && initData(state.params)
-  }, [state.params.businessGroupId, state.params.cyclical, state.params.dataPermission])
+    initData(state.params)
+  }, [state.params.businessGroupId, state.params.dataPermission, state.params.cyclical])
   const columns = [
     {
       title: '超过周期未服务提醒',
@@ -221,17 +240,23 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
       </div>
       <div className="mt-4">
         <Select
+          loading={state.loading}
           options={permData?.workbench || []}
           dropdownMatchSelectWidth={false}
           defaultValue="oneself"
-          onChange={e => setState({ ...state, params: { ...state.params, dataPermission: e } })}
+          onChange={e =>
+            setState({ ...state, immediate: true, params: { ...state.params, dataPermission: e } })
+          }
         />
         <span className="ml-4">
           <Select
+            loading={state.loading}
             options={cyclicalOp}
             dropdownMatchSelectWidth={false}
             defaultValue="month"
-            onChange={e => setState({ ...state, params: { ...state.params, cyclical: e } })}
+            onChange={e =>
+              setState({ ...state, immediate: true, params: { ...state.params, cyclical: e } })
+            }
           />
         </span>
       </div>
@@ -406,10 +431,8 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
               }>
               {char && thread && <DualAxes {...config} />}
             </Card>
-            {/* <div className="p-4 bg-white border rounded-lg shadow-card"> */}
-            {/* <Divider /> */}
-            {/* </div> */}
           </Col>
+
           <Col className="gutter-row" span={8}>
             <Card
               headStyle={{ padding: '0 12px' }}
@@ -437,11 +460,9 @@ const Dashboard = ({ dispatch, groupList = [] }) => {
         </Row>
       </div>
       <div className="mt-4">
-        <Row gutter={16}>
+        <Row gutter={24}>
           <Col className="gutter-row" span={12}>
-            {/* <div className="bg-white border rounded-lg shadow-card"> */}
             <LeaderBoard dataList={state.leaderboard} loading={state.loading} />
-            {/* </div> */}
           </Col>
         </Row>
       </div>