[skip ci] show pricing units

Author: odeimaiz

services/static-webserver/client/source/class/osparc/pricing/UnitsList.js

@@ -81,7 +81,7 @@ qx.Class.define("osparc.pricing.UnitsList", {
 
       pricingUnits.forEach(pricingUnit => {
         const pUnit = new osparc.study.PricingUnit(pricingUnit).set({
-          showSpecificInfo: true,
+          showAwsSpecificInfo: true,
           showEditButton: true,
           allowGrowY: false
         });

services/static-webserver/client/source/class/osparc/study/PricingUnit.js

@@ -42,11 +42,18 @@ qx.Class.define("osparc.study.PricingUnit", {
       apply: "__buildLayout"
     },
 
-    showSpecificInfo: {
+    showAwsSpecificInfo: {
       check: "Boolean",
       init: null,
       nullable: true,
-      event: "changeShowSpecificInfo"
+      event: "changeShowAwsSpecificInfo"
+    },
+
+    showUnitExtraInfo: {
+      check: "Boolean",
+      init: true,
+      nullable: true,
+      event: "changeShowUnitExtraInfo"
     },
 
     showEditButton: {
@@ -79,6 +86,13 @@ qx.Class.define("osparc.study.PricingUnit", {
           });
           this._add(control);
           break;
+        case "unitExtraInfo":
+          control = new qx.ui.basic.Label().set({
+            font: "text-13",
+            rich: true,
+          });
+          this._add(control);
+          break;
         case "edit-button":
           control = new qx.ui.form.Button(qx.locale.Manager.tr("Edit"));
           this._add(control);
@@ -106,18 +120,21 @@ qx.Class.define("osparc.study.PricingUnit", {
         pricingUnit.bind("awsSpecificInfo", specificInfo, "value", {
           converter: v => qx.locale.Manager.tr("EC2") + ": " + v,
         });
-        this.bind("showSpecificInfo", specificInfo, "visibility", {
+        this.bind("showAwsSpecificInfo", specificInfo, "visibility", {
           converter: show => show ? "visible" : "excluded"
         })
       }
 
       // add pricing unit extra info
+      const unitExtraInfo = this.getChildControl("unitExtraInfo");
+      let text = "";
       Object.entries(pricingUnit.getUnitExtraInfo()).forEach(([key, value]) => {
-        this._add(new qx.ui.basic.Label().set({
-          value: key + ": " + value,
-          font: "text-13"
-        }));
+        text += `${key}: ${value}<br>`;
       });
+      unitExtraInfo.setValue(text);
+      this.bind("showUnitExtraInfo", unitExtraInfo, "visibility", {
+        converter: show => show ? "visible" : "excluded"
+      })
 
       // add edit button
       const editButton = this.getChildControl("edit-button");

services/static-webserver/client/source/class/osparc/vipMarket/AnatomicalModelDetails.js

@@ -171,7 +171,30 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
     },
 
     __createPricingUnits: function(anatomicalModelsData) {
-      const buttonsLayout = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
+      console.log(anatomicalModelsData);
+      const pricingUnitsLayout = new qx.ui.container.Composite(new qx.ui.layout.HBox(5));
+
+      const params = {
+        url: {
+          pricingPlanId: anatomicalModelsData["pricingPlanId"]
+        }
+      };
+      osparc.data.Resources.fetch("pricingPlans", "getOne", params)
+        .then(data => {
+          const pricingUnits = data["pricingUnits"];
+          pricingUnits.forEach(pricingUnit => {
+            const pUnit = new osparc.study.PricingUnit(pricingUnit).set({
+              showAwsSpecificInfo: false,
+              showUnitExtraInfo: false,
+              showEditButton: false,
+              allowGrowY: false
+            });
+            pricingUnitsLayout.add(pUnit);
+          });
+        })
+        .catch(err => console.error(err));
+
+      /*
       if (anatomicalModelsData["leased"]) {
         const leaseModelButton = new qx.ui.form.Button().set({
           label: this.tr("3 seats Leased (27 days left)"),
@@ -198,8 +221,8 @@ qx.Class.define("osparc.vipMarket.AnatomicalModelDetails", {
       buttonsLayout.add(leaseModelButton, {
         flex: 1
       });
-
-      return buttonsLayout;
+      */
+      return pricingUnitsLayout;
     },
   }
 });