Template interface Function modification

Change-Id: I9fd0aa7949409ed10476b7a45ef4eb26d8259230
Issue-ID: DCAEGEN2-1625
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts
index 5b69f6c..9ce648b 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.ts
@@ -36,7 +36,6 @@
 })
 export class EditTemplateModalComponent implements OnInit {
   @Input() edittemplate: Template;
-  @Input() selectedLangs;
   templateInput: Template;
   templatetypedata: Array<any> = [];
   topicname: Array<any> = [];
@@ -86,14 +85,6 @@
 
   passBack() {
     if(this.templateInput.name == '' || this.templateInput.name == undefined){
-      let tips = "";
-      if (this.selectedLangs == "en-us") {
-        tips = "Name is required input."
-      } else if (this.selectedLangs == "zh-hans") {
-        tips = "名字是必填输入项。"
-      } else if (this.selectedLangs == "zh-hant") {
-        tips = "名字是必填輸入項。"
-      }
       return false;
     }
     this.edittemplate = this.templateInput;
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts
index 640ab31..fd6321b 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.ts
@@ -37,7 +37,6 @@
 export class NewTemplateModalComponent implements OnInit {
   @Input() template: newTemplate;
   @Input() templatelist_length;
-  @Input() selectedLangs;
   templateInput: newTemplate
   templatetypedata: Array<any> = [];
   topicname: Array<any> = [];
@@ -87,21 +86,12 @@
 
   passBack() {
     if(this.templateInput.name == '' || this.templateInput.name == undefined){
-      let tips = "";
-      if (this.selectedLangs == "en-us") {
-        tips = "Name input is required."
-      } else if (this.selectedLangs == "zh-hans") {
-        tips = "名字输入项是必填项。"
-      } else if (this.selectedLangs == "zh-hant") {
-        tips = "名字輸入項是必填項。"
-      }
       return false;
     }
     this.template = this.templateInput;
     console.log(this.templateInput);
     this.template.designType = this.templatetype.nativeElement.value;
     this.template.topic = this.topic.nativeElement.value;
-    // this.template.id = this.templatelist_length+1;
     this.template.submitted = false;
     this.template.note = "";
     console.log(this.template);
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html
index aa1297a..8222648 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.html
@@ -61,355 +61,19 @@
           </ng-template>
         </ngx-datatable-column>
 
-        <ngx-datatable-column [width]="90" name="{{ 'TEMPLATE_TYPE' | translate }}" prop="type">
+        <ngx-datatable-column [width]="180" name="{{ 'TEMPLATE_TYPE' | translate }}" prop="type">
           <ng-template let-row="row" ngx-datatable-cell-template>
-
-            <!-- Couchbase enable -->
-            <span *ngIf="row.designType.includes('Couchbase')" class="pr-1" placement="bottom" ngbTooltip="Couchbase"
-              container="body" tooltipClass="dl-db-icon-hover-enable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-408 285.3 25 25"
-                style="enable-background:new -408 285.3 25 25;" xml:space="preserve">
-                <path [ngStyle]="{
-                      fill: row.designType.includes('Couchbase')
-                        ? '#5DBEBB'
-                        : '#D2D3D5'
-                    }"
-                  d="M-395.5,285.3c-6.9,0-12.5,5.6-12.5,12.5s5.6,12.5,12.5,12.5s12.5-5.6,12.5-12.5S-388.6,285.3-395.5,285.3z
-                            M-387.1,300c0,0.8-0.4,1.4-1.3,1.6c-1.5,0.3-4.6,0.4-7.2,0.4s-5.7-0.2-7.2-0.4c-0.8-0.2-1.3-0.8-1.3-1.6v-4.9
-                          c0-0.8,0.6-1.5,1.3-1.6c0.4-0.1,1.5-0.2,2.2-0.2c0.3,0,0.5,0.2,0.5,0.6v3.4l4.4-0.1l4.4,0.1v-3.4c0-0.4,0.2-0.6,0.5-0.6
-                          c0.8,0,1.8,0.1,2.2,0.2c0.7,0.1,1.3,0.8,1.3,1.6C-387.1,296.7-387.1,298.3-387.1,300L-387.1,300z" />
-              </svg>
-            </span>
-            <!-- Couchbase disable -->
-            <span *ngIf="!row.designType.includes('Couchbase')" class="pr-1" placement="bottom" ngbTooltip="Couchbase"
-              container="body" tooltipClass="dl-db-icon-hover-disable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-408 285.3 25 25"
-                style="enable-background:new -408 285.3 25 25;" xml:space="preserve">
-                <path [ngStyle]="{
-                      fill: row.designType.includes('Couchbase')
-                        ? '#5DBEBB'
-                        : '#D2D3D5'
-                    }"
-                  d="M-395.5,285.3c-6.9,0-12.5,5.6-12.5,12.5s5.6,12.5,12.5,12.5s12.5-5.6,12.5-12.5S-388.6,285.3-395.5,285.3z
-                            M-387.1,300c0,0.8-0.4,1.4-1.3,1.6c-1.5,0.3-4.6,0.4-7.2,0.4s-5.7-0.2-7.2-0.4c-0.8-0.2-1.3-0.8-1.3-1.6v-4.9
-                          c0-0.8,0.6-1.5,1.3-1.6c0.4-0.1,1.5-0.2,2.2-0.2c0.3,0,0.5,0.2,0.5,0.6v3.4l4.4-0.1l4.4,0.1v-3.4c0-0.4,0.2-0.6,0.5-0.6
-                          c0.8,0,1.8,0.1,2.2,0.2c0.7,0.1,1.3,0.8,1.3,1.6C-387.1,296.7-387.1,298.3-387.1,300L-387.1,300z" />
-              </svg>
-            </span>
-
-            <!-- Druid enable -->
-            <span *ngIf="row.designType.includes('Druid')" class="pr-1" placement="bottom" ngbTooltip="Druid" container="body"
-              tooltipClass="dl-db-icon-hover-enable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-403 285.3 34 25"
-                style="enable-background:new -403 285.3 34 25;" xml:space="preserve">
-                <g>
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Druid')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M-385.5,285.3c2.2,0,4.3,0,6.5,0c4.2,0,8,2.7,9.4,6.6c0.6,1.7,0.8,3.4,0.6,5.2c-0.3,2.6-1,5-2.5,7.2
-                     c-2.3,3.4-5.5,5.2-9.5,5.8c-1.4,0.2-2.7,0.2-4.1,0.2c-0.6,0-0.9-0.3-0.9-0.7c0-0.5,0.3-0.9,0.8-0.9c0.6,0,1.2,0,1.9,0
-                     c3.7-0.1,7-1.4,9.6-4.2c1.8-1.9,2.7-4.3,3-6.9c0.2-1.8,0.2-3.6-0.5-5.3c-1.1-2.6-3.1-4.2-5.8-5c-1.1-0.3-2.1-0.3-3.2-0.4
-                     c-4,0-8.1,0-12.1,0c-0.2,0-0.3,0-0.5,0c-0.4,0-0.7-0.4-0.7-0.8s0.3-0.7,0.6-0.8c0.2,0,0.4,0,0.6,0L-385.5,285.3L-385.5,285.3z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Druid')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M-389.7,304.6h-7.2c-0.2,0-0.3,0-0.5,0c-0.4-0.1-0.7-0.3-0.7-0.7c0-0.4,0.2-0.7,0.6-0.9
-                     c0.2-0.1,0.5-0.1,0.8-0.1c4.7,0,9.5,0,14.2,0c1.7,0,3.1-0.6,4.2-1.8c1-1,1.5-2.3,1.6-3.7c0.1-1.1,0-2.1-0.7-3.1
-                     c-0.8-1-1.8-1.5-3.1-1.5c-4.5,0-9,0-13.5,0c-0.5,0-1,0-1.4-0.1c-0.4,0-0.6-0.3-0.7-0.7c0-0.5,0.2-0.8,0.6-0.9c0.1,0,0.3,0,0.4,0
-                     h14.4c2.4,0,4.5,1.5,5.3,3.8c0.5,1.6,0.4,3.3-0.3,4.8c-1.2,3-3.9,4.9-7.2,4.9C-385,304.6-387.3,304.6-389.7,304.6L-389.7,304.6z
-                      M-400.4,292.6c-0.6,0-1.1,0-1.7,0c-0.5,0-0.8-0.3-0.9-0.7s0.2-0.8,0.7-0.9c0.3,0,0.5-0.1,0.8-0.1c0.8,0,1.5,0,2.3,0
-                     c0.2,0,0.5,0,0.7,0.1c0.4,0.1,0.6,0.5,0.6,0.9s-0.3,0.7-0.7,0.7C-399.2,292.7-399.8,292.6-400.4,292.6L-400.4,292.6z M-390.3,310.3
-                     c-0.5,0-1,0-1.6,0c-0.5,0-0.8-0.3-0.9-0.7c0-0.5,0.3-0.9,0.7-0.9c1.1-0.1,2.2-0.1,3.4,0c0.4,0,0.8,0.4,0.7,0.8l0,0
-                     c0,0.5-0.4,0.7-0.9,0.8L-390.3,310.3L-390.3,310.3z" />
-                </g>
-              </svg>
-            </span>
-            <!-- Druid disable -->
-            <span *ngIf="!row.designType.includes('Druid')" class="pr-1" placement="bottom" ngbTooltip="Druid"
-              container="body" tooltipClass="dl-db-icon-hover-disable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-403 285.3 34 25"
-                style="enable-background:new -403 285.3 34 25;" xml:space="preserve">
-                <g>
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Druid')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M-385.5,285.3c2.2,0,4.3,0,6.5,0c4.2,0,8,2.7,9.4,6.6c0.6,1.7,0.8,3.4,0.6,5.2c-0.3,2.6-1,5-2.5,7.2
-                     c-2.3,3.4-5.5,5.2-9.5,5.8c-1.4,0.2-2.7,0.2-4.1,0.2c-0.6,0-0.9-0.3-0.9-0.7c0-0.5,0.3-0.9,0.8-0.9c0.6,0,1.2,0,1.9,0
-                     c3.7-0.1,7-1.4,9.6-4.2c1.8-1.9,2.7-4.3,3-6.9c0.2-1.8,0.2-3.6-0.5-5.3c-1.1-2.6-3.1-4.2-5.8-5c-1.1-0.3-2.1-0.3-3.2-0.4
-                     c-4,0-8.1,0-12.1,0c-0.2,0-0.3,0-0.5,0c-0.4,0-0.7-0.4-0.7-0.8s0.3-0.7,0.6-0.8c0.2,0,0.4,0,0.6,0L-385.5,285.3L-385.5,285.3z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Druid')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M-389.7,304.6h-7.2c-0.2,0-0.3,0-0.5,0c-0.4-0.1-0.7-0.3-0.7-0.7c0-0.4,0.2-0.7,0.6-0.9
-                     c0.2-0.1,0.5-0.1,0.8-0.1c4.7,0,9.5,0,14.2,0c1.7,0,3.1-0.6,4.2-1.8c1-1,1.5-2.3,1.6-3.7c0.1-1.1,0-2.1-0.7-3.1
-                     c-0.8-1-1.8-1.5-3.1-1.5c-4.5,0-9,0-13.5,0c-0.5,0-1,0-1.4-0.1c-0.4,0-0.6-0.3-0.7-0.7c0-0.5,0.2-0.8,0.6-0.9c0.1,0,0.3,0,0.4,0
-                     h14.4c2.4,0,4.5,1.5,5.3,3.8c0.5,1.6,0.4,3.3-0.3,4.8c-1.2,3-3.9,4.9-7.2,4.9C-385,304.6-387.3,304.6-389.7,304.6L-389.7,304.6z
-                      M-400.4,292.6c-0.6,0-1.1,0-1.7,0c-0.5,0-0.8-0.3-0.9-0.7s0.2-0.8,0.7-0.9c0.3,0,0.5-0.1,0.8-0.1c0.8,0,1.5,0,2.3,0
-                     c0.2,0,0.5,0,0.7,0.1c0.4,0.1,0.6,0.5,0.6,0.9s-0.3,0.7-0.7,0.7C-399.2,292.7-399.8,292.6-400.4,292.6L-400.4,292.6z M-390.3,310.3
-                     c-0.5,0-1,0-1.6,0c-0.5,0-0.8-0.3-0.9-0.7c0-0.5,0.3-0.9,0.7-0.9c1.1-0.1,2.2-0.1,3.4,0c0.4,0,0.8,0.4,0.7,0.8l0,0
-                     c0,0.5-0.4,0.7-0.9,0.8L-390.3,310.3L-390.3,310.3z" />
-                </g>
-              </svg>
-            </span>
-
-            <!-- Elasticsearch enable -->
-            <span *ngIf="row.designType.includes('Elasticsearch')" class="pr-1" placement="bottom" ngbTooltip="Elasticsearch"
-              container="body" tooltipClass="dl-db-icon-hover-enable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="2066.4 284.8 25.1 25"
-                style="enable-background:new 2066.4 284.8 25.1 25;" xml:space="preserve">
-                <g>
-                  <path style="fill: #FFFFFF" d="M2091.6,297.9c0-2.1-1.3-3.9-3.3-4.7c0.1-0.4,0.1-0.9,0.1-1.4c0-3.9-3.2-7.1-7.1-7.1c-2.3,0-4.4,1.1-5.7,3
-                   c-0.7-0.5-1.5-0.8-2.3-0.8c-2.1,0-3.8,1.7-3.8,3.8c0,0.5,0.1,0.9,0.2,1.3c-2,0.7-3.3,2.6-3.3,4.7c0,2.1,1.3,4,3.3,4.7
-                   c-0.1,0.4-0.1,0.9-0.1,1.4c0,3.9,3.2,7.1,7.1,7.1c2.3,0,4.4-1.1,5.7-3c0.7,0.5,1.5,0.8,2.3,0.8c2.1,0,3.8-1.7,3.8-3.8
-                   c0-0.5-0.1-0.9-0.2-1.3C2090.2,301.8,2091.6,300,2091.6,297.9L2091.6,297.9z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2076.3,295.5l5.6,2.6l5.7-5c0.1-0.4,0.1-0.8,0.1-1.3c0-3.5-2.8-6.3-6.3-6.3c-2.1,0-4,1-5.2,2.7l-0.9,4.9
-                   L2076.3,295.5L2076.3,295.5z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2070.5,301.4c-0.1,0.4-0.1,0.8-0.1,1.3c0,3.5,2.8,6.3,6.3,6.3c2.1,0,4.1-1,5.2-2.8l0.9-4.9l-1.3-2.4l-5.6-2.6
-                   L2070.5,301.4L2070.5,301.4z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2070.4,291.7l3.8,0.9l0.9-4.4c-0.5-0.4-1.2-0.6-1.8-0.6c-1.7,0-3,1.4-3,3
-                   C2070.2,291.1,2070.3,291.4,2070.4,291.7L2070.4,291.7z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M2070.1,292.7c-1.7,0.6-2.9,2.2-2.9,4c0,1.8,1.1,3.3,2.7,4l5.4-4.9l-1-2.1L2070.1,292.7L2070.1,292.7z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2082.9,306.3c0.5,0.4,1.2,0.6,1.8,0.6c1.7,0,3-1.4,3-3c0-0.4-0.1-0.7-0.2-1l-3.8-0.9L2082.9,306.3
-                   L2082.9,306.3z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M2083.7,300.9l4.2,1c1.7-0.6,2.9-2.2,2.9-4c0-1.8-1.1-3.3-2.7-4l-5.5,4.8L2083.7,300.9L2083.7,300.9z" />
-                </g>
-              </svg>
-            </span>
-            <!-- Elasticsearch disable -->
-            <span *ngIf="!row.designType.includes('Elasticsearch')" class="pr-1" placement="bottom" ngbTooltip="Elasticsearch"
-              container="body" tooltipClass="dl-db-icon-hover-disable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="2066.4 284.8 25.1 25"
-                style="enable-background:new 2066.4 284.8 25.1 25;" xml:space="preserve">
-                <g>
-                  <path style="fill: #FFFFFF" d="M2091.6,297.9c0-2.1-1.3-3.9-3.3-4.7c0.1-0.4,0.1-0.9,0.1-1.4c0-3.9-3.2-7.1-7.1-7.1c-2.3,0-4.4,1.1-5.7,3
-                   c-0.7-0.5-1.5-0.8-2.3-0.8c-2.1,0-3.8,1.7-3.8,3.8c0,0.5,0.1,0.9,0.2,1.3c-2,0.7-3.3,2.6-3.3,4.7c0,2.1,1.3,4,3.3,4.7
-                   c-0.1,0.4-0.1,0.9-0.1,1.4c0,3.9,3.2,7.1,7.1,7.1c2.3,0,4.4-1.1,5.7-3c0.7,0.5,1.5,0.8,2.3,0.8c2.1,0,3.8-1.7,3.8-3.8
-                   c0-0.5-0.1-0.9-0.2-1.3C2090.2,301.8,2091.6,300,2091.6,297.9L2091.6,297.9z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2076.3,295.5l5.6,2.6l5.7-5c0.1-0.4,0.1-0.8,0.1-1.3c0-3.5-2.8-6.3-6.3-6.3c-2.1,0-4,1-5.2,2.7l-0.9,4.9
-                   L2076.3,295.5L2076.3,295.5z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2070.5,301.4c-0.1,0.4-0.1,0.8-0.1,1.3c0,3.5,2.8,6.3,6.3,6.3c2.1,0,4.1-1,5.2-2.8l0.9-4.9l-1.3-2.4l-5.6-2.6
-                   L2070.5,301.4L2070.5,301.4z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2070.4,291.7l3.8,0.9l0.9-4.4c-0.5-0.4-1.2-0.6-1.8-0.6c-1.7,0-3,1.4-3,3
-                   C2070.2,291.1,2070.3,291.4,2070.4,291.7L2070.4,291.7z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M2070.1,292.7c-1.7,0.6-2.9,2.2-2.9,4c0,1.8,1.1,3.3,2.7,4l5.4-4.9l-1-2.1L2070.1,292.7L2070.1,292.7z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }" d="M2082.9,306.3c0.5,0.4,1.2,0.6,1.8,0.6c1.7,0,3-1.4,3-3c0-0.4-0.1-0.7-0.2-1l-3.8-0.9L2082.9,306.3
-                   L2082.9,306.3z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('Elasticsearch')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M2083.7,300.9l4.2,1c1.7-0.6,2.9-2.2,2.9-4c0-1.8-1.1-3.3-2.7-4l-5.5,4.8L2083.7,300.9L2083.7,300.9z" />
-                </g>
-              </svg>
-            </span>
-
-            <!-- MongoDB enable -->
-            <span *ngIf="row.designType.includes('MongoDB')" class="pr-1" placement="bottom" ngbTooltip="MongoDB"
-              container="body" tooltipClass="dl-db-icon-hover-enable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-397.2 285.8 11.2 25"
-                style="enable-background:new -397.2 285.8 11.2 25;" xml:space="preserve">
-                <g transform="matrix(1.2754196 0 0 1.2754196 -16.030009 -21.83192)">
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#19A2A2'
-                          : '#C4C6C8'
-                      }"
-                    d="M-294.5,241.2c0.2,0.3,0.4,0.7,0.5,1c0.1,0.2,0.2,0.4,0.4,0.5c0.4,0.4,0.9,0.9,1.2,1.4
-                   c0.9,1.2,1.5,2.5,1.9,3.9c0.3,0.9,0.4,1.7,0.4,2.6c0,2.7-0.9,4.9-2.7,6.8c-0.3,0.3-0.6,0.6-1,0.8c-0.2,0-0.3-0.2-0.4-0.3
-                   c-0.2-0.2-0.2-0.5-0.3-0.8c-0.1-0.3-0.1-0.6-0.1-1c0,0,0-0.1,0-0.2C-294.4,256.1-294.6,241.3-294.5,241.2z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M-294.5,241.2C-294.5,241.2-294.5,241.2-294.5,241.2c-0.1,0.2-0.2,0.4-0.3,0.6c-0.1,0.2-0.3,0.3-0.5,0.5
-                   c-0.9,0.8-1.7,1.8-2.3,2.9c-0.8,1.5-1.2,3.1-1.3,4.8c0,0.6,0.2,2.8,0.4,3.4c0.5,1.6,1.4,3,2.7,4.2c0.3,0.3,0.6,0.5,0.9,0.8
-                   c0.1,0,0.1-0.1,0.1-0.2c0-0.2,0.1-0.3,0.1-0.4c0.1-0.5,0.2-1.1,0.2-1.6C-294.4,256.2-294.4,241.3-294.5,241.2L-294.5,241.2z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#CEEBEA'
-                          : '#C2BFBF'
-                      }" d="M-294,258.9c0-0.2,0.2-0.4,0.3-0.7c-0.1,0-0.2-0.2-0.3-0.3c-0.1-0.1-0.1-0.2-0.2-0.4c-0.2-0.4-0.2-0.9-0.2-1.4
-                   c0,0,0-0.1,0-0.2s0-0.1,0-0.2c0,0-0.1,0.4-0.1,0.5c0,0.5-0.1,1-0.2,1.4c0,0.2,0,0.4-0.2,0.5c0,0,0,0,0,0.1c0.2,0.5,0.2,1.1,0.3,1.7
-                   v0.2c0,0.3,0,0.2,0.2,0.3c0.1,0,0.2,0,0.3,0.1c0.1,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.4c0-0.3,0-0.7,0-1
-                   C-294,259.3-294,259.1-294,258.9z" />
-                </g>
-              </svg>
-            </span>
-            <!-- MongoDB disable -->
-            <span *ngIf="!row.designType.includes('MongoDB')" class="pr-1" placement="bottom" ngbTooltip="MongoDB"
-              container="body" tooltipClass="dl-db-icon-hover-disable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="-397.2 285.8 11.2 25"
-                style="enable-background:new -397.2 285.8 11.2 25;" xml:space="preserve">
-                <g transform="matrix(1.2754196 0 0 1.2754196 -16.030009 -21.83192)">
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#19A2A2'
-                          : '#C4C6C8'
-                      }"
-                    d="M-294.5,241.2c0.2,0.3,0.4,0.7,0.5,1c0.1,0.2,0.2,0.4,0.4,0.5c0.4,0.4,0.9,0.9,1.2,1.4
-                   c0.9,1.2,1.5,2.5,1.9,3.9c0.3,0.9,0.4,1.7,0.4,2.6c0,2.7-0.9,4.9-2.7,6.8c-0.3,0.3-0.6,0.6-1,0.8c-0.2,0-0.3-0.2-0.4-0.3
-                   c-0.2-0.2-0.2-0.5-0.3-0.8c-0.1-0.3-0.1-0.6-0.1-1c0,0,0-0.1,0-0.2C-294.4,256.1-294.6,241.3-294.5,241.2z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#5DBEBB'
-                          : '#D2D3D5'
-                      }"
-                    d="M-294.5,241.2C-294.5,241.2-294.5,241.2-294.5,241.2c-0.1,0.2-0.2,0.4-0.3,0.6c-0.1,0.2-0.3,0.3-0.5,0.5
-                   c-0.9,0.8-1.7,1.8-2.3,2.9c-0.8,1.5-1.2,3.1-1.3,4.8c0,0.6,0.2,2.8,0.4,3.4c0.5,1.6,1.4,3,2.7,4.2c0.3,0.3,0.6,0.5,0.9,0.8
-                   c0.1,0,0.1-0.1,0.1-0.2c0-0.2,0.1-0.3,0.1-0.4c0.1-0.5,0.2-1.1,0.2-1.6C-294.4,256.2-294.4,241.3-294.5,241.2L-294.5,241.2z" />
-                  <path [ngStyle]="{
-                        fill: row.designType.includes('MongoDB')
-                          ? '#CEEBEA'
-                          : '#C2BFBF'
-                      }" d="M-294,258.9c0-0.2,0.2-0.4,0.3-0.7c-0.1,0-0.2-0.2-0.3-0.3c-0.1-0.1-0.1-0.2-0.2-0.4c-0.2-0.4-0.2-0.9-0.2-1.4
-                   c0,0,0-0.1,0-0.2s0-0.1,0-0.2c0,0-0.1,0.4-0.1,0.5c0,0.5-0.1,1-0.2,1.4c0,0.2,0,0.4-0.2,0.5c0,0,0,0,0,0.1c0.2,0.5,0.2,1.1,0.3,1.7
-                   v0.2c0,0.3,0,0.2,0.2,0.3c0.1,0,0.2,0,0.3,0.1c0.1,0,0.1,0,0.1-0.1c0-0.1,0-0.2,0-0.4c0-0.3,0-0.7,0-1
-                   C-294,259.3-294,259.1-294,258.9z" />
-                </g>
-              </svg>
-            </span>
-
-            <!-- Kibana enable-->
-            <span *ngIf="row.designType.includes('Kibana')" class="pr-1" placement="bottom" ngbTooltip="Kibana"
-              container="body" tooltipClass="dl-db-icon-hover-enable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
-                xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="1722.5 -151.5 708.9 904.3"
-                style="enable-background:new 1722.5 -151.5 708.9 904.3;" xml:space="preserve">
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#5DBEBB'
-                    : '#D2D3D5'
-                }"
-                  d="M1760.3,189.5c114.1,0,221.9,29.7,315.6,79.7l334.4-401.6h-662.5v796.9v-475H1760.3L1760.3,189.5z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#5DBEBB'
-                    : '#D2D3D5'
-                }"
-                d="M2075.9,269.2l-328.1,395.3V727h660.9C2371.2,530.1,2246.2,362.9,2075.9,269.2z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#37A595'
-                    : '#C2BFBF'
-                }"
-                 d="M2075.9,269.2l-328.1,395.3V727h117.2l318.7-384.4c0,0-21.9-17.2-51.6-39.1
-           C2110.2,287.9,2075.9,269.2,2075.9,269.2z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#19A2A2'
-                    : '#C4C6C8'
-                }"
-                  d="M1760.3,189.5h-12.5v475l328.1-395.3C1982.1,219.2,1874.3,189.5,1760.3,189.5L1760.3,189.5z" />
-              </svg>
-            </span>
-            <!-- Kibana disable -->
-            <span *ngIf="!row.designType.includes('Kibana')" class="pr-1" placement="bottom" ngbTooltip="Kibana"
-              container="body" tooltipClass="dl-db-icon-hover-disable" [openDelay]="300" [closeDelay]="300">
-              <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg"
-                xmlns:xlink="http://www.w3.org/1999/xlink" x="0px"
-                y="0px" width="20" height="20" viewBox="1722.5 -151.5 708.9 904.3"
-                style="enable-background:new 1722.5 -151.5 708.9 904.3;" xml:space="preserve">
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#5DBEBB'
-                    : '#D2D3D5'
-                }"
-                  d="M1760.3,189.5c114.1,0,221.9,29.7,315.6,79.7l334.4-401.6h-662.5v796.9v-475H1760.3L1760.3,189.5z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#5DBEBB'
-                    : '#D2D3D5'
-                }"
-                 d="M2075.9,269.2l-328.1,395.3V727h660.9C2371.2,530.1,2246.2,362.9,2075.9,269.2z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#37A595'
-                    : '#C2BFBF'
-                }"
-                 d="M2075.9,269.2l-328.1,395.3V727h117.2l318.7-384.4c0,0-21.9-17.2-51.6-39.1
-	C2110.2,287.9,2075.9,269.2,2075.9,269.2z" />
-                <path [ngStyle]="{
-                  fill: row.designType.includes('Kibana')
-                    ? '#19A2A2'
-                    : '#C4C6C8'
-                }"
-                  d="M1760.3,189.5h-12.5v475l328.1-395.3C1982.1,219.2,1874.3,189.5,1760.3,189.5L1760.3,189.5z" />
-              </svg>
-            </span>
+            <span>{{ row.designType }}</span>
           </ng-template>
         </ngx-datatable-column>
 
