fix cv in mobile pandora_enterprise#12196

pandora_console/include/javascript/pandora_dashboards.js

@@ -1387,7 +1387,7 @@ function dashboardLoadVC(settings) {
           var replacement_width = "$1" + size.width + "$2";
 
           var regex_height = /(height=)[^&]+(&?)/gi;
-          var replacement_height = "$1" + (size.height + 45) + "$2";
+          var replacement_height = "$1" + size.height + "$2";
 
           // Change the URL (if the browser has support).
           if ("history" in window) {
@@ -1460,9 +1460,7 @@ function dashboardLoadVC(settings) {
   }
 
   if (settings.mobile_view_orientation_vc === true) {
-    $(window).on("orientationchange", function() {
-      $(container).width($(window).height());
-      $(container).height($(window).width());
+    $(window).on("orientationchange", function(event) {
       //Remove spinner change VC.
       container.classList.remove("is-updating");
       container.classList.remove("cv-overflow");
@@ -1487,9 +1485,19 @@ function dashboardLoadVC(settings) {
       divParent.appendChild(divSpinner);
       container.appendChild(divParent);
 
+      let width = 0;
+      let height = 0;
+      if (event.target.screen.orientation.angle === 0) {
+        width = $(window).height() + 45;
+        height = $(window).width() - 45;
+      } else {
+        width = $(window).height() + 45;
+        height = $(window).width() - 45 * 2;
+      }
+
       var dimensions = {
-        width: $(window).height(),
-        height: $(window).width() - 45
+        width: width,
+        height: height
       };
 
       visualConsoleManager.changeDimensionsVc(dimensions, interval);

pandora_console/mobile/include/style/main.css

@@ -3320,3 +3320,7 @@ div.visual-console-container-dashboard fieldset {
 .ui-page-theme-a div.visual-console-container-dashboard a {
   color: inherit !important;
 }
+
+body div.visual-console-container-dashboard .visual-console-item-label {
+  line-height: 10px;
+}

visual_console_client/src/Item.ts

@@ -808,9 +808,9 @@ abstract class VisualConsoleItem<Props extends ItemProps> {
   ): void {
     if (prevProps) {
       if (this.props.ratio !== 1 && this.props.type != ItemType.LINE_ITEM) {
-        this.elementRef.style.scale = `${
+        this.elementRef.style.transform = `scale(${
           this.props.ratio ? this.props.ratio : 1
-        }`;
+        })`;
         this.elementRef.style.transformOrigin = "left top";
         this.elementRef.style.minWidth = "max-content";
         this.elementRef.style.minHeight = "max-content";

visual_console_client/src/VisualConsole.ts

@@ -830,7 +830,9 @@ export default class VisualConsole {
       }
 
       if (item.ratio !== 1 && item.type != ItemType.LINE_ITEM) {
-        itemInstance.elementRef.style.scale = `${item.ratio ? item.ratio : 1}`;
+        itemInstance.elementRef.style.transform = `scale(${
+          item.ratio ? item.ratio : 1
+        })`;
         itemInstance.elementRef.style.transformOrigin = "left top";
         itemInstance.elementRef.style.minWidth = "max-content";
         itemInstance.elementRef.style.minHeight = "max-content";