67 lines
2.2 KiB
TypeScript
67 lines
2.2 KiB
TypeScript
import { MagnifyingGlassIcon } from "@heroicons/react/24/outline";
|
|
import { api, useStaff } from "@nice/client";
|
|
import { Button, Form, Input, Modal, Select, Table } from "antd";
|
|
import { StaffDto, trainSituationDetailSelect } from "@nice/common";
|
|
import { useCallback, useEffect, useState } from "react";
|
|
import _ from "lodash";
|
|
import { useMainContext } from "../layout/MainProvider";
|
|
import StaffTable from "./stafftable/page";
|
|
import StaffModal from "./staffmodal/page";
|
|
export default function StaffMessage() {
|
|
const {form, formValue, setFormValue, setVisible, setSearchValue} = useMainContext();
|
|
useEffect(()=>{
|
|
setFormValue(
|
|
{
|
|
username: "",
|
|
deptId: "",
|
|
absent: false,
|
|
position: "",
|
|
trainSituations: "",
|
|
}
|
|
)
|
|
},[])
|
|
const handleNew = () => {
|
|
form.setFieldsValue(formValue);
|
|
setVisible(true);
|
|
}
|
|
// 添加防抖的搜索处理函数
|
|
const handleSearch = useCallback(
|
|
_.debounce((value: string) => {
|
|
setSearchValue(value);
|
|
}, 500),
|
|
[]
|
|
);
|
|
return (
|
|
<div className="p-2 min-h-screen bg-gradient-to-br">
|
|
<Form>
|
|
<div className="p-4 h-full flex flex-col"> {/* 修改为flex布局 */}
|
|
<div className="max-w-full mx-auto flex-1 flex flex-col"> {/* 添加flex容器 */}
|
|
{/* 头部区域保持不变... */}
|
|
<div className="flex justify-between mb-4 space-x-4 items-center">
|
|
<div className="text-2xl">人员总览</div>
|
|
<div className="relative w-1/3">
|
|
<Input
|
|
placeholder="输入姓名搜索"
|
|
onChange={(e) => handleSearch(e.target.value)}
|
|
className="pl-10 w-full border"
|
|
/>
|
|
<MagnifyingGlassIcon className="absolute left-3 top-1/2 transform -translate-y-1/2 h-5 w-5 " />
|
|
</div>
|
|
<Button
|
|
type="primary"
|
|
onClick={handleNew}
|
|
className=" font-bold py-2 px-4 rounded"
|
|
>
|
|
新建人员
|
|
</Button>
|
|
</div>
|
|
<StaffTable></StaffTable>
|
|
<StaffModal></StaffModal>
|
|
</div>
|
|
</div>
|
|
</Form>
|
|
</div>
|
|
);
|
|
}
|
|
|