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

产品-薪酬统计分析页面开发

This commit is contained in:
黎永顺 2023-05-15 18:21:23 +08:00
parent 13d21af0e4
commit 6c615453f7
5 changed files with 86 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
pc4mobx/hrmSalary/apis/statistics.js
View File

@ -58,6 +58,10 @@ export const reportStatisticsGetSearchCondition = (params) => {
export const queryRangeSetting = (params) => {
return WeaTools.callApi("/api/bs/hrmsalary/report/statistics/echarts/queryRangeSetting", "GET", params);
};
//分析图数据展示范围设置删除
export const deleteRangeSetting = (params) => {
return WeaTools.callApi("/api/bs/hrmsalary/report/statistics/echarts/deleteRangeSetting", "GET", params);
};
//分析图数据展示范围设置保存
export const saveRangeSetting = (params) => {
return postFetch("/api/bs/hrmsalary/report/statistics/echarts/saveRangeSetting", params);

82
pc4mobx/hrmSalary/pages/reportView/components/condition.js
View File

@ -1,4 +1,5 @@
import { WeaLocaleProvider } from "ecCom";
import { format_with_regex } from "../../../util";
const { getLabel } = WeaLocaleProvider;
export const condition = [
@ -151,6 +152,8 @@ export const condition = [
defaultshow: true
}
];
const colorList = ["#709DF7", "#73DEB3", "#7585A2", "#F7C739", "#5FC3E3", "#AEE279", "#FF7F81"];
export const mapBarOptions = (params) => ({
tooltip: {
trigger: "axis",
@ -167,7 +170,7 @@ export const mapBarOptions = (params) => ({
formatter: function (params) {
let str = params[0].axisValue + "<br>";
for (let item of params) {
str += item.seriesName + "<span style='display:inline-block;width: 50px'></span>" + item.value + "<br>";
str += `<div>${item.marker}${item.seriesName}<span style='display:inline-block;width: 10px'></span><span style='font-weight: bold'>${format_with_regex(item.value)}</span></div>`;
}
return str;
}
@ -184,8 +187,8 @@ export const mapBarOptions = (params) => ({
},
grid: {
top: "10%",
right: "8%",
left: "1%",
right: "0%",
left: "2%",
bottom: "0%",
containLabel: true
},
@ -234,20 +237,50 @@ export const mapBarOptions = (params) => ({
}
}
},
series: _.map(params.data, item => {
series: _.map(params.data, (item, index) => {
return {
name: item.name,
// barWidth: "32",
data: item.data,
barWidth: "32",
data: _.map(item.data, (it) => it.replace(/,/g, "")),
type: "bar",
itemStyle: {
// barBorderRadius: 12,
// color: '#21D1FD'
normal: {
color: function (params) {
return colorList[params.seriesIndex] || colorList[Math.floor((Math.random() * colorList.length))];
},
lineStyle: {
color: colorList[index] || colorList[Math.floor((Math.random() * colorList.length))]
}
}
},
label: {
show: true,
position: "inside",
color: "#333"
position: "insideBottom",
distance: 15,
align: "left",
verticalAlign: "middle",
rotate: "90",
formatter: function (params) {
if (parseInt(params.value) === 0) {
return `${format_with_regex(params.value)} ${params.seriesName}`;
} else {
return [
`{a|${format_with_regex(params.value)}} {b|${params.seriesName}}`
];
}
},
rich: {
a: {
fontWeight: "bold",
fontSize: 14,
color: "#333",
marginRight: 10
},
b: {
fontSize: 12,
color: "#333"
}
}
}
};
})
@ -327,11 +360,21 @@ export const mapLineOptions = (params) => ({
}
}
],
series: _.map(params.data, item => {
series: _.map(params.data, (item, index) => {
return {
name: item.name,
data: item.data,
type: "line"
data: _.map(item.data, (it) => it.replace(/,/g, "")),
type: "line",
itemStyle: {
normal: {
color: function (params) {
return colorList[params.seriesIndex] || colorList[Math.floor((Math.random() * colorList.length))];
},
lineStyle: {
color: colorList[index] || colorList[Math.floor((Math.random() * colorList.length))]
}
}
}
};
})
});
@ -340,7 +383,7 @@ export const mapPieOptions = (params) => ({
show: true,
formatter: function (params) {
let str = params.seriesName + "<br>";
str += params.marker + params.name + "<span style='display:inline-block;width: 50px'></span>" + params.value + "(" + params.percent + "%" + ")" + "<br>";
str += params.marker + params.name + ":" + format_with_regex(params.value) + "(" + params.percent + "%" + ")" + "<br>";
return str;
}
},
@ -358,11 +401,18 @@ export const mapPieOptions = (params) => ({
series: _.map(params.data, item => {
return {
name: item.name,
data: item.data,
data: _.map(item.data, (it) => ({ ...it, value: it.value.replace(/,/g, "") })),
type: "pie",
radius: "60%",
avoidLabelOverlap: false,
animation: false
animation: false,
itemStyle: {
normal: {
color: function (colors) {
return colorList[colors.dataIndex] || colorList[Math.floor((Math.random() * colorList.length))];
}
}
}
};
})
});

3
pc4mobx/hrmSalary/pages/reportView/components/reportContent.js
View File

@ -61,7 +61,7 @@ class ReportContent extends Component {
postMessageToChild = (payload) => {
const childFrameObj = document.getElementById("atdTable");
const { dataSource, columns, showSum, countResult } = payload;
childFrameObj.contentWindow.postMessage(JSON.stringify({
childFrameObj && childFrameObj.contentWindow.postMessage(JSON.stringify({
dataSource, columns, showSum, countResult
}), "*");
};
@ -173,6 +173,7 @@ class ReportContent extends Component {
}).catch(() => this.setState({ loading: false }));
};
handleChangeChartOpts = (chartsType, viewType) => {
this.setState({ chartsInfo: {} });
if (this.refs.chart && viewType !== "setting" && viewType !== "dataView" && !this.state.rangSet.visible) this.refs.chart.clear();
const { report: { id: reportId, dimensionId } } = this.props;
const { rangSet } = this.state;

2
pc4mobx/hrmSalary/pages/reportView/components/statisticalMicroSettingsSlide.js
View File

@ -24,6 +24,7 @@ import { Button, message, Modal } from "antd";
import { condition } from "./condition";
import { getSearchs } from "../../../util";
import {
deleteRangeSetting,
reportStatisticsGetSearchCondition,
reportStatisticsItemDelete,
reportStatisticsSaveSearchCondition,
@ -153,6 +154,7 @@ class StatisticalMicroSettingsSlide extends Component {
selectedRowKeys: []
}, () => {
this.statisticsItemList(this.props.id).then(r => {
deleteRangeSetting({ reportId: this.props.id });
});
});
} else {

12
pc4mobx/hrmSalary/util/index.js
View File

@ -93,3 +93,15 @@ export function calcPageNo(total, pageNo = 1, pageSize = 10, selectDelDataLen =
return pageNo;
}
//金额格式化
export const format_with_regex = (number) => {
return !(number + "").includes(".")
? // 就是说1-3位后面一定要匹配3位
(number + "").replace(/\d{1,3}(?=(\d{3})+$)/g, (match) => {
return match + ",";
})
: (number + "").replace(/\d{1,3}(?=(\d{3})+(\.))/g, (match) => {
return match + ",";
});
};