diff options
Diffstat (limited to 'rulemgt-frontend/src/app')
15 files changed, 1211 insertions, 0 deletions
diff --git a/rulemgt-frontend/src/app/app.component.ts b/rulemgt-frontend/src/app/app.component.ts new file mode 100644 index 0000000..aa1b236 --- /dev/null +++ b/rulemgt-frontend/src/app/app.component.ts @@ -0,0 +1,43 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Component, OnInit } from '@angular/core'; +import { TranslateService } from '@ngx-translate/core'; + +@Component({ + selector: 'remote-config', + templateUrl: './pages/remote.component.html', +}) +export class AppComponent implements OnInit { + constructor(private translate: TranslateService) { } + getLanguage(): string { + let rtnLanguage = localStorage.getItem('language-option'); + if (rtnLanguage == 'null' || rtnLanguage == null) { + rtnLanguage = window.navigator.language; + } + if (rtnLanguage.startsWith('en')) { + return 'en'; + } else { + return 'zh'; + } + } + + ngOnInit(): void { + this.translate.addLangs(['en', 'zh']); + this.translate.setDefaultLang('zh'); + let language = this.getLanguage(); + this.translate.use(language); + } +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/app.module.ts b/rulemgt-frontend/src/app/app.module.ts new file mode 100644 index 0000000..670c9b3 --- /dev/null +++ b/rulemgt-frontend/src/app/app.module.ts @@ -0,0 +1,59 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { NgModule } from '@angular/core'; +import { BrowserModule } from '@angular/platform-browser'; +import { FormsModule } from '@angular/forms'; +import { routing } from './app.routing'; +import { AppComponent } from './app.component'; +import { AlarmRule } from './correlation-ruleList/alarmRule.component'; +import { RuleInfo } from './correlation-ruleInfo/ruleInfo.component'; +import { ModalService } from './correlation-modal/modal.service'; +import { HttpModule, Jsonp } from '@angular/http'; +import { HttpClientModule, HttpClient } from '@angular/common/http'; +import { AlarmRuleService } from './correlation-ruleList/alarmRule.service'; +import { TranslateModule, TranslateLoader } from '@ngx-translate/core'; +import { TranslateHttpLoader } from '@ngx-translate/http-loader'; +import { SifModalComponent } from './correlation-modal/modal.component'; + +export function HttpLoaderFactory(http: HttpClient): TranslateHttpLoader { + return new TranslateHttpLoader(http, './assets/i18n/', '.json'); +} + +@NgModule({ + imports: [ + BrowserModule, + FormsModule, + HttpModule, + HttpClientModule, + routing, + TranslateModule.forRoot({ + loader: { + provide: TranslateLoader, + useFactory: HttpLoaderFactory, + deps: [HttpClient] + } + }), + ], + declarations: [ + AppComponent, + AlarmRule, + RuleInfo, + SifModalComponent + ], + providers: [ModalService, AlarmRuleService, Jsonp], + bootstrap: [AppComponent] +}) +export class AppModule { }
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/app.routing.ts b/rulemgt-frontend/src/app/app.routing.ts new file mode 100644 index 0000000..3502167 --- /dev/null +++ b/rulemgt-frontend/src/app/app.routing.ts @@ -0,0 +1,40 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { ModuleWithProviders } from '@angular/core'; +import { Routes, RouterModule } from '@angular/router'; +import {AlarmRule} from './correlation-ruleList/alarmRule.component'; +import {RuleInfo} from './correlation-ruleInfo/ruleInfo.component' +const appRoutes: Routes = [ + { + path: 'alarmRule', + component:AlarmRule + }, + { + path: 'ruleInfo', + component: RuleInfo + }, + { + path: 'ruleInfo/:id', + component: RuleInfo + }, + { + path:'', + redirectTo:'alarmRule', + pathMatch: 'full' + }, + +]; +export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes,{ useHash: true }); diff --git a/rulemgt-frontend/src/app/correlation-modal/modal.component.html b/rulemgt-frontend/src/app/correlation-modal/modal.component.html new file mode 100644 index 0000000..16f61e8 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-modal/modal.component.html @@ -0,0 +1,31 @@ +<!-- + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div class="modal fade in" id="myModal" #sifModal> + <div class="modal-dialog"> + <div class="modal-content"> + <div class="modal-header"> + <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> + <h4 class="modal-title">{{modalTitle|translate}}</h4> + </div> + <div class="modal-body"> + <p>{{modalBodyMessage|translate}}</p> + </div> + <div class="modal-footer"> + <button type="button" class="btn btn-primary" data-dismiss="modal">{{closeBtnTitle|translate}}</button> + </div> + </div> + </div> +</div>
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-modal/modal.component.ts b/rulemgt-frontend/src/app/correlation-modal/modal.component.ts new file mode 100644 index 0000000..d2861bf --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-modal/modal.component.ts @@ -0,0 +1,43 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Component, Input, OnInit } from '@angular/core'; +import { ModalService } from './modal.service'; +import { Msg } from './msg'; +declare var $: any; +@Component({ + + selector: 'sif-modal', + templateUrl: './modal.component.html', + +}) +export class SifModalComponent implements OnInit { + constructor(private modalServer: ModalService) { }; + private modalTitle = 'modalTitleDefault'; + modalBodyMessage = 'modalBodyMessageDefault'; + closeBtnTitle = 'closeBtnTitleDefault'; + + ngOnInit(): void { + this.modalServer.getmodalObservable.subscribe((msg: Msg) => { + console.log('receive ' + msg); + this.modalTitle = msg.title || this.modalTitle; + this.modalBodyMessage = msg.message || this.modalBodyMessage; + this.closeBtnTitle = msg.btn || this.closeBtnTitle; + $('#myModal').modal('show'); + }); + } + + +} diff --git a/rulemgt-frontend/src/app/correlation-modal/modal.service.ts b/rulemgt-frontend/src/app/correlation-modal/modal.service.ts new file mode 100644 index 0000000..d851d52 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-modal/modal.service.ts @@ -0,0 +1,24 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Subject } from 'rxjs'; +import { Injectable } from '@angular/core'; +@Injectable() +export class ModalService { + private modalObservable = new Subject(); + get getmodalObservable() { + return this.modalObservable; + } +} diff --git a/rulemgt-frontend/src/app/correlation-modal/msg.ts b/rulemgt-frontend/src/app/correlation-modal/msg.ts new file mode 100644 index 0000000..8608dc1 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-modal/msg.ts @@ -0,0 +1,20 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +export interface Msg { + title?: string; + message: string; + btn?: string; +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.html b/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.html new file mode 100644 index 0000000..6378429 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.html @@ -0,0 +1,155 @@ +<!-- + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div class="container" style="margin-top: 20px"> + <form #ruleForm="ngForm" class="form-group row" (submit)="onSubmit(ruleName)"> + <div class="form-body"> + <div class="row form-group col-xs-12 "> + <label for="userName" class="col-xs-2 col-form-label labelstyle"> + <span>{{"field_rule_name_Add_Page"|translate}}</span> + <span style="color: red">*</span> + </label> + <div class="col-xs-6" style="margin-left: -100px"> + <input class="form-control ng-pristine ng-untouched ng-invalid ng-invalid-required" style="width: 60%" type="text" name="rulename" + [(ngModel)]="queryRule.ruleName" id="ruleNameInput" readonly="{{addBottonStatus}}" #ruleName="ngModel" + required> + </div> + </div> + + <div class="row form-group col-xs-12"> + <label for="userName" class="col-xs-2 col-form-label labelstyle"> + <span>{{"field_description"|translate}}</span> + </label> + <div class="col-xs-6" style="margin-left: -100px"> + <input class="form-control ng-untouched ng-pristine ng-valid" readonly="{{addBottonStatus}}" style="width: 60%" type="text" + [(ngModel)]="queryRule.loopControlName" name="description"> + </div> + </div> + + <div class="row form-group col-xs-12"> + <label for="userName" class="col-xs-2 col-form-label labelstyle"> + <span>{{"field_description"|translate}}</span> + </label> + <div class="col-xs-6" style="margin-left: -100px"> + <input class="form-control ng-untouched ng-pristine ng-valid" readonly="{{addBottonStatus}}" style="width: 60%" type="text" + [(ngModel)]="queryRule.description" name="description"> + </div> + </div> + + <div id="state" class="row form-group col-xs-12"> + <label class="col-xs-2 col-form-label labelstyle"> + <span>{{"common_status"|translate}}</span> + </label> + + <div class="col-xs-6" style="margin-left: -113px"> + <div *ngIf="queryRule.enabled == 0"> + <div class="col-xs-3" > + <input class="magic-radio" type="radio" name="radio" [(ngModel)]="queryRule.enabled" value='0'> + <label for="radio1" >{{"common_off"|translate}}</label> + </div> + <div class="col-xs-3" > + <input class="magic-radio" type="radio" name="radio" [(ngModel)]="queryRule.enabled" value='1'> + <label for="radio1" (click)="switch()">{{"common_on"|translate}}</label> + </div> + </div> + <div *ngIf="queryRule.enabled == 1"> + <div class="col-xs-3" > + <input class="magic-radio" type="radio" name="radio" [(ngModel)]="queryRule.enabled" value='0'> + <label for="radio1" (click)="switch()">{{"common_off"|translate}}</label> + </div> + <div class="col-xs-3" > + <input class="magic-radio" type="radio" name="radio" [(ngModel)]="queryRule.enabled" value='1'> + <label for="radio1" >{{"common_on"|translate}}</label> + </div> + </div> + </div> + </div> + + <div class="row form-group col-xs-12"> + <label for="" class="col-xs-2 col-form-label labelstyle"> + <span>{{"common_file"|translate}}</span> + </label> + <div class="col-xs-6" style="margin-left: -100px"> + <div class="btn-group btn-group-circle"> + <span class="importDivArea mmlBatchBtnBar"> + <button class="btn btn-info" id="importBtn" disabled="{{addBottonStatus}}"> + <span class="ict-import"></span> + <span>{{"import"|translate}}</span> + </button> + <div id="importDiv" class="container upload"> + <form id="fileupload" #fileForm="ngForm" role="form" enctype="multipart/form-data"> + <div class="file-preview"> + <div id="dropzone" class="file-drop-zone"> + <div class="file-drop-zone-title"> + <span>{{"file_import"|translate}}</span> + </div> + </div> + </div> + + <div class="input-group fileupload-btn"> + <div id="fileName" class="form-control file-caption">task2.zip</div> + <span class="input-group-btn" id="btnGroup"> + <span class="btn btn-primary fileinput-button white radius_s blue1-active" id="browse" data-placement="bottom" data-toggle="tooltip"> + <span class="importBtnFontSize">{{"common_browse"|translate}}</span> + <input type="file" name="file" title=" " accept=".txt" multiple=""> + </span> + <button id="fileremove" class="btn btn-default" type="button"> + <span class="importBtnFontSize">{{"common_remove"|translate}}</span> + </button> + <button id="filesubmit" class="btn btn-default" type="button">{{"common_confirm"|translate}}</button> + </span> + </div> + + </form> + </div> + </span> + </div> + </div> + </div> + + <div class="row form-group col-xs-12"> + <label for="" class="col-xs-2 col-form-label labelstyle"> + <span>{{"message_rule_content"|translate}}</span> + <span style="color: red">*</span> + </label> + <div class="col-xs-8" style="margin-left: -100px"> + <div class="form-group"> + <textarea id="cmds" class="form-control" readonly="{{addBottonStatus}}" [(ngModel)]="queryRule.content" name="content" rows="12" + cols="80" required placeholder="package example;"> + </textarea> + + </div> + </div> + </div> + + <div class="row form-group col-xs-12 " style="margin-left: 73px"> + <div class="col-xs-8 "> + <label class="myclass" id="checkLabel"> + <button type="button" (click)="checkContent('check')" disabled="{{addBottonStatus}}" class="btn btn-info">{{"common_check"|translate}}</button> + </label> + <label class="myclass" id="updateLabel"> + <button type="button" disabled="{{addBottonStatus}}" class="btn btn-info" (click)="update()">{{"common_update"|translate}}</button> + </label> + <label class="myclass" id="saveLabel"> + <button type="submit" disabled="{{addBottonStatus}}" class="btn btn-info">{{"common_save"|translate}}</button> + </label> + <label class="myclass" id="cancelLabel"> + <button type="button" routerLink='/alarmRule' class="btn btn-info">{{"common_cancel"|translate}}</button> + </label> + </div> + </div> + </div> + </form> +</div>
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.ts b/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.ts new file mode 100644 index 0000000..7f8d375 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleInfo/ruleInfo.component.ts @@ -0,0 +1,297 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the 'License'); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an 'AS IS' BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Component, OnInit, Input } from '@angular/core'; +import { RuleModel } from '../correlation-ruleList/alarmRule'; +import { ActivatedRoute, Params, Router } from '@angular/router'; +import { AlarmRuleService } from '../correlation-ruleList/alarmRule.service'; +import { Http, Response, Headers } from '@angular/http'; +import { ModalService } from '../correlation-modal/modal.service'; +import { NgModel } from '@angular/forms'; +declare var $: any; +@Component({ + selector: 'RuleInfo', + templateUrl: './ruleInfo.component.html' +}) +export class RuleInfo implements OnInit { + formModel: RuleModel; + queryRule: RuleModel; + id: number; + addBottonStatus: boolean; + constructor(private modalService: ModalService, private route: ActivatedRoute, private router: Router, private alarmRuleService: AlarmRuleService, http: Http) { }; + + update() { + this.queryRule.enabled = $('input:radio:checked').val(); + if (!this.queryRule.content.startsWith('package ')) { + let msg = { title: 'exception_content_error', message: 'exception_package_error' }; + this.modalService.getmodalObservable.next(msg); + } else { + + this.alarmRuleService.checkContent(this.queryRule.content) + .then(res => { + if (res.status == 200) { + this.alarmRuleService.updateRule(this.queryRule) + .then(res => { + if (res.status == 200) { + let msg = { title: 'modalTitleUpdate', message: 'message_update_rule_success' }; + this.modalService.getmodalObservable.next(msg); + this.router.navigate(['alarmRule']); + } else if (res.status == 499) { + let msg = { title: 'modalTitleUpdate', message: 'message_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + } else { + let msg = { title: 'modalTitleUpdate', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + } + }).catch( + res => { + let msg = { title: 'modalTitleUpdate', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + } + ); + + } else if (res.status == 499) { + let msg = { 'title': 'modalTitleCheck', message: 'message_rule_content_repeat_error' }; + this.modalService.getmodalObservable.next(msg); + return false; + } else { + let msg = { 'title': 'modalTitleCheck', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + return false; + } + }) + } + } + + onSubmit(obj: NgModel) { + this.save(); + } + + save() { + if (!this.queryRule.content.startsWith('package ')) { + let msg = { title: 'exception_content_error', message: 'exception_package_error' }; + this.modalService.getmodalObservable.next(msg); + } else { + this.alarmRuleService.checkContent(this.queryRule.content).then(res => { + if (res.status == 200) { + this.alarmRuleService.save(this.queryRule).then(res => { + if (res.status == 200) { + let msg = { title: 'modalTitleDefault', message: 'message_add_rule_success' }; + this.modalService.getmodalObservable.next(msg); + this.router.navigate(['alarmRule']); + } else if (res.status == 499) { + let msg = { title: 'modalTitleDefault', message: 'message_rule_name_repeat_error' }; + this.modalService.getmodalObservable.next(msg); + } else { + let msg = { 'title': 'modalTitleCheck', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + } + + }).catch(error => { + let msg = { title: 'modalTitleDefault', message: 'message_rule_name_repeat_error' }; + this.modalService.getmodalObservable.next(msg); + }); + return true; + } else if (res.status == 499) { + let msg = { 'title': 'modalTitleCheck', message: 'message_rule_content_repeat_error' }; + this.modalService.getmodalObservable.next(msg); + return false; + } else { + let msg = { 'title': 'modalTitleCheck', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + return false; + } + }) + } + } + + getRuleInfo(id: string): void { + this.route.params.switchMap((params: Params) => this.alarmRuleService.search(id)) + .subscribe(rule => { + rule[0].enabled = '' + rule[0].enabled; + this.queryRule = rule[0] + }) + } + + checkContent(judge: string): void { + if (!this.queryRule.content.startsWith('package ')) { + let msg = { title: 'exception_content_error', message: 'exception_package_error' }; + this.modalService.getmodalObservable.next(msg); + } else { + this.alarmRuleService.checkContent(this.queryRule.content) + .then(res => { + if (res.status == 200) { + let msg = { 'title': 'modalTitleCheck', message: 'message_checkContent_rule_success' }; + this.modalService.getmodalObservable.next(msg); + } else if (res.status == 499) { + let msg = { 'title': 'modalTitleCheck', message: 'message_rule_content_repeat_error' }; + this.modalService.getmodalObservable.next(msg); + return false; + } else { + let msg = { 'title': 'modalTitleCheck', message: 'message_other_exception_rule_fail' }; + this.modalService.getmodalObservable.next(msg); + return false; + } + }); + } + } + switch(): void { + // alert(this.queryRule.enabled); + this.queryRule.enabled == '0' ? this.queryRule.enabled = '1' : this.queryRule.enabled = '0'; + } + + + initUpload(queryRule: RuleModel): void { + $('#fileName').text(''); + $('#importFailTip').addClass('hide_panel'); + $('#fileupload').fileupload({ + + dropZone: $('#dropzone'), + maxNumberOfFiles: 1, + maxChunkSize: 20000000, + autoUpload: false, + add: function (e, data) { + let fileName = data.files[0].name; + + $('#importFailTip').addClass('hide_panel'); + let suffix = fileName.substring(fileName.lastIndexOf('.'), fileName.length) + + if (suffix != '.txt') { + $('#importFailTip').removeClass('hide_panel'); + return suffix; + } + + $('#bar').css('width', '0%'); + $('#persent').text('0%'); + $('#fileName').text(fileName); + $('#fileremove').attr('disabled', false); + $('#filesubmit').attr('disabled', false); + $('#filesubmit').click(function () { + this.file = data.files[0] + var reader = new FileReader(); + reader.readAsText(this.file); + reader.onload = function (data) { + queryRule.content = this.result; + } + $('#fileremove').click(); + $('#importDiv').hide(); + e.stopPropagation(); + }); + + $('#fileremove').click(function () { + $('#bar').css('width', '0%'); + $('#persent').text('0%'); + $('#fileName').text(''); + $('#filesubmit').attr('disabled', true); + $('#fileremove').attr('disabled', true); + }); + }, + done: function (e, data) { + + }, + fail: function (e, resp) { + }, + always: function (e, data) { + $('.progress').removeClass('active'); + $('#bar').css('width', '100%'); + $('#persent').text('100%'); + }, + progressall: function (e, data) { + } + }); + } + + initImportDiv(queryRule: RuleModel): void { + this.initUpload(queryRule); + let importDiv = $('#importDiv'); + $(function (arg) { + $('#importBtn').click(function (e) { + e.preventDefault(); + $('[data-toggle="tooltip"]').tooltip(); + $('#importFailTip').addClass('hide_panel'); + showDiv(); + $(document).one('click', function (e) { + $(importDiv).hide(); + }); + e.stopPropagation(); + }); + $(importDiv).click(function (e) { + e.stopPropagation(); + }); + $('#filesubmit').attr('disabled', true); + $('#fileremove').attr('disabled', true); + }); + function showDiv() { + $('#bar').css('width', '0%'); + $('#persent').text('0%'); + $(importDiv).fadeIn(); + } + } + ngOnInit() { + this.formModel = { + ruleId: null, + ruleName: null, + description: null, + content: null, + createTime: null, + creator: null, + updateTime: null, + modifier: null, + enabled: null, + loopControlName: null + }; + this.queryRule = { + ruleId: null, + ruleName: null, + description: null, + content: null, + createTime: null, + creator: null, + updateTime: null, + modifier: null, + enabled: 0, + loopControlName: '' + }; + + this.route.params.subscribe((params) => { + + let id = params['id']; + if (typeof (id) == 'string') { + if (id.indexOf('&') == -1) { + $('#ruleNameInput').attr('disabled', true); + $('#saveLabel').hide(); + } else { + this.addBottonStatus = false; + $('#saveLabel').hide(); + $('#checkLabel').hide(); + $('#updateLabel').hide(); + } + + let str = id.split('&'); + this.getRuleInfo(str[0]); + } else if (typeof (id) != 'undefined') { + this.getRuleInfo(id); + } else { + $('#updateLabel').hide(); + } + if (typeof (this.queryRule.enabled) === 'number') { + this.queryRule.enabled = '' + this.queryRule.enabled; + } + }); + + this.initImportDiv(this.queryRule); + } + +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.html b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.html new file mode 100644 index 0000000..6e03db3 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.html @@ -0,0 +1,135 @@ +<!-- + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div class="container" style="margin-top: 20px"> + <form class="form-inline"> + <div class="form-body"> + <div class="row form-group col-xs-12"> + <div class="col-xs-4"> + <label class="col-xs-3 control-label" style="padding-top: 8px"> + {{"common_status"|translate}} + </label> + <select #selection class="form-control" style="width: 60%" id="status" (change)="switch(selection.value)" [(ngModel)]="activeText" + name="activestatus"> + <option *ngFor="let a of activeStatus" [value]="a">{{a|translate}}</option> + </select> + </div> + + <div class="col-xs-4"> + <label for="userName" class="col-xs-3 control-label" style="padding-top: 8px"> + <span>{{"common_keyword"|translate}}</span> + </label> + <input class="form-control ng-untouched ng-pristine ng-valid" style="width: 60%" placeholder='{{"field_rule_name_Add_Page"|translate}}' + type="text" [(ngModel)]="ruleModel.ruleName" name="name"> + </div> + + <div class="fmrule_btn_group display_table"> + <div class="inline"> + <button id="batchDeleteButton" class="btn btn-primary" (click)="searchRules()"> + <span class="glyphicon glyphicon-search" style="padding-top: 2px"></span> + <span>{{"common_query"|translate}}</span> + </button> + <button class="btn btn-secondary" (click)="reset()" style="margin-left: 10px"> + <span class="glyphicon glyphicon-refresh"></span> + <span>{{"common_reset"|translate}}</span> + </button> + </div> + </div> + </div> + + <div class="row form-group col-xs-12" style="margin-top: 10px"> + <div class=""> + <div class="inline"> + <button type="button" routerLink='/ruleInfo' class="btn btn-info"> + <span class="glyphicon glyphicon-plus"></span> + <span>{{"common_add"|translate}}</span> + </button> + </div> + </div> + </div> + </div> + + </form> + <div> + <div class="row form-group col-xs-12" style="margin-top: 20px">{{"common_total1"|translate}}{{totalcount}}{{"common_total2"|translate}}</div> + <table class="table table-bordered table-striped customtable table-hover"> + <thead class="nf_thead"> + <tr class="heading"> + <td>{{"field_rule_name_Add_Page"|translate}}</td> + <td>{{"common_status"|translate}}</td> + <td>{{"field_create_time"|translate}}</td> + <td>{{"field_creator"|translate}}</td> + <td>{{"field_update_time"|translate}}</td> + <td>{{"common_operator"|translate}}</td> + </tr> + </thead> + <tbody> + <tr *ngFor="let rule of rules"> + <td><a routerLink="/ruleInfo/{{rule.ruleId}}&add">{{rule.rulename}}</a></td> + <td [hidden]="rule.enabled === 1" style="text-align: center"><span value=1><img src="../../assets/thirdparty/images/round_off.png" alt=""></span></td> + <td [hidden]="rule.enabled === 0" style="text-align: center"><span value=0><img src="../../assets/thirdparty/images/round_on.png" alt=""></span></td> + <td>{{rule.createTime | date:'yyyy-MM-dd HH:mm:ss'}}</td> + <td>{{rule.creator}}</td> + <td>{{rule.updateTime | date:'yyyy-MM-dd HH:mm:ss'}}</td> + <td> + <span (click)="updateRule(rule); $event.stopPropagation()" style="cursor: pointer;margin: 0 5px"> + <img src="../../assets/thirdparty/images/edit.png" alt=""> + </span> + <span> + + </span> + <span [hidden]="rule.enabled===1" class="" (click)="on_off(rule); $event.stopPropagation()" style="cursor: pointer;margin: 0 5px"> + <img src="../../assets/thirdparty/images/on.png" alt=""> + </span> + <span [hidden]="rule.enabled===0" class="" (click)="on_off(rule); $event.stopPropagation()" style="cursor: pointer;margin: 0 5px"> + <img src="../../assets/thirdparty/images/off.png" alt=""> + </span> + + <span class="" id={{rule.ruleId}} (click)="delete(rule)" style="cursor: pointer;margin: 0 5px"> + <img src="../../assets/thirdparty/images/delete.png" alt=""> + </span> + </td> + </tr> + </tbody> + </table> + </div> + <div id="deleteTimingTaskDlg" style="display: none;"> + <div id="deleteTimingTaskContent"> + <div class="deletePromptMessage"> + <span>{{"message_is_delete"|translate}}</span> + </div> + <div style="float:rightl;padding-top: 10px;margin-bottom: -20px" class=""> + <button class="btn btnDefault btnmrg" data-popmodal-but="ok"> + <span>{{"common_confirm"|translate}}</span> + </button> + <button class="btn btnDefault btnmrg" type="button" data-popmodal-but="cancel"> + <span>{{"common_cancel"|translate}}</span> + </button> + </div> + </div> + </div> + + <div id="deleteActiveAlarmRuleDlg" style="display: none;"> + <div id="deleteActiveRuleContent"> + <div class="deletePromptMessage"> + <span>{{"warn_delete_info"|translate}}</span> + </div> + <div style="float:right;padding-top:10px"> + <button class="btn btnDefault btnmrg" data-popmodal-but="ok"> + <span>{{"common_confirm"|translate}}</span> + </button> + </div> + </div> + </div>
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.ts b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.ts new file mode 100644 index 0000000..65a5296 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.component.ts @@ -0,0 +1,172 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Component, OnInit, ViewChild, ViewEncapsulation } from '@angular/core'; +import { ModalService } from '../correlation-modal/modal.service'; +import { RuleModel } from './alarmRule'; +import { RuleRequest } from './ruleRequest'; +import { Router } from '@angular/router'; +import { Http, Response, Jsonp, Headers, RequestOptions } from '@angular/http'; +import { AlarmRuleService } from './alarmRule.service'; +declare var jQuery: any; + +@Component({ + selector: 'alarmRule', + templateUrl: './alarmRule.component.html', + +}) +export class AlarmRule implements OnInit { + ruleModel: RuleModel; + rules: RuleModel[]; + queryRule: RuleModel; + activeText: string; + ruleName: string; + enable_on = "enabled"; + enable_off = "disabled" + totalcount: number; + model: any; + ruleRequest: RuleRequest; + solution = 'ANGULAR'; + selection = 'A' + activeStatus = ["option_all", "common_enabled", "common_disabled"]; + + constructor(public _alarmRuleService: AlarmRuleService, private modalService: ModalService, + private router: Router) { }; + + switch(select: string): void { + console.log(select); + if (select == "common_enabled") { + this.ruleModel.enabled = 1; + } else if (select == "common_disabled") { + this.ruleModel.enabled = 0; + } else { + + this.ruleModel.enabled = null; + } + this.setActiveText(); + }; + + setActiveText(): void { + if (this.ruleModel.enabled == 1) { + this.activeText = "common_enabled"; + this.ruleRequest.enabled = 1; + } + else if (this.ruleModel.enabled == 0) { + this.activeText = "common_disabled"; + this.ruleRequest.enabled = 0; + } else { + this.activeText = "option_all"; + this.ruleRequest.enabled = null; + } + }; + + getRules(): Promise<any> { + return this._alarmRuleService + .getRules() + .then(rules => { + this.rules = rules.rules; + this.totalcount = rules.totalcount; + }); + } + + searchRules(): void { + if (this.ruleModel.enabled == null) { + this.ruleRequest.enabled = null; + } + this.ruleRequest.ruleName = this.ruleModel.ruleName; + console.log(this.ruleRequest.enabled, this.ruleRequest.ruleName); + + this._alarmRuleService + .searchrules(this.ruleRequest) + .then(rules => { + this.rules = rules; + this.totalcount = rules.length; + }); + } + updateRule(rule: RuleModel): void { + this.router.navigate(['ruleInfo/', rule.ruleId]); + } + + delete(rule: RuleModel): void { + rule.enabled == 1 ? this.deleteActiveRule(rule) : this.deleteModel(rule.ruleId, this._alarmRuleService, this); + } + + on_off(rule: RuleModel) { + rule.enabled == 0 ? rule.enabled = 1 : rule.enabled = 0; + this._alarmRuleService + .updateRule(rule) + .then(res => { + rule = res; + }); + } + + reset(): void { + this.ruleModel.ruleName = null; + this.activeText = 'option_all'; + this.ruleModel.enabled = null; + this.getRules(); + } + + deleteActiveRule(rule: RuleModel): void { + jQuery('#' + rule.ruleId).popModal({ + html: jQuery('#deleteActiveRuleContent'), + placement: 'leftTop', + showCloseBut: false, + onDocumentClickClose: true, + onOkBut: function () { + }, + }); + } + deleteModel(ruleId: string, alarm: AlarmRuleService, obj: any): void { + jQuery('#' + ruleId).popModal({ + html: jQuery('#deleteTimingTaskContent'), + placement: 'leftTop', + showCloseBut: false, + onDocumentClickClose: true, + onOkBut: function () { + jQuery('#deleteTimingTaskDlg').append(jQuery('#deleteTimingTaskContent')); + alarm.delete(ruleId); + obj.getRules(); + }, + onCancelBut: function () { + } + }); + } + + ngOnInit(): void { + this.activeText = 'option_all'; + this.ruleModel = { + ruleId: null, + ruleName: null, + description: '', + content: null, + createTime: null, + creator: null, + updateTime: null, + modifier: null, + enabled: 0, + loopControlName: '' + } + this.ruleRequest = { + ruleId: null, + ruleName: null, + creator: null, + modifier: null, + enabled: null, + loopControlName: '' + } + this.getRules(); + } +} diff --git a/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.service.ts b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.service.ts new file mode 100644 index 0000000..33ea713 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.service.ts @@ -0,0 +1,123 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +import { Injectable } from '@angular/core'; +import { Http, Response, Headers } from '@angular/http'; + + +import { RuleModel } from './alarmRule'; +import { RuleRequest } from './ruleRequest'; +import { Router } from '@angular/router'; +import { ModalService } from '../correlation-modal/modal.service'; + +@Injectable() +export class AlarmRuleService { + private ruleUrl = "/api/holmes-rule-mgmt/v1/rule"; + private headers = new Headers({ 'Content-Type': 'application/json' }); + constructor(private http: Http, private modalService: ModalService, private router: Router) { } + + getRules(): Promise<any> { + return this.http.get(this.ruleUrl) + .toPromise() + .then(res => res.json()) + .catch(this.handleError); + } + + private handleError(error: any): Promise<any> { + console.error('An error occurred', error); + return Promise.reject(error._body || error); + } + + search(ruleId: string): Promise<RuleModel> { + if (typeof (ruleId) == "string") { + let rule = [{ + ruleId: null, + ruleName: null, + description: null, + content: null, + createtime: null, + creator: null, + updatetime: null, + modifier: null, + enabled: 0, + }] + } + let data = { 'ruleId': ruleId }; + var queryrequest = JSON.stringify(data); + const url = `${this.ruleUrl}?queryrequest=${queryrequest}`; + return this.http.get(url, {headers:this.headers}) + .toPromise() + .then(res => res.json().rules as RuleModel) + .catch(this.handleError); + } + + searchrules(rule: RuleRequest): Promise<RuleModel[]> { + let data = { ruleName: rule.ruleName, enabled: rule.enabled } + console.log(JSON.stringify(data)); + const url = `${this.ruleUrl}?queryrequest=${JSON.stringify(data)}` + return this.http.get(url, { body: data, headers: this.headers }) + .toPromise() + .then(res => res.json().rules as RuleModel[]) + .catch(this.handleError); + } + + checkContent(ruleContent: string): Promise<any> { + const url = "/api/holmes-engine-mgmt/v1/rule"; + let data = { content: ruleContent }; + return this.http + .post(url, JSON.stringify(data), { headers: this.headers }) + .toPromise() + .then(res => res) + .catch(error => error); + } + + updateRule(rule: RuleModel): Promise<any> { + let rules = { + "ruleId": rule.ruleId, + "description": rule.description, + "content": rule.content, + "enabled": rule.enabled + } + const url = `${this.ruleUrl}` + return this.http + .post(url, JSON.stringify(rules), { headers: this.headers }) + .toPromise() + .then(res => res) + .catch(error => error) + } + + save(rule: RuleModel): Promise<any> { + let ruledata = { + "description": rule.description, + "content": rule.content, + "enabled": rule.enabled, + "ruleName": rule.ruleName + } + return this.http.put(this.ruleUrl, JSON.stringify(ruledata), { headers: this.headers }) + .toPromise() + .then(res => res) + .catch(error => error); + } + + public delete(ruleId: string): Promise<void> { + const url = `${this.ruleUrl}` + '/' + ruleId; + return this.http.delete(url, { headers: this.headers }) + .toPromise() + .then(res => { + + }) + .catch(this.handleError); + } +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.ts b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.ts new file mode 100644 index 0000000..9c36d30 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleList/alarmRule.ts @@ -0,0 +1,27 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +export class RuleModel { + ruleId: string; + ruleName: string; + description: string; + content: string; + createTime: Date; + creator: number; + updateTime: Date; + modifier: string; + loopControlName: string; + enabled?: any; +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/correlation-ruleList/ruleRequest.ts b/rulemgt-frontend/src/app/correlation-ruleList/ruleRequest.ts new file mode 100644 index 0000000..2719a90 --- /dev/null +++ b/rulemgt-frontend/src/app/correlation-ruleList/ruleRequest.ts @@ -0,0 +1,23 @@ +/* + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +*/ +export class RuleRequest { + ruleId: string; + ruleName: string; + creator: number; + modifier: string; + enabled: number; + loopControlName: string; +}
\ No newline at end of file diff --git a/rulemgt-frontend/src/app/pages/remote.component.html b/rulemgt-frontend/src/app/pages/remote.component.html new file mode 100644 index 0000000..2b5c8c3 --- /dev/null +++ b/rulemgt-frontend/src/app/pages/remote.component.html @@ -0,0 +1,19 @@ +<!-- + Copyright 2017 ZTE Corporation. + + Licensed under the Apache License, Version 2.0 (the "License"); + you may not use this file except in compliance with the License. + You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + + Unless required by applicable law or agreed to in writing, software + distributed under the License is distributed on an "AS IS" BASIS, + WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + See the License for the specific language governing permissions and + limitations under the License. +--> +<div class="tabzone"> +</div> +<sif-modal></sif-modal> +<router-outlet></router-outlet>
\ No newline at end of file |