数据:您可以在下图中看到:
我想这样显示此数据:(在特定月份内有多少个电话)
Name Jan Feb March April May
Staff 0 1 1 0 0
Account 0 0 1 0 3
而且我想在所有月份中都这样做。
对于图,我编写了这样的函数:(但我也尝试对表使用相同的逻辑,但这似乎不起作用。)
任何人都可以帮助我如何在表格中执行相同的操作
getGraphData2( data,config) {
var year = new Date().getUTCFullYear()-1;
var month = new Date().getMonth()+10;
var fullMonths = config.Filter.filter(f => f.type === "Monthly");
var monthsThisYear = config.Filter.filter(f => f.type === "Monthly" && f.key <= month && f.key > (month - 12));
var monthsLastYear = config.Filter.filter(f => f.type === "Monthly" && f.key > (12 - (12 - monthsThisYear.length)));
var months = [];
months.push(...monthsThisYear);
months.push(...monthsLastYear);
var labels = months.map(m => m.value);
var targetTypes = this.state.resultsGraph.map(m => ({Name: m.Name}));
var fData = {};
targetTypes.forEach(f => {
fData[f.Name] = { label: f.Name, data: fullMonths.map(m => 0) };
});
if (this.state.results !== null) {
for (var c = 0; c < this.state.resultsGraph.length; c++) {
var call = this.state.resultsGraph[c];
if (call !== undefined && call !== null) {
var cDate = new Date(call.Call_Date_vod__c); //ConvertToDate(call.call_Date_vod__c);
if (cDate != null && ((cDate.getMonth() + 1) <= month && cDate.getFullYear() === year) || (month < (cDate.getMonth() + 1) && cDate.getFullYear() === (year - 1))) {
var targetType = call.Name;
if (targetType !== undefined && targetType !== null) {
var actData = fData[targetType];
if (actData !== undefined && actData !== null)
actData.data[cDate.getMonth()] = actData.data[cDate.getMonth()] + 1;
else {
actData = fData["NoTarget"];
actData.data[cDate.getMonth()] = actData.data[cDate.getMonth()] + 1;
}
}
else {
var actData = fData["NoTarget"];
actData.data[cDate.getMonth()] = actData.data[cDate.getMonth()] + 1;
}
}
}
}
}
fData = Object.keys(fData).map(k => fData[k]);
fData = fData.filter(f => f.data.filter(d => d > 0).length > 0);
for (var i = 0; i < fData.length; i++) {
var fdat = fData[i];
var data = fdat.data;
fdat.data = months.map(m => data[(m.key - 1)]);
}
var ds = fData.map((m, index) => ({
label: m.label,
data: m.data,
stack: "stack1",
backgroundColor: labels.map(l => (this.props.selectGraphFilter === l) ? getCanvasPattern(config.BackgroundColor[index]) : config.BackgroundColor[index]),
hoverBackgroundColor: labels.map(l => (this.props.selectGraphFilter === l) ? getCanvasPattern(config.HoverBackgroundColor[index]) : config.HoverBackgroundColor[index]),
}));
var graphData = {
labels: labels,
datasets: ds,
};
return graphData;
}
const data = this.state.resultsGraph.reduce(
(actData, call) => {
if (actData) {
actData[call.Name][
`${call.Call_Date_vod__c.getMonth()} ${call.Call_Date_vod__c.getFullYear()}`
] =
(actData[call.Name][
`${call.Call_Date_vod__c.getMonth()} ${call.Call_Date_vod__c.getFullYear()}`
] || 0) + call.Call;
}
return actData;
},
{
Staff: {},
Account: {}
}
);