feat: 仪表盘

src/pages/workbench/Dashboard/index.jsx

@@ -1,38 +1,58 @@
-import React from 'react'
+import React, { useState, useEffect } from 'react'
 import ProTable from '@ant-design/pro-table'
 import { Row, Col, List, Divider, Select } from 'antd'
 import { DualAxes } from '@ant-design/charts'
+import consts from '@/consts'
+import { queryDashboard } from '@/services/dashboard'
 
 const Dashboard = () => {
   const { Option } = Select
+  const [state, setState] = useState({
+    reminderData: [],
+    leaderboard: []
+  })
+  const initData = async payload => {
+    const {
+      code = -1,
+      data: { reminderData = [], leaderboard = [] } = { reminderData: [], leaderboard: [] }
+    } = await queryDashboard(payload)
+    if (code === consts.RET_CODE.SUCCESS) {
+      setState({ ...state, data: reminderData, leaderboard })
+    }
+    console.log(reminderData)
+    console.log(leaderboard)
+  }
+  useEffect(() => {
+    initData()
+  }, [])
   const columns = [
     {
       title: '超过周期未服务提醒',
-      dataIndex: 'search'
+      dataIndex: 'name'
     },
     {
       title: '7天',
-      dataIndex: 'search'
+      dataIndex: 'day7'
     },
     {
       title: '15天',
-      dataIndex: 'search'
+      dataIndex: 'day15'
     },
     {
       title: '30天',
-      dataIndex: 'search'
+      dataIndex: 'day30'
     },
     {
       title: '3个月',
-      dataIndex: 'search'
+      dataIndex: 'month3'
     },
     {
       title: '6个月',
-      dataIndex: 'search'
+      dataIndex: 'month6'
     },
     {
       title: '提醒逾期',
-      dataIndex: 'search'
+      dataIndex: 'remind'
     }
   ]
   const columnsCustomer = [
@@ -42,11 +62,11 @@ const Dashboard = () => {
     },
     {
       title: '姓名',
-      dataIndex: 'search'
+      dataIndex: 'staff_name'
     },
     {
       title: '新增客户数',
-      dataIndex: 'search'
+      dataIndex: 'count'
     }
   ]
   const uvBillData = [
@@ -153,7 +173,13 @@ const Dashboard = () => {
   return (
     <div>
       <div>
-        <ProTable columns={columns} search={false} toolBarRender={false} />
+        <ProTable
+          columns={columns}
+          dataSource={state.reminderData}
+          search={false}
+          toolBarRender={false}
+          pagination={false}
+        />
       </div>
       <div className="mt-4">
         <Row gutter={16}>
@@ -267,7 +293,13 @@ const Dashboard = () => {
                 </div>
               </div>
               <div className="text-center">新增客户排行榜</div>
-              <ProTable columns={columnsCustomer} search={false} toolBarRender={false} />
+              <ProTable
+                columns={columnsCustomer}
+                dataSource={state.leaderboard}
+                search={false}
+                toolBarRender={false}
+                pagination={false}
+              />
             </div>
           </Col>
         </Row>

src/services/dashboard.js

@@ -0,0 +1,13 @@
+import request from '@/basic/utils/request'
+
+/**
+ * 获取仪表盘数据
+ * @param {*} payload
+ * @returns 结果集
+ */
+export async function queryDashboard(payload) {
+  const data = await request.get('/dashboard/list', {
+    params: { ...payload }
+  })
+  return data
+}