SAPUI5 column summing - html-table

I developed a SAPUI5 table on frontend having 4 columns, now I need to show the total sum of 1 column. If anyone knows the code related to this please help me
Controller code
onInit: function () {
var oTable = this.byId("producttable");
oTable.addStyleClass("myCustomTable");
//column list item creation
var oTemplate = new sap.m.ColumnListItem({
cells: [
new sap.m.Text({
text: "{Plant}"
}),
new sap.m.Text({
text: "{PlantDesc}"
}),
new sap.m.Text({
text: "{parts: [ {path: 'NetAmount'}, {path: 'currency'}],type: 'sap.ui.model.type.Currency',formatOptions: {showMeasure: false, maxFractionDigits: 0,roundingMode: 'away_from_zero'}}"
})
]
});
var sServiceUrl = "/sap/opu/odata/sap/ZSALES_PLANT001_SRV/";
//Adding service to the odata model
var oModel = new sap.ui.model.odata.ODataModel(sServiceUrl, false);
//Setting model to the table
oTable.setModel(oModel);
oTable.bindAggregation("items", {
path: "/ZSalesheaderSet",
template: oTemplate
});
I am getting the following errors in console
sap-ui-core.js:187 Assertion failed: could not find any translatable
text for key 'Total Sales-Yesterday' in bundle
'./i18n/i18n.properties' Failed to load resource: the server
responded with a status of 503 ()

getSum: function() {
var sum = 0, items = this.getView().byId("tableId").getItems();
for (var i = 0; i < items.length; i++) {
sum = sum + items[i].getBindingContext("urBoundModel").getObject().urColumn
}
return sum;
}

If you have bound the table to a Odata or JSON model. Just Iterate over your items and sum the bound property of the column.

Related

dynamically add new fields to b-table [ Vue.js ]

I am trying to create a table using bootstrap table with fields dynamically added. The fields that will be added will be taken from my api (see code below).
vue.js (jade) - The 2nd template will be the one to render the dynamically added fields but the problem is I can't access the row.item.members because I am not in the row scope. If there is a way to access the row data in the template tag it would be great but I already spent a day and found no luck
b-table(small v-bind:items="plans" v-bind:fields="fields" fixed responsive)
template(slot='bg_action', slot-scope='row')
nuxt-link(:to="'/supply_and_demand/master/'+selected+'/'+row.item.date")
b-button.mr-1(size='sm', variant="primary")
| {{ row.item.date }}
template(v-for="member_info in row.item.members" :slot="id_+ 'member_info.id'" )
| {{ member_info.name }}
my api call (which adds new fields to the table and get the data)
async fetchData(){
let params = {
"q[balancing_group_id_eq]": this.selected
}
this.$restApi.index('bg_members', {params})
.then( (result)=>{
this.fields = [
{ key: 'date', label: '' },
{ key: 'bg_action', label: 'BG' }
]
for(let i = 1; i <= result.length; i++){
this.fields.push({ key: 'id_' + result[i-1].company.id, label: result[i-1].company.name })
}
})
params = {
"q[balancing_group_id_eq]": this.selected,
"q[date_gteq]": this.from,
"q[date_lteq]": this.to
}
this.$axios.$get('/v1/occto/plans', { params })
.then( (result)=>{
console.log("plans")
console.log(this.plans)
this.plans = result
})
}
tldr:I want to access the row data inside the template tag so I can dynamically set the slot which will result to data being displayed properly.

Knockout-Kendo Chart - remove and add series

My project is MVC 5, I am using the following to generate a chart with multiple series:
HTML:
<button data-bind="click: addItem">Add</button>
<button data-bind="click: removeItem">Remove</button>
<div data-bind="kendoChart2: { title: { text: 'Graph Sample' },
series: seriesConfig,tooltip: {visible: true,template: '#= series.name #: #= value #'} , seriesDefaults: {
type: 'line',style: 'smooth'}}"> </div>
Javascript
var MainViewModel = function () {
var self = this;
this.Systolic = ko.observableArray([]);
this.Diastolic = ko.observableArray([]);
this.HeartRate= ko.observableArray([]);
$.ajax({
type: "GET",
url: '/Charts/GetChart',
contentType: "application/json; charset=utf-8",
async: false,
cache: false,
dataType: "json",
success: function (result) {
//Diastolic
if (result && result.Systolic.length > 0) {
for (var i = 0; i < result.Systolic.length; i++) {
self.Systolic.push(result.Systolic[i].Systolic);
}
};
....
},
error: function (err) {
alert(err.status + " : " + err.statusText);
}});
this.seriesConfig = ko.observableArray([
{name: "Systolic", data: this.Systolic()},
{name: "Diastolic",data: this.Diastolic()}]);
this.addItem = function() {
this.seriesConfig.push({ name: "Heart Rate", data: this.HeartRate() });
};
this.removeItem = function() {
this.seriesConfig.remove({ name: "Diastolic", data: this.Diastolic() });
};
}.bind(this);
ko.kendo.bindingFactory.createBinding(
{
name: "kendoChart",
bindingName: "kendoChart2",
watch: {
data: function(value) {
ko.kendo.setDataSource(this, value);
},
series: function(value) {
this._sourceSeries = value;
this.refresh();
this.redraw();}
}
});
window.viewModel = new MainViewModel();
ko.applyBindings(window.viewModel);
The chart works great, however can't add or remove series?
Note:
the addItem works, I get the value of the new series:
series: function (value) {
alert(value[2].name);
this.seriesConfig = value;
this.refresh();
this.redraw();
}
I also tried load all series then use the following hide a series:
$("#kendoChart").getKendoChart().options.series[1].visible = false;
$("#kendoChart").getKendoChart().redraw();
Does not work, I think the chart name does not register.
I am not familiar with knockout-kendo, just with knockout in general, so if fixing obvious problem as described below will not work, you might need to refresh bindings. Looking at this example however this is not needed, so most likely you got caught by a simple fact that array's remove performs simple == comparison and it fails to find equal object in the array.
Here is a simplified example (although you might know it already, but just in case):
var a="abc";
var b="abc";
var aa = [1,2,3,"a","b","c"];
var data1 = {name: a, data: aa};
var data2 = {name: b, data: aa};
now, comparison a==b returns true and clearly data slots are the same, however data1==data2 is false. That is because it's a different object.
So in your example in removeItem you create and pass a new object to remove, not the one in the array, so == comparison fails and nothing is removed as that newly created object isn't in your observable array.
I suggest comparing the name only similar to item.age < 18 comparison from knockout.js documentation on observable arrays:
this.seriesConfig.remove( function (item) { return item.name == "Diastolic"; } )
I believe, this should do the trick.

