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

bug的修正

This commit is contained in:
18652063575 2022-09-08 17:04:36 +08:00
parent ef9f8478a7
commit 938fb94743
29 changed files with 1422 additions and 977 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
pc4mobx/hrmSalary/apis/archive.js
View File

@ -245,6 +245,17 @@ export const getSalaryItemAdjustBeforeValue = (params) => {
body: JSON.stringify(params)
}).then(res => res.json())
}
// 停薪
export const stopSalary = (params) => {
return fetch('/api/bs/hrmsalary/salaryArchive/stopSalary', {
method: 'POST',
mode: 'cors',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify(params)
}).then(res => res.json())
}
// 调整-薪资项目-通过薪资档案的薪资项目id获取薪资项目调整表单
export const getSalaryItemFormByItemId = (params) => {

33
pc4mobx/hrmSalary/apis/standingBook.js
View File

@ -192,3 +192,36 @@ export const getAdminTaxAgentList = () => {
{}
);
}
// 表单字段对应的接口
export const getWelfareList = () => {
return WeaTools.callApi(
"/api/bs/hrmsalary/siaccount/getWelfareList",
"get",
{}
);
}
// 社保福利台账-导入预览
export const welfarePreview = (params) => {
return fetch("/api/bs/hrmsalary/siaccount/welfare/preview", {
method: "post",
mode: "cors",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(params),
}).then((res) => res.json());
}
// 社保福利台账-核算数据导入
export const importInsuranceAcctDetail = (params) => {
return fetch("/api/bs/hrmsalary/siaccount/welfare/importInsuranceAcctDetail", {
method: "post",
mode: "cors",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(params),
}).then((res) => res.json());
}

8
pc4mobx/hrmSalary/apis/taxAgent.js
View File

@ -93,3 +93,11 @@ export const getTaxAgentSelectListAsAdmin = (params) => {
params
);
};
//当前登录人是否有添加人员范围的权限
export const hasIconInTax = (params) => {
return WeaTools.callApi(
"/api/bs/hrmsalary/sys/conf/code?code=hideIconInTax",
"GET",
params
);
};

50
pc4mobx/hrmSalary/components/importModal/index.js
View File

