统一系统右键

This commit is contained in:
黎永顺 2022-12-01 14:28:30 +08:00
parent 3068ee9cd8
commit 691358a9e2
19 changed files with 1063 additions and 1099 deletions

View File

@ -1,17 +1,17 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button } from 'antd';
import { WeaLogView } from 'comsMobx';
import { WeaTop, WeaRightMenu, WeaLocaleProvider, WeaNewScroll } from 'ecCom';
import { Button } from "antd";
import { WeaLogView } from "comsMobx";
import { WeaLocaleProvider, WeaNewScroll, WeaTop } from "ecCom";
import { renderNoright, renderLoading, getSearchs } from '../util'; // 从util文件引入公共的方法
import { getSearchs, renderLoading, renderNoright } from "../util"; // 从util文件引入公共的方法
const getLabel = WeaLocaleProvider.getLabel;
const WeaLogViewComp = WeaLogView.Component;
@inject('baseFormStore')
@inject("baseFormStore")
@observer
export default class BaseForm extends React.Component {
componentWillMount() { // 初始化渲染页面
@ -31,24 +31,24 @@ export default class BaseForm extends React.Component {
const { baseFormStore: { setLogVisible, saveForm } } = this.props;
let btnArr = [
{
key: 'BTN_SAVE',
icon: <i className='icon-coms-Preservation'/>,
content : `${getLabel(86,'保存')}`,
onClick : () => saveForm()
key: "BTN_SAVE",
icon: <i className="icon-coms-Preservation"/>,
content: `${getLabel(86, "保存")}`,
onClick: () => saveForm()
},
{
key: 'log',
content: getLabel(83, '日志'),
icon: <i className='icon-coms-Print-log' />,
onClick: () => setLogVisible(true),
},]
key: "log",
content: getLabel(83, "日志"),
icon: <i className="icon-coms-Print-log"/>,
onClick: () => setLogVisible(true)
}];
return btnArr;
}
render() {
/*
1判断是否无权限 是显示无权限页面
2渲染form页面:
2渲染form页面:
2-1: WeaRightMenu 右键菜单
2-2: WeaTop: 顶部: 包括下拉菜单
2-3: renderLoading: 加载数据中的loading效果(统一封装在util中)
@ -56,51 +56,56 @@ export default class BaseForm extends React.Component {
2-5: 通过getSearchs方法渲染form
*/
const { baseFormStore } = this.props;
const { loading, hasRight, form, condition, logVisible, logStore, saveLoading, setLogVisible, saveForm } = baseFormStore; // 从后台取数据 和 方法
const {
loading,
hasRight,
form,
condition,
logVisible,
logStore,
saveLoading,
setLogVisible,
saveForm
} = baseFormStore; // 从后台取数据 和 方法
if (!hasRight && !loading) { // 无权限处理
return renderNoright();
}
const btns = [ // 顶部按钮
<Button type='primary' loading={saveLoading} onClick={() => saveForm()}>保存</Button>,
<Button type="primary" loading={saveLoading} onClick={() => saveForm()}>保存</Button>
];
const collectParams = { // 收藏功能配置
favname: '基础表单',
favname: "基础表单",
favouritetype: 1,
objid: 0,
link: 'wui/index.html#/ns_demo01/index',
importantlevel: 1,
link: "wui/index.html#/ns_demo01/index",
importantlevel: 1
};
return (
<WeaRightMenu
datas={this.getRightMenu()} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="基础表单" // title
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
buttons={btns} // 顶部按钮: 这里是保存按钮,不需要可以不显示
buttonSpace={10} // 按钮之间的间隔
showDropIcon={true} // 是否显示右侧下拉按钮
dropMenuDatas={this.getRightMenu()} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="基础表单" // title
icon={<i className="icon-coms-fa" />} // 左侧图标
iconBgcolor='#F14A2D' // 左侧图标背景色
buttons={btns} // 顶部按钮: 这里是保存按钮,不需要可以不显示
buttonSpace={10} // 按钮之间的间隔
showDropIcon={true} // 是否显示右侧下拉按钮
dropMenuDatas={this.getRightMenu()} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
{loading ? renderLoading() :
<WeaNewScroll height='100%'>
{getSearchs(form, toJS(condition), 1)}
</WeaNewScroll>
}
<WeaLogViewComp // 日志功能(一般后端的应用设置是需要的)
visible={logVisible} // 日志弹框的显示隐藏
onCancel={() => setLogVisible(false)} // 关闭日志弹框时的操作设置logVisible属性为false
logStore={logStore} // 日志的store
logType="1" // 模块编码: 该参数要根据模块来给
logSmallType="1" // 细分模块编码: 该参数要根据模块来给
/>
</WeaTop>
</WeaRightMenu>
)
{loading ? renderLoading() :
<WeaNewScroll height="100%">
{getSearchs(form, toJS(condition), 1)}
</WeaNewScroll>
}
<WeaLogViewComp // 日志功能(一般后端的应用设置是需要的)
visible={logVisible} // 日志弹框的显示隐藏
onCancel={() => setLogVisible(false)} // 关闭日志弹框时的操作设置logVisible属性为false
logStore={logStore} // 日志的store
logType="1" // 模块编码: 该参数要根据模块来给
logSmallType="1" // 细分模块编码: 该参数要根据模块来给
/>
</WeaTop>
);
}
}

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, DatePicker, Dropdown, Menu, message, Modal } from "antd";
import { WeaInputSearch, WeaRightMenu, WeaTop } from "ecCom";
import { WeaInputSearch, WeaTop } from "ecCom";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
@ -372,60 +372,56 @@ export default class Calculate extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams}>
{/* 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能 */}
<WeaTop
title="薪资核算" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{/* 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能 */}
<WeaTop
title="薪资核算" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{/* 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能 */}
<CustomTab
searchOperationItem={renderRightOperation()}
onChange={v => {
}}
/>
<CustomPaginationTable
loading={loading}
columns={this.getColumns()}
dataSource={salaryListDataSource}
total={salaryListPageInfo.total}
current={salaryListPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.handleDataPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleShowSizeChange(this.pageInfo);
}}
/>
</WeaTop>
{/*归档进度条*/}
{
this.state.progressVisible &&
<ProgressModal
title="正在归档请稍后"
visible={this.state.progressVisible}
onCancel={() => {
this.setState({ progressVisible: false, progress: 0 });
}}
progress={this.state.progress}
/>
}
{this.state.baseFormVisible &&
<BaseFormModal
visible={this.state.baseFormVisible}
onRefresh={() => this.handleSearch(this.state.searchValue)}
onCancel={() => {
this.setState({ baseFormVisible: false });
}}
/>}
</WeaRightMenu>
<CustomTab
searchOperationItem={renderRightOperation()}
onChange={v => {
}}
/>
<CustomPaginationTable
loading={loading}
columns={this.getColumns()}
dataSource={salaryListDataSource}
total={salaryListPageInfo.total}
current={salaryListPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.handleDataPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleShowSizeChange(this.pageInfo);
}}
/>
</WeaTop>
{/*归档进度条*/}
{
this.state.progressVisible &&
<ProgressModal
title="正在归档请稍后"
visible={this.state.progressVisible}
onCancel={() => {
this.setState({ progressVisible: false, progress: 0 });
}}
progress={this.state.progress}
/>
}
{this.state.baseFormVisible &&
<BaseFormModal
visible={this.state.baseFormVisible}
onRefresh={() => this.handleSearch(this.state.searchValue)}
onCancel={() => {
this.setState({ baseFormVisible: false });
}}
/>}
</div>
);
}

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, Col, DatePicker, Dropdown, Menu, message, Modal, Row, Switch } from "antd";
import { WeaDatePicker, WeaInputSearch, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import { WeaDatePicker, WeaInputSearch, WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import moment from "moment";
import { renderNoright } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../../components/customTab";
@ -17,7 +17,7 @@ import TwoColContent from "../../../components/twoColContent";
import TipLabel from "../../../components/TipLabel";
import ItemMangeFormModal from "./itemMangeFormModal";
import CustomPaginationTable from "../../../components/customPaginationTable";
import "../otherDeduct/index.less"
import "../otherDeduct/index.less";
const MonthPicker = DatePicker.MonthPicker;
@ -284,13 +284,16 @@ export default class Attendance extends React.Component {
const { attendanceStore, taxAgentStore: { showOperateBtn } } = this.props;
const { modalParam } = this.state;
const { loading, hasRight, tableStore } = attendanceStore;
const { step, setStep, setSlideVisiable, slideVisiable, doBatchDelete,searchFieldSettingList,
fieldSettingAttendList, fieldSettingCustomList, setFieldSettingAttendList, setFieldSettingCustomList,
const {
step, setStep, setSlideVisiable, slideVisiable, doBatchDelete, searchFieldSettingList,
fieldSettingAttendList, fieldSettingCustomList, setFieldSettingAttendList, setFieldSettingCustomList
} = attendanceStore;
const { getAttendanceFieldSettingList, saveAttendanceFieldSetting, fieldDataSource,
const {
getAttendanceFieldSettingList, saveAttendanceFieldSetting, fieldDataSource,
fieldTableStore, fieldPageInfo, attendanceDataSource, attendanceColumns,
attendancePageInfo, importLedgerList, previewAttendQuoteColumns, previewAttendQuoteDataSource,
importResult, cycle } = attendanceStore;
importResult, cycle
} = attendanceStore;
if (!hasRight && !loading) {
// 无权限处理
@ -624,11 +627,11 @@ export default class Attendance extends React.Component {
attendanceStore: { saveAttendanceField, getAttendanceFieldList }
} = this.props;
value.fieldType = value.fieldType == "1" ? "NUMBER" : "TEXT";
saveAttendanceField(value).then(()=>{
saveAttendanceField(value).then(() => {
this.fieldSearch = { fieldName: this.state.fieldName };
getAttendanceFieldList(this.fieldSearch);
this.setState({ itemMangeVisible: false });
})
});
};
const handleItemMangeUpdate = value => {
@ -687,94 +690,90 @@ export default class Attendance extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams}>
<WeaTop
title="考勤引用" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{this.state.tabSelectedKey == 0
? <div>
<CustomTab
topTab={topTab}
searchOperationItem={renderSearchOperationItem()}
onChange={v => {
this.pageInfo = { current: 1, pageSize: 10 };
handleTabChange(v);
}}
/>
<CustomTab
leftOperation={renderLeftOperation()}
onChange={v => {
}}
/>
<WeaTop
title="考勤引用" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{this.state.tabSelectedKey == 0
? <div>
<CustomTab
topTab={topTab}
searchOperationItem={renderSearchOperationItem()}
onChange={v => {
this.pageInfo = { current: 1, pageSize: 10 };
handleTabChange(v);
}}
/>
<CustomTab
leftOperation={renderLeftOperation()}
onChange={v => {
}}
/>
<CustomPaginationTable
loading={loading}
columns={this.getColumns(attendanceColumns)}
dataSource={attendanceDataSource}
total={attendancePageInfo.total}
current={attendancePageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.pageInfo.current = value;
this.handleDataPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleDataShowSizeChange(this.pageInfo);
}}
/>
</div>
: <div>
<CustomTab
topTab={topTab}
searchOperationItem={renderRightOperation()}
onChange={v => {
this.setState({
tabSelectedKey: v
},()=>{
this.pageInfo = { current: 1, pageSize: 10 };
});
}}
/>
<TwoColContent
leftContent={
<CustomPaginationTable
loading={loading}
dataSource={fieldDataSource}
columns={getFieldColumns(
fieldTableStore.columns ? fieldTableStore.columns : []
)}
total={fieldPageInfo.total}
current={fieldPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.pageInfo.current = value;
this.handleFieldPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleFieldShowSizeChange(this.pageInfo);
}}
/>
}
rightContent={
<TipLabel
tipList={[
"1、考勤字段包含自定义字段和考勤模块的统计字段所有字段不可重名",
"2、停用自定义字段将影响其参与计算的账套核算"
]}
/>
}
/>
</div>}
</WeaTop>
</WeaRightMenu>
<CustomPaginationTable
loading={loading}
columns={this.getColumns(attendanceColumns)}
dataSource={attendanceDataSource}
total={attendancePageInfo.total}
current={attendancePageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.pageInfo.current = value;
this.handleDataPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleDataShowSizeChange(this.pageInfo);
}}
/>
</div>
: <div>
<CustomTab
topTab={topTab}
searchOperationItem={renderRightOperation()}
onChange={v => {
this.setState({
tabSelectedKey: v
}, () => {
this.pageInfo = { current: 1, pageSize: 10 };
});
}}
/>
<TwoColContent
leftContent={
<CustomPaginationTable
loading={loading}
dataSource={fieldDataSource}
columns={getFieldColumns(
fieldTableStore.columns ? fieldTableStore.columns : []
)}
total={fieldPageInfo.total}
current={fieldPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.pageInfo.current = value;
this.handleFieldPageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleFieldShowSizeChange(this.pageInfo);
}}
/>
}
rightContent={
<TipLabel
tipList={[
"1、考勤字段包含自定义字段和考勤模块的统计字段所有字段不可重名",
"2、停用自定义字段将影响其参与计算的账套核算"
]}
/>
}
/>
</div>}
</WeaTop>
<ImportModal
init={() => {
this.handleInitImportModal();
@ -892,7 +891,7 @@ export default class Attendance extends React.Component {
measure={"%"}
title={
<SlideModalTitle
subtitle='考勤数据'
subtitle="考勤数据"
editable={false}
showOperateBtn={showOperateBtn}
customOperate={renderCustomOperate()}

View File

@ -2,7 +2,7 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Col, Dropdown, Menu, message, Modal, Popover, Row } from "antd";
import { WeaDatePicker, WeaHelpfulTip, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import { WeaDatePicker, WeaHelpfulTip, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import moment from "moment";
import { getSearchs, renderLoading } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import ImportModal from "../../../components/importModal";
@ -701,42 +701,38 @@ export default class CumDeduct extends React.Component {
}
return (
<div className="cumDeductWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
<WeaTop
title="累计专项附加扣除" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
buttons={showOperateBtn ? btns : []}
>
<WeaTop
title="累计专项附加扣除" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
buttons={showOperateBtn ? btns : []}
>
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder="请输入姓名"
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={(bool) => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={(v) => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder="请输入姓名"
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={(bool) => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={(v) => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</WeaTop>
</WeaRightMenu>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
/>
</WeaTop>
{modalVisiable && (
<ImportModal
needimportSelected //下载模板需要带上导入所选项

View File

@ -2,7 +2,7 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Col, Dropdown, Menu, message, Modal, Popover, Row } from "antd";
import { WeaDatePicker, WeaHelpfulTip, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import { WeaDatePicker, WeaHelpfulTip, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import moment from "moment";
import { getSearchs, renderLoading } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import ImportModal from "../../../components/importModal";
@ -650,40 +650,38 @@ export default class CumSituation extends React.Component {
}
return (
<div className="cumDeductWrapper">
<WeaRightMenu datas={rightMenu}>
<WeaTop
title="往期累计情况(工资、薪金)" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
buttons={showOperateBtn ? btns : []}>
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder={"请输入姓名"}
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
<WeaTop
title="往期累计情况(工资、薪金)" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
buttons={showOperateBtn ? btns : []}>
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder={"请输入姓名"}
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</WeaTop>
</WeaRightMenu>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
/>
</WeaTop>
{modalVisiable &&
<ImportModal
init={() => {

View File

@ -2,7 +2,7 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Col, Dropdown, Menu, message, Modal, Popover, Row } from "antd";
import { WeaDatePicker, WeaHelpfulTip, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import { WeaDatePicker, WeaHelpfulTip, WeaSelect, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import moment from "moment";
import { getSearchs, renderLoading } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import ImportModal from "../../../components/importModal";
@ -13,7 +13,6 @@ import EditSlideContent from "./editSlideContent";
import { optionAddAll } from "../../../util/options";
import * as API from "../../../apis/otherDeduct";
import "./index.less";
import { extendToLastMonth } from "../../../apis/otherDeduct";
@inject("otherDeductStore", "taxAgentStore")
@ -244,7 +243,7 @@ export default class OtherDeduct extends React.Component {
//新功能
handleCreateData = (payload) => {
const { editId }= this.state;
const { editId } = this.state;
this.setState({ saveLoading: true });
if (!_.isEmpty(editId)) {
API.editData({ ...payload, id: editId.id }).then(({ status, errormsg }) => {
@ -296,7 +295,7 @@ export default class OtherDeduct extends React.Component {
if (key === "edit") {
this.setState({
addVisible: true
},()=>{
}, () => {
API.getData({ id: row.id }).then(({ status, data }) => {
if (status) {
this.setState({ editId: data });
@ -386,15 +385,15 @@ export default class OtherDeduct extends React.Component {
};
//沿用上月
extendToLastMonth= ()=>{
extendToLastMonth = () => {
const { monthValue: declareMonth, taxAgentId } = this.state;
const { otherDeductStore: { doSearch } } = this.props;
const payload= {
const payload = {
declareMonth,
taxAgentId: taxAgentId === "All" ? "" : taxAgentId,
}
taxAgentId: taxAgentId === "All" ? "" : taxAgentId
};
this.setState({ lastLoading: true });
API.extendToLastMonth(payload).then(({ status, data, errormsg })=>{
API.extendToLastMonth(payload).then(({ status, data, errormsg }) => {
this.setState({ lastLoading: false });
if (status) {
message.success(data || "操作成功");
@ -406,7 +405,7 @@ export default class OtherDeduct extends React.Component {
message.error(errormsg || "操作失败");
}
}).catch(() => this.setState({ lastLoading: false }));
}
};
render() {
@ -442,7 +441,16 @@ export default class OtherDeduct extends React.Component {
setPageObj
} = otherDeductStore;
const selectedRowKeys = toJS(tableStore.selectedRowKeys) || [];
const { modalParam, monthValue, taxAgentId, slideSelectedKey, addVisible, editId, saveLoading, lastLoading } = this.state;
const {
modalParam,
monthValue,
taxAgentId,
slideSelectedKey,
addVisible,
editId,
saveLoading,
lastLoading
} = this.state;
const detailSelectedRowKeys = toJS(slideTableStore.selectedRowKeys) || [];
@ -542,7 +550,7 @@ export default class OtherDeduct extends React.Component {
this.setState({
addVisible: true,
editId: {}
},()=>addForm.resetForm());
}, () => addForm.resetForm());
}}>
新建
</Button>,
@ -678,39 +686,37 @@ export default class OtherDeduct extends React.Component {
return (
<div className="cumDeductWrapper">
<WeaRightMenu datas={rightMenu}>
<WeaTop
title="其他免税扣除" // 文字
icon={<i className="icon-coms-meeting"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
buttons={showOperateBtn ? btns : []}>
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder={"请输入姓名"}
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
<WeaTop
title="其他免税扣除" // 文字
icon={<i className="icon-coms-meeting"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
buttons={showOperateBtn ? btns : []}>
<div className="weaTabWrapper">
<WeaTab
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
searchsBasePlaceHolder={"请输入姓名"}
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
onSearch={() => this.handleSearch()} // 点搜索按钮时的回调
searchsAdQuick={this.getSearchsAdQuick()}
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
</WeaTop>
</WeaRightMenu>
</div>
<WeaTable
rowKey="id"
rowSelection={rowSelection}
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
/>
</WeaTop>
{modalVisiable &&
<ImportModal
needimportSelected //下载模板需要带上导入所选项

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, DatePicker } from "antd";
import { WeaRightMenu, WeaTop } from "ecCom";
import { WeaTop } from "ecCom";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
import CustomTable from "../../components/customTable";
@ -219,34 +219,29 @@ export default class Declare extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="个税申报表" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="个税申报表" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab searchOperationItem={renderRightOperation()}/>
<CustomTable
loading={loading}
columns={this.getColumns()}
dataSource={listDataSource}
pagination={{
onChange: (value) => {
this.handleDataPageChange(value);
},
total: pageInfo.total,
showTotal: (total) => `${total}`,
current: pageInfo.pageNum
}}
/>
</WeaTop>
</WeaRightMenu>
<CustomTab searchOperationItem={renderRightOperation()}/>
<CustomTable
loading={loading}
columns={this.getColumns()}
dataSource={listDataSource}
pagination={{
onChange: (value) => {
this.handleDataPageChange(value);
},
total: pageInfo.total,
showTotal: (total) => `${total}`,
current: pageInfo.pageNum
}}
/>
</WeaTop>
{this.state.declarationModalVisible && (
<GenerateModal
onGenerate={() => {

View File

@ -1,20 +1,16 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, Table, DatePicker } from 'antd';
import { Button, DatePicker } from "antd";
import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaTable } from 'ecCom';
import { WeaTable, WeaTop } from "ecCom";
import { renderNoright, getSearchs } from '../../util'; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from '../../components/customTab';
import ContentWrapper from '../../components/contentWrapper';
import { columns, dataSource } from './columns';
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import { columns, dataSource } from "./columns";
const { MonthPicker } = DatePicker;
@inject('baseTableStore')
@inject("baseTableStore")
@observer
export default class IndividualIncomeTaxRateForm extends React.Component {
constructor(props) {
@ -22,63 +18,68 @@ export default class IndividualIncomeTaxRateForm extends React.Component {
this.state = {
value: "",
selectedKey: "0"
}
};
}
render() {
const { baseTableStore } = this.props;
const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = baseTableStore;
const {
loading,
hasRight,
form,
condition,
tableStore,
showSearchAd,
getTableDatas,
doSearch,
setShowSearchAd
} = baseTableStore;
if (!hasRight && !loading) { // 无权限处理
return renderNoright();
}
const rightMenu = [// 右键菜单
{
key: 'BTN_COLUMN',
icon: <i className='icon-coms-Custom' />,
content: '显示列定制',
{
key: "BTN_COLUMN",
icon: <i className="icon-coms-Custom"/>,
content: "显示列定制",
onClick: this.showColumn
},
}
];
const collectParams = { // 收藏功能配置
favname: '个税税率表',
favname: "个税税率表",
favouritetype: 1,
objid: 0,
link: 'wui/index.html#/ns_demo03/index',
importantlevel: 1,
link: "wui/index.html#/ns_demo03/index",
importantlevel: 1
};
const adBtn = [ // 高级搜索内部按钮
<Button type="primary" onClick={doSearch}>搜索</Button>,
<Button type="ghost" onClick={() => form.resetForm()}>重置</Button>,
<Button type="ghost" onClick={() => setShowSearchAd(false)}>取消</Button>,
<Button type="ghost" onClick={() => setShowSearchAd(false)}>取消</Button>
];
const topTab = [
];
const topTab = [];
const renderSearchOperationItem = () => {
return <div></div>
}
return <div></div>;
};
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="个税税率表" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={true} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="个税税率表" // 文字
icon={<i className="icon-coms-fa" />} // 左侧图标
iconBgcolor='#F14A2D' // 左侧图标背景色
showDropIcon={true} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTable columns={columns} dataSource={dataSource}/>
</WeaTop>
</WeaRightMenu>
<WeaTable columns={columns} dataSource={dataSource}/>
</WeaTop>
</div>
)
);
}
}

View File

@ -1,9 +1,9 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, DatePicker, Dropdown, Menu, Modal, Switch } from "antd";
import { Button, Dropdown, Menu, Modal, Switch } from "antd";
import { WeaInputSearch, WeaRightMenu, WeaSlideModal, WeaTable, WeaTop } from "ecCom";
import { WeaInputSearch, WeaSlideModal, WeaTable, WeaTop } from "ecCom";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
import StepSlide from "../../components/stepSlide";
@ -398,170 +398,166 @@ export default class Ledger extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams}>
<WeaTop
title="薪资账套" // 文字
icon={<i className="icon-coms-fa" />} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
<CustomTab
searchOperationItem={renderRightOperation()}
onChange={v => {
<WeaTop
title="薪资账套" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
<CustomTab
searchOperationItem={renderRightOperation()}
onChange={v => {
}}
/>
<WeaTable
rowKey="id"
columns={
showOperateBtn
? newColumns
: _.filter(newColumns, it => it.dataIndex !== "operate")
}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
/>
{this.state.stepSlideVisible &&
<StepSlide
visible={this.state.stepSlideVisible}
steps={steps}
currentStep={currentStep}
onCancel={() => {
this.setState({ stepSlideVisible: false });
}}
/>
<WeaTable
rowKey="id"
columns={
showOperateBtn
? newColumns
: _.filter(newColumns, it => it.dataIndex !== "operate")
}
dataSource={dataSource}
pagination={pagination}
loading={loading}
scroll={{ x: 1300 }}
/>
{this.state.stepSlideVisible &&
<StepSlide
visible={this.state.stepSlideVisible}
steps={steps}
currentStep={currentStep}
onCancel={() => {
this.setState({ stepSlideVisible: false });
}}
customOperate={
currentStep == 0 ? [
<Button
type="primary"
loading={saveLoading}
onClick={() => {
handleStep1Save();
}}>
保存并进入下一步
</Button>
]: currentStep == 1 ? [
<Button
type="default"
onClick={() => {
this.setState({ stepSlideVisible: false });
}}>
完成跳过所有步骤
</Button>,
<Button
type="primary"
style={{ marginLeft: "10px" }}
onClick={() => {
handleStepSave();
}}>
下一步
</Button>
]:currentStep == 2 ? [
<Button
type="default"
onClick={() => {
this.setState({ stepSlideVisible: false });
}}>
完成跳过所有步骤
</Button>,
<Button
type="default"
style={{ marginLeft: "10px" }}
onClick={() => {
prevStep();
}}>
上一步
</Button>,
<Button
type="primary"
loading={saveLoading}
style={{ marginLeft: "10px" }}
onClick={() => {
handleStepSave();
}}>
保存并进入下一步
</Button>
] : currentStep == 3 ? [
<Button
type="default"
style={{ marginRight: "10px" }}
onClick={() => {
prevStep();
}}>
上一步
</Button>,
<Button
type="primary"
onClick={() => {
handleStepSave();
}}>
完成
</Button>
] : []
}
title="新建账套"
content={
<div>
{currentStep == 0 && <SlideBaseForm/>}
{currentStep == 1 && <SlideRefereUser/>}
{currentStep == 2 && <SalaryItemForm/>}
{currentStep == 3 && <CalRulesForm/>}
{currentStep == 4 && <ValidRulesForm/>}
</div>
}
/>}
{this.state.editSlideVisible &&
<WeaSlideModal
className='slideOuterWrapper'
visible={this.state.editSlideVisible}
top={0}
width={45}
height={100}
direction={"right"}
measure={"%"}
title={
<SlideModalTitle
subtitle={`编辑账套`}
tabs={[
{ title: "基础设置", key: 0 },
{ title: "关联人员", key: 1 },
{ title: "薪资项目", key: 2 },
{ title: "调薪计薪规则", key: 3 }
// { title: "校验规则", key: 4 }
]}
customOperate={
currentStep == 0 ? [
<Button
type="primary"
loading={saveLoading}
showOperateBtn={showOperateBtn}
editable={canEdit === "true"}
selectedTab={selectedTab}
onSave={() => this.handleEditSlideSave()}
subItemChange={selectedTab => {
this.setState({ selectedTab });
}}
/>
}
content={
<div>
{selectedTab == 0 && <SlideBaseForm edit={true}/>}
{selectedTab == 1 && <SlideRefereUser edit={true}/>}
{selectedTab == 2 && <SalaryItemForm edit={true}/>}
{selectedTab == 3 && <CalRulesForm edit={true}/>}
{selectedTab == 4 && <ValidRulesForm edit={true}/>}
</div>
}
onClose={() => this.setState({ editSlideVisible: false },()=>{
this.setState({ selectedTab:0 });
onClick={() => {
handleStep1Save();
}}>
保存并进入下一步
</Button>
] : currentStep == 1 ? [
<Button
type="default"
onClick={() => {
this.setState({ stepSlideVisible: false });
}}>
完成跳过所有步骤
</Button>,
<Button
type="primary"
style={{ marginLeft: "10px" }}
onClick={() => {
handleStepSave();
}}>
下一步
</Button>
] : currentStep == 2 ? [
<Button
type="default"
onClick={() => {
this.setState({ stepSlideVisible: false });
}}>
完成跳过所有步骤
</Button>,
<Button
type="default"
style={{ marginLeft: "10px" }}
onClick={() => {
prevStep();
}}>
上一步
</Button>,
<Button
type="primary"
loading={saveLoading}
style={{ marginLeft: "10px" }}
onClick={() => {
handleStepSave();
}}>
保存并进入下一步
</Button>
] : currentStep == 3 ? [
<Button
type="default"
style={{ marginRight: "10px" }}
onClick={() => {
prevStep();
}}>
上一步
</Button>,
<Button
type="primary"
onClick={() => {
handleStepSave();
}}>
完成
</Button>
] : []
}
title="新建账套"
content={
<div>
{currentStep == 0 && <SlideBaseForm/>}
{currentStep == 1 && <SlideRefereUser/>}
{currentStep == 2 && <SalaryItemForm/>}
{currentStep == 3 && <CalRulesForm/>}
{currentStep == 4 && <ValidRulesForm/>}
</div>
}
/>}
{this.state.editSlideVisible &&
<WeaSlideModal
className="slideOuterWrapper"
visible={this.state.editSlideVisible}
top={0}
width={45}
height={100}
direction={"right"}
measure={"%"}
title={
<SlideModalTitle
subtitle={`编辑账套`}
tabs={[
{ title: "基础设置", key: 0 },
{ title: "关联人员", key: 1 },
{ title: "薪资项目", key: 2 },
{ title: "调薪计薪规则", key: 3 }
// { title: "校验规则", key: 4 }
]}
loading={saveLoading}
showOperateBtn={showOperateBtn}
editable={canEdit === "true"}
selectedTab={selectedTab}
onSave={() => this.handleEditSlideSave()}
subItemChange={selectedTab => {
this.setState({ selectedTab });
}}
/>
}
content={
<div>
{selectedTab == 0 && <SlideBaseForm edit={true}/>}
{selectedTab == 1 && <SlideRefereUser edit={true}/>}
{selectedTab == 2 && <SalaryItemForm edit={true}/>}
{selectedTab == 3 && <CalRulesForm edit={true}/>}
{selectedTab == 4 && <ValidRulesForm edit={true}/>}
</div>
}
onClose={() => this.setState({ editSlideVisible: false }, () => {
this.setState({ selectedTab: 0 });
})}
showMask={true}
closeMaskOnClick={() =>
this.setState({ editSlideVisible: false }, () => {
this.setState({ selectedTab: 0 });
})}
showMask={true}
closeMaskOnClick={() =>
this.setState({ editSlideVisible: false },()=>{
this.setState({ selectedTab:0 });
})}
/>}
</WeaTop>
</WeaRightMenu>
/>}
</WeaTop>
{this.state.copyFormVisible &&
<CopyFormModal

View File

@ -329,6 +329,7 @@ export default class CanMoveItem extends React.Component {
{formalModalVisible &&
<FormalFormModal
formulaId={this.formulaId}
valueType={this.record.valueType}
visible={formalModalVisible}
onSaveFormal={data => {
this.handleSaveFormal(data);

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, DatePicker } from "antd";
import { WeaRightMenu, WeaTop } from "ecCom";
import { WeaTop } from "ecCom";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
import CustomPaginationTable from "../../components/customPaginationTable";
@ -189,80 +189,75 @@ export default class MySalary extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<Authority ecId={`${this && this.props && this.props.ecId || ""}_Authority@lulowc`} store={mySalaryStore}>
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="我的薪资福利" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="我的薪资福利" // 文字
icon={<i className="icon-coms-fa" />} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab topTab={topTab}
searchOperationItem={
renderSearchOperationItem()
}
onChange={(v) => {
this.handleTabChange(v);
this.setState({ selectedKey: v });
}}
<CustomTab topTab={topTab}
searchOperationItem={
renderSearchOperationItem()
}
onChange={(v) => {
this.handleTabChange(v);
this.setState({ selectedKey: v });
}}
/>
{
this.state.selectedKey == "0" &&
<CustomPaginationTable
loading={loading}
columns={this.getColumns()}
dataSource={myBillDataSource ? myBillDataSource : []}
total={myBillPageInfo.total}
current={myBillPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={(value) => {
this.pageInfo.current = value;
this.handlePageChange();
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handlePageChange();
}}
/>
{
this.state.selectedKey == "0" &&
<CustomPaginationTable
loading={loading}
columns={this.getColumns()}
dataSource={myBillDataSource ? myBillDataSource : []}
total={myBillPageInfo.total}
current={myBillPageInfo.pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={(value) => {
this.pageInfo.current = value;
this.handlePageChange();
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handlePageChange();
}}
/>
}
{/* {
}
{/* {
this.state.selectedKey == '1' && <WeaTable columns={socialSecurityBenefitsColumns} dataSource={dataSource} scroll={{ x: 1000}}/>
} */}
{
this.state.selectedKey == "2" &&
<CustomPaginationTable
columns={recordListColumns}
dataSource={recordListDataSource}
total={recordListPageInfo.total}
current={recordListPageInfo.pageNum}
pageSize={this.historyPageInfo.pageSize}
onPageChange={(value) => {
this.historyPageInfo.current = value;
this.handleHistoryPageChange();
}}
onShowSizeChange={(current, pageSize) => {
this.historyPageInfo = { current, pageSize };
this.handleHistoryPageChange();
}}
/>
}
{
this.state.selectedKey == "2" &&
<CustomPaginationTable
columns={recordListColumns}
dataSource={recordListDataSource}
total={recordListPageInfo.total}
current={recordListPageInfo.pageNum}
pageSize={this.historyPageInfo.pageSize}
onPageChange={(value) => {
this.historyPageInfo.current = value;
this.handleHistoryPageChange();
}}
onShowSizeChange={(current, pageSize) => {
this.historyPageInfo = { current, pageSize };
this.handleHistoryPageChange();
}}
/>
}
</WeaTop>
</WeaRightMenu>
</WeaTop>
</Authority>
{
salaryBillVisible && <PayrollModal
visible={salaryBillVisible}
id={this.salaryInfoId}
onCancel={() => {
this.setState({ salaryBillVisible: false },()=>{
setMySalaryBill({})
this.setState({ salaryBillVisible: false }, () => {
setMySalaryBill({});
});
}}
/>

View File

@ -3,7 +3,7 @@ import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, DatePicker, message, Modal } from "antd";
import moment from "moment";
import { WeaHelpfulTip, WeaInputSearch, WeaRightMenu, WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import { WeaHelpfulTip, WeaInputSearch, WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import { renderLoading } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
@ -390,58 +390,53 @@ export default class Payroll extends React.Component {
return (
<div>
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="工资单发放" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="工资单发放" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab
topTab={topTab}
searchOperationItem={
renderRightOperation()
}
onChange={(v) => {
this.setState({ selectedKey: v, stepSlideVisible: false, editSlideVisible: false });
<CustomTab
topTab={topTab}
searchOperationItem={
renderRightOperation()
}
onChange={(v) => {
this.setState({ selectedKey: v, stepSlideVisible: false, editSlideVisible: false });
}}
/>
{
this.state.selectedKey == 0 &&
<SalarySendList
onEditTemplate={(record) => {
this.handleTemplateListEdit(record);
}}
salaryYearMonth={this.salaryYearMonth}
handleListDataPageChange={(value, pageInfo) => {
this.handleListDataPageChange(value, pageInfo);
}}
handleListShowSizeChange={(pageInfo) => {
this.handleListShowSizeChange(pageInfo);
}}
/>
{
this.state.selectedKey == 0 &&
<SalarySendList
onEditTemplate={(record) => {
this.handleTemplateListEdit(record);
}}
salaryYearMonth={this.salaryYearMonth}
handleListDataPageChange={(value, pageInfo) => {
this.handleListDataPageChange(value, pageInfo);
}}
handleListShowSizeChange={(pageInfo) => {
this.handleListShowSizeChange(pageInfo);
}}
/>
}
}
{
this.state.selectedKey == 1 &&
<TemplateSettingList
onEdit={(record) => {
this.handleTemplateListEdit(record);
}}
onCopy={(record) => {
this.handleTemplateListCopy(record);
}}
showOperateBtn={showOperateBtn}
onDelete={(record) => this.handleTemplateListDelete(record)}
/>
}
</WeaTop>
</WeaRightMenu>
{
this.state.selectedKey == 1 &&
<TemplateSettingList
onEdit={(record) => {
this.handleTemplateListEdit(record);
}}
onCopy={(record) => {
this.handleTemplateListCopy(record);
}}
showOperateBtn={showOperateBtn}
onDelete={(record) => this.handleTemplateListDelete(record)}
/>
}
</WeaTop>
{
this.state.stepSlideVisible && <StepSlide

View File

@ -3,7 +3,6 @@ import { Col, Radio, Row, Switch } from "antd";
import { WeaHelpfulTip, WeaInput, WeaSelect, WeaTextarea } from "ecCom";
import "./index.less";
import { dataTypeOptions, patternOptions, roundingModeOptions } from "./options";
import RequiredLabelTip from "../../components/requiredLabelTip";
import FormalFormModal from "./formalFormModal";
export default class CustomSalaryItemSlide extends React.Component {

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, Dropdown, Menu, Modal, Switch, message } from "antd";
import { WeaInputSearch, WeaRightMenu, WeaSlideModal, WeaTop } from "ecCom";
import { Button, Dropdown, Menu, message, Modal, Switch } from "antd";
import { WeaInputSearch, WeaSlideModal, WeaTop } from "ecCom";
import { renderLoading } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
import SystemSalaryItemModal from "./systemSalaryItemModal";
@ -143,7 +143,8 @@ export default class SalaryItem extends React.Component {
}}>删除</a>
</Menu.Item>
</Menu>}>
<a href="javascript:void(0)" style={{textDecoration: "none"}}><i className="icon-coms-more" style={{fontSize: 18}}></i></a>
<a href="javascript:void(0)" style={{ textDecoration: "none" }}><i className="icon-coms-more"
style={{ fontSize: 18 }}></i></a>
</Dropdown>
);
} else {
@ -364,50 +365,45 @@ export default class SalaryItem extends React.Component {
};
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="薪资项目管理" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="薪资项目管理" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={true} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab
searchOperationItem={
renderRightOperation()
}
/>
<CustomPaginationTable
rowKey={record => record.id}
loading={loading}
rowSelection={rowSelection}
dataSource={tableDataSource}
columns={this.getColumns(tableColumns)}
total={this.state.searchParams.total}
current={this.state.searchParams.current}
pageSize={this.state.searchParams.pageSize}
onPageChange={(value) => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.setState({
searchParams: {
...this.state.searchParams,
current,
pageSize
}
}, () => {
this.handleShowSizeChange(this.state.searchParams);
});
}}
/>
<CustomTab
searchOperationItem={
renderRightOperation()
}
/>
<CustomPaginationTable
rowKey={record => record.id}
loading={loading}
rowSelection={rowSelection}
dataSource={tableDataSource}
columns={this.getColumns(tableColumns)}
total={this.state.searchParams.total}
current={this.state.searchParams.current}
pageSize={this.state.searchParams.pageSize}
onPageChange={(value) => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.setState({
searchParams: {
...this.state.searchParams,
current,
pageSize
}
}, () => {
this.handleShowSizeChange(this.state.searchParams);
});
}}
/>
</WeaTop>
</WeaRightMenu>
</WeaTop>
{
systemItemVisible && <SystemSalaryItemModal visible={systemItemVisible} onCancel={() => {

View File

@ -2,7 +2,7 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Dropdown, Menu, message, Modal, Popover } from "antd";
import { WeaHelpfulTip, WeaRightMenu, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import { WeaHelpfulTip, WeaSlideModal, WeaTab, WeaTable, WeaTop } from "ecCom";
import { getSearchs, renderLoading } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import BaseForm from "./baseForm";
import SlideModalTitle from "../../../components/slideModalTitle";
@ -704,49 +704,44 @@ export default class Archives extends React.Component {
};
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="社保福利档案" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="社保福利档案" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTab
datas={tabCondition}
buttons={showOperateBtn ? btns : []}
counts={tabCount}
countParam="groupid" //数量
keyParam="viewcondition" //主键
selectedKey={selectedKey}
onChange={this.handleChangeTab}
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
searchsBasePlaceHolder={"请输入姓名"}
onSearch={this.query} // 点搜索按钮时的回调
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
<WeaTable
loading={loading.query}
rowKey="baseInfo"
columns={this.getColumns()} dataSource={dataSourceActive} pagination={pagination}
rowSelection={rowSelection}
scroll={{ x: 1200 }}
/>
{
!_.isEmpty(this.getColumns()) &&
<TipLabel>{this.getTipChildren()}</TipLabel>
}
</WeaTop>
</WeaRightMenu>
<WeaTab
datas={tabCondition}
buttons={showOperateBtn ? btns : []}
counts={tabCount}
countParam="groupid" //数量
keyParam="viewcondition" //主键
selectedKey={selectedKey}
onChange={this.handleChangeTab}
searchType={["base", "advanced"]} // base基础搜索框 advanced显示高级搜索按钮
showSearchAd={showSearchAd} // 是否展开高级搜索面板
setShowSearchAd={bool => setShowSearchAd(bool)} //高级搜索面板受控
searchsAd={getSearchs(form, toJS(condition), 2)} // 高级搜索内部数据
buttonsAd={adBtn} // 高级搜索内部按钮
searchsBasePlaceHolder={"请输入姓名"}
onSearch={this.query} // 点搜索按钮时的回调
onSearchChange={v => form.updateFields({ username: v })} // 在搜索框中输入的文字改变时的回调: 这里需要同步高级搜索和外部搜索框的值
searchsBaseValue={form.getFormParams().username} // 外部input搜索值受控: 这里和高级搜索的requestname同步
/>
<WeaTable
loading={loading.query}
rowKey="baseInfo"
columns={this.getColumns()} dataSource={dataSourceActive} pagination={pagination}
rowSelection={rowSelection}
scroll={{ x: 1200 }}
/>
{
!_.isEmpty(this.getColumns()) &&
<TipLabel>{this.getTipChildren()}</TipLabel>
}
</WeaTop>
{
this.state.editSlideVisible &&
<WeaSlideModal

View File

@ -2,7 +2,7 @@ import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Dropdown, Menu, message, Modal, Switch } from "antd";
import { WeaRightMenu, WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import { WeaSelect, WeaSlideModal, WeaTop } from "ecCom";
import { WeaTableNew } from "comsMobx";
import { renderNoright } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../../components/customTab";
@ -450,93 +450,88 @@ export default class Programme extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams}>
<WeaTop
title="社保福利方案" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{/* 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能 */}
<WeaTop
title="社保福利方案" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={false} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }}>
{/* 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能 */}
<CustomTab
topTab={topTab}
searchOperationItem={
<div>
{/* 操作按钮权限 */}
{showOperateBtn &&
<Button
type="primary"
style={{ marginRight: "10px" }}
onClick={() => {
if (selectedKey == "custom") {
handleCustomNewClick();
} else {
handleNewClick();
}
}}>
新建
</Button>}
<CustomTab
topTab={topTab}
searchOperationItem={
<div>
{/* 操作按钮权限 */}
{showOperateBtn &&
<Button
type="primary"
style={{ marginRight: "10px" }}
onClick={() => {
if (selectedKey == "custom") {
handleCustomNewClick();
} else {
handleNewClick();
}
}}>
新建
</Button>}
{selectedKey == "custom" &&
<WeaSelect
options={options}
value={customSelectkey}
style={{ width: "150px" }}
onChange={v => {
setCustomSelectkey(v);
getCustomCategoryList(v);
}}
/>}
</div>
{selectedKey == "custom" &&
<WeaSelect
options={options}
value={customSelectkey}
style={{ width: "150px" }}
onChange={v => {
setCustomSelectkey(v);
getCustomCategoryList(v);
}}
/>}
</div>
}
onChange={v => {
setSelectedKey(v);
handleSlideClose();
if (v == "custom") {
// 自定义福利
getCustomCategoryList();
} else {
getTableDatas(v);
}
onChange={v => {
setSelectedKey(v);
handleSlideClose();
if (v == "custom") {
// 自定义福利
getCustomCategoryList();
} else {
getTableDatas(v);
}
}}
}}
/>
{selectedKey == "custom"
? <TwoColContent
leftContent={
<WeaMobxTable // table内部做了loading加载处理页面就不需要再加了
comsWeaTableStore={tableStore} // table store
hasOrder={true} // 是否启用排序
needScroll={true} // 是否启用table内部列表滚动将自适应到父级高度
getColumns={this.getCustomColumns}
onOperatesClick={this.onCustomOperatesClick.bind(this)}
/>
}
rightContent={renderCustomRightContent()}
/>
{selectedKey == "custom"
? <TwoColContent
leftContent={
<WeaMobxTable // table内部做了loading加载处理页面就不需要再加了
comsWeaTableStore={tableStore} // table store
hasOrder={true} // 是否启用排序
needScroll={true} // 是否启用table内部列表滚动将自适应到父级高度
getColumns={this.getCustomColumns}
onOperatesClick={this.onCustomOperatesClick.bind(this)}
/>
}
rightContent={renderCustomRightContent()}
/>
: <CustomPaginationTable
loading={loading}
columns={this.getColumns(tableColumns)}
dataSource={tableDataSource}
total={toJS(tablePageInfo).total}
current={toJS(tablePageInfo).pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
const {
programmeStore: { form, getTableDatas, selectedKey }
} = this.props;
getTableDatas(selectedKey, this.pageInfo);
}}
/>}
</WeaTop>
</WeaRightMenu>
: <CustomPaginationTable
loading={loading}
columns={this.getColumns(tableColumns)}
dataSource={tableDataSource}
total={toJS(tablePageInfo).total}
current={toJS(tablePageInfo).pageNum}
pageSize={this.pageInfo.pageSize}
onPageChange={value => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
const {
programmeStore: { form, getTableDatas, selectedKey }
} = this.props;
getTableDatas(selectedKey, this.pageInfo);
}}
/>}
</WeaTop>
<WeaSlideModal
className="slideOuterWrapper"
visible={this.state.slideVisiable}

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, DatePicker, Dropdown, Menu, message, Modal } from "antd";
import { WeaRightMenu, WeaTop } from "ecCom";
import { WeaTop } from "ecCom";
import { renderNoright } from "../../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import Accountdialog from "./components/accountDialog";
import AbnormalDrawer from "./components/abnormalDrawer";
@ -439,109 +439,104 @@ export default class StandingBook extends React.Component {
return (
<div className="standingbookWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="社保福利台账" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
buttons={showOperateBtn ? rightBtns : []}
// showDropIcon={true} // 是否显示下拉按钮
// dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
// dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="社保福利台账" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
buttons={showOperateBtn ? rightBtns : []}
// showDropIcon={true} // 是否显示下拉按钮
// dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
// dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<div className="billDateWrapper">
<div>账单月份</div>
<MonthPicker
value={startTime}
format="YYYY-MM"
disabledDate={(current) => {
return current && endTime && current.getTime() > new Date(endTime).getTime();
}}
onChange={(val) => this.handleChangeMonth("startTime", val)}
/>
<span className="to"></span>
<MonthPicker
value={endTime}
format="YYYY-MM"
disabledDate={(current) => {
return current && startTime && current.getTime() < new Date(startTime).getTime();
}}
onChange={(val) => this.handleChangeMonth("endTime", val)}
/>
</div>
<CustomPaginationTable
<div className="billDateWrapper">
<div>账单月份</div>
<MonthPicker
value={startTime}
format="YYYY-MM"
disabledDate={(current) => {
return current && endTime && current.getTime() > new Date(endTime).getTime();
}}
onChange={(val) => this.handleChangeMonth("startTime", val)}
/>
<span className="to"></span>
<MonthPicker
value={endTime}
format="YYYY-MM"
disabledDate={(current) => {
return current && startTime && current.getTime() < new Date(startTime).getTime();
}}
onChange={(val) => this.handleChangeMonth("endTime", val)}
/>
</div>
<CustomPaginationTable
loading={loading}
columns={_.filter(columns, (it) => it.dataIndex !== "id").map(item => {
item.width = "150px";
if (item.dataIndex === "billMonth") item.fixed = "left";
if (item.dataIndex === "action") return { ...item };
return {
...item,
render: (text) => {
return <span className="tdEllipsis" title={text}>{text}</span>;
}
};
})}
dataSource={list}
total={total}
current={this.state.current}
pageSize={this.pageInfo.pageSize}
onPageChange={(value) => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleShowSizeChange(this.pageInfo);
}}
scroll={{ x: 2300 }}
/>
{dialogProps.visible && (
<Accountdialog
{...dialogProps}
onCancel={() => this.handleClose()}
onOk={this.handleOk}
loading={loading}
columns={_.filter(columns, (it) => it.dataIndex !== "id").map(item => {
item.width = "150px";
if (item.dataIndex === "billMonth") item.fixed = "left";
if (item.dataIndex === "action") return { ...item };
return {
...item,
render: (text) => {
return <span className="tdEllipsis" title={text}>{text}</span>;
/>
)}
{/*核算进度条*/}
{
this.state.progressVisible &&
<ProgressModal
visible={this.state.progressVisible}
onCancel={() => {
this.setState({ progressVisible: false, progress: 0 });
}}
progress={this.state.progress}
/>
}
{drawerProps.visible && (
<AbnormalDrawer
{...drawerProps}
onClose={() => {
this.setState({
drawerProps: {
...this.state.drawerProps,
title: "",
visible: false
}
};
})}
dataSource={list}
total={total}
current={this.state.current}
pageSize={this.pageInfo.pageSize}
});
}}
columns={abnormalColumns}
dataSource={this.state.dbnormalTableData.list}
total={this.state.dbnormalTableData.total}
onPageChange={(value) => {
this.handlePageChange(value);
}}
onShowSizeChange={(current, pageSize) => {
this.pageInfo = { current, pageSize };
this.handleShowSizeChange(this.pageInfo);
}}
scroll={{ x: 2300 }}
// onOk={this.handleOk}
loading={inspectLoading}
/>
{dialogProps.visible && (
<Accountdialog
{...dialogProps}
onCancel={() => this.handleClose()}
onOk={this.handleOk}
loading={loading}
/>
)}
{/*核算进度条*/}
{
this.state.progressVisible &&
<ProgressModal
visible={this.state.progressVisible}
onCancel={() => {
this.setState({ progressVisible: false, progress: 0 });
}}
progress={this.state.progress}
/>
}
{drawerProps.visible && (
<AbnormalDrawer
{...drawerProps}
onClose={() => {
this.setState({
drawerProps: {
...this.state.drawerProps,
title: "",
visible: false
}
});
}}
columns={abnormalColumns}
dataSource={this.state.dbnormalTableData.list}
total={this.state.dbnormalTableData.total}
onPageChange={(value) => {
this.handlePageChange(value);
}}
// onOk={this.handleOk}
loading={inspectLoading}
/>
)}
</WeaTop>
</WeaRightMenu>
)}
</WeaTop>
</div>
);
}

View File

@ -1,7 +1,7 @@
import React from "react";
import { inject, observer } from "mobx-react";
import { Button, Col, message, Modal, Row, Switch } from "antd";
import { WeaFormItem, WeaRightMenu, WeaSearchGroup, WeaTable, WeaTop, WeaInputSearch } from "ecCom";
import { WeaFormItem, WeaInputSearch, WeaSearchGroup, WeaTable, WeaTop } from "ecCom";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import EditModal from "./editModal";
import TipLabel from "../../components/TipLabel";
@ -14,7 +14,7 @@ export default class TaxAgent extends React.Component {
constructor(props) {
super(props);
this.state = {
name: '',
name: "",
editModalProps: {
title: "新增个税扣缴义务人",
visible: false,
@ -318,7 +318,7 @@ export default class TaxAgent extends React.Component {
style={{ width: 250 }}
placeholder="请输入个税扣缴义务人名称"
onChange={name => this.setState({ name })}
onSearch={() => getTaxAgentList({name})}
onSearch={() => getTaxAgentList({ name })}
/>
];
const renderTipsLabel = () => {
@ -399,59 +399,57 @@ export default class TaxAgent extends React.Component {
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu>
<WeaTop
title="个税扣缴义务人" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
buttons={btns}
showDropIcon={true}>
<Row
gutter={16}
style={{ overflow: "hidden", width: "100%", marginTop: 8 }}>
<Col sm={24} md={24} lg={18} xl={18}>
<div className="mySalaryTableWrapper">
{permission.isChief &&
<WeaSearchGroup title={"基础信息"} showGroup>
<WeaFormItem
label="启用分权"
labelCol={{ span: 4 }}
wrapperCol={{ span: 20 }}>
<Switch
checked={devolutionStatus === 1}
onChange={this.taxAgentBaseSave}
/>
</WeaFormItem>
</WeaSearchGroup>}
<WeaSearchGroup
title={
<div className="titleWrapper">
<div className="title">个税扣缴义务人</div>
{/* 总管理员开启新增功能 */}
{permission.isChief &&
<i
className="icon-coms-Add-to"
title="新增"
onClick={() => this.showEditModal()}
/>}
</div>
}
showGroup>
<WeaTable
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
/>
</WeaSearchGroup>
</div>
</Col>
<Col sm={24} md={24} lg={6} xl={6}>
{renderTipsLabel()}
</Col>
</Row>
</WeaTop>
</WeaRightMenu>
<WeaTop
title="个税扣缴义务人" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
buttons={btns}
showDropIcon={true}>
<Row
gutter={16}
style={{ overflow: "hidden", width: "100%", marginTop: 8 }}>
<Col sm={24} md={24} lg={18} xl={18}>
<div className="mySalaryTableWrapper">
{permission.isChief &&
<WeaSearchGroup title={"基础信息"} showGroup>
<WeaFormItem
label="启用分权"
labelCol={{ span: 4 }}
wrapperCol={{ span: 20 }}>
<Switch
checked={devolutionStatus === 1}
onChange={this.taxAgentBaseSave}
/>
</WeaFormItem>
</WeaSearchGroup>}
<WeaSearchGroup
title={
<div className="titleWrapper">
<div className="title">个税扣缴义务人</div>
{/* 总管理员开启新增功能 */}
{permission.isChief &&
<i
className="icon-coms-Add-to"
title="新增"
onClick={() => this.showEditModal()}
/>}
</div>
}
showGroup>
<WeaTable
columns={newColumns}
dataSource={dataSource}
pagination={pagination}
loading={loading}
/>
</WeaSearchGroup>
</div>
</Col>
<Col sm={24} md={24} lg={6} xl={6}>
{renderTipsLabel()}
</Col>
</Row>
</WeaTop>
{editModalProps.visible &&
<EditModal

View File

@ -1,25 +1,22 @@
import React from 'react';
import { inject, observer } from 'mobx-react';
import { toJS } from 'mobx';
import React from "react";
import { inject, observer } from "mobx-react";
import { toJS } from "mobx";
import { Button, Table, DatePicker, Modal } from 'antd';
import { Button, DatePicker, Modal } from "antd";
import { WeaTop, WeaTab, WeaRightMenu, WeaRangePicker, WeaInputSearch, WeaSlideModal } from 'ecCom';
import { WeaTableNew } from 'comsMobx';
import { renderNoright, getSearchs } from '../../util'; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from '../../components/customTab';
import ContentWrapper from '../../components/contentWrapper';
import { columns, dataSource } from './columns';
import { WeaInputSearch, WeaSlideModal, WeaTop } from "ecCom";
import { WeaTableNew } from "comsMobx";
import { renderNoright } from "../../util"; // 渲染form数据的方法因为多个页面都会使用所以抽的公共方法在util中
import CustomTab from "../../components/customTab";
import SlideModalTitle from "../../components/slideModalTitle";
import EditSlideContent from "./editSlideContent";
const WeaTable = WeaTableNew.WeaTable;
import SlideModalTitle from '../../components/slideModalTitle';
import EditSlideContent from './editSlideContent';
const { MonthPicker } = DatePicker;
@inject('taxRateStore')
@inject("taxRateStore")
@observer
export default class TaxRate extends React.Component {
constructor(props) {
@ -27,9 +24,9 @@ export default class TaxRate extends React.Component {
this.state = {
value: "",
selectedKey: "0",
currentOperate: "add",
editable: false,
}
currentOperate: "add",
editable: false
};
}
componentWillMount() { // 初始化渲染页面
@ -39,49 +36,49 @@ export default class TaxRate extends React.Component {
// 增加编辑功能重写columns绑定事件
getColumns = (columns) => {
let newColumns = '';
let newColumns = "";
newColumns = columns.map(column => {
let newColumn = column;
newColumn.render = (text, record, index) => { //前端元素转义
let valueSpan = record[newColumn.dataIndex + "span"] !== undefined ? record[newColumn.dataIndex + "span"] : record[newColumn.dataIndex];
switch(newColumn.dataIndex) {
switch (newColumn.dataIndex) {
case "name":
return <a onClick={() => {
this.onEdit(record, false)
}}
dangerouslySetInnerHTML={{ __html: valueSpan }} />
this.onEdit(record, false);
}}
dangerouslySetInnerHTML={{ __html: valueSpan }}/>;
default:
return <div dangerouslySetInnerHTML={{ __html: valueSpan }} />
return <div dangerouslySetInnerHTML={{ __html: valueSpan }}/>;
}
}
};
return newColumn;
});
return newColumns;
}
};
onEdit = (record, editable) => {
this.setState({currentOperate: "update", editable: editable})
const {taxRateStore: {setSlideVisiable, emptyForm, getItemInform }} = this.props;
this.setState({ currentOperate: "update", editable: editable });
const { taxRateStore: { setSlideVisiable, emptyForm, getItemInform } } = this.props;
emptyForm();
setSlideVisiable(true);
getItemInform(record.id)
}
getItemInform(record.id);
};
handleInsertBtnClick = () => {
const {taxRateStore: {setSlideVisiable, emptyForm, initDataSource }} = this.props;
const { taxRateStore: { setSlideVisiable, emptyForm, initDataSource } } = this.props;
this.setState({
currentOperate: "add",
editable: true
})
});
emptyForm();
initDataSource();
setSlideVisiable(true)
}
setSlideVisiable(true);
};
onOperatesClick = (record, index, operate, flag) => {
const {taxRateStore : {doDelete}} = this.props;
switch(operate.index.toString()){
case '0': // 编辑
const { taxRateStore: { doDelete } } = this.props;
switch (operate.index.toString()) {
case "0": // 编辑
this.onEdit(record, true);
break;
case "1": // 删除
@ -89,9 +86,10 @@ this.onEdit(record, false)
title: "信息确认",
content: "确定删除吗",
onOk() {
doDelete([record.id])
doDelete([record.id]);
},
onCancel() {}
onCancel() {
}
});
break;
}
@ -99,8 +97,18 @@ this.onEdit(record, false)
render() {
const { taxRateStore } = this.props;
const { loading, hasRight, form, condition, tableStore, showSearchAd, getTableDatas, doSearch, setShowSearchAd } = taxRateStore;
const { doSave, slideVisiable, setSlideVisiable, emptyForm, doUpdate, doBatchDelete } = taxRateStore
const {
loading,
hasRight,
form,
condition,
tableStore,
showSearchAd,
getTableDatas,
doSearch,
setShowSearchAd
} = taxRateStore;
const { doSave, slideVisiable, setSlideVisiable, emptyForm, doUpdate, doBatchDelete } = taxRateStore;
const selectedRowKeys = toJS(tableStore.selectedRowKeys) || []; // tableStore 右侧选中数组
if (!hasRight && !loading) { // 无权限处理
return renderNoright();
@ -108,104 +116,99 @@ this.onEdit(record, false)
const rightMenu = [// 右键菜单
{
key: 'BTN_DEL',
icon: <i className='icon-coms-delete'/>,
content : '批量删除',
key: "BTN_DEL",
icon: <i className="icon-coms-delete"/>,
content: "批量删除",
disable: selectedRowKeys.length === 0, // 没有选中禁用
onClick : doBatchDelete,
onClick: doBatchDelete
}
];
const collectParams = { // 收藏功能配置
favname: '个税税率表',
favname: "个税税率表",
favouritetype: 1,
objid: 0,
link: 'wui/index.html#/ns_demo03/index',
importantlevel: 1,
link: "wui/index.html#/ns_demo03/index",
importantlevel: 1
};
const adBtn = [ // 高级搜索内部按钮
<Button type="primary" onClick={doSearch}>搜索</Button>,
<Button type="ghost" onClick={() => form.resetForm()}>重置</Button>,
<Button type="ghost" onClick={() => setShowSearchAd(false)}>取消</Button>,
<Button type="ghost" onClick={() => setShowSearchAd(false)}>取消</Button>
];
const topTab = [
];
const topTab = [];
const renderSearchOperationItem = () => {
return <div>
<Button type="primary" onClick={() => {
this.handleInsertBtnClick()
}}>新建</Button>
{' '}
<Button type="primary" onClick={() => {
this.handleInsertBtnClick();
}}>新建</Button>
{" "}
<WeaInputSearch
placeholder={'请输入个税税率表名称'}
placeholder={"请输入个税税率表名称"}
onSearch={(name) => {
doSearch({name})
}}
/>
</div>
}
doSearch({ name });
}}
/>
</div>;
};
return (
<div className="mySalaryBenefitsWrapper">
<WeaRightMenu
datas={rightMenu} // 右键菜单
collectParams={collectParams} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
<WeaTop
title="个税税率表" // 文字
icon={<i className="icon-coms-fa"/>} // 左侧图标
iconBgcolor="#F14A2D" // 左侧图标背景色
showDropIcon={true} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<WeaTop
title="个税税率表" // 文字
icon={<i className="icon-coms-fa" />} // 左侧图标
iconBgcolor='#F14A2D' // 左侧图标背景色
showDropIcon={true} // 是否显示下拉按钮
dropMenuDatas={rightMenu} // 下拉菜单(和页面的右键菜单相同)
dropMenuProps={{ collectParams }} // 收藏功能: 配置之后显示 收藏、帮助、显示页面地址 这3个功能
>
<CustomTab topTab={topTab}
searchOperationItem={
renderSearchOperationItem()
}
onChange={(v) => {
this.setState({ selectedKey: v })
}}
/>
<WeaTable // table内部做了loading加载处理页面就不需要再加了
comsWeaTableStore={tableStore} // table store
hasOrder={true} // 是否启用排序
needScroll={true} // 是否启用table内部列表滚动将自适应到父级高度
getColumns={this.getColumns}
onOperatesClick={this.onOperatesClick.bind(this)}
/>
</WeaTop>
</WeaRightMenu>
<CustomTab topTab={topTab}
searchOperationItem={
renderSearchOperationItem()
}
onChange={(v) => {
this.setState({ selectedKey: v });
}}
/>
<WeaTable // table内部做了loading加载处理页面就不需要再加了
comsWeaTableStore={tableStore} // table store
hasOrder={true} // 是否启用排序
needScroll={true} // 是否启用table内部列表滚动将自适应到父级高度
getColumns={this.getColumns}
onOperatesClick={this.onOperatesClick.bind(this)}
/>
</WeaTop>
{
slideVisiable && <WeaSlideModal visible={slideVisiable}
top={0}
width={40}
height={100}
direction={'right'}
measure={'%'}
title={
<SlideModalTitle
subtitle={!this.state.editable ? "查看个税税率表" : this.state.currentOperate == "add" ? "新建个税税率表" : "编辑个税税率表" }
subTabs={[{title: "基础设置"}]}
onSave={() => {
this.state.currentOperate == "add" ? doSave() : doUpdate()
}}
editable={this.state.editable}
/>
}
content={(<EditSlideContent editable={this.state.editable}/>)}
onClose={() => setSlideVisiable(false)}
showMask={true}
closeMaskOnClick={() => setSlideVisiable(false)} />
slideVisiable &&
<WeaSlideModal
visible={slideVisiable}
top={0}
width={40}
height={100}
direction={"right"}
measure={"%"}
title={
<SlideModalTitle
subtitle={!this.state.editable ? "查看个税税率表" : this.state.currentOperate == "add" ? "新建个税税率表" : "编辑个税税率表"}
subTabs={[{ title: "基础设置" }]}
onSave={() => {
this.state.currentOperate == "add" ? doSave() : doUpdate();
}}
editable={this.state.editable}
/>
}
content={(<EditSlideContent editable={this.state.editable}/>)}
onClose={() => setSlideVisiable(false)}
showMask={true}
closeMaskOnClick={() => setSlideVisiable(false)}/>
}
</div>
)
);
}
}