diff --git a/src/pages/hrefficiency_timesheet/TimeSheetList.js b/src/pages/hrefficiency_timesheet/TimeSheetList.js
index a5fd8b1..ce46aa9 100644
--- a/src/pages/hrefficiency_timesheet/TimeSheetList.js
+++ b/src/pages/hrefficiency_timesheet/TimeSheetList.js
@@ -12,7 +12,6 @@ import {
import {connect, history} from '@umijs/max';
import {Button, Card, Divider, Dropdown, message, Modal, Popconfirm, Space, Switch, Tag,Row,Col} from 'antd';
import StandardTable from '@/components/StandardTable';
-
import { MyIcon } from "@/components/Icon"
import style from "@/global.less";
import TimeSheetCreateForm from './form/TimeSheetCreateForm'; //新增表单
diff --git a/src/pages/staffmanage_staffinfo/StaffInfo.js b/src/pages/staffmanage_staffinfo/StaffInfo.js
index 5641bc7..1739111 100644
--- a/src/pages/staffmanage_staffinfo/StaffInfo.js
+++ b/src/pages/staffmanage_staffinfo/StaffInfo.js
@@ -1,35 +1,32 @@
-import React, { PureComponent } from 'react';
+import React, { PureComponent } from 'react';
import {
Card,
Tree,
- Input,
Button,
- Table,
Select,
Space,
- Pagination,
Row,
Col,
- Form,
+ Pagination
} from 'antd';
import { history } from 'umi';
import {
- SearchOutlined,
ExpandOutlined,
- DownloadOutlined,
UserOutlined,
TeamOutlined,
ApartmentOutlined,
SyncOutlined,
DollarOutlined,
SettingOutlined,
- ClearOutlined,
+ DownloadOutlined,
UserAddOutlined,
EditOutlined,
- DeleteOutlined
+ DeleteOutlined
} from '@ant-design/icons';
import styles from './StaffInfo.less';
-import StaffInfoAdd from './from/StaffInfoadd';
+import StandardTable from '@/components/StandardTable';
+import StaffInfoAdd from './form/StaffInfoadd';
+import StaffInfoRenderSimpleForm from "./form/StaffInfoRenderSimpleForm" //表单
const { Option } = Select;
@@ -164,6 +161,86 @@ class StaffInfo extends PureComponent {
total: 356,
}
};
+
+ // 默认列配置
+ this.defaultColumns = [
+ {
+ title: '序号',
+ dataIndex: 'id',
+ key: 'id',
+ width: 60,
+ align: 'center',
+ },
+ {
+ title: '姓名',
+ dataIndex: 'name',
+ key: 'name',
+ width: 60,
+ render: (text, record) => (
+
+ ),
+ },
+ {
+ title: '年龄',
+ dataIndex: 'phone',
+ key: 'phone',
+ width: 50,
+ },
+ {
+ title: '部门',
+ dataIndex: 'idCard',
+ key: 'idCard',
+ width: 70,
+ },
+ {
+ title: '岗位',
+ dataIndex: 'department',
+ key: 'department',
+ width: 80,
+ },
+ {
+ title: '工作性质',
+ dataIndex: 'position',
+ key: 'position',
+ width: 50,
+ },
+ {
+ title: '电话',
+ dataIndex: 'status',
+ key: 'status',
+ width: 100,
+ },
+ {
+ title: '操作',
+ key: 'action',
+ width: 80,
+ render: (_, record) => (
+
+ }
+ title="编辑"
+ onClick={() => this.handleEdit(record)}
+ />
+ }
+ title="删除"
+ onClick={() => this.handleDelete(record)}
+ />
+
+ ),
+ },
+ ];
}
// 获取处理后的树形数据
@@ -196,139 +273,6 @@ class StaffInfo extends PureComponent {
return ;
};
- // 组织架构树数据 (保留原始数据以备后用)
- treeData = [
- {
- title: '飞利信科技有限公司',
- key: '0-0',
- icon: ,
- children: [
- {
- title: '技术部',
- key: '0-0-0',
- icon: ,
- children: [
- {
- title: '前端组',
- key: '0-0-0-0',
- icon:
- },
- {
- title: '后端组',
- key: '0-0-0-1',
- icon:
- },
- ],
- },
- {
- title: '产品部',
- key: '0-0-1',
- icon: ,
- children: [
- {
- title: '产品设计组',
- key: '0-0-1-0',
- icon:
- },
- ],
- },
- {
- title: '运营部',
- key: '0-0-2',
- icon: ,
- },
- {
- title: '财务部',
- key: '0-0-3',
- icon: ,
- },
- {
- title: '人事部',
- key: '0-0-4',
- icon: ,
- },
- ],
- },
- ];
-
- // 表格列配置
- columns = [
- {
- title: '序号',
- dataIndex: 'id',
- key: 'id',
- width: 60,
- align: 'center',
- },
- {
- title: '姓名',
- dataIndex: 'name',
- key: 'name',
- width: 60,
- render: (text, record) => (
-
- ),
- },
- {
- title: '年龄',
- dataIndex: 'phone',
- key: 'phone',
- width: 50,
- },
- {
- title: '部门',
- dataIndex: 'idCard',
- key: 'idCard',
- width: 70,
- },
- {
- title: '岗位',
- dataIndex: 'department',
- key: 'department',
- width: 80,
- },
- {
- title: '工作性质',
- dataIndex: 'position',
- key: 'position',
- width: 50,
- },
- {
- title: '电话',
- dataIndex: 'status',
- key: 'status',
- width: 100,
- },
- {
- title: '操作',
- key: 'action',
- width: 80,
- render: (_, record) => (
-
- }
- title="编辑"
- />
- }
- title="删除"
- />
-
- ),
- },
- ];
-
// 搜索处理
handleSearch = (values) => {
console.log('搜索参数:', values);
@@ -354,7 +298,7 @@ class StaffInfo extends PureComponent {
// 刷新树数据
handleTreeRefresh = () => {
- console.log('刷新组织架构');
+ // console.log('刷新组织架构');
// 这里可以添加刷新树数据的逻辑
};
@@ -380,6 +324,40 @@ class StaffInfo extends PureComponent {
}
};
+ renderSimpleForm() {
+ const { prooperlog = {} } = this.props;
+ const { params = {} } = prooperlog;
+ const parentMethods = {
+ handleSearch: this.handleSearch,
+ handleFormReset: this.handleFormReset,
+ toggleForm: this.toggleForm,
+ submitButtons: styles.submitButtons,
+ params
+ };
+ return (
+
+ );
+ }
+
+ renderAdvancedForm() {
+ const { prooperlog: { params } } = this.props;
+ const parentMethods = {
+ handleSearch: this.handleSearch,
+ handleFormReset: this.handleFormReset,
+ toggleForm: this.toggleForm,
+ params
+ };
+
+ return (
+
+ );
+ }
+
+ renderForm() {
+ const { expandForm } = this.state;
+ return expandForm ? this.renderAdvancedForm() : this.renderSimpleForm();
+ }
+
// 分页处理
onPaginationChange = (page, pageSize) => {
this.setState({
@@ -404,7 +382,7 @@ class StaffInfo extends PureComponent {
// 新增成功回调
handleAddSuccess = (values) => {
console.log('新增成功:', values);
-
+
// 这里可以刷新列表数据
// 模拟添加到表格数据中
const newStaff = {
@@ -435,11 +413,23 @@ class StaffInfo extends PureComponent {
history.push(`/topnavbar00/staffmanage/particulars`);
};
+ // 处理编辑
+ handleEdit = (record) => {
+ console.log('编辑员工:', record);
+ // 这里可以打开编辑弹窗或跳转到编辑页面
+ };
+
+ // 处理删除
+ handleDelete = (record) => {
+ console.log('删除员工:', record);
+ // 这里可以弹出确认框并执行删除操作
+ };
+
render() {
const { tableData, pagination, expandedKeys, addModalVisible, addLoading } = this.state;
return (
-
+
{/* 主体内容 */}
@@ -492,100 +482,7 @@ class StaffInfo extends PureComponent {
{/* 筛选条件 */}
-
+ {this.renderForm()}
{/* 操作按钮和统计 */}
@@ -615,12 +512,13 @@ class StaffInfo extends PureComponent {
{/* 人员表格 */}
-
{/* 分页 */}
@@ -656,4 +554,4 @@ class StaffInfo extends PureComponent {
}
}
-export default StaffInfo
+export default StaffInfo;
\ No newline at end of file
diff --git a/src/pages/staffmanage_staffinfo/StaffInfo.less b/src/pages/staffmanage_staffinfo/StaffInfo.less
index 8b43155..0837d7c 100644
--- a/src/pages/staffmanage_staffinfo/StaffInfo.less
+++ b/src/pages/staffmanage_staffinfo/StaffInfo.less
@@ -60,18 +60,20 @@
}
}
- .treeCard {
- height: 600px;
- border: 1px solid #e8e8e8;
- border-radius: 8px;
+ .treeCard {
+ height: 600px;
+ border: 1px solid #e8e8e8;
+ border-radius: 8px;
- .treeHeader {
- display: flex;
- justify-content: space-between;
- align-items: center;
- font-size: 14px;
- font-weight: 500;
- } .treeContainer {
+ .treeHeader {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ font-size: 14px;
+ font-weight: 500;
+ }
+
+ .treeContainer {
height: 520px;
overflow-y: auto;
@@ -150,50 +152,52 @@
}
}
- .searchCard {
- margin-bottom: 16px;
- background-color: #f9fbfc;
- border-radius: 8px;
-
- .ant-card-body {
- padding: 12px;
+ .searchCard {
+ margin-bottom: 16px;
background-color: #f9fbfc;
- border-radius: 6px;
- }
+ border-radius: 8px;
- .ant-form-item-label {
- font-weight: 500;
-
- label {
- color: #ecf0f1 !important;
+ .ant-card-body {
+ padding: 12px;
+ background-color: #f9fbfc;
+ border-radius: 6px;
}
- }
- // 深色背景下的表单项样式
- .ant-input,
- .ant-select-selector {
- background-color: #34495e !important;
- border-color: #5a6c7d !important;
- color: #ecf0f1 !important;
+ .ant-form-item-label {
+ font-weight: 500;
- &:hover {
- border-color: #7fb3d3 !important;
+ label {
+ color: #ecf0f1 !important;
+ }
}
- &:focus {
- border-color: #2d5cf6 !important;
- box-shadow: 0 0 0 2px rgba(45, 92, 246, 0.2) !important;
+ // 深色背景下的表单项样式
+ .ant-input,
+ .ant-select-selector {
+ background-color: #34495e !important;
+ border-color: #5a6c7d !important;
+ color: #ecf0f1 !important;
+
+ &:hover {
+ border-color: #7fb3d3 !important;
+ }
+
+ &:focus {
+ border-color: #2d5cf6 !important;
+ box-shadow: 0 0 0 2px rgba(45, 92, 246, 0.2) !important;
+ }
}
- }
- .ant-select-selection-placeholder,
- .ant-input::placeholder {
- color: #95a5a6 !important;
- }
+ .ant-select-selection-placeholder,
+ .ant-input::placeholder {
+ color: #95a5a6 !important;
+ }
- .anticon {
- color: #95a5a6 !important;
- } /* 搜索按钮样式 */
+ .anticon {
+ color: #95a5a6 !important;
+ }
+
+ /* 搜索按钮样式 */
.searchButton {
background: linear-gradient(135deg, #2d5cf6 0%, #4c7bff 100%);
border: none;
@@ -249,6 +253,9 @@
}
.actionBar {
+
+
+
display: flex;
justify-content: space-between;
align-items: center;
@@ -260,7 +267,6 @@
font-weight: 500;
}
- /* 导出按钮样式 */
.exportButton {
background: linear-gradient(135deg, #52c41a 0%, #73d13d 100%);
border: none;
@@ -292,7 +298,7 @@
}
}
- /* 新增按钮样式 */
+
.addButton {
background: linear-gradient(135deg, #fa8c16 0%, #ffa940 100%);
border: none;
@@ -301,8 +307,8 @@
font-size: 14px;
box-shadow: 0 4px 12px rgba(250, 140, 22, 0.3);
transition: all 0.3s ease;
- // margin-top: -8px;
- height: 35px;
+ // margin-top: -8px;
+ height: 35px;
padding: 0 16px;
@@ -392,6 +398,82 @@
}
}
}
+
+
+ .tableCard {
+ border-radius: 8px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
+ padding-bottom: 10px;
+
+ .ant-table-wrapper {
+ max-height: 600px;
+ overflow-y: auto;
+
+ /* 自定义滚动条样式 */
+ &::-webkit-scrollbar {
+ width: 8px;
+ }
+
+ &::-webkit-scrollbar-track {
+ background: #f5f5f5;
+ border-radius: 4px;
+ }
+
+ &::-webkit-scrollbar-thumb {
+ background: #d9d9d9;
+ border-radius: 4px;
+
+ &:hover {
+ background: #bfbfbf;
+ }
+ }
+
+ .ant-table-thead>tr>th {
+ background-color: #fafafa;
+ font-weight: 600;
+ color: #333;
+ border-bottom: 1px solid #e8e8e8;
+ position: sticky;
+ top: 0;
+ z-index: 1;
+ }
+
+ .ant-table-tbody>tr {
+ &:hover>td {
+ background-color: #f5f5f5 !important;
+ }
+
+ >td {
+ border-bottom: 1px solid #f0f0f0;
+ }
+ }
+ }
+
+ .paginationWrapper {
+ margin-top: 20px;
+ text-align: right;
+
+ .ant-pagination {
+ .ant-pagination-total-text {
+ color: #666;
+ }
+
+ .ant-pagination-item {
+ border-radius: 4px;
+
+ &.ant-pagination-item-active {
+ background-color: #fff;
+ border-color: #2d5cf6;
+ }
+ }
+
+ .ant-pagination-prev,
+ .ant-pagination-next {
+ border-radius: 4px;
+ }
+ }
+ }
+ }
}
}
@@ -517,7 +599,7 @@
.ant-form-item-label {
font-weight: 500;
-
+
label {
color: #ecf0f1 !important;
}
@@ -562,79 +644,7 @@
}
}
- .tableCard {
- border-radius: 8px;
- box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
- padding-bottom: 10px;
- .ant-table-wrapper {
- max-height: 600px;
- overflow-y: auto;
-
- /* 自定义滚动条样式 */
- &::-webkit-scrollbar {
- width: 8px;
- }
-
- &::-webkit-scrollbar-track {
- background: #f5f5f5;
- border-radius: 4px;
- }
-
- &::-webkit-scrollbar-thumb {
- background: #d9d9d9;
- border-radius: 4px;
-
- &:hover {
- background: #bfbfbf;
- }
- }
-
- .ant-table-thead>tr>th {
- background-color: #fafafa;
- font-weight: 600;
- color: #333;
- border-bottom: 1px solid #e8e8e8;
- position: sticky;
- top: 0;
- z-index: 1;
- }
-
- .ant-table-tbody>tr {
- &:hover>td {
- background-color: #f5f5f5 !important;
- }
-
- >td {
- border-bottom: 1px solid #f0f0f0;
- }
- }
- }
-
- .paginationWrapper {
- margin-top: 20px;
- text-align: right;
- .ant-pagination {
- .ant-pagination-total-text {
- color: #666;
- }
-
- .ant-pagination-item {
- border-radius: 4px;
-
- &.ant-pagination-item-active {
- background-color: #2d5cf6;
- border-color: #2d5cf6;
- }
- }
-
- .ant-pagination-prev,
- .ant-pagination-next {
- border-radius: 4px;
- }
- }
- }
- }
:global {
.ant-card-body {
diff --git a/src/pages/staffmanage_staffinfo/form/StaffInfoRenderSimpleForm.js b/src/pages/staffmanage_staffinfo/form/StaffInfoRenderSimpleForm.js
new file mode 100644
index 0000000..a82322f
--- /dev/null
+++ b/src/pages/staffmanage_staffinfo/form/StaffInfoRenderSimpleForm.js
@@ -0,0 +1,141 @@
+import React, { useState } from 'react';
+import { Button, Col, Form, Input, Row, message,Select, Space } from 'antd';
+import { ClearOutlined,SearchOutlined } from '@ant-design/icons';
+import styles from "../StaffInfo.less";
+
+const FormItem = Form.Item;
+const StaffInfoRenderSimpleForm = (props) => {
+ const [form] = Form.useForm();
+ const [startDateOpen, setStartDateOpen] = useState(false);
+ const [endDateOpen, setEndDateOpen] = useState(false);
+ const { submitButtons, handleSearch, handleFormReset, toggleForm, params } = props;
+ React.useEffect(() => {
+ form.setFieldsValue({
+ opername: params?.opername,
+ opertype: params?.opertype,
+ });
+ }, [params]);
+ const onFinish = values => {
+ const params = {
+ ...values,
+ startDate: values.startDate ? values.startDate.format('YYYY-MM-DD') : undefined,
+ endDate: values.endDate ? values.endDate.format('YYYY-MM-DD') : undefined,
+ };
+ handleSearch(params);
+ };
+
+ const myhandleFormReset = () => {
+ form.resetFields();
+ handleFormReset();
+ };
+
+ const onEndDateChange = (value) => {
+ const startDate = form.getFieldValue("startDate");
+ if (startDate && value && value.isBefore(startDate, "day")) {
+ message.error("结束日期不能小于开始日期!");
+ // 清空
+ form.setFieldsValue({ endDate: undefined });
+ }
+ }
+
+ return (
+
+
+
+ );
+
+};
+
+export default StaffInfoRenderSimpleForm;
diff --git a/src/pages/staffmanage_staffinfo/form/StaffInfoRenderSimpleForm.less b/src/pages/staffmanage_staffinfo/form/StaffInfoRenderSimpleForm.less
new file mode 100644
index 0000000..e69de29