Template interface Function modification
Change-Id: I2fcca1b978855abbc25bf73f731f0dcc2c973f70
Issue-ID: DCAEGEN2-1625
Signed-off-by: cyuamber <xuranyjy@chinamobile.com>
diff --git a/components/datalake-handler/admin/src/src/app/core/models/template.model.ts b/components/datalake-handler/admin/src/src/app/core/models/template.model.ts
index 5df6972..5342d70 100644
--- a/components/datalake-handler/admin/src/src/app/core/models/template.model.ts
+++ b/components/datalake-handler/admin/src/src/app/core/models/template.model.ts
@@ -34,7 +34,7 @@
export class Template {
id:number;
name:string;
- submitted:true;
+ submitted:boolean;
body: string;
note:string;
topic: string;
@@ -43,7 +43,7 @@
export class newTemplate {
name:string;
- submitted:true;
+ submitted:boolean;
body: string;
note:string;
topic: string;
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html
index 3b276c1..4e5a4bb 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/edit-template-modal/edit-template-modal.component.html
@@ -19,6 +19,7 @@
<div class="row">
<div class="col-md-12">
<label class="dl-h3">{{ templateInputTitle }}</label>
+ <i class="fas fa-plus fa-2x close-btn-icon" (click)="activeModal.close('Close click')"></i>
</div>
</div>
<div class="row">
@@ -33,10 +34,10 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1" for="inputtemplateName">{{ 'TEMPLATE_NAME' | translate }}</label>
</div>
- <div class="col-md-4">
+ <div class="col-md-5">
<input #inputtemplateName [(ngModel)]="this.templateInput.name" class="form-control dl-input-text" type="text" placeholder="Username" />
</div>
</div>
@@ -44,21 +45,21 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1" for="templatebody">{{ 'TEMPLATE_BODY'| translate }}</label>
</div>
- <div class="col-md-8">
- <textarea #templatebody [(ngModel)]="this.templateInput.body" class="form-control dl-input-text" placeholder="Put the template design here..." rows="3"></textarea>
+ <div class="col-md-9">
+ <textarea #templatebody [(ngModel)]="this.templateInput.body" class="form-control dl-input-text" placeholder="Put the template design here..." rows="3" style="min-height: 300px!important;"></textarea>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1">{{ 'TEMPLATE_TYPE' | translate }}</label>
</div>
- <div class="col-md-6">
+ <div class="col-md-7">
<select #templatetype class="custom-select dl-input-text" id="selDataFormat">
<option *ngFor="let item of templatetypedata" [selected]="item == this.templateInput.designType">{{item}}</option>
</select>
@@ -68,10 +69,10 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
- <label class="dl-emphasis1">{{ 'TOPICS' | translate }}</label>
+ <div class="col-md-3">
+ <label class="dl-emphasis1">{{ 'TOPICS_NAME' | translate }}</label>
</div>
- <div class="col-md-6">
+ <div class="col-md-7">
<select #topic class="custom-select dl-input-text" id="selDataFormat">
<option *ngFor="let item of topicname" [selected]="item == this.templateInput.topic">{{item}}</option>
</select>
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 eab30e2..5b69f6c 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
@@ -70,6 +70,7 @@
};
this.templateInput = feed;
this.templateInputTitle = ""+this.edittemplate.name;
+ console.log(this.templateInput,"this.templateInput")
}
getTopicName(){
this.dashboardApiService.getTopicName().subscribe(data => {
diff --git a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html
index 6b36bc5..9d01765 100644
--- a/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html
+++ b/components/datalake-handler/admin/src/src/app/dashboard-setting/template/template-list/new-template-modal/new-template-modal.component.html
@@ -19,6 +19,7 @@
<div class="row">
<div class="col-md-12">
<label class="dl-h3">{{ "NEW_TEMPLATE" | translate }}</label>
+ <i class="fas fa-plus fa-2x close-btn-icon" (click)="activeModal.close('Close click')"></i>
</div>
</div>
<div class="row">
@@ -33,10 +34,10 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1" for="inputtemplateName">{{ 'TEMPLATE_NAME' | translate }}</label>
</div>
- <div class="col-md-4">
+ <div class="col-md-5">
<input #inputtemplateName [(ngModel)]="this.templateInput.name" class="form-control dl-input-text" type="text" name="inputtemplateName" placeholder="Username" required="required"/>
</div>
</div>
@@ -44,21 +45,21 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1" for="templatebody">{{ 'TEMPLATE_BODY'| translate }}</label>
</div>
- <div class="col-md-8">
- <textarea #templatebody [(ngModel)]="this.templateInput.body" class="form-control dl-input-text" placeholder="Put the template design here..." rows="3"></textarea>
+ <div class="col-md-9">
+ <textarea #templatebody [(ngModel)]="this.templateInput.body" class="form-control dl-input-text" placeholder="Put the template design here..." rows="3" style="min-height: 300px!important;"></textarea>
</div>
</div>
</div>
<div class="form-group">
<div class="row">
- <div class="col-md-4">
+ <div class="col-md-3">
<label class="dl-emphasis1">{{ 'TEMPLATE_TYPE' | translate }}</label>
</div>
- <div class="col-md-6">
+ <div class="col-md-7">
<select #templatetype class="custom-select dl-input-text">
<option *ngFor="let item of templatetypedata" [selected]="item==templatetypedata[0]">{{item}}</option>
</select>
@@ -68,10 +69,10 @@
<div class="form-group">
<div class="row">
- <div class="col-md-4">
- <label class="dl-emphasis1">{{ 'TOPICS' | translate }}</label>
+ <div class="col-md-3">
+ <label class="dl-emphasis1">{{ 'TOPICS_NAME' | translate }}</label>
</div>
- <div class="col-md-6">
+ <div class="col-md-7">
<select #topic class="custom-select dl-input-text">
<option *ngFor="let item of topicname" [selected]="item==topicname[0]">{{item}}</option>
</select>
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 9519ff4..640ab31 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
@@ -102,7 +102,7 @@
this.template.designType = this.templatetype.nativeElement.value;
this.template.topic = this.topic.nativeElement.value;
// this.template.id = this.templatelist_length+1;
- this.template.submitted = true;
+ this.template.submitted = false;
this.template.note = "";
console.log(this.template);
this.passEntry.emit(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 e58db0b..aa1297a 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
@@ -42,20 +42,20 @@
<!-- datatable -->
<div class="row">
<div class="col-md-12">
- <ngx-datatable #mydatatable class="bootstrap" [rows]="template_list" [columnMode]="'force'" [headerHeight]="40"
+ <ngx-datatable #mytemlate class="bootstrap" [rows]="template_list" [columnMode]="'force'" [headerHeight]="40"
[footerHeight]="40" [rowHeight]="50" [scrollbarV]="true" [scrollbarH]="true"
- [loadingIndicator]="loadingIndicator" [messages]="mesgNoData" [limit]="10">
+ [loadingIndicator]="loadingIndicator" [messages]="mesgNoData" [limit]="10" (activate)="onActivate($event)">
- <ngx-datatable-column [width]="40" name="{{ 'No' | translate }}" prop="id"
- headerClass="d-flex justify-content-center" cellClass="d-flex justify-content-center">
- <div>
- <ng-template let-row="row">
- <span>{{ row.id }}</span>
- </ng-template>
- </div>
- </ngx-datatable-column>
+ <!--<ngx-datatable-column [width]="40" name="{{ 'No' | translate }}" prop="id"-->
+ <!--headerClass="d-flex justify-content-center" cellClass="d-flex justify-content-center">-->
+ <!--<div>-->
+ <!--<ng-template let-row="row">-->
+ <!--<span>{{ row.id }}</span>-->
+ <!--</ng-template>-->
+ <!--</div>-->
+ <!--</ngx-datatable-column>-->
- <ngx-datatable-column [width]="200" name="{{ 'TEMPLATE_NAME' | translate }}" prop="name">
+ <ngx-datatable-column [width]="100" name="{{ 'TEMPLATE_NAME' | translate }}" prop="name" headerClass="d-flex justify-content-center" cellClass="d-flex justify-content-center">
<ng-template let-row="row" ngx-datatable-cell-template>
<span>{{ row.name }}</span>
</ng-template>
@@ -413,7 +413,7 @@
headerClass="d-flex justify-content-center" cellClass="d-flex justify-content-center">
<div>
<ng-template let-row="row" ngx-datatable-cell-template>
- <span (click)="this.deployTemplate(row.id);" class="dl-btn-dark"> {{ 'DEPLOY' | translate }} </span>
+ <span (click)="this.deployTemplate(row.id);" class="dl-btn-dark" style="cursor: pointer"> {{ 'DEPLOY' | translate }} </span>
</ng-template>
</div>
</ngx-datatable-column>
@@ -424,11 +424,6 @@
<i class="fas fa-trash-alt fa-xs"></i>
</button>
</span>
- <span>
- <button class="btn action-icon-setting" (click)="this.editTemplateModal(row.id);">
- <i class="fas fa-cog fa-xs"></i>
- </button>
- </span>
</ng-template>
</ngx-datatable-column>
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 9d774c4..328ceeb 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
@@ -51,7 +51,6 @@
`
};
@ViewChild("searchText") searchText: ElementRef;
-
constructor(
private modalService: NgbModal,
private dashboardApiService: DashboardApiService,
@@ -115,7 +114,7 @@
this.selectedLangs = sessionStorage.getItem("selectedLang");
let tips = "";
const modalRef = this.modalService.open(NewTemplateModalComponent, {
- windowClass: "dl-md-modal",
+ windowClass: "dl-md-modal templatess",
centered: true
});
this.Template_New = new Template();
@@ -137,22 +136,22 @@
this.template_list = [...this.template_list];
console.log(this.template_list, "this.template_list,inserted");
if (this.selectedLangs == "en-us") {
- tips = "Success inserted."
+ tips = "Successfully created."
} else if (this.selectedLangs == "zh-hans") {
tips = "新增成功。"
} else if (this.selectedLangs == "zh-hant") {
tips = "新增成功。"
}
- this.notificationService.success('"' + name + '"' + tips);
+ this.notificationService.success(tips);
} else {
if (this.selectedLangs == "en-us") {
- tips = "Fail inserted."
+ tips = "Fail created."
} else if (this.selectedLangs == "zh-hans") {
tips = "新增失败。"
} else if (this.selectedLangs == "zh-hant") {
tips = "新增失敗。"
}
- this.notificationService.error('"' + name + '"' + tips);
+ this.notificationService.error(tips);
}
modalRef.close();
},
@@ -164,13 +163,23 @@
});
}
- editTemplateModal(id: number) {
+ onActivate(event) {
+ const emitType = event.type;
+ if(emitType == "dblclick"){
+ console.log('Activate Event', event);
+ let id = event.row.id;
+ this.editTemplateModal(id);
+ }
+
+ }
+
+ 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",
+ windowClass: "dl-md-modal templatess",
centered: true
});
modalRef.componentInstance.selectedLangs = this.selectedLangs;
@@ -188,7 +197,7 @@
this.template_list = [...this.template_list];
console.log(this.template_list, "this.template_list,update");
if (this.selectedLangs == "en-us") {
- tips = "Success updated."
+ tips = "Successfully updated."
} else if (this.selectedLangs == "zh-hans") {
tips = "更新成功。"
} else if (this.selectedLangs == "zh-hant") {
@@ -246,13 +255,13 @@
this.template_list.splice(index, 1);
this.template_list = [...this.template_list];
if (this.selectedLangs == "en-us") {
- tips = "Success deleted."
+ tips = "Successfully deleted."
} else if (this.selectedLangs == "zh-hans") {
tips = "删除成功。"
} else if (this.selectedLangs == "zh-hant") {
tips = "刪除成功。"
}
- this.notificationService.success('"' + name + '"' + tips);
+ this.notificationService.success(tips);
} else {
console.log("Fail deleted template");
if (this.selectedLangs == "en-us") {
@@ -262,7 +271,7 @@
} else if (this.selectedLangs == "zh-hant") {
tips = "刪除失敗。"
}
- this.notificationService.error('"' + name + '"' + tips);
+ this.notificationService.error(tips);
}
modalRef.close();
@@ -298,7 +307,7 @@
console.log(JSON.stringify(res).length,"JSON.stringify(res).length");
if (JSON.stringify(res).length<=2) {
if (this.selectedLangs == "en-us") {
- tips = "Success deploy."
+ tips = "deploy successful."
} else if (this.selectedLangs == "zh-hans") {
tips = "部署成功。"
} else if (this.selectedLangs == "zh-hant") {
@@ -307,7 +316,7 @@
this.notificationService.success('"' + name + '"' + tips);
} else {
if (this.selectedLangs == "en-us") {
- tips = "Fail deleted."
+ tips = "deploy fail."
} else if (this.selectedLangs == "zh-hans") {
tips = "部署失败。"
} else if (this.selectedLangs == "zh-hant") {
diff --git a/components/datalake-handler/admin/src/src/styles.css b/components/datalake-handler/admin/src/src/styles.css
index 94a04d9..8dcf761 100644
--- a/components/datalake-handler/admin/src/src/styles.css
+++ b/components/datalake-handler/admin/src/src/styles.css
@@ -65,7 +65,7 @@
font-family: "Open Sans", sans-serif;
font-weight: 400;
font-size: 14px;
- letter-spacing: 0.6px;
+ letter-spacing: 1px;
color: #ffffff;
text-align: left;
}
@@ -82,7 +82,7 @@
.menu .navbar-expand-lg .navbar-nav .nav-link {
color: #ffffff;
- padding-left: 20px;
+ /*padding-left: 20px;*/
padding-right: 20px;
}
@@ -601,3 +601,14 @@
.p-1 .alert-delete-content {
padding: 1.25rem 4.5rem !important;
}
+ngb-modal-window.templatess .modal-dialog-centered {
+ max-width: 900px !important;
+ overflow: auto !important;
+}
+.close-btn-icon{
+ color: #b5b6b8;
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+ float: right;
+ cursor: pointer;
+}