组织架构图v3
This commit is contained in:
parent
a0d095eec8
commit
5ee9c3c67c
|
|
@ -27,7 +27,7 @@ export default class DrawerComponents extends React.Component {
|
|||
open: false,
|
||||
data: [],
|
||||
detailType: 'chart',
|
||||
rootId: '',
|
||||
params: {},
|
||||
dataSource: [],
|
||||
columns: [],
|
||||
spinning: true,
|
||||
|
|
@ -62,11 +62,11 @@ export default class DrawerComponents extends React.Component {
|
|||
}
|
||||
|
||||
//获取数据
|
||||
getDeatilDatas(rootId, type = 'chart', showJob = '1') {
|
||||
getDeatilDatas(params, type = 'chart', showJob = '1') {
|
||||
this.setState({ spinning: true });
|
||||
d3.json(
|
||||
'/api/bs/hrmorganization/orgchart/getDepartmentDetail?' +
|
||||
qs.stringify({ detauleType: type, rootId: rootId, showJob }),
|
||||
qs.stringify({ detauleType: type, ...params, showJob }),
|
||||
).then((data) => {
|
||||
//
|
||||
if (type == 'chart') {
|
||||
|
|
@ -298,9 +298,10 @@ export default class DrawerComponents extends React.Component {
|
|||
}
|
||||
};
|
||||
|
||||
showDrawer = (rootId) => {
|
||||
this.getDeatilDatas(rootId);
|
||||
this.setState({ open: true, rootId: rootId });
|
||||
showDrawer = (params) => {
|
||||
const showJob = params.fclass == '0' ? '1' : '0';
|
||||
this.getDeatilDatas(params, 'chart', showJob);
|
||||
this.setState({ open: true, params: params });
|
||||
};
|
||||
|
||||
onClose = () => {
|
||||
|
|
@ -308,17 +309,18 @@ export default class DrawerComponents extends React.Component {
|
|||
};
|
||||
|
||||
changeDetail = () => {
|
||||
const { detailType, rootId } = this.state;
|
||||
const { detailType, params } = this.state;
|
||||
let type = detailType == 'chart' ? 'table' : 'chart';
|
||||
const showJob = params.fclass == '0' ? '1' : '0';
|
||||
this.setState({
|
||||
detailType: type,
|
||||
});
|
||||
this.getDeatilDatas(rootId, type);
|
||||
this.getDeatilDatas(params, type, showJob);
|
||||
};
|
||||
|
||||
render() {
|
||||
const {
|
||||
rootId,
|
||||
params,
|
||||
open,
|
||||
data,
|
||||
detailType,
|
||||
|
|
@ -330,7 +332,7 @@ export default class DrawerComponents extends React.Component {
|
|||
let arr = [];
|
||||
if (detailType == 'chart') {
|
||||
arr.push({ label: '导出图片', key: '1' });
|
||||
arr.push({ label: '导出PDF', key: '2' });
|
||||
//arr.push({ label: '导出PDF', key: '2' });
|
||||
} else {
|
||||
arr.push({ label: '导出表格', key: '3' });
|
||||
}
|
||||
|
|
@ -348,23 +350,25 @@ export default class DrawerComponents extends React.Component {
|
|||
}}
|
||||
extra={
|
||||
<Space>
|
||||
<Checkbox
|
||||
style={{ marginTop: '5px', marginLeft: 100 }}
|
||||
checked={showJob}
|
||||
onChange={(e) => {
|
||||
this.setState({
|
||||
showJob: e.target.checked,
|
||||
});
|
||||
detailType == 'chart' &&
|
||||
{detailType == 'chart' && params && params.fclass == '0' && (
|
||||
<Checkbox
|
||||
style={{ marginTop: '5px', marginLeft: 100 }}
|
||||
checked={showJob}
|
||||
onChange={(e) => {
|
||||
this.setState({
|
||||
showJob: e.target.checked,
|
||||
});
|
||||
|
||||
this.getDeatilDatas(
|
||||
rootId,
|
||||
params,
|
||||
detailType,
|
||||
e.target.checked ? '1' : '0',
|
||||
);
|
||||
}}
|
||||
>
|
||||
是否显示岗位
|
||||
</Checkbox>
|
||||
}}
|
||||
>
|
||||
是否显示岗位
|
||||
</Checkbox>
|
||||
)}
|
||||
<Dropdown overlay={menu}>
|
||||
<Button type="primary">导出</Button>
|
||||
</Dropdown>
|
||||
|
|
|
|||
|
|
@ -64,21 +64,29 @@ export class TopBar extends React.Component {
|
|||
return message.error('请填写描述信息');
|
||||
}
|
||||
this.setState({ confirmLoading: true });
|
||||
setTimeout(() => {
|
||||
this.setState({ open: false, confirmLoading: false, description: '' });
|
||||
message.success('版本记录成功,请重新刷新页面');
|
||||
}, 2000);
|
||||
// let api = '/api/bs/hrmorganization/orgchart/synchronousData?flcass='+requestData.fclass+ '&description=' +description;
|
||||
// fetch(api)
|
||||
// .then((res) => res.json())
|
||||
// .then((data) => {
|
||||
// if (data.code == 200) {
|
||||
// this.setState({ open: false, confirmLoading: false,description:'' });
|
||||
// message.success('版本记录成功,请重新刷新页面');
|
||||
// } else {
|
||||
// message.error('版本记录失败,请联系相关人员处理数据');
|
||||
// }
|
||||
// });
|
||||
// setTimeout(() => {
|
||||
// this.setState({ open: false, confirmLoading: false, description: '' });
|
||||
// message.success('版本记录成功,请重新刷新页面');
|
||||
// }, 2000);
|
||||
let api =
|
||||
'/api/bs/hrmorganization/orgchart/versionRecord?fclass=' +
|
||||
requestData.fclass +
|
||||
'&description=' +
|
||||
description;
|
||||
fetch(api)
|
||||
.then((res) => res.json())
|
||||
.then((data) => {
|
||||
if (data.api_status) {
|
||||
this.setState({
|
||||
open: false,
|
||||
confirmLoading: false,
|
||||
description: '',
|
||||
});
|
||||
message.success('版本记录成功,请重新刷新页面', 2, 3);
|
||||
} else {
|
||||
message.error('版本记录失败,请联系相关人员处理数据', 2, 3);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
handleExportMenuClick(e) {
|
||||
|
|
@ -166,10 +174,10 @@ export class TopBar extends React.Component {
|
|||
label: '导出图片',
|
||||
key: '1',
|
||||
},
|
||||
{
|
||||
label: '导出PDF',
|
||||
key: '2',
|
||||
},
|
||||
// {
|
||||
// label: '导出PDF',
|
||||
// key: '2',
|
||||
// },
|
||||
]}
|
||||
/>
|
||||
);
|
||||
|
|
@ -191,7 +199,7 @@ export class TopBar extends React.Component {
|
|||
const requestData = {
|
||||
fclass: value,
|
||||
root: undefined,
|
||||
level: '3',
|
||||
level: '2',
|
||||
fisvitual: '0',
|
||||
};
|
||||
this.handleFormChange(requestData);
|
||||
|
|
@ -214,7 +222,7 @@ export class TopBar extends React.Component {
|
|||
<TreeSelect
|
||||
treeDataSimpleMode
|
||||
allowClear
|
||||
style={{ width: '80%' }}
|
||||
style={{ width: '75%' }}
|
||||
value={this.state.requestData.root}
|
||||
dropdownStyle={{ maxHeight: 400, overflow: 'auto' }}
|
||||
placeholder="请选择根节点"
|
||||
|
|
@ -297,7 +305,7 @@ export class TopBar extends React.Component {
|
|||
onCancel={() => this.setState({ open: false })}
|
||||
>
|
||||
<p style={{ color: 'red' }}>
|
||||
提示:版本操作耗时较长,请谨慎操作(版本仅记录当前维度的数据)
|
||||
提示:版本记录耗时较长,请谨慎操作(仅记录当前维度的数据版本)
|
||||
</p>
|
||||
<p>主题:</p>
|
||||
<TextArea
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import styles from './index.less';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import React, { useEffect, useState, useRef } from 'react';
|
||||
import { OrgChartComponent } from '@/components/orgChart';
|
||||
import * as d3 from 'd3';
|
||||
import { TopBar } from '../components/topBar';
|
||||
|
|
@ -15,24 +15,34 @@ let active = 'top';
|
|||
let drawerCom = null;
|
||||
let timeLine = null;
|
||||
let orgChart = null;
|
||||
let topbar = null;
|
||||
|
||||
export default function companyPage() {
|
||||
let topbar = null;
|
||||
const [data, setData] = useState(null);
|
||||
const [sliderProgress, setSliderProgress] = useState(50);
|
||||
let addNodeChildFunc = null;
|
||||
|
||||
let topBarSearchRequest = null;
|
||||
const [hasRight, setHasRight] = useState('');
|
||||
const [id, setId] = useState(0);
|
||||
const [timelineId, setTimelineId] = useState(0);
|
||||
const infoRef = useRef();
|
||||
|
||||
useEffect(() => {
|
||||
infoRef.current = timelineId;
|
||||
}, [timelineId]);
|
||||
const [spinning, setSpinning] = useState(false);
|
||||
|
||||
// 点击节点
|
||||
function onNodeClick(node) {
|
||||
const onNodeClick = (node) => {
|
||||
if (node.ftype == '2') {
|
||||
drawerCom.showDrawer(node.id);
|
||||
const params = {
|
||||
rootId: node.id,
|
||||
fclass: topbar.state.requestData.fclass,
|
||||
id: infoRef.current,
|
||||
};
|
||||
drawerCom.showDrawer(params);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
// 扩展按钮点击
|
||||
const onButtonClick = (event, d) => {
|
||||
|
|
@ -86,7 +96,7 @@ export default function companyPage() {
|
|||
// 获取数据
|
||||
useEffect(() => {
|
||||
d3.json(
|
||||
'/api/bs/hrmorganization/orgchart/companyData?fclass=0&fisvitual=0&root=0&level=3&id=0',
|
||||
'/api/bs/hrmorganization/orgchart/companyData?fclass=0&fisvitual=0&root=0&level=2&id=0',
|
||||
).then((data) => {
|
||||
setData(data.data);
|
||||
setHasRight(data?.hasRight);
|
||||
|
|
@ -263,8 +273,15 @@ export default function companyPage() {
|
|||
* @param {*} timeline
|
||||
*/
|
||||
const timeLineSearch = (timeline) => {
|
||||
setId(timeline.id);
|
||||
let requestData = { ...topbar.state.requestData, id: timeline.id };
|
||||
setTimelineId(timeline.id);
|
||||
const fclass = topbar.state.requestData.fclass;
|
||||
const resetParams = { root: undefined, level: '2', fisvitual: '0' };
|
||||
topbar.handleFormChange({ ...resetParams });
|
||||
topbar.getNodeTreeNode(
|
||||
`/api/bs/hrmorganization/orgchart/getSubCompanyTree?fclass=${fclass}&id=${timeline.id}`,
|
||||
false,
|
||||
);
|
||||
let requestData = { fclass: fclass, id: timeline.id, ...resetParams };
|
||||
handleSearch(requestData, false);
|
||||
};
|
||||
|
||||
|
|
@ -275,7 +292,7 @@ export default function companyPage() {
|
|||
const handleSearch = (requestData, cache = true) => {
|
||||
setSpinning(true);
|
||||
if (cache) {
|
||||
requestData = { ...requestData, id: id };
|
||||
requestData = { ...requestData, id: infoRef.current };
|
||||
}
|
||||
topBarSearchRequest = requestData;
|
||||
let api =
|
||||
|
|
@ -301,10 +318,12 @@ export default function companyPage() {
|
|||
* @param {*} requestData
|
||||
*/
|
||||
const handleChange = (requestData) => {
|
||||
setTimelineId(0);
|
||||
timeLine.searchTimeLines(
|
||||
`/api/bs/hrmorganization/orgchart/timeLines?fclass=${requestData.fclass}`,
|
||||
);
|
||||
handleSearch(requestData);
|
||||
requestData = { ...requestData, id: 0 };
|
||||
handleSearch(requestData, false);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
|
|
|
|||
|
|
@ -99,7 +99,7 @@ export default function userPage() {
|
|||
// 获取数据
|
||||
useEffect(() => {
|
||||
document.cookie =
|
||||
'ecology_JSessionid=aaazPUne5WAU1eB9vTfKy; JSESSIONID=aaazPUne5WAU1eB9vTfKy; Systemlanguid=7; languageidweaver=7; loginuuids=1; loginidweaver=sysadmin; __randcode__=7f4710ea-50a3-4552-8193-57269840d388';
|
||||
'ecology_JSessionid=aaapuc_tMLwUT4NtMrnLy; JSESSIONID=aaapuc_tMLwUT4NtMrnLy; Systemlanguid=7; languageidweaver=7; loginuuids=1; __randcode__=7e56748f-fcc0-41fd-aac7-44d6bce54bad; loginidweaver=sysadmin';
|
||||
d3.json(
|
||||
// "/user/data"
|
||||
'/api/bs/hrmorganization/orgchart/userData?fclass=0&fisvitual=0&root=0&level=3&id=0',
|
||||
|
|
|
|||
Loading…
Reference in New Issue