Skip to content

Commit c097033

Browse files
committed
refactor
1 parent d8616dd commit c097033

File tree

3 files changed

+29
-113
lines changed

3 files changed

+29
-113
lines changed

services/static-webserver/client/source/class/osparc/desktop/credits/ResourceInTableViewer.js

Lines changed: 3 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,6 @@ qx.Class.define("osparc.desktop.credits.ResourceInTableViewer", {
7878
control = new qx.ui.form.Button(this.tr("Export")).set({
7979
allowStretchY: false,
8080
alignY: "bottom",
81-
visibility: "excluded",
8281
});
8382
control.addListener("execute", () => this._handleExport());
8483
layout = this.getChildControl("filter-layout");
@@ -144,11 +143,8 @@ qx.Class.define("osparc.desktop.credits.ResourceInTableViewer", {
144143
return null;
145144
},
146145

147-
_handleExport() {
148-
const reportUrl = new URL("/v0/services/-/usage-report", window.location.origin)
149-
reportUrl.searchParams.append("wallet_id", this._getSelectWalletId())
150-
reportUrl.searchParams.append("filters", JSON.stringify({ "started_at": this.__dateFilters.getValue() }))
151-
window.open(reportUrl, "_blank")
152-
}
146+
_handleExport: function() {
147+
throw new Error("Abstract method called!");
148+
},
153149
}
154150
});

services/static-webserver/client/source/class/osparc/desktop/credits/Usage.js

Lines changed: 24 additions & 104 deletions
Original file line numberDiff line numberDiff line change
@@ -17,114 +17,34 @@
1717
************************************************************************ */
1818

