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

智能算薪-其他三个tab页的功能开发

This commit is contained in:
黎永顺 2023-08-30 10:34:16 +08:00
parent 6493e32314
commit 50c880d868
8 changed files with 343 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -33,3 +33,11 @@ export const apiflowStatisticsInfo = (params) => {
export const apiflowStatisticsList = (params) => {
return postFetch("/api/bs/hrmsalary/taxdeclaration/apiflow/statistics/list", params);
};
//智能算薪-流量不足提醒编辑或保存
export const apiflowWarnConfigSave = (params) => {
return postFetch("/api/bs/hrmsalary/taxdeclaration/apiflow/warn/config/save", params);
};
//智能算薪-流量不足提醒对象列表
export const apiflowWarnReceiverList = (params) => {
return WeaTools.callApi("/api/bs/hrmsalary/taxdeclaration/apiflow/warn/receiver/list", "GET", params);
};

39
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/constants.js
View File

@ -53,3 +53,42 @@ export const trafficUsageConditions = [
defaultshow: true
}
];
export const remindObjConditions = [
{
items: [
{
browserConditionParam: {
completeParams: {},
conditionDataParams: {},
dataParams: {},
destDataParams: {},
hasAddBtn: false,
hasAdvanceSerach: true,
idSeparator: ",",
isAutoComplete: 1,
isDetail: 0,
isMultCheckbox: false,
isSingle: true,
linkUrl: "",
pageSize: 10,
quickSearchName: "",
replaceDatas: [],
title: "",
type: "1",
viewAttr: 3,
rules: "required"
},
colSpan: 1,
conditionType: "BROWSER",
rules: "required|string",
domkey: ["adminUserIds"],
fieldcol: 12,
label: "提醒对象",
lanId: 111,
labelcol: 6,
viewAttr: 3
}
],
defaultshow: true
}
];

44
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/editBeRemindObjDialog.js Normal file
View File

@ -0,0 +1,44 @@
/*
* Author: 黎永顺
* name: 智能算薪-添加提醒对象
* Description:
* Date: 2023/8/29
*/
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaDialog, WeaLocaleProvider } from "ecCom";
import { Button } from "antd";
import { getSearchs } from "../../../util";
import { remindObjConditions } from "./constants";
const getLabel = WeaLocaleProvider.getLabel;
@inject("intelligentStore")
@observer
class EditBeRemindObjDialog extends Component {
componentWillReceiveProps(nextProps, nextContext) {
const { intelligentStore: { remindObjform } } = nextProps;
if (nextProps.visible !== this.props.visible && nextProps.visible) {
remindObjform.initFormFields(remindObjConditions);
}
if (nextProps.visible !== this.props.visible && !nextProps.visible) {
remindObjform.resetForm();
}
}
render() {
const { intelligentStore: { remindObjform } } = this.props;
return (
<WeaDialog
{...this.props} className="paymentDialog" initLoadCss
style={{ width: 550 }} buttons={[<Button type="primary">{getLabel(537558, "保存")}</Button>]}
>
<div className="paymentDialogContent">
{getSearchs(remindObjform, remindObjConditions, 1)}
</div>
</WeaDialog>
);
}
}
export default EditBeRemindObjDialog;

156
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/insufficientTrafficAlert.js
View File

