[Table] style refactor (#2157)

* [Table] Use Vue SFCs

Use Vue SFCs.  Use inject/provide to pass services to components
instead of wrapping components in closures.

* Convert CSS to BEM  - WIP!

- All in progress;
- Headers table divorced from old;
- Sizing working properly at this point;

* Reset legacy file, undo unintended change commit

* Convert CSS to BEM  - WIP!

- All in progress;
- Sizing table divorced from legacy;

* Convert CSS to BEM  - WIP!

- All in progress;
- Table body divorced from legacy;

* Convert CSS to BEM  - WIP!

- Near done, converted tabular-holder from legacy;
- Unit testing in main view and in Layout frames;
- Modded legacy CSS to properly hide control-bar with new naming
when in Layout frame;

* Convert CSS to BEM - done

- Cleanup and organization;

* Convert CSS to BEM

- Further code cleanup;

* Convert CSS to BEM

- Further code cleanup;
- Remove legacy table style imports;

src/plugins/telemetryTable/TelemetryTableViewProvider.js

@@ -20,7 +20,17 @@
  * at runtime from the About dialog for additional information.
  *****************************************************************************/
 
-define(['./TelemetryTableComponent'], function (TelemetryTableComponent) {
+define([
+    './components/table.vue',
+    '../../exporters/CSVExporter',
+    './TelemetryTable',
+    'vue'
+], function (
+    TableComponent,
+    CSVExporter,
+    TelemetryTable,
+    Vue
+) {
     function TelemetryTableViewProvider(openmct) {
         return {
             key: 'table',
@@ -30,15 +40,26 @@ define(['./TelemetryTableComponent'], function (TelemetryTableComponent) {
                 return domainObject.type === 'table' || domainObject.hasOwnProperty('telemetry');
             },
             view: function (domainObject) {
+                let csvExporter = new CSVExporter();
+                let table = new TelemetryTable(domainObject, openmct);
                 let component;
                 return {
                     show: function (element) {
-                        component = new TelemetryTableComponent(domainObject, openmct);
-                        element.appendChild(component.$mount().$el);
-                    }, 
+                        component = new Vue({
+                            components: {
+                                TableComponent: TableComponent.default,
+                            },
+                            provide: {
+                                openmct,
+                                csvExporter,
+                                table
+                            },
+                            el: element,
+                            template: '<table-component></table-component>'
+                        });
+                    },
                     destroy: function (element) {
                         component.$destroy();
-                        element.removeChild(component.$el);
                         component = undefined;
                     }
                 }
@@ -49,4 +70,4 @@ define(['./TelemetryTableComponent'], function (TelemetryTableComponent) {
         }
     }
     return TelemetryTableViewProvider;
-});
+});