feature/2.10.1.2401.01-社保福利方案重构
This commit is contained in:
parent
d866cc07cf
commit
8ed92e793d
|
|
@ -0,0 +1,33 @@
|
|||
/*
|
||||
* Author: 黎永顺
|
||||
* name:社保福利方案页面重构-高级搜索
|
||||
* Description:
|
||||
* Date: 2024/2/2
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { Button } from "antd";
|
||||
import { WeaInputSearch, WeaLocaleProvider } from "ecCom";
|
||||
import "./index.less";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
||||
@inject("programmeStore")
|
||||
@observer
|
||||
class Index extends Component {
|
||||
render() {
|
||||
const { programmeStore: { planSearchForm } } = this.props;
|
||||
return (
|
||||
<div className="achrive-advance-search">
|
||||
<WeaInputSearch value={planSearchForm.getFormParams().schemeName}
|
||||
onChange={v => planSearchForm.updateFields({ schemeName: v })}
|
||||
onSearch={this.props.onAdvanceSearch}
|
||||
/>
|
||||
<Button type="ghost" className="wea-advanced-search text-elli"
|
||||
onClick={this.props.onOpenAdvanceSearch}>{getLabel(545754, "高级搜索")}</Button>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Index;
|
||||
|
|
@ -0,0 +1,29 @@
|
|||
.achrive-advance-search {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
top: -1.5px;
|
||||
|
||||
.wea-advanced-search {
|
||||
top: 2px;
|
||||
left: -1px;
|
||||
height: 28px;
|
||||
line-height: 1;
|
||||
border-radius: 0;
|
||||
position: relative;
|
||||
color: #474747;
|
||||
padding: 4px 15px;
|
||||
}
|
||||
|
||||
.wea-advanced-search:hover {
|
||||
border: 1px solid #dadada;
|
||||
color: #474747;
|
||||
}
|
||||
|
||||
.text-elli {
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
top: 1px;
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,51 @@
|
|||
/*
|
||||
* Author: 黎永顺
|
||||
* name:社保福利方案页面重构-高级搜索面板
|
||||
* Description:
|
||||
* Date: 2024/2/2
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { WeaLocaleProvider } from "ecCom";
|
||||
import { Button } from "antd";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { getSearchs } from "../../../../../util";
|
||||
import { searchConditons } from "../../config";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
||||
@inject("programmeStore")
|
||||
@observer
|
||||
class WelfarePlanAdvanceSearchPannel extends Component {
|
||||
|
||||
componentDidMount() {
|
||||
const { programmeStore: { planSearchForm } } = this.props;
|
||||
planSearchForm.initFormFields(searchConditons);
|
||||
}
|
||||
|
||||
render() {
|
||||
const { programmeStore: { planSearchForm } } = this.props;
|
||||
return (
|
||||
<React.Fragment>
|
||||
<div className="wea-advanced-searchsAd">
|
||||
{getSearchs(planSearchForm, searchConditons, 2, false)}
|
||||
</div>
|
||||
<div className="wea-search-buttons">
|
||||
<div style={{ textAlign: "center" }}>
|
||||
<span style={{ marginLeft: 15 }}>
|
||||
<Button type="primary" onClick={this.props.onAdSearch}>{getLabel(388113, "搜索")}</Button>
|
||||
</span>
|
||||
<span style={{ marginLeft: 15 }}>
|
||||
<Button type="ghost" onClick={() => planSearchForm.resetForm()}>{getLabel(2022, "重置")}</Button>
|
||||
</span>
|
||||
<span style={{ marginLeft: 15 }}>
|
||||
<Button type="ghost" onClick={this.props.onCancel}>{getLabel(31129, "取消")}</Button>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default WelfarePlanAdvanceSearchPannel;
|
||||
|
||||
|
|
@ -0,0 +1,68 @@
|
|||
/*
|
||||
* Author: 黎永顺
|
||||
* name: 社保福利方案重构-复制
|
||||
* Description:
|
||||
* Date: 2024/2/4
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { WeaDialog, WeaLocaleProvider } from "ecCom";
|
||||
import { Button, message } from "antd";
|
||||
import * as API from "../../../../../apis/welfareScheme";
|
||||
import { getSearchs } from "../../../../../util";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
||||
@inject("programmeStore")
|
||||
@observer
|
||||
class Index extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: false
|
||||
};
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if (nextProps.visible !== this.props.visible && !nextProps.visible) nextProps.programmeStore.initPlanCopyForm();
|
||||
}
|
||||
|
||||
|
||||
save = () => {
|
||||
const { programmeStore: { planCopyForm }, copyId: id, selectedKey } = this.props;
|
||||
planCopyForm.validateForm().then(f => {
|
||||
if (f.isValid) {
|
||||
this.setState({ loading: true });
|
||||
API.copyScheme({ id, schemeName: planCopyForm.getFormDatas()[`${selectedKey}_schemeName`].value })
|
||||
.then(({ status, errormsg }) => {
|
||||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
message.success(getLabel(30700, "操作成功！"));
|
||||
this.props.onCancel(true);
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
f.showErrors();
|
||||
}
|
||||
}).catch(() => this.setState({ loading: false }));
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loading } = this.state;
|
||||
const { programmeStore: { planCopyForm }, conditions } = this.props;
|
||||
return (
|
||||
<WeaDialog
|
||||
{...this.props} style={{ width: 480, height: 46 }} initLoadCss
|
||||
buttons={[
|
||||
<Button type="primary" onClick={this.save} loading={loading}>{getLabel(537558, "保存")}</Button>
|
||||
]}
|
||||
>
|
||||
<div className="form-dialog-layout">{getSearchs(planCopyForm, conditions, 1, false)}</div>
|
||||
</WeaDialog>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Index;
|
||||
|
|
@ -0,0 +1,91 @@
|
|||
/*
|
||||
* Author: 黎永顺
|
||||
* name: 社保福利方案-自定义福利新建编辑
|
||||
* Description:
|
||||
* Date: 2024/2/4
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { WeaDialog, WeaLocaleProvider, WeaTools } from "ecCom";
|
||||
import { Button, message } from "antd";
|
||||
import * as API from "../../../../../apis/welfareScheme";
|
||||
import { getSearchs } from "../../../../../util";
|
||||
import { customPlanConditons } from "../../config";
|
||||
|
||||
const getKey = WeaTools.getKey;
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
||||
@inject("programmeStore")
|
||||
@observer
|
||||
class Index extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
loading: false, conditions: []
|
||||
};
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if (nextProps.visible !== this.props.visible && nextProps.visible) this.getCustomCategoryForm(nextProps);
|
||||
if (nextProps.visible !== this.props.visible && !nextProps.visible) nextProps.programmeStore.initPlanCustomForm();
|
||||
}
|
||||
|
||||
getCustomCategoryForm = (props) => {
|
||||
API.getCustomCategoryForm({ id: props.customId }).then(({ status, data }) => {
|
||||
if (status) {
|
||||
const { form } = data;
|
||||
this.setState({
|
||||
conditions: customPlanConditons
|
||||
}, () => {
|
||||
const { programmeStore: { planCustomForm } } = props;
|
||||
planCustomForm.initFormFields(this.state.conditions);
|
||||
// planCustomForm.updateFields({ [`${selectedKey}_schemeName`]: { value: copyName } });
|
||||
});
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
save = () => {
|
||||
const { programmeStore: { planCustomForm }, copyId: id, selectedKey } = this.props;
|
||||
planCustomForm.validateForm().then(f => {
|
||||
if (f.isValid) {
|
||||
this.setState({ loading: true });
|
||||
const payload = {
|
||||
...planCustomForm.getFormParams(),
|
||||
paymentScope: planCustomForm.getFormParams().paymentScope.split(",")
|
||||
};
|
||||
console.log(payload);
|
||||
return;
|
||||
API.copyScheme({ id, schemeName: planCustomForm.getFormDatas()[`${selectedKey}_schemeName`].value })
|
||||
.then(({ status, errormsg }) => {
|
||||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
message.success(getLabel(30700, "操作成功！"));
|
||||
this.props.onCancel(true);
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
f.showErrors();
|
||||
}
|
||||
}).catch(() => this.setState({ loading: false }));
|
||||
};
|
||||
|
||||
render() {
|
||||
const { loading, conditions } = this.state;
|
||||
const { programmeStore: { planCustomForm } } = this.props;
|
||||
return (
|
||||
<WeaDialog
|
||||
{...this.props} style={{ width: 480, height: 174 }} initLoadCss
|
||||
buttons={[
|
||||
<Button type="primary" onClick={this.save} loading={loading}>{getLabel(537558, "保存")}</Button>
|
||||
]}
|
||||
>
|
||||
<div className="form-dialog-layout">{getSearchs(planCustomForm, conditions, 1, false)}</div>
|
||||
</WeaDialog>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Index;
|
||||
|
|
@ -0,0 +1,262 @@
|
|||
/*
|
||||
* Author: 黎永顺
|
||||
* name: 社保福利方案重构-列表
|
||||
* Description:
|
||||
* Date: 2024/2/2
|
||||
*/
|
||||
import React, { Component } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { WeaCheckbox, WeaLoadingGlobal, WeaLocaleProvider, WeaTable } from "ecCom";
|
||||
import { Dropdown, Menu, message, Modal } from "antd";
|
||||
import TipLabel from "../../../../../components/TipLabel";
|
||||
import WelfarePlanCopyDialog from "../welfarePlanCopyDialog";
|
||||
import WelfarePlanCustomDialog from "../welfarePlanCustomDialog";
|
||||
import { tabWelfarePlanList, welfarePlanCopyConditions, welfarePlanCustomTipList } from "../../config";
|
||||
import * as API from "../../../../../apis/welfareScheme";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
const APIFOX = {
|
||||
SOCIAL_SECURITY: API.getTable,
|
||||
ACCUMULATION_FUND: API.getTable,
|
||||
OTHER: API.getTable,
|
||||
CUSTOM: API.getCustomCategoryList
|
||||
};
|
||||
|
||||
@inject("programmeStore", "taxAgentStore")
|
||||
@observer
|
||||
class Index extends Component {
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
dataSource: [], columns: [], loading: false,
|
||||
pageInfo: { current: 1, pageSize: 10, total: 0 },
|
||||
copyDialog: { visible: false, title: "", copyId: "", copyName: "", conditions: [] },
|
||||
customDialog: { visible: false, title: "", customId: "" }
|
||||
};
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.getList(this.props);
|
||||
}
|
||||
|
||||
componentWillReceiveProps(nextProps, nextContext) {
|
||||
if ((nextProps.selectedKey !== this.props.selectedKey) || (nextProps.isQuery !== this.props.isQuery)) {
|
||||
this.setState({
|
||||
pageInfo: { ...this.state.pageInfo, current: 1, pageSize: 10, total: 0 }
|
||||
}, () => this.getList(nextProps));
|
||||
}
|
||||
if ((nextProps.selectedKey !== this.props.selectedKey)) {
|
||||
this.setState({
|
||||
dataSource: [], columns: [], loading: false,
|
||||
pageInfo: { current: 1, pageSize: 10, total: 0 },
|
||||
copyDialog: { visible: false, title: "", copyId: "", copyName: "", conditions: [] }
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
getList = (props) => {
|
||||
const { programmeStore: { planSearchForm }, selectedKey: welfareTypeEnum, custom } = props;
|
||||
const { pageInfo } = this.state;
|
||||
const originPayload = { ...pageInfo, welfareTypeEnum }, customPayload = { welfareTypeEnum: custom },
|
||||
welfarePayload = { ...planSearchForm.getFormParams() };
|
||||
const payload = welfareTypeEnum === "CUSTOM" ? { ...originPayload, ...customPayload } : { ...originPayload, ...welfarePayload };
|
||||
this.setState({ loading: true });
|
||||
APIFOX[welfareTypeEnum](payload).then(({ status, data }) => {
|
||||
this.setState({ loading: false });
|
||||
if (status) {
|
||||
const { list: dataSource, columns, pageNum: current, pageSize, total } = data;
|
||||
this.setState({
|
||||
dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
|
||||
columns: _.map(_.filter(columns, o => (o.dataIndex !== "id" && o.dataIndex !== "paymentArea")), g => {
|
||||
const { dataIndex } = g;
|
||||
let col = { ...g, width: "20%" };
|
||||
switch (dataIndex) {
|
||||
case "schemeName":
|
||||
col = {
|
||||
...col, width: 250,
|
||||
render: (text, record) => (<a href="javascript:void(0);"
|
||||
onClick={() => this.handleOpts("view", record)}>{text}</a>)
|
||||
};
|
||||
break;
|
||||
case "paymentType":
|
||||
col = { ...col, width: 100 };
|
||||
break;
|
||||
case "paymentScope":
|
||||
col = { ...col, width: 300 };
|
||||
break;
|
||||
case "remarks":
|
||||
col = { ...col, width: 200 };
|
||||
break;
|
||||
case "paymentScopt":
|
||||
case "welfareType":
|
||||
col = {
|
||||
...col, width: "30%",
|
||||
render: (__, record) => (<span>{record[`${dataIndex}Span`] || record["paymentScopeSpan"]}</span>)
|
||||
};
|
||||
break;
|
||||
case "isUse":
|
||||
col = {
|
||||
...col, render: (__, record) => (<WeaCheckbox value={record[dataIndex] + ""} display="switch"/>)
|
||||
};
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
return col;
|
||||
})
|
||||
});
|
||||
}
|
||||
}).catch(() => this.setState({ loading: false }));
|
||||
};
|
||||
handleOpts = (key, record = {}) => {
|
||||
const { selectedKey, programmeStore: { planCopyForm } } = this.props;
|
||||
const { id, schemeName } = record;
|
||||
switch (key) {
|
||||
case "edit":
|
||||
break;
|
||||
case "delete":
|
||||
Modal.confirm({
|
||||
title: getLabel(131329, "信息确认"),
|
||||
content: getLabel(111, "确定删除吗？删除后数据不可找回"),
|
||||
onOk: () => {
|
||||
API.deleteScheme({ welfareTypeEnum: selectedKey, ids: [id] })
|
||||
.then(({ status, errormsg }) => {
|
||||
if (status) {
|
||||
message.success(getLabel(502230, "删除成功！"));
|
||||
this.getList(this.props);
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
break;
|
||||
case "custom-delete":
|
||||
Modal.confirm({
|
||||
title: getLabel(131329, "信息确认"),
|
||||
content: getLabel(111, "确定删除吗？删除后数据不可找回"),
|
||||
onOk: () => {
|
||||
WeaLoadingGlobal.start();
|
||||
API.deleteCustomCategory({ id }).then(({ status, errormsg }) => {
|
||||
WeaLoadingGlobal.destroy();
|
||||
if (status) {
|
||||
message.success(getLabel(502230, "删除成功！"));
|
||||
this.getList(this.props);
|
||||
} else {
|
||||
message.error(errormsg);
|
||||
}
|
||||
}).catch(() => WeaLoadingGlobal.destroy());
|
||||
}
|
||||
});
|
||||
break;
|
||||
case "custom-edit":
|
||||
this.setState({
|
||||
customDialog: {
|
||||
visible: true, customId: id,
|
||||
title: `${id ? getLabel(501169, "编辑") : getLabel(365, "新建")}${getLabel(543151, "自定义福利")}`
|
||||
}
|
||||
});
|
||||
break;
|
||||
case "copy":
|
||||
this.setState({
|
||||
copyDialog: {
|
||||
visible: true, copyId: id, copyName: `${schemeName}-${getLabel(77, "复制")}`,
|
||||
title: `${getLabel(77, "复制")}-${_.find(tabWelfarePlanList, o => o.key === selectedKey).title}`,
|
||||
conditions: welfarePlanCopyConditions[selectedKey]
|
||||
}
|
||||
}, () => {
|
||||
const { copyDialog: { conditions, copyName } } = this.state;
|
||||
planCopyForm.initFormFields(conditions);
|
||||
planCopyForm.updateFields({ [`${selectedKey}_schemeName`]: { value: copyName } });
|
||||
});
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
render() {
|
||||
const { dataSource, columns, pageInfo, loading, copyDialog, customDialog } = this.state;
|
||||
const { selectedKey, taxAgentStore: { showOperateBtn } } = this.props;
|
||||
const pagination = {
|
||||
...pageInfo,
|
||||
showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
pageSizeOptions: ["10", "20", "50", "100"],
|
||||
onShowSizeChange: (current, pageSize) => {
|
||||
this.setState({
|
||||
pageInfo: { ...pageInfo, current, pageSize }
|
||||
}, () => this.getList(this.props));
|
||||
},
|
||||
onChange: current => {
|
||||
this.setState({
|
||||
pageInfo: { ...pageInfo, current }
|
||||
}, () => this.getList(this.props));
|
||||
}
|
||||
};
|
||||
const optCols = selectedKey !== "CUSTOM" ? {
|
||||
title: getLabel(18610, "操作"),
|
||||
dataIndex: "operation", width: 185,
|
||||
render: (__, record) => (<div className="planOptBtns">
|
||||
<a href="javascript:void(0);"
|
||||
onClick={() => this.handleOpts("edit", record)}>{getLabel(501169, "编辑")}</a>
|
||||
<a href="javascript:void(0);" onClick={() => this.handleOpts("copy", record)}>{getLabel(77, "复制")}</a>
|
||||
<Dropdown
|
||||
overlay={
|
||||
<Menu>
|
||||
<Menu.Item>
|
||||
<a href="javascript:void(0)"
|
||||
onClick={() => this.handleOpts("delete", record)}>{getLabel(535052, "删除")}</a>
|
||||
</Menu.Item>
|
||||
</Menu>
|
||||
}>
|
||||
<a href="javascript:void(0)"><i className="icon-coms-more"/></a>
|
||||
</Dropdown>
|
||||
</div>)
|
||||
} : {
|
||||
title: getLabel(18610, "操作"),
|
||||
dataIndex: "operation", width: 165,
|
||||
render: (__, record) => (<div className="planOptBtns">
|
||||
<a href="javascript:void(0);"
|
||||
onClick={() => this.handleOpts("custom-edit", record)}>{getLabel(501169, "编辑")}</a>
|
||||
<a href="javascript:void(0);"
|
||||
onClick={() => this.handleOpts("custom-delete", record)}>{getLabel(535052, "删除")}</a>
|
||||
</div>)
|
||||
};
|
||||
return (
|
||||
<div className="welfare-plan-adapt">
|
||||
<div className="adapt-left">
|
||||
<WeaTable
|
||||
rowKey="id" dataSource={dataSource} pagination={pagination} loading={loading}
|
||||
scroll={{ y: "calc(100vh - 182px)" }}
|
||||
columns={showOperateBtn ? [...columns, optCols] : [...columns, {
|
||||
title: getLabel(18610, "操作"),
|
||||
dataIndex: "operation", width: 120,
|
||||
render: (__, record) => (<a href="javascript:void(0);"
|
||||
onClick={() => this.handleOpts("view", record)}>{getLabel(33564, "查看")}</a>)
|
||||
}]}
|
||||
/>
|
||||
</div>
|
||||
{
|
||||
selectedKey === "CUSTOM" &&
|
||||
<div className="adapt-right"><TipLabel tipList={welfarePlanCustomTipList}/></div>
|
||||
}
|
||||
{/*复制方案*/}
|
||||
<WelfarePlanCopyDialog {...copyDialog} selectedKey={selectedKey}
|
||||
onCancel={(isRefrese) => this.setState({
|
||||
copyDialog: { ...copyDialog, visible: false, conditions: [] }
|
||||
}, () => isRefrese && this.getList(this.props))}
|
||||
/>
|
||||
{/*新建编辑自定义方案*/}
|
||||
<WelfarePlanCustomDialog {...customDialog} selectedKey={selectedKey}
|
||||
onCancel={(isRefrese) => this.setState({
|
||||
customDialog: { ...customDialog, visible: false, customId: "" }
|
||||
}, () => isRefrese && this.getList(this.props))}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Index;
|
||||
|
|
@ -1,8 +1,7 @@
|
|||
import React from "react";
|
||||
import { WeaLocaleProvider, WeaTools } from "ecCom";
|
||||
import { WeaLocaleProvider, WeaSelect, WeaTools } from "ecCom";
|
||||
import { Button } from "antd";
|
||||
import AdvanceInputBtn from "../welfareArchive/components/advanceInputBtn";
|
||||
import { CancelHelpfulDiv, HelpfulDiv } from "../welfareArchive/components/welfareTip";
|
||||
import AdvanceInputBtn from "./components/advanceInputBtn";
|
||||
|
||||
const getKey = WeaTools.getKey;
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
|
@ -13,6 +12,11 @@ export const tabWelfarePlanList = [
|
|||
{ key: "OTHER", title: getLabel(542717, "企业年金及其他福利") },
|
||||
{ key: "CUSTOM", title: getLabel(543151, "自定义福利") }
|
||||
];
|
||||
export const welfarePlanCustomTipList = [
|
||||
getLabel(544345, "1、可以为社保、公积金、企业年金及其他福利新增自定义的福利项，如：残疾保险等"),
|
||||
getLabel(544346, "2、新增自定义福利默认启用，社保福利方案中的自定义福利项均未开启缴纳，当前页面的自定义福利项才可以停用；停用后再新增方案时没有该福利项"),
|
||||
getLabel(544347, "3、自定义福利若要缴纳，需要在方案里填写缴纳相关数据")
|
||||
];
|
||||
/*
|
||||
* Author: 黎永顺
|
||||
* Description: 社保福利方案-头部操作
|
||||
|
|
@ -27,18 +31,166 @@ export const renderDropMenuDatas = (selectedKey, showOperateBtn) => {
|
|||
}];
|
||||
};
|
||||
export const renderReqBtns = (selectedKey, onSalaryOpts, showOperateBtn) => {
|
||||
let reqBtns = showOperateBtn ? [
|
||||
<Button type="primary" onClick={()=>onSalaryOpts("ADD")}>{getLabel(365, "新建")}</Button>,
|
||||
<AdvanceInputBtn onOpenAdvanceSearch={()=>onSalaryOpts("OPEN")} onAdvanceSearch={()=>onSalaryOpts("SEARCH")}/>
|
||||
] : [<AdvanceInputBtn onOpenAdvanceSearch={()=>onSalaryOpts("OPEN")} onAdvanceSearch={()=>onSalaryOpts("SEARCH")}/>];
|
||||
if (showOperateBtn) {
|
||||
switch (selectedKey) {
|
||||
case "CUSTOM":
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
let reqBtns = [
|
||||
<Button type="primary" onClick={() => onSalaryOpts("ADD")}>{getLabel(365, "新建")}</Button>,
|
||||
<AdvanceInputBtn onOpenAdvanceSearch={() => onSalaryOpts("OPEN")} onAdvanceSearch={() => onSalaryOpts("SEARCH")}/>
|
||||
];
|
||||
switch (selectedKey) {
|
||||
case "CUSTOM":
|
||||
reqBtns[reqBtns.length - 1] = <WeaSelect style={{ width: 220 }} onChange={() => onSalaryOpts("SEARCH")}
|
||||
options={[
|
||||
{ key: "", showname: getLabel(111, "全部"), selected: true },
|
||||
{ key: "SOCIAL_SECURITY", showname: getLabel(538967, "社保") },
|
||||
{ key: "ACCUMULATION_FUND", showname: getLabel(538969, "公积金") },
|
||||
{ key: "OTHER", showname: getLabel(542717, "企业年金及其他福利") }
|
||||
]}
|
||||
/>;
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
!showOperateBtn && reqBtns.shift();
|
||||
return reqBtns;
|
||||
};
|
||||
export const searchConditons = [
|
||||
{
|
||||
items: [
|
||||
{
|
||||
colSpan: 2,
|
||||
conditionType: "INPUT",
|
||||
domkey: ["schemeName"],
|
||||
fieldcol: 16,
|
||||
isQuickSearch: true,
|
||||
label: getLabel(33162, "方案名称"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
viewAttr: 2
|
||||
},
|
||||
{
|
||||
colSpan: 2,
|
||||
conditionType: "SELECT",
|
||||
domkey: ["paymentTypeEnum"],
|
||||
fieldcol: 16,
|
||||
isQuickSearch: true,
|
||||
label: getLabel(543163, "缴纳类型"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
options: [
|
||||
{ key: "SCHEME_TOWN", showname: getLabel(19702, "城镇") },
|
||||
{ key: "SCHEME_VILLAGE", showname: getLabel(19703, "农村") }
|
||||
],
|
||||
viewAttr: 2
|
||||
}
|
||||
],
|
||||
title: getLabel(82743, "基础信息"),
|
||||
defaultshow: true
|
||||
}
|
||||
];
|
||||
export const welfarePlanCopyConditions = {
|
||||
SOCIAL_SECURITY: [
|
||||
{
|
||||
items: [
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["SOCIAL_SECURITY_schemeName"],
|
||||
fieldcol: 16,
|
||||
label: getLabel(111, "社保名称"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
}
|
||||
],
|
||||
defaultshow: true,
|
||||
title: "",
|
||||
col: 1
|
||||
}
|
||||
],
|
||||
ACCUMULATION_FUND: [
|
||||
{
|
||||
items: [
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["ACCUMULATION_FUND_schemeName"],
|
||||
fieldcol: 16,
|
||||
label: getLabel(111, "公积金名称"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
}
|
||||
],
|
||||
defaultshow: true,
|
||||
title: "",
|
||||
col: 1
|
||||
}
|
||||
],
|
||||
OTHER: [
|
||||
{
|
||||
items: [
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["OTHER_schemeName"],
|
||||
fieldcol: 16,
|
||||
label: getLabel(111, "企业年金及其他福利名称"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
}
|
||||
],
|
||||
defaultshow: true,
|
||||
title: "",
|
||||
col: 1
|
||||
}
|
||||
]
|
||||
};
|
||||
export const customPlanConditons = [
|
||||
{
|
||||
items: [
|
||||
{
|
||||
conditionType: "INPUT",
|
||||
domkey: ["insuranceName"],
|
||||
fieldcol: 14,
|
||||
label: getLabel(111, "福利名称"),
|
||||
labelcol: 8,
|
||||
value: "",
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["welfareType"],
|
||||
fieldcol: 14,
|
||||
label: getLabel(500401, "类型"),
|
||||
labelcol: 8,
|
||||
options: [
|
||||
{ key: "SOCIAL_SECURITY", showname: getLabel(538967, "社保") },
|
||||
{ key: "ACCUMULATION_FUND", showname: getLabel(538969, "公积金") },
|
||||
{ key: "OTHER", showname: getLabel(542717, "企业年金及其他福利") }
|
||||
],
|
||||
detailtype: 3,
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
},
|
||||
{
|
||||
conditionType: "SELECT",
|
||||
domkey: ["paymentScope"],
|
||||
fieldcol: 16,
|
||||
label: getLabel(543169, "缴纳对象"),
|
||||
labelcol: 8,
|
||||
options: [
|
||||
{ key: "SCOPE_COMPANY", showname: getLabel(1851, "公司") },
|
||||
{ key: "SCOPE_PERSON", showname: getLabel(500201, "个人") }
|
||||
],
|
||||
detailtype: 2,
|
||||
rules: "required|string",
|
||||
viewAttr: 3
|
||||
}
|
||||
],
|
||||
title: "",
|
||||
defaultshow: true
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,10 @@ import React, { Component } from "react";
|
|||
import { inject, observer } from "mobx-react";
|
||||
import { WeaLocaleProvider, WeaReqTop } from "ecCom";
|
||||
import { renderDropMenuDatas, renderReqBtns, tabWelfarePlanList } from "./config";
|
||||
import WelfarePlanAdvanceSearchPannel from "./components/welfarePlanAdvanceSearchPannel";
|
||||
import WelfarePlanList from "./components/welfarePlanList";
|
||||
import LogDialog from "../../../components/logViewModal";
|
||||
import cs from "classnames";
|
||||
import "./index.less";
|
||||
|
||||
const getLabel = WeaLocaleProvider.getLabel;
|
||||
|
|
@ -19,17 +22,17 @@ class Index extends Component {
|
|||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
selectedKey: "SOCIAL_SECURITY", showSearchAd: false, isQuery: false, logDialogVisible: false,
|
||||
topTabCount: { stayAdd: 0, paying: 0, stayDel: 0, stopPay: 0, ext: 0 },
|
||||
welfareImpDialog: { visible: false, title: getLabel(24023, "数据导入"), runStatuses: "" },
|
||||
showExtEmpsWitch: false
|
||||
selectedKey: "SOCIAL_SECURITY", showSearchAd: false, isQuery: false, logDialogVisible: false
|
||||
};
|
||||
this.welfarePlanListRef = null;
|
||||
}
|
||||
|
||||
handleReqBtnsCLick = (type, importType) => {
|
||||
const { state, handleSalaryOpts } = this.salaryFileListRef.wrappedInstance || {};
|
||||
handleReqBtnsCLick = (type) => {
|
||||
const { selectedKey } = this.state;
|
||||
switch (type) {
|
||||
case "ADD":
|
||||
const { handleOpts } = this.welfarePlanListRef.wrappedInstance || {};
|
||||
selectedKey === "CUSTOM" ? handleOpts("custom-edit") : "";
|
||||
break;
|
||||
case "OPEN":
|
||||
this.handleOpenAdvanceSearch();
|
||||
|
|
@ -43,6 +46,7 @@ class Index extends Component {
|
|||
};
|
||||
handleOpenAdvanceSearch = () => this.setState({ showSearchAd: true });
|
||||
handleAdvanceSearch = () => this.setState({ isQuery: !this.state.isQuery });
|
||||
onAdSearch = () => this.setState({ showSearchAd: false, isQuery: !this.state.isQuery });
|
||||
onDropMenuClick = (key) => {
|
||||
switch (key) {
|
||||
case "log":
|
||||
|
|
@ -54,16 +58,28 @@ class Index extends Component {
|
|||
};
|
||||
|
||||
render() {
|
||||
const { taxAgentStore: { showOperateBtn }, logDialogVisible } = this.props;
|
||||
const { taxAgentStore: { showOperateBtn } } = this.props;
|
||||
const { logDialogVisible, selectedKey, showSearchAd, isQuery } = this.state;
|
||||
return (
|
||||
<div className="salary-welfare-plan-wrapper">
|
||||
<WeaReqTop
|
||||
title={getLabel(538000, "社保福利方案")} buttonSpace={10} icon={<i className="icon-coms-fa"/>}
|
||||
iconBgcolor="#F14A2D" showDropIcon dropMenuDatas={renderDropMenuDatas(selectedKey, showOperateBtn)}
|
||||
onDropMenuClick={this.onDropMenuClick} tabDatas={tabWelfarePlanList}
|
||||
onDropMenuClick={this.onDropMenuClick} tabDatas={tabWelfarePlanList} selectedKey={selectedKey}
|
||||
onChange={selectedKey => this.setState({ selectedKey, showSearchAd: false })}
|
||||
buttons={renderReqBtns(selectedKey, this.handleReqBtnsCLick, showOperateBtn)}
|
||||
>
|
||||
<div className="salary-welfare-plan-content">
|
||||
<div
|
||||
className={cs("searchAdvanced-condition-container", { "searchAdvanced-condition-hide": !showSearchAd })}>
|
||||
<WelfarePlanAdvanceSearchPannel
|
||||
onCancel={() => this.setState({ showSearchAd: false })}
|
||||
onAdSearch={this.onAdSearch}
|
||||
/>
|
||||
</div>
|
||||
{/*列表*/}
|
||||
<WelfarePlanList ref={dom => this.welfarePlanListRef = dom}
|
||||
selectedKey={selectedKey} isQuery={isQuery}/>
|
||||
</div>
|
||||
{/*操作日志*/}
|
||||
<LogDialog visible={logDialogVisible} logFunction=""
|
||||
|
|
|
|||
|
|
@ -18,12 +18,8 @@
|
|||
padding: 8px 16px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.table-layout {
|
||||
.ant-spin-nested-loading, .ant-spin-container {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.searchAdvanced-condition-hide {
|
||||
display: none;
|
||||
|
|
@ -40,7 +36,7 @@
|
|||
}
|
||||
|
||||
.wea-advanced-searchsAd {
|
||||
height: 246px;
|
||||
height: 125px;
|
||||
overflow: hidden auto;
|
||||
|
||||
.formItem-delete {
|
||||
|
|
@ -68,5 +64,60 @@
|
|||
|
||||
}
|
||||
}
|
||||
|
||||
.welfare-plan-adapt {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
|
||||
.adapt-left {
|
||||
width: 100%;
|
||||
|
||||
.wea-new-table {
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
.planOptBtns {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
a {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
a:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adapt-right {
|
||||
width: 100%;
|
||||
margin-top: 16px;
|
||||
|
||||
.tipContentWrapper {
|
||||
background: #FFF !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (min-width: 1440px) {
|
||||
.salary-welfare-plan-content {
|
||||
.welfare-plan-adapt {
|
||||
display: flex;
|
||||
|
||||
.adapt-left {
|
||||
width: calc(100% - 390px);
|
||||
}
|
||||
|
||||
.adapt-right {
|
||||
width: 380px !important;
|
||||
max-width: 380px !important;
|
||||
margin-top: 0 !important;
|
||||
margin-left: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -10,8 +10,12 @@ const { TableStore } = WeaTableNew;
|
|||
export class ProgrammeStore {
|
||||
//lys-表单初始化(方案查询表单)
|
||||
@observable planSearchForm = new WeaForm();
|
||||
@observable planForm = new WeaForm(); //社保方案-新增编辑Form
|
||||
@action initPlanForm = () => this.planForm = new WeaForm();//社保方案-初始化新增编辑Form
|
||||
@observable planForm = new WeaForm(); //方案-新增编辑Form
|
||||
@action initPlanForm = () => this.planForm = new WeaForm();//方案-初始化新增编辑Form
|
||||
@observable planCopyForm = new WeaForm(); //方案-复制Form
|
||||
@action initPlanCopyForm = () => this.planCopyForm = new WeaForm();//方案-初始化复制Form
|
||||
@observable planCustomForm = new WeaForm(); //方案-新建编辑自定义方案Form
|
||||
@action initPlanCustomForm = () => this.planCustomForm = new WeaForm();//方案-初始化新建编辑自定义方案Form
|
||||
|
||||
|
||||
@observable tableStore = new TableStore(); // new table
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
height: 100%;
|
||||
text-align: center;
|
||||
|
||||
>div {
|
||||
> div {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
margin-top: -10px;
|
||||
|
|
@ -31,6 +31,43 @@
|
|||
}
|
||||
|
||||
|
||||
.ant-checkbox-wrapper+.ant-checkbox-wrapper {
|
||||
.ant-checkbox-wrapper + .ant-checkbox-wrapper {
|
||||
margin-left: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
//公共彈框表单样式
|
||||
.form-dialog-layout {
|
||||
background: #f6f6f6;
|
||||
|
||||
.wea-search-group {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.wea-select, .ant-select-selection, .ant-select {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.wea-select {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.ant-select-selection {
|
||||
height: 30px;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.wea-content {
|
||||
padding: 0;
|
||||
|
||||
.wea-form-cell-wrapper {
|
||||
background: #FFF;
|
||||
border: 1px solid #e5e5e5;
|
||||
border-bottom: none;
|
||||
|
||||
.wea-form-cell {
|
||||
border-bottom: 1px solid #e5e5e5;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue