Fullstack Portal Created by the HCMR for the Marine Strategy Framework Directive Program in order to cover demands and aspects considering extendability and maintainability
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

129 lines
4.0 KiB

function moreInfo() {
return {
entityGroup: selectedEntityGroup,
entityId: selectedEntityId || Alpine.store('entity').id,
dopen: false,
copen: false,
loading: false,
isGrid: Alpine.store('entity').hasOwnProperty('cellcode'),
d: {},
c: {},
tagName(type, id) {
if (id == null)
return;
if (type === 'd') {
return this.d.find(i => i.id == id).code;
} else if (type === 'c') {
return this.c.find(i => i.id == id).code;
}
},
did: null,
cid: [],
date: {},
search() {
this.drawDataChart();
// check if entity has an external source
if (this.$store.entity.hasOwnProperty('ctStationCode')) {
requestExternalData(this.did, this.cid, this.date.from, this.date.to, this.entityGroup, this.entityId);
} else {
requestEntityData(this.did, this.cid, this.date.from, this.date.to, this.entityGroup, this.entityId);
}
},
selectEntry(element, entry) {
console.debug(element.text.substr(0, element.text.indexOf(' ')));
if (element.id.split('-')[1] === 'desc') {
// highlight
element.parentElement.querySelectorAll('a').forEach(el => el.classList.remove('is-active'));
element.classList.add('is-active');
// update variables;
this.cid = [];
this.did = entry;
this.dopen = false;
} else if (element.id.split('-')[1] === 'crit') {
// toggle
element.classList.toggle('is-active');
// update variables;
this.cid.indexOf(entry) === -1 ? this.cid.push(entry) : this.cid = this.cid.filter(function(id) { return id !== entry});
this.copen = false;
// add tag
}
},
getDropdownData(dropdown) {
Alpine.store('loading', true);
let url = BASE_URL;
let gridCode;
if (this.isGrid) {
gridCode = Alpine.store('entity').cellcode.substr(0,4);
}
switch(dropdown) {
case 'd':
url += '/interface/dropdowns/descriptors?entity_id=' + this.entityId + '&cellcode=' + gridCode;
break;
case 'c':
url += '/interface/dropdowns/criterias?desc_id=' + this.did + '&cellcode=' + gridCode;
break;
}
fetch(url)
.then(res => res.json())
.then(data => {
Alpine.store('loading', false);
eval('this.' + dropdown + '=data');
});
},
loadCal() {
const calendars = bulmaCalendar.attach('[type=date]', {dateFormat: 'dd/MM/yyyy', isRange: true});
// Loop on each calendar initialized
calendars.forEach(calendar => {
calendar.on('save', data => {
this.date = {
from: calendar.startDate.toLocaleDateString(),
to: calendar.endDate.toLocaleDateString()
}
});
});
},
populateFeatureGrid(grid) {
const features = Alpine.store('entity');
console.debug(features);
const featureCols = Object.getOwnPropertyNames(Alpine.store('entity')).filter(name => aliasMap.has(name));
const featureVals = featureCols.map(col => {return {feature: aliasMap.get(col), value: features[col]}});
console.debug(featureVals);
new gridjs.Grid({
data: featureVals
}).render(grid);
},
drawDataChart() {
Alpine.store('loading', true);
if (this.entityGroup != 'POSEIDON')
return;
const url = `/data/external/POSEIDON/${Alpine.store('entity').tspr}_${Alpine.store('entity').type}_${Alpine.store('entity').pid}`;
fetch(url)
.then(res => res.json())
.then(data => {
Alpine.store('loading', false);
console.debug(data);
});
const config = {
type: 'line',
data: data,
options: {
responsive: true,
plugins: {
legend: {
position: 'top',
},
title: {
display: true,
text: 'Chart.js Line Chart'
}
}
},
};
}
};
}