@ -21,7 +21,7 @@ const { TextArea } = Input;
import moment from 'moment' ; import moment from 'moment' ;
import 'moment/locale/zh-cn' ; import 'moment/locale/zh-cn' ;
import locale from 'antd/lib/date-picker/locale/zh_CN' ; import locale from 'antd/lib/date-picker/locale/zh_CN' ;
import { HomeOutlined } from '@ant-design/icons' ; import { HomeOutlined , FolderOpenOutlined } from '@ant-design/icons' ;
moment . locale ( 'zh-cn' ) ; moment . locale ( 'zh-cn' ) ;
export class TopBar extends React . Component { export class TopBar extends React . Component {
@ -32,12 +32,15 @@ export class TopBar extends React.Component {
rootTreeData : [ ] , / / 根 节 点 异 步 树
rootTreeData : [ ] , / / 根 节 点 异 步 树
treeLoadedKeys : [ ] ,
treeLoadedKeys : [ ] ,
treeExpandedKeys : [ ] ,
treeExpandedKeys : [ ] ,
deptTreeData : [ ] ,
requestData : {
requestData : {
fclass : '0' ,
fclass : '0' ,
root : undefined ,
root : undefined ,
level : '2' ,
department : undefined ,
level : '3' ,
fisvitual : '0' ,
fisvitual : '0' ,
hidedept : '0' ,
hidedept : '0' ,
showClass : '0' , / / 班 组 显 示 0 不 显 示
} ,
} ,
open : false ,
open : false ,
confirmLoading : false ,
confirmLoading : false ,
@ -156,6 +159,29 @@ export class TopBar extends React.Component {
this . getSeatchCondition ( this . props . url ) ;
this . getSeatchCondition ( this . props . url ) ;
}
}
/ * *
* 部门节点树
* /
getDeptTreeData = ( url ) => {
fetch ( url )
. then ( ( res ) => res . json ( ) )
. then ( ( data ) => {
if ( data . api _status ) {
let arr = [ ... data . departmentTree ] ;
arr . map ( ( item , index ) => {
item . icon = < FolderOpenOutlined / > ;
} ) ;
this . setState ( {
deptTreeData : arr ,
} ) ;
}
} ) ;
} ;
onDeptChange = ( value , label , extra ) => {
this . handleFormChange ( { department : value } ) ;
} ;
getSeatchCondition = ( url ) => {
getSeatchCondition = ( url ) => {
fetch ( url )
fetch ( url )
. then ( ( res ) => res . json ( ) )
. then ( ( res ) => res . json ( ) )
@ -163,10 +189,14 @@ export class TopBar extends React.Component {
data . companyTree . map ( ( item , index ) => {
data . companyTree . map ( ( item , index ) => {
item . icon = < HomeOutlined / > ;
item . icon = < HomeOutlined / > ;
} ) ;
} ) ;
this . handleFormChange ( { root : data . root } ) ;
this . setState ( {
this . setState ( {
fclasslist : data . fclasslist ,
fclasslist : data . fclasslist ,
rootTreeData : data . companyTree ,
rootTreeData : data . companyTree ,
} ) ;
} ) ;
this . getDeptTreeData (
` /api/bs/hrmorganization/orgchart/getDepartmentTree?fclass=0&subcompany= ${ data . root } ` ,
) ;
} ) ;
} ) ;
} ;
} ;
@ -188,50 +218,27 @@ export class TopBar extends React.Component {
render ( ) {
render ( ) {
const { disabled , type } = this . props ;
const { disabled , type } = this . props ;
const { rootTreeData , open , confirmLoading , treeExpandedKeys } = this . state ;
const {
rootTreeData ,
open ,
confirmLoading ,
treeExpandedKeys ,
requestData ,
deptTreeData ,
} = this . state ;
const { fclass , department , root , showClass } = requestData ;
return (
return (
< div className = { style . topbarWrapper } >
< div className = { style . topbarWrapper } >
< Row >
< Row >
< Col span = { 6 } >
< Col span = { 6 } >
维度 ：
所属分部 ：
< Select
defaultValue = "0"
style = { { width : 140 } }
value = { this . state . requestData . fclass }
onChange = { ( value ) => {
const requestData = {
fclass : value ,
root : undefined ,
level : '2' ,
fisvitual : '0' ,
hidedept : '0' ,
} ;
this . handleFormChange ( requestData ) ;
this . setState ( {
rootTreeData : [ ] ,
} ) ;
this . getNodeTreeNode (
` /api/bs/hrmorganization/orgchart/getSubCompanyTree?fclass= ${ value } ` ,
false ,
) ;
this . props . changeFclass ( requestData ) ;
} }
>
{ this . state . fclasslist . map ( ( item ) => (
< Option key = { item . key } value = { item . id } >
{ item . companyname }
< / Option >
) ) }
< / Select >
< / Col >
< Col span = { 6 } >
根节点 ：
< TreeSelect
< TreeSelect
disabled
treeDataSimpleMode
treeDataSimpleMode
allowClear
allowClear
style = { { width : '75%' } }
style = { { width : '75%' } }
value = { this . state . requestData . root }
value = { root }
dropdownStyle = { { maxHeight : 400 , overflow : 'auto' } }
dropdownStyle = { { maxHeight : 400 , overflow : 'auto' } }
placeholder = "请选择根节点"
placeholder = "请选择根节点"
onChange = { this . onRootChange }
onChange = { this . onRootChange }
@ -240,6 +247,29 @@ export class TopBar extends React.Component {
treeIcon
treeIcon
/ >
/ >
< / Col >
< / Col >
< Col span = { 6 } >
< Checkbox
style = { { marginTop : '5px' , marginLeft : 60 } }
checked = { showClass == '1' }
onChange = { ( e ) =>
this . handleFormChange ( {
showClass : e . target . checked ? '1' : '0' ,
} )
}
>
显示班组
< / Checkbox >
< Tooltip
title = "提示:开启后将显示班组信息"
color = "#0082fb"
placement = "rightTop"
>
< QuestionCircleOutlined
style = { { color : '#0082fb' , cursor : 'pointer' , fontSize : 16 } }
/ >
< / Tooltip >
< / Col >
< Col span = { 6 } >
< Col span = { 6 } >
< Checkbox
< Checkbox
style = { { marginTop : '5px' , marginLeft : 100 } }
style = { { marginTop : '5px' , marginLeft : 100 } }
@ -279,39 +309,20 @@ export class TopBar extends React.Component {
< / Row >
< / Row >
< Row style = { { marginTop : '15px' } } >
< Row style = { { marginTop : '15px' } } >
< Col span = { 6 } >
< Col span = { 6 } >
< Checkbox
部门节点 ：
style = { { marginTop : '5px' } }
< TreeSelect
checked = { this . state . requestData . fisvitual == '1' }
treeDataSimpleMode
onChange = { ( e ) =>
allowClear
this . handleFormChange ( {
style = { { width : '75%' } }
fisvitual : e . target . checked ? '1' : '0' ,
value = { department }
} )
dropdownStyle = { { maxHeight : 400 , overflow : 'auto' } }
}
placeholder = "请选择"
>
onChange = { this . onDeptChange }
显示虚拟组织
treeData = { deptTreeData }
< / Checkbox >
treeIcon
< Tooltip
title = "提示:若启用虚拟组织，需要在分部自定义表增加字段(名称 fblx) 字段类型 下拉框(0实体 1虚拟) 部门自定义表同上(字段名称 bmlx)。"
color = "#0082fb"
placement = "rightTop"
>
< QuestionCircleOutlined
style = { { color : '#0082fb' , cursor : 'pointer' , fontSize : 16 } }
/ >
/ >
< / Tooltip >
< / Col >
< / Col >
< Col span = { 16 } >
< Col span = { 8 } style = { { textAlign : 'center' } } >
< Button
type = "primary"
style = { { marginRight : '10px' } }
disabled = { disabled }
onClick = { ( ) => {
this . setState ( { open : true } ) ;
} }
>
版本记录
< / Button >
< Button
< Button
type = "primary"
type = "primary"
style = { { marginRight : '10px' } }
style = { { marginRight : '10px' } }
