feat: 考勤加班设置

config/routes.ts

@@ -47,5 +47,22 @@
         access: 'authRouteFilter'
       }
     ]
+  },
+  {
+    path: '/business',
+    name: 'business',
+    icon: 'down',
+    routes: [
+      {
+        path: '/business',
+        redirect: '/business/attendance'
+      },
+      {
+        path: '/business/attendance',
+        name: 'attendance',
+        component: './Business/Attendance',
+        access: 'authRouteFilter'
+      }
+    ]
   }
 ]

src/locales/zh-CN/menu.ts

@@ -7,6 +7,8 @@ export default {
   'menu.role': '角色权限管理',
   'menu.role.system': '系统管理',
   'menu.role.customer': '客户',
+  'menu.business': '业务参数',
+  'menu.business.attendance': '考勤',
   'menu.login': '登录',
   'menu.register': '注册',
   'menu.register.result': '注册结果',
@@ -51,5 +53,5 @@ export default {
   'menu.editor': '图形编辑器',
   'menu.editor.flow': '流程编辑器',
   'menu.editor.mind': '脑图编辑器',
-  'menu.editor.koni': '拓扑编辑器',
-};
+  'menu.editor.koni': '拓扑编辑器'
+}

src/pages/Business/Attendance/components/AttendanceMenu/attendanceMenu.tsx

@@ -0,0 +1,24 @@
+import React from 'react'
+import '@/pages/Role/System/components/RoleMenu/index.less'
+
+const attendanceMenu = () => {
+  return (
+    <div className="h-full w-max-234px rounded-4px roleMenu">
+      <div className="p-4 border-b-1 border-solid border-black border-opacity-10 bg-[#f7f9fa] justify-around text-left">
+        <span>栏目/功能</span>
+      </div>
+      <div className="p-4 bg-white" style={{ height: 'calc(100% - 1rem*2 - 20px)' }}>
+        <ul className="p-0 m-0 list-none text-primary flex flex-col flex-1">
+          <li
+            className={
+              'flex justify-between items-center py-2 px-5 cursor-pointer scale-up-center'
+            }>
+            加班申请人
+          </li>
+        </ul>
+      </div>
+    </div>
+  )
+}
+
+export default attendanceMenu

src/pages/Business/Attendance/index.tsx

@@ -0,0 +1,83 @@
+import React, { useState, useEffect } from 'react'
+import AttendanceMenu from '../Attendance/components/AttendanceMenu/attendanceMenu'
+import { useRequest } from 'umi'
+import Icon from '@/components/IconPark'
+import ConnectModal from '@/pages/Role/System/components/ConnectModal'
+import { Table } from 'antd'
+
+const Attendance = () => {
+  const columns = [
+    {
+      title: '申请人名称',
+      dataIndex: 'applicantStaffName',
+      width: '20%'
+    },
+    {
+      title: '申请对象',
+      dataIndex: 'staff',
+      align: 'left',
+      width: '50%',
+      render: () => (
+        <span className="hover:text-hex-e7026e">
+          <Icon type="plus" fill="#fd3995" />
+        </span>
+      )
+    },
+    {
+      title: '操作',
+      dataIndex: 'opreate',
+      width: '20%',
+      render: () => (
+        <span className="hover:text-hex-e7026e">
+          <Icon type="delete" fill="#fd3995" />
+        </span>
+      )
+    }
+  ]
+  const [state, setState] = useState({
+    id: '',
+    attendanceList: []
+  })
+
+  const { run: tryGetRoleStaffList } = useRequest((id: string) => fetchAttendanceList({ id }), {
+    manual: true,
+    onSuccess: result => {
+      setState({ ...state, attendanceList: result })
+    }
+  })
+  useEffect(() => {
+    if (state.id) {
+      tryGetRoleStaffList(state.id)
+    }
+    return () => {
+      // formRef.current?.resetFields()
+    }
+  }, [state.id])
+
+  return (
+    <div className="h-full w-full flex flex-row">
+      <AttendanceMenu />
+      <div className="w-max-3/4">
+        <div className="ml-8 bg-white p-4 shadow-md shadow-hex-3e2c5a relative">
+          <div className="absolute right-4 top-4 z-100">
+            {state.id && (
+              <ConnectModal
+                title="添加新申请人"
+                dataId={state.id}
+                onSelect={() => tryGetRoleStaffList(state.id)}
+              />
+            )}
+          </div>
+          <Table
+            bordered
+            title={() => '加班申请人'}
+            columns={columns}
+            dataSource={state.attendanceList}
+          />
+        </div>
+      </div>
+    </div>
+  )
+}
+
+export default Attendance

src/pages/Business/index.tsx

@@ -0,0 +1,11 @@
+import React from 'react'
+
+const Business = () => {
+  return (
+    <div>
+      <span>参数设置</span>
+    </div>
+  )
+}
+
+export default Business

src/pages/Role/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react'
 
-const index = () => {
+const Role = () => {
   return (
     <div>
       <h2>角色权限管理</h2>
@@ -8,4 +8,4 @@ const index = () => {
   )
 }
 
-export default index
+export default Role

src/services/user/system.ts

@@ -4,3 +4,10 @@ import { request } from 'umi'
 export async function queryRoleStaffList() {
   return request<API.RoleStaffListItem[]>('/role/staff')
 }
+
+/** 获取加班申请人列表 */
+export async function fetchAttendanceList(params: API.GetStaffListParams) {
+  return request<API.AttendanceItem[]>('/attendance/list', {
+    params
+  })
+}

src/services/user/typings.d.ts

@@ -180,4 +180,11 @@ declare namespace API {
     permission: string | null
     dataPermission: string | null
   }
+
+  type AttendanceItem = {
+    id: string
+    applicantStaffId: string
+    applicantStaffName: string
+    staff: any[]
+  }
 }