@ -5,9 +5,18 @@
* Date: 2023/7/19
*/
import React, { Component } from "react";
import { WeaCheckbox, WeaFormItem, WeaHelpfulTip, WeaInputNumber, WeaLocaleProvider, WeaSearchGroup } from "ecCom";
import {
WeaButtonIcon,
WeaCheckbox,
WeaFormItem,
WeaInputNumber,
WeaLocaleProvider,
WeaSearchGroup,
WeaTable
} from "ecCom";
import { Modal } from "antd";
import { apiflowWarnConfigGetForm } from "../../../apis/intelligentCalculateSalarySettings";
import EditBeRemindObjDialog from "./editBeRemindObjDialog";
import { apiflowWarnConfigGetForm, apiflowWarnReceiverList } from "../../../apis/intelligentCalculateSalarySettings";
const getLabel = WeaLocaleProvider.getLabel;
@ -16,7 +25,14 @@ class InsufficientTrafficAlert extends Component {
super(props);
this.state = {
enable: "0",
remindEvent: { businessId: "", eventId: "", moduleId: "", id: "" }
remindEvent: { businessId: "", eventId: "", moduleId: "", id: "" },
threshold: null, channelList: [
{ label: "EMobile", type: "IM", channel: "1", value: "1", config: {} },
{ label: "邮件", type: "email", channel: "3", value: "1", config: {} },
{ label: "短信", type: "message", channel: "4", value: "1", config: {} }
], columns: [], dataSource: [],
pageInfo: { current: 1, pageSize: 10, total: 0 },
loading: false, remindObjDialog: { visible: false, title: "" }
};
}
@ -28,22 +44,39 @@ class InsufficientTrafficAlert extends Component {
const { remindEvent } = this.state;
apiflowWarnConfigGetForm().then(({ status, data }) => {
if (status) {
const { enable, businessId, eventId, moduleId, id } = data;
const { enable, businessId, eventId, moduleId, id, threshold } = data;
this.setState({
enable: enable ? "1" : "0",
remindEvent: { ...remindEvent, businessId, eventId, moduleId, id }
remindEvent: { ...remindEvent, businessId, eventId, moduleId, id },
threshold
}, () => {
this.state.enable === "1" && this.apiflowWarnReceiverList();
});
}
});
};
apiflowWarnReceiverList = () => {
const { pageInfo, remindEvent } = this.state;
const { id } = remindEvent;
const payload = {
warnConfigId: id || this.props.warnConfigId,
...pageInfo
};
apiflowWarnReceiverList(payload).then(({ status, data }) => {
if (status) {
console.log(data);
}
});
};
handleEnale = (enable) => {
if (enable === "1") {
this.setState({ enable });
this.setState({ enable }, () => this.apiflowWarnReceiverList());
} else {
Modal.confirm({
title: getLabel(131329, "信息确认"),
content: getLabel(111, "确认关闭提醒吗？关闭并保存后，流量不足时将无法及时提醒。"),
onOk: () => {
this.setState({ enable });
},
onCancel: () => {
this.setState({ enable: this.state.enable });
@ -51,9 +84,39 @@ class InsufficientTrafficAlert extends Component {
});
}
};
handleChangeChannel = (o) => {
const { channelList } = this.state;
this.setState({
channelList: _.map(channelList, item => {
if (item.type === o.type) {
return { ...item, ...o };
}
return { ...item };
})
});
};
render() {
const { enable } = this.state;
const { enable, channelList, threshold, pageInfo, loading, columns, dataSource, remindObjDialog } = this.state;
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 }
}, () => {
});
},
onChange: current => {
this.setState({
pageInfo: { ...pageInfo, current }
}, () => {
});
}
};
return (
<WeaSearchGroup showGroup needTigger={false} className="insufficientAlertWrapper">
<WeaFormItem label={getLabel(501480, "提醒")} labelCol={{ span: 4 }} wrapperCol={{ span: 20 }}>
@ -66,23 +129,55 @@ class InsufficientTrafficAlert extends Component {
label={getLabel(544288, "提醒规则")}
labelCol={{ span: 4 }} wrapperCol={{ span: 20 }}
>
<ReminderRules/>
</WeaFormItem>
<WeaFormItem
label={getLabel(544287, "提醒推送方式")}
labelCol={{ span: 4 }} wrapperCol={{ span: 20 }}
>
<WeaCheckbox display="switch"/>
<WeaHelpfulTip
width={200} style={{ marginLeft: 10 }}
title={getLabel(544286, "使用云桥之前，请先确认企业微信是否绑定云桥。\n" +
"使用邮箱之前，请先确认是否设置邮件提醒账号。\n" +
"使用短信之前，请先确认是否新建签名。")}
placement="topLeft"
/>
<ReminderRules value={threshold} onChange={o => this.setState({ threshold: o })}/>
</WeaFormItem>
{/*<WeaFormItem*/}
{/* colon={false} labelCol={{ span: 4 }} wrapperCol={{ span: 20 }}*/}
{/* label={*/}
{/* <div className="flex items-center">*/}
{/* <span>{getLabel(544287, "提醒推送方式")}:</span>*/}
{/* <WeaHelpfulTip*/}
{/* width={200} style={{ marginLeft: 10 }}*/}
{/* title={getLabel(111, "使用邮箱之前，请先确认是否设置邮件提醒账号。\n" + "使用短信之前，请先确认是否新建签名。")}*/}
{/* placement="topLeft"*/}
{/* />*/}
{/* </div>*/}
{/* }*/}
{/*>*/}
{/* <Pushmethod channelList={channelList} onChange={this.handleChangeChannel}/>*/}
{/*</WeaFormItem>*/}
</React.Fragment>
}
{
enable === "1" &&
<div className="table">
<div className="title flex items-center">
<span className="titleLeft">{getLabel(111, "提醒对象设置")}</span>
<WeaButtonIcon
buttonType="add" type="primary"
onClick={() => this.setState({
remindObjDialog: {
...remindObjDialog, visible: true, title: getLabel(111, "添加提醒对象")
}
})}
/>
{/* 添加提醒对象*/}
<EditBeRemindObjDialog
{...remindObjDialog}
onCancel={() => this.setState({
remindObjDialog: {
...remindObjDialog, visible: false, title: ""
}
})}
/>
</div>
<WeaTable
columns={columns} dataSource={dataSource}
pagination={pagination} loading={loading}
scroll={{ y: `calc(100vh - 226px)` }}
/>
</div>
}
</WeaSearchGroup>
);
}
@ -96,7 +191,7 @@ const ReminderRules = (props) => {
return (
<div className="threshold">
<span className="before">{getLabel(111, "流量不足")}</span>
<WeaInputNumber value={value} onChange={onChange} style={{ width: 180 }}/>
<WeaInputNumber value={value} onChange={onChange} style={{ width: 180 }} viewAttr={3} precision={3}/>
<span className="after">{getLabel(111, "时提醒")}</span>
<span
className="tip">{getLabel(111, "为确保智能算薪正常使用，设置建议:若每个月消耗流量10,000，则不足10,000时提醒，以此预留一个月时间续流量")}</span>
@ -104,4 +199,21 @@ const ReminderRules = (props) => {
);
};
const Pushmethod = (props) => {
const { onChange, channelList } = props;
return <div className="channel-list">
{
_.map(channelList, item => {
const { label, type, value } = item;
return (
<div className="channel-item">
<WeaCheckbox value={value} content={label} onChange={o => onChange({ ...item, value: o })}/>
{(type !== "email" && value === "1") && <i className="icon-coms-Flow-setting"/>}
</div>
);
})
}
</div>;
};

33
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/interfaceFlowStatistics.js
View File

@ -5,7 +5,7 @@
* Date: 2023/8/29
*/
import React, { Component } from "react";
import { Button, message } from "antd";
import { Button, message, Spin } from "antd";
import { WeaLocaleProvider, WeaTable } from "ecCom";
import { apiflowStatisticsInfo, apiflowStatisticsList } from "../../../apis/intelligentCalculateSalarySettings";
@ -91,6 +91,9 @@ class InterfaceFlowStatistics extends Component {
}
}).catch(() => this.setState({ loading: false }));
};
handleExport = () => {
window.open(`${window.ecologyContentPath || ""}/api/bs/hrmsalary/taxdeclaration/apiflow/statistics/export`, "_blank");
};
render() {
const { statisticsInfo, pageInfo, loading, dataSource, columns } = this.state;
@ -133,19 +136,23 @@ class InterfaceFlowStatistics extends Component {
<div className="detail-area">
<div className="title">
<div className="text">{getLabel(111, "使用明细")}</div>
<Button type="primary">{getLabel(81272, "导出全部")}</Button>
<Button type="primary" onClick={this.handleExport}>{getLabel(81272, "导出全部")}</Button>
</div>
<WeaTable
dataSource={dataSource} pagination={pagination} loading={loading}
columns={[
...columns,
{
title: getLabel(30585, "操作"), dataIndex: "operate",
render: () => (<a href="">{getLabel(111, "月统计详情")}</a>)
}
]}
scroll={{ y: `calc(100vh - 190px)` }}
/>
{
loading ? <div className="loading-layout">
<Spin spinning={loading}/>
</div> : <WeaTable
dataSource={dataSource} pagination={pagination} loading={loading}
columns={[
...columns,
{
title: getLabel(30585, "操作"), dataIndex: "operate",
render: () => (<a href="">{getLabel(111, "月统计详情")}</a>)
}
]}
scroll={{ y: `calc(100vh - 190px)` }}
/>
}
</div>
</div>
);

60
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.js
View File

@ -1,11 +1,14 @@
import React, { Component } from "react";
import { inject, observer } from "mobx-react";
import { WeaLocaleProvider, WeaReqTop } from "ecCom";
import { Button } from "antd";
import { Button, message, Modal } from "antd";
import EnableSettings from "./components/enableSettings";
import InsufficientTrafficAlert from "./components/insufficientTrafficAlert";
import TrafficUsageRecords from "./components/trafficUsageRecords";
import InterfaceFlowStatistics from "./components/interfaceFlowStatistics";
import { apiflowWarnConfigSave } from "../../apis/intelligentCalculateSalarySettings";
import "./index.less";
import { convertToUrlString } from "../../util/url";
const getLabel = WeaLocaleProvider.getLabel;
const tabs = [
@ -15,16 +18,55 @@ const tabs = [
{ key: "TRAFFIC_USAGE_RECORD", title: getLabel(111, "流量使用记录") }
];
@inject("intelligentStore")
@observer
class Index extends Component {
constructor(props) {
super(props);
this.state = {
selectedKey: "ENABLE_SETTINGS", lastUpdateTime: ""
selectedKey: "ENABLE_SETTINGS", lastUpdateTime: "",
loading: false, warnConfigId: ""
};
this.alertRef = null;
}
/*
* Author: 黎永顺
* Description:流量不足提醒 - 基础信息保存
* Params:
* Date: 2023/8/29
*/
saveItaBaseInfo = () => {
const { channelList, enable, threshold, remindEvent } = this.alertRef.state;
const validateError = (enable === "1") && (_.every(channelList, o => o.channel !== "1") || _.isNil(threshold));
if (validateError) {
Modal.warning({
title: getLabel(131329, "信息确认"),
content: getLabel(518702, "必要信息不完整，红色*为必填项！")
});
return;
}
const { businessId, id } = remindEvent;
const config = _.map(_.filter(channelList, p => p.value === "1"), o => ({ channel: o.channel, config: o.config }));
const payload = {
id, businessId, threshold,
enable: enable === "1",
config: JSON.stringify(config)
};
this.setState({ loading: true });
apiflowWarnConfigSave(payload).then(({ status, data, errormsg }) => {
this.setState({ loading: false });
if (status) {
message.success(getLabel(22619, "保存成功！"));
this.setState({ warnConfigId: data });
payload.enable && this.alertRef.apiflowWarnReceiverList();
} else {
message.error(errormsg);
}
}).catch(() => this.setState({ loading: false }));
};
renderChildren = () => {
const { selectedKey } = this.state;
const { selectedKey, warnConfigId } = this.state;
let CurrentDom = null;
switch (selectedKey) {
case "ENABLE_SETTINGS":
@ -35,7 +77,7 @@ class Index extends Component {
<InterfaceFlowStatistics updateTime={(data) => this.setState({ lastUpdateTime: data.lastUpdateTime })}/>;
break;
case "INSUFFICIENT_TRAFFIC_ALERT":
CurrentDom = <InsufficientTrafficAlert/>;
CurrentDom = <InsufficientTrafficAlert ref={dom => this.alertRef = dom} warnConfigId={warnConfigId}/>;
break;
case "TRAFFIC_USAGE_RECORD":
CurrentDom = <TrafficUsageRecords/>;
@ -46,13 +88,17 @@ class Index extends Component {
}
return CurrentDom;
};
handleExport = () => {
const { intelligentStore: { form } } = this.props;
window.open(`${window.ecologyContentPath || ""}/api/bs/hrmsalary/taxdeclaration/apiflow/record/export?${convertToUrlString(form.getFormParams())}`, "_blank");
};
render() {
const { selectedKey, lastUpdateTime } = this.state;
const { selectedKey, lastUpdateTime, loading } = this.state;
const buttons = selectedKey === "INSUFFICIENT_TRAFFIC_ALERT" ?
[<Button type="primary">{getLabel(537558, "保存")}</Button>] :
[<Button type="primary" onClick={this.saveItaBaseInfo} loading={loading}>{getLabel(537558, "保存")}</Button>] :
selectedKey === "TRAFFIC_USAGE_RECORD" ?
[<Button type="primary">{getLabel(17416, "导出")}</Button>] :
[<Button type="primary" onClick={this.handleExport}>{getLabel(17416, "导出")}</Button>] :
selectedKey === "INTERFACE_FLOW_STATISTICS" ? [
<span className="statistic-time">
<span className="label">{getLabel(111, "最后统计时间：")}</span>

45
pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.less
View File

@ -60,6 +60,14 @@
border: 1px solid #f2f2f2;
border-bottom: none;
.flex {
display: flex;
}
.items-center {
align-items: center;
}
.wea-content {
padding: 0;
@ -78,7 +86,7 @@
}
.after {
margin-left: 6px;
margin-left: 16px;
margin-right: 16px;
}
@ -88,6 +96,41 @@
padding: 6px 0;
}
}
.channel-list {
display: flex;
align-items: center;
& > .channel-item:not(:first-child) {
margin-left: 16px;
}
.channel-item {
display: inline-flex;
align-items: center;
min-height: 30px;
}
.icon-coms-Flow-setting {
font-size: 16px;
cursor: pointer;
margin-top: 5px;
}
}
.table {
.title {
height: 40px;
justify-content: space-between;
background: #f6f6f6;
.titleLeft {
font-size: 14px;
color: #111;
padding: 0;
}
}
}
}
.trafficUsageRecords-layout {

1
pc4mobx/hrmSalary/stores/intelligent.js
View File

@ -5,6 +5,7 @@ const { TableStore } = WeaTableNew;
export class IntelligentStore {
@observable form = new WeaForm(); //流量使用记录查询form实例
@observable remindObjform = new WeaForm(); //流量使用记录查询form实例
@observable tableStore = new TableStore();
@action("...")