Commit e1ff90e4 authored by wangqinghua's avatar wangqinghua

directive

parent bdaebc34
......@@ -35,7 +35,6 @@
<nz-table #nzTable [nzData]="dataSet" nzSingleSort [nzLoading]="isLoading" [nzShowPagination]="false">
<thead>
<tr>
<th [nzChecked]="allChecked"></th>
<th>名称</th>
<th>状态</th>
<th>关联网站</th>
......@@ -43,69 +42,39 @@
</tr>
</thead>
<tbody>
<ng-template ngFor let-data [ngForOf]="nzTable.data">
<ng-template ngFor let-item [ngForOf]="expandDataCache[data.host]">
<tr *ngIf="(item.parent&&item.parent.expand)||!(item.parent)">
<!--父级-->
<ng-container *ngIf="!item.level">
<td></td>
<td [nzIndentSize]="item.level*20" nzShowExpand [nzExpand]='item.expand'
(nzExpandChange)="getChildren(item)">
<span>{{item.name}}</span>
</td>
</ng-container>
<!--子集-->
<ng-container *ngIf="item.level">
<td nzShowCheckbox [nzIndeterminate]="indeterminate"
(nzCheckedChange)="selectChecked($event,item)" [(nzChecked)]="item.checked"></td>
<td class="cursor main-color" [nzIndentSize]="item.level*20">
<span (click)="goDetail(item)">{{item.name}}</span>
</td>
</ng-container>
<td class="round-tag tag-form">
<ng-container *ngIf="item.status == 0">
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 2 || item.status == 3">
<nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 4 || item.status == 5">
<nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
</ng-container>
</td>
<td class="cursor">
<span (click)="goTOInventory(item?.inventory?.id)">{{item?.inventory?.name}}</span>
</td>
<td class="handle main-color">
<ng-container *ngIf="!item.level">
<span (click)="showBasicEditModal(item)">添加资源</span>
<span (click)="updateGroup(item)">编辑</span>
<span (click)="showDeleteGroupConfirm(item)">删除</span>
</ng-container>
<ng-container *ngIf="item.level">
<span (click)="showBasicCheckModal(item.hostid,item.host)">添加监测点</span>
<span (click)="editBasicModal(item)">编辑</span>
<span (click)="showDeleteConfirm(item)">删除</span>
<nz-dropdown [nzTrigger]="'click'" class="table-dropdown">
<a nz-dropdown>更多 <i class="anticon anticon-down main-color"></i>
</a>
<ul nz-menu nzSelectable>
<li *ngIf="!item.monitorTask" (click)="showTempStop(item)" nz-menu-item><a>临时暂停</a></li>
<li (click)="openHost(item)" nz-menu-item><a>
<ng-container *ngIf="item.status == 1">开启</ng-container>
<ng-container *ngIf="item.status == 0">停止</ng-container>
监控
</a></li>
<li nz-menu-item (click)="goDetail(item)"><a>查看监测点</a></li>
<li (click)="showAlarm(item)" nz-menu-item><a>添加告警</a></li>
</ul>
</nz-dropdown>
</ng-container>
</td>
</tr>
</ng-template>
</ng-template>
<ng-template ngFor let-data [ngForOf]="nzTable.data">
<ng-template ngFor let-item [ngForOf]="expandDataCache[data.host]">
<tr *ngIf="(item.parent&&item.parent.expand)||!(item.parent)">
<td [nzIndentSize]="item.level*20" nzShowExpand [nzExpand]='item.expand' (nzExpandChange)="getChildren(item)">
<span (click)="showEditModal(item)" class="main-color cursor">{{item.name}}</span>
</td>
<td class="round-tag tag-form">
<ng-container *ngIf="item.status == 0">
<nz-tag class="tag-green" [nzColor]="color.green"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 2 || item.status == 3">
<nz-tag class="tag-yellow" [nzColor]="color.yellow"></nz-tag>
</ng-container>
<ng-container *ngIf="item.status == 4 || item.status == 5">
<nz-tag class="tag-red" [nzColor]="color.red"></nz-tag>
</ng-container>
</td>
<td class="cursor">
<span (click)="goTOInventory(item?.inventory?.id)">{{item?.inventory?.name}}</span>
</td>
<td class="handle main-color">
<span (click)="showBasicEditModal(item)">添加子节点</span>
<ng-container *ngIf="!item.level">
<span (click)="showBasicEditModal(item)">配置告警推送</span>
</ng-container>
<ng-container *ngIf="item.level">
<span (click)="editBasicModal(item)">编辑</span>
<span (click)="showDeleteConfirm(item)">移除</span>
</ng-container>
</td>
</tr>
</ng-template>
</ng-template>
</tbody>
</nz-table>
......
import {Component, OnInit, Output, ViewChild} from '@angular/core';
import {BusinessComponent} from '../modal/business/business.component';
import {BusinessService} from '../business.service';
import { BusinessService } from '../business.service';
import {TreeNodeInterface} from '../../overAll/basic/basic.component';
import {NzMessageService} from 'ng-zorro-antd';
import {color} from '../../app.constants';
......@@ -15,6 +15,7 @@ export class BConfigComponent implements OnInit {
sid; //节点id
color = color;
allChecked = false;
isLoading = false; //加载中
dataSet; //数据list
......@@ -23,21 +24,7 @@ export class BConfigComponent implements OnInit {
constructor(private busineSer:BusinessService,private message:NzMessageService) {
}
collapse(array: TreeNodeInterface[], data: TreeNodeInterface, $event: boolean): void {
if ($event === false) {
if (data.children) {
data.children.forEach(d => {
const target = array.find(a => a.host === d.host);
target.expand = false;
this.collapse(array, target, false);
});
} else {
return;
}
}
}
convertTreeToList(root: any, groupId: string, index): TreeNodeInterface[] {
convertTreeToList(root: any, serviceid: string, index): TreeNodeInterface[] {
const stack = [];
const array = [];
const hashMap = {};
......@@ -52,7 +39,7 @@ export class BConfigComponent implements OnInit {
this.visitNode(node, hashMap, array);
if (node.list) {
for (let i = node.list.length - 1; i >= 0; i--) {
stack.push({...node.list[i], level: node.level + 1, expand: true, parent: node, gId: groupId, checked: false});
stack.push({...node.list[i], level: node.level + 1, expand: true,serviceid: serviceid, parent: node, checked: false});
}
}
}
......@@ -69,7 +56,7 @@ export class BConfigComponent implements OnInit {
toTree(index) {
this.dataSet.forEach(item => {
this.expandDataCache[item.host] = this.convertTreeToList(item, item.id, index);
this.expandDataCache[item.host] = this.convertTreeToList(item, item.serviceid, index);
});
}
......@@ -89,7 +76,7 @@ export class BConfigComponent implements OnInit {
if(res.errCode == 10000){
this.dataSet = res.data;
this.dataSet.forEach((e,index)=>{
e.service = index;
e.host = index;
e.checked = false;
})
this.toTree(null);
......@@ -100,9 +87,43 @@ export class BConfigComponent implements OnInit {
)
}
//
getChildren(item){
if (item.list) {
if (item.expand) {
item.expand = false;
} else {
item.expand = true;
}
return false;
}
this.isLoading = true;
const data = {
"sid":item.serviceid,
};
this.busineSer.findChild(data).subscribe(
(res)=>{
if (res.data) {
this.dataSet[item.host].list = res.data;
this.toTree(item.host);
} else {
this.dataSet[item.host].list = [];
this.toTree(item.host);
this.message.info('该分组下无资源');
}
this.isLoading = false;
}
)
}
//添加业务
showAddModal() {
this.smartBusiness.showModal('添加业务');
}
//编辑业务
showEditModal(item){
this.smartBusiness.showEditModal("编辑业务",item)
}
}
......@@ -9,9 +9,20 @@
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="7" nzRequired nzFor="parentid">上层服务</nz-form-label>
<nz-form-control [nzSpan]="12">
<nz-select id="parentid" formControlName="parentid" nzPlaceHolder="上层服务">
<nz-option nzValue="1" nzLabel="问题,至少有一个问题"></nz-option>
<nz-option nzValue="2" nzLabel="问题,都有问题"></nz-option>
<nz-option nzValue="0" nzLabel="不计算"></nz-option>
</nz-select>
<nz-form-explain *ngIf="validateForm.get('algorithm').dirty && validateForm.get('parentid').errors">请选择用于计算服务状态的算法!</nz-form-explain>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="7" nzRequired nzFor="algorithm">状态计算算法</nz-form-label>
<nz-form-control [nzSpan]="12">
<nz-select nzAllowClear id="algorithm" formControlName="algorithm" nzPlaceHolder="状态计算算法">
<nz-select id="algorithm" formControlName="algorithm" nzPlaceHolder="状态计算算法">
<nz-option nzValue="1" nzLabel="问题,至少有一个问题"></nz-option>
<nz-option nzValue="2" nzLabel="问题,都有问题"></nz-option>
<nz-option nzValue="0" nzLabel="不计算"></nz-option>
......
......@@ -19,6 +19,7 @@ export class BusinessComponent implements OnInit {
validateForm: FormGroup;
checked = false; //选择SLA
serviceId;
groupid;
......@@ -47,8 +48,9 @@ export class BusinessComponent implements OnInit {
algorithm: [''],
showsla: ['99.9000'],
sortorder: ['1'],
parentid: ['1'],
});
this.validateForm.get('showsla').disable();
// this.validateForm.get('showsla').disable();
}
showModal(title): void {
......@@ -58,8 +60,8 @@ export class BusinessComponent implements OnInit {
showEditModal(title,item){
this.title = title;
this.serviceId = item.serviceid;
this.isVisiable = true;
this.groupid = item.groupid;
this.validateForm.patchValue(item);
}
......@@ -81,7 +83,14 @@ export class BusinessComponent implements OnInit {
}
create() {
this.busineSer.createService(this.validateForm.value).subscribe(
const data = {
algorithm:0,
name:'新增',
sortorder:0,
showsla:0,
parentid:7
}
this.busineSer.createService(data).subscribe(
(res) => {
if (res.errCode == 10000) {
this.message.info('添加成功');
......@@ -101,7 +110,8 @@ export class BusinessComponent implements OnInit {
groupid:this.groupid,
groupDescribe:this.validateForm.value.groupDescribe,
name:this.validateForm.value.name
}
};
this.busineSer.updateService(data).subscribe(
(res) => {
if (res.errCode == 10000) {
......
......@@ -85,7 +85,7 @@
<span>节点名称:<label name="node_name"></label></span>
<span>当前时间:<label name="current_time"></label></span>
</div>
<canvas class="topology-context" id="topology-canvas" #topologyCanvas style="height: 580px;width: 100%">
<canvas class="topology-context" id="topology-canvas" width="1190" height="520" #topologyCanvas>
您的浏览器不支持HTML5!
</canvas>
<div class="lineList">
......
......@@ -124,7 +124,8 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
value:''
};
constructor(private topologySer: TopologyService, private message: NzMessageService, private localStorage:LocalStorageService,private differs: KeyValueDiffers,
constructor(private topologySer: TopologyService, private message: NzMessageService,
private differs: KeyValueDiffers,
private sanitizer: DomSanitizer, private modalSer: NzModalService) {
}
......@@ -141,9 +142,29 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
ngAfterViewInit() {
const canvasWidth = this.topologyBody.nativeElement.clientWidth;
const canvasHeight = this.topologyBody.nativeElement.clientHeight;
let myCanvas = this.topologyCanvas.nativeElement;
let context = myCanvas.getContext('2d');
let ratio = this.getPixelRatio(context);
myCanvas.style.width = canvasWidth + 'px';
myCanvas.style.height = canvasHeight + 'px';
myCanvas.width = myCanvas.width * ratio;
myCanvas.height = myCanvas.height * ratio;
context.scale(ratio,ratio);
editor.loadTopology('','', 'img/backimg.png',canvasWidth,canvasHeight);
}
// 获取像素比
getPixelRatio(context){
const backingStore = context.backingStorePixelRatio ||
context.webkitBackingStorePixelRatio ||
context.mozBackingStorePixelRatio ||
context.msBackingStorePixelRatio ||
context.oBackingStorePixelRatio ||
context.backingStorePixelRatio || 1;
return (window.devicePixelRatio || 1) / backingStore;
}
ngDoCheck(){
this.node.value = localStorage.getItem('node');
this.line.value = localStorage.getItem('line');
......@@ -339,7 +360,6 @@ export class NeTopologyComponent implements OnInit, DoCheck, AfterViewInit, OnDe
//回显拓扑图
viewTopology(topologyJson){
console.log(topologyJson);
const arr = topologyJson.childs[0].childs;
const list = [];
const hostIds = [];
......
......@@ -35,7 +35,7 @@
</div>
</div>
<nz-table #nzTable [nzData]="childrenList" [nzShowPagination]="true">
<nz-table #nzTable [nzData]="childrenList" [nzShowPagination]="true" [nzLoading]="isLoading">
<thead>
<tr>
<th nzShowCheckbox [nzIndeterminate]="indeterminate" [nzChecked]="allChecked" (nzCheckedChange)="checkAll($event)"></th>
......
......@@ -20,6 +20,7 @@ export class ChildAssetsComponent implements OnInit {
childId;
childrenList;
childName;
isLoading = false;
allChecked = false;
selectList = [];
......@@ -38,7 +39,10 @@ export class ChildAssetsComponent implements OnInit {
}
checkAll(value: boolean): void {
this.childrenList.forEach(data => data.checked = value);
this.childrenList.forEach(data => {
data.checked = value;
this.selectList.push(data);
})
this.refreshStatus();
}
......@@ -71,15 +75,18 @@ export class ChildAssetsComponent implements OnInit {
}
getList() {
this.isLoading = true;
this.workSer.findInventory(this.childId).subscribe(
(res) => {
this.childrenList = res.data;
this.isLoading = false;
}
);
}
//删除资产--单个
deleteInVentory(item){
this.isLoading = true;
const data = {
inventoryIds:[]
};
......@@ -93,6 +100,7 @@ export class ChildAssetsComponent implements OnInit {
}else{
this.message.error(res.errMsg);
}
this.isLoading = false;
}
)
})
......@@ -104,6 +112,7 @@ export class ChildAssetsComponent implements OnInit {
this.message.warning("请选择需要删除的资产");
return false;
}
this.isLoading = true;
const data = {
inventoryIds:this.selectList.map(e=>{
return e.id;
......@@ -118,6 +127,7 @@ export class ChildAssetsComponent implements OnInit {
}else{
this.message.error(res.errMsg);
}
this.isLoading = false;
}
)
})
......
......@@ -199,6 +199,9 @@
position: relative;
background: #fff;
}
/*#topology-canvas{*/
/*transform: scale(0.5);*/
/*}*/
/********** 顶部工具栏 **********/
.toolbar-icon {
......
......@@ -514,9 +514,9 @@ TopologyEditor.prototype.init = function (topologyGuid, backImg, topologyJson,ca
}
this.topologyGuid = topologyGuid
// 创建jTopo舞台屏幕对象
var canvas = document.getElementById('topology-canvas')
canvas.width = canvasWidth;
canvas.height = canvasHeight;
var canvas = document.getElementById('topology-canvas');
// canvas.width = canvasWidth;
// canvas.height = canvasHeight;
// 加载空白的编辑器
if (topologyJson === '-1') {
this.stage = new JTopo.Stage(canvas) // 定义舞台对象
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment