114 lines
7.0 KiB
JavaScript
114 lines
7.0 KiB
JavaScript
|
import React, { Component } from 'react';
|
||
|
|
import {observer} from 'mobx-react';
|
||
|
|
import { Timeline, Icon } from 'antd';
|
||
|
|
import { WeaLocaleProvider, WeaAlertPage } from 'ecCom';
|
||
|
|
import isEmpty from 'lodash/isEmpty';
|
||
|
|
import {addContentPath, carousel} from '../../util/index';
|
||
|
|
import LocationInfo from './LocationInfo';
|
||
|
|
|
||
|
|
const getLabel = WeaLocaleProvider.getLabel;
|
||
|
|
|
||
|
|
@observer
|
||
|
|
export default class TimeLineView extends Component{
|
||
|
|
onClickHandle = signInfo => {
|
||
|
|
this.props.store.showLocationInfo(signInfo);
|
||
|
|
}
|
||
|
|
|
||
|
|
render(){
|
||
|
|
const {store} = this.props;
|
||
|
|
const {timeData, hasRight, doCarousel} = store;
|
||
|
|
|
||
|
|
if(!hasRight){
|
||
|
|
return (
|
||
|
|
<div className="mapView" >
|
||
|
|
<WeaAlertPage ecId={`${this && this.props && this.props.ecId || ''}_WeaAlertPage@2gwsc1`} >
|
||
|
|
<div style={{ color: '#000' }}>
|
||
|
|
{getLabel('517102', "你无权查看该人员的外勤数据")}
|
||
|
|
</div>
|
||
|
|
</WeaAlertPage>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
let themeFontSize = 12;
|
||
|
|
try{
|
||
|
|
themeFontSize = parseInt(JSON.parse(localStorage['theme-themeInfo']).themeFontSize);
|
||
|
|
}catch(e){
|
||
|
|
themeFontSize = 12;
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className='timeLineView'>
|
||
|
|
<Timeline ecId={`${this && this.props && this.props.ecId || ''}_Timeline@fdlafg`}>
|
||
|
|
{
|
||
|
|
timeData && timeData.map((item, i) => {
|
||
|
|
return (
|
||
|
|
<Timeline.Item ecId={`${this && this.props && this.props.ecId || ''}_undefined@85fbaa@${i}`}>
|
||
|
|
<div className='itemContent'>
|
||
|
|
<div className={`date ${themeFontSize > 12 ? 'dateLarge' : ''}`} style={{backgroundImage: `url(${addContentPath('/hrm/hrm_e9/image/timeline.png')})`}}>{item.date}</div>
|
||
|
|
<div className='signInfo'>
|
||
|
|
{
|
||
|
|
isEmpty(item.items) ? (
|
||
|
|
<div className='noSigninfo'>
|
||
|
|
<Icon ecId={`${this && this.props && this.props.ecId || ''}_Icon@buw401@nodata}`} type='frown' />
|
||
|
|
{getLabel('386505',"当天无外勤签到记录")}
|
||
|
|
</div>
|
||
|
|
) : item.items.map((signInfo, i) => {
|
||
|
|
return (
|
||
|
|
<div className='item'>
|
||
|
|
<div className="mb5">
|
||
|
|
{signInfo.name}
|
||
|
|
<span style={{marginLeft: 15}}>{signInfo.time}</span>
|
||
|
|
<span style={{float: 'right', marginRight: 10, color: '#67AFF7'}}>{signInfo.signTitle}</span>
|
||
|
|
</div>
|
||
|
|
{/* 备注 */}
|
||
|
|
{signInfo.information && <div className="mb5" dangerouslySetInnerHTML={{__html: signInfo.information}}></div>}
|
||
|
|
{/* 图片 */}
|
||
|
|
{signInfo.pics &&
|
||
|
|
<div className="mb5">
|
||
|
|
{
|
||
|
|
signInfo.pics.map((pic, index)=> {
|
||
|
|
return (
|
||
|
|
<div className='mb5-img'>
|
||
|
|
<img src={addContentPath(pic)} border="0" width="100" height="110" onClick={event => doCarousel(mobx.toJS(signInfo.pics),index)}/>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
}
|
||
|
|
{
|
||
|
|
signInfo.crm && signInfo.crm.length > 0 &&
|
||
|
|
<div className="mb5-custom" >
|
||
|
|
<i className="icon-coms-currency-Customer" />
|
||
|
|
<div style={{flex: 1, width: '98%'}}>
|
||
|
|
{
|
||
|
|
signInfo.crm.map((d, i) => {
|
||
|
|
return (
|
||
|
|
<div className='crm_data text-elli'>{d}</div>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
}
|
||
|
|
<span className="positionInfo gray" onClick={() => this.onClickHandle({...signInfo, date: item.date})}>
|
||
|
|
<i className="icon-coms-position" style={{marginRight: 6}}/>
|
||
|
|
{signInfo.title}
|
||
|
|
</span>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</Timeline.Item>
|
||
|
|
)
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</Timeline>
|
||
|
|
<LocationInfo ecId={`${this && this.props && this.props.ecId || ''}_LocationInfo@v03xg2`} store={store} />
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|