fixed tabname change bug

Author: Gourav Dwivedi

src/js/components/app.component.js

@@ -23,16 +23,16 @@ class AppComponent extends HTMLElement {
             <div class="panel panel-primary">
                 <ul class="nav nav-tabs justify-content-end nav-justified" id="tabheader">
                     <li class="nav-item">
-                        <a class="nav-link active" data-tab-type="basic" data-toggle="tab"  href="#basicview">Basic</a>
+                        <a class="nav-link active" data-tab-type="basic" data-toggle="tab"  href="#appview">Basic</a>
                     </li>
                     <li class="nav-item">
-                        <a class="nav-link" data-tab-type="advance" data-toggle="tab" href="#basicview">Advance</a>
+                        <a class="nav-link" data-tab-type="advance" data-toggle="tab" href="#appview">Advance</a>
                     </li>
                 </ul>
 
                 <div class="tab-content container clearfix tabcontent">
-                    <div id="basicview" class="tab-pane active">
-                        <h2>Basic</h2>
+                    <div id="appview" class="tab-pane active">
+                        <h4>Basic</h4>
                         <sr-form></sr-form>
                     </div>                  
                 </div>

src/js/components/custom.alertbox.html

@@ -6,7 +6,7 @@ import * as Test from '../components/dialogbox/custompopup';
 var isConnected = false;
 //#region ConnectedEvent
 AppCommon.AppEvents.on('Init', () => {
-    //console.log('Init Event Emitter');
+
 });
 //#endregion
 
@@ -20,7 +20,6 @@ AppCommon.AppEvents.on('OnDisconnected', () => {
 //#endregion
 
 export function Init() {
-debugger;
     window.appLogic = new AppLogic();
     //Connect Button Events
     document.getElementById('btn-connect')
@@ -99,21 +98,25 @@ export function RigisterNavigationTabEvent() {
     for (var i = 0; i < navLinkClass.length; i++) {
         navLinkClass[i].addEventListener('click',
             function () {
-                console.log(this.getAttribute('data-tab-type'));
                 OnTabChange(this.getAttribute('data-tab-type'));
             },
             false);
     }
 }
 
 export function OnTabChange(tabName) {
+    var appView = document.getElementById('appview');
+    var tabHeaderElement = appView.getElementsByTagName('h4')[0];
+
     if (tabName == 'basic') {
         window.appLogic.SetCurrentViewAsBasic();
         AdvanceViewElements(false);
+        tabHeaderElement.innerText = "Basic";
     }
     else {
         window.appLogic.SetCurrentViewAsAdvance();
         AdvanceViewElements(true);
+        tabHeaderElement.innerText = "Advance";
     }
 }
 

src/js/components/custom.alertbox.js

@@ -4,7 +4,7 @@ import 'material-design-lite/dist/material.indigo-blue.min.css'
 import 'material-design-lite/material.min.js'
 import 'bootstrap/dist/js/bootstrap.js'
 import '../css/main.css';
-import './components/custom.alertbox';
+// import './components/custom.alertbox';
 import './components/srform.component';
 import './components/app.component';