salary-management-front/pc4mobx/hrmSalary/pages/mySalary/payrollModal.js

45 lines
1.5 KiB
JavaScript

import React from "react";
import { WeaDialog } from "ecCom";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import ComputerTemplate from "../payroll/templatePreview/computerTemplate";
import "../payroll/templatePreview/index.less";
@inject("mySalaryStore")
@observer
export default class PayrollModal extends React.Component {
componentWillMount() {
const { mySalaryStore: { getMySalaryBill } } = this.props;
getMySalaryBill(this.props.id);
}
render() {
const { mySalaryStore: { mySalaryBill } } = this.props;
const employeeInformation = mySalaryBill.employeeInformation && toJS(mySalaryBill.employeeInformation);
const salaryGroups = mySalaryBill.salaryGroups && toJS(mySalaryBill.salaryGroups);
return (
<WeaDialog
title="工资单"
visible={this.props.visible} onCancel={() => {
this.props.onCancel();
}}
style={{ width: 980 }}
initLoadCss
resize>
<div style={{ minHeight: "20vh", maxHeight: "80vh", overflow: "hidden auto" }}>
<div className="templatePreview">
{
this.props.visible &&
<ComputerTemplate
isPreview
salaryTemplateShowSet={JSON.stringify(mySalaryBill.salaryTemplate)}
salaryItemSet={!_.isEmpty(salaryGroups) ? JSON.stringify([employeeInformation, ...salaryGroups]) : []}
/>
}
</div>
</div>
</WeaDialog>
);
}
}