qt
/
salary-management-front
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

工资单预览模板

This commit is contained in:
MustangDeng 2022-05-05 16:10:22 +08:00
parent 00f867914a
commit e4e4f791eb
4 changed files with 70 additions and 26 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
pc4mobx/hrmSalary/pages/payroll/index.js
View File

@ -398,9 +398,20 @@ export default class Payroll extends React.Component {
<SlideModalTitle <SlideModalTitle
subtitle={"编辑工资单模板"} subtitle={"编辑工资单模板"}
tabs={[{title: '基础设置', key: 0}, {title: "显示设置", key: 1}]} tabs={[{title: '基础设置', key: 0}, {title: "显示设置", key: 1}]}
editable={true} editable={false}
onSave={() => {this.handleUpdateSave()}}
selectedTab={selectedTab} 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={ subItemChange={
(item) => {this.setState({selectedTab: item.key})} (item) => {this.setState({selectedTab: item.key})}
} }

6
pc4mobx/hrmSalary/pages/payroll/templatePreview/computerTemplate/index.js
View File

@ -44,7 +44,7 @@ export default class ComputerTemplate extends React.Component {
<div className="sobItemWrapper"> <div className="sobItemWrapper">
{ {
this.salaryItemSet.length > 0 && this.salaryItemSet.length > 0 &&
this.salaryItemSet.map(group => ( this.salaryItemSet.map((group,index) => (
<div className="sobItem"> <div className="sobItem">
<Row className="titleRow"> <Row className="titleRow">
<Col span={24} className="sobTitle">{group.groupName}</Col> <Col span={24} className="sobTitle">{group.groupName}</Col>
@ -56,7 +56,7 @@ export default class ComputerTemplate extends React.Component {
<Col span={8}> <Col span={8}>
<Row> <Row>
<Col span={ 12 } className="contentItem">{item.name}</Col> <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> </Row>
</Col> </Col>
)) ))
@ -64,9 +64,7 @@ export default class ComputerTemplate extends React.Component {
</Row> </Row>
</div> </div>
)) ))
} }
</div> </div>
<div style={{margin: "20px auto"}}> <div style={{margin: "20px auto"}}>
{ {

2
pc4mobx/hrmSalary/pages/payroll/templatePreview/index.js
View File

@ -16,8 +16,6 @@ export default class TemplatePreview extends React.Component {
} }
} }
handleSelectClick(selectKey) { handleSelectClick(selectKey) {
this.setState({selectKey}) this.setState({selectKey})
} }

73
pc4mobx/hrmSalary/pages/payroll/templatePreview/phoneTemplate/index.js
View File

@ -3,41 +3,78 @@ import { Row, Col} from 'antd'
import background from '../computerTemplate/background.png' import background from '../computerTemplate/background.png'
import "../index.less" import "../index.less"
import { inject, observer } from 'mobx-react'; import { inject, observer } from 'mobx-react';
import moment from 'moment'
@inject('payrollStore') @inject('payrollStore')
@observer @observer
export default class PhoneTemplate extends React.Component { 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() { render() {
return ( return (
<div className="computerTemplate phoneTemplate" > <div className="computerTemplate phoneTemplate" >
<div className="phoneBar">薪酬预览</div> <div className="phoneBar">薪酬预览</div>
<div className="titleWrapper"> <div className="titleWrapper">
测试标题 {this.salaryTemplateShowSet.theme.replace("${companyName}", "上海泛微").replace("${salaryMonth}", moment(new Date()).format("YYYY-MM"))}
</div> </div>
<div className="background-wrapper"> <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>
<div className="sobItemWrapper"> <div className="sobItemWrapper">
<div className="sobItem"> {
<Row className="titleRow"> this.salaryItemSet.length > 0 &&
<Col span={24} className="sobTitle">员工信息</Col> this.salaryItemSet.map((group,index) => (
</Row> <div className="sobItem">
<Row className="titleRow">
<Row className="contentRow"> <Col span={24} className="sobTitle">{group.groupName}</Col>
<Col span={ 6 } className="contentItem">个税扣缴义务人</Col> </Row>
<Col span={ 6 } className="contentItem">上海泛微</Col>
<Col span={ 6 } className="contentItem">姓名</Col> <Row className="contentRow">
<Col span={ 6 } className="contentItem">张三</Col> {
</Row> 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"> <div style={{margin: "20px auto"}}>
<Col span={ 6 } className="contentItem">部门</Col> {
<Col span={ 6 } className="contentItem">研发部</Col> this.salaryTemplateShowSet.textContentPosition == 2 && this.salaryTemplateShowSet.textContent
</Row> }
</div>
</div> </div>
</div> </div>
) )