salary-management-front/pc4mobx/hrmSalary/components/mobileTemplate/index.js

93 lines
3.9 KiB
JavaScript

/*
* Author: 黎永顺
* name: 移动端-工资单预览
* Description:
* Date: 2023/10/19
*/
import React, { Component } from "react";
import { WeaLocaleProvider } from "ecCom";
import { dealTemplate } from "../pcTemplate";
import "./index.less";
const getLabel = WeaLocaleProvider.getLabel;
class Index extends Component {
render() {
const { theme, background, tip, tipPosi, itemTypeList, title } = this.props;
const { onlyOneGrup, showData } = dealTemplate(_.filter(itemTypeList, o => !!o), "mobile");
return (
<React.Fragment>
{/*<div className="pbmc-head">{title || getLabel(111, "薪酬预览")}</div>*/}
<div className="pbmc-body">
<div className="weapp-salary-payroll-mobile-preview">
<div className="bill-container">
<div className="bill-info-header">
<div className="title">{theme || ""}</div>
{/*<div className="time">{moment().format("YYYY-MM-DD HH:mm:ss")}</div>*/}
{/*{*/}
{/* background &&*/}
{/* <div className="img"><img src={`${background}`} alt="logo"/></div>*/}
{/*}*/}
</div>
{
!onlyOneGrup && tipPosi.toString() === "1" && tip &&
<div className="corporate-culture-text top" title={tip} dangerouslySetInnerHTML={{ __html: tip }}/>
}
<div className="salary-detail-table-container">
{
showData.map((groupItem, index) => {
if (!groupItem) return null;
const { groupId, groupName, items = [] } = groupItem;
return (
<div className="salary-group" key={groupId || index}>
{
groupName ? <div className="group-title">{groupName}</div> : null
}
<div className="group-list">
{
(onlyOneGrup && tipPosi.toString() === "1" && tip) && (
<div className="list-item send-tip top">
<div className="label">{getLabel(111, "发放说明")}</div>
<div className="detail">{tip}</div>
</div>)
}
{
items.map((templatItem, index) => {
const { salaryItemValue, name, salaryItemShowName } = templatItem || {};
return <div className="list-item" key={index}>
<div className="item-name" title={salaryItemShowName || name}><span
className="text">{salaryItemShowName || name || ""}</span></div>
<div className="item-count">{salaryItemValue}</div>
</div>;
})
}
{
(onlyOneGrup && tipPosi.toString() === "2" && tip) && (
<div className="list-item send-tip bottom">
<div className="label">{getLabel(111, "发放说明")}</div>
<div className="detail">{tip}</div>
</div>)
}
</div>
</div>);
})
}
</div>
{
!onlyOneGrup && tipPosi.toString() === "2" && tip &&
<div className="corporate-culture-text footer" title={tip} dangerouslySetInnerHTML={{ __html: tip }}/>
}
{this.props.children}
</div>
</div>
</div>
<div className="pbmc-footer">
<div className="pbmcf-indicator"></div>
</div>
</React.Fragment>
);
}
}
export default Index;