Change table component.

va-server/visual-analytics/public/css/plugins/bcharts/bcharts-adonis-all.css

@@ -1,4 +1,4 @@
-/*   Brightics 2.0 Chart Build 181114 */
+/*   Brightics 2.0 Chart Build 181203 */
 .bcharts-adonis {
     display: flex;
 }
@@ -45,7 +45,7 @@
 
 .bcharts-adonis-center {
     flex: 1;
-    width: 100%;
+    width: calc(100% - 560px);
     height: 100%;
     box-sizing: border-box;
 }

va-server/visual-analytics/public/css/plugins/bcharts/bcharts-adonis-all.min.css

@@ -1,5 +1,5 @@
-/*   Brightics 2.0 Chart Build 181114 */
-/*   Brightics 2.0 Chart Build 181114 */
+/*   Brightics 2.0 Chart Build 181203 */
+/*   Brightics 2.0 Chart Build 181203 */
 .bcharts-adonis {
     display: flex;
 }
@@ -46,6 +46,7 @@
 
 .bcharts-adonis-center {
     flex: 1;
+    width: calc(100% - 560px);
     height: 100%;
     box-sizing: border-box;
 }

va-server/visual-analytics/public/css/plugins/bcharts/bcharts-all.css

@@ -1,4 +1,4 @@
-/*   Brightics 2.0 Chart Build 181109 */
+/*   Brightics 2.0 Chart Build 181203 */
 .jqx-widget {
     font-family: Arial, Dotum, Tahoma, sans-serif;
     font-size: 12px;
@@ -328,6 +328,7 @@ input[type=search].jqx-input-office::-ms-clear:hover {
     width: 100%;
     height: 100%;
     z-index: 1;
+    border: 1px solid rgba(0,0,0,0.2);
 }
 
 .bcharts-chart[chart-vendor="echarts"] > div:nth-child(2) {
@@ -631,6 +632,7 @@ input[type=search].jqx-input-office::-ms-clear:hover {
     width: 10px;
     height: 10px;
 }
+
 .bcharts-dialog .bcharts-dialog-contents.cellviewer{
     position: relative;
     white-space: pre;

va-server/visual-analytics/public/css/plugins/bcharts/bcharts-all.min.css

@@ -1,5 +1,5 @@
-/*   Brightics 2.0 Chart Build 181109 */
-/*   Brightics 2.0 Chart Build 181109 */
+/*   Brightics 2.0 Chart Build 181203 */
+/*   Brightics 2.0 Chart Build 181203 */
 .jqx-widget {
     font-family: Arial, Dotum, Tahoma, sans-serif;
     font-size: 12px;
@@ -329,6 +329,7 @@ input[type=search].jqx-input-office::-ms-clear:hover {
     width: 100%;
     height: 100%;
     z-index: 1;
+    border: 1px solid rgba(0,0,0,0.2);
 }
 
 .bcharts-chart[chart-vendor="echarts"] > div:nth-child(2) {
@@ -632,6 +633,7 @@ input[type=search].jqx-input-office::-ms-clear:hover {
     width: 10px;
     height: 10px;
 }
+
 .bcharts-dialog .bcharts-dialog-contents.cellviewer{
     position: relative;
     white-space: pre;

va-server/visual-analytics/public/js/plugins/bcharts/bcharts-all.js

@@ -18856,13 +18856,13 @@ EChartsColumnCalculatedOptionBuilder.prototype._newSeriesExtractor = function ()
     extractor.setTarget({
         index: xIndexes,
         type: 'category',
-        isKey: false
+        isKey: true
     });
 
     extractor.setTarget({
         index: yIndexes,
         type: 'value',
-        isKey: true
+        isKey: false
     });
 
     return extractor;
@@ -23107,6 +23107,7 @@ handsontableTable.prototype.destroy = function () {
     try {
         $(window).off('resize', this.resizeHandler);
         this.table.destroy();
+        delete this.table;
     } catch (ex) {
         // ignore exception
     }
@@ -23116,8 +23117,6 @@ handsontableTable.prototype._createContents = function ($parent) {
     var _this = this;
 
     this.$mainControl = $('<div class="bcharts-chart"></div>');
-    this.$tableControl = $('<div id="bchart-handson-table"></div>');
-    this.$mainControl.append(this.$tableControl);
     $parent.append(this.$mainControl);
 
     this.$mainControl.hide();
@@ -23128,7 +23127,13 @@ handsontableTable.prototype._createContents = function ($parent) {
     $(window).resize(this.resizeHandler);
 };
 
-handsontableTable.prototype.clear = function () {};
+handsontableTable.prototype.clear = function () {
+    if (this.table) {
+        $(window).off('resize', this.resizeHandler);
+        this.table.destroy();
+        delete this.table;
+    }
+};
 
 handsontableTable.prototype.render = function () {
     var _this = this;
@@ -23140,16 +23145,16 @@ handsontableTable.prototype.render = function () {
         this.$mainControl.css('border', this.options.plotOptions.table.border);
     }
 
-    var builderOptions = {
-        columnWidth: _this.columnWidth
-    };
-
     this.builder = new handsontableTableOptionBuilder();
-    this.builder.setBuilderOptions(builderOptions);
 
-    var opt = this.builder.buildOptions(this.options, this.$mainControl.width(), this.$mainControl.height(), this._makeContextMenu());
+    var opt = this.builder.buildOptions(this.options, this.$parent.width(), this.$parent.height(), this._makeContextMenu());
 
-    this.table = new Handsontable(this.$tableControl[0], opt);
+    // 있으면 update 없으면 생성.. 다른 좋은 방법이 필요한...
+    if (this.table) {
+        this.table.updateSettings(opt);
+    } else {
+        this.table = new Handsontable(this.$mainControl[0], opt);
+    }
 
     this.$mainControl.show();
 };
@@ -23193,19 +23198,18 @@ handsontableTable.prototype._makeContextMenu = function () {
                     var colHeaders = this.getColHeader();
                     var plugin = this.getPlugin('manualColumnResize');
                     var selectedCol = selection[0].start.col;
-                    plugin.setManualSize(selectedCol, colHeaders[selectedCol].length * 10 > 70 ? colHeaders[selectedCol].length * 10 : 70);
+                    plugin.setManualSize(selectedCol, colHeaders[selectedCol].length * 10 > 80 ? colHeaders[selectedCol].length * 10 : 80);
                     this.updateSettings({});
                 }
             },
             "option_3": {
                 name: 'Auto resize all columns',
                 callback: function callback() {
                     var colHeaders = this.getColHeader();
-                    var colWidths = [];
                     var plugin = this.getPlugin('manualColumnResize');
 
                     for (var i = 0; i < colHeaders.length; i++) {
-                        plugin.setManualSize(i, colHeaders[i].length * 10 > 70 ? colHeaders[i].length * 10 : 70);
+                        plugin.setManualSize(i, colHeaders[i].length * 10 > 80 ? colHeaders[i].length * 10 : 80);
                     }
                     // plugin.updatePlugin();
                     // manual에서는 위에걸로 하라고 하는데 안먹어서 그냥 이걸로....
@@ -23297,10 +23301,6 @@ function handsontableTableOptionBuilder() {
 handsontableTableOptionBuilder.prototype = Object.create(_chartOptionBuilder2.default.prototype);
 handsontableTableOptionBuilder.prototype.constructor = handsontableTableOptionBuilder;
 
-handsontableTableOptionBuilder.prototype.setBuilderOptions = function (options) {
-    this.options = options;
-};
-
 handsontableTableOptionBuilder.prototype.buildOptions = function (options, width, height, contextMenu) {
     this.bOptions = options;
     this.handsontableTableOptions = this._defaultOptions(width, height);
@@ -23347,7 +23347,7 @@ handsontableTableOptionBuilder.prototype._buildColumns = function () {
         colHeaders.push(column.name);
 
         // header Width 설정
-        colWidths.push(column.name.length * 10 > 70 ? column.name.length * 10 : 70);
+        colWidths.push(column.name.length * 10 > 80 ? column.name.length * 10 : 80);
 
         // column value 설정
         var columnSetting = {};

va-server/visual-analytics/public/js/plugins/perfect-scrollbar/perfect-scrollbar.jquery.js

@@ -775,6 +775,14 @@ function bindMouseWheelHandler(element, i) {
     }
     return false;
   }
+
+  function shouldBeConsumedByHandsonTable(deltaX, deltaY) {
+      var hoveredTable = element.querySelector('.handsontable:hover');
+      if(hoveredTable){
+          return true;
+      }
+      return false;
+  }
 
   function mousewheelHandler(e) {
     var delta = getDeltaFromEvent(e);
@@ -785,6 +793,9 @@ function bindMouseWheelHandler(element, i) {
     if (shouldBeConsumedByTextarea(deltaX, deltaY)) {
       return;
     }
+    if(shouldBeConsumedByHandsonTable(deltaX, deltaY)){
+        return;
+    }
 
     shouldPrevent = false;
     if (!i.settings.useBothWheelAxes) {