364 lines
14 KiB
JavaScript
364 lines
14 KiB
JavaScript
import {
|
||
inject,
|
||
observer
|
||
} from 'mobx-react';
|
||
import {
|
||
WeaUpload,
|
||
WeaDialog,
|
||
WeaFormItem,
|
||
WeaSearchGroup,
|
||
WeaNewScroll,
|
||
WeaSelect,
|
||
WeaInput
|
||
} from 'ecCom'
|
||
|
||
import {
|
||
Row,
|
||
Col,
|
||
Button,
|
||
Spin
|
||
} from 'antd'
|
||
|
||
import {
|
||
WeaSwitch
|
||
} from 'comsMobx'
|
||
import React from 'react'
|
||
import ImportResult from './ImportResult'
|
||
import ImportHistory from './ImportHistory'
|
||
import {
|
||
WeaLocaleProvider
|
||
} from 'ecCom';
|
||
import {
|
||
i18n
|
||
} from '../../public/i18n';
|
||
import {addContentPath} from '../../util/index.js'
|
||
import '../../style/common.less'
|
||
|
||
@inject('hrmImportResource')
|
||
@observer
|
||
export default class ImportResource extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
}
|
||
|
||
componentDidMount() {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
hrmImportResource.list = [];
|
||
}
|
||
|
||
getCircle() {
|
||
let style = {
|
||
width: 20,
|
||
height: 20,
|
||
backgroundColor: '#D8D8D8',
|
||
webkitBorderRadius: 10,
|
||
mozBorderRadius: 10,
|
||
msBorderRadius: 10,
|
||
oBorderRadius: 10,
|
||
borderRadius: 10,
|
||
//paddingLeft: 6,
|
||
textAlign: 'center',
|
||
}
|
||
return style;
|
||
}
|
||
|
||
getForm() {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
const {
|
||
condition
|
||
} = hrmImportResource;
|
||
let _arr = [];
|
||
|
||
condition.map((c, i) => {
|
||
let arr = [];
|
||
if (i == 0) { //基本信息
|
||
c.items.map((field, index) => {
|
||
arr.push({
|
||
com: (
|
||
<div>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@m9t2kn@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@rc5who@${index}`} span={1} offset={4}>
|
||
<div style={{ marginTop: 15 }}>
|
||
<div style={this.getCircle()}><div style={{ paddingTop: 2 }}>{index + 1}</div></div>
|
||
</div>
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@f1sc6s@${index}`} span={14}>
|
||
<div style={{ marginTop: 15 }}>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@5gsx6o@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@qrdxst@${index}`} span={field.labelcol} style={{overflow: 'hidden',whiteSpace: 'nowrap',textOverflow: 'ellipsis'}} title={field.label}>{field.label}:</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@7jy5um@${index}`} span={field.fieldcol}>
|
||
{this.getDom(field)}
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
),
|
||
colSpan: 1,
|
||
})
|
||
})
|
||
}
|
||
if (i == 1) { //导入说明
|
||
c.items.map((field, index) => {
|
||
arr.push({
|
||
com: (
|
||
<div>
|
||
<Row ecId={`${this && this.props && this.props.ecId || ''}_Row@hz50xl@${index}`}>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@fgfbrv@${index}`} span={1} offset={4} style={{ marginTop: 15 }}>
|
||
<div style={this.getCircle()}>
|
||
<div style={{ paddingTop: 2 }}>{index + 1}</div>
|
||
</div>
|
||
</Col>
|
||
<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@5rom81@${index}`} span={17} style={{ marginTop: 15 }}>
|
||
{this.getIllustration(field.value, field.link, index, field)}
|
||
</Col>
|
||
</Row>
|
||
</div>
|
||
),
|
||
colSpan: 1
|
||
})
|
||
})
|
||
}
|
||
_arr.push(<div><WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@bo47pp@${i}`} needTigger={true} title={c.title} showGroup={c.defaultshow} items={arr} col={1} /></div>)
|
||
|
||
});
|
||
return _arr;
|
||
}
|
||
|
||
getDom(field) {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
const {
|
||
templetName,
|
||
filelist,
|
||
getTemplateUrl,
|
||
importParams
|
||
} = hrmImportResource;
|
||
let dom;
|
||
let domkey = field.domkey;
|
||
if (domkey[0] == 'templet') {
|
||
dom = <a href={addContentPath(field.value)}>{i18n.label.importTemplate()}</a>;
|
||
} else if (domkey[0] === 'exportData') {
|
||
const href = hrmImportResource.operateType === 'add' ? field.otherParams.fileVal[0].add : field.otherParams.fileVal[0].update;
|
||
if(hrmImportResource.importType === 'matrix'){
|
||
dom = <a onClick={() => {
|
||
getTemplateUrl(hrmImportResource.otherParams.matrixid, hrmImportResource.operateType, importParams)
|
||
}}>{i18n.label.importTemplate()}</a>
|
||
}else
|
||
dom = <a href={addContentPath(href)}>{i18n.label.importTemplate()}</a>;
|
||
} else if (domkey[0] == 'excelfile' || domkey[0] == 'importfile') {
|
||
dom = (<div>
|
||
<div style={{ float: 'left', marginTop: -10 }}>
|
||
<WeaUpload ecId={`${this && this.props && this.props.ecId || ''}_WeaUpload@iu8n01`}
|
||
uploadUrl='/api/doc/upload/uploadFile'
|
||
category='string'
|
||
limitType='xls,xlsx'
|
||
maxFilesNumber={1}
|
||
datas={filelist}
|
||
{...field.otherParams}
|
||
onChange = {
|
||
(ids, list) => {
|
||
this.setFileId(ids, list)
|
||
}
|
||
} >
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@87232v`}>{i18n.button.selectFile()}</Button>
|
||
</WeaUpload>
|
||
</div>
|
||
<div style={{ float: 'left', paddingLeft: 10 }}>
|
||
{filelist.length == 0 ? <p>{i18n.label.noFileSelected()}</p> : filelist.map(file => <p>{file.filename}</p>)}
|
||
</div>
|
||
</div>)
|
||
} else if (domkey[0].indexOf('keyField') > -1) {
|
||
const vals = field.options.filter(v => v.selected == true);
|
||
let val = '';
|
||
vals.length>0 && (val = vals[0].key);
|
||
dom = <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@yzc92h`}
|
||
style={{width: 200}}
|
||
options={field.options}
|
||
value={hrmImportResource.importParams[domkey[0]] || field.value || val}
|
||
onChange={(v) => {
|
||
hrmImportResource.setParam(domkey[0], v)
|
||
}}
|
||
/>
|
||
} else if (domkey[0] == 'importType') {
|
||
dom = <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@holhhb`}
|
||
style={{width: 200}}
|
||
options={field.options}
|
||
value={hrmImportResource.operateType}
|
||
onChange={(v) => {
|
||
hrmImportResource.operateType = v
|
||
}}
|
||
/>
|
||
} else {
|
||
dom = <WeaInput ecId={`${this && this.props && this.props.ecId || ''}_WeaInput@rg6f3p`} hasBorder={true} viewAttr={1} value={field.value}/>
|
||
}
|
||
return dom;
|
||
}
|
||
|
||
getIllustration(val, url, index, link) {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
const {
|
||
templetName,
|
||
getTemplateUrl,
|
||
importParams
|
||
} = hrmImportResource;
|
||
let p;
|
||
if (index == 0) {
|
||
if (url instanceof Object) {
|
||
const href = hrmImportResource.operateType === 'add' ? url.add : url.update;
|
||
let dom;
|
||
if(hrmImportResource.importType === 'matrix'){
|
||
dom = <a onClick={() => {
|
||
getTemplateUrl(hrmImportResource.otherParams.matrixid, hrmImportResource.operateType, importParams)
|
||
}}>{i18n.label.importTemplate()}</a>
|
||
}else
|
||
dom = <a href={addContentPath(href)}>{i18n.label.importTemplate()}</a>;
|
||
p = (<p>{i18n.label.downLoadTemplete()}：{dom}</p>);
|
||
} else if (url != null) {
|
||
if(hrmImportResource.importType === 'matrix'){
|
||
p = (<p>{i18n.label.downLoadTemplete()}：<a onClick={() => {
|
||
getTemplateUrl(hrmImportResource.otherParams.matrixid, hrmImportResource.operateType)
|
||
}}>{i18n.label.importTemplate()}</a></p>);
|
||
}else
|
||
p = (<p>{i18n.label.downLoadTemplete()}：<a href={addContentPath(url)}>{i18n.label.importTemplate()}</a></p>);
|
||
} else {
|
||
p = (<p><div dangerouslySetInnerHTML={{ __html: val }} /></p>);
|
||
}
|
||
} else {
|
||
p = (<p><div dangerouslySetInnerHTML={{ __html: val }} /></p>);
|
||
}
|
||
return p;
|
||
}
|
||
|
||
setFileId(ids, list) {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
hrmImportResource.excelfile = ids;
|
||
hrmImportResource.filelist = list;
|
||
}
|
||
|
||
onUploading(s) {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
hrmImportResource.status = s;
|
||
}
|
||
|
||
submit() {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
hrmImportResource.saveImport({}, () => {
|
||
this.refs.scroll && this.refs.scroll.scrollToLast()
|
||
});
|
||
}
|
||
|
||
cancel() {
|
||
const {
|
||
hrmImportResource,
|
||
onClose
|
||
} = this.props;
|
||
hrmImportResource.visible = false
|
||
hrmImportResource.init();
|
||
onClose && onClose();
|
||
}
|
||
|
||
importHistoryQuery() {
|
||
const {
|
||
hrmImportResource
|
||
} = this.props;
|
||
hrmImportResource.visibleHistory = true;
|
||
hrmImportResource.getImportHistory();
|
||
}
|
||
|
||
render() {
|
||
const {
|
||
hrmImportResource,
|
||
mainTitle,
|
||
importLog,
|
||
viewLog,
|
||
viewLogTitle,
|
||
} = this.props;
|
||
const {
|
||
title,
|
||
visible,
|
||
titleResult,
|
||
visibleResult,
|
||
importResultColumns,
|
||
importProcessLogDatas,
|
||
failnum,
|
||
succnum,
|
||
importResultTip,
|
||
importResultStore,
|
||
importStatus,
|
||
errorInfo,
|
||
setScrollRef,
|
||
single,
|
||
showLoadingSpin,
|
||
condition
|
||
} = hrmImportResource;
|
||
const buttons = condition.length ? [
|
||
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@ip7b32`} type="primary" onClick={() => this.submit()}>{i18n.button.submit()}</Button>),
|
||
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@itogxo`} type="primary" onClick={() => this.importHistoryQuery()}>{importLog || i18n.button.importHistoryQuery()}</Button>),
|
||
] : [];
|
||
|
||
let dialogHeight = window.innerHeight - 150;
|
||
if (dialogHeight > 560) dialogHeight = 560;
|
||
|
||
return (
|
||
<div>
|
||
{
|
||
single && visible ?
|
||
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@mkyv9k`} height={'100%'} ref="scrollBar">
|
||
{this.getForm()}
|
||
</WeaNewScroll>
|
||
:
|
||
<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@s55z5q`}
|
||
title={mainTitle || title}
|
||
icon="icon-coms-hrm"
|
||
iconBgcolor="#217346"
|
||
visible={visible}
|
||
closable={true}
|
||
onCancel={() => this.cancel()}
|
||
buttons={buttons}
|
||
style={{ width: 870, height: dialogHeight }}
|
||
moreBtn={{datas:condition ? [{
|
||
key: '1',
|
||
content: i18n.button.submit(),
|
||
icon: <i className='icon-coms-Preservation'/>,
|
||
onClick: () => this.submit(),
|
||
},
|
||
{
|
||
key: '2',
|
||
content: importLog || i18n.button.importHistoryQuery(),
|
||
icon: <i className='icon-coms-Preservation'/>,
|
||
onClick: () => this.importHistoryQuery(),
|
||
}
|
||
]: []}}
|
||
>
|
||
{ condition.length ? (
|
||
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@1fvd3j`} spinning={showLoadingSpin}>
|
||
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@2908z2`} height={dialogHeight} ref="scrollBar">
|
||
{this.getForm()}
|
||
</WeaNewScroll>
|
||
</Spin>
|
||
): ''}
|
||
</WeaDialog>
|
||
}
|
||
|
||
<ImportResult ecId={`${this && this.props && this.props.ecId || ''}_ImportResult@66ry2w`} {...this.props} />
|
||
<ImportHistory ecId={`${this && this.props && this.props.ecId || ''}_ImportHistory@72i8fh`} {...this.props} />
|
||
</div>
|
||
)
|
||
}
|
||
}
|