Facing some issue to print the API response values in one sentence

I am trying to assert and print the response, for that need help.
Below is response body:
{
"createdIncidents":[
{
"incidentRef":"I0000000",
"personName":"API API",
"personType":"Patient"
},
{
"incidentRef":"I0000000",
"personName":"Ballarat HelpDesk",
"personType":"Staff"
},
{
"incidentRef":"I0000000",
"personName":"test api",
"personType":"Visitor"
},
{
"incidentRef":"I0000000",
"personName":null,
"personType":"Hazard"
}
]
}
I am trying to print incidentRef and personType together in a string.
For that, I am using this code:
var data = JSON.parse(responseBody);
data.createdIncidents.forEach(function(incident, personT) {
var personType = "personType" + personT.personType;
var incidents = "incidentRef" + incident.incidentRef;
var pt = tests["incidents created for " + personType ] = 'personType';
var inc = tests["incidents number is " + incidents] = 'incidents';
tests["incidents created for" +inc && + pt ];
});
Here it is not reading the second items inside the function.
In a separate function declaration it works fine.
I want to print it as:
"incidentRef": "I0000000 is created for "personType": "Hazard""
This would log each item from the createdIncidents array to the console - Unsure what you're actually trying to assert against though:
_.each(pm.response.json().createdIncidents, (arrItem) => {
console.log(`Incident Ref: ${arrItem.incidentRef} is created for Person Type: ${arrItem.personType}`)
})
Given your response data, this would be the output:
Incident Ref: I0000000 is created for Person Type: Patient
Incident Ref: I0000000 is created for Person Type: Staff
Incident Ref: I0000000 is created for Person Type: Visitor
Incident Ref: I0000000 is created for Person Type: Hazard
This could be wrapped in a pm.test() and the different items can be asserted against using the pm.expect() syntax.
This is very basic and is very hardcoded but it would check the data in your example:
pm.test('Check the response', () => {
_.each(pm.response.json().createdIncidents, (arrItem) => {
pm.expect(arrItem.incidentRef).to.equal("I0000000")
pm.expect(arrItem.personType).to.be.oneOf(['Patient','Staff','Visitor','Hazard'])
console.log(`Incident Ref: ${arrItem.incidentRef} is created for Person Type: ${arrItem.personType}`)
})
})

