334 lines
16 KiB
JavaScript
334 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.userUsbType == '7' && ['tokenKey', 'serial'].includes(field.domkey[0])) 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 |