333 lines
16 KiB
JavaScript
333 lines
16 KiB
JavaScript
|
import React from 'react';
|
|||
|
|
import { inject, observer } from 'mobx-react';
|
|||
|
|
import { Button, Steps, Spin, Tabs, Modal, message, Icon } from 'antd';
|
|||
|
|
const confirm = Modal.confirm;
|
|||
|
|
const TabPane = Tabs.TabPane;
|
|||
|
|
const Step = Steps.Step;
|
|||
|
|
import { WeaDialog, WeaSearchGroup, WeaTools, WeaTableEdit, WeaNewScroll, WeaFormItem, WeaAlertPage, WeaTab } from 'ecCom';
|
|||
|
|
import { WeaSwitch } from 'comsMobx'
|
|||
|
|
import UploadAvatar from '../../../../pc4public/hrm/uploadAvatar'
|
|||
|
|
import InputBtn from '../../coms/inputBtn'
|
|||
|
|
import CustComp from './CustComp';
|
|||
|
|
import forEach from 'lodash/forEach'
|
|||
|
|
import isEmpty from 'lodash/isEmpty'
|
|||
|
|
const getKey = WeaTools.getKey;
|
|||
|
|
import * as mobx from 'mobx';
|
|||
|
|
const toJS = mobx.toJS;
|
|||
|
|
import { i18n } from '../../public/i18n';
|
|||
|
|
import {addContentPath} from '../../util/index.js'
|
|||
|
|
import { AttachToNumberField } from '../../../../pc4backstage/hrmengine/util/index.js'
|
|||
|
|
|
|||
|
|
const verificationCode = '/weaver/weaver.file.MakeValidateCode?isView=1&validatetype=0&validatenum=4&seriesnum_=';
|
|||
|
|
|
|||
|
|
@inject('hrmAdd')
|
|||
|
|
@observer
|
|||
|
|
class Full extends React.Component {
|
|||
|
|
constructor(props) {
|
|||
|
|
super(props);
|
|||
|
|
|
|||
|
|
this.state = {
|
|||
|
|
time: new Date().getTime()
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
componentWillReceiveProps (nextProps) {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
if ('visible' in this.props && this.props.visible !== nextProps.visible) {
|
|||
|
|
if (nextProps.visible) {
|
|||
|
|
hrmAdd.current = 0;
|
|||
|
|
hrmAdd.canSave = true;
|
|||
|
|
hrmAdd.getHrmResourceAddForm();
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
componentDidMount () {
|
|||
|
|
const dom = $('<Object id="htactx" name="htactx" classid="clsid:FB4EE423-43A4-4AA9-BDE9-4335A6D3C74E" codebase="HTActX.cab#version=1,0,0,1" style="HEIGHT: 0px; WIDTH: 0px"></Object>');
|
|||
|
|
$(document.body).append(dom);
|
|||
|
|
// const {hrmAdd} = this.props;
|
|||
|
|
// const {current} = hrmAdd;
|
|||
|
|
// hrmAdd.current = 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
pre = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { current } = hrmAdd;
|
|||
|
|
this.refs.scrollBar.scrollerToTop();
|
|||
|
|
hrmAdd.current = current - 1;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
next = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { current } = hrmAdd;
|
|||
|
|
hrmAdd.myvalidate(() => {
|
|||
|
|
this.refs.scrollBar.scrollerToTop();
|
|||
|
|
hrmAdd.current = current + 1;
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
save = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
hrmAdd.saveFull(this.refreshVerificationCode);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
onTabChange = (key) => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
hrmAdd.onTabChange(key);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
tableEditChange = (data) => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
hrmAdd.tableEditChange(data);
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
more = () => {
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
openSimplemode = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { openSimplemode } = hrmAdd;
|
|||
|
|
openSimplemode()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
getBtns = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { current, canSave } = hrmAdd;
|
|||
|
|
let btns = [];
|
|||
|
|
const leftbutton = <div className="ext-link" style={{ float: 'left', cursor: 'pointer' }} onClick={this.openSimplemode}>{i18n.button.simpleModle()}<Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@u1u3nk@0`} type="double-right" />
|
|||
|
|
</div>
|
|||
|
|
const pre = <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@x69uwc`} type="primary" disabled={!canSave} onClick={this.pre} >{i18n.button.lastStep()}</Button>;
|
|||
|
|
const next = <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@8ldonn`} type="primary" disabled={!canSave} onClick={this.next} >{i18n.button.nextStep()}</Button>;
|
|||
|
|
const ok = <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@51q98a`} type="primary" disabled={!canSave} onClick={this.save} >{i18n.button.done()}</Button>;
|
|||
|
|
if (current == 0) {
|
|||
|
|
btns = [leftbutton, next];
|
|||
|
|
} else if (current == 3) {
|
|||
|
|
btns = [pre, ok];
|
|||
|
|
} else {
|
|||
|
|
btns = [pre, next];
|
|||
|
|
}
|
|||
|
|
return btns;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
refreshVerificationCode = () => this.setState({ time: new Date().getTime() });
|
|||
|
|
|
|||
|
|
getSearchs = (current) => {
|
|||
|
|
const { time } = this.state;
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { formFull, conditionInfo0, conditionInfo1, conditionInfo2, conditionInfo3 } = hrmAdd;
|
|||
|
|
const { isFormInit } = formFull;
|
|||
|
|
const formParams = formFull.getFormParams();
|
|||
|
|
let group = [];
|
|||
|
|
let target;
|
|||
|
|
if (current < 1) target = conditionInfo0;
|
|||
|
|
if (current === 1) target = conditionInfo1;
|
|||
|
|
if (current === 2) target = conditionInfo2;
|
|||
|
|
if (current === 3) target = conditionInfo3;
|
|||
|
|
window.e9HideFormFieldKeys = [];
|
|||
|
|
isFormInit && target && target.forEach((c, i) => {
|
|||
|
|
let items = [];
|
|||
|
|
c.items.forEach((field, j) => {
|
|||
|
|
let hide = false;
|
|||
|
|
let hideLabel = false;
|
|||
|
|
if (formParams.accounttype == '1' && (field.domkey[0] == 'loginid' || field.domkey[0] == 'password' || field.domkey[0] == 'password1' || field.domkey[0] == 'userUsbType')) hide = true;
|
|||
|
|
if ((!formParams.userUsbType || formParams.userUsbType == '') && (field.domkey[0] == 'tokenKey' || field.domkey[0] == 'serial' || field.domkey[0] == 'usbstate')) hide = true;
|
|||
|
|
if (formParams.userUsbType == '4' && (field.domkey[0] == 'tokenKey' || field.domkey[0] == 'serial')) hide = true;
|
|||
|
|
if (formParams.userUsbType == '2' && field.domkey[0] == 'tokenKey') hide = true;
|
|||
|
|
if (formParams.userUsbType == '3' && field.domkey[0] == 'serial') hide = true;
|
|||
|
|
if ((!formParams.accounttype || formParams.accounttype == '0') && field.domkey[0] == 'belongto') hide = true;
|
|||
|
|
if (field.domkey[0] == 'usbstate') {
|
|||
|
|
hideLabel = true;
|
|||
|
|
}
|
|||
|
|
let dom;
|
|||
|
|
if (field.conditionType == 'RESOURCEIMG') {
|
|||
|
|
const key = getKey(field);
|
|||
|
|
const bindObj = formFull.$(key);
|
|||
|
|
dom = <UploadAvatar ecId={`${this && this.props && this.props.ecId || ''}_UploadAvatar@u0dusd@resourceImg`} {...bindObj.bind()} />
|
|||
|
|
} else if (field.domkey[0] == 'tokenKey') {
|
|||
|
|
const key = getKey(field);
|
|||
|
|
const bindObj = formFull.$(key);
|
|||
|
|
dom = <InputBtn ecId={`${this && this.props && this.props.ecId || ''}_InputBtn@4keiha@tokenKey`} btnText={i18n.label.binding()} {...bindObj.bind()} onBtnClick={hrmAdd.updateKey} />
|
|||
|
|
} else if (field.domkey[0] == 'serial') {
|
|||
|
|
const key = getKey(field);
|
|||
|
|
const bindObj = formFull.$(key);
|
|||
|
|
dom = <InputBtn ecId={`${this && this.props && this.props.ecId || ''}_InputBtn@atqw1s@serial`} btnText={i18n.label.binding()} {...bindObj.bind()} onBtnClick={hrmAdd.updateKey} />
|
|||
|
|
} else if (field.domkey[0] == 'validatecode') {
|
|||
|
|
dom = (
|
|||
|
|
<div>
|
|||
|
|
<div style={{ float: 'left', width: '45%' }}>
|
|||
|
|
<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@lk4mhb`} fieldConfig={field} form={formFull} formParams={formParams} />
|
|||
|
|
</div>
|
|||
|
|
<img style={{ marginLeft: '16px' }} border="0" align='absmiddle' src={addContentPath(`${verificationCode}${time}`)} onClick={this.refreshVerificationCode} title={i18n.label.preview()} />
|
|||
|
|
</div>
|
|||
|
|
)
|
|||
|
|
} else {
|
|||
|
|
dom = <CustComp ecId={`${this && this.props && this.props.ecId || ''}_CustComq@ukb43t@custcomq`} hrmAdd={hrmAdd} fieldConfig={field} form={formFull} formParams={formParams} />;
|
|||
|
|
}
|
|||
|
|
if (c.hide || !isEmpty(field.otherParams) && field.otherParams.hide) {
|
|||
|
|
window.e9HideFormFieldKeys.push(field.domkey[0]);
|
|||
|
|
} else {
|
|||
|
|
items.push({
|
|||
|
|
com: <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@4p8bz8@${j}`}
|
|||
|
|
hideLabel={hideLabel}
|
|||
|
|
label={`${field.label}`}
|
|||
|
|
labelCol={{ span: `${field.labelcol}` }}
|
|||
|
|
wrapperCol={{ span: `${field.fieldcol}` }}>
|
|||
|
|
{dom}
|
|||
|
|
{field.domkey[0] == 'workcode' && <AttachToNumberField ecId={`${this && this.props && this.props.ecId || ''}_AttachToNumberField@jzwjg9`} field={field} form={formFull}/>}
|
|||
|
|
</WeaFormItem>,
|
|||
|
|
colSpan: 1,
|
|||
|
|
hide: hide
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
group.push(<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@uwuq5a@${i}`} className='hrm-center' hide={c.hide}
|
|||
|
|
needTigger={true} title={c.title} showGroup={c.defaultshow} items={items} col={1} />)
|
|||
|
|
});
|
|||
|
|
return group;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
handleTable = (datas) => {
|
|||
|
|
return datas && datas.map(data => {
|
|||
|
|
const {tabinfo:{columns}} = data;
|
|||
|
|
const length = columns.length;
|
|||
|
|
columns.map(c => {
|
|||
|
|
c.width = `${95/length}%`
|
|||
|
|
})
|
|||
|
|
return data
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
getTabChildren = () => {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { current, tableInfo1, tableInfo2, tabkey1, tabkey2 } = hrmAdd;
|
|||
|
|
let tabChildren = [];
|
|||
|
|
let target;
|
|||
|
|
let tabkey;
|
|||
|
|
if (current === 1) {
|
|||
|
|
target = toJS(tableInfo1);
|
|||
|
|
tabkey = tabkey1;
|
|||
|
|
}
|
|||
|
|
if (current === 2) {
|
|||
|
|
target = toJS(tableInfo2);
|
|||
|
|
tabkey = tabkey2;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
target && this.handleTable(target).map((t, i) => {
|
|||
|
|
if (tabkey == i) {
|
|||
|
|
tabChildren.push(
|
|||
|
|
<WeaTableEdit ecId={`${this && this.props && this.props.ecId || ''}_WeaTableEdit@jv99el@${i}`}
|
|||
|
|
// title={'列表信息'}
|
|||
|
|
// addFirstRow={true}
|
|||
|
|
tableProps={{
|
|||
|
|
scroll: { x: 700 }
|
|||
|
|
}}
|
|||
|
|
columns={t.tabinfo.columns ? t.tabinfo.columns : []}
|
|||
|
|
datas={isEmpty(t.tabinfo.datas) ? [{}] : t.tabinfo.datas}//没有数据默认添加一行，使用addFirstRow属性在这个页面有问题。
|
|||
|
|
onChange={this.tableEditChange}
|
|||
|
|
/>
|
|||
|
|
);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
return tabChildren;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
render () {
|
|||
|
|
const { hrmAdd } = this.props;
|
|||
|
|
const { visible, title, current, loading, conditionInfo1, conditionInfo2, conditionInfo3, tabInfo1, tabInfo2, tabkey1, tabkey2 } = hrmAdd;
|
|||
|
|
let dialogHeight = window.innerHeight - 250;
|
|||
|
|
if (dialogHeight > 660) dialogHeight = 660;
|
|||
|
|
return <WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@akev30`}
|
|||
|
|
{...this.props}
|
|||
|
|
closable
|
|||
|
|
className="hrm-addfull"
|
|||
|
|
style={{ width: 800, height: dialogHeight }}
|
|||
|
|
title={title()}
|
|||
|
|
icon="icon-coms-hrm"
|
|||
|
|
iconBgcolor='#217346'
|
|||
|
|
buttons={this.getBtns()}
|
|||
|
|
moreBtn={{ datas: [] }}
|
|||
|
|
>
|
|||
|
|
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@vgga5o`} spinning={loading}>
|
|||
|
|
<Steps ecId={`${this && this.props && this.props.ecId || ''}_Steps@np68cr`} current={current} className="step-wrapper">
|
|||
|
|
<Step ecId={`${this && this.props && this.props.ecId || ''}_Step@ytdmss`} description={i18n.label.fillBasicInfo()} />
|
|||
|
|
<Step ecId={`${this && this.props && this.props.ecId || ''}_Step@clngpy`} description={i18n.label.fillPrivateInfo()} />
|
|||
|
|
<Step ecId={`${this && this.props && this.props.ecId || ''}_Step@yp8iih`} description={i18n.label.fillWorkInfo()} />
|
|||
|
|
<Step ecId={`${this && this.props && this.props.ecId || ''}_Step@kgl9jl`} description={i18n.label.fillSysInfo()} />
|
|||
|
|
</Steps>
|
|||
|
|
<WeaNewScroll ecId={`${this && this.props && this.props.ecId || ''}_WeaNewScroll@hu2rk8`} height={dialogHeight - 120} ref="scrollBar">
|
|||
|
|
<div className={`${current < 1 ? 'wea-show' : 'wea-hide'}`}>
|
|||
|
|
{this.getSearchs(0)}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div className={`${current === 1 ? 'wea-show hrm-add-detial-tabs' : 'wea-hide hrm-add-detial-tabs'}`}>
|
|||
|
|
{!isEmpty(conditionInfo1) ?
|
|||
|
|
<div>
|
|||
|
|
{this.getSearchs(1)}
|
|||
|
|
{
|
|||
|
|
!isEmpty(tabInfo1) && <div>
|
|||
|
|
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@8k8ibm`}
|
|||
|
|
type='card'
|
|||
|
|
keyParam='key'
|
|||
|
|
datas={toJS(tabInfo1)}
|
|||
|
|
selectedKey={tabkey1}
|
|||
|
|
onChange={hrmAdd.updateTabkey}
|
|||
|
|
/>
|
|||
|
|
{this.getTabChildren()}
|
|||
|
|
</div>
|
|||
|
|
}
|
|||
|
|
</div> :
|
|||
|
|
<div>
|
|||
|
|
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@at8vdt`}>
|
|||
|
|
<div style={{ color: '#000' }}>
|
|||
|
|
{i18n.message.fillPrivateInfoAlarm()}
|
|||
|
|
</div>
|
|||
|
|
</WeaAlertPage>
|
|||
|
|
</div>
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div className={`${current === 2 ? 'wea-show hrm-add-detial-tabs' : 'wea-hide hrm-add-detial-tabs'}`}>
|
|||
|
|
{!isEmpty(conditionInfo2) ?
|
|||
|
|
<div>
|
|||
|
|
{this.getSearchs(2)}
|
|||
|
|
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@vswx9n`}
|
|||
|
|
type='card'
|
|||
|
|
keyParam='key'
|
|||
|
|
datas={toJS(tabInfo2)}
|
|||
|
|
selectedKey={tabkey2}
|
|||
|
|
onChange={hrmAdd.updateTabkey}
|
|||
|
|
/>
|
|||
|
|
{this.getTabChildren()}
|
|||
|
|
</div> :
|
|||
|
|
<div>
|
|||
|
|
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@5c5zei`}>
|
|||
|
|
<div style={{ color: '#000' }}>
|
|||
|
|
{i18n.message.fillWorkInfoAlarm()}
|
|||
|
|
</div>
|
|||
|
|
</WeaAlertPage>
|
|||
|
|
</div>
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div className={`${current === 3 ? 'wea-show' : 'wea-hide'}`}>
|
|||
|
|
{!isEmpty(conditionInfo3) ?
|
|||
|
|
<div>
|
|||
|
|
{this.getSearchs(3)}
|
|||
|
|
</div> :
|
|||
|
|
<div>
|
|||
|
|
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@iz74wf`}>
|
|||
|
|
<div style={{ color: '#000' }}>
|
|||
|
|
{i18n.message.fillSysInfoAlarm()}
|
|||
|
|
</div>
|
|||
|
|
</WeaAlertPage>
|
|||
|
|
</div>
|
|||
|
|
}
|
|||
|
|
</div>
|
|||
|
|
</WeaNewScroll>
|
|||
|
|
</Spin>
|
|||
|
|
|
|||
|
|
</WeaDialog>
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
export default Full
|