@ -18,6 +18,7 @@ import { message } from 'antd';
import jsPDF from 'jspdf' ;
import jsPDF from 'jspdf' ;
import ExportJsonExcel from 'js-export-excel' ;
import ExportJsonExcel from 'js-export-excel' ;
import './index.less' ;
import './index.less' ;
import { i18n } from '../../util/i18n.js' ;
let addNodeChildFunc = null ;
let addNodeChildFunc = null ;
let orgChart = null ;
let orgChart = null ;
@ -45,6 +46,7 @@ export default class DrawerComponents extends React.Component {
/ / 点 击 节 点
/ / 点 击 节 点
onNodeClick = ( node ) => {
onNodeClick = ( node ) => {
if ( node . ftype == '4' ) {
if ( node . ftype == '4' ) {
debugger ;
this . setState ( {
this . setState ( {
jobResponsibility : node . jobResponsibility ,
jobResponsibility : node . jobResponsibility ,
isModalOpen : true ,
isModalOpen : true ,
@ -76,6 +78,7 @@ export default class DrawerComponents extends React.Component {
/ / 获 取 数 据
/ / 获 取 数 据
getDeatilDatas ( params , type = 'chart' , showJob = '1' ) {
getDeatilDatas ( params , type = 'chart' , showJob = '1' ) {
const { language } = this . props ;
this . setState ( { spinning : true } ) ;
this . setState ( { spinning : true } ) ;
d3 . json (
d3 . json (
'/api/bs/hrmorganization/orgchart/getDepartmentDetail?' +
'/api/bs/hrmorganization/orgchart/getDepartmentDetail?' +
@ -85,7 +88,49 @@ export default class DrawerComponents extends React.Component {
if ( type == 'chart' ) {
if ( type == 'chart' ) {
this . setState ( { data : data . data , spinning : false } ) ;
this . setState ( { data : data . data , spinning : false } ) ;
} else {
} else {
this . setState ( { dataSource : data . dataSource , columns : data . columns } ) ;
let columns = [
{
dataIndex : 'id' ,
key : 'id' ,
title : ` ${ i18n . table . no [ language ] } ` ,
} ,
{
dataIndex : 'workCode' ,
key : 'workCode' ,
title : ` ${ i18n . table . workCode [ language ] } ` ,
} ,
{
dataIndex : 'lastName' ,
key : 'lastName' ,
title : ` ${ i18n . table . lastName [ language ] } ` ,
} ,
{
dataIndex : 'sex' ,
key : 'sex' ,
title : ` ${ i18n . table . gender [ language ] } ` ,
} ,
{
dataIndex : 'departmentName' ,
key : 'departmentName' ,
title : ` ${ i18n . table . department [ language ] } ` ,
} ,
{
dataIndex : 'subcompanyName' ,
key : 'subcompanyName' ,
title : ` ${ i18n . table . company [ language ] } ` ,
} ,
{
dataIndex : 'jobTitle' ,
key : 'jobTitle' ,
title : ` ${ i18n . table . possition [ language ] } ` ,
} ,
{
dataIndex : 'mobile' ,
key : 'mobile' ,
title : ` ${ i18n . table . mobile [ language ] } ` ,
} ,
] ;
this . setState ( { dataSource : data . dataSource , columns : columns } ) ;
}
}
} ) ;
} ) ;
}
}
@ -177,6 +222,7 @@ export default class DrawerComponents extends React.Component {
} ;
} ;
handleExport = ( e ) => {
handleExport = ( e ) => {
const { language } = this . props ;
let type = e . key == '1' ? 'png' : e . key == '1' ? 'pdf' : 'excel' ;
let type = e . key == '1' ? 'png' : e . key == '1' ? 'pdf' : 'excel' ;
if ( type == 'png' ) {
if ( type == 'png' ) {
orgChart && orgChart . exportImg ( { full : true } ) ;
orgChart && orgChart . exportImg ( { full : true } ) ;
@ -203,7 +249,7 @@ export default class DrawerComponents extends React.Component {
}
}
}
}
}
}
option . fileName = '组织信息' ;
option . fileName = ` ${ i18n . table . orgInfo [ language ] } ` ;
option . datas = [
option . datas = [
{
{
sheetData : dataTable ,
sheetData : dataTable ,
@ -219,14 +265,14 @@ export default class DrawerComponents extends React.Component {
'手机号' ,
'手机号' ,
] ,
] ,
sheetHeader : [
sheetHeader : [
'序号' ,
i18n . table . no [ language ] ,
'工号' ,
i18n . table . workCode [ language ] ,
'姓名' ,
i18n . table . lastName [ language ] ,
'性别' ,
i18n . table . gender [ language ] ,
'部门' ,
i18n . table . department [ language ] ,
'分部' ,
i18n . table . company [ language ] ,
'岗位' ,
i18n . table . possition [ language ] ,
'手机号' ,
i18n . table . mobile [ language ] ,
] ,
] ,
} ,
} ,
] ;
] ;
@ -239,6 +285,8 @@ export default class DrawerComponents extends React.Component {
* 节点渲染
* 节点渲染
* /
* /
nodeContentRender = ( d , i , arr , state ) => {
nodeContentRender = ( d , i , arr , state ) => {
const { language } = this . props ;
if ( d . data . ftype == 2 ) {
if ( d . data . ftype == 2 ) {
return ` <div style="position: relative;">
return ` <div style="position: relative;">
< div style = " height: 152px;background-size: 100% 100%;box-sizing: border-box;padding-top: 30px;position:relative;z-index:2" >
< div style = " height: 152px;background-size: 100% 100%;box-sizing: border-box;padding-top: 30px;position:relative;z-index:2" >
@ -260,11 +308,13 @@ export default class DrawerComponents extends React.Component {
$ { d . data . fname }
$ { d . data . fname }
< / div >
< / div >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Bold, Microsoft YaHei;color: #333333;height: 25px;line-height: 25px;" >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Bold, Microsoft YaHei;color: #333333;height: 25px;line-height: 25px;" >
负责人 : $ { d . data . fleader }
$ { i18n . head [ language ] } : $ { d . data . fleader }
< / div >
< / div >
< div style = "display:flex" >
< div style = "display:flex" >
< div style = "height: 25px; line-height: 25px; min-width: 80px;" >
< div style = "height: 25px; line-height: 25px; min-width: 80px;" >
在岗 : $ { d . data . fonjob } 人
$ { i18n . onJob [ language ] } : $ { d . data . fonjob } $ {
i18n . onJob [ language ] == 'cn' ? '人' : ''
}
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
@ -279,9 +329,13 @@ export default class DrawerComponents extends React.Component {
< / div >
< / div >
< img src = "./img/user-card/jobicon-orange.png" style = "margin-left: 20px; vertical-align: top;" / >
< img src = "./img/user-card/jobicon-orange.png" style = "margin-left: 20px; vertical-align: top;" / >
< div style = "display: inline-block; margin-left: 15px;" >
< div style = "display: inline-block; margin-left: 15px;" >
< div style = "font-size: 15px;height: 25px;line-height: 25px;font-family: Microsoft YaHei-Bold, Microsoft YaHei;font-weight: bold;color: #333333;" > $ { d . data . fname } < / div >
< div style = "font-size: 15px;height: 25px;line-height: 25px;font-family: Microsoft YaHei-Bold, Microsoft YaHei;font-weight: bold;color: #333333;" > $ {
d . data . fname
} < / div >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;display: flex;height: 25px;line-height: 25px;" >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;display: flex;height: 25px;line-height: 25px;" >
< span > 在岗 : $ { d . data . fonjob } 人 < / span >
< span > $ { i18n . onJob [ language ] } : $ { d . data . fonjob } $ {
i18n . onJob [ language ] == 'cn' ? '人' : ''
} < / span >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
@ -307,8 +361,10 @@ export default class DrawerComponents extends React.Component {
} < / div >
} < / div >
< / div >
< / div >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;height: 25px;line-height: 25px;" >
< div style = "font-size: 13px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;height: 25px;line-height: 25px;" >
< span > 司龄 : $ { d . data . companyWorkYear } 年 < / span >
< span > $ { i18n . serveAge [ language ] } : $ {
< div > 岗位 : $ { d . data . jobTitle } < / div >
d . data . companyWorkYear
} $ { i18n . year [ language ] } < / span >
< div > $ { i18n . postion [ language ] } : $ { d . data . jobTitle } < / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
@ -347,6 +403,8 @@ export default class DrawerComponents extends React.Component {
} ;
} ;
render ( ) {
render ( ) {
const { language } = this . props ;
const {
const {
params ,
params ,
open ,
open ,
@ -362,17 +420,17 @@ export default class DrawerComponents extends React.Component {
} = this . state ;
} = this . state ;
let arr = [ ] ;
let arr = [ ] ;
if ( detailType == 'chart' ) {
if ( detailType == 'chart' ) {
arr . push ( { label : '导出图片' , key : '1' } ) ;
arr . push ( { label : ` ${ i18n . exportImage [ language ] } ` , key : '1' } ) ;
/ / a r r . p u s h ( { l a b e l : ' 导 出 P D F ' , k e y : ' 2 ' } ) ;
/ / a r r . p u s h ( { l a b e l : ' 导 出 P D F ' , k e y : ' 2 ' } ) ;
} else {
} else {
arr . push ( { label : '导出表格' , key : '3' } ) ;
arr . push ( { label : ` ${ i18n . exportTable [ language ] } ` , key : '3' } ) ;
}
}
const menu = < Menu onClick = { this . handleExport . bind ( this ) } items = { arr } / > ;
const menu = < Menu onClick = { this . handleExport . bind ( this ) } items = { arr } / > ;
return (
return (
< Drawer
< Drawer
title = "详细信息"
title = { i18n . detailInfo [ language ] }
width = { 1100 }
width = { 1100 }
onClose = { this . onClose }
onClose = { this . onClose }
open = { open }
open = { open }
@ -397,11 +455,11 @@ export default class DrawerComponents extends React.Component {
) ;
) ;
} }
} }
>
>
是否显示岗位
{ i18n . showJob [ language ] }
< / Checkbox >
< / Checkbox >
) }
) }
< Dropdown overlay = { menu } >
< Dropdown overlay = { menu } >
< Button type = "primary" > 导出 < / Button >
< Button type = "primary" > { i18n . export [ language ] } < / Button >
< / Dropdown >
< / Dropdown >
< img
< img
style = { { width : 36 , height : 36 , cursor : 'pointer' } }
style = { { width : 36 , height : 36 , cursor : 'pointer' } }
@ -440,13 +498,16 @@ export default class DrawerComponents extends React.Component {
jump _to : '跳至' ,
jump _to : '跳至' ,
page : '页' ,
page : '页' ,
} ,
} ,
showTotal : ( total ) => ` 共 ${ dataSource . length } 条 ` ,
showTotal : ( total ) =>
language == 'cn'
? ` 共 ${ dataSource . length } 条 `
: ` ${ dataSource . length } ${ i18n . table . records [ language ] } ${ i18n . table . total [ language ] } ` ,
} }
} }
/ >
/ >
< / div >
< / div >
) }
) }
< Modal
< Modal
title = "岗位职责"
title = { ` ${ i18n . postionInfo [ language ] } - ` }
open = { isModalOpen }
open = { isModalOpen }
onCancel = { ( ) => this . setState ( { isModalOpen : false } ) }
onCancel = { ( ) => this . setState ( { isModalOpen : false } ) }
footer = { [
footer = { [
@ -454,7 +515,7 @@ export default class DrawerComponents extends React.Component {
key = "back"
key = "back"
onClick = { ( ) => this . setState ( { isModalOpen : false } ) }
onClick = { ( ) => this . setState ( { isModalOpen : false } ) }
>
>
关闭
{ i18n . close [ language ] }
< / Button > ,
< / Button > ,
< Button
< Button
type = "primary"
type = "primary"
@ -465,7 +526,7 @@ export default class DrawerComponents extends React.Component {
)
)
}
}
>
>
人员详情
{ i18n . employeeInfo [ language ] }
< / Button > ,
< / Button > ,
] }
] }
>
>