Calculating a Total for a Grid

I have a grid of the which has actual time as one of its columns. How can I add the rows up to get the total actual time similar to the way it is done on the track team status page.
Edit:
I am currently trying to find the sum using this var sum = grid.getStore().sum('Actuals');, however when I run it, I get this error on the console:
Uncaught ReferenceError: grid is not defined
I have also tried using this piece of code that I found online:
var tasks = [];
var users = [];
that = this
if (data.length ===0) {
this._createGrid(); //to refresh grid when no items in iteration
}
Ext.Array.each(this.tasks, function(task) {
var owner = task.get('Owner');
var total;
Ext.Array.each(data, function(actual){
//some tasks have no owner. If this condition is not checked Uncaught TypeError: Cannot read property '_refObjectName' of null
if (owner && actual.get('User')._refObjectName === owner._refObjectName) {
total = actual.get('Actuals');
}
});
var t = {
FormattedID: task.get('FormattedID'),
_ref: task.get("_ref"),
Name: task.get('Name'),
Estimate: task.get('Actuals'),
Owner: (owner && owner._refObjectName) || 'None',
TaskEstimates: total
};
tasks.push(t);
});
},
but when I try to print total or taskestimate or attempt to find a specific part of tasks (tasks[i][j]) I either get no data or an error
See a not-treegrid code in this post for an example of how to create a row in a grid that sums up values in a specific column (e.g. Estimate)
columnCfgs: [
{
xtype: 'templatecolumn',text: 'ID',dataIndex: 'FormattedID',width: 100,
tpl: Ext.create('Rally.ui.renderer.template.FormattedIDTemplate'),
summaryRenderer: function() {
return "Estimate Total";
}
},
{
text: 'Estimate',dataIndex: 'Estimate',
summaryType: 'sum',
}

Dojo populate combo box widget dynamically

Could someone please explain to me why this simple straight forward code isnt working,
var serviceStore = new dojo.data.ItemFileWriteStore({
data: {identifier: "serviceCode",items:[]}
});
//jsonObj is a json object that I obtain from the server via AJAX
for(var i = 0; i<jsonObj.length;i++){
serviceStore.newItem({serviceCode: jsonObj[i]});
}
var serviceFilterSelect = dojo.byId('serviceSelect');
serviceFilterSelect.store = serviceStore;
There is no error at all displayed but my combobox with the id "serviceSelect" doesn't display any options, the combo is declared in the html section of my code,
<input dojoType = "dijit.form.ComboBox" id="serviceSelect"></input>
Any pointers towards the right direction will be much appreciated.
First of all you should use dijit.byId to get dojo widget instead of dojo.byId.
Also every item in jsonObj should contains field "name". This field will be displayed in combobox. E.g:
dojo.require("dojo.data.ItemFileWriteStore");
dojo.require("dijit.form.ComboBox");
var storeData = {
identifier: 'serviceCode',
items: []
}
var jsonObj = [{
serviceCode: 'sc1',
name: 'serviceCode1'
},
{
serviceCode: 'sc2',
name: 'serviceCode2'
}]
dojo.addOnLoad(function () {
var serviceStore = new dojo.data.ItemFileWriteStore({ data: storeData });
for (var i = 0; i < jsonObj.length; i++) {
serviceStore.newItem(jsonObj[i]);
}
var serviceFilterSelect = dijit.byId('serviceSelect');
serviceFilterSelect.attr('store', serviceStore);
});
And HTML:
<select dojotype="dijit.form.ComboBox" id="serviceSelect" ></select>
It seems that it works.
I can't tell from the code you posted, but if you're having trouble getting the DOM nodes, they may not had a chance to get loaded.
You can try wrapping what you have above with a dojo.ready(function(){ ... });.
Have you put items in your store? I can't tell from the sample that you posted.
var serviceStore = new dojo.data.ItemFileWriteStore({
data: {
identifier: "serviceCode"
,items: [
{serviceCode:'ec', name:'Ecuador'}
,{serviceCode:'eg', name:'Egypt'}
,{serviceCode:'sv', name:'El Salvador'}
]
}
});
For dojo >= 1.6:
dojo.byId('serviceSelect').store=serviceStore;
For dojo < 1.6:
dojo.byId('serviceSelect').attr("store",serviceStore);