-        <ngx-datatable-column [width]="240" name="{{ 'TOPICS_NAME' | translate }}" prop="topic">
+        <ngx-datatable-column [width]="220" name="{{ 'TOPICS_NAME' | translate }}" prop="topic">
           <ng-template let-row="row" ngx-datatable-cell-template>
             <span>{{ row.topic }}</span>
           </ng-template>
         </ngx-datatable-column>
 
-        <ngx-datatable-column [width]="90" name="{{ 'DEPLOY_TO_DASHBOARD' | translate }}"
+        <ngx-datatable-column [width]="20" name="{{ 'DEPLOY_TO_DASHBOARD' | translate }}"
           headerClass="d-flex justify-content-center" cellClass="d-flex justify-content-center">
           <div>
             <ng-template let-row="row" ngx-datatable-cell-template>
@@ -417,7 +81,7 @@
             </ng-template>
           </div>
         </ngx-datatable-column>
-        <ngx-datatable-column [width]="15" name="" sortable="false" cellClass="d-flex justify-content-center">
+        <ngx-datatable-column [width]="10" name="" sortable="false" cellClass="d-flex justify-content-center">
           <ng-template let-row="row" ngx-datatable-cell-template>
             <span>
               <button class="btn action-icon-setting" (click)="this.deleteTemplateModel(row.id);">
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts
index 328ceeb..cfe4300 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/template-list.component.ts
@@ -40,7 +40,6 @@
   Template_Newbody: newTemplate;
   dashboardDeteleModelShow = true;
   loadingIndicator: boolean = true;
