Skip to content
Snippets Groups Projects
Commit 572cde47 authored by Bjarke Madsen's avatar Bjarke Madsen
Browse files

Fix the API call for budget data

parent 5baaa4ee
Branches
Tags
No related merge requests found
Hide whitespace changes
Inline Side-by-side
compendium_v2/routes/budget.py
+ 3
− 3
View file @ 572cde47
...@@ -97,6 +97,6 @@ def budget_view() -> Any: ...@@ -97,6 +97,6 @@ def budget_view() -> Any:
with db.session_scope() as session: with db.session_scope() as session:
entries = sorted([_extract_data(entry) entries = sorted([_extract_data(entry)
for entry in session.query(model.BudgetEntry)], key=lambda d: (d['BUDGET_YEAR'], d['NREN'])) for entry in session.query(model.BudgetEntry)],
dict_obj = {"data": entries} key=lambda d: (d['BUDGET_YEAR'], d['NREN']))
return jsonify(dict_obj) return jsonify(entries)
webapp/src/Schema.tsx
+ 28
− 30
View file @ 572cde47
...@@ -7,11 +7,11 @@ export interface ServiceMatrix { ...@@ -7,11 +7,11 @@ export interface ServiceMatrix {
export interface Nren { export interface Nren {
name: string name: string
nren_id:number nren_id: number
tags: string[] tags: string[]
} }
export interface BudgetMatrix{ export interface BudgetMatrix {
data: { data: {
labels: string[], labels: string[],
datasets: { datasets: {
...@@ -20,19 +20,17 @@ export interface BudgetMatrix{ ...@@ -20,19 +20,17 @@ export interface BudgetMatrix{
backgroundColor: string backgroundColor: string
}[] }[]
}, },
description : string, description: string,
id: string, id: string,
settings: Record<string, unknown>, settings: Record<string, unknown>,
title:string title: string
} }
export interface Budget{ export interface Budget {
data: { BUDGET: string,
BUDGET: string, BUDGET_YEAR: number,
BUDGET_YEAR: number, NREN: string,
NREN: string, id: number
id: number
}[]
} }
...@@ -48,24 +46,24 @@ export interface DataEntrySection { ...@@ -48,24 +46,24 @@ export interface DataEntrySection {
export interface Service { export interface Service {
compendium_id: number, compendium_id: number,
country_code:string, country_code: string,
country_name:string, country_name: string,
created_at:Date, created_at: Date,
id:number, id: number,
identifier:string, identifier: string,
kpi: string[], kpi: string[],
nren_abbreviation:string nren_abbreviation: string
nren_id:number, nren_id: number,
public:boolean, public: boolean,
question_id:number, question_id: number,
question_style:string, question_style: string,
response_id:number, response_id: number,
short:string, short: string,
status:number, status: number,
tags:string[], tags: string[],
title:string, title: string,
title_detailed:string, title_detailed: string,
updated_at:Date, updated_at: Date,
url:string, url: string,
value:string value: string
} }
webapp/src/pages/DataAnalysis.tsx
+ 61
− 63
View file @ 572cde47
import React, {ReactElement, useEffect, useState} from 'react'; import React, { ReactElement, useEffect, useState } from 'react';
import {Accordion, Col, Container, ListGroup, Row} from "react-bootstrap"; import { Accordion, Col, Container, ListGroup, Row } from "react-bootstrap";
import BarGraph from "../components/graphing/BarGraph"; import BarGraph from "../components/graphing/BarGraph";
import LineGraph from "../components/graphing/LineGraph"; import LineGraph from "../components/graphing/LineGraph";
import {BudgetMatrix, DataEntrySection,Budget} from "../Schema"; import { BudgetMatrix, DataEntrySection, Budget } from "../Schema";
// import {evaluateInteractionItems} from "chart.js/dist/core/core.interaction"; // import {evaluateInteractionItems} from "chart.js/dist/core/core.interaction";
import barGraph from "../components/graphing/BarGraph"; import barGraph from "../components/graphing/BarGraph";
...@@ -37,45 +37,45 @@ function DataAnalysis(): ReactElement { ...@@ -37,45 +37,45 @@ function DataAnalysis(): ReactElement {
}) })
} }
const [budgetMatrixResponse, setBudgetMatrixResponse] = useState<BudgetMatrix>(); const [budgetMatrixResponse, setBudgetMatrixResponse] = useState<BudgetMatrix>();
const [budgetResponse, setBudget] = useState<Budget>(); const [budgetResponse, setBudget] = useState<Budget[]>();
const [dataEntrySection, setDataEntrySection] = useState<DataEntrySection>(); const [dataEntrySection, setDataEntrySection] = useState<DataEntrySection>();
const [selectedDataEntry, setSelectedDataEntry] = useState<number>(0); const [selectedDataEntry, setSelectedDataEntry] = useState<number>(0);
useEffect(() => { useEffect(() => {
// let timeoutRef = 0; // let timeoutRef = 0;
const getDataEntries = () => { const getDataEntries = () => {
const dataEntrySectionResponse: DataEntrySection={ const dataEntrySectionResponse: DataEntrySection = {
description:"Org", description: "Org",
items:[ items: [
{ {
id:2, id: 2,
title:"NREN Budgets per year, in Millions EUR", title: "NREN Budgets per year, in Millions EUR",
url:"/api/data-entries/item/2" url: "/api/data-entries/item/2"
} }
// { // {
// id:3, // id:3,
// title:"NREN Budgets per NREN, in Millions EUR", // title:"NREN Budgets per NREN, in Millions EUR",
// url:"/api/data-entries/item/3" // url:"/api/data-entries/item/3"
// } // }
], ],
name:"Organisation" name: "Organisation"
} }
setDataEntrySection(dataEntrySectionResponse); setDataEntrySection(dataEntrySectionResponse);
console.log("getDataEntries "+dataEntrySection); console.log("getDataEntries " + dataEntrySection);
// Autoload the first graph // Autoload the first graph
if (dataEntrySectionResponse.items.length > 0) { if (dataEntrySectionResponse.items.length > 0) {
setSelectedDataEntry(dataEntrySectionResponse.items[0].id); setSelectedDataEntry(dataEntrySectionResponse.items[0].id);
} }
} }
const loadData = () => { const loadData = () => {
console.log("selectedDataEntry "+selectedDataEntry) console.log("selectedDataEntry " + selectedDataEntry)
if (selectedDataEntry == 0) { if (selectedDataEntry == 0) {
getDataEntries(); getDataEntries();
return; return;
} }
console.log("budgetResponse "+budgetResponse) console.log("budgetResponse " + budgetResponse)
if(budgetResponse==undefined) { if (budgetResponse == undefined) {
api<Budget>('/api/budget', { api<Budget[]>('/api/budget', {
referrerPolicy: "unsafe-url", referrerPolicy: "unsafe-url",
headers: { headers: {
"Access-Control-Allow-Origin": "*", "Access-Control-Allow-Origin": "*",
...@@ -85,17 +85,17 @@ function DataAnalysis(): ReactElement { ...@@ -85,17 +85,17 @@ function DataAnalysis(): ReactElement {
} }
}) })
.then((budget: Budget) => { .then((budget: Budget[]) => {
if (selectedDataEntry == 2) if (selectedDataEntry == 2)
options.plugins.title.text = 'NREN Budgets per year, in Millions EUR'; options.plugins.title.text = 'NREN Budgets per year, in Millions EUR';
setBudget(budget) setBudget(budget)
console.log("API positive response Budget : "+ budget) console.log("API positive response Budget : " + budget)
convertToBudgetPerYearDataResponse(budget) convertToBudgetPerYearDataResponse(budget)
}) })
.catch(error => { .catch(error => {
console.log(`Error fetching from API: ${error}`); console.log(`Error fetching from API: ${error}`);
}) })
}else { } else {
convertToBudgetPerYearDataResponse(budgetResponse) convertToBudgetPerYearDataResponse(budgetResponse)
} }
...@@ -107,35 +107,33 @@ function DataAnalysis(): ReactElement { ...@@ -107,35 +107,33 @@ function DataAnalysis(): ReactElement {
data: { data: {
datasets: [ datasets: [
{ {
backgroundColor:'', backgroundColor: '',
data:[], data: [],
label:'' label: ''
}], }],
labels:[] labels: []
}, },
description: "", description: "",
id: "", id: "",
settings:{}, settings: {},
title:"" title: ""
} }
const empty_budget_response = { const empty_budget_response = [{
data: [{ BUDGET: "",
BUDGET: "", BUDGET_YEAR: 0,
BUDGET_YEAR: 0, NREN: "",
NREN: "", id: 0
id: 0 }]
}]
}
const convertToBudgetPerYearDataResponse = (budgetResponse:Budget) => { const convertToBudgetPerYearDataResponse = (budgetResponse: Budget[]) => {
console.log("convertToBudgetPerYearDataResponse budgetResponse "+budgetResponse); console.log("convertToBudgetPerYearDataResponse budgetResponse " + budgetResponse);
const barResponse=budgetResponse!=undefined?budgetResponse:empty_budget_response; const barResponse = budgetResponse != undefined ? budgetResponse : empty_budget_response;
const labelsYear = [...new Set(barResponse.data.map((item ) => item.BUDGET_YEAR))]; const labelsYear = [...new Set(barResponse.map((item) => item.BUDGET_YEAR))];
const labelsNREN = [...new Set(barResponse.data.map((item ) => item.NREN))]; const labelsNREN = [...new Set(barResponse.map((item) => item.NREN))];
console.log("convertToBudgetPerYearDataResponse "+barResponse); console.log("convertToBudgetPerYearDataResponse " + barResponse);
function getRandomColor() { function getRandomColor() {
...@@ -146,40 +144,40 @@ function DataAnalysis(): ReactElement { ...@@ -146,40 +144,40 @@ function DataAnalysis(): ReactElement {
} }
function dataForNRENForYear(year:number,nren :string){ function dataForNRENForYear(year: number, nren: string) {
const budget = barResponse.data.find(function (entry,index){ const budget = barResponse.find(function (entry, index) {
if(entry.BUDGET_YEAR== year && entry.NREN== nren) { if (entry.BUDGET_YEAR == year && entry.NREN == nren) {
return Number(entry.BUDGET); return Number(entry.BUDGET);
} }
}) })
return budget !== undefined?Number(budget.BUDGET):null; return budget !== undefined ? Number(budget.BUDGET) : null;
} }
const datasetPerYear = labelsYear.map(function (year){ const datasetPerYear = labelsYear.map(function (year) {
const randomColor = getRandomColor(); const randomColor = getRandomColor();
return { return {
backgroundColor: randomColor, backgroundColor: randomColor,
borderColor:randomColor, borderColor: randomColor,
data: labelsNREN.map(nren => dataForNRENForYear(year,nren)), data: labelsNREN.map(nren => dataForNRENForYear(year, nren)),
label:year.toString() label: year.toString()
} }
}) })
const datasetPerNREN = labelsNREN.map(function (nren){ const datasetPerNREN = labelsNREN.map(function (nren) {
const randomColor = getRandomColor(); const randomColor = getRandomColor();
return { return {
backgroundColor: randomColor, backgroundColor: randomColor,
borderColor:randomColor, borderColor: randomColor,
data: labelsYear.map(year => dataForNRENForYear(year,nren)), data: labelsYear.map(year => dataForNRENForYear(year, nren)),
label:nren label: nren
} }
}) })
if(selectedDataEntry==2){ if (selectedDataEntry == 2) {
const dataResponse : BudgetMatrix ={ const dataResponse: BudgetMatrix = {
data: { data: {
datasets: datasetPerNREN, datasets: datasetPerNREN,
labels: labelsYear.map(l=>l.toString()) labels: labelsYear.map(l => l.toString())
}, },
description: "The numbers are based on 30 NRENs that " + description: "The numbers are based on 30 NRENs that " +
"reported their budgets continuously throughout this" + "reported their budgets continuously throughout this" +
...@@ -191,16 +189,16 @@ function DataAnalysis(): ReactElement { ...@@ -191,16 +189,16 @@ function DataAnalysis(): ReactElement {
" percentage change is based on the previous year’s" + " percentage change is based on the previous year’s" +
" budget.", " budget.",
id: "3", id: "3",
settings:{}, settings: {},
title:'NREN Budgets per NREN, in Millions EUR' title: 'NREN Budgets per NREN, in Millions EUR'
} }
setBudgetMatrixResponse(dataResponse); setBudgetMatrixResponse(dataResponse);
} }
else{ else {
const dataResponse : BudgetMatrix ={ const dataResponse: BudgetMatrix = {
data: { data: {
datasets: datasetPerYear, datasets: datasetPerYear,
labels: labelsNREN.map(l=>l.toString()) labels: labelsNREN.map(l => l.toString())
}, },
description: description:
"The numbers are based on 30 NRENs that reported their " + "The numbers are based on 30 NRENs that reported their " +
...@@ -212,8 +210,8 @@ function DataAnalysis(): ReactElement { ...@@ -212,8 +210,8 @@ function DataAnalysis(): ReactElement {
" responding NRENs that year is €555 M). The percentage" + " responding NRENs that year is €555 M). The percentage" +
" change is based on the previous year’s budget.", " change is based on the previous year’s budget.",
id: "2", id: "2",
settings:{}, settings: {},
title:'NREN Budgets per year, in Millions EUR' title: 'NREN Budgets per year, in Millions EUR'
} }
setBudgetMatrixResponse(dataResponse); setBudgetMatrixResponse(dataResponse);
} }
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment