weaver_trunk_cli/pc4mobx/hrmAttendance/components/report/month4template/DisplaySetting.js

70 lines
3.7 KiB
JavaScript

import React, {Component} from 'react';
import {observer} from 'mobx-react';
import {WeaCheckbox, WeaSelect, WeaBrowser, WeaLocaleProvider} from 'ecCom';
const getLabel = WeaLocaleProvider.getLabel;
@observer
export default class DisplaySetting extends Component{
render(){
const {
store
} = this.props;
const {shiftBrowserProps, setBrowser, storage, onSelectChangeHandle, onSelectAllChangeHandle, onBrowserChangeHandle} = store;
const {displaySetting} = storage;
const {groups, serial = []} = displaySetting || {};
return (
<div className='displaySetting'>
{
(groups || []).map((group, i) => {
let {groupname, options, value} = group;
const isSelectAll = ((value || '').length == 0 ? false : (options.length == value.split(',').length));
let hasAttendanceSerial = false;
options = options.map((op, index) => {
if(op.key === 'attendanceSerial'){
const t = op.showname;
if(value.indexOf('attendanceSerial') > -1){
hasAttendanceSerial = true;
return {
...op,
showname: (
<span title={t}>
<span>{t}</span>
<WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@807ery@${index}`}
ref={dom => setBrowser(dom)}
{...shiftBrowserProps}
title={getLabel('24803','班次')}
inputStyle={{ width: 200 }}
onChange={onBrowserChangeHandle}
replaceDatas={serial}
>
<span style={{marginLeft: '10px', color: '#4D7AD8'}}>{getLabel('500494','选择显示班次')}</span>
</WeaBrowser>
</span>
)
}
}
return op;
}
return op;
})
return (
<div key={i}>
{
groups.length > 1 && <div className='tbCell'>{groupname}</div>
}
<div className='tbCell'>
<WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@zunsci@${i}`} content={getLabel('556','全选')} onChange={v => onSelectAllChangeHandle(v, i)} value={isSelectAll} />
</div>
<div className='tbCell'>
<WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@2xjqui@${i}`} detailtype='2' options={options} value={value} onChange={v => onSelectChangeHandle(v, i, hasAttendanceSerial)} />
</div>
</div>
)
})
}
</div>
)
}
}