feat: 111

src/pages/Statistic/Software/Usage/index.jsx

@@ -1,27 +1,53 @@
-import { useState, useEffect, useMemo } from 'react'
+import { useState, useEffect, useRef, useMemo } from 'react'
 import BasicTable from '@/components/Table'
-import { Select } from 'antd'
-import { queryDepartmentAndStaffWithOptionId } from '@/services/statistic'
+import { Select, TreeSelect } from 'antd'
+import { querySoftwareUsageList, queryUsageSelectOptions } from '@/services/statistic'
+import consts from '@/consts'
+
+const opMap = {
+  STAFF: 'staff',
+  DEPARTMENT: 'department'
+}
 
 const Usage = () => {
+  const tRef = useRef(null)
   const [state, setState] = useState({
-    op: 'staff',
-    opIds: []
+    optionType: 'staff',
+    opIds: [],
+    department: null,
+    staff: null
   })
 
-  const queryStaffAndDepartment = async params => {
-    queryDepartmentAndStaffWithOptionId(params)
+  const queryStaffAndDepartment = async () => {
+    const { code = -1, data: { department = [], staff = [] } = {} } =
+      await queryUsageSelectOptions()
+    if (code === consts.RET_CODE.SUCCESS) {
+      setState({
+        ...state,
+        department,
+        staff
+      })
+    }
   }
 
+  const mainParams = useMemo(() => {
+    const p = { optionType: state.optionType }
+    if (state.optionType === opMap.STAFF) {
+      p.staffIds = state.opIds
+    } else {
+      p.departmentIds = state.opIds
+    }
+    return p
+  }, [state.optionType, state.opIds])
   useEffect(() => {
     queryStaffAndDepartment()
   }, [])
-  useEffect(() => {
-    // 重新发起请求
-  }, [state.op])
+  // useEffect(() => {
+  //   // 重新发起请求
+  // }, [state.op])
   const columns = [
     {
-      title: 'Name',
+      title: '',
       dataIndex: 'name',
       key: 'name',
       width: 100,
@@ -32,8 +58,8 @@ const Usage = () => {
       children: [
         {
           title: '生成',
-          key: 'receive',
-          dataindex: 'receive'
+          key: 'create',
+          dataindex: 'create'
         },
         {
           title: '接受',
@@ -47,38 +73,71 @@ const Usage = () => {
       children: [
         {
           title: '借出',
-          key: 'receive',
-          dataindex: 'receive'
+          key: 'lend',
+          dataindex: 'lend'
         },
         {
           title: '销售',
-          key: 'receive',
-          dataindex: 'receive'
+          key: 'sales',
+          dataindex: 'sales'
         },
         {
           title: '赠送',
-          key: 'receive',
-          dataindex: 'receive'
+          key: 'gifts',
+          dataindex: 'gifts'
         }
       ]
     }
   ]
-  const options = useMemo(() => {}, [state.op])
-  const handleOnOpIdsChange = () => {}
 
+  console.log(state.staff)
   return (
     <div>
       <div>
         <Select
+          defaultValue="staff"
           options={[
             { label: '部门', value: 'department' },
             { label: '员工', value: 'staff' }
           ]}
-          onChange={val => setState({ ...state, op: val })}
+          onChange={val => setState({ ...state, optionType: val })}
         />
-        <Select className="ml-2" options={options} mode="multiple" onChange={handleOnOpIdsChange} />
+        {(state.department || state.staff) && state.optionType === opMap.STAFF ? (
+          <Select
+            className="min-w-120px"
+            dropdownMatchSelectWidth
+            options={state.staff.map(item => ({ label: item.username, value: item.id }))}
+            mode="multiple"
+            onChange={value => setState({ ...state, opIds: value })}
+          />
+        ) : (
+          <TreeSelect
+            treeData={state.department}
+            className="min-w-120px"
+            dropdownMatchSelectWidth
+            multiple
+            onChange={value => setState({ ...state, opIds: value })}
+          />
+        )}
       </div>
-      <BasicTable columns={columns} search={false} />
+      <BasicTable
+        manualRequest={true}
+        columns={columns}
+        actionRef={tRef}
+        params={mainParams}
+        request={async (params, sort, filter) => {
+          const {
+            code = -1,
+            data: { list, sum, chart, create }
+          } = await querySoftwareUsageList({ ...params, ...sort, ...filter })
+          setState({ ...state, sum, chart, create })
+          return {
+            data: list,
+            success: code === consts.RET_CODE.SUCCESS,
+            total: list?.length || 0
+          }
+        }}
+      />
     </div>
   )
 }

src/services/statistic.js

@@ -1,8 +1,13 @@
 import request from '@/basic/utils/request'
 
-/** 获取部门/员工下的列表 */
-export async function queryDepartmentAndStaffWithOptionId(params = { option: 'staff' }) {
-  return request('', {
-    params
+/** 获取软件锁统计选项部门/员工下的列表 */
+export async function queryUsageSelectOptions() {
+  return request('/statistic/select/option')
+}
+
+/** 获取软件锁使用统计 */
+export async function querySoftwareUsageList(params) {
+  return request.post('/statistic/software/usage', {
+    data: params
   })
 }