630 lines
20 KiB
JavaScript
630 lines
20 KiB
JavaScript
import React from 'react'
|
|
import * as mobx from 'mobx'
|
|
import {
|
|
inject,
|
|
observer,
|
|
} from 'mobx-react'
|
|
import {
|
|
WeaTop,
|
|
WeaTab,
|
|
WeaFormItem,
|
|
WeaRightMenu,
|
|
WeaTable
|
|
} from 'ecCom'
|
|
import {
|
|
Row,
|
|
Col,
|
|
Spin,
|
|
Modal,
|
|
Button,
|
|
message,
|
|
Switch,
|
|
Menu, Dropdown, Icon, Tooltip
|
|
} from 'antd'
|
|
import {
|
|
WeaSwitch,
|
|
WeaTableNew
|
|
} from 'comsMobx'
|
|
import {
|
|
i18n
|
|
} from '../../public/i18n';
|
|
|
|
import '../../style/common.less';
|
|
|
|
import NewTableDialog from '../NewTableDialog';
|
|
import NewAndEditDialog from '../NewAndEditDialog';
|
|
import NewWeaTable from '../NewWeaTableDialog';
|
|
import { renderNoright } from '../../util';
|
|
import {
|
|
CompanyExtendStore
|
|
} from '../../stores/companyextend';
|
|
|
|
const companyExtend = new CompanyExtendStore();
|
|
|
|
|
|
const toJS = mobx.toJS;
|
|
const confirm = Modal.confirm;
|
|
|
|
|
|
@inject('company')
|
|
@observer
|
|
export default class Company extends React.Component {
|
|
constructor(props) {
|
|
super(props);
|
|
}
|
|
|
|
componentWillMount() {
|
|
}
|
|
|
|
componentDidMount() {
|
|
this.init();
|
|
}
|
|
|
|
componentWillReceiveProps(nextProps) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
|
|
if (this.props.location.key !== nextProps.location.key) {
|
|
this.init();
|
|
}
|
|
}
|
|
|
|
init() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.getTableInfo();
|
|
company.getHasRight();
|
|
company.getMoveForm();
|
|
}
|
|
|
|
getTopMenuBtns() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
topMenu,
|
|
selectedRowKeys
|
|
} = company;
|
|
|
|
let btns = [];
|
|
topMenu.map((item, i) => {
|
|
if (item.menuFun !== 'batchDelete') {
|
|
btns.push(<Button type='primary' onClick={() => this.handleClick(item)}>{item.menuName}</Button>);
|
|
} else {
|
|
btns.push(<Button type='primary' onClick={() => this.handleClick(item)} disabled={selectedRowKeys.length > 0 ? false : true} >{item.menuName}</Button>);
|
|
}
|
|
|
|
});
|
|
|
|
return btns;
|
|
}
|
|
|
|
|
|
log = () => {
|
|
window.setLogViewProp({
|
|
logMoudleType: 8,
|
|
keys: new Date().getTime(),
|
|
});
|
|
}
|
|
|
|
handleClick(item) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
isPanelShow
|
|
} = company;
|
|
|
|
isPanelShow && company.setPanelStatus(false);
|
|
this[item.menuFun] && this[item.menuFun]();
|
|
}
|
|
|
|
new() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
|
|
company.setNeDialogTitle(i18n.label.newCompany());
|
|
company.setNewVisible(true);
|
|
company.getCompanyForm();
|
|
|
|
}
|
|
|
|
//联查部门
|
|
select(id) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.setNeDialogTitle(i18n.label.selectDept());
|
|
company.setVisible(true);
|
|
company.setDialogLoadingStatus(true);
|
|
company.getDeptTable(id);
|
|
}
|
|
|
|
//查看
|
|
view(id) {
|
|
//companyExtend.isEditor = true;
|
|
window.open(`/spa/organization/static/index.html#/main/organization/companyExtend/${id}`, "_blank")
|
|
}
|
|
|
|
transfer(id) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
confirm({
|
|
title: i18n.confirm.defaultTitle(),
|
|
content: this.getTransferForm(),
|
|
okText: i18n.button.ok(),
|
|
cancelText: i18n.button.cancel(),
|
|
onOk() {
|
|
company.transfer(id)
|
|
},
|
|
onCancel() {
|
|
return false;
|
|
},
|
|
});
|
|
}
|
|
|
|
version(record) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
confirm({
|
|
title: i18n.confirm.defaultTitle(),
|
|
content: `确认将{${record.subCompanyDesc}}存为新版本?`,
|
|
okText: i18n.button.ok(),
|
|
cancelText: i18n.button.cancel(),
|
|
onOk() {
|
|
company.version(record.id);
|
|
},
|
|
onCancel() {
|
|
return false;
|
|
},
|
|
});
|
|
}
|
|
|
|
getTransferForm() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
transferCondition,
|
|
form2,
|
|
} = company;
|
|
let formParams = form2.getFormParams();
|
|
const {
|
|
isFormInit
|
|
} = form2;
|
|
let arr = [];
|
|
isFormInit && transferCondition.map(c => {
|
|
c.items.map((field, index) => {
|
|
arr.push(
|
|
<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@u6ex85@${index}`}
|
|
label={`${field.label}`}
|
|
labelCol={{ span: `${field.labelcol}` }}
|
|
wrapperCol={{ span: `${field.fieldcol}` }}>
|
|
{<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@p7d3td@${index}`} fieldConfig={field} form={form2} formParams={formParams} />}
|
|
</WeaFormItem>
|
|
)
|
|
})
|
|
})
|
|
return arr;
|
|
}
|
|
|
|
batchDelete() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
selectedRowKeys
|
|
} = company;
|
|
let keys = toJS(selectedRowKeys).toString();
|
|
company.setIds(keys);
|
|
this.showConfirm('batchDel');
|
|
}
|
|
showConfirm(v) {
|
|
let _this = this;
|
|
confirm({
|
|
title: i18n.confirm.defaultTitle(),
|
|
content: (v == 'del') ? i18n.confirm.delete() : i18n.confirm.batchDeleteConfirm(),
|
|
okText: i18n.button.ok(),
|
|
cancelText: i18n.button.cancel(),
|
|
onOk() {
|
|
_this.onOk();
|
|
},
|
|
onCancel() {
|
|
return false;
|
|
},
|
|
});
|
|
}
|
|
onOk() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.delete();
|
|
}
|
|
|
|
|
|
getDropMenuDatas() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
rightMenu
|
|
} = company;
|
|
|
|
let menus = [];
|
|
toJS(rightMenu).map((item, index) => {
|
|
let obj = {
|
|
key: item.menuFun,
|
|
icon: <i className={`${item.menuIcon}`} />,
|
|
content: item.menuName,
|
|
}
|
|
if (item.menuFun == 'collection' || item.menuFun == 'help' || item.menuFun == 'pageAddress') {
|
|
obj.disabled = true;
|
|
}
|
|
menus.push(obj);
|
|
})
|
|
return menus;
|
|
}
|
|
|
|
handleMenuClick(key) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
isPanelShow
|
|
} = company;
|
|
|
|
isPanelShow && company.setPanelStatus(false);
|
|
this[key] && this[key]();
|
|
}
|
|
|
|
|
|
|
|
onSearchChange(val) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
form
|
|
} = company;
|
|
|
|
company.setCompanyName(val);
|
|
!this.isEmptyObject(form.getFormParams()) && company.updateFields(val);
|
|
}
|
|
|
|
|
|
reRenderColumns(columns) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
let _this = this;
|
|
// `${columns}` && columns.push({
|
|
// title: '',
|
|
// dataIndex: 'ops',
|
|
// key: 'ops',
|
|
// width: 80,
|
|
// className:"wea-table-operates",
|
|
// render: ( text, record, index )=> {
|
|
// const menu = (
|
|
// <Menu>
|
|
// <Menu.Item>
|
|
// <a href='javascript:void(0);' onClick={() => { _this.doDel(record.id) }}>删除</a>
|
|
// </Menu.Item>
|
|
// <Menu.Item>
|
|
// <a href='javascript:void(0);' onClick={() => { _this.select(record.id) }}>联查部门</a>
|
|
// </Menu.Item>
|
|
// </Menu>
|
|
// )
|
|
// return (
|
|
// <Dropdown overlay={menu}>
|
|
// <i class="icon-coms-more" />
|
|
// </Dropdown>
|
|
// )
|
|
// }
|
|
// });
|
|
columns.forEach((c, index) => {
|
|
if (c.dataIndex == 'canceled') {
|
|
c.render = function (text, record) {
|
|
return <Switch checked={record.canceled == "0" ? true : false} onChange={checked => _this.updateForbiddenTag(checked, record.id)} />
|
|
}
|
|
};
|
|
if (c.dataIndex == 'subCompanyDesc') {
|
|
c.className = "wea-table-indent"
|
|
c.render = function (text, record) {
|
|
return <a onClick={() => {
|
|
window.open(`/spa/organization/static/index.html#/main/organization/companyExtend/${record.id}`, "_blank")
|
|
}}>{text}</a>
|
|
|
|
}
|
|
}
|
|
if (c.dataIndex == 'operate') {
|
|
c.className = "wea-table-operates"
|
|
c.width = 80
|
|
c.render = function (text, record) {
|
|
const menu = (
|
|
<Menu>
|
|
<Menu.Item key="1" disabled={record.isUsed === 0 ? false : true} style={record.isUsed === 0 ? { display: 'block' } : { display: 'none' }}>
|
|
<a href='javascript:void(0);' onClick={() => {
|
|
_this.doDel(record.id)
|
|
}}>删除</a>
|
|
</Menu.Item>
|
|
<Menu.Item key="2">
|
|
<a href='javascript:void(0);' onClick={() => {
|
|
_this.select(record.id)
|
|
}}>联查部门</a>
|
|
</Menu.Item>
|
|
<Menu.Item key="3">
|
|
<a href='javascript:void(0);' onClick={() => {
|
|
_this.view(record.id)
|
|
}}>查看</a>
|
|
</Menu.Item>
|
|
<Menu.Item key="4">
|
|
<a href='javascript:void(0);' onClick={() => {
|
|
_this.transfer(record.id)
|
|
}}>转移</a>
|
|
</Menu.Item>
|
|
{/* <Menu.Item key="5">
|
|
<a href='javascript:void(0);' onClick={() => { _this.version(record) }}>另存为版本</a>
|
|
</Menu.Item> */}
|
|
</Menu>
|
|
)
|
|
return <Dropdown overlay={menu}>
|
|
<i class="icon-coms-more" />
|
|
</Dropdown>
|
|
}
|
|
}
|
|
|
|
})
|
|
|
|
return columns;
|
|
}
|
|
|
|
updateForbiddenTag(checked, id) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
confirm({
|
|
title: i18n.confirm.defaultTitle(),
|
|
content: (checked == true) ? i18n.confirm.enableTag() : i18n.confirm.forbiddenTag(),
|
|
okText: i18n.button.ok(),
|
|
cancelText: i18n.button.cancel(),
|
|
onOk() {
|
|
company.updateForbiddenTag(checked, id);
|
|
},
|
|
onCancel() {
|
|
return false;
|
|
},
|
|
});
|
|
}
|
|
|
|
doDel(id) {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.setIds(id);
|
|
this.showConfirm('del');
|
|
}
|
|
|
|
|
|
handleSave() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.setSaveAndSetting(false);
|
|
company.save();
|
|
}
|
|
|
|
handleSaveAndSetting() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
company.setSaveAndSetting(true);
|
|
company.save();
|
|
|
|
}
|
|
|
|
getTabBtn() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
form
|
|
} = company;
|
|
|
|
const btn = [
|
|
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@bx87i8`} type="primary" onClick={() => {
|
|
company.setCurrent(1); company.setPageSize(10); company.getTableInfo(); company.setPanelStatus(false)
|
|
}}>{i18n.button.search()}</Button>),
|
|
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@218ju6`} onClick={() => form.reset()}>{i18n.button.reset()}</Button>),
|
|
(<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@5u9mfz`} onClick={() => company.setPanelStatus(false)}>{i18n.button.cancel()}</Button>),
|
|
];
|
|
|
|
return btn;
|
|
}
|
|
|
|
getPanelComponents() {
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
searchCondition,
|
|
form,
|
|
searchConditionLoading
|
|
} = company;
|
|
|
|
let arr = [];
|
|
let formParams = form.getFormParams();
|
|
const {
|
|
isFormInit
|
|
} = form;
|
|
|
|
isFormInit && searchCondition.map(c => {
|
|
c.items.map((field, index) => {
|
|
arr.push(<Col ecId={`${this && this.props && this.props.ecId || ''}_Col@4cc308@${index}`} span={(index % 2 == 0) ? 10 : 11} offset={1}>
|
|
<div style={{ marginTop: 20 }}>
|
|
<WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@u6ex85@${index}`}
|
|
label={`${field.label}`}
|
|
labelCol={{ span: `${field.labelcol}` }}
|
|
wrapperCol={{ span: `${field.fieldcol}` }}>
|
|
{<WeaSwitch ecId={`${this && this.props && this.props.ecId || ''}_WeaSwitch@p7d3td@${index}`} fieldConfig={field} form={form} formParams={formParams} />}
|
|
</WeaFormItem>
|
|
</div>
|
|
</Col>)
|
|
})
|
|
})
|
|
|
|
if (searchConditionLoading) {
|
|
return (
|
|
<div className='hrm-loading-center-small' style={{ top: '25%' }}>
|
|
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@lbktzb`} spinning={searchConditionLoading}></Spin>
|
|
</div>
|
|
)
|
|
} else {
|
|
return <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@ppeb6z`} onKeyDown={(e) => {
|
|
if (e.keyCode == 13 && e.target.tagName === "INPUT") {
|
|
company.getTableInfo();
|
|
company.setPanelStatus(false)
|
|
}
|
|
}}>{arr}</Row>
|
|
}
|
|
|
|
}
|
|
|
|
//非空判断
|
|
isEmptyObject(obj) {
|
|
for (let key in obj) {
|
|
return false;
|
|
}
|
|
return true;
|
|
}
|
|
|
|
|
|
|
|
render() {
|
|
|
|
const {
|
|
company
|
|
} = this.props;
|
|
const {
|
|
isPanelShow, companyName, conditionNum, visible, condition, form,
|
|
tableStore, dataSource, columns, loading, date, nEdialogTitle, dialogLoading,
|
|
form1, isEdit, newVisible, deptDataSource, deptColumns, selectedRowKeys, total, current, pageSize, init, hasRight
|
|
} = company;
|
|
|
|
if (hasRight === false) {
|
|
return renderNoright();
|
|
}
|
|
|
|
const rowSelection = {
|
|
selectedRowKeys: selectedRowKeys,
|
|
type: "checkbox",
|
|
onChange(selectedRowKeys, selectedRows) {
|
|
company.setSelectedRowKeys(selectedRowKeys);
|
|
},
|
|
getCheckboxProps: record => ({
|
|
disabled: record.isUsed === 1, // 配置无法勾选的列
|
|
}),
|
|
};
|
|
|
|
const pagination = {
|
|
current: current,
|
|
pageSize: pageSize,
|
|
total: total,
|
|
showSizeChanger: true,
|
|
showQuickJumper: true,
|
|
onShowSizeChange(current, pageSize) {
|
|
},
|
|
onChange(current) {
|
|
},
|
|
showTotal(total) {
|
|
return `共 ${total} 条`
|
|
}
|
|
};
|
|
|
|
|
|
return (
|
|
hasRight && <div ref='page' style={{ height: '100%' }}>
|
|
<WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@k6oc4u`}
|
|
datas={this.getDropMenuDatas()}
|
|
onClick={key => this.handleMenuClick(key)}
|
|
>
|
|
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@bj98s7`}
|
|
title={i18n.label.companyName()}
|
|
icon={<i className='icon-coms-hrm' />}
|
|
iconBgcolor='#217346'
|
|
loading={true}
|
|
buttons={this.getTopMenuBtns()}
|
|
showDropIcon={true}
|
|
dropMenuDatas={this.getDropMenuDatas()}
|
|
onDropMenuClick={(e) => this.handleMenuClick(e)}
|
|
>
|
|
<WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@9c3zts`}
|
|
searchType={['base', 'advanced']}
|
|
showSearchAd={isPanelShow}
|
|
searchsBaseValue={this.isEmptyObject(form.getFormParams()) ? companyName : form.getFormParams().companyName}
|
|
setShowSearchAd={bool => company.setPanelStatus(bool)}
|
|
hideSearchAd={() => company.setPanelStatus(false)}
|
|
searchsAd={isPanelShow ? this.getPanelComponents() : <div></div>}
|
|
advanceHeight={Math.ceil(conditionNum / 2) * 52 + 20}
|
|
hasMask={false}
|
|
buttonsAd={this.getTabBtn()}
|
|
onSearch={() => {
|
|
company.setCurrent(1);
|
|
company.setPageSize(10);
|
|
company.getTableInfo()
|
|
}}
|
|
onSearchChange={val => this.onSearchChange(val)}
|
|
/>
|
|
{
|
|
init ? <div className='hrm-new-weatable-spin'>
|
|
<Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@4ygl4a`} spinning={init}></Spin>
|
|
</div> :
|
|
<WeaTable rowKey={record => record.id} ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@pgmg3x`}
|
|
loading={loading}
|
|
dataSource={dataSource} childrenColumnName="children"
|
|
columns={this.reRenderColumns(columns)}
|
|
rowSelection={rowSelection}
|
|
pagination={pagination}
|
|
onChange={(pagination, filters, sorter) => {
|
|
company.setSortParams(sorter);
|
|
company.setCurrent(pagination.current);
|
|
company.setPageSize(pagination.pageSize);
|
|
company.getTableInfo();
|
|
}}
|
|
indentSize={15}
|
|
/>
|
|
}
|
|
|
|
</WeaTop>
|
|
</WeaRightMenu>
|
|
<NewTableDialog ecId={`${this && this.props && this.props.ecId || ''}_NewTableDialog@q4rrwm`}
|
|
title={nEdialogTitle}
|
|
visible={visible}
|
|
loading={dialogLoading}
|
|
height={400}
|
|
dataSource={deptDataSource} //联查部门数据
|
|
columns={deptColumns}
|
|
onCancel={() => company.setVisible(false)}
|
|
/>
|
|
<NewAndEditDialog ecId={`${this && this.props && this.props.ecId || ''}_NewAndEditDialog@q4rrwm`}
|
|
title={nEdialogTitle}
|
|
visible={newVisible}
|
|
condition={toJS(condition)}
|
|
form={form1}
|
|
isFormInit={form1.isFormInit}
|
|
loading={dialogLoading}
|
|
isEdit={isEdit}
|
|
height={350}
|
|
conditionLen={1}
|
|
save={() => this.handleSave()}
|
|
onCancel={() => company.setNewVisible(false)}
|
|
saveAndSetting={() => this.handleSaveAndSetting()}
|
|
/>
|
|
</div>
|
|
)
|
|
}
|
|
} |