-  selectedLangs = sessionStorage.getItem("selectedLang");
   mesgNoData = {
     emptyMessage: `
       <div class="d-flex justify-content-center">
@@ -111,7 +110,6 @@
   }
 
   newTemplateModal() {
-    this.selectedLangs = sessionStorage.getItem("selectedLang");
     let tips = "";
     const modalRef = this.modalService.open(NewTemplateModalComponent, {
       windowClass: "dl-md-modal templatess",
@@ -120,7 +118,6 @@
     this.Template_New = new Template();
     this.Template_Newbody = new newTemplate();
     modalRef.componentInstance.template = this.Template_Newbody;
-    modalRef.componentInstance.selectedLangs = this.selectedLangs;
     modalRef.componentInstance.templatelist_length = this.template_list.length;
     modalRef.componentInstance.passEntry.subscribe(receivedEntry => {
       this.Template_Newbody = receivedEntry;
@@ -135,23 +132,9 @@
               this.template_list.push(this.Template_New);
               this.template_list = [...this.template_list];
               console.log(this.template_list, "this.template_list,inserted");
-              if (this.selectedLangs == "en-us") {
-                tips = "Successfully created."
-              } else if (this.selectedLangs == "zh-hans") {
-                tips = "新增成功。"
-              } else if (this.selectedLangs == "zh-hant") {
-                tips = "新增成功。"
-              }
-              this.notificationService.success(tips);
+              this.notificationService.success("SUCCESSFULLY_CREARED");
             } else {
-              if (this.selectedLangs == "en-us") {
-                tips = "Fail created."
-              } else if (this.selectedLangs == "zh-hans") {
-                tips = "新增失败。"
-              } else if (this.selectedLangs == "zh-hant") {
-                tips = "新增失敗。"
-              }
-              this.notificationService.error(tips);
+              this.notificationService.error("FAILED_CREARED");
             }
             modalRef.close();
           },
@@ -174,15 +157,12 @@
   }
 
   editTemplateModal(id) {
-    this.selectedLangs = sessionStorage.getItem("selectedLang");
-    let tips = "";
     const index = this.template_list.findIndex(t => t.id === id);
     // const name = this.template_list[index].name;
     const modalRef = this.modalService.open(EditTemplateModalComponent, {
       windowClass: "dl-md-modal templatess",
       centered: true
     });
-    modalRef.componentInstance.selectedLangs = this.selectedLangs;
     modalRef.componentInstance.edittemplate = this.template_list[index];
     modalRef.componentInstance.passEntry.subscribe(receivedEntry => {
       const name = receivedEntry.name;
@@ -196,24 +176,9 @@
               this.template_list[index] = this.Template_New;
               this.template_list = [...this.template_list];
               console.log(this.template_list, "this.template_list,update");
-              if (this.selectedLangs == "en-us") {
-                tips = "Successfully updated."
-              } else if (this.selectedLangs == "zh-hans") {
-                tips = "更新成功。"
-              } else if (this.selectedLangs == "zh-hant") {
-                tips = "更新成功。"
-              }
-              this.notificationService.success('"' + name + '"' + tips);
-
+              this.notificationService.success("SUCCESSFULLY_UPDATED");
             } else {
-              if (this.selectedLangs == "en-us") {
-                tips = "Fail updated."
-              } else if (this.selectedLangs == "zh-hans") {
-                tips = "更新失败。"
-              } else if (this.selectedLangs == "zh-hant") {
-                tips = "更新失敗。"
-              }
-              this.notificationService.error('"' + name + '"' + tips);
+              this.notificationService.error("FAILED_UPDATED");
             }
             modalRef.close();
           },
@@ -226,15 +191,6 @@
   }
 
   deleteTemplateModel(id: number) {
-    this.selectedLangs = sessionStorage.getItem("selectedLang");
-    let tips = "";
-    if (this.selectedLangs == "en-us") {
-      tips = "Are you sure you want to delete ";
-    } else if (this.selectedLangs == "zh-hans") {
-      tips = "您确定您要删除";
-    } else if (this.selectedLangs == "zh-hant") {
-      tips = "您確定您要刪除";
-    }
     const index = this.template_list.findIndex(t => t.id === id);
     const modalRef = this.modalService.open(AlertComponent, {
       size: "sm",
@@ -242,8 +198,7 @@
     });
     const name = this.template_list[index].name;
     // modalRef.componentInstance.dashboardDeteleModelShow = this.dashboardDeteleModelShow;
-    modalRef.componentInstance.message =
-      tips + '"' + name + '"' + ' ?';
+    modalRef.componentInstance.message = "ARE_YOU_SURE_DELETE";
     modalRef.componentInstance.passEntry.subscribe(receivedEntry => {
       // Delete database
       this.dashboardApiService.DeleteTemplate(id).subscribe(
@@ -254,24 +209,10 @@
             console.log("Success deleted template");
             this.template_list.splice(index, 1);
             this.template_list = [...this.template_list];
-            if (this.selectedLangs == "en-us") {
-              tips = "Successfully deleted."
-            } else if (this.selectedLangs == "zh-hans") {
-              tips = "删除成功。"
-            } else if (this.selectedLangs == "zh-hant") {
-              tips = "刪除成功。"
-            }
-            this.notificationService.success(tips);
+            this.notificationService.success("SUCCESSFULLY_DELETED");
           } else {
             console.log("Fail deleted template");
-            if (this.selectedLangs == "en-us") {
-              tips = "Fail deleted."
-            } else if (this.selectedLangs == "zh-hans") {
-              tips = "删除失败。"
-            } else if (this.selectedLangs == "zh-hant") {
-              tips = "刪除失敗。"
-            }
-            this.notificationService.error(tips);
+            this.notificationService.error("FAILED_DELETED");
           }
 
           modalRef.close();
@@ -286,43 +227,19 @@
   }
 
   deployTemplate(id: number) {
-    this.selectedLangs = sessionStorage.getItem("selectedLang");
-    let tips = "";
     const index = this.template_list.findIndex(t => t.id === id);
     const name = this.template_list[index].name;
     const body = this.template_list[index];
     this.spinner.show();
-    // this.dashboardApiService.deployTemplate(id).subscribe(
-    //   res => {
-    //     console.log(res,"reshost");
-    //     const host = res.source.host,
-    //           port = res.source.port;
-    //     if (res.status == "success") {
-    //       console.log(res)
-
     this.dashboardApiService.deployTemplateKibana(id, body).subscribe(
       res => {
         this.spinner.hide();
         console.log(res,"template deploy res");
         console.log(JSON.stringify(res).length,"JSON.stringify(res).length");
         if (JSON.stringify(res).length<=2) {
-          if (this.selectedLangs == "en-us") {
-            tips = "deploy successful."
-          } else if (this.selectedLangs == "zh-hans") {
-            tips = "部署成功。"
-          } else if (this.selectedLangs == "zh-hant") {
-            tips = "部署成功。"
-          }
-          this.notificationService.success('"' + name + '"' + tips);
+          this.notificationService.success("Deploy_SUCCESSFULLY");
         } else {
-          if (this.selectedLangs == "en-us") {
-            tips = "deploy fail."
-          } else if (this.selectedLangs == "zh-hans") {
-            tips = "部署失败。"
-          } else if (this.selectedLangs == "zh-hant") {
-            tips = "部署失敗。"
-          }
-          this.notificationService.error('"' + name + '"' + tips);
+          this.notificationService.error("Deploy_FAILED");
         }
       },
       err => {
@@ -330,17 +247,6 @@
         this.notificationService.error(err);
       }
     );
-    //     } else {
-    //       this.spinner.hide();
-    //       this.notificationService.error( name + " Fail deploy.");
-    //     }
-    //   },
-    //   err => {
-    //     this.spinner.hide();
-    //     this.notificationService.error(err);
-    //   }
-    // );
-
   }
 
   updateFilter(searchValue) {