diff --git a/pc4mobx/hrmSalary/components/TipLabel/index.js b/pc4mobx/hrmSalary/components/TipLabel/index.js new file mode 100644 index 00000000..7768d994 --- /dev/null +++ b/pc4mobx/hrmSalary/components/TipLabel/index.js @@ -0,0 +1,17 @@ +import React from 'react'; +import "./index.less" + +export default class TipLabel extends React.Component { + render() { + return ( +
+
+ 小提示 +
+
+ {this.props.tipList.map(item =>
{item}
)} +
+
+ ) + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/components/TipLabel/index.less b/pc4mobx/hrmSalary/components/TipLabel/index.less new file mode 100644 index 00000000..0ce5a5f2 --- /dev/null +++ b/pc4mobx/hrmSalary/components/TipLabel/index.less @@ -0,0 +1,36 @@ +.tipLabelWrapper { + border-left: 1px solid #e2ecf2; + border-bottom: 1px solid #e2ecf2; + border-right: 1px solid #e2ecf2; + border-radius: 0px 0px 5px 5px; + width: 100%; + overflow: hidden; + .titleWrapper { + width: 100%; + line-height: 19.2px; + padding: 10px; + border-bottom: 1px solid #e2ecf2; + background-color: #f7fbfe; + } + .tipContentWrapper { + padding-bottom: 10px; + } + .tipContentItem { + line-height: 20px; + padding: 0px 16px; + padding-top: 10px; + color: rgb(153, 153, 153); + } + .tipContentItem:first { + padding-top: 0px; + } + + .formLabel { + font-size: 14px; + } + .contentWrapper { + width: 100%; + overflow: hidden; + } + +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/components/twoColContent/index.js b/pc4mobx/hrmSalary/components/twoColContent/index.js new file mode 100644 index 00000000..2f673f22 --- /dev/null +++ b/pc4mobx/hrmSalary/components/twoColContent/index.js @@ -0,0 +1,16 @@ +import React from 'react' +import { Row, Col } from 'antd' + +export default class TwoColContent extends React.Component { + render() { + return + + {this.props.leftContent} + + + + {this.props.rightContent} + + + } +} \ No newline at end of file diff --git a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js index 748ebe2e..dc17fee2 100644 --- a/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js +++ b/pc4mobx/hrmSalary/pages/socialSecurityBenefits/programme/index.js @@ -4,14 +4,17 @@ import { toJS } from 'mobx'; import { Button, Table, DatePicker } from 'antd'; -import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable, WeaInputSearch, WeaSlideModal } from 'ecCom'; +import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaInputSearch, WeaSlideModal } from 'ecCom'; +import { WeaTableNew } from "comsMobx" import "./index.less"; +const WeaTable = WeaTableNew.WeaTable; import { renderNoright, getSearchs } from '../../../util'; // 渲染form数据的方法：因为多个页面都会使用，所以抽的公共方法在util中 import CustomTab from '../../../components/customTab'; import ContentWrapper from '../../../components/contentWrapper'; import SlideModalTitle from '../../../components/slideModalTitle'; +import TipLabel from '../../../components/TipLabel' import { @@ -23,22 +26,29 @@ import { const { MonthPicker } = DatePicker; -@inject('baseTableStore') +import TwoColContent from '../../../components/twoColContent'; + +@inject('programmeStore') @observer export default class Programme extends React.Component { constructor(props) { super(props); this.state = { value: "", - selectedKey: "0", searchValue: "", slideVisiable: false } } - render() { - const { baseTableStore } = this.props; - const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = baseTableStore; + componentWillMount() { + const { programmeStore } = this.props; + const {doInit} = programmeStore; + doInit(); + } + render() { + const { programmeStore } = this.props; + const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = programmeStore; + const { selectedKey, setSelectedKey, getCustomCategoryList, customTableStore } = programmeStore; if (!hasRight && !loading) { // 无权限处理 return renderNoright(); } @@ -67,19 +77,19 @@ export default class Programme extends React.Component { const topTab = [ { title: "社保", - viewcondition: "0" + viewcondition: "SOCIAL_SECURITY" }, { title: "公积金", - viewcondition: "1" + viewcondition: "ACCUMULATION_FUND" }, { title: "企业年金及其他福利", - viewcondition: "2" + viewcondition: "OTHER" }, { title: "自定义福利", - viewcondition: "3" + viewcondition: "custom" } ]; @@ -94,6 +104,15 @@ export default class Programme extends React.Component { } + const renderCustomRightContent = () => { + let tipList = [ + "1、可以为社保、公积金、企业年金及其他福利新增自定义的福利项，如：残疾保险等", + "2、新增自定义福利默认启用，社保福利方案中的自定义福利项均未开启缴纳，当前页面的自定义福利项才可以停用；停用后再新增方案时没有该福利项", + "3、自定义福利若要缴纳，需要在方案里填写缴纳相关数据" + ] + return () + } + return (
{ - this.setState({ selectedKey: v }) + setSelectedKey(v) + if(v == "custom") { // 自定义福利 + getCustomCategoryList() + } else { + getTableDatas(v) + } }} /> { - this.state.selectedKey == '0' && - } - { - this.state.selectedKey == '1' && - } - { - this.state.selectedKey == '2' && - } - { - this.state.selectedKey == "3" && + selectedKey == "custom" ? + + } + rightContent={ + renderCustomRightContent() + } + /> : + } + -
- 小提示 -
-
- {tipList.map(item =>
{item}
)} -
-
+ ) } diff --git a/pc4mobx/hrmSalary/pages/taxAgent/index.less b/pc4mobx/hrmSalary/pages/taxAgent/index.less index 99f32629..b8805555 100644 --- a/pc4mobx/hrmSalary/pages/taxAgent/index.less +++ b/pc4mobx/hrmSalary/pages/taxAgent/index.less @@ -1,40 +1,3 @@ -.tipLabelWrapper { - border-left: 1px solid #e2ecf2; - border-bottom: 1px solid #e2ecf2; - border-right: 1px solid #e2ecf2; - border-radius: 0px 0px 5px 5px; - width: 100%; - overflow: hidden; - .titleWrapper { - width: 100%; - line-height: 19.2px; - padding: 10px; - border-bottom: 1px solid #e2ecf2; - background-color: #f7fbfe; - } - .tipContentWrapper { - padding-bottom: 10px; - } - .tipContentItem { - line-height: 20px; - padding: 0px 16px; - padding-top: 10px; - color: rgb(153, 153, 153); - } - .tipContentItem:first { - padding-top: 0px; - } - - .formLabel { - font-size: 14px; - } - .contentWrapper { - width: 100%; - overflow: hidden; - } - -} - .logViewModal { .searchBar { display: flex; diff --git a/pc4mobx/hrmSalary/stores/index.js b/pc4mobx/hrmSalary/stores/index.js index 22428c28..ffccaf94 100644 --- a/pc4mobx/hrmSalary/stores/index.js +++ b/pc4mobx/hrmSalary/stores/index.js @@ -7,6 +7,7 @@ import { taxRateStore } from './taxRate'; import { CumDeductStore } from "./cumDeduct" import { OtherDeductStore } from "./otherDeduct" import { CumSituationStore } from './cumSituation' +import { ProgrammeStore } from './programme' module.exports = { baseFormStore: new BaseFormStore(), @@ -16,6 +17,7 @@ module.exports = { taxRateStore: new taxRateStore(), cumDeductStore: new CumDeductStore(), otherDeductStore: new OtherDeductStore(), - cumSituationStore: new CumSituationStore() + cumSituationStore: new CumSituationStore(), + programmeStore: new ProgrammeStore() }; diff --git a/pc4mobx/hrmSalary/stores/programme.js b/pc4mobx/hrmSalary/stores/programme.js new file mode 100644 index 00000000..8d401a45 --- /dev/null +++ b/pc4mobx/hrmSalary/stores/programme.js @@ -0,0 +1,85 @@ +import { observable, action, toJS } from 'mobx'; +import { message } from 'antd'; +import { WeaForm, WeaTableNew } from 'comsMobx'; + +import * as API from '../apis/welfareScheme'; // 引入API接口文件 + +const { TableStore } = WeaTableNew; + +export class ProgrammeStore { + @observable tableStore = new TableStore(); // new table + @observable form = new WeaForm(); // nrew 一个form + @observable condition = []; // 存储后台得到的form数据 + @observable hasRight = true; // 判断用户是有权限查看当前页面： 没有权限渲染无权限页面，有权限渲染数据 + @observable showSearchAd = false; // 高级搜索面板显示 + @observable loading = true; // 数据加载状态 + @observable selectedKey = "SOCIAL_SECURITY"; + + @action + setSelectedKey = selectedKey => this.selectedKey = selectedKey; + + // 初始化操作 + @action + doInit = () => { + this.getTableDatas(); + // this.getCustomCategoryList(); + } + + // 获得高级搜索表单数据 + @action + getCondition = () => { + API.getForm().then(action(res => { + if (res.status) { // 接口请求成功/失败处理 + this.condition = res.condition; + this.form.initFormFields(res.condition); // 渲染高级搜索form表单 + } else { + message.error(res.msg || '接口调用失败！') + } + })); + } + + // 渲染table数据 + @action + getTableDatas = (selectKey = "SOCIAL_SECURITY", params) => { + this.loading = true; + const formParams = this.form.getFormParams() || {}; + params = params || formParams; + params.welfareTypeEnum = selectKey + API.getTable(params).then(action(res => { + if (res.status) { // 接口请求成功/失败处理 + this.tableStore.getDatas(res.data.datas); // table 请求数据 + } else { + message.error(res.msg || '接口调用失败！') + } + this.loading = false; + })); + } + + + // 渲染自定义福利 + @action + getCustomCategoryList = (selectKey = "SOCIAL_SECURITY", params) => { + this.loading = true; + const formParams = this.form.getFormParams() || {}; + params = params || formParams; + params.welfareTypeEnum = selectKey + API.getCustomCategoryList(params).then(action(res => { + if (res.status) { // 接口请求成功/失败处理 + this.tableStore.getDatas(res.data.datas); // table 请求数据 + } else { + message.error(res.msg || '接口调用失败！') + } + this.loading = false; + })); + } + + @action + setShowSearchAd = bool => this.showSearchAd = bool; + + // 高级搜索 - 搜索 + @action doSearch = () => { + this.getTableDatas(); + this.showSearchAd = false; + } + +} \ No newline at end of file