weaver_trunk_cli/pc4mobx/hrm/components/outsideV2/SearchBar.js

73 lines
2.6 KiB
JavaScript

import React, { Component } from 'react';
import {observer} from 'mobx-react';
import { WeaDatePicker, WeaCheckbox, WeaLocaleProvider } from 'ecCom';
import moment from 'moment';
const getLabel = WeaLocaleProvider.getLabel;
const DateTabItem = props => {
const {store, tabInfo, idx} = props;
const {selectedDateTabKey, getData} = store;
const onClickHandle = () => {
store.selectedDateTabKey = tabInfo.key;
const current = new moment();
switch(tabInfo.key){
case '0':
store.selectedDate = current.format('YYYY-MM-DD');
break;
case '1':
store.selectedDate = current.subtract(1, 'days').format('YYYY-MM-DD');
break;
case '2':
store.selectedDate = current.format('YYYY-MM');
break;
}
getData();
}
return (
<div key={idx} className={`item ${selectedDateTabKey == tabInfo.key ? 'active' : ''}`}
onClick={onClickHandle}>
{tabInfo.title}
</div>
)
}
@observer
export default class SearchBar extends Component{
onTabChangeHandle = key => {
}
onCheckBoxChangeHandle = v => {
const {store} = this.props;
store.showSignInfo = (v == 1);
}
onRefreshHandle = () => this.props.store.getData(true);
render(){
const {store} = this.props;
const {dateTabDatas, selectedDateTabKey, showSignInfo, datePickerProps} = store;
return (
<div className='searchBar'>
{
dateTabDatas && dateTabDatas.map((t, i) => {
const comProps = {tabInfo: t, idx: i};
return (
<DateTabItem ecId={`${this && this.props && this.props.ecId || ''}_DateTabItem@tws6np@${i}`} {...this.props} {...comProps} />
)
})
}
<div className='item'>
<WeaDatePicker ecId={`${this && this.props && this.props.ecId || ''}_WeaDatePicker@kplf0z`} {...datePickerProps} />
<i className="icon-coms-Refresh cursor-pointer refresh" onClick={this.onRefreshHandle} />
</div>
<div className='item'>
<WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@8xdsyt`} onChange={this.onCheckBoxChangeHandle} value={showSignInfo ? 1 : 0} content={getLabel('516948', '显示移动端考勤记录')} />
</div>
</div>
)
}
}