From 4ce7eca13974815236fe4d730ff9c73b510315b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=BB=8E=E6=B0=B8=E9=A1=BA?= <971387674@qq.com> Date: Tue, 14 Feb 2023 13:38:19 +0800 Subject: [PATCH] =?UTF-8?q?=E7=A4=BE=E4=BF=9D=E7=A6=8F=E5=88=A9=E6=A1=A3?= =?UTF-8?q?=E6=A1=88=E6=96=B0=E5=A2=9E=E7=BC=96=E8=BE=91=E9=A1=B5=E9=9D=A2?= =?UTF-8?q?=E9=87=8D=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../archives/baseForm.js | 69 ++--- .../socialSecurityBenefits/archives/index.js | 152 +++++------ .../archives/index.less | 65 +++-- .../archives/socialSecurityForm.js | 251 +++++++++--------- 4 files changed, 245 insertions(+), 292 deletions(-) diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/baseForm.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/baseForm.js index 03be2c76..c21bcf93 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/baseForm.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/baseForm.js @@ -1,64 +1,43 @@ import React from "react"; -import GroupCard from "../../../components/groupCard"; -import { Col, Row, Tooltip } from "antd"; +import { WeaFormItem, WeaInput, WeaSearchGroup } from "ecCom"; import { inject, observer } from "mobx-react"; import "./index.less"; @inject("archivesStore") @observer export default class BaseForm extends React.Component { - componentWillMount() { const { archivesStore: { getBaseForm } } = this.props; getBaseForm(this.props.employeeId); } render() { - const { archivesStore: { baseFormData } ,record} = this.props; + const { archivesStore: { baseFormData }, record } = this.props; + const { username, department, position, telephone, hiredate, dimissionDate } = baseFormData; + const { paymentOrganizationName } = record; + const baseItems = [ + { com: Input("姓名", username) }, + { com: Input("部门", department) }, + { com: Input("岗位", position) }, + { com: Input("手机号", telephone) }, + { com: Input("入职日期", hiredate) }, + { com: Input("合同到期日期", dimissionDate) } + ]; + const taxagentItems = [ + { com: Input("个税扣缴义务人", paymentOrganizationName, 6, 18) } + ]; return (
- - - 姓名: - - - {baseFormData.username} - - - 部门: - - - {baseFormData.department} - - - 岗位: - - - {baseFormData.position} - - - - - - 入职日期: - {baseFormData.hiredate} - 手机号: - - - {baseFormData.telephone} - - - 合同到期日期: - {baseFormData.dimissionDate} - - - - - 个税扣缴义务人： - {record.paymentOrganizationName} - - + +
); } } +const Input = (label, value, labelColSpan = 12, wrapperColSpan = 12) => { + return ( + + + + ); +}; diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.js index a61e6cc7..b8f6c267 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.js @@ -3,7 +3,7 @@ import { inject, observer } from "mobx-react"; import { toJS } from "mobx"; import { Button, Dropdown, Menu, message, Modal, Popover } from "antd"; import { WeaHelpfulTip, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom"; -import { getSearchs, renderLoading } from "../../../util"; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中 +import { getSearchs, renderLoading } from "../../../util"; import BaseForm from "./baseForm"; import SlideModalTitle from "../../../components/slideModalTitle"; import SocialSecurityForm from "./socialSecurityForm"; @@ -50,9 +50,7 @@ export default class Archives extends React.Component { total: 0 } }; - this.record = {}; - this.pageInfo = { current: 1, pageSize: 10 }; } componentDidMount() { @@ -94,16 +92,16 @@ export default class Archives extends React.Component { }); }; - handleEdit(record) { + handleEdit = (record) => { this.record = record; this.setState({ employeeId: record.employeeId, editSlideVisible: true }); - } + }; - setStep(step) { + setStep = (step) => { this.setState({ step }); - } + }; - getColumns() { + getColumns = () => { const { columns, pageInfo, selectedKey } = this.state; const { taxAgentStore: { showOperateBtn } } = this.props; let tmpV = _.map(columns.filter(item => item.display === "TRUE"), (item, index) => { @@ -206,49 +204,54 @@ export default class Archives extends React.Component { ); } }] : []; - } + }; // 保存 handleEditSlideSave = () => { - const { selectedTab } = this.state; - const { archivesStore: { save, socialSecurityForm, accumulationFundForm, otherForm } } = this.props; - if (selectedTab == 1) { - const { data } = socialSecurityForm; - if (data.socialSchemeId && !data.socialStartTime) { - Modal.warning({ - title: "信息确认", - content: "必要信息不完整，红色*为必填项！" - }); - return; - } - save("SOCIAL_SECURITY").then(() => { - this.query(); - }); - } else if (selectedTab == 2) { - const { data } = accumulationFundForm; - if (data.fundSchemeId && !data.fundStartTime) { - Modal.warning({ - title: "信息确认", - content: "必要信息不完整，红色*为必填项！" - }); - return; - } - save("ACCUMULATION_FUND").then(() => { - this.query(); - }); - } else if (selectedTab == 3) { - const { data } = otherForm; - if (data.otherSchemeId && !data.otherStartTime) { - Modal.warning({ - title: "信息确认", - content: "必要信息不完整，红色*为必填项！" - }); - return; - } - save("OTHER").then(() => { - this.query(); - }); + if (!this.handleSave) { + this.handleSave = _.debounce(() => { + const { selectedTab } = this.state; + const { archivesStore: { save, socialSecurityForm, accumulationFundForm, otherForm } } = this.props; + if (selectedTab == 1) { + const { data } = socialSecurityForm; + if (data.socialSchemeId && !data.socialStartTime) { + Modal.warning({ + title: "信息确认", + content: "必要信息不完整，红色*为必填项！" + }); + return; + } + save("SOCIAL_SECURITY").then(() => { + this.query(); + }); + } else if (selectedTab == 2) { + const { data } = accumulationFundForm; + if (data.fundSchemeId && !data.fundStartTime) { + Modal.warning({ + title: "信息确认", + content: "必要信息不完整，红色*为必填项！" + }); + return; + } + save("ACCUMULATION_FUND").then(() => { + this.query(); + }); + } else if (selectedTab == 3) { + const { data } = otherForm; + if (data.otherSchemeId && !data.otherStartTime) { + Modal.warning({ + title: "信息确认", + content: "必要信息不完整，红色*为必填项！" + }); + return; + } + save("OTHER").then(() => { + this.query(); + }); + } + }, 500); } + this.handleSave(); }; // 导入 @@ -264,34 +267,34 @@ export default class Archives extends React.Component { }; // 导入预览 - handlePreviewImport(params) { + handlePreviewImport = (params) => { const { archivesStore: { previewCurData } } = this.props; previewCurData(params); - } + }; // 导入 - handleImport(params) { + handleImport = (params) => { const { archivesStore: { importBatch } } = this.props; const { runStatus } = this.state; importBatch({ ...params, runStatus }); - } + }; // 导入完成 - handleFinish() { + handleFinish = () => { const { archivesStore: { initImportParams } } = this.props; initImportParams(); this.setState({ importVisible: false, step: 0 }, () => { this.query(); }); - } + }; // 初始化导入参数 - handleInitModal() { + handleInitModal = () => { const { archivesStore: { setPreviewCurDataColumns, setPreviewCurDataDataSource, setImportResult } } = this.props; setPreviewCurDataColumns([]); setPreviewCurDataDataSource([]); setImportResult({}); - } + }; // 选项设置 onSelectChange = selectedRowKeys => { @@ -299,7 +302,7 @@ export default class Archives extends React.Component { }; // 关闭导入框 - handleImportCancel() { + handleImportCancel = () => { const { archivesStore: { initImportParams, getTableDatas } } = this.props; initImportParams(); @@ -307,7 +310,7 @@ export default class Archives extends React.Component { getTableDatas(); } this.setState({ importVisible: false, step: 0 }); - } + }; //切换tab handleChangeTab = (selectedKey) => { @@ -536,24 +539,7 @@ export default class Archives extends React.Component { form, condition, showSearchAd, setShowSearchAd, previewCurDataColumns, previewCurDataDataSource, importResult } = archivesStore; - if (_.isEmpty(this.getColumns())) { // 无权限处理 - return renderLoading(); - } - const rightMenu = [// 右键菜单 - // { - // key: 'BTN_COLUMN', - // icon: , - // content: '显示列定制', - // onClick: this.showColumn - // }, - ]; - const collectParams = { // 收藏功能配置 - favname: "社保福利档案", - favouritetype: 1, - objid: 0, - link: "wui/index.html#/ns_demo03/index", - importantlevel: 1 - }; + if (_.isEmpty(this.getColumns())) return renderLoading(); const adBtn = [ // 高级搜索内部按钮 ] : [] } - subItemChange={ - (selectedTab) => { - this.setState({ selectedTab }); - } - } + subItemChange={selectedTab => this.setState({ selectedTab })} /> } content={
diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.less b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.less index dd3e3a88..8b29b6ef 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.less +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/index.less @@ -1,36 +1,32 @@ .socialFormWrapper { - .formItem { - height: 40px; - line-height: 40px; - overflow: hidden; - white-space: nowrap; - text-overflow: ellipsis; - padding-left: 10px; - padding-right: 10px; - border: 1px solid #e2e2e2; - margin-bottom: 0 !important; - .ant-select-selection{ - height: 30px; - border-radius: 0; + .wea-search-group { + padding: 0 16px; + + .wea-form-cell-wrapper { + border: 1px solid #e5e5e5; + border-bottom: none; + border-right: none; + margin: 0 16px; + + .wea-form-cell { + padding: 4px 16px; + border-bottom: 1px solid #e5e5e5; + border-right: 1px solid #e5e5e5; + } } } - .borderR-none { - border-right: none; - } - - .borderB-none { - border-bottom: none; - } } -.mySalaryBenefitsWrapper{ - .tdEllipsis{ + +.mySalaryBenefitsWrapper { + .tdEllipsis { display: inline-block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } + .optWrapper { display: flex; align-items: center; @@ -40,6 +36,7 @@ } } } + //提示语 .helpWrapper { display: flex; @@ -50,30 +47,32 @@ } } -.slideOuterWrapper{ - .wea-slide-modal-title{ +.slideOuterWrapper { + .wea-slide-modal-title { height: initial; line-height: initial; text-align: left; } - .rodal-close{ + + .rodal-close { z-index: 99; - top: 10px!important; + top: 10px !important; } } -@media (min-width: 1260px){ - .slideOuterWrapper{ - .reqTopWrapper .wea-new-top-req-title>div:first-child>div{ - max-width: 100%!important; +@media (min-width: 1260px) { + .slideOuterWrapper { + .reqTopWrapper .wea-new-top-req-title > div:first-child > div { + max-width: 100% !important; } } } + @media screen and (min-width: 1060px) and (max-width: 1260px) { - .slideOuterWrapper{ - .reqTopWrapper .wea-new-top-req-title>div:first-child>div{ - max-width: calc(100% - 96px)!important; + .slideOuterWrapper { + .reqTopWrapper .wea-new-top-req-title > div:first-child > div { + max-width: calc(100% - 96px) !important; } } } diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js index 7f86be27..bc0c538f 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/archives/socialSecurityForm.js @@ -1,9 +1,6 @@ import React from "react"; -import GroupCard from "../../../components/groupCard"; -import { Col, Row } from "antd"; -import { WeaCheckbox, WeaDatePicker, WeaInput, WeaInputNumber, WeaSelect } from "ecCom"; +import { WeaCheckbox, WeaSearchGroup } from "ecCom"; import { inject, observer } from "mobx-react"; -import cs from "classnames"; import "./index.less"; @inject("archivesStore") @@ -18,7 +15,9 @@ export default class SocialSecurityForm extends React.Component { } // 表单变化 - handleFormChange(params) { + handleFormChange = (params) => { + console.log("params", params); + return; const { archivesStore: { socialSecurityForm, setSocialSecurityForm }, onChangeRecordSchemeId } = this.props; const { data } = socialSecurityForm; let request = { ...data, ...params }; @@ -27,7 +26,7 @@ export default class SocialSecurityForm extends React.Component { setSocialSecurityForm(form); Object.keys(params).length > 1 && onChangeRecordSchemeId(params.socialSchemeId); - } + }; // 获取基数表单 handleFetchPaymentForm(value) { @@ -53,137 +52,131 @@ export default class SocialSecurityForm extends React.Component { let paymentItems = socialSecurityPaymentForm.items; // Integer数据转为string let data = { ...baseData }; - if (data) { + if (!_.isNil(data)) { Object.keys(data).map(key => { - if (data[key]) { + if (!_.isNil(data[key])) { data[key] = data[key].toString(); } }); } + const { nonPayment } = data; + console.log(baseData, data); return (
-
- { - this.handleFormChange({ nonPayment: value }); - }} - /> -
- - - 社保起始缴纳月： - - { - this.handleFormChange({ socialStartTime: value }); - }} - /> - - 社保方案名称： - - { - this.handleFormChange({ socialName: showName, socialSchemeId: value }); - this.handleFetchPaymentForm(value); - }} - /> - - - - 社保最后缴纳月： - - this.handleFormChange({ socialEndTime: value })} - /> - - 社保账号： - - { - this.handleFormChange({ schemeAccount: value }); - }}/> - - - - {/*个税扣缴义务人：*/} - {/**/} - {/* this.handleFormChange({ paymentOrganization: value })}>*/} - {/* {*/} - {/* items && items[0].items && items[0].items[1] && items[0].items[1].options.map(item => (*/} - {/* */} - {/* ))*/} - {/* }*/} - {/* */} - {/**/} - 社保个人实际承担方： - - { - this.handleFormChange({ underTake: value }); - }} - /> - - - - - { - data.socialSchemeId && paymentItems && paymentItems.map(group => ( -
- { - group.items && group.items.length > 0 && - - { - group.items && group.items.map((item, idx) => ( - - - {item.label}： - - { - this.handlePaymentChange({ [item.domkey[0]]: value ? String(value) : '0' }); - }} - /> - - - - )) - } - - - } -
- )) - } + } + items={[]} col={2} showGroup needTigger={false}/> + {/*
*/} + {/* {*/} + {/* this.handleFormChange({ nonPayment: value });*/} + {/* }}*/} + {/* />*/} + {/*
*/} + {/**/} + {/* */} + {/* 社保起始缴纳月：*/} + {/* */} + {/* {*/} + {/* this.handleFormChange({ socialStartTime: value });*/} + {/* }}*/} + {/* />*/} + {/* */} + {/* 社保方案名称：*/} + {/* */} + {/* {*/} + {/* this.handleFormChange({ socialName: showName, socialSchemeId: value });*/} + {/* this.handleFetchPaymentForm(value);*/} + {/* }}*/} + {/* />*/} + {/* */} + {/* */} + {/* */} + {/* 社保最后缴纳月：*/} + {/* */} + {/* this.handleFormChange({ socialEndTime: value })}*/} + {/* />*/} + {/* */} + {/* 社保账号：*/} + {/* */} + {/* {*/} + {/* this.handleFormChange({ schemeAccount: value });*/} + {/* }}/>*/} + {/* */} + {/* */} + {/* */} + {/* 社保个人实际承担方：*/} + {/* */} + {/* {*/} + {/* this.handleFormChange({ underTake: value });*/} + {/* }}*/} + {/* />*/} + {/* */} + {/* */} + {/**/} + {/*{*/} + {/* data.socialSchemeId && paymentItems && paymentItems.map(group => (*/} + {/*
*/} + {/* {*/} + {/* group.items && group.items.length > 0 && */} + {/* */} + {/* {*/} + {/* group.items && group.items.map((item, idx) => (*/} + {/* */} + {/* */} + {/* {item.label}：*/} + {/* */} + {/* {*/} + {/* this.handlePaymentChange({ [item.domkey[0]]: value ? String(value) : '0' });*/} + {/* }}*/} + {/* />*/} + {/* */} + {/* */} + {/* */} + {/* ))*/} + {/* }*/} + {/* */} + {/* */} + {/* }*/} + {/*
*/} + {/* ))*/} + {/*}*/}
); } } +const SocialTitle = (props) => { + const { value, onChange } = props; + return ; +};