1919
qx.Class.define("osparc.desktop.credits.Usage", {
20-
extend: qx.ui.core.Widget,
21-
22-
construct: function() {
23-
this.base(arguments);
24-
25-
this._setLayout(new qx.ui.layout.VBox(15));
26-
27-
const store = osparc.store.Store.getInstance();
28-
this.__userWallets = store.getWallets();
29-
30-
this.__buildLayout()
31-
},
20+
extend: osparc.desktop.credits.ResourceInTableViewer,
3221

3322
members: {
34-
__buildLayout: function() {
35-
this._removeAll();
36-
37-
const container = new qx.ui.container.Composite(new qx.ui.layout.VBox(5));
38-
39-
const lbl = new qx.ui.basic.Label("Select a Credit Account:");
40-
container.add(lbl);
41-
42-
const selectBoxContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
43-
const walletSelectBox = new qx.ui.form.SelectBox().set({
44-
allowStretchX: false,
45-
width: 200
46-
});
47-
selectBoxContainer.add(walletSelectBox);
48-
this.__fetchingImg = new qx.ui.basic.Image().set({
49-
source: "@FontAwesome5Solid/circle-notch/12",
50-
alignX: "center",
51-
alignY: "middle",
52-
visibility: "excluded"
53-
});
54-
this.__fetchingImg.getContentElement().addClass("rotate");
55-
selectBoxContainer.add(this.__fetchingImg);
56-
container.add(selectBoxContainer);
57-
58-
const filterContainer = new qx.ui.container.Composite(new qx.ui.layout.HBox(5))
59-
this.__dateFilters = new osparc.desktop.credits.DateFilters();
60-
this.__dateFilters.addListener("change", e => {
61-
this.__table.getTableModel().setFilters(e.getData())
62-
this.__table.getTableModel().reloadData()
63-
});
64-
filterContainer.add(this.__dateFilters);
65-
filterContainer.add(new qx.ui.core.Spacer(), {
66-
flex: 1
67-
});
68-
this.__exportButton = new qx.ui.form.Button(this.tr("Export")).set({
69-
allowStretchY: false,
70-
alignY: "bottom"
71-
});
72-
this.__exportButton.addListener("execute", () => {
73-
this.__handleExport()
74-
});
75-
filterContainer.add(this.__exportButton);
76-
const refreshButton = new qx.ui.form.Button(this.tr("Reload"), "@FontAwesome5Solid/sync-alt/14").set({
77-
allowStretchY: false,
78-
alignY: "bottom"
79-
});
80-
refreshButton.addListener("execute", () => this.__table && this.__table.getTableModel().reloadData());
81-
filterContainer.add(refreshButton)
82-
container.add(filterContainer);
83-
84-
this._add(container);
85-
86-
walletSelectBox.addListener("changeSelection", e => {
87-
const selection = e.getData();
88-
if (selection.length) {
89-
this.__selectedWallet = selection[0].getModel()
90-
if (this.__table) {
91-
this.__table.getTableModel().setWalletId(this.__selectedWallet.getWalletId())
92-
this.__table.getTableModel().reloadData()
93-
} else {
94-
// qx: changeSelection is triggered after the first item is added to SelectBox
95-
this.__table = new osparc.desktop.credits.UsageTable(this.__selectedWallet.getWalletId(), this.__dateFilters.getValue()).set({
96-
marginTop: 10
97-
})
98-
this.__table.getTableModel().bind("isFetching", this.__fetchingImg, "visibility", {
99-
converter: isFetching => isFetching ? "visible" : "excluded"
100-
})
101-
container.add(this.__table, { flex: 1 })
102-
}
23+
_createChildControlImpl: function(id) {
24+
let control;
25+
switch (id) {
26+
case "table": {
27+
const dateFilters = this.getChildControl("date-filters");
28+
control = new osparc.desktop.credits.UsageTable(this._getSelectWalletId(), dateFilters.getValue()).set({
29+
marginTop: 10
30+
});
31+
const fetchingImage = this.getChildControl("fetching-image");
32+
control.getTableModel().bind("isFetching", fetchingImage, "visibility", {
33+
converter: isFetching => isFetching ? "visible" : "excluded"
34+
})
35+
this._add(control, { flex: 1 })
36+
break;
10337
}
104-
});
105-
106-
if (osparc.desktop.credits.Utils.areWalletsEnabled()) {
107-
this.__userWallets.forEach(wallet => {
108-
walletSelectBox.add(new qx.ui.form.ListItem(wallet.getName(), null, wallet));
109-
});
110-
} else {
111-
lbl.setVisibility("excluded")
112-
walletSelectBox.setVisibility("excluded")
113-
this.__exportButton.setVisibility("excluded")
114-
this.__table = new osparc.desktop.credits.UsageTable(null, this.__dateFilters.getValue()).set({
115-
marginTop: 10
116-
})
117-
this.__table.getTableModel().bind("isFetching", this.__fetchingImg, "visibility", {
118-
converter: isFetching => isFetching ? "visible" : "excluded"
119-
})
120-
container.add(this.__table, { flex: 1 })
12138
}
39+
return control || this.base(arguments, id);
40+
},
41+
42+
_handleExport: function() {
43+
const reportUrl = new URL("/v0/services/-/usage-report", window.location.origin);
44+
reportUrl.searchParams.append("wallet_id", this._getSelectWalletId());
45+
const dateFilters = this.getChildControl("date-filters");
46+
reportUrl.searchParams.append("filters", JSON.stringify({ "started_at": dateFilters.getValue() }));
47+
window.open(reportUrl, "_blank");
12248
},
123-
__handleExport() {
124-
const reportUrl = new URL("/v0/services/-/usage-report", window.location.origin)
125-
reportUrl.searchParams.append("wallet_id", this.__selectedWallet.getWalletId())
126-
reportUrl.searchParams.append("filters", JSON.stringify({ "started_at": this.__dateFilters.getValue() }))
127-
window.open(reportUrl, "_blank")
128-
}
12949
}
13050
});

services/static-webserver/client/source/class/osparc/desktop/credits/UsageTable.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ qx.Class.define("osparc.desktop.credits.UsageTable", {
7777
id: "node",
7878
column: 1,
7979
label: qx.locale.Manager.tr("Node"),
80-
width: 140
80+
width: 100
8181
},
8282
SERVICE: {
8383
id: "service",
@@ -119,7 +119,7 @@ qx.Class.define("osparc.desktop.credits.UsageTable", {
119119
id: "tags",
120120
column: 7,
121121
label: qx.locale.Manager.tr("Tags"),
122-
width: 140
122+
width: 80
123123
},
124124
}
125125
}

0 commit comments

Comments
 (0)