工资单预览模板
This commit is contained in:
parent
00f867914a
commit
e4e4f791eb
|
|
@ -398,9 +398,20 @@ export default class Payroll extends React.Component {
|
|||
<SlideModalTitle
|
||||
subtitle={"编辑工资单模板"}
|
||||
tabs={[{title: '基础设置', key: 0}, {title: "显示设置", key: 1}]}
|
||||
editable={true}
|
||||
onSave={() => {this.handleUpdateSave()}}
|
||||
editable={false}
|
||||
selectedTab={selectedTab}
|
||||
customOperate={<span>
|
||||
{
|
||||
selectedTab == 0 && <Button type="primary" onClick={() => {this.handleUpdateSave()}}>保存</Button>
|
||||
}
|
||||
{
|
||||
selectedTab == 1 &&
|
||||
<span>
|
||||
<Button type="primary" onClick={() => {this.handleUpdateSave()}} style={{marginRight: '10px'}}>保存</Button>
|
||||
<Button type="default" onClick={() => {this.handlePreview()}}>预览</Button>
|
||||
</span>
|
||||
}
|
||||
</span>}
|
||||
subItemChange={
|
||||
(item) => {this.setState({selectedTab: item.key})}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@ export default class ComputerTemplate extends React.Component {
|
|||
<div className="sobItemWrapper">
|
||||
{
|
||||
this.salaryItemSet.length > 0 &&
|
||||
this.salaryItemSet.map(group => (
|
||||
this.salaryItemSet.map((group,index) => (
|
||||
<div className="sobItem">
|
||||
<Row className="titleRow">
|
||||
<Col span={24} className="sobTitle">{group.groupName}</Col>
|
||||
|
|
@ -56,7 +56,7 @@ export default class ComputerTemplate extends React.Component {
|
|||
<Col span={8}>
|
||||
<Row>
|
||||
<Col span={ 12 } className="contentItem">{item.name}</Col>
|
||||
<Col span={ 12 } className="contentItem">{item.salaryItemValue}</Col>
|
||||
<Col span={ 12 } className="contentItem">{index == 0 ? item.salaryItemValue : 10000}</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
))
|
||||
|
|
@ -64,9 +64,7 @@ export default class ComputerTemplate extends React.Component {
|
|||
</Row>
|
||||
</div>
|
||||
))
|
||||
|
||||
}
|
||||
|
||||
</div>
|
||||
<div style={{margin: "20px auto"}}>
|
||||
{
|
||||
|
|
|
|||
|
|
@ -16,8 +16,6 @@ export default class TemplatePreview extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
handleSelectClick(selectKey) {
|
||||
this.setState({selectKey})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,41 +3,78 @@ import { Row, Col} from 'antd'
|
|||
import background from '../computerTemplate/background.png'
|
||||
import "../index.less"
|
||||
import { inject, observer } from 'mobx-react';
|
||||
import moment from 'moment'
|
||||
|
||||
|
||||
@inject('payrollStore')
|
||||
@observer
|
||||
export default class PhoneTemplate extends React.Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.templateBaseData = {}
|
||||
this.salaryItemSetStr = {}
|
||||
this.salaryTemplateShowSet = []
|
||||
}
|
||||
|
||||
|
||||
componentWillMount() {
|
||||
let templateBaseDataStr = window.localStorage.getItem("templateBaseData");
|
||||
this.templateBaseData = JSON.parse(templateBaseDataStr)
|
||||
let salaryTemplateShowSetStr = window.localStorage.getItem("salaryTemplateShowSet");
|
||||
let salaryItemSetStr = window.localStorage.getItem("salaryItemSet");
|
||||
this.salaryItemSet = JSON.parse(salaryItemSetStr)
|
||||
this.salaryTemplateShowSet = JSON.parse(salaryTemplateShowSetStr)
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="computerTemplate phoneTemplate" >
|
||||
<div className="phoneBar">薪酬预览</div>
|
||||
<div className="titleWrapper">
|
||||
测试标题
|
||||
{this.salaryTemplateShowSet.theme.replace("${companyName}", "上海泛微").replace("${salaryMonth}", moment(new Date()).format("YYYY-MM"))}
|
||||
</div>
|
||||
<div className="background-wrapper">
|
||||
<img className="background-img" src={background} />
|
||||
<img className="background-img" src={this.salaryTemplateShowSet.background} />
|
||||
</div>
|
||||
|
||||
|
||||
<div className="sobItemDiv" style={{margin: "20px auto"}}>
|
||||
{
|
||||
this.salaryTemplateShowSet.textContentPosition == 1 && this.salaryTemplateShowSet.textContent
|
||||
}
|
||||
</div>
|
||||
|
||||
<div className="sobItemWrapper">
|
||||
<div className="sobItem">
|
||||
<Row className="titleRow">
|
||||
<Col span={24} className="sobTitle">员工信息</Col>
|
||||
</Row>
|
||||
|
||||
<Row className="contentRow">
|
||||
<Col span={ 6 } className="contentItem">个税扣缴义务人</Col>
|
||||
<Col span={ 6 } className="contentItem">上海泛微</Col>
|
||||
<Col span={ 6 } className="contentItem">姓名</Col>
|
||||
<Col span={ 6 } className="contentItem">张三</Col>
|
||||
</Row>
|
||||
{
|
||||
this.salaryItemSet.length > 0 &&
|
||||
this.salaryItemSet.map((group,index) => (
|
||||
<div className="sobItem">
|
||||
<Row className="titleRow">
|
||||
<Col span={24} className="sobTitle">{group.groupName}</Col>
|
||||
</Row>
|
||||
|
||||
<Row className="contentRow">
|
||||
{
|
||||
group.items && group.items.map(item => (
|
||||
<Col span={12}>
|
||||
<Row>
|
||||
<Col span={ 6 } className="contentItem">{item.name}</Col>
|
||||
<Col span={ 6 } className="contentItem">{index == 0 ? item.salaryItemValue : 10000}</Col>
|
||||
</Row>
|
||||
</Col>
|
||||
))
|
||||
}
|
||||
</Row>
|
||||
</div>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
|
||||
<Row className="contentRow">
|
||||
<Col span={ 6 } className="contentItem">部门</Col>
|
||||
<Col span={ 6 } className="contentItem">研发部</Col>
|
||||
</Row>
|
||||
</div>
|
||||
<div style={{margin: "20px auto"}}>
|
||||
{
|
||||
this.salaryTemplateShowSet.textContentPosition == 2 && this.salaryTemplateShowSet.textContent
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
|||
Loading…
Reference in New Issue