diff --git a/dist.zip b/dist.zip index a35ae0b..1fa52e3 100644 Binary files a/dist.zip and b/dist.zip differ diff --git a/src/components/dialog/copyDialog.jsx b/src/components/dialog/copyDialog.jsx index 3e3d296..16f0a7e 100644 --- a/src/components/dialog/copyDialog.jsx +++ b/src/components/dialog/copyDialog.jsx @@ -1,25 +1,39 @@ -import { Form, Input, Modal, TreeSelect, message } from 'antd'; -import React, { useState, useEffect } from 'react'; +import { Form, Input, Modal, TreeSelect, message, Checkbox } from 'antd'; +import React, { + useState, + useEffect, + useRef, + forwardRef, + useImperativeHandle, +} from 'react'; import * as d3 from 'd3'; import './index.less'; +import { HomeOutlined } from '@ant-design/icons'; +import './index.less'; const layout = { - labelCol: { span: 6 }, + labelCol: { span: 8 }, wrapperCol: { span: 14 }, }; -const CopyDialog = ({ open, onCreate, onCancel }) => { +const CopyDialog = forwardRef(({ open, onCreate, onCancel }, ref) => { + const [treeData, setData] = useState([]); const [form] = Form.useForm(); + const formRef = useRef(null); - const [treeData, setData] = useState([]); - console.log(treeData); - useEffect(() => { - d3.json('/api/bs/hrmorganization/orgchart/getSubCompanyTree').then( - (data) => { - setData(data.companyTree); - }, - ); - }, [true]); + useImperativeHandle(ref, () => ({ + getTreeData() { + form.resetFields(); + d3.json('/api/bs/hrmorganization/orgchart/getSubCompanyTree').then( + (data) => { + data.companyTree.map((item, index) => { + item.icon = ; + }); + setData(data.companyTree); + }, + ); + }, + })); /** * 根节点树异步加载 @@ -33,7 +47,9 @@ const CopyDialog = ({ open, onCreate, onCancel }) => { d3.json( `/api/bs/hrmorganization/orgchart/getSubCompanyTree?subcompany=${id}`, ).then((data) => { - debugger; + data.companyTree.map((item, index) => { + item.icon = ; + }); let arr = [...treeData, ...data.companyTree]; setData(arr); }); @@ -44,7 +60,7 @@ const CopyDialog = ({ open, onCreate, onCancel }) => { return ( { }); }} > -
+ - +
); -}; +}); export default CopyDialog; diff --git a/src/components/dialog/index.less b/src/components/dialog/index.less index b286550..1e3cc83 100644 --- a/src/components/dialog/index.less +++ b/src/components/dialog/index.less @@ -1,3 +1,5 @@ -.ant-tree .ant-tree-treenode-disabled .ant-tree-node-content-wrapper { - color: #222526; +.ant-select-tree + .ant-select-tree-treenode-disabled + .ant-select-tree-node-content-wrapper { + color: rgba(0, 0, 0, 0.85); } diff --git a/src/components/dialog/mergeDialog.jsx b/src/components/dialog/mergeDialog.jsx index 7c9cb59..1cb38e3 100644 --- a/src/components/dialog/mergeDialog.jsx +++ b/src/components/dialog/mergeDialog.jsx @@ -8,6 +8,8 @@ import React, { } from 'react'; import * as d3 from 'd3'; import './index.less'; +import { HomeOutlined, FolderOutlined } from '@ant-design/icons'; +import './index.less'; const layout = { labelCol: { span: 6 }, @@ -19,11 +21,16 @@ const MergeDialog = forwardRef(({ open, onCreate, onCancel }, ref) => { const [form] = Form.useForm(); const formRef = useRef(null); + const [treeLine, setTreeLine] = useState(true); + useImperativeHandle(ref, () => ({ getTreeData() { form.resetFields(); d3.json('/api/bs/hrmorganization/orgchart/getDepartmentTree').then( (data) => { + data.departmentTree.map((item, index) => { + item.icon = ; + }); setData(data.departmentTree); }, ); @@ -42,6 +49,13 @@ const MergeDialog = forwardRef(({ open, onCreate, onCancel }, ref) => { d3.json( `/api/bs/hrmorganization/orgchart/getDepartmentTree?subcompany=${id}`, ).then((data) => { + data.departmentTree.map((item, index) => { + if (item.key.indexOf('d') > -1) { + item.icon = ; + } else { + item.icon = ; + } + }); let arr = [...treeData, ...data.departmentTree]; setData(arr); }); @@ -79,12 +93,14 @@ const MergeDialog = forwardRef(({ open, onCreate, onCancel }, ref) => { ]} > diff --git a/src/pages/dragTree.jsx b/src/pages/dragTree.jsx index 37acab6..09bd176 100644 --- a/src/pages/dragTree.jsx +++ b/src/pages/dragTree.jsx @@ -17,7 +17,8 @@ const DragTree = () => { const [gData, setGData] = useState([]); const [expandedKeys, setExpandedKeys] = useState([undefined]); const childRef = useRef(null); - const [tip, setTip] = useState('正在加载...'); + const copyChildRef = useRef(null); + const [tip, setTip] = useState('正在加载,请稍候...'); const [loading, setLoading] = useState(false); const [showCanceled, setShowCanceled] = useState(0); @@ -30,10 +31,10 @@ const DragTree = () => { getMoveTree(0); }, [true]); - const getMoveTree = (showCanceled) => { + const getMoveTree = (showCanceled, expandedKeys = '') => { setLoading(true); d3.json( - `/api/bs/hrmorganization/orgchart/getMovingTree?showCanceled=${showCanceled}`, + `/api/bs/hrmorganization/orgchart/getMovingTree?showCanceled=${showCanceled}&expandedKeys=${expandedKeys}`, ).then((data) => { setGData(data.movingTree); setExpandedKeys(data.expandedKeys); @@ -122,6 +123,7 @@ const DragTree = () => { } } setGData(data); + message.success('转移成功', 2); } else { message.warning(res.msg, 2); } @@ -145,7 +147,7 @@ const DragTree = () => { headers: { 'Content-Type': 'application/json', }, - body: JSON.stringify({ ids: nodeData.id }), + body: JSON.stringify({ ids: nodeData.id.substring(1) }), }) .then((response) => response.json()) .then((res) => { @@ -179,7 +181,7 @@ const DragTree = () => { 'Content-Type': 'application/json', }, body: JSON.stringify({ - id: nodeData.id, + id: nodeData.id.substring(1), canceled: nodeData.canceled != '0', }), }) @@ -229,6 +231,7 @@ const DragTree = () => { .then((response) => response.json()) .then((res) => { if (res.code == 200) { + getMoveTree(0, values.department); message.success('合并成功', 2); } else { message.warning(res.msg, 2); @@ -245,6 +248,9 @@ const DragTree = () => { * @param {*} nodeData */ const onCopy = (nodeData) => { + if (copyChildRef.current) { + copyChildRef.current.getTreeData(); + } setCopyOpen(true); setCopyId(nodeData.id); }; @@ -255,12 +261,13 @@ const DragTree = () => { headers: { 'Content-Type': 'application/json', }, - body: JSON.stringify({ ...values, ids: copyId }), + body: JSON.stringify({ ...values, ids: copyId.substring(1) }), }) .then((response) => response.json()) .then((res) => { if (res.code == 200) { setCopyOpen(false); + getMoveTree(0, values.company); message.success('复制成功', 2); } else { message.warning(res.msg, 2); @@ -282,7 +289,6 @@ const DragTree = () => { <> {nodeData.type == 0 ? ( - {' '} {nodeData.title} @@ -290,14 +296,25 @@ const DragTree = () => { <> {icon} - {nodeData.title} + + {nodeData.title} + {nodeData.canceled == '1' ? ( + + (已封存) + + ) : ( + '' + )} +
window.open( - `/spa/organization/static/index.html#/main/organization/${extend}/${nodeData.id}`, + `/spa/organization/static/index.html#/main/organization/${extend}/${nodeData.id.substring( + 1, + )}`, '_blank', ) } @@ -343,12 +360,17 @@ const DragTree = () => { ); }; + const onExpand = (info) => { + setExpandedKeys(info); + }; + return ( <> { const value = showCanceled == 0 ? 1 : 0; + setTip('正在加载,请稍候...'); setShowCanceled(value); getMoveTree(value); }} @@ -356,7 +378,9 @@ const DragTree = () => { { setOpen(false); }} /> - {/* { - setCopyOpen(false); - }}/> */} + { + setCopyOpen(false); + }} + /> );