commit
747a625c1c
@ -0,0 +1,99 @@
|
|||||||
|
import { Form, Input, Modal, TreeSelect, message } from 'antd';
|
||||||
|
import React, { useState, useEffect } from 'react';
|
||||||
|
import * as d3 from 'd3';
|
||||||
|
import './index.less';
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { span: 6 },
|
||||||
|
wrapperCol: { span: 14 },
|
||||||
|
};
|
||||||
|
|
||||||
|
const CopyDialog = ({ open, onCreate, onCancel }) => {
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
|
||||||
|
const [treeData, setData] = useState([]);
|
||||||
|
console.log(treeData);
|
||||||
|
useEffect(() => {
|
||||||
|
d3.json('/api/bs/hrmorganization/orgchart/getSubCompanyTree').then(
|
||||||
|
(data) => {
|
||||||
|
setData(data.companyTree);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
}, [true]);
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根节点树异步加载
|
||||||
|
* @param {} parentId
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
const onRootLoadData = (treeNode) =>
|
||||||
|
new Promise((resolve) => {
|
||||||
|
const { id } = treeNode.props;
|
||||||
|
setTimeout(() => {
|
||||||
|
d3.json(
|
||||||
|
`/api/bs/hrmorganization/orgchart/getSubCompanyTree?subcompany=${id}`,
|
||||||
|
).then((data) => {
|
||||||
|
debugger;
|
||||||
|
let arr = [...treeData, ...data.companyTree];
|
||||||
|
setData(arr);
|
||||||
|
});
|
||||||
|
resolve(undefined);
|
||||||
|
}, 200);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
open={open}
|
||||||
|
title="部门复制"
|
||||||
|
okText="确认"
|
||||||
|
cancelText="取消"
|
||||||
|
onCancel={onCancel}
|
||||||
|
onOk={() => {
|
||||||
|
form
|
||||||
|
.validateFields()
|
||||||
|
.then((values) => {
|
||||||
|
onCreate(values);
|
||||||
|
})
|
||||||
|
.catch((info) => {
|
||||||
|
console.log('Validate Failed:', info);
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Form {...layout} form={form} name="form_in_modal">
|
||||||
|
<Form.Item
|
||||||
|
name="department"
|
||||||
|
label="合并到部门"
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '【合并到部门】为必填项!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<TreeSelect
|
||||||
|
treeDataSimpleMode
|
||||||
|
allowClear
|
||||||
|
style={{ width: '100%' }}
|
||||||
|
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
|
||||||
|
loadData={onRootLoadData}
|
||||||
|
treeData={treeData}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item
|
||||||
|
name="mergeName"
|
||||||
|
label="合并后名称"
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '【合并后的名称】为必填项!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
};
|
||||||
|
export default CopyDialog;
|
||||||
@ -0,0 +1,3 @@
|
|||||||
|
.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper {
|
||||||
|
color: #222526;
|
||||||
|
}
|
||||||
@ -0,0 +1,107 @@
|
|||||||
|
import { Form, Input, Modal, TreeSelect, message } from 'antd';
|
||||||
|
import React, {
|
||||||
|
useState,
|
||||||
|
useEffect,
|
||||||
|
useRef,
|
||||||
|
forwardRef,
|
||||||
|
useImperativeHandle,
|
||||||
|
} from 'react';
|
||||||
|
import * as d3 from 'd3';
|
||||||
|
import './index.less';
|
||||||
|
|
||||||
|
const layout = {
|
||||||
|
labelCol: { span: 6 },
|
||||||
|
wrapperCol: { span: 14 },
|
||||||
|
};
|
||||||
|
|
||||||
|
const MergeDialog = forwardRef(({ open, onCreate, onCancel }, ref) => {
|
||||||
|
const [treeData, setData] = useState([]);
|
||||||
|
const [form] = Form.useForm();
|
||||||
|
const formRef = useRef(null);
|
||||||
|
|
||||||
|
useImperativeHandle(ref, () => ({
|
||||||
|
getTreeData() {
|
||||||
|
form.resetFields();
|
||||||
|
d3.json('/api/bs/hrmorganization/orgchart/getDepartmentTree').then(
|
||||||
|
(data) => {
|
||||||
|
setData(data.departmentTree);
|
||||||
|
},
|
||||||
|
);
|
||||||
|
},
|
||||||
|
}));
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 根节点树异步加载
|
||||||
|
* @param {} parentId
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
|
const onRootLoadData = (treeNode) =>
|
||||||
|
new Promise((resolve) => {
|
||||||
|
const { id } = treeNode.props;
|
||||||
|
setTimeout(() => {
|
||||||
|
d3.json(
|
||||||
|
`/api/bs/hrmorganization/orgchart/getDepartmentTree?subcompany=${id}`,
|
||||||
|
).then((data) => {
|
||||||
|
let arr = [...treeData, ...data.departmentTree];
|
||||||
|
setData(arr);
|
||||||
|
});
|
||||||
|
resolve(undefined);
|
||||||
|
}, 200);
|
||||||
|
});
|
||||||
|
|
||||||
|
return (
|
||||||
|
<Modal
|
||||||
|
open={open}
|
||||||
|
title="部门合并"
|
||||||
|
okText="确认"
|
||||||
|
cancelText="取消"
|
||||||
|
onCancel={onCancel}
|
||||||
|
onOk={() => {
|
||||||
|
form
|
||||||
|
.validateFields()
|
||||||
|
.then((values) => {
|
||||||
|
onCreate(values);
|
||||||
|
})
|
||||||
|
.catch((info) => {
|
||||||
|
console.log('Validate Failed:', info);
|
||||||
|
});
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<Form ref={formRef} {...layout} form={form} name="form_in_modal">
|
||||||
|
<Form.Item
|
||||||
|
name="department"
|
||||||
|
label="合并到部门"
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '【合并到部门】为必填项!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<TreeSelect
|
||||||
|
treeDataSimpleMode
|
||||||
|
allowClear
|
||||||
|
style={{ width: '100%' }}
|
||||||
|
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
|
||||||
|
loadData={onRootLoadData}
|
||||||
|
treeData={treeData}
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item
|
||||||
|
name="mergeName"
|
||||||
|
label="合并后名称"
|
||||||
|
rules={[
|
||||||
|
{
|
||||||
|
required: true,
|
||||||
|
message: '【合并后的名称】为必填项!',
|
||||||
|
},
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<Input />
|
||||||
|
</Form.Item>
|
||||||
|
</Form>
|
||||||
|
</Modal>
|
||||||
|
);
|
||||||
|
});
|
||||||
|
export default MergeDialog;
|
||||||
Loading…
Reference in New Issue