{
+ const { onChange, value } = props;
+ return (
+
+ {getLabel(111, "流量不足")}
+
+ {getLabel(111, "时提醒")}
+ {getLabel(111, "为确保智能算薪正常使用，设置建议:若每个月消耗流量10,000，则不足10,000时提醒，以此预留一个月时间续流量")}
+
+ );
+};
+
+
diff --git a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/interfaceFlowStatistics.js b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/interfaceFlowStatistics.js
index 71366383..9c0a5edd 100644
--- a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/interfaceFlowStatistics.js
+++ b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/interfaceFlowStatistics.js
@@ -5,7 +5,11 @@
* Date: 2023/8/29
*/
import React, { Component } from "react";
-import { apiflowStatisticsInfo } from "../../../apis/intelligentCalculateSalarySettings";
+import { Button, message } from "antd";
+import { WeaLocaleProvider, WeaTable } from "ecCom";
+import { apiflowStatisticsInfo, apiflowStatisticsList } from "../../../apis/intelligentCalculateSalarySettings";
+
+const getLabel = WeaLocaleProvider.getLabel;
class InterfaceFlowStatistics extends Component {
constructor(props) {
@@ -15,21 +19,28 @@ class InterfaceFlowStatistics extends Component {
lastUpdateTime: "",
staticData: [
{
- key: "total", label: "购买接口总流量", value: "", icon: require("../../../common/purchased.png")
+ key: "total",
+ label: getLabel(111, "购买接口总流量"),
+ value: "",
+ icon: require("../../../common/purchased.png")
},
{
- key: "remain", label: "剩余总流量", value: "", icon: require("../../../common/remaining.png")
+ key: "remain", label: getLabel(111, "剩余总流量"), value: "", icon: require("../../../common/remaining.png")
},
{
- key: "used", label: "已使用总流量", value: "", icon: require("../../../common/traffic.png")
+ key: "used", label: getLabel(111, "已使用总流量"), value: "", icon: require("../../../common/traffic.png")
}
]
- }
+ },
+ columns: [], dataSource: [],
+ pageInfo: { current: 1, pageSize: 10, total: 0 },
+ loading: false
};
}
componentDidMount() {
this.apiflowStatisticsInfo();
+ this.apiflowStatisticsList();
}
apiflowStatisticsInfo = () => {
@@ -50,11 +61,57 @@ class InterfaceFlowStatistics extends Component {
}
});
};
+ apiflowStatisticsList = () => {
+ const { pageInfo } = this.state;
+ const payload = { ...pageInfo };
+ this.setState({ loading: true });
+ apiflowStatisticsList(payload).then(({ status, data, errormsg }) => {
+ this.setState({ loading: false });
+ if (status) {
+ const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
+ this.setState({
+ dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
+ columns: _.map(columns, item => {
+ const { dataIndex } = item;
+ let width = "";
+ switch (dataIndex) {
+ case "taxAgentName":
+ case "used":
+ width = "40%";
+ break;
+ default:
+ width = "10%";
+ break;
+ }
+ return { ...item, width };
+ })
+ });
+ } else {
+ message.error(errormsg);
+ }
+ }).catch(() => this.setState({ loading: false }));
+ };
render() {
- const { statisticsInfo } = this.state;
+ const { statisticsInfo, pageInfo, loading, dataSource, columns } = this.state;
const { staticData } = statisticsInfo;
-
+ const pagination = {
+ ...pageInfo,
+ showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
+ showQuickJumper: true,
+ showSizeChanger: true,
+ pageSizeOptions: ["10", "20", "50", "100"],
+ onShowSizeChange: (current, pageSize) => {
+ this.setState({
+ pageInfo: { ...pageInfo, current, pageSize }
+ }, () => this.apiflowStatisticsList());
+ },
+ onChange: current => {
+ this.setState({
+ pageInfo: { ...pageInfo, current }
+ }, () => this.apiflowStatisticsList());
+ }
+ };
return (
@@ -73,7 +130,23 @@ class InterfaceFlowStatistics extends Component {
})
}
-
+
+
+
{getLabel(111, "使用明细")}
+
+
+
({getLabel(111, "月统计详情")})
+ }
+ ]}
+ scroll={{ y: `calc(100vh - 190px)` }}
+ />
+
);
}
diff --git a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/trafficUsageRecords.js b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/trafficUsageRecords.js
index 27678e84..6ea92377 100644
--- a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/trafficUsageRecords.js
+++ b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/components/trafficUsageRecords.js
@@ -72,14 +72,37 @@ class TrafficUsageRecords extends Component {
apiflowRecordList(payload).then(({ status, data }) => {
this.setState({ loading: false });
if (status) {
- console.log(data);
+ const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
+ this.setState({
+ dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
+ columns: _.map(columns, item => {
+ const { dataIndex } = item;
+ let width = "";
+ switch (dataIndex) {
+ case "indexNum":
+ case "taxAgentName":
+ case "employeeName":
+ case "businessTypeName":
+ case "creator":
+ case "result":
+ width = "10%";
+ break;
+ case "idCardNo":
+ width = "20%";
+ break;
+ default:
+ break;
+ }
+ return { ...item, width };
+ })
+ });
}
}).catch(() => this.setState({ loading: false }));
};
render() {
const { intelligentStore: { form } } = this.props;
- const { conditions, loading, pageInfo } = this.state;
+ const { conditions, loading, pageInfo, dataSource, columns } = this.state;
const pagination = {
...pageInfo,
showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
@@ -101,9 +124,9 @@ class TrafficUsageRecords extends Component {
{getSearchs(form, conditions, 4, false, this.apiflowRecordList)}
);
diff --git a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.less b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.less
index b29fee75..6fff3639 100644
--- a/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.less
+++ b/pc4mobx/hrmSalary/pages/intelligentCalculateSalarySettings/index.less
@@ -68,6 +68,26 @@
border-bottom: 1px solid #f2f2f2;
}
}
+
+ .threshold {
+ display: flex;
+ align-items: center;
+
+ .before {
+ margin-right: 6px;
+ }
+
+ .after {
+ margin-left: 6px;
+ margin-right: 16px;
+ }
+
+ .tip {
+ display: inline-block;
+ color: #999;
+ padding: 6px 0;
+ }
+ }
}
.trafficUsageRecords-layout {
@@ -120,6 +140,11 @@
flex-direction: column;
justify-content: center;
+ .data {
+ color: #111;
+ font-size: 14px;
+ }
+
.title {
margin-top: 8px;
color: #999;
@@ -128,4 +153,20 @@
}
}
}
+
+ .detail-area {
+ margin-top: 8px;
+
+ .title {
+ height: 40px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .text {
+ font-size: 14px;
+ color: #111;
+ }
+ }
+ }
}