@ -40,15 +40,15 @@ export default class ImportModal extends React.Component {
}
validateDate() {
const { params } = this.props;
// const { params } = this.props;
let flag = true;
try {
params && Object.keys(params).forEach((key) => {
if (!params[key] || params[key] == "") {
message.warning("请完善导入选项");
throw new Error("请完善导入选项");
}
});
// params && Object.keys(params).forEach((key) => {
// if (!params[key] || params[key] == "") {
// message.warning("请完善导入选项");
// throw new Error("请完善导入选项");
// }
// });
} catch (e) {
flag = false;
}
@ -65,29 +65,40 @@ export default class ImportModal extends React.Component {
} else {
message.warning("请上传文件");
}
}
handlePreviewDate() {
const { fileId } = this.state;
const { params } = this.props;
this.props.previewImport({
...params,
imageId: fileId
});
const { params, isStandingBook } = this.props;
if(!isStandingBook){
this.props.previewImport({
...params,
imageId: fileId
});
}else{
this.props.previewImport({
imageId: fileId
});
}
}
hanleImportData() {
const { fileId } = this.state;
const { params } = this.props;
this.props.importFile({
...params,
imageId: fileId
});
const { params, isStandingBook } = this.props;
if(!isStandingBook){
this.props.importFile({
...params,
imageId: fileId
});
}else{
this.props.importFile({
imageId: String(fileId)
});
}
}
render() {
const { step, slideDataSource, isInit } = this.props;
const { step, slideDataSource, isInit, isStandingBook } = this.props;
return (
<Modal title="数据导入" visible={this.props.visiable}
onCancel={this.props.onCancel}
@ -104,6 +115,7 @@ export default class ImportModal extends React.Component {
{
this.props.step == 0 && (<ModalStep1
isInit={isInit}
isStandingBook={isStandingBook}
templateLink={this.props.templateLink}
headerSetCompoent={this.props.headerSetCompoent}
formComponent={this.props.renderFormComponent && this.props.renderFormComponent()}

4
pc4mobx/hrmSalary/components/importModal/modalStep1.js
View File

@ -144,6 +144,10 @@ export default class ModalStep1 extends React.Component {
<div style={{ lineHeight: "30px" }}>
1. 后缀名为xls或者xlsx；<br/>
2. 数据请勿放在合并的单元格中；<br/>
{
this.props.isStandingBook &&
<span>3. 账单月份格式必须为：YYYY-MM；</span>
}
</div>
</div>

34
pc4mobx/hrmSalary/components/importModal/modalStep3.js
View File

@ -1,6 +1,6 @@
import React from "react";
import successImg from "./success.svg";
import { Button, Table, Spin } from "antd";
import { Button, Spin } from "antd";
import { WeaTable } from "ecCom";
export default class ModalStep3 extends React.Component {
@ -29,24 +29,24 @@ export default class ModalStep3 extends React.Component {
<div style={{ flex: "1", display: "flex", flexFlow: "column" }}>
{importResult.successCount === undefined
? <div style={{ textAlign: "center", marginTop: "20px" }}>
<Spin />
正在导入请稍后...
</div>
<Spin/>
正在导入请稍后...
</div>
: <div style={{ marginTop: "20px" }}>
<img src={successImg} style={{ marginBottom: "10px" }} />
<div style={{ fontSize: "20px", marginBottom: "10px" }}>
数据导入完成
</div>
<div>
已导入{" "}
<span style={{ color: "green" }}>
{" "}{importResult.successCount}{" "}
</span>{" "}
条数据，失败<span style={{ color: "red" }}>
{" "}{importResult.errorCount}{" "}
<img src={successImg} style={{ marginBottom: "10px" }} alt=''/>
<div style={{ fontSize: "20px", marginBottom: "10px" }}>
数据导入完成
</div>
<div>
已导入
<span style={{ color: "green" }}>
{importResult.successCount}{" "}
</span>
条数据，失败<span style={{ color: "red" }}>
{importResult.errorCount}{" "}
</span>条数据
</div>
</div>}
</div>
</div>}
<div
style={{
marginTop: "20px",

136
pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/acctResultImportModal.js
View File

@ -1,11 +1,11 @@
import React from "react";
import ImportModal from "../../../../components/importModal";
import { Button, message } from "antd";
import { Badge, Button, message } from "antd";
import { inject, observer } from "mobx-react";
import SelectFieldModal from "./selectFieldModal";
import { getQueryString } from "../../../../util/url";
@inject("calculateStore")
@inject("calculateStore", "standingBookStore")
@observer
export default class AcctResultImportModal extends React.Component {
constructor(props) {
@ -22,20 +22,32 @@ export default class AcctResultImportModal extends React.Component {
componentWillMount() {
const { id } = this.props;
let modalParam = { ...this.state.modalParam };
modalParam.salaryAcctRecordId = id;
this.setState({
modalParam
});
if (id) {
let modalParam = { ...this.state.modalParam };
modalParam.salaryAcctRecordId = id;
this.setState({
modalParam
});
} else {
this.setState({
modalParam: { ...this.state.modalParam, salaryAcctRecordId: "123" }
});
}
}
// 获取模板
handleAccResultTemplateLink() {
const { isStandingBook } = this.props;
let url = "";
if (_.isEmpty(this.state.modalParam.salaryItemIds)) {
message.warning("请选择表单字段");
return;
}
const url= `${window.location.origin}/api/bs/hrmsalary/salaryacct/acctresult/importtemplate/export?salaryItemIds=${this.state.modalParam.salaryItemIds}&salaryAcctRecordId=${this.state.modalParam.salaryAcctRecordId}`;
if (!isStandingBook) {
url = `${window.location.origin}/api/bs/hrmsalary/salaryacct/acctresult/importtemplate/export?salaryItemIds=${this.state.modalParam.salaryItemIds}&salaryAcctRecordId=${this.state.modalParam.salaryAcctRecordId}`;
} else {
url = `${window.location.origin}/api/bs/hrmsalary/siaccount/welfare/importtemplate/export?welfareNames=${this.state.modalParam.salaryItemIds}`;
}
window.open(url, "_self");
}
@ -48,24 +60,28 @@ export default class AcctResultImportModal extends React.Component {
handleFinish() {
this.setState({ step: 0 });
this.props.onCancel();
const childFrameObj = document.getElementById("atdTable");
const salaryAcctRecordId = getQueryString("id");
const payload = {
type: "PR",
listType: "",
url: "/api/bs/hrmsalary/salaryacct/acctresult/list",
queryParams: {
salaryAcctRecordId
}
};
childFrameObj.contentWindow.postMessage(JSON.stringify(payload), "*");
if (!this.props.isStandingBook) {
const childFrameObj = document.getElementById("atdTable");
const salaryAcctRecordId = getQueryString("id");
const payload = {
type: "PR",
listType: "",
url: "/api/bs/hrmsalary/salaryacct/acctresult/list",
queryParams: {
salaryAcctRecordId
}
};
childFrameObj.contentWindow.postMessage(JSON.stringify(payload), "*");
}
}
// 渲染第一步表单
renderFormComponent() {
return <Button onClick={() => {
this.handleSelectedField();
}}>请选择表单字段</Button>;
return <Badge count={!_.isEmpty(this.state.modalParam.salaryItemIds) ? this.state.modalParam.salaryItemIds.split(",").length : 0}>
<Button onClick={() => {
this.handleSelectedField();
}}>请选择表单字段</Button>
</Badge>;
}
// 选择表单字段
@ -78,18 +94,27 @@ export default class AcctResultImportModal extends React.Component {
// 添加表头字段
handleAdd(fieldDate) {
let salaryItemIdsList = [];
fieldDate.formulaItems.map(item => {
if (item.checked) {
salaryItemIdsList.push(item.salaryItemId);
}
});
fieldDate.inputItems.map(item => {
if (item.checked) {
salaryItemIdsList.push(item.salaryItemId);
}
});
if (!_.isEmpty(fieldDate.formulaItems)) {
fieldDate.formulaItems.map(item => {
if (item.checked) {
salaryItemIdsList.push(item.salaryItemId);
}
});
}
if (!_.isEmpty(fieldDate.inputItems)) {
fieldDate.inputItems.map(item => {
if (item.checked) {
salaryItemIdsList.push(item.salaryItemId);
}
});
}
if (!_.isEmpty(fieldDate.sqlItems)) {
fieldDate.sqlItems.map(item => {
if (item.checked) {
salaryItemIdsList.push(item.salaryItemId);
}
});
}
let salaryItemIds = "";
if (salaryItemIdsList.length > 0) {
salaryItemIds = salaryItemIdsList.join(",");
@ -110,15 +135,28 @@ export default class AcctResultImportModal extends React.Component {
setPreviewAcctResultColumns,
setPreviewAcctResultDataSource,
setImportAcctResult
}
},
standingBookStore: {
setPreviewStandingBookAcctResultDataSource,
setPreviewStandingBookAcctResultColumns,
setImportStandingBookAcctResult
},
isStandingBook
} = this.props;
setPreviewAcctResultColumns([]);
setPreviewAcctResultDataSource([]);
setImportAcctResult({});
if (!isStandingBook) {
setPreviewAcctResultColumns([]);
setPreviewAcctResultDataSource([]);
setImportAcctResult({});
} else {
setPreviewStandingBookAcctResultDataSource([]);
setPreviewStandingBookAcctResultColumns([]);
setImportStandingBookAcctResult({});
}
}
render() {
const { calculateStore } = this.props;
//isStandingBook: 是否是社保福利台账核算的导入标识
const { calculateStore, standingBookStore, isStandingBook, visiable } = this.props;
const {
fetchPreviewAcctResult,
previewAcctResultColumns,
@ -126,29 +164,36 @@ export default class AcctResultImportModal extends React.Component {
importAcctResult,
fetchImportAcctResult
} = calculateStore;
const {
welfarePreview,
previewStandingBookAcctResultColumns,
previewStandingBookAcctResultDataSource,
importStandingBookAcctResult,
importInsuranceAcctDetail
} = standingBookStore;
const { step, selectFieldVisible, modalParam } = this.state;
const { visiable } = this.props;
return (
<div>
{
visiable && <ImportModal
isStandingBook={isStandingBook}
init={() => {
this.handleImportModalInit();
}}
params={modalParam}
columns={previewAcctResultColumns}
columns={!isStandingBook ? previewAcctResultColumns : previewStandingBookAcctResultColumns}
step={step}
setStep={this.setStep.bind(this)}
slideDataSource={previewAcctResultDataSource}
importResult={importAcctResult}
slideDataSource={!isStandingBook ? previewAcctResultDataSource : previewStandingBookAcctResultDataSource}
importResult={!isStandingBook ? importAcctResult : importStandingBookAcctResult}
onFinish={() => {
this.handleFinish();
}}
previewImport={(params) => {
fetchPreviewAcctResult(params);
!isStandingBook ? fetchPreviewAcctResult(params) : welfarePreview(params);
}}
importFile={(params) => {
fetchImportAcctResult(params);
!isStandingBook ? fetchImportAcctResult(params) : importInsuranceAcctDetail(params);
}}
templateLink={() => {
this.handleAccResultTemplateLink();
@ -162,6 +207,7 @@ export default class AcctResultImportModal extends React.Component {
}
{
selectFieldVisible && <SelectFieldModal
isStandingBook={isStandingBook}
id={this.props.id}
visible={selectFieldVisible}
fieldData={this.props.fieldData}

228
pc4mobx/hrmSalary/pages/calculateDetail/acctResult/importModal/selectFieldModal.js
View File

@ -3,7 +3,7 @@ import { Button, Col, Modal, Row } from "antd";
import { inject, observer } from "mobx-react";
import { WeaCheckbox } from "ecCom";
@inject("calculateStore")
@inject("calculateStore", "standingBookStore")
@observer
export default class SelectFieldModal extends React.Component {
constructor(props) {
@ -14,33 +14,50 @@ export default class SelectFieldModal extends React.Component {
}
componentWillMount() {
const { calculateStore: { getImportField } } = this.props;
getImportField(this.props.id).then(data => {
let fieldData = {};
let formulaItems = [];
formulaItems = data.formulaItems;
if (this.props.fieldData.formulaItems) {
formulaItems = this.props.fieldData.formulaItems;
}
let inputItems = [];
inputItems = data.inputItems;
if (this.props.fieldData.inputItems) {
inputItems = this.props.fieldData.inputItems;
}
let sqlItems = [];
sqlItems = data.sqlItems;
if (this.props.fieldData.inputItems) {
sqlItems = this.props.fieldData.sqlItems;
}
fieldData.formulaItems = formulaItems;
fieldData.inputItems = inputItems;
fieldData.sqlItems = sqlItems;
const { calculateStore: { getImportField }, standingBookStore: { getWelfareList }, isStandingBook } = this.props;
if(!isStandingBook){
getImportField(this.props.id).then(data => {
let fieldData = {};
let formulaItems = [];
formulaItems = data.formulaItems;
if (this.props.fieldData.formulaItems) {
formulaItems = this.props.fieldData.formulaItems;
}
let inputItems = [];
inputItems = data.inputItems;
if (this.props.fieldData.inputItems) {
inputItems = this.props.fieldData.inputItems;
}
let sqlItems = [];
sqlItems = data.sqlItems;
if (this.props.fieldData.inputItems) {
sqlItems = this.props.fieldData.sqlItems;
}
fieldData.formulaItems = formulaItems;
fieldData.inputItems = inputItems;
fieldData.sqlItems = sqlItems;
this.setState({
fieldData
this.setState({
fieldData
});
this.fieldData = fieldData;
});
this.fieldData = fieldData;
});
}else{
getWelfareList().then(result => {
let fieldData = {};
let formulaItems = [];
formulaItems = _.map(result, it => ({...it, salaryItemId: it.salaryItemName}));
if (this.props.fieldData.formulaItems) {
formulaItems = this.props.fieldData.formulaItems;
}
fieldData.formulaItems = formulaItems;
this.setState({
fieldData
});
this.fieldData = fieldData;
})
}
}
// 公式项改变
@ -140,86 +157,95 @@ export default class SelectFieldModal extends React.Component {
this.handleAddClick();
}}>添加</Button>
</div>
<div style={{ marginTop: "20px" }}>
<div style={{ height: "40px", lineHeight: "40px" }}>
<WeaCheckbox content="公式项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "formula");
}}/>
{
!_.isEmpty(fieldData.formulaItems) &&
<div style={{ marginTop: "20px" }}>
<div style={{ height: "40px", lineHeight: "40px" }}>
<WeaCheckbox content="公式项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "formula");
}}/>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.formulaItems && fieldData.formulaItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "formula");
}}/></Col>
))}
</Row>
</div>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.formulaItems && fieldData.formulaItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "formula");
}}/></Col>
))}
</Row>
</div>
</div>
}
<div style={{ marginTop: "20px" }}>
<div style={{ height: "50px", lineHeight: "50px" }}>
<WeaCheckbox content="输入项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "input");
}}/>
{
!_.isEmpty(fieldData.inputItems) &&
<div style={{ marginTop: "20px" }}>
<div style={{ height: "50px", lineHeight: "50px" }}>
<WeaCheckbox content="输入项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "input");
}}/>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.inputItems && fieldData.inputItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "input");
}}/></Col>
))}
</Row>
</div>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.inputItems && fieldData.inputItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "input");
}}/></Col>
))}
</Row>
</div>
</div>
}
<div style={{ marginTop: "20px" }}>
<div style={{ height: "50px", lineHeight: "50px" }}>
<WeaCheckbox content="SQL项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "sql");
}}/>
{
!_.isEmpty(fieldData.sqlItems) &&
<div style={{ marginTop: "20px" }}>
<div style={{ height: "50px", lineHeight: "50px" }}>
<WeaCheckbox content="SQL项" onChange={(value) => {
this.handleTitleCheckboxChange(value, "sql");
}}/>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.sqlItems && fieldData.sqlItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "sql");
}}/></Col>
))}
</Row>
</div>
</div>
<div style={{
height: "100px",
border: "1px solid #f2f2f2",
margin: "10px",
padding: "10px",
overflowY: "scroll"
}}>
<Row>
{fieldData.sqlItems && fieldData.sqlItems.map(item => (
<Col span={6}>
<WeaCheckbox
value={item.checked ? 1 : 0}
content={item.salaryItemName}
onChange={(value) => {
this.handleFormalChange(item, value, "sql");
}}/></Col>
))}
</Row>
</div>
</div>
}
<div style={{ marginTop: "20px" }}>
<WeaCheckbox content="只显示已选中" onChange={(value) => {

12
pc4mobx/hrmSalary/pages/dataAcquisition/cumDeduct/index.js
View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Col, DatePicker, Dropdown, Menu, message, Row } from "antd";
import { Button, Col, Dropdown, Menu, message, Row } from "antd";
import { WeaDatePicker, WeaHelpfulTip, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import moment from "moment";
import { getSearchs, renderNoright } from "../../../util"; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中
@ -13,8 +13,6 @@ import "./index.less";
import SlideModalTitle from "../../../components/slideModalTitle";
import EditSlideContent from "./editSlideContent";
const { MonthPicker } = DatePicker;
@inject("cumDeductStore", "taxAgentStore")
@observer
export default class CumDeduct extends React.Component {
@ -172,7 +170,7 @@ export default class CumDeduct extends React.Component {
} = this.props;
setSlideVisiable(true);
setCurrentRecord(record);
getCumDeductDetailList(record.id,{taxAgentId:record.taxAgentId});
getCumDeductDetailList(record.id, { taxAgentId: record.taxAgentId });
};
// 增加编辑功能，重写columns绑定事件
@ -316,7 +314,7 @@ export default class CumDeduct extends React.Component {
];
const adBtn = [
// 高级搜索内部按钮
<Button type="primary" onClick={doSearch}>
<Button type="primary" onClick={()=>doSearch({ declareMonth: [this.state.monthValue], taxAgentId: taxAgentId === "All" ? "" : taxAgentId })}>
搜索
</Button>,
<Button type="ghost" onClick={() => form.resetForm()}>
@ -398,7 +396,7 @@ export default class CumDeduct extends React.Component {
const {
cumDeductStore: { exportCumDeductDetailList, currentRecord }
} = this.props;
exportCumDeductDetailList(currentRecord.id, '' , currentRecord.taxAgentId);
exportCumDeductDetailList(currentRecord.id, "", currentRecord.taxAgentId);
};
const handleExportSelectedDetailClick = () => {
@ -551,7 +549,7 @@ export default class CumDeduct extends React.Component {
onFinish={() => {
setModalVisiable(false);
setStep(0);
doSearch();
doSearch({ declareMonth: [this.state.monthValue], taxAgentId: taxAgentId === "All" ? "" : taxAgentId });
}}
previewImport={(params) => {
previewImport(params);

292
pc4mobx/hrmSalary/pages/mobilePayroll/index.js
View File

@ -1,8 +1,11 @@
import React from "react";
import { Col, Row } from "antd";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { getQueryString } from "../../util/url";
import Authority from "../mySalary/authority";
import ComputerTemplate from "../payroll/templatePreview/computerTemplate";
import PhoneTemplate from "../payroll/templatePreview/phoneTemplate";
import "../payroll/templatePreview/index.less";
@inject("mySalaryStore")
@observer
@ -10,16 +13,10 @@ export default class MobilePayroll extends React.Component {
constructor(props) {
super(props);
this.id = "";
this.state = {
type: "phone"
};
}
componentWillMount() {
let id = getQueryString("id");
let type = getQueryString("type");
this.setState({ type });
this.id = id;
this.id = getQueryString("id");
const { mySalaryStore: { getMySalaryBill, init } } = this.props;
init();
getMySalaryBill(this.id);
@ -27,144 +24,161 @@ export default class MobilePayroll extends React.Component {
render() {
const { mySalaryStore: { mySalaryBill } } = this.props;
const { type } = this.state;
const type = getQueryString("type");
const employeeInformation = mySalaryBill.employeeInformation && toJS(mySalaryBill.employeeInformation);
const salaryGroups = mySalaryBill.salaryGroups && toJS(mySalaryBill.salaryGroups);
return (
<div className="computerTemplate" style={{
backgroundColor: "rgb(246, 246, 246)",
minHeight: "600px",
height: "600px",
overflowY: "scroll",
paddingTop: "30px",
paddingBottom: "20px",
margin: "20px auto"
height: "100%",
overflowY: "hidden",
paddingBottom: "20px"
}}>
<Authority ecId={`${this && this.props && this.props.ecId || ""}_Authority@lulowc`} store={this.props.mySalaryStore}>
{/* 标题 */}
<div className="titleWrapper" style={{
textAlign: "center",
fontSize: "18px",
fontWeight: 700
}}>
{mySalaryBill.salaryTemplate && mySalaryBill.salaryTemplate.theme}
</div>
{
mySalaryBill.salaryTemplate && mySalaryBill.salaryTemplate.background && mySalaryBill.salaryTemplate.background !== ""
&& <div className="background-wrapper" style={{
height: "200px",
margin: "10px"
}}>
<img className="background-img" src={mySalaryBill.salaryTemplate.background} style={{
width: "100%",
height: "200px"
}}/>
<Authority ecId={`${this && this.props && this.props.ecId || ""}_Authority@lulowc`}
store={this.props.mySalaryStore}>
<div className="templatePreview">
<div className="contentWrapper">
{
type === "phone" ?
<PhoneTemplate
isPreview
salaryTemplateShowSet={JSON.stringify(mySalaryBill.salaryTemplate)}
salaryItemSet={!_.isEmpty(salaryGroups) ? JSON.stringify([employeeInformation, ...salaryGroups]) : []}
/> :
<ComputerTemplate
isPreview
salaryTemplateShowSet={JSON.stringify(mySalaryBill.salaryTemplate)}
salaryItemSet={!_.isEmpty(salaryGroups) ? JSON.stringify([employeeInformation, ...salaryGroups]) : []}
/>
}
</div>
}
</div>
{/*/!* 标题 *!/*/}
{/*<div className="titleWrapper" style={{*/}
{/* textAlign: "center",*/}
{/* fontSize: "18px",*/}
{/* fontWeight: 700*/}
{/*}}>*/}
{/* {mySalaryBill.salaryTemplate && mySalaryBill.salaryTemplate.theme}*/}
{/*</div>*/}
{/*{*/}
{/* mySalaryBill.salaryTemplate && mySalaryBill.salaryTemplate.background && mySalaryBill.salaryTemplate.background !== ""*/}
{/* && <div className="background-wrapper" style={{*/}
{/* height: "200px",*/}
{/* margin: "10px"*/}
{/* }}>*/}
{/* <img className="background-img" src={mySalaryBill.salaryTemplate.background} style={{*/}
{/* width: "100%",*/}
{/* height: "200px"*/}
{/* }}/>*/}
{/* </div>*/}
{/*}*/}
{/* 员工信息 */}
<div className="sobItemWrapper">
<div className="sobItem" style={{
margin: "10px",
backgroundColor: "#FFF",
padding: "10px",
lineHeight: "35px",
textAlign: "center"
}}>
{
mySalaryBill.employeeInformation && <Row className="titleRow" style={{
border: "1px solid #f2f2f2",
textAlign: "left"
}}>
<Col span={24} className="sobTitle" style={{
paddingLeft: "10px"
}}>{mySalaryBill.employeeInformation.groupName}</Col>
</Row>
}
<Row className="contentRow" style={{
borderLeft: "1px solid #f2f2f2",
borderBottom: "1px solid #f2f2f2",
borderRight: "1px solid #f2f2f2"
}}>
{
mySalaryBill.employeeInformation && mySalaryBill.employeeInformation.items.map((item, index) => (
<Col>
<Col span={type == "phone" ? 12 : 4} className="contentItem" style={{
borderRight: "1px solid #f2f2f2",
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
height: "35px"
}}>{item.name}</Col>
<Col span={type == "phone" ? 12 : 4} className="contentItem"
style={{
borderRight: (index + 1) % 3 == 0 ? "none" : "1px solid #f2f2f2",
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
height: "35px"
}}
>{item.salaryItemValue}</Col>
</Col>
))
}
</Row>
</div>
</div>
{/*<div className="sobItemWrapper">*/}
{/* <div className="sobItem" style={{*/}
{/* margin: "10px",*/}
{/* backgroundColor: "#FFF",*/}
{/* padding: "10px",*/}
{/* lineHeight: "35px",*/}
{/* textAlign: "center"*/}
{/* }}>*/}
{/* {*/}
{/* mySalaryBill.employeeInformation && <Row className="titleRow" style={{*/}
{/* border: "1px solid #f2f2f2",*/}
{/* textAlign: "left"*/}
{/* }}>*/}
{/* <Col span={24} className="sobTitle" style={{*/}
{/* paddingLeft: "10px"*/}
{/* }}>{mySalaryBill.employeeInformation.groupName}</Col>*/}
{/* </Row>*/}
{/* }*/}
{/* <Row className="contentRow" style={{*/}
{/* borderLeft: "1px solid #f2f2f2",*/}
{/* borderBottom: "1px solid #f2f2f2",*/}
{/* borderRight: "1px solid #f2f2f2"*/}
{/* }}>*/}
{/* {*/}
{/* mySalaryBill.employeeInformation && mySalaryBill.employeeInformation.items.map((item, index) => (*/}
{/* <Col>*/}
{/* <Col span={type == "phone" ? 12 : 4} className="contentItem" style={{*/}
{/* borderRight: "1px solid #f2f2f2",*/}
{/* overflow: "hidden",*/}
{/* textOverflow: "ellipsis",*/}
{/* whiteSpace: "nowrap",*/}
{/* height: "35px"*/}
{/* }}>{item.name}</Col>*/}
{/* <Col span={type == "phone" ? 12 : 4} className="contentItem"*/}
{/* style={{*/}
{/* borderRight: (index + 1) % 3 == 0 ? "none" : "1px solid #f2f2f2",*/}
{/* overflow: "hidden",*/}
{/* textOverflow: "ellipsis",*/}
{/* whiteSpace: "nowrap",*/}
{/* height: "35px"*/}
{/* }}*/}
{/* >{item.salaryItemValue}</Col>*/}
{/* </Col>*/}
{/* ))*/}
{/* }*/}
{/* </Row>*/}
{/* </div>*/}
{/*</div>*/}
{
mySalaryBill.salaryGroups && mySalaryBill.salaryGroups.length > 0 &&
mySalaryBill.salaryGroups.map(group => (
<div className="sobItemWrapper">
<div className="sobItem" style={{
margin: "10px",
backgroundColor: "#FFF",
padding: "10px",
lineHeight: "35px",
textAlign: "center"
}}>
{
mySalaryBill.employeeInformation && <Row className="titleRow" style={{
border: "1px solid #f2f2f2",
textAlign: "left"
}}>
<Col span={24} className="sobTitle" style={{
paddingLeft: "10px"
}}>{group.groupName}</Col>
</Row>
}
<Row className="contentRow" style={{
borderLeft: "1px solid #f2f2f2",
borderBottom: "1px solid #f2f2f2",
borderRight: "1px solid #f2f2f2"
}}>
{
group.items && group.items.map((item, index) => (
<Col>
<Col span={type == "phone" ? 12 : 4} className="contentItem" style={{
borderRight: "1px solid #f2f2f2",
borderBottom: (index + 1) > 3 ? "1px solid #f2f2f2" : "none",
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
height: "35px"
}}>{item.name}</Col>
<Col span={type == "phone" ? 12 : 4} className="contentItem"
style={{
borderRight: (index + 1) % 3 == 0 ? "none" : "1px solid #f2f2f2",
borderBottom: (index + 1) > 3 ? "1px solid #f2f2f2" : "none",
overflow: "hidden",
textOverflow: "ellipsis",
whiteSpace: "nowrap",
height: "35px"
}}
>{item.salaryItemValue}</Col>
</Col>
))
}
</Row>
</div>
</div>
))
}
{/*{*/}
{/* mySalaryBill.salaryGroups && mySalaryBill.salaryGroups.length > 0 &&*/}
{/* mySalaryBill.salaryGroups.map(group => (*/}
{/* <div className="sobItemWrapper">*/}
{/* <div className="sobItem" style={{*/}
{/* margin: "10px",*/}
{/* backgroundColor: "#FFF",*/}
{/* padding: "10px",*/}
{/* lineHeight: "35px",*/}
{/* textAlign: "center"*/}
{/* }}>*/}
{/* {*/}
{/* mySalaryBill.employeeInformation && <Row className="titleRow" style={{*/}
{/* border: "1px solid #f2f2f2",*/}
{/* textAlign: "left"*/}
{/* }}>*/}
{/* <Col span={24} className="sobTitle" style={{*/}
{/* paddingLeft: "10px"*/}
{/* }}>{group.groupName}</Col>*/}
{/* </Row>*/}
{/* }*/}
{/* <Row className="contentRow" style={{*/}
{/* borderLeft: "1px solid #f2f2f2",*/}
{/* borderBottom: "1px solid #f2f2f2",*/}
{/* borderRight: "1px solid #f2f2f2"*/}
{/* }}>*/}
{/* {*/}
{/* group.items && group.items.map((item, index) => (*/}
{/* <Col>*/}
{/* <Col span={type == "phone" ? 12 : 4} className="contentItem" style={{*/}
{/* borderRight: "1px solid #f2f2f2",*/}
{/* borderBottom: (index + 1) > 3 ? "1px solid #f2f2f2" : "none",*/}
{/* overflow: "hidden",*/}
{/* textOverflow: "ellipsis",*/}
{/* whiteSpace: "nowrap",*/}
{/* height: "35px"*/}
{/* }}>{item.name}</Col>*/}
{/* <Col span={type == "phone" ? 12 : 4} className="contentItem"*/}
{/* style={{*/}
{/* borderRight: (index + 1) % 3 == 0 ? "none" : "1px solid #f2f2f2",*/}
{/* borderBottom: (index + 1) > 3 ? "1px solid #f2f2f2" : "none",*/}
{/* overflow: "hidden",*/}
{/* textOverflow: "ellipsis",*/}
{/* whiteSpace: "nowrap",*/}
{/* height: "35px"*/}
{/* }}*/}
{/* >{item.salaryItemValue}</Col>*/}
{/* </Col>*/}
{/* ))*/}
{/* }*/}
{/* </Row>*/}
{/* </div>*/}
{/* </div>*/}
{/* ))*/}
{/*}*/}
</Authority>
</div>
);

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

@ -236,10 +236,6 @@ export default class Payroll extends React.Component {
loading,
hasRight,
form,
condition,
tableStore,
showSearchAd,
getTableDatas,
doSearch,
setShowSearchAd
} = payrollStore;
@ -301,6 +297,7 @@ export default class Payroll extends React.Component {
disabledDate={(current) => {
return current && startDate && current.getTime() < new Date(startDate).getTime();
}}
getCalendarContainer={trigger=> trigger.parentNode}
format="YYYY-MM"
onChange={(val) => this.handleRangePickerChange("endDate", val)}
/>

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

@ -1,79 +1,104 @@
import React from 'react'
import background from './background.png'
import { Row, Col } from 'antd'
import moment from 'moment'
import React from "react";
import moment from "moment";
import { inject, observer } from "mobx-react";
import { inject, observer } from 'mobx-react';
@inject('payrollStore')
@inject("payrollStore")
@observer
export default class ComputerTemplate 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)
}
constructor(props) {
super(props);
this.state = {
salaryItemSet: [],
salaryTemplateShowSet: {
theme:'',
background:'',
textContentPosition: '',
textContent: ''
}
};
}
render() {
const { isPC } = this.props;
return (
<div className="computerTemplate">
<div className="titleWrapper">
{this.salaryTemplateShowSet.theme.replace("${companyName}", "上海泛微").replace("${salaryMonth}", moment(new Date()).format("YYYY-MM"))}
</div>
{
this.salaryTemplateShowSet.background && <div className="background-wrapper">
<img className="background-img" src={this.salaryTemplateShowSet.background} />
</div>
}
<div className="sobItemDiv" style={{margin: "20px auto"}}>
{
this.salaryTemplateShowSet.textContentPosition == 1 && this.salaryTemplateShowSet.textContent
}
</div>
componentWillMount() {
if(this.props.isPreview) return;
let salaryTemplateShowSetStr = window.localStorage.getItem("salaryTemplateShowSet");
let salaryItemSetStr = window.localStorage.getItem("salaryItemSet");
this.setState({
salaryItemSet: JSON.parse(salaryItemSetStr),
salaryTemplateShowSet: JSON.parse(salaryTemplateShowSetStr)
});
}
<div className="sobItemWrapper">
{
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={8}>
<Row>
<Col span={ 12 } className="contentItem">{item.name}</Col>
<Col span={ 12 } className="contentItem">{index == 0 ? item.salaryItemValue : 10000}</Col>
</Row>
</Col>
))
}
</Row>
</div>
))
}
</div>
<div style={{margin: "20px auto"}}>
{
this.salaryTemplateShowSet.textContentPosition == 2 && this.salaryTemplateShowSet.textContent
}
</div>
</div>
)
componentWillReceiveProps(nextProps) {
if(nextProps.salaryTemplateShowSet !== this.props.salaryTemplateShowSet){
this.setState({
salaryItemSet: JSON.parse(nextProps.salaryItemSet),
salaryTemplateShowSet: JSON.parse(nextProps.salaryTemplateShowSet),
});
}
}
}
renderTableTr = (data) => {
const tables = [];
const len = data.length;
const rowNum = 3;
const sumRows = len % rowNum;
const sumRowMod = len / rowNum;
const rows = (sumRows == 0 ? sumRowMod : sumRowMod + 1);
for (let j = 0; j < rows; j++) {
let iLen = (j + 1) * rowNum;
iLen = iLen > len ? len : iLen;
tables.push("<tr class='descriptions-row'>");
for (let i = j * rowNum; i < iLen; i++) {
const value = data[i].salaryItemValue || "-";
tables.push("<th class=\"descriptions-item-label\">" + data[i].name + "</th>" + "<td class=\"descriptions-item-content\">" + value + "</td>");
}
tables.push("</tr>");
}
return tables;
};
render() {
const { salaryTemplateShowSet, salaryItemSet }= this.state;
return (
<div className="computerTemplate">
<div className="titleWrapper">
{salaryTemplateShowSet.theme.replace("${companyName}", "上海泛微").replace("${salaryMonth}", moment(new Date()).format("YYYY-MM"))}
</div>
{
salaryTemplateShowSet.background && <div className="background-wrapper">
<img className="background-img" src={salaryTemplateShowSet.background} alt=""/>
</div>
}
<div className="sobItemDiv" style={{ margin: "20px 10px" }}>
{
salaryTemplateShowSet.textContentPosition === "1" && salaryTemplateShowSet.textContent
}
</div>
<div className="sobItemWrapper">
{
salaryItemSet.length > 0 &&
salaryItemSet.map((group, index) => {
return <div className="sobItem">
<div className="descript-title">{group.groupName}</div>
<div className="descriptions-view">
<table
dangerouslySetInnerHTML={{ __html: this.renderTableTr(group.items).join(",").replace(/,/g, "") }}/>
</div>
</div>;
})
}
</div>
<div style={{ margin: "20px 10px" }}>
{
salaryTemplateShowSet.textContentPosition === "2" && salaryTemplateShowSet.textContent
}
</div>
</div>
);
}
}

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

@ -1,51 +1,50 @@
import React from 'react'
import phone from './phone_new.png'
import computer from './computer.png'
import './index.less'
import ComputerTemplate from './computerTemplate'
import PhoneTemplate from './phoneTemplate'
import { inject, observer } from 'mobx-react';
import React from "react";
import phone from "./phone_new.png";
import computer from "./computer.png";
import "./index.less";
import ComputerTemplate from "./computerTemplate";
import PhoneTemplate from "./phoneTemplate";
import { inject, observer } from "mobx-react";
@inject('payrollStore')
@inject("payrollStore")
@observer
export default class TemplatePreview extends React.Component {
constructor(props) {
super(props)
this.state = {
selectKey: "0"
}
}
constructor(props) {
super(props);
this.state = {
selectKey: "0"
};
}
handleSelectClick(selectKey) {
this.setState({selectKey})
}
render() {
const { selectKey } = this.state;
return (
<div className="templatePreview">
<div className="headerWrapper">
<div className="iconsWrapper">
<div onClick={() => {
this.handleSelectClick("0")
}} className={selectKey == "0" ? "iconWrapper activeIconWrapper" : "iconWrapper" }>
<img src={computer} />
</div>
<div onClick={() => {
this.handleSelectClick("1")
}} className={selectKey == "1" ? "iconWrapper activeIconWrapper" : "iconWrapper"}>
<img src={phone}/>
</div>
</div>
</div>
handleSelectClick(selectKey) {
this.setState({ selectKey });
}
<div className="contentWrapper">
{
this.state.selectKey == "0" ? <ComputerTemplate /> : <PhoneTemplate />
}
</div>
render() {
const { selectKey } = this.state;
return (
<div className="templatePreview">
<div className="headerWrapper">
<div className="iconsWrapper">
<div onClick={() => {
this.handleSelectClick("0");
}} className={selectKey === "0" ? "iconWrapper activeIconWrapper" : "iconWrapper"}>
<img src={computer} alt=""/>
</div>
)
}
}
<div onClick={() => {
this.handleSelectClick("1");
}} className={selectKey === "1" ? "iconWrapper activeIconWrapper" : "iconWrapper"}>
<img src={phone} alt=""/>
</div>
</div>
</div>
<div className="contentWrapper">
{
this.state.selectKey === "0" ? <ComputerTemplate/> : <PhoneTemplate/>
}
</div>
</div>
);
}
}

218
pc4mobx/hrmSalary/pages/payroll/templatePreview/index.less
View File

@ -1,99 +1,139 @@
.templatePreview {
height: 100%;
display: flex;
flex-direction: column;
.contentWrapper {
height: 90vh;
overflow-y: scroll;
}
.headerWrapper {
background-color: #0270c1;
.contentWrapper {
flex: 1;
overflow-y: scroll;
}
.headerWrapper {
background-color: #0270c1;
height: 55px;
line-height: 55px;
text-align: center;
.iconsWrapper {
display: inline-block;
width: 150px;
height: 55px;
.iconWrapper {
display: inline-block;
width: 64px;
height: 55px;
line-height: 55px;
line-height: 75px;
text-align: center;
.iconsWrapper {
display: inline-block;
width: 150px;
height: 55px;
.iconWrapper {
display: inline-block;
width: 64px;
height: 55px;
line-height: 75px;
text-align: center;
img {
width: 30px;
height: 30px;
}
}
.activeIconWrapper {
background-color: #1c87d3;
}
img {
width: 30px;
height: 30px;
}
}
.activeIconWrapper {
background-color: #1c87d3;
}
}
}
.computerTemplate {
background-color: rgb(246, 246, 246);
width: 900px;
padding-top: 30px;
padding-bottom: 20px;
margin: 20px auto;
box-shadow: rgba(214, 214, 214, 0.5) 0px 0px 14px 0px;
border: 3px solid #fff;
.background-wrapper {
height: 200px;
margin: 10px;
}
.computerTemplate {
background-color: rgb(246, 246, 246);
width: 900px;
padding-top: 30px;
padding-bottom: 20px;
margin: 20px auto;
box-shadow: rgba(214, 214, 214, 0.5) 0px 0px 14px 0px;
border: 3px solid #fff;
.background-wrapper {
height: 200px;
margin: 10px;
}
.background-img {
width: 100%;
height: 200px;
}
.titleWrapper {
text-align: center;
font-size: 18px;
font-weight: 700;
}
.sobItem {
margin: 10px;
background-color: #FFF;
padding: 10px;
line-height: 35px;
text-align: center;
.titleRow {
border: 1px solid #f2f2f2;
text-align: left;
.sobTitle {
padding-left: 10px;
}
}
.contentRow {
border-left: 1px solid #f2f2f2;
border-bottom: 1px solid #f2f2f2;
border-right: 1px solid #f2f2f2;
}
.contentItem {
border-right: 1px solid #f2f2f2;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.contentItem:last-child {
border-right: none;
}
}
.background-img {
width: 100%;
height: 200px;
}
.phoneTemplate {
width: 330px;
padding-top: 0px;
border-radius: 20px;
.phoneBar {
height: 50px;
line-height: 50px;
font-size: 16px;
font-weight: 700;
background-color: #fff;
text-align: center;
}
.titleWrapper {
text-align: center;
font-size: 18px;
font-weight: 700;
}
}
}
.phoneTemplate {
width: 330px;
padding-top: 0px;
border-radius: 20px;
.phoneBar {
height: 50px;
line-height: 50px;
font-size: 16px;
font-weight: 700;
background-color: #fff;
text-align: center;
}
}
.sobItem {
margin: 10px;
background-color: #FFF;
padding: 10px;
.descript-title{
display: flex;
align-items: center;
margin-bottom: 10px;
flex: auto;
overflow: hidden;
color: #000000d9;
font-weight: 700;
font-size: 14px;
line-height: 1.5715;
white-space: nowrap;
text-overflow: ellipsis;
border: 1px solid #fafafa;
border-bottom: none;
}
.descriptions-view{
width: 100%;
table{
table-layout: fixed;
border-collapse: collapse;
width: 100%;
border: 1px solid rgba(0,0,0,.06);
.descriptions-row{
.descriptions-item-label{
background-color: #fafafa;
padding: 16px 24px;
color: #000000d9;
font-weight: 400;
font-size: 12px;
line-height: 1.5715;
text-align: start;
border: 1px solid rgba(0,0,0,.06);
min-width: 100px;
max-width: 100px;
}
.descriptions-item-content{
padding: 16px 24px;
display: table-cell;
flex: 1;
color: #000000d9;
font-size: 12px;
line-height: 1.5715;
word-break: break-word;
overflow-wrap: break-word;
border-collapse: collapse;
border: 1px solid rgba(0,0,0,.06);
}
}
}
}
}
}

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

@ -1,84 +1,96 @@
import React from 'react'
import { Row, Col} from 'antd'
import background from '../computerTemplate/background.png'
import "../index.less"
import { inject, observer } from 'mobx-react';
import moment from 'moment'
import React from "react";
import "../index.less";
import { inject, observer } from "mobx-react";
import moment from "moment";
@inject('payrollStore')
@inject("payrollStore")
@observer
export default class PhoneTemplate extends React.Component {
constructor(props) {
super(props);
this.templateBaseData = {}
this.salaryItemSetStr = {}
this.salaryTemplateShowSet = []
constructor(props) {
super(props);
this.state = {
salaryItemSet: [],
salaryTemplateShowSet: {
theme:'',
background:'',
textContentPosition: '',
textContent: ''
}
};
}
componentWillMount() {
if(this.props.isPreview) return;
let salaryTemplateShowSetStr = window.localStorage.getItem("salaryTemplateShowSet");
let salaryItemSetStr = window.localStorage.getItem("salaryItemSet");
this.setState({
salaryItemSet: JSON.parse(salaryItemSetStr),
salaryTemplateShowSet: JSON.parse(salaryTemplateShowSetStr)
});
}
componentWillReceiveProps(nextProps) {
if(nextProps.salaryTemplateShowSet !== this.props.salaryTemplateShowSet){
this.setState({
salaryItemSet: JSON.parse(nextProps.salaryItemSet),
salaryTemplateShowSet: JSON.parse(nextProps.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>
render() {
const { salaryTemplateShowSet, salaryItemSet }= this.state;
return (
<div className="computerTemplate phoneTemplate">
<div className="phoneBar">薪酬预览</div>
<div className="titleWrapper">
{salaryTemplateShowSet.theme.replace("${companyName}", "上海泛微").replace("${salaryMonth}", moment(new Date()).format("YYYY-MM"))}
</div>
{
this.salaryTemplateShowSet.background && <div className="background-wrapper">
<img className="background-img" src={this.salaryTemplateShowSet.background} />
</div>
}
{
salaryTemplateShowSet.background && <div className="background-wrapper">
<img className="background-img" src={salaryTemplateShowSet.background}/>
</div>
}
<div className="sobItemDiv" style={{margin: "20px auto"}}>
<div className="sobItemDiv" style={{ margin: "20px 10px" }}>
{
salaryTemplateShowSet.textContentPosition == 1 && salaryTemplateShowSet.textContent
}
</div>
<div className="sobItemWrapper">
{
salaryItemSet.length > 0 &&
salaryItemSet.map((group, index) => (
<div className="sobItem">
<div className="descript-title">{group.groupName}</div>
<div className="descriptions-view">
<table>
{
this.salaryTemplateShowSet.textContentPosition == 1 && this.salaryTemplateShowSet.textContent
_.map(group.items, item => {
return <tr className="descriptions-row">
<th className="descriptions-item-label">{item.name}</th>
<td className="descriptions-item-content">{item.salaryItemValue || '-'}</td>
</tr>;
})
}
</table>
</div>
</div>
))
}
</div>
<div className="sobItemWrapper">
{
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={24}>
<Row>
<Col span={ 12 } className="contentItem">{item.name}</Col>
<Col span={ 12 } className="contentItem">{index == 0 ? item.salaryItemValue : 10000}</Col>
</Row>
</Col>
))
}
</Row>
</div>
))
}
</div>
<div style={{margin: "20px auto"}}>
{
this.salaryTemplateShowSet.textContentPosition == 2 && this.salaryTemplateShowSet.textContent
}
</div>
</div>
)
}
}
<div style={{ margin: "20px 10px" }}>
{
salaryTemplateShowSet.textContentPosition == 2 && salaryTemplateShowSet.textContent
}
</div>
</div>
);
}
}

565
pc4mobx/hrmSalary/pages/salaryFile/changeSalaryModal.js
View File

@ -1,291 +1,298 @@
import React from 'react'
import { Row, Col, Table, Modal, Icon, Button, Select, message } from 'antd'
const { Option } = Select
import { WeaInput, WeaSelect, WeaDatePicker, WeaTable } from "ecCom"
import { changeSalaryModalColumns, dataSource } from './columns'
import RequiredLabelTip from '../../components/requiredLabelTip'
import "./index.less"
import { inject, observer } from 'mobx-react';
import moment from 'moment'
import React from "react";
import { Button, Col, Icon, message, Row, Select } from "antd";
import { WeaDatePicker, WeaDialog, WeaInput, WeaTable } from "ecCom";
import RequiredLabelTip from "../../components/requiredLabelTip";
import "./index.less";
import { inject, observer } from "mobx-react";
import moment from "moment";
@inject('salaryFileStore')
const { Option } = Select;
@inject("salaryFileStore")
@observer
export default class ChangeSalaryModal extends React.Component {
constructor(props) {
super(props)
this.state = {
inited: false,
selectedRowKeys: [],
salaryArchiveItems: [
{
key: "1",
salaryItem: "",
salaryBefore: "",
adjustAfter: ""
}
],
request: {
effectiveTime: moment(new Date()).format("YYYY-MM-DD"),
salaryArchiveId: this.props.currentId,
adjustReason: "",
description: ""
}
constructor(props) {
super(props);
this.state = {
inited: false,
selectedRowKeys: [],
salaryArchiveItems: [
{
key: "1",
salaryItem: "",
salaryBefore: "",
adjustAfter: ""
}
}
],
request: {
effectiveTime: moment(new Date()).format("YYYY-MM-DD"),
salaryArchiveId: this.props.currentId,
adjustReason: "",
description: ""
}
};
}
// 改变回调
handleChange(params) {
let request = {...this.state.request, ...params}
this.setState({
request
})
}
// 改变回调
handleChange(params) {
let request = { ...this.state.request, ...params };
this.setState({
request
});
}
// 表格中薪资项目选择项下拉，改变事件
handleSalaryItemChange(item, value) {
const {salaryFileStore: {getSalaryItemAdjustBeforeValue}} = this.props;
const { salaryArchiveItems} = this.state;
// alert("item.id : "+ item.id)
// alert(JSON.stringify({salaryArchiveId: this.props.currentId, salaryItemId: item.id}))
getSalaryItemAdjustBeforeValue({salaryArchiveId: this.props.currentId, salaryItemId: value}).then((data) => {
let dataSource = [ ...salaryArchiveItems ]
dataSource.map(i => {
if(i.key == item.key) {
i.salaryItem = value;
i.salaryBefore = data
}
})
this.setState({
salaryArchiveItems: dataSource
})
})
}
// 调整后表格字段变化回调
handleSalaryAfterItemChange(item, value) {
const { salaryArchiveItems } = this.state;
let dataSource = [ ...salaryArchiveItems ]
dataSource.map(i => {
if(i.key == item.key) {
i.adjustAfter = value;
}
})
this.setState({
salaryArchiveItems: dataSource
})
}
// 解析Columns
getColumns() {
const {salaryFileStore: {salaryItemChangeForm} } = this.props;
const { salaryItemList } = salaryItemChangeForm
let {columns} = salaryItemChangeForm
return columns.map(item => {
item = {...item}
if(item.dataIndex == "salaryItem") {
item.title = <span>{item.title}<RequiredLabelTip /></span>
item.render = (text, record) => {
return (
<Select defaultValue={text} style={{ width: 150 }} onChange={(value) => this.handleSalaryItemChange(record, value)}>
{
salaryItemList && salaryItemList.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
)
}
}else if(item.dataIndex == "adjustAfter"){
item.title = <span>{item.title}<RequiredLabelTip /></span>
item.render = (text, record) => {
return (
<WeaInput style={{width: '150px'}} value={text} onChange={(value) => {
this.handleSalaryAfterItemChange(record, value)
}}/>
)
}
}
return item;
})
}
// 添加按钮点击回调
handleAddItemClick() {
const { salaryArchiveItems } = this.state;
let result = [...salaryArchiveItems]
let lastKey = "1";
if(result.length > 0) {
lastKey = parseInt(result[result.length - 1].key) + 1
// 表格中薪资项目选择项下拉，改变事件
handleSalaryItemChange(item, value) {
const { salaryFileStore: { getSalaryItemAdjustBeforeValue } } = this.props;
const { salaryArchiveItems } = this.state;
// alert("item.id : "+ item.id)
// alert(JSON.stringify({salaryArchiveId: this.props.currentId, salaryItemId: item.id}))
getSalaryItemAdjustBeforeValue({ salaryArchiveId: this.props.currentId, salaryItemId: value }).then((data) => {
let dataSource = [...salaryArchiveItems];
dataSource.map(i => {
if (i.key == item.key) {
i.salaryItem = value;
i.salaryBefore = data;
}
result.push({
key: lastKey + "",
salaryItem: "",
adjustBefore: "",
adjustAfter: ""
})
});
this.setState({
salaryArchiveItems: dataSource
});
});
}
this.setState({
salaryArchiveItems: result
})
}
componentWillMount() {
const { salaryFileStore: {salaryItemChangeForm, getSalaryItemForm, getSalaryItemFormByItemId}, currentId, recordId} = this.props;
if(recordId) {
getSalaryItemFormByItemId(recordId).then(data => {
let request = {...this.state.request}
request.effectiveTime = data.effectiveTime
request.adjustReason = data.adjustReason
request.description = data.description
this.setState({
salaryArchiveItems: data.dataSource,
inited: true,
request
})
})
} else {
getSalaryItemForm(currentId).then(() => {
this.setState({
inited: true
})
})
}
}
// 调整后表格字段变化回调
handleSalaryAfterItemChange(item, value) {
const { salaryArchiveItems } = this.state;
let dataSource = [...salaryArchiveItems];
dataSource.map(i => {
if (i.key == item.key) {
i.adjustAfter = value;
}
});
this.setState({
salaryArchiveItems: dataSource
});
}
// 保存
handleSave() {
const { salaryFileStore: {saveSalaryItem, fetchSingleSalaryItemList, getArchiveForm}} = this.props;
let saveRequest = {...this.state.request}
const { salaryArchiveItems } = this.state;
if(salaryArchiveItems.length == 0) {
message.warning("请添加调薪明细")
return
}
saveRequest.salaryArchiveItems = salaryArchiveItems.map(item => {
let result = {}
result.salaryItemId = item.salaryItem
result.adjustValue = item.adjustAfter
return result
})
saveSalaryItem(saveRequest).then(() => {
getArchiveForm(this.props.currentId)
fetchSingleSalaryItemList({salaryArchiveId: this.props.currentId})
this.props.onCancel()
})
}
onSelectChange = selectedRowKeys => {
this.setState({ selectedRowKeys });
}
// 批量删除回调
handleRemoveClick = () => {
const { selectedRowKeys, salaryArchiveItems } = this.state;
let result = [...salaryArchiveItems]
if(selectedRowKeys.length == 0) {
message.warning("未选择条目")
}
this.setState({
salaryArchiveItems: result.filter(item => selectedRowKeys.indexOf(item.key) < 0)
})
}
render() {
const { salaryFileStore: {salaryItemChangeForm} } = this.props;
const { request, salaryArchiveItems, selectedRowKeys } = this.state;
const { effectiveTime, adjustReason, description } = request
const rowSelection = {
selectedRowKeys,
onChange: this.onSelectChange,
// 解析Columns
getColumns() {
const { salaryFileStore: { salaryItemChangeForm } } = this.props;
const { salaryItemList } = salaryItemChangeForm;
let { columns } = salaryItemChangeForm;
return columns.map(item => {
item = { ...item };
if (item.dataIndex == "salaryItem") {
item.title = <span>{item.title}<RequiredLabelTip/></span>;
item.render = (text, record) => {
return (
<Select defaultValue={text} style={{ width: 150 }}
onChange={(value) => this.handleSalaryItemChange(record, value)}>
{
salaryItemList && salaryItemList.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
);
};
} else if (item.dataIndex == "adjustAfter") {
item.title = <span>{item.title}<RequiredLabelTip/></span>;
item.render = (text, record) => {
return (
<WeaInput style={{ width: "150px" }} value={text} onChange={(value) => {
this.handleSalaryAfterItemChange(record, value);
}}/>
);
};
}
return item;
});
}
return (
<Modal title="调薪" width={800} visible={this.props.visible} onClose={() => {
this.props.onCancel()
}}
footer={<Button type="primary" onClick={() => {
this.handleSave()
}}>保存</Button>}
>
<div className="changeSalaryModal" style={{padding: "10px 20px"}}>
<Row className="itemWrapper" style={{lineHeight: '47px'}}>
<Col span={6}>
生效日期<RequiredLabelTip />
</Col>
<Col span={18}>
<WeaDatePicker
format="yyyy-MM-dd"
style={{width: "200px"}}
value={effectiveTime}
onChange={(value) => {
this.handleChange({ effectiveTime: value })
}}
/>
</Col>
</Row>
<Row className="itemWrapper" style={{lineHeight: "47px"}}>
<Col span={6}>
调整原因<RequiredLabelTip />
</Col>
<Col span={18}>
{/* {
this.state.inited && <WeaSelect
options={salaryItemChangeForm.adjustReasonList}
style={{width: "200px"}}
value={adjustReason}
onChange={(value) => {this.handleChange({ adjustReason: value })}}
/>
} */}
<Select defaultValue={adjustReason} value={adjustReason} style={{ width: 200 }} onChange={(value) => this.handleChange({adjustReason: value})}>
{
salaryItemChangeForm.adjustReasonList && salaryItemChangeForm.adjustReasonList.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
<Row className="itemWrapper" style={{lineHeight: '47px'}}>
<Col span={6}>
说明
</Col>
<Col span={18}>
<WeaInput
style={{width: "200px"}}
value={description}
onChange={value => {
this.handleChange({description: value})
}}
/>
</Col>
</Row>
</div>
<div className="contentWrapper">
<div className="contentTitleWrapper" style={{height: "40px",lineHeight: "40px"}}>
<span className="contentTitle" style={{fontSize: "14px", color: "#666"}}>调薪明细</span>
<div className="rightIconWrapper" style={{display: "inline-block", float: "right"}}>
<Icon type="minus-square" style={{color: "#2db7f5", cursor: "pointer", marginRight: "15px"}} onClick={() => {
this.handleRemoveClick()
}}/>
<Icon type="plus-square" style={{color: "#2db7f5", cursor: "pointer"}} onClick={() => {
this.handleAddItemClick()
}}/>
</div>
</div>
<div className="tableWrapper">
{
this.state.inited && <WeaTable rowSelection={rowSelection} dataSource={salaryArchiveItems} columns={this.getColumns()}/>
}
</div>
</div>
</Modal>
)
// 添加按钮点击回调
handleAddItemClick() {
const { salaryArchiveItems } = this.state;
let result = [...salaryArchiveItems];
let lastKey = "1";
if (result.length > 0) {
lastKey = parseInt(result[result.length - 1].key) + 1;
}
}
result.push({
key: lastKey + "",
salaryItem: "",
adjustBefore: "",
adjustAfter: ""
});
this.setState({
salaryArchiveItems: result
});
}
componentWillMount() {
const {
salaryFileStore: { salaryItemChangeForm, getSalaryItemForm, getSalaryItemFormByItemId },
currentId,
recordId
} = this.props;
if (recordId) {
getSalaryItemFormByItemId(recordId).then(data => {
let request = { ...this.state.request };
request.effectiveTime = data.effectiveTime;
request.adjustReason = data.adjustReason;
request.description = data.description;
this.setState({
salaryArchiveItems: data.dataSource,
inited: true,
request
});
});
} else {
getSalaryItemForm(currentId).then(() => {
this.setState({
inited: true
});
});
}
}
// 保存
handleSave() {
const { salaryFileStore: { saveSalaryItem, fetchSingleSalaryItemList, getArchiveForm } } = this.props;
let saveRequest = { ...this.state.request };
const { salaryArchiveItems } = this.state;
if (salaryArchiveItems.length === 0) {
message.warning("请添加调薪明细");
return;
}
saveRequest.salaryArchiveItems = salaryArchiveItems.map(item => {
let result = {};
result.salaryItemId = item.salaryItem;
result.adjustValue = item.adjustAfter;
return result;
});
saveSalaryItem(saveRequest).then(() => {
getArchiveForm(this.props.currentId);
fetchSingleSalaryItemList({ salaryArchiveId: this.props.currentId });
this.props.onCancel();
});
}
onSelectChange = selectedRowKeys => {
this.setState({ selectedRowKeys });
};
// 批量删除回调
handleRemoveClick = () => {
const { selectedRowKeys, salaryArchiveItems } = this.state;
let result = [...salaryArchiveItems];
if (selectedRowKeys.length === 0) {
message.warning("未选择条目");
}
this.setState({
salaryArchiveItems: result.filter(item => selectedRowKeys.indexOf(item.key) < 0)
});
};
render() {
const { salaryFileStore: { salaryItemChangeForm } } = this.props;
const { request, salaryArchiveItems, selectedRowKeys } = this.state;
const { effectiveTime, adjustReason, description } = request;
const rowSelection = {
selectedRowKeys,
onChange: this.onSelectChange
};
return (
<WeaDialog
title="调薪" style={{ width: 800 }}
initLoadCss visible={this.props.visible}
onCancel={() => {
this.props.onCancel();
}}
buttons={[<Button type="primary" onClick={() => {
this.handleSave();
}}>保存</Button>]}
>
<div className="changeSalaryWrapper">
<div className="changeSalaryModal">
<Row className="itemWrapper" style={{ lineHeight: "47px" }}>
<Col span={6}>
生效日期<RequiredLabelTip/>
</Col>
<Col span={18}>
<WeaDatePicker
format="yyyy-MM-dd"
style={{ width: "200px" }}
value={effectiveTime}
onChange={(value) => {
this.handleChange({ effectiveTime: value });
}}
/>
</Col>
</Row>
<Row className="itemWrapper" style={{ lineHeight: "47px" }}>
<Col span={6}>
调整原因<RequiredLabelTip/>
</Col>
<Col span={18}>
<Select defaultValue={adjustReason} value={adjustReason} style={{ width: 200 }}
onChange={(value) => this.handleChange({ adjustReason: value })}>
{
salaryItemChangeForm.adjustReasonList && salaryItemChangeForm.adjustReasonList.map(item => (
<Option value={item.key}>{item.showname}</Option>
))
}
</Select>
</Col>
</Row>
<Row className="itemWrapper" style={{ lineHeight: "47px" }}>
<Col span={6}>
说明
</Col>
<Col span={18}>
<WeaInput
style={{ width: "200px" }}
value={description}
onChange={value => {
this.handleChange({ description: value });
}}
/>
</Col>
</Row>
</div>
<div className="contentWrapper">
<div className="contentTitleWrapper" style={{ height: "40px", lineHeight: "40px" }}>
<span className="contentTitle" style={{ fontSize: "14px", color: "#666" }}>调薪明细</span>
<div className="rightIconWrapper" style={{ display: "inline-block", float: "right" }}>
<Button type="primary"
size="small"
disabled={salaryArchiveItems.length === 1}
onClick={() => {
this.handleRemoveClick();
}}
><span className="icon-coms-form-delete-hot" title="删除"></span></Button>
<Button type="primary"
size="small"
onClick={() => {
this.handleAddItemClick();
}}
><span className="icon-coms-Add-to-hot" title="添加"></span></Button>
</div>
</div>
<div className="tableWrapper">
{
this.state.inited &&
<WeaTable rowSelection={rowSelection} dataSource={salaryArchiveItems} columns={this.getColumns()}/>
}
</div>
</div>
</div>
</WeaDialog>
);
}
}

58
pc4mobx/hrmSalary/pages/salaryFile/index.js
View File

@ -5,6 +5,7 @@ import { Button, Dropdown, Menu, message, Modal } from "antd";
import {
WeaBrowser,
WeaCheckbox,
WeaDatePicker,
WeaFormItem,
WeaHelpfulTip,
WeaInput,
@ -57,7 +58,8 @@ export default class SalaryFile extends React.Component {
archiveStatus: "EFFICIENT",
taxAgentId: "",
subcompanyIds: ""
}
},
noPayDate: "" //最后停薪日期
};
this.pageInfo = { current: 1, pageSize: 10 };
}
@ -230,13 +232,35 @@ export default class SalaryFile extends React.Component {
setCurrentId(record.id);
}
// 显示调整个税扣缴义务人表单
handSildeOptionMenuClick(e) {
// 停薪
handleNoPay = () => {
const {
salaryFileStore: { setEditAgentVisible }
salaryFileStore: { stopSalary, getTableDatas }
} = this.props;
setEditAgentVisible(true);
}
Modal.confirm({
title: "停薪确认",
content: <WeaFormItem
label="最后发薪日期"
labelCol={{ span: 6 }}
wrapperCol={{ span: 18 }}
>
<WeaDatePicker
value={this.state.noPayDate}
viewAttr={2}
style={{width: "100%"}}
onChange={noPayDate => this.setState({ noPayDate })}
/>
</WeaFormItem>,
width: 516,
onOk: () => {
stopSalary(this.state.noPayDate).then(()=>{
getTableDatas({ ...this.state.searchItemsValue });
})
},
onCancel: () => {
}
});
};
// 查看 Slide 头部操作按钮
renderEditSlideOperate = () => {
@ -252,26 +276,14 @@ export default class SalaryFile extends React.Component {
}
{
showOperateBtn &&
<Button type="primary" onClick={() => {
<Button type="primary" style={{ marginRight: 10 }} onClick={() => {
this.setState({ changeSalaryVisible: true });
}}>调薪</Button>
}
{/*暂时去掉调整个税扣缴义务人导入按钮*/}
{/*{*/}
{/* showOperateBtn &&*/}
{/* <Dropdown.Button*/}
{/* type="primary"*/}
{/* overlay={*/}
{/* <Menu onClick={this.handSildeOptionMenuClick.bind(this)}>*/}
{/* <Menu.Item key="1">调整个税扣缴义务人</Menu.Item>*/}
{/* </Menu>*/}
{/* }*/}
{/* onClick={() => {*/}
{/* this.setState({ changeSalaryVisible: true });*/}
{/* }}>*/}
{/* 调薪*/}
{/* </Dropdown.Button>*/}
{/*}*/}
{
showOperateBtn &&
<Button type="primary" onClick={this.handleNoPay}>停薪</Button>
}
</div>
);
};

43
pc4mobx/hrmSalary/pages/salaryFile/index.less
View File

@ -1,12 +1,24 @@
.changeSalaryModal {
padding: 10px 20px;
.changeSalaryWrapper {
width: 100%;
min-height: 50vh;
max-height: 60vh;
overflow-y: auto;
.itemWrapper {
line-height: 47px;
.changeSalaryModal {
padding: 10px 20px;
.itemWrapper {
line-height: 47px;
.ant-select-selection {
border-radius: 0 !important;
height: 30px !important;
}
}
}
.contentWrapper {
margin-top: 10px;
padding: 10px 20px;
.contentTitleWrapper {
height: 40px;
@ -15,15 +27,36 @@
.rightIconWrapper {
display: inline-block;
float: right;
.ant-btn{
margin-left: 10px;
border-radius: 0;
padding: 0;
background: transparent;
border: none;
font-size: 20px;
line-height: 20px;
}
.ant-btn.ant-btn-primary[disabled]{
color: #d8d8d8;
}
.ant-btn.ant-btn-primary{
color: #55a1f8;
}
}
}
.tableWrapper {
margin-top: 10px;
}
.ant-select-selection {
border-radius: 0 !important;
height: 30px !important;
}
}
}
.salaryFileSlide {
padding: 10px 20px;

2
pc4mobx/hrmSalary/pages/salaryItem/index.less
View File

@ -9,7 +9,7 @@
.formula-wrapper{
.ant-modal-body{
min-height: 200px;
max-height: 50vh;
max-height: 85vh;
overflow: auto;
}
}

2
pc4mobx/hrmSalary/pages/salaryItem/systemSalaryItemModal.js
View File

@ -46,7 +46,7 @@ export default class SystemSalaryItemModal extends React.Component {
visible={this.props.visible}
onCancel={() => {
this.props.onCancel();
}} width={800}
}} width={900}
>
<div style={{ height: "47px", lineHeight: "47px" }}>
<span style={{ marginLeft: "10px", fontSize: "14px" }}>添加系统薪资项目</span>

36
pc4mobx/hrmSalary/pages/socialSecurityBenefits/standingBookDetail/components/normal.js
View File

@ -12,6 +12,7 @@ import { WeaDialog, WeaInputSearch, WeaTable } from "ecCom";
import { getSearchs } from "../../../../util";
import { getQueryString } from "../../../../util/url";
import ProgressModal from "../../../../components/progressModal";
import AcctResultImportModal from '../../../calculateDetail/acctResult/importModal/acctResultImportModal';
import _ from "lodash";
import "./index.less";
@ -36,7 +37,11 @@ export default class NormalIndex extends Component {
},
searchValue: "",
progressVisible: false,
progress: 0
progress: 0,
fieldData:{}, //选中的表单头信息
importParams:{ //导入信息的弹框表示
visible: false
}
};
this.timer = null;
}
@ -354,7 +359,7 @@ export default class NormalIndex extends Component {
render() {
const { remarks, billMonth, selectedKey, paymentOrganization } = this.props;
const { selectedRowKeys, addProps, date } = this.state;
const { selectedRowKeys, addProps, date, importParams } = this.state;
const {
loading,
form,
@ -478,8 +483,33 @@ export default class NormalIndex extends Component {
}}
progress={this.state.progress}
/>
<Tooltip title="导入数据">
<i className="icon-coms02-Template-import1" style={{ color: "#2db7f5", fontSize: 18, marginRight: 10 }}
onClick={()=> this.setState({importParams: {...importParams, visible: true}})}/>
</Tooltip>
{/*导入弹框*/}
<AcctResultImportModal
visiable={importParams.visible}
fieldData={this.state.fieldData}
onAdd={fieldData => {
this.setState({
fieldData
});
}}
onCancel={() =>{
this.setState({importParams: {...importParams, visible: false}},()=>{
const { billMonth, selectedKey, paymentOrganization } = this.props;
const { current } = this.state;
selectedKey === "1"
? this.getNormalList({ billMonth, current, paymentOrganization })
: this.getSupplementaryList({ billMonth, current, paymentOrganization });
})
}}
isStandingBook
/>
<Tooltip title="导出全部">
<i className="icon-coms02-coms2-export" style={{ color: "#2db7f5", fontSize: 18 }}
<i className="icon-coms-export" style={{ color: "#2db7f5", fontSize: 18 }}
onClick={this.handleExport}/>
</Tooltip>
<WeaInputSearch

43
pc4mobx/hrmSalary/pages/socialSecurityBenefits/standingBookDetail/index.js
View File

@ -4,26 +4,26 @@
* Date: 2022-04-19 16:57:29
* LastEditTime: 2022-04-20 21:01:57
*/
import React, { Component } from 'react';
import { inject, observer } from 'mobx-react';
import { WeaTab } from 'ecCom';
import NormalIndex from './components/normal';
import OverViewIndex from './components/overView';
import AbnormalListIndex from './components/abnormalList';
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaTab } from "ecCom";
import NormalIndex from "./components/normal";
import OverViewIndex from "./components/overView";
import AbnormalListIndex from "./components/abnormalList";
@inject('standingBookStore')
@inject("standingBookStore")
@observer
class StandingBookDetail extends Component {
constructor(props) {
super(props);
this.state = {
selectedKey: '',
selectedKey: "",
tabList: [],
remarks: '',
billMonth: '',
}
this.type = ""
this.paymentOrganization = ""
remarks: "",
billMonth: ""
};
this.type = "";
this.paymentOrganization = "";
}
componentDidMount() {
@ -38,14 +38,14 @@ class StandingBookDetail extends Component {
this.type = this.props.location.query.type;
getTabList({ billMonth, paymentOrganization: this.paymentOrganization }).then(({ data }) => {
const { tabList, remarks, billMonth } = data;
let newTabList = tabList.filter(item => item.id != "2")
let newTabList = tabList.filter(item => item.id != "2");
this.setState({
selectedKey: newTabList[0].id,
tabList: _.map(newTabList, it => ({ title: it.content, viewcondition: it.id })),
remarks, billMonth
});
})
}
});
};
render() {
const { selectedKey, tabList, remarks, billMonth } = this.state;
@ -56,19 +56,20 @@ class StandingBookDetail extends Component {
keyParam="viewcondition" //主键
selectedKey={selectedKey}
onChange={(selectedKey) => {
this.setState({ selectedKey })
this.setState({ selectedKey });
}}
/>
{
(selectedKey === '1' || selectedKey === '3') &&
<NormalIndex selectedKey={selectedKey} remarks={remarks} billMonth={billMonth} type={this.type} paymentOrganization={this.paymentOrganization}/>
(selectedKey === "1" || selectedKey === "3") &&
<NormalIndex selectedKey={selectedKey} remarks={remarks} billMonth={billMonth} type={this.type}
paymentOrganization={this.paymentOrganization}/>
}
{
selectedKey === '2' &&
selectedKey === "2" &&
<AbnormalListIndex billMonth={billMonth} type={this.type} paymentOrganization={this.paymentOrganization}/>
}
{
selectedKey === '4' &&
selectedKey === "4" &&
<OverViewIndex billMonth={billMonth} type={this.type} paymentOrganization={this.paymentOrganization}/>
}
</div>

22
pc4mobx/hrmSalary/pages/taxAgent/index.less
View File

@ -78,4 +78,24 @@
position: absolute;
bottom: 0px;
}
}
}
.slideWrapper{
.slideRefereUser{
.ant-btn{
margin-left: 10px;
border-radius: 0;
padding: 0;
background: transparent;
border: none;
font-size: 20px;
line-height: 20px;
}
.ant-btn.ant-btn-primary[disabled]{
color: #d8d8d8;
}
.ant-btn.ant-btn-primary{
color: #55a1f8;
}
}
}

9
pc4mobx/hrmSalary/pages/taxAgent/personalScope.js
View File

@ -17,8 +17,8 @@ const personScopeWarrper = {
@inject("taxAgentStore", "ledgerStore")
@observer
export default class PersonalScope extends Component {
constructor() {
super();
constructor(props) {
super(props);
this.state = {
queryLoading: false,
submitLoading: false,
@ -171,13 +171,16 @@ export default class PersonalScope extends Component {
submitLoading,
queryLoading,
} = this.state;
const { hideIconInTax, showSalaryItemBtn } = this.props.taxAgentStore;
return (
<div style={personScopeWarrper}>
<div style={personScopeWarrper} className="slideWrapper">
<SlideTaxagentUser
ref={(dom) => (this.tagAgentRef = dom)}
dataSource={dataSource}
columns={columns}
pageObj={pageObj}
hideIconInTax={hideIconInTax}
showSalaryItemBtn={showSalaryItemBtn}
submitLoading={submitLoading}
queryLoading={queryLoading}
setPageObj={(params) => {

33
pc4mobx/hrmSalary/pages/taxAgent/slideTaxagentUser.js
View File

@ -1,5 +1,5 @@
import React from "react";
import { Icon, Table, message } from "antd";
import { Icon, Table, message, Button } from "antd";
import { WeaInputSearch } from "ecCom";
import AddTaxAgentModal from "./addTaxAgentModal";
@ -71,7 +71,9 @@ export default class SlideTaxagentUser extends React.Component {
setPageObj,
employeeStatus,
targetTypeList,
onTaxAgentSave
onTaxAgentSave,
hideIconInTax,
showSalaryItemBtn
} = this.props;
const rowSelection = {
@ -144,18 +146,21 @@ export default class SlideTaxagentUser extends React.Component {
display: "inlineBlock",
float: "left"
}}>
<Icon
style={{ cursor: "pointer", marginRight: "10px" }}
type="minus-square"
onClick={() => {
this.handleTabDelete();
}}
/>
<Icon
style={{ cursor: "pointer", marginRight: "10px" }}
type="plus-square"
onClick={() => this.setState({ addTaxagentModalVisible: true })}
/>
{
hideIconInTax && !showSalaryItemBtn && <React.Fragment>
<Button type="primary"
size="small"
onClick={() => {
this.handleTabDelete();
}}
><span className="icon-coms-form-delete-hot" title="删除"></span></Button>
<Button type="primary"
size="small"
style={{marginRight: 10}}
onClick={() => this.setState({ addTaxagentModalVisible: true })}
><span className="icon-coms-Add-to-hot" title="添加"></span></Button>
</React.Fragment>
}
</div>
<WeaInputSearch
style={{ marginTop: "8px", float: "right" }}

69
pc4mobx/hrmSalary/stores/StandingBook.js
View File

@ -5,6 +5,7 @@ import { removePropertyCondition } from "../util/response";
import _ from "lodash";
import * as API from "../apis/standingBook";
import { importInsuranceAcctDetail } from "../apis/standingBook";
const { TableStore } = WeaTableNew;
@ -19,6 +20,10 @@ export class StandingBookStore {
@observable saveLoading = false; // 添加正常缴纳人员loading
@observable deleteLoading = false; // 删除月份表单loading
@observable previewStandingBookAcctResultColumns = []; // 预览列表
@observable previewStandingBookAcctResultDataSource = []; // 预览DataSource
@observable importStandingBookAcctResult = {}; // 导入结果
// 初始化操作
@action
doInit = () => {
@ -391,4 +396,68 @@ export class StandingBookStore {
})
})
}
@action("社保福利台账核算导入信息表头信息列表")
getWelfareList = () => {
return new Promise((resolve, reject) => {
API.getWelfareList().then(res => {
if(res.status) {
resolve(res.data);
} else {
message.error(res.errormsg || "接口调用失败！")
reject();
}
})
})
}
@action
setPreviewStandingBookAcctResultDataSource = previewAcctResultDataSource => {
this.previewStandingBookAcctResultDataSource = previewAcctResultDataSource;
};
@action
setPreviewStandingBookAcctResultColumns = (previewAcctResultColumns) => {
this.previewStandingBookAcctResultColumns = previewAcctResultColumns;
};
@action
setImportStandingBookAcctResult = importAcctResult => {
this.importStandingBookAcctResult = importAcctResult;
};
@action("社保福利台账-导入预览")
welfarePreview = (params) => {
API.welfarePreview(params).then((res) => {
if (res.status) {
this.previewStandingBookAcctResultColumns = res.data.headers.map((item, index) => {
let column = {};
column.title = item;
column.dataIndex = "" + index;
column.key = index + "";
return column;
});
this.previewStandingBookAcctResultDataSource = res.data.list.map((item) => {
let data = {};
item.map((i, index) => {
data[index + ""] = i;
});
return data;
});
} else {
message.error(res.errormsg || "获取失败");
}
});
};
@action("社保福利台账-核算数据导入")
importInsuranceAcctDetail = (params) => {
API.importInsuranceAcctDetail(params).then(res => {
if (res.status) {
this.importStandingBookAcctResult = res.data;
} else {
message.error(res.errormsg || "导入失败");
}
});
};
}

19
pc4mobx/hrmSalary/stores/cumDeduct.js
View File

@ -1,9 +1,8 @@
import { observable, action, toJS } from "mobx";
import { action, observable } from "mobx";
import { message } from "antd";
import { WeaForm, WeaTableNew } from "comsMobx";
import * as API from "../apis/cumDeduct"; // 引入API接口文件
import * as TaxAgentApi from "../apis/taxAgent";
import { removePropertyCondition } from "../util/response";
const { TableStore } = WeaTableNew;
@ -108,7 +107,7 @@ export class CumDeductStore {
...requestParams,
...params,
current: this.pageObj.current,
pageSize: this.pageObj.pageSize,
pageSize: this.pageObj.pageSize
};
API.getCumDeductList(requestParams).then(
action(({ status, data, errormsg }) => {
@ -121,13 +120,13 @@ export class CumDeductStore {
this.setPageObj({
total,
current,
pageSize,
pageSize
});
} else {
this.setDataSource([]);
this.setPageObj({
...this.pageObj,
total: 0,
total: 0
});
message.error(errormsg || "接口调用失败！");
}
@ -139,8 +138,8 @@ export class CumDeductStore {
setShowSearchAd = (bool) => (this.showSearchAd = bool);
// 高级搜索 - 搜索
@action doSearch = () => {
this.getTableDatas();
@action doSearch = (params) => {
this.getTableDatas(params);
this.showSearchAd = false;
};
@ -188,13 +187,13 @@ export class CumDeductStore {
this.setSlidePageObj({
total,
current,
pageSize,
pageSize
});
} else {
this.setSlideTableDataSource(list);
this.setSlidePageObj({
...this.slidePageObj,
total: 0,
total: 0
});
message.error(errormsg || "接口调用失败！");
}
@ -203,7 +202,7 @@ export class CumDeductStore {
};
// 导出明细
@action exportCumDeductDetailList = (id, ids = "", taxAgentId="") => {
@action exportCumDeductDetailList = (id, ids = "", taxAgentId = "") => {
API.exportCumDeductDetailList(id, ids, taxAgentId);
};
}

34
pc4mobx/hrmSalary/stores/salaryFile.js
View File

@ -5,6 +5,7 @@ import moment from "moment";
import * as API from "../apis/archive"; // 引入API接口文件
import { notNull } from "../util/validate";
import { stopSalary } from "../apis/archive";
const { TableStore } = WeaTableNew;
@ -406,7 +407,6 @@ export class salaryFileStore {
}
});
});
};
validateSaveSalaryForm = (params) => {
@ -416,17 +416,17 @@ export class salaryFileStore {
}
if (!notNull(params.effectiveTime)) {
message.error("生效日期不能为空");
message.warning("生效日期不能为空");
return false;
}
if (!notNull(params.adjustReason)) {
message.error("调整原因不能为空");
message.warning("调整原因不能为空");
return false;
}
if (!params.salaryArchiveItems || params.salaryArchiveItems.length == 0) {
message.error("调整明细不能为空");
message.warning("调整明细不能为空");
return false;
}
@ -447,10 +447,11 @@ export class salaryFileStore {
// 保存调薪
@action
saveSalaryItem = (params) => {
if (!this.validateSaveSalaryForm(params)) {
return;
}
return new Promise((resolve, reject) => {
if (!this.validateSaveSalaryForm(params)) {
reject("校验失败");
return;
}
API.saveSalaryItem(params).then(res => {
if (res.status) {
message.success("保存成功");
@ -495,4 +496,23 @@ export class salaryFileStore {
});
};
@action("停薪")
stopSalary = (payEndDateStr) => {
const payload= {
payEndDateStr,
salaryArchiveId: this.currentId
}
return new Promise((resolve, reject) => {
API.stopSalary(payload).then(res => {
if (res.status) {
message.success("操作成功");
resolve(res);
} else {
message.error(res.errormsg || "获取失败");
reject();
}
});
});
};
}

21
pc4mobx/hrmSalary/stores/taxAgent.js
View File

@ -4,6 +4,7 @@ import { WeaForm, WeaTableNew } from "comsMobx";
import * as API from "../apis/taxAgent"; // 引入API接口文件
import { editConditions } from "../pages/taxAgent/editConditions";
import { hasIconInTax } from "../apis/taxAgent";
const { TableStore } = WeaTableNew;
@ -22,6 +23,8 @@ export class TaxAgentStore {
@observable dataSource = []; //列表数据
@observable taxAgentOption = []; // 个税扣缴义务人
@observable taxAgentAdminOption = []; // 当前登录人个税扣缴义务人下拉列表项
@observable hideIconInTax = true; // 当前登录人是否有添加人员范围的权限
@action setModalVisiable = visiable => (this.modalVisiable = visiable);
@ -40,6 +43,7 @@ export class TaxAgentStore {
doInit = params => {
this.getTaxAgentList(params);
this.getCondition(editConditions);
this.hasIconInTax();
};
// 获得高级搜索表单数据
@ -197,4 +201,21 @@ export class TaxAgentStore {
);
});
};
@action("当前登录人是否有添加人员范围的权限")
hasIconInTax = () => {
return new Promise((resolve, reject) => {
API.hasIconInTax().then(
action(res => {
if (res.status) {
this.hideIconInTax= res.data !== "true";
resolve(res);
} else {
message.error(res.errormsg || "获取失败");
reject();
}
})
);
});
};
}