125 lines
5.5 KiB
JavaScript
125 lines
5.5 KiB
JavaScript
import React from "react"
|
|
import { Row, Col } from 'antd'
|
|
import { WeaHelpfulTip, WeaSearchGroup } from 'ecCom'
|
|
import GroupCard from "../../components/groupCard"
|
|
import { inject, observer } from 'mobx-react';
|
|
import "./index.less"
|
|
import SelectedTab from '../../components/selectedTab'
|
|
import SalaryItemChangeList from "./salaryItemChangeList";
|
|
import TaxAgentChangeList from "./taxAgentChangeList";
|
|
|
|
const selectedTabItems = [
|
|
{
|
|
key: '0',
|
|
name: "薪资调整记录"
|
|
},
|
|
{
|
|
key: "1",
|
|
name: "个税扣缴义务人调整记录"
|
|
}
|
|
]
|
|
|
|
@inject('salaryFileStore')
|
|
@observer
|
|
export default class SalaryFileViewSlide extends React.Component {
|
|
constructor(props) {
|
|
super(props)
|
|
this.state = {
|
|
baseInfoVisible: true,
|
|
salaryItemVisible: true,
|
|
selectedTab: "0"
|
|
}
|
|
}
|
|
|
|
componentWillMount() {
|
|
const { salaryFileStore: {getArchiveForm, fetchSingleSalaryItemList} } = this.props;
|
|
getArchiveForm(this.props.id)
|
|
fetchSingleSalaryItemList({salaryArchiveId: this.props.id})
|
|
}
|
|
|
|
// tab页签切换回调
|
|
handleTabChange(item) {
|
|
this.setState({ selectedTab: item.key})
|
|
}
|
|
|
|
render() {
|
|
const { salaryFileStore: {detailForm} } = this.props;
|
|
const { baseInfo, adjustSalaryItems } = detailForm;
|
|
return (
|
|
<div className="salaryFileViewSlide">
|
|
<WeaSearchGroup title={"基本信息"} items={[]} onVisibleChange={(value) => {this.setState({baseInfoVisible: value})}}/>
|
|
{
|
|
this.state.baseInfoVisible && <div className="slideItemWrapper">
|
|
<Row className="formRow">
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">姓名</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.username}</Col>
|
|
</Row>
|
|
</Col>
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">部门</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.department}</Col>
|
|
</Row>
|
|
</Col>
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">岗位</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.position}</Col>
|
|
</Row>
|
|
</Col>
|
|
</Row>
|
|
|
|
<Row className="formRow">
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">入职时间</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.hiredate}</Col>
|
|
</Row>
|
|
</Col>
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">手机号</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.mobile}</Col>
|
|
</Row>
|
|
</Col>
|
|
<Col span={8}>
|
|
<Row>
|
|
<Col span={6} className="formTitle">个税扣缴义务人</Col>
|
|
<Col span={18}>{baseInfo && baseInfo.employee && baseInfo.employee.taxAgent}</Col>
|
|
</Row>
|
|
</Col>
|
|
</Row>
|
|
</div>
|
|
}
|
|
|
|
<WeaSearchGroup title={<span>薪资档案 <WeaHelpfulTip
|
|
width={200}
|
|
title="提示：显示已生效的最新数据"
|
|
placement="topLeft"
|
|
/></span>} items={[]} onVisibleChange={(value) => {this.setState({salaryItemVisible: value})}}/>
|
|
{
|
|
this.state.salaryItemVisible && <div style={{lineHeight: '40px'}} className="slideItemWrapper">
|
|
{
|
|
adjustSalaryItems && adjustSalaryItems.map(item => (
|
|
<div style={{display: "inline-block", width: '50%' }}>
|
|
<div style={{display:'inline-block', width: '50%'}}>{item.name}</div>
|
|
<div style={{display:'inline-block', width: '50%'}}>{item.value}</div>
|
|
</div>
|
|
))
|
|
}
|
|
</div>
|
|
}
|
|
|
|
<WeaSearchGroup title={<SelectedTab items={selectedTabItems} onChange={(item) => {this.handleTabChange(item)}}/>} items={[]} onVisibleChange={(value) => {this.setState({salaryItemVisible: value})}}/>
|
|
{
|
|
this.state.selectedTab == "0" ? <SalaryItemChangeList id={this.props.id}/> : <TaxAgentChangeList id={this.props.id}/>
|
|
}
|
|
<div>
|
|
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|
|
} |