Merge pull request 'feature/cl' (#6) from feature/cl into master
Reviewed-on: http://221.226.25.34:3000/liang.cheng/org-chart-frant/pulls/6
This commit is contained in:
commit
747a625c1c
|
|
@ -2,11 +2,8 @@
|
|||
<project version="4">
|
||||
<component name="ChangeListManager">
|
||||
<list default="true" id="449daba1-1dd3-4ffd-906d-6ef641fb81de" name="Default Changelist" comment="">
|
||||
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/.umirc.ts" beforeDir="false" afterPath="$PROJECT_DIR$/.umirc.ts" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/d3-org-chart.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/d3-org-chart.js" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/pages/company.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/company.jsx" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/pages/index.less" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/index.less" afterDir="false" />
|
||||
<change beforePath="$PROJECT_DIR$/src/pages/dragTree.jsx" beforeDir="false" afterPath="$PROJECT_DIR$/src/pages/dragTree.jsx" afterDir="false" />
|
||||
</list>
|
||||
<option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
|
||||
<option name="SHOW_DIALOG" value="false" />
|
||||
|
|
@ -16,10 +13,10 @@
|
|||
</component>
|
||||
<component name="FileEditorManager">
|
||||
<leaf SIDE_TABS_SIZE_LIMIT_KEY="300">
|
||||
<file pinned="false" current-in-tab="false">
|
||||
<file pinned="false" current-in-tab="true">
|
||||
<entry file="file://$PROJECT_DIR$/src/d3-org-chart.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="-20">
|
||||
<state relative-caret-position="-146">
|
||||
<folding>
|
||||
<element signature="e#0#49#0" expanded="true" />
|
||||
<element signature="n#style#0;n#div#0;n#!!top" expanded="true" />
|
||||
|
|
@ -37,17 +34,6 @@
|
|||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
<file pinned="false" current-in-tab="true">
|
||||
<entry file="file://$PROJECT_DIR$/src/components/dialog/index.jsx">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="-2297">
|
||||
<folding>
|
||||
<element signature="e#0#26#0" expanded="true" />
|
||||
</folding>
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</file>
|
||||
</leaf>
|
||||
</component>
|
||||
<component name="Git.Settings">
|
||||
|
|
@ -68,9 +54,9 @@
|
|||
</packageJsonPaths>
|
||||
</component>
|
||||
<component name="ProjectFrameBounds" fullScreen="true">
|
||||
<option name="y" value="28" />
|
||||
<option name="width" value="1440" />
|
||||
<option name="height" value="872" />
|
||||
<option name="x" value="1440" />
|
||||
<option name="width" value="1920" />
|
||||
<option name="height" value="1080" />
|
||||
</component>
|
||||
<component name="ProjectInspectionProfilesVisibleTreeState">
|
||||
<entry key="Project Default">
|
||||
|
|
@ -347,9 +333,6 @@
|
|||
<foldersAlwaysOnTop value="true" />
|
||||
</navigator>
|
||||
<panes>
|
||||
<pane id="PackagesPane" />
|
||||
<pane id="CatdeaLogs" />
|
||||
<pane id="Scope" />
|
||||
<pane id="ProjectPane">
|
||||
<subPane>
|
||||
<expand>
|
||||
|
|
@ -379,12 +362,15 @@
|
|||
<select />
|
||||
</subPane>
|
||||
</pane>
|
||||
<pane id="PackagesPane" />
|
||||
<pane id="Scope" />
|
||||
<pane id="CatdeaLogs" />
|
||||
</panes>
|
||||
</component>
|
||||
<component name="PropertiesComponent">
|
||||
<property name="WebServerToolWindowFactoryState" value="false" />
|
||||
<property name="aspect.path.notification.shown" value="true" />
|
||||
<property name="com.android.tools.idea.instantapp.provision.ProvisionBeforeRunTaskProvider.myTimeStamp" value="1690341396252" />
|
||||
<property name="com.android.tools.idea.instantapp.provision.ProvisionBeforeRunTaskProvider.myTimeStamp" value="1690446615685" />
|
||||
<property name="nodejs_interpreter_path.stuck_in_default_project" value="undefined stuck path" />
|
||||
<property name="nodejs_npm_path_reset_for_default_project" value="true" />
|
||||
<property name="project.structure.last.edited" value="Project" />
|
||||
|
|
@ -420,16 +406,17 @@
|
|||
<workItem from="1689842557088" duration="205000" />
|
||||
<workItem from="1690192167781" duration="39000" />
|
||||
<workItem from="1690341272941" duration="164000" />
|
||||
<workItem from="1690446551998" duration="218000" />
|
||||
</task>
|
||||
<servers />
|
||||
</component>
|
||||
<component name="TimeTrackingManager">
|
||||
<option name="totallyTimeSpent" value="408000" />
|
||||
<option name="totallyTimeSpent" value="626000" />
|
||||
</component>
|
||||
<component name="ToolWindowManager">
|
||||
<frame x="0" y="0" width="1440" height="900" extended-state="0" />
|
||||
<frame x="1440" y="0" width="1920" height="1080" extended-state="0" />
|
||||
<layout>
|
||||
<window_info content_ui="combo" id="Project" order="0" visible="true" weight="0.25679544" />
|
||||
<window_info content_ui="combo" id="Project" order="0" visible="true" weight="0.19382322" />
|
||||
<window_info id="Structure" order="1" side_tool="true" weight="0.25" />
|
||||
<window_info id="JRebel" order="2" side_tool="true" />
|
||||
<window_info id="Image Layers" order="3" />
|
||||
|
|
@ -449,7 +436,7 @@
|
|||
<window_info anchor="bottom" id="Docker" order="9" show_stripe_button="false" />
|
||||
<window_info anchor="bottom" id="Messages" order="10" />
|
||||
<window_info anchor="bottom" id="Database Changes" order="11" show_stripe_button="false" />
|
||||
<window_info active="true" anchor="bottom" id="Version Control" order="12" visible="true" weight="0.32891566" />
|
||||
<window_info active="true" anchor="bottom" id="Version Control" order="12" visible="true" weight="0.26039603" />
|
||||
<window_info anchor="bottom" id="JRebel Console" order="13" side_tool="true" />
|
||||
<window_info anchor="right" id="Commander" internal_type="SLIDING" order="0" type="SLIDING" weight="0.4" />
|
||||
<window_info anchor="right" id="Ant Build" order="1" weight="0.25" />
|
||||
|
|
@ -480,9 +467,18 @@
|
|||
<option name="myLimit" value="2678400000" />
|
||||
</component>
|
||||
<component name="editorHistoryManager">
|
||||
<entry file="file://$PROJECT_DIR$/src/components/dialog/index.jsx">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state>
|
||||
<folding>
|
||||
<element signature="e#0#26#0" expanded="true" />
|
||||
</folding>
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/src/d3-org-chart.js">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="-20">
|
||||
<state relative-caret-position="-146">
|
||||
<folding>
|
||||
<element signature="e#0#49#0" expanded="true" />
|
||||
<element signature="n#style#0;n#div#0;n#!!top" expanded="true" />
|
||||
|
|
@ -499,15 +495,6 @@
|
|||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
<entry file="file://$PROJECT_DIR$/src/components/dialog/index.jsx">
|
||||
<provider selected="true" editor-type-id="text-editor">
|
||||
<state relative-caret-position="-2297">
|
||||
<folding>
|
||||
<element signature="e#0#26#0" expanded="true" />
|
||||
</folding>
|
||||
</state>
|
||||
</provider>
|
||||
</entry>
|
||||
</component>
|
||||
<component name="ideajad">
|
||||
<property name="annotate" value="false" />
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
@ -230,8 +230,8 @@ export class OrgChart {
|
|||
top: {
|
||||
nodeLeftX: (node) => -node.width / 2,
|
||||
nodeRightX: (node) => node.width / 2,
|
||||
//nodeTopY: (node) => 0,
|
||||
nodeTopY: (node) => node.height / 0.3,
|
||||
nodeTopY: (node) => 0,
|
||||
//nodeTopY: (node) => node.height / 0.3,
|
||||
nodeBottomY: (node) => node.height,
|
||||
nodeJoinX: (node) => node.x - node.width / 2,
|
||||
nodeJoinY: (node) => node.y + node.height,
|
||||
|
|
|
|||
|
|
@ -141,10 +141,7 @@ export default function companyPage() {
|
|||
|
||||
const nodeContentRender = (d, i, arr, state) => {
|
||||
if (d.data.ftype == 0) {
|
||||
return `<div style="text-align:center">
|
||||
<div style="display: inline-block; vertical-align: top;">
|
||||
<img src="./img/company.png" />
|
||||
</div>
|
||||
return `<div>
|
||||
<div style="display: inline-block; text-align: center; margin-left: 5px;">
|
||||
<div style="
|
||||
font-size: 24px;
|
||||
|
|
|
|||
|
|
@ -1,22 +1,45 @@
|
|||
import { Tree, message } from 'antd';
|
||||
import { Tree, message, Modal, Popconfirm, Spin } from 'antd';
|
||||
import React, { useEffect, useState, useRef } from 'react';
|
||||
import * as d3 from 'd3';
|
||||
import qs from 'qs';
|
||||
import MergeDialog from '../components/dialog/mergeDialog';
|
||||
import CopyDialog from '../components/dialog/copyDialog';
|
||||
|
||||
import { HomeOutlined, FolderOutlined } from '@ant-design/icons';
|
||||
|
||||
import {
|
||||
HomeOutlined,
|
||||
FolderOutlined,
|
||||
ClusterOutlined,
|
||||
ApartmentOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import './index.less';
|
||||
|
||||
const DragTree = () => {
|
||||
const [gData, setGData] = useState([]);
|
||||
const [expandedKeys, setExpandedKeys] = useState([]);
|
||||
const [expandedKeys, setExpandedKeys] = useState([undefined]);
|
||||
const childRef = useRef(null);
|
||||
const [tip, setTip] = useState('正在加载...');
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [showCanceled, setShowCanceled] = useState(0);
|
||||
|
||||
const [open, setOpen] = useState(false);
|
||||
const [mergeId, setMergeId] = useState(null);
|
||||
const [copyopen, setCopyOpen] = useState(false);
|
||||
const [copyId, setCopyId] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
d3.json('/api/bs/hrmorganization/orgchart/getMovingTree').then((data) => {
|
||||
getMoveTree(0);
|
||||
}, [true]);
|
||||
|
||||
const getMoveTree = (showCanceled) => {
|
||||
setLoading(true);
|
||||
d3.json(
|
||||
`/api/bs/hrmorganization/orgchart/getMovingTree?showCanceled=${showCanceled}`,
|
||||
).then((data) => {
|
||||
setGData(data.movingTree);
|
||||
setExpandedKeys(data.expandedKeys);
|
||||
setLoading(false);
|
||||
});
|
||||
}, [true]);
|
||||
};
|
||||
|
||||
const onDragEnter = (info) => {
|
||||
//console.log(info);
|
||||
|
|
@ -24,133 +47,339 @@ const DragTree = () => {
|
|||
// setExpandedKeys(info.expandedKeys)
|
||||
};
|
||||
|
||||
const loop = (data, key, callback) => {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
if (data[i].key === key) {
|
||||
return callback(data[i], i, data);
|
||||
}
|
||||
if (data[i].children) {
|
||||
loop(data[i].children, key, callback);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const onDrop = (info) => {
|
||||
debugger;
|
||||
//弹框操作
|
||||
setLoading(true);
|
||||
setTip('正在转移，请稍候...');
|
||||
const dropKey = info.node.key;
|
||||
const dragKey = info.dragNode.key;
|
||||
const dropPos = info.node.pos.split('-');
|
||||
const dropPosition =
|
||||
info.dropPosition - Number(dropPos[dropPos.length - 1]);
|
||||
const loop = (data, key, callback) => {
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
if (data[i].key === key) {
|
||||
return callback(data[i], i, data);
|
||||
fetch('/api/bs/hrmorganization/dept/dragDepartment', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
sourcekey: dragKey,
|
||||
targetkey: dropKey,
|
||||
dropPosition: dropPosition,
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
const data = [...gData];
|
||||
// Find dragObject
|
||||
let dragObj;
|
||||
loop(data, dragKey, (item, index, arr) => {
|
||||
arr.splice(index, 1);
|
||||
dragObj = item;
|
||||
});
|
||||
if (!info.dropToGap) {
|
||||
// Drop on the content
|
||||
loop(data, dropKey, (item) => {
|
||||
item.children = item.children || [];
|
||||
// where to insert 示例添加到头部，可以是随意位置
|
||||
item.children.unshift(dragObj);
|
||||
});
|
||||
} else if (
|
||||
(info.node.props.children || []).length > 0 &&
|
||||
// Has children
|
||||
info.node.props.expanded &&
|
||||
// Is expanded
|
||||
dropPosition === 1 // On the bottom gap
|
||||
) {
|
||||
loop(data, dropKey, (item) => {
|
||||
item.children = item.children || [];
|
||||
// where to insert 示例添加到头部，可以是随意位置
|
||||
item.children.unshift(dragObj);
|
||||
// in previous version, we use item.children.push(dragObj) to insert the
|
||||
// item to the tail of the children
|
||||
});
|
||||
} else {
|
||||
let ar = [];
|
||||
let i;
|
||||
loop(data, dropKey, (_item, index, arr) => {
|
||||
ar = arr;
|
||||
i = index;
|
||||
});
|
||||
if (dropPosition === -1) {
|
||||
ar.splice(i, 0, dragObj);
|
||||
} else {
|
||||
ar.splice(i + 1, 0, dragObj);
|
||||
}
|
||||
}
|
||||
setGData(data);
|
||||
} else {
|
||||
message.warning(res.msg, 2);
|
||||
}
|
||||
if (data[i].children) {
|
||||
loop(data[i].children, key, callback);
|
||||
}
|
||||
}
|
||||
};
|
||||
const data = [...gData];
|
||||
setLoading(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error('接口异常,请联系管理员');
|
||||
});
|
||||
|
||||
// Find dragObject
|
||||
let dragObj;
|
||||
loop(data, dragKey, (item, index, arr) => {
|
||||
arr.splice(index, 1);
|
||||
dragObj = item;
|
||||
});
|
||||
if (!info.dropToGap) {
|
||||
// Drop on the content
|
||||
loop(data, dropKey, (item) => {
|
||||
item.children = item.children || [];
|
||||
// where to insert 示例添加到头部，可以是随意位置
|
||||
item.children.unshift(dragObj);
|
||||
});
|
||||
} else if (
|
||||
(info.node.props.children || []).length > 0 &&
|
||||
// Has children
|
||||
info.node.props.expanded &&
|
||||
// Is expanded
|
||||
dropPosition === 1 // On the bottom gap
|
||||
) {
|
||||
loop(data, dropKey, (item) => {
|
||||
item.children = item.children || [];
|
||||
// where to insert 示例添加到头部，可以是随意位置
|
||||
item.children.unshift(dragObj);
|
||||
// in previous version, we use item.children.push(dragObj) to insert the
|
||||
// item to the tail of the children
|
||||
});
|
||||
} else {
|
||||
let ar = [];
|
||||
let i;
|
||||
loop(data, dropKey, (_item, index, arr) => {
|
||||
ar = arr;
|
||||
i = index;
|
||||
});
|
||||
if (dropPosition === -1) {
|
||||
ar.splice(i, 0, dragObj);
|
||||
} else {
|
||||
ar.splice(i + 1, 0, dragObj);
|
||||
}
|
||||
}
|
||||
setGData(data);
|
||||
setTimeout(function () {}, 1000);
|
||||
};
|
||||
|
||||
/**
|
||||
* 删除
|
||||
* @param {*} nodeData
|
||||
*/
|
||||
const onDelete = (nodeData) => {
|
||||
const extend = nodeData.type == '1' ? 'comp' : 'dept';
|
||||
d3.json(`/api/bs/hrmorganization/${extend}/deleteByIds`)
|
||||
.header('Content-Type', 'application/json')
|
||||
.post(JSON.stringify({ ids: nodeData.id }))
|
||||
.then(function (response) {
|
||||
message.success('删除成功');
|
||||
fetch(`/api/bs/hrmorganization/${extend}/deleteByIds`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ ids: nodeData.id }),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
if (res.data.status == '1') {
|
||||
const data = [...gData];
|
||||
loop(data, nodeData.key, (item, index, arr) => {
|
||||
arr.splice(index, 1);
|
||||
});
|
||||
setGData(data);
|
||||
message.success('删除成功', 2);
|
||||
} else {
|
||||
message.warning(res.data.message, 2);
|
||||
}
|
||||
}
|
||||
})
|
||||
.catch(function (error) {
|
||||
.catch((error) => {
|
||||
message.error('接口异常,请联系管理员');
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 封存
|
||||
* @param {*} nodeData
|
||||
*/
|
||||
const onCancel = (nodeData) => {
|
||||
const extend = nodeData.type == '1' ? 'comp' : 'dept';
|
||||
fetch(`/api/bs/hrmorganization/${extend}/updateForbiddenTagById`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({
|
||||
id: nodeData.id,
|
||||
canceled: nodeData.canceled != '0',
|
||||
}),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
const data = [...gData];
|
||||
loop(data, nodeData.key, (item, index, arr) => {
|
||||
arr.splice(index, 1);
|
||||
});
|
||||
setGData(data);
|
||||
message.success('封存成功', 2);
|
||||
} else {
|
||||
message.warning(res.msg, 2);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error('接口异常,请联系管理员');
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 合并
|
||||
* @param {*} nodeData
|
||||
*/
|
||||
const onMerge = (nodeData) => {
|
||||
if (childRef.current) {
|
||||
childRef.current.getTreeData();
|
||||
}
|
||||
setMergeId(nodeData.id);
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
const onMergeCreate = (values) => {
|
||||
let params = {
|
||||
department: values.department.substring(1),
|
||||
mergeName: values.mergeName,
|
||||
id: mergeId.substring(1),
|
||||
};
|
||||
fetch('/api/bs/hrmorganization/dept/mergeDepartment', {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify(params),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
message.success('合并成功', 2);
|
||||
} else {
|
||||
message.warning(res.msg, 2);
|
||||
}
|
||||
setOpen(false);
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error('接口异常,请联系管理员');
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 复制
|
||||
* @param {*} nodeData
|
||||
*/
|
||||
const onCopy = (nodeData) => {
|
||||
setCopyOpen(true);
|
||||
setCopyId(nodeData.id);
|
||||
};
|
||||
|
||||
const onCopyCreate = (values) => {
|
||||
fetch(`/api/bs/hrmorganization/dept/copyDepartment`, {
|
||||
method: 'POST',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
body: JSON.stringify({ ...values, ids: copyId }),
|
||||
})
|
||||
.then((response) => response.json())
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
setCopyOpen(false);
|
||||
message.success('复制成功', 2);
|
||||
} else {
|
||||
message.warning(res.msg, 2);
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
message.error('接口异常,请联系管理员');
|
||||
});
|
||||
};
|
||||
|
||||
const onTitleRender = (nodeData) => {
|
||||
let extend = nodeData.type == '1' ? 'companyExtend' : 'departmentExtend';
|
||||
let attr = nodeData.type == '1' ? 'none' : 'inline-block';
|
||||
let attr =
|
||||
nodeData.type == '1' || nodeData.canceled == '1'
|
||||
? 'none'
|
||||
: 'inline-block';
|
||||
let icon = nodeData.type == '1' ? <HomeOutlined /> : <FolderOutlined />;
|
||||
return (
|
||||
<div>
|
||||
<span>
|
||||
{icon}
|
||||
<span style={{ marginLeft: '5px' }}>{nodeData.title}</span>
|
||||
</span>
|
||||
<div id="drag-button-ops">
|
||||
<span
|
||||
className="drag-button"
|
||||
onClick={() =>
|
||||
window.open(
|
||||
`/spa/organization/static/index.html#/main/organization/${extend}/${nodeData.id}`,
|
||||
'_blank',
|
||||
)
|
||||
}
|
||||
>
|
||||
查看
|
||||
<>
|
||||
{nodeData.type == 0 ? (
|
||||
<span>
|
||||
{' '}
|
||||
<ClusterOutlined />
|
||||
<span style={{ marginLeft: '5px' }}>{nodeData.title}</span>
|
||||
</span>
|
||||
<span className="drag-button" onClick={onDelete(nodeData)}>
|
||||
删除
|
||||
</span>
|
||||
<span className="drag-button" onClick={onDelete(nodeData)}>
|
||||
封存
|
||||
</span>
|
||||
<span style={{ display: attr }} className="drag-button">
|
||||
合并
|
||||
</span>
|
||||
<span style={{ display: attr }} className="drag-button">
|
||||
复制
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<span>
|
||||
{icon}
|
||||
<span style={{ marginLeft: '5px' }}>{nodeData.title}</span>
|
||||
</span>
|
||||
<div id="drag-button-ops">
|
||||
<span
|
||||
className="drag-button"
|
||||
onClick={() =>
|
||||
window.open(
|
||||
`/spa/organization/static/index.html#/main/organization/${extend}/${nodeData.id}`,
|
||||
'_blank',
|
||||
)
|
||||
}
|
||||
>
|
||||
查看
|
||||
</span>
|
||||
<Popconfirm
|
||||
title={`确认要删除 [${nodeData.title}] 吗?`}
|
||||
onConfirm={() => onDelete(nodeData)}
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
>
|
||||
<span className="drag-button">删除</span>
|
||||
</Popconfirm>
|
||||
<Popconfirm
|
||||
title={`确认要封存或恢复 [${nodeData.title}] 吗?`}
|
||||
onConfirm={() => onCancel(nodeData)}
|
||||
okText="确认"
|
||||
cancelText="取消"
|
||||
>
|
||||
<span className="drag-button">
|
||||
{nodeData.canceled == '0' ? '封存' : '恢复'}
|
||||
</span>
|
||||
</Popconfirm>
|
||||
<span
|
||||
style={{ display: attr }}
|
||||
className="drag-button"
|
||||
onClick={() => onMerge(nodeData)}
|
||||
>
|
||||
合并
|
||||
</span>
|
||||
<span
|
||||
style={{ display: attr }}
|
||||
className="drag-button"
|
||||
onClick={() => onCopy(nodeData)}
|
||||
>
|
||||
复制
|
||||
</span>
|
||||
</div>
|
||||
</>
|
||||
)}
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
return (
|
||||
<Tree
|
||||
className="draggable-tree"
|
||||
defaultExpandedKeys={expandedKeys}
|
||||
draggable
|
||||
icon={false}
|
||||
blockNode
|
||||
onDragEnter={onDragEnter}
|
||||
onDrop={onDrop}
|
||||
treeData={gData}
|
||||
titleRender={onTitleRender}
|
||||
/>
|
||||
<>
|
||||
<ApartmentOutlined
|
||||
style={{ color: showCanceled == 0 ? '#1890ff' : '#eb2f96' }}
|
||||
onClick={() => {
|
||||
const value = showCanceled == 0 ? 1 : 0;
|
||||
setShowCanceled(value);
|
||||
getMoveTree(value);
|
||||
}}
|
||||
/>
|
||||
<Spin tip={tip} spinning={loading}>
|
||||
<Tree
|
||||
className="draggable-tree"
|
||||
defaultExpandedKeys={expandedKeys}
|
||||
draggable
|
||||
icon={false}
|
||||
blockNode
|
||||
onDragEnter={onDragEnter}
|
||||
onDrop={onDrop}
|
||||
treeData={gData}
|
||||
titleRender={onTitleRender}
|
||||
/>
|
||||
<MergeDialog
|
||||
ref={childRef}
|
||||
open={open}
|
||||
onCreate={onMergeCreate}
|
||||
onCancel={() => {
|
||||
setOpen(false);
|
||||
}}
|
||||
/>
|
||||
{/* <CopyDialog open={copyopen}
|
||||
onCreate={onCopyCreate}
|
||||
onCancel={() => {
|
||||
setCopyOpen(false);
|
||||
}}/> */}
|
||||
</Spin>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default DragTree;
|
||||
|
|
|
|||
|
|
@ -18,6 +18,10 @@
|
|||
display: inline-block;
|
||||
}
|
||||
|
||||
.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper {
|
||||
color: rgba(0, 0, 0, 0.85);
|
||||
}
|
||||
|
||||
#drag-button-ops {
|
||||
display: none;
|
||||
width: 500px;
|
||||
|
|
|
|||
|
|
@ -99,7 +99,7 @@ export default function userPage() {
|
|||
// 获取数据
|
||||
useEffect(() => {
|
||||
document.cookie =
|
||||
'ecology_JSessionid=aaaqxkKrIiwa59VyYrwMy; JSESSIONID=aaaqxkKrIiwa59VyYrwMy; loginidweaver=1; languageidweaver=7; loginuuids=1; __randcode__=61884b51-d206-4953-8fd2-78cfc6cc7044';
|
||||
'ecology_JSessionid=aaaUMPsdM5DKIgXzYrwMy; JSESSIONID=aaaUMPsdM5DKIgXzYrwMy; __randcode__=f5b6cc86-28ff-416b-bc87-569246714d54; loginidweaver=1; languageidweaver=7; loginuuids=1';
|
||||
d3.json(
|
||||
// "/user/data"
|
||||
'/api/bs/hrmorganization/orgchart/userData?fclass=0&fisvitual=0&root=0&level=3&id=0',
|
||||
|
|
|
|||
Loading…
Reference in New Issue