141 lines
3.9 KiB
JavaScript
141 lines
3.9 KiB
JavaScript
import React from 'react'
|
|
import {
|
|
toJS
|
|
} from 'mobx'
|
|
import {
|
|
inject,
|
|
observer,
|
|
} from 'mobx-react'
|
|
import {
|
|
WeaTop,
|
|
WeaAlertPage,
|
|
} from 'ecCom'
|
|
import {
|
|
Spin,
|
|
} from 'antd';
|
|
import {
|
|
i18n
|
|
} from '../../public/i18n';
|
|
|
|
import '../../style/import.css';
|
|
import {addContentPath} from '../../util/index.js';
|
|
import StepDialog from './stepDialog';
|
|
|
|
|
|
@inject("newImport")
|
|
@observer
|
|
export default class newImport extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = ({
|
|
title:'基础数据导入',
|
|
|
|
})
|
|
}
|
|
|
|
componentWillMount() {
|
|
|
|
}
|
|
|
|
componentDidMount() {
|
|
|
|
}
|
|
|
|
|
|
getImportCard = () => {
|
|
const {
|
|
newImport
|
|
} = this.props, {
|
|
isMouseOver,
|
|
curIndex,
|
|
cardConfig,
|
|
setMouseStatus,
|
|
} = newImport;
|
|
|
|
let arr = [];
|
|
|
|
cardConfig.map((c, index) => {
|
|
arr.push(<div className='hrm-card-out' style={(index == 0 || index == 4) ? {marginLeft:0} : {}} onMouseEnter={() => setMouseStatus(index, true)} onMouseLeave={() => setMouseStatus(index, false)}>
|
|
<div className='hrm-card-inwrap' style={curIndex==index&&isMouseOver?{backgroundColor:'#858585'}:{backgroundColor:c.bgColor}}>
|
|
{ curIndex == index && isMouseOver ? this.getLinkName(c.linkName,index) : this.getIcon(c.icon)}
|
|
{ curIndex == index && isMouseOver ? this.getSubTitle(c.subTitle,c.url) : this.getTitle(c.title)}
|
|
</div>
|
|
</div>)
|
|
});
|
|
return arr;
|
|
}
|
|
|
|
getIcon = (icon) => {
|
|
return (<div className='hrm-card-icon'>
|
|
<i className={icon} />
|
|
</div>)
|
|
}
|
|
|
|
getTitle = (title) => {
|
|
return (<div className='hrm-card-title'>{title}</div>)
|
|
}
|
|
|
|
getLinkName = (linkName, index) => {
|
|
return (<div style={{width:'100%',height:95}}>
|
|
<div style={{textAlign:'center',paddingTop:45}}>
|
|
<a onClick={()=>this.handleClick(index)} style={{color:'#fff',textDecoration: 'underline',fontSize:15}}>{linkName}</a>
|
|
</div>
|
|
</div>)
|
|
}
|
|
|
|
getSubTitle = (subTitle, url) => {
|
|
return (<div style={{height:35,textAlign:'right',paddingRight:10,backgroundColor:'#6A6A6A',color: '#fff',paddingTop:5}}><a href={addContentPath(url)} target='_blank' className='hrm-import-link'>{subTitle}</a></div>)
|
|
}
|
|
|
|
handleClick = (index) => {
|
|
const {
|
|
newImport
|
|
} = this.props, {
|
|
} = newImport;
|
|
switch (index) {
|
|
case 0:
|
|
newImport.importType = 'company';
|
|
break;
|
|
case 1:
|
|
newImport.importType = 'department';
|
|
break;
|
|
case 2:
|
|
newImport.importType = 'jobtitle';
|
|
break;
|
|
case 3:
|
|
newImport.importType = 'resource';
|
|
break;
|
|
}
|
|
newImport.buttonTitle = i18n.button.nextStep();
|
|
newImport.current = 0;
|
|
newImport.visible = true;
|
|
newImport.getImportField();
|
|
|
|
|
|
}
|
|
|
|
|
|
render() {
|
|
const {
|
|
newImport,
|
|
} = this.props,{
|
|
visible
|
|
} = newImport,{
|
|
title,
|
|
} = this.state;
|
|
|
|
return (
|
|
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@sp0zb8`}
|
|
title={title}
|
|
icon={<i className='icon-coms-hrm' />}
|
|
iconBgcolor='#217346'
|
|
loading={true}
|
|
showDropIcon={true}
|
|
>
|
|
<div className='hrm-import-wrap'>{this.getImportCard()}</div>
|
|
{visible && <StepDialog ecId={`${this && this.props && this.props.ecId || ''}_StepDialog@633i8k`}/>}
|
|
</WeaTop>
|
|
)
|
|
}
|
|
|
|
} |