training_data/apps/web/src/app/main/staffpage/staffmodal/page.tsx

178 lines
7.5 KiB
TypeScript

import { api, useStaff } from "@nice/client";
import { useMainContext } from "../../layout/MainProvider";
import toast from "react-hot-toast";
import { Button, Form, Input, Modal, Select } from "antd";
import DepartmentSelect from "@web/src/components/models/department/department-select";
import { useEffect } from "react";
export default function StaffModal() {
const { data: traincontents} = api.trainSituation.findMany.useQuery({
select:{
id: true,
trainContent:{
select:{
id: true,
title: true,
type: true,
}
},
}
});
useEffect(() => {
traincontents?.forEach((situation)=>{
console.log(situation.trainContent.title);
});
}, [traincontents]);
const { form, formValue, setVisible, visible, editingRecord } = useMainContext()
const { create, update } = useStaff();
const handleOk = async () => {
const values = await form.getFieldsValue();
console.log(values.username);
try {
if (editingRecord && editingRecord.id) {
const result = await update.mutateAsync(
{
where: {
id: editingRecord.id,
},
data: {
username: values.username,
deptId: values.deptId,
position: values.position,
absent: values.absent,
trainSituations: values.trainSituations ? {
upsert: values.trainSituations.map((situation) => ({
where: { id: situation.id || "" },
update: {
mustTrainTime: situation.mustTrainTime,
trainContent: { connect: { id: situation.trainContentId } },
// 其他字段...
},
}))
} : undefined,
updatedAt: new Date()
} as any
}
);
// console.log(result);
} else {
await create.mutateAsync(
{
data: {
username: values.username,
deptId: values.deptId,
createdAt: new Date(),
showname: values.username,
absent: values.absent,
trainSituations: {
create: values.trainSituations.map((situation) => ({
trainContent: { connect: { id: situation.trainContentId } },
mustTrainTime: situation.mustTrainTime,
// 其他必填字段...
}))
}
}
}
);
}
toast.success("保存成功");
setVisible(false);
} catch (error) {
toast.error("保存失败");
throw error;
}
};
const handleCancel = () => {
setVisible(false);
};
return (
<>
{/* 模态框样式更新 */}
<Modal
title="编辑员工信息"
visible={visible}
onOk={handleOk}
onCancel={handleCancel}
>
<Form
form={form}
initialValues={formValue}
>
<Form.Item
name={"username"}
label="姓名"
// labelClassName="text-gray-300"
>
<Input className="rounded-lg" />
</Form.Item>
<Form.Item
name={"deptId"}
label="部门"
// labelClassName="text-gray-300"
>
<DepartmentSelect></DepartmentSelect>
</Form.Item>
<Form.Item
name={"positionId"}
label="职务"
// labelClassName="text-gray-300"
>
<Input className="rounded-lg" />
</Form.Item>
<Form.Item
name={"absent"}
label="在位"
>
<Select className="rounded-lg" >
<Select.Option value={true}></Select.Option>
<Select.Option value={false}></Select.Option>
</Select>
</Form.Item>
<Form.List name="trainSituations">
{(fields, { add, remove }) => (
<>
{fields.map(({ key, name, ...restField }) => (
<div key={key} className="flex space-x-2">
<Form.Item
{...restField}
name={[name, 'trainContent']}
label="培训内容"
className="flex-1"
>
<Select placeholder="选择培训内容">
{/* 动态渲染培训内容选项 */}
{traincontents?.map((situation) => (
<Select.Option
key={situation.id}
value={situation.id}
>
{situation.trainContentId}
</Select.Option>
))}
</Select>
</Form.Item>
<Form.Item
{...restField}
name={[name, 'mustTrainTime']}
label="需训时长"
className="flex-1"
>
<Input type="number" />
</Form.Item>
<Button onClick={() => remove(name)}></Button>
</div>
))}
<Button onClick={() => add()}></Button>
</>
)}
</Form.List>
</Form>
</Modal>
<Button onClick={() =>{console.log(traincontents);}}>TEST</Button>
</>
)
}