261 lines
9.9 KiB
JavaScript
261 lines
9.9 KiB
JavaScript
import {
|
||
inject,
|
||
observer
|
||
} from 'mobx-react';
|
||
import {
|
||
WeaUpload,
|
||
WeaDialog,
|
||
WeaSelect,
|
||
WeaNewScroll,
|
||
WeaMoreButton,
|
||
WeaSearchGroup,
|
||
} from 'ecCom'
|
||
import {
|
||
WeaSwitch
|
||
} from 'comsMobx';
|
||
import {
|
||
Row,
|
||
Col,
|
||
Spin,
|
||
Button,
|
||
} from 'antd'
|
||
import {
|
||
IEVersion
|
||
} from '../../public/pulic-func'
|
||
import {
|
||
i18n
|
||
} from '../../public/i18nbk';
|
||
|
||
import ImportResult from './ImportResult'
|
||
import ImportHistory from './ImportHistory'
|
||
|
||
@inject('hrmImportCommon')
|
||
@observer
|
||
export default class Import extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = {
|
||
width: 870,
|
||
height: 510,
|
||
list: [],
|
||
upStatus: '',
|
||
}
|
||
}
|
||
|
||
getForm = () => {
|
||
const {
|
||
hrmImportCommon
|
||
} = this.props, {
|
||
importDialog
|
||
} = hrmImportCommon, {
|
||
condition,
|
||
form,
|
||
} = importDialog, {
|
||
isFormInit
|
||
} = form;
|
||
|
||
let _arr = [];
|
||
isFormInit && condition.map((c, i) => {
|
||
let arr = [];
|
||
if (i == 0) { //基本信息
|
||
c.items.map((field, index) => {
|
||
let key = field.domkey[0];
|
||
let url = field.value ? field.value : '';
|
||
arr.push({
|
||
com: (
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@u3pg88@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@d34g4z@${index}`} span={1} offset={6}>
|
||
<div className='hrm-import-circle' style={{paddingLeft: IEVersion() == '-1' ? 6 : 7, marginTop: 15}}>
|
||
<div style={{paddingTop: (IEVersion() == '11' || IEVersion() == 'edge') ? 5 : 2}}>{index + 1}</div>
|
||
</div>
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@h1ko2g@${index}`} span={14}>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@3swbr9@${index}`} style={{marginTop: 15}}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@55ag3k@${index}`} span={field.labelcol}>{field.label.length > 14 ? `${field.label.slice(0, 14)}...` : field.label}:</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@qyfneu@${index}`} span={field.fieldcol}>
|
||
{this.getElements(key, url, field)}
|
||
</Col>
|
||
</Row>
|
||
</Col>
|
||
</Row>
|
||
),
|
||
colSpan: 1,
|
||
})
|
||
})
|
||
}
|
||
if (i == 1) { //导入说明
|
||
c.items.map((field, index) => {
|
||
let p = field.value;
|
||
let url = field.link ? field.link : '';
|
||
arr.push({
|
||
com: (
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@r3k3h0@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2yfn9e@${index}`} span={1} offset={6} style={{marginTop: 15}}>
|
||
<div className='hrm-import-circle' style={{paddingLeft: IEVersion() == '-1' ? 6 : 7, paddingLeft: (index > 8) ? 3 : 6}}>
|
||
<div style={{paddingTop: (IEVersion() == '11' || IEVersion() == 'edge') ? 5 : 2}}>{index + 1}</div>
|
||
</div>
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@z6k87f@${index}`} span={14} style={{marginTop: 15}}>
|
||
{this.getImportInstructions(p, url, index)}
|
||
</Col>
|
||
</Row>
|
||
),
|
||
colSpan: 1
|
||
})
|
||
})
|
||
}
|
||
_arr.push(<div style={{color: '#484848'}}><WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@a3rsv9@${i}`} needTigger={true} title={c.title} showGroup={c.defaultshow} items={arr} col={1} /></div>)
|
||
});
|
||
return _arr;
|
||
}
|
||
|
||
getElements = (key, url, field) => {
|
||
const {
|
||
hrmImportCommon
|
||
} = this.props, {
|
||
setExcelFileNo,
|
||
importDialog,
|
||
setSelectedValue
|
||
} = hrmImportCommon, {
|
||
templetName,
|
||
selectedValue,
|
||
form,
|
||
} = importDialog, {
|
||
upStatus,
|
||
list
|
||
} = this.state;
|
||
|
||
let dom;
|
||
if (key == 'templet') {
|
||
dom = this.getTempletElement(url, selectedValue, templetName);
|
||
} else if (key == 'excelfile') {
|
||
dom = (<div>
|
||
<div style={{float: 'left',marginTop: -10}}>
|
||
<WeaUpload ecId={`${this && this.props && this.props.ecId || ''}_WeaUpload@lcyams`}
|
||
uploadUrl='/api/doc/upload/uploadFile'
|
||
category='string'
|
||
limitType='xls'
|
||
datas={upStatus === 'uploaded' ? list : []}
|
||
onChange={(id, list) => {this.setState({list:list}); setExcelFileNo(id)}}
|
||
onUploading={status => this.handleUploading(status)}
|
||
>
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@hmrzeo`}>{i18n.button.selectFile()}</Button>
|
||
</WeaUpload>
|
||
</div>
|
||
<div style={{float: 'left', paddingLeft: 10}}>
|
||
{ list.length == 0 ? <p>{i18n.label.noFileSelected()}</p> : list.map(file => <p>{file.filename}</p>) }
|
||
</div>
|
||
</div>)
|
||
} else {
|
||
dom = <WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@tsac1c`} fieldConfig={field} form={form} formParams={form.getFormParams()} />
|
||
}
|
||
return dom;
|
||
}
|
||
|
||
getImportInstructions = (val, url, index) => {
|
||
const {
|
||
hrmImportCommon
|
||
} = this.props, {
|
||
importDialog
|
||
} = hrmImportCommon, {
|
||
templetName,
|
||
selectedValue,
|
||
} = importDialog;
|
||
|
||
let p;
|
||
if (index == 0) {
|
||
let dom = this.getTempletElement(url, selectedValue, templetName);
|
||
p = (<p>{i18n.label.downloadTemplateFirst()}：{dom}</p>);
|
||
} else {
|
||
p = (<p>{val}</p>);
|
||
}
|
||
return p;
|
||
}
|
||
|
||
getTempletElement = (url, selectedValue, templetName) => {
|
||
let dom;
|
||
let urlArr = url.split(';');
|
||
if (urlArr.length > 1) {
|
||
if (selectedValue == 'workcode') {
|
||
dom = <a href={urlArr[0]}>{templetName}</a>;
|
||
} else {
|
||
dom = <a href={urlArr[1]}>{templetName}</a>;
|
||
}
|
||
} else {
|
||
dom = <a href={url}>{templetName}</a>;
|
||
}
|
||
return dom
|
||
}
|
||
|
||
handleUploading = (status) => {
|
||
this.setState({
|
||
upStatus: status
|
||
});
|
||
|
||
if (status == 'uploading') {
|
||
this.setState({
|
||
list: []
|
||
});
|
||
}
|
||
}
|
||
|
||
getButtons = () => {
|
||
const {
|
||
hrmImportCommon
|
||
} = this.props, {
|
||
submitExcel,
|
||
queryRecord,
|
||
importDialog,
|
||
} = hrmImportCommon, {
|
||
upStatus
|
||
} = this.state;
|
||
|
||
return [
|
||
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@2fiagn@1`} type="primary" disabled={upStatus === 'uploaded' ? false : true} onClick={() => submitExcel()}>{i18n.button.submit()}</Button>),
|
||
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@q04w9s@2`} type="primary" onClick={() => queryRecord()}>{i18n.button.importHistoryQuery()}</Button>),
|
||
(<WeaMoreButton ecId={`${this && this.props && this.props.ecId || ''}_WeaMoreButton@oizt3r@3`} />)
|
||
];
|
||
}
|
||
|
||
render() {
|
||
const {
|
||
hrmImportCommon
|
||
} = this.props, {
|
||
importDialog,
|
||
resultDialog,
|
||
recordDialog,
|
||
setImportDialogVisible
|
||
} = hrmImportCommon, {
|
||
visible,
|
||
title,
|
||
loading
|
||
} = importDialog, {
|
||
width,
|
||
height,
|
||
} = this.state;
|
||
|
||
return (
|
||
<div>
|
||
<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@79hw9l`}
|
||
title={title}
|
||
icon="icon-coms-hrm"
|
||
iconBgcolor="#217346"
|
||
visible={visible}
|
||
closable={true}
|
||
onCancel={() => setImportDialogVisible(false) }
|
||
buttons={this.getButtons()}
|
||
style={{width: width, height: height}}
|
||
onChangeHeight={(h) => this.setState({height: h})}
|
||
>
|
||
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@qa42zo`} spinning={loading}>
|
||
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@vcz1bi`} height={height}>
|
||
{this.getForm()}
|
||
</WeaNewScroll>
|
||
</Spin>
|
||
</WeaDialog>
|
||
{resultDialog.visible && <ImportResult ecId={`${this && this.props && this.props.ecId || ''}_ImportResult@fd6jt3`} />}
|
||
{recordDialog.visible && <ImportHistory ecId={`${this && this.props && this.props.ecId || ''}_ImportHistory@weby4j`} />}
|
||
</div>
|
||
)
|
||
}
|
||
} |