+
+
+ {/*
+
+
+
+
+
+
+
+
+
+
+
+ {/* 主要内容区域 */}
+
+ {/* 左侧：人员资质 */}
+
+
+
+
+ {/* 中间：部门人员分布 */}
+
+
+
+
+ {/* 右侧：到期提醒 */}
+
+
+
+
+ 到期提醒
+
+
+
+
+ 沈一撒合同已到期
+
+
+
+ 赵敏敏合同临期 15 天
+
+
+
+ 赵敏敏合同临期 15 天
+
+
+
+
+ {/* 底部表格区域 */}
+
+
+
+
+
+
+ 部门
+
+
+
+
+
+ }
+ style={{ backgroundColor: '#2E4CD4', color: '#fff', borderColor: '#2E4CD4' }}
+ >
+ 新增人员
+
+ }
+ className={styles['button-style']}
+ >
+ 批量导入
+
+ }
+ className={styles['button-style']}
+ >
+ 批量导出
+
+
+
+
+
+
+
`共 ${total} 条`}
+ />
+
+
+ {modalVisible &&
}
+
+ {updateFormValues && Object.keys(updateFormValues).length ? (
+
+ ) : null}
+
+ {viewFormValues && Object.keys(viewFormValues).length ? (
+
+ ) : null}
+
+ )
+ }
+}
+
+export default PersonnelBasicInfo;
diff --git a/src/pages/hrefficiency_basicinformation/components/QualificationManagement.js b/src/pages/hrefficiency_basicinformation/components/QualificationManagement.js
new file mode 100644
index 0000000..92d836e
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/components/QualificationManagement.js
@@ -0,0 +1,743 @@
+import React, { PureComponent } from 'react';
+import {
+ DeleteOutlined,
+ EditOutlined,
+ PlusOutlined,
+ SearchOutlined,
+ RedoOutlined,
+ DownOutlined,
+ ExclamationCircleFilled,
+ UpOutlined,
+ SafetyOutlined,
+ ImportOutlined,
+ ExportOutlined,
+ UserOutlined,
+ TeamOutlined,
+ SettingOutlined,
+ FileTextOutlined,
+ ProjectOutlined,
+ WarningOutlined,
+ AlertOutlined,
+} from '@ant-design/icons';
+import { Button, Card, Divider, Dropdown, message, Modal, Popconfirm, Space, Switch, Tag, Row, Col, Tree, Progress, Input, Select } from 'antd';
+import StandardTable from '@/components/StandardTable';
+import ReactECharts from 'echarts-for-react';
+
+import { MyIcon } from "@/components/Icon"
+import style from "@/global.less";
+import StaffSheetCreateForm from '../form/BasicInfoCreateForm'; //新增表单
+import StaffSheetUpdateForm from '../form/BasicInfoUpdateForm'; //修改表单
+import StaffSheetViewForm from '../form/BasicInfoViewForm'; //查看表单
+import styles from '../BasicInformation.less';
+import datadictionary from "@/utils/dataDictionary";
+import { formatDate } from "@/utils/formatUtils";
+import { formatDictText, checkButtonAuthority } from "@/utils/globalCommon";
+
+const { confirm } = Modal;
+
+//预约类型
+const sex_type = datadictionary.sex
+const user_status = datadictionary.user_status
+const sys_user_post = datadictionary.sys_user_post
+
+const mockData = {
+ list: [
+ {
+ id: '01',
+ certificateName: '安全生产许可证',
+ certificateNumber: 'AQ103',
+ validDate: '2025-09-09',
+ status: '有效',
+ remainingDays: 15,
+ fileLink: '点击查看 PDF',
+ },
+ {
+ id: '02',
+ certificateName: '特种设备证书',
+ certificateNumber: 'AQ103',
+ validDate: '2025-09-09',
+ status: '有效',
+ remainingDays: 15,
+ fileLink: '点击查看 PDF',
+ },
+ {
+ id: '03',
+ certificateName: '安全许可证书',
+ certificateNumber: 'AQ103',
+ validDate: '2025-09-09',
+ status: '即将到期',
+ remainingDays: 15,
+ fileLink: '点击查看 PDF',
+ },
+ {
+ id: '04',
+ certificateName: '安全生产许可证',
+ certificateNumber: 'AQ103',
+ validDate: '2025-09-09',
+ status: '即将到期',
+ remainingDays: 15,
+ fileLink: '点击查看 PDF',
+ },
+ {
+ id: '05',
+ certificateName: '安全生产许可证',
+ certificateNumber: 'AQ103',
+ validDate: '2025-09-09',
+ status: '异常',
+ remainingDays: 15,
+ fileLink: '点击查看 PDF',
+ },
+ ],
+ pagination: {
+ total: 48,
+ current: 1,
+ pageSize: 5,
+ },
+}
+
+class QualificationManagement extends PureComponent {
+ state = {
+ modalVisible: false,
+ updateModalVisible: false,
+ viewModalVisible: false,
+ expandForm: false,
+ selectedRows: [],
+ formValues: {},
+ updateFormValues: {},
+ viewFormValues: {},
+ toggleExpand: false,
+ }
+
+ columns = [
+ {
+ title: '序号',
+ dataIndex: 'id',
+ key: 'id',
+ width: 60,
+ fixed: 'left',
+ render: (text) => (
+
{text}
+ ),
+ },
+ {
+ title: '证书名称',
+ dataIndex: 'certificateName',
+ key: 'certificateName',
+ width: 150,
+ fixed: 'left',
+ render: (text) => (
+
{text}
+ ),
+ },
+ {
+ title: '编号',
+ dataIndex: 'certificateNumber',
+ key: 'certificateNumber',
+ width: 120,
+ render: (text) => (
+
{text}
+ ),
+ },
+ {
+ title: '有效期',
+ dataIndex: 'validDate',
+ key: 'validDate',
+ width: 100,
+ render: (text) => (
+
{text}
+ ),
+ },
+ {
+ title: '状态',
+ dataIndex: 'status',
+ key: 'status',
+ width: 100,
+ render: (text) => {
+ let color = '#2E4CD4';
+ let bgColor = '#E6E9FB';
+ if (text === '即将到期') {
+ color = '#FF8800';
+ bgColor = '#FFF3E9';
+ } else if (text === '异常') {
+ color = '#FF3E48';
+ bgColor = '#FFE0E2';
+ }
+ return (
+
+ {text}
+
+ );
+ },
+ },
+ {
+ title: '预警信息',
+ dataIndex: 'remainingDays',
+ key: 'remainingDays',
+ width: 100,
+ render: (text) => (
+
{text} 天
+ ),
+ },
+ {
+ title: '关联文件链接',
+ dataIndex: 'fileLink',
+ key: 'fileLink',
+ width: 120,
+ render: (text, record) => (
+
{text}
+ ),
+ },
+ // {
+ // title: '操作',
+ // fixed: 'right',
+ // align: 'center',
+ // width: 200,
+ // render: (text, record) => {
+ // return (
+ //
+ // )
+ // }
+ // },
+ ]
+
+ getPieChartOption = () => {
+ return {
+ tooltip: {
+ trigger: 'item',
+ formatter: '{a}
{b}: {c}% ({d}%)'
+ },
+ legend: {
+ orient: 'vertical',
+ right: '0',
+ top: '25%',
+ itemWidth: 16,
+ itemHeight: 4,
+ itemGap: 16,
+ textStyle: {
+ fontSize: 12,
+ color: '#666',
+ fontWeight: 'normal'
+ }
+ },
+ series: [
+ {
+ name: '证照类型分布',
+ type: 'pie',
+ radius: ['30%', '45%'],
+ center: ['30%', '40%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: false
+ },
+ emphasis: {
+ scale: true,
+ scaleSize: 5
+ },
+ labelLine: {
+ show: false
+ },
+ data: [
+ {
+ value: 45,
+ name: '安全生产许可证',
+ itemStyle: {
+ color: '#4B69F1'
+ }
+ },
+ {
+ value: 20,
+ name: '安全评价报告',
+ itemStyle: {
+ color: '#44BB5F'
+ }
+ },
+ {
+ value: 20,
+ name: '施工资质证书',
+ itemStyle: {
+ color: '#A493FB'
+ }
+ },
+ {
+ value: 15,
+ name: '其他',
+ itemStyle: {
+ color: '#FFD85A'
+ }
+ }
+ ]
+ }
+ ]
+ };
+ }
+
+ getPieCertificationStatusChartOption = () => {
+ return {
+ tooltip: {
+ trigger: 'item',
+ formatter: '{b}: {c}% ({d}%)'
+ },
+ legend: {
+ orient: 'vertical',
+ right: '20%',
+ top: '25%',
+ itemWidth: 16,
+ itemHeight: 4,
+ itemGap: 16,
+ textStyle: {
+ fontSize: 12,
+ color: '#666'
+ }
+ },
+ series: [
+ {
+ name: '证照状态分布',
+ type: 'pie',
+ radius: '45%',
+ center: ['30%', '40%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: true,
+ position: 'inside',
+ formatter: '{d}%',
+ fontSize: 12,
+ // fontWeight: 'bold',
+ color: '#fff'
+ },
+ emphasis: {
+ scale: true,
+ scaleSize: 5
+ },
+ labelLine: {
+ show: false
+ },
+ data: [
+ {
+ value: 40,
+ name: '有效',
+ itemStyle: {
+ color: '#1269FF'
+ }
+ },
+ {
+ value: 25,
+ name: '临期 30 天',
+ itemStyle: {
+ color: '#6E86F4'
+ }
+ },
+ {
+ value: 25,
+ name: '临期 15 天',
+ itemStyle: {
+ color: '#A3B3F8'
+ }
+ },
+ {
+ value: 10,
+ name: '异常',
+ itemStyle: {
+ color: '#C6D0FB'
+ }
+ }
+ ]
+ }
+ ]
+ };
+ }
+
+ handleStandardTableChange = (pagination, sorter) => {
+ const { dispatch } = this.props
+ const { formValues } = this.state
+
+ const params = {
+ currentPage: pagination.current,
+ pageSize: pagination.pageSize,
+ ...formValues
+ }
+
+ sorter.field && (params.sorter = `${sorter.field}_${sorter.order}`)
+ }
+
+ handleFormReset = () => {
+ const { dispatch } = this.props
+ this.setState({
+ formValues: {}
+ })
+ }
+
+ toggleForm = () => {
+ const { expandForm } = this.state
+ this.setState({
+ expandForm: !expandForm
+ })
+ }
+
+ handleSelectRows = rows => {
+ this.setState({
+ selectedRows: rows
+ })
+ }
+
+ handleSearch = values => {
+ const { dispatch } = this.props
+ const { expandForm } = this.state
+
+ this.setState({
+ formValues: values
+ })
+ }
+
+ handleModalVisible = flag => {
+ this.setState({
+ modalVisible: !!flag
+ })
+ }
+
+ handleUpdateModalVisible = (flag, record) => {
+ this.setState({
+ updateModalVisible: !!flag,
+ updateFormValues: record || {}
+ })
+ }
+
+ handleViewModalVisible = (flag, record) => {
+ this.setState({
+ viewModalVisible: !!flag,
+ viewFormValues: record || {}
+ })
+ }
+
+ handleAdd = fields => {
+ const { dispatch } = this.props
+ // 添加逻辑
+ }
+
+ handleDeleteRecord = record => {
+ const { dispatch } = this.props
+ // 删除逻辑
+ }
+
+ handleUpdate = fields => {
+ const { dispatch } = this.props
+ // 更新逻辑
+ }
+
+ handleCollapse = () => {
+ const { toggleExpand } = this.state
+ this.setState({
+ toggleExpand: !toggleExpand
+ })
+ }
+
+ render() {
+ const {
+ loading,
+ dispatch
+ } = this.props
+ const {
+ selectedRows,
+ modalVisible,
+ updateModalVisible,
+ viewModalVisible,
+ updateFormValues,
+ viewFormValues,
+ toggleExpand,
+ } = this.state
+
+ const parentMethods = {
+ handleAdd: this.handleAdd,
+ handleModalVisible: this.handleModalVisible,
+ dispatch: dispatch,
+ loading,
+ }
+
+ const updateMethods = {
+ handleUpdateModalVisible: this.handleUpdateModalVisible,
+ handleUpdate: this.handleUpdate,
+ dispatch: dispatch,
+ loading,
+ }
+
+ const viewMethods = {
+ handleViewModalVisible: this.handleViewModalVisible
+ }
+
+ return (
+
+ {/* 主要内容区域 */}
+
+ {/* 左侧：证照类型分布 */}
+
+
+
+
+ {/* 中间：证照状态分布 */}
+
+
+
+
+ {/* 右侧：临期预警 */}
+
+
+ {/* 添加半透明覆盖层以增强内容可读性 */}
+
+
+
+
+ 临期预警
+
+
+ {/* 证照预警列表 */}
+
+ {[
+ { name: '安全生产许可证', code: 'AQXK-2023-0552', status: '15天后到期', backgroundColor: '#FFF9F4', borderColor: '#FFD7BB', backgroundColorDate: '#FFEDDE', color: '#FF8800' },
+ { name: '安全生产许可证', code: 'AQXK-2023-0552', status: '15天后到期', backgroundColor: '#FFF9F4', borderColor: '#FFD7BB', backgroundColorDate: '#FFEDDE', color: '#FF8800' },
+ { name: '安全生产许可证', code: 'AQXK-2023-0552', status: '5天后到期', backgroundColor: '#FFF5F6', borderColor: '#FFC0BF', backgroundColorDate: '#FFE0E2', color: '#FF2526' }
+ ].map((item, index) => (
+
+
+
+ {item.name}
+
+
+ {item.status}
+
+
+
+ 编号：{item.code}
+
+
+ ))}
+
+
+
+ {/* 底部表格区域 */}
+
+
+
+
+
+
+ 证件类型
+
+
+
+
+
+ }
+ className={styles['button-style']}
+ >
+ 批量导入
+
+ }
+ className={styles['button-style']}
+ >
+ 批量导出
+
+
+
+
+
+
+
`共 ${total} 条`}
+ />
+
+ )
+ }
+}
+
+export default QualificationManagement;
diff --git a/src/pages/hrefficiency_basicinformation/form/BasicInfoCreateForm.js b/src/pages/hrefficiency_basicinformation/form/BasicInfoCreateForm.js
new file mode 100644
index 0000000..bafac8c
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/form/BasicInfoCreateForm.js
@@ -0,0 +1,167 @@
+import { useState, useEffect } from 'react'
+import { Col, DatePicker, Form, Input, Modal, Row, Select } from 'antd'
+import SelectDeptTree from '@/components/SelectDeptTree'
+import SelectOrganTree from '@/components/SelectOrganTree'
+import datadictionary from '@/utils/dataDictionary'
+import { formatDictOptions, verifyPhone } from '@/utils/globalCommon'
+import { NumberInput } from '@/components/NumberInput'
+import styles from '../BasicInformation.less'
+import style from '@/global.less'
+import dayjs from 'dayjs'
+import { formatDate } from '@/utils/formatUtils'
+
+const { Item: FormItem } = Form
+const { TextArea } = Input
+const dictData = datadictionary
+
+//新增表单
+let getDeptTreeBySelectTree
+let getOrganTreeBySelectTree
+
+const BasicInfoCreateForm = (props => {
+ const [form] = Form.useForm()
+
+ const {
+ modalVisible,
+ handleAdd,
+ handleModalVisible,
+ loading,
+ dispatch,
+ selectDeptTree,
+ selectOrganTree
+ } = props
+
+ // 清空和初始化逻辑可保留
+ useEffect(() => {
+ form.resetFields();
+ }, [modalVisible])
+
+ const okHandle = () => {
+ form.validateFields()
+ .then(fieldsValue => {
+ form.resetFields()
+ handleAdd(fieldsValue)
+ })
+ .catch(() => { })
+ }
+
+ const afterClose = () => {
+ form.resetFields();
+ }
+
+ return (
+
handleModalVisible()}
+ afterClose={afterClose}
+ confirmLoading={loading}
+ footer={[
+ ,
+
+ ]}
+ >
+
+
+ )
+})
+
+export default BasicInfoCreateForm
diff --git a/src/pages/hrefficiency_basicinformation/form/BasicInfoUpdateForm.js b/src/pages/hrefficiency_basicinformation/form/BasicInfoUpdateForm.js
new file mode 100644
index 0000000..c9b8c90
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/form/BasicInfoUpdateForm.js
@@ -0,0 +1,149 @@
+import { useEffect } from 'react'
+import { Col, Form, Input, Modal, Row, Select } from 'antd'
+import styles from '../BasicInformation.less'
+
+const BasicInfoUpdateForm = (props => {
+ const [form] = Form.useForm()
+
+ const {
+ updateModalVisible,
+ handleUpdate,
+ handleUpdateModalVisible,
+ loading,
+ values = {}
+ } = props
+
+ useEffect(() => {
+ if (updateModalVisible) {
+ form.setFieldsValue(values)
+ }
+ }, [updateModalVisible, values, form])
+
+ const okHandle = () => {
+ form.validateFields()
+ .then(fieldsValue => {
+ form.resetFields()
+ handleUpdate(fieldsValue)
+ })
+ .catch(() => { })
+ }
+
+ const afterClose = () => {
+ form.resetFields();
+ }
+
+ return (
+
handleUpdateModalVisible()}
+ afterClose={afterClose}
+ confirmLoading={loading}
+ footer={[
+ ,
+
+ ]}
+ >
+
+
+ )
+})
+
+export default BasicInfoUpdateForm
\ No newline at end of file
diff --git a/src/pages/hrefficiency_basicinformation/form/BasicInfoViewForm.js b/src/pages/hrefficiency_basicinformation/form/BasicInfoViewForm.js
new file mode 100644
index 0000000..15f6759
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/form/BasicInfoViewForm.js
@@ -0,0 +1,52 @@
+import React from 'react';
+import { Modal, Row, Col } from 'antd';
+import styles from '../BasicInformation.less';
+
+const BasicInfoViewForm = (props) => {
+ const { viewModalVisible, handleViewModalVisible, values = {} } = props;
+
+ return (
+
handleViewModalVisible(false)}
+ >
+
+
+ 项目名称
+ {values.projectName || '-'}
+
+
+ 地理信息
+ {values.location || '-'}
+
+
+ 占地面积
+
+ {values.area ? `${values.area}` : '-'}
+
+
+
+ 职业人数
+ {values.staffCount || '-'}
+
+
+ 组织机构
+ {values.organization || '-'}
+
+
+ 安全等级
+ {values.safetyLevel || '-'}
+
+
+
+ );
+};
+
+export default BasicInfoViewForm;
\ No newline at end of file
diff --git a/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderAdvancedForm.js b/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderAdvancedForm.js
new file mode 100644
index 0000000..2625938
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderAdvancedForm.js
@@ -0,0 +1,113 @@
+import { useEffect } from 'react'
+import { Button, Col, Form, Input, Row } from 'antd'
+import { UpOutlined, SearchOutlined, RedoOutlined } from '@ant-design/icons'
+import SelectDeptTree from '@/components/SelectDeptTree'
+import SelectOrganTree from '@/components/SelectOrganTree'
+import style from '@/global.less'
+
+const { Item: FormItem } = Form
+let getDeptTreeBySelectTree
+let getOrganTreeBySelectTree
+
+const StaffSheetRenderAdvancedForm = (props) => {
+ const [form] = Form.useForm()
+ const { dispatch, handleSearch, handleFormReset, toggleForm, selectDeptTree, selectOrganTree, params } = props
+
+ useEffect(() => {
+ form.setFieldsValue({
+ user_name: params?.user_name,
+ user_name_cn: params?.user_name_cn,
+ deptname: params?.deptname,
+ orgname: params?.orgname,
+ })
+ }, [params])
+
+ const onFinish = values => {
+ // if (getDeptTreeBySelectTree) {
+ // values.dept_code = getDeptTreeBySelectTree.dept_code
+ // values.deptname = getDeptTreeBySelectTree.title
+ // }
+
+ if (getOrganTreeBySelectTree) {
+ values.org_code = getOrganTreeBySelectTree.org_code
+ values.orgname = getOrganTreeBySelectTree.title
+ }
+
+ handleSearch(values)
+ }
+
+ const myHandleFormReset = () => {
+ form.resetFields()
+ handleFormReset()
+ }
+
+ const selectedDeptTreeValue = (deptRecord) => {
+ getDeptTreeBySelectTree = deptRecord
+ }
+
+ const selectedOrganTreeValue = (orgRecord) => {
+ getOrganTreeBySelectTree = orgRecord
+ }
+
+ const parentDeptTreeMethod = {
+ dispatch: dispatch,
+ selectDeptTree: selectDeptTree,
+ selectedDeptTreeValue: selectedDeptTreeValue
+ }
+
+ const parentOrganTreeMethod = {
+ dispatch: dispatch,
+ selectOrganTree: selectOrganTree,
+ selectedOrganTreeValue: selectedOrganTreeValue
+ }
+
+ return (
+
+ )
+}
+
+export default StaffSheetRenderAdvancedForm
diff --git a/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderSimpleForm.js b/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderSimpleForm.js
new file mode 100644
index 0000000..0468e76
--- /dev/null
+++ b/src/pages/hrefficiency_basicinformation/form/StaffSheetRenderSimpleForm.js
@@ -0,0 +1,81 @@
+import { useEffect } from 'react'
+import {Button, Col, Form, Input, Row, DatePicker, Select} from 'antd'
+import {DownOutlined, RedoOutlined, SearchOutlined} from '@ant-design/icons'
+import style from '@/global.less'
+import dayjs from 'dayjs'
+const { Item: FormItem } = Form
+
+const StaffSheetRenderSimpleForm = (props) => {
+ const [form] = Form.useForm()
+ const { handleSearch, handleFormReset, toggleForm, params } = props
+
+ useEffect(() => {
+ form.setFieldsValue({
+ user_name: params?.user_name,
+ user_name_cn: params?.user_name_cn,
+ })
+ }, [params])
+
+ const onFinish = values => {
+ handleSearch(values)
+ }
+
+ const myHandleFormReset = () => {
+ form.resetFields()
+ handleFormReset()
+ }
+
+ return (
+
+ )
+}
+
+export default StaffSheetRenderSimpleForm
diff --git a/src/pages/topnavbar/TopNavBar.js b/src/pages/topnavbar/TopNavBar.js
index 9bb9798..4a52821 100644
--- a/src/pages/topnavbar/TopNavBar.js
+++ b/src/pages/topnavbar/TopNavBar.js
@@ -13,29 +13,34 @@ const menuItem = [
key: '/topnavbar00/hrefficiency',
// icon:
,
children: [
+ // {
+ // label: '工时仪表盘',
+ // key: '/topnavbar00/hrefficiency/timesheet',
+ // // icon:
,
+ // },
+ // {
+ // label: '员工仪表盘',
+ // key: '/topnavbar00/hrefficiency/staffsheet',
+ // // icon:
,
+ // },
+ // {
+ // label: '员工效率监控',
+ // key: '/topnavbar00/hrefficiency/staffuph',
+ // // icon:
,
+ // },
+ // {
+ // label: '部门效率监控',
+ // key: '/topnavbar00/hrefficiency/deptuph',
+ // // icon:
,
+ // },
+ // {
+ // label: '全员效率监控',
+ // key: '/topnavbar00/hrefficiency/allstaffuph',
+ // // icon:
,
+ // },
{
- label: '工时仪表盘',
- key: '/topnavbar00/hrefficiency/timesheet',
- // icon:
,
- },
- {
- label: '员工仪表盘',
- key: '/topnavbar00/hrefficiency/staffsheet',
- // icon:
,
- },
- {
- label: '员工效率监控',
- key: '/topnavbar00/hrefficiency/staffuph',
- // icon:
,
- },
- {
- label: '部门效率监控',
- key: '/topnavbar00/hrefficiency/deptuph',
- // icon:
,
- },
- {
- label: '全员效率监控',
- key: '/topnavbar00/hrefficiency/allstaffuph',
+ label: '安全管理基础信息',
+ key: '/topnavbar00/hrefficiency/basicinformation',
// icon:
,
},
{
-