design
This commit is contained in:
		
							parent
							
								
									31cd802b0f
								
							
						
					
					
						commit
						f45e6319f6
					
				@ -1,5 +1,10 @@
 | 
			
		||||
<of-probe-selector [probeHostID]="probeHostID" (select)="selectedProbe=$event"></of-probe-selector>
 | 
			
		||||
<of-probe-summary *ngIf="selectedProbe" @discoveryFilterAnim [probeHost]="selectedProbe"></of-probe-summary>
 | 
			
		||||
<h1>Discovery</h1>
 | 
			
		||||
<div class="ui-g">
 | 
			
		||||
  <div class="ui-g-12">
 | 
			
		||||
    <of-probe-selector [probeHostID]="probeHostID" (select)="selectedProbe=$event"></of-probe-selector>
 | 
			
		||||
    <of-probe-summary *ngIf="selectedProbe" @discoveryFilterAnim [probeHost]="selectedProbe"></of-probe-summary>
 | 
			
		||||
  </div>
 | 
			
		||||
</div>
 | 
			
		||||
<div class="ui-g">
 | 
			
		||||
  <div class="ui-g-12 ui-md-3">
 | 
			
		||||
    <p-accordion [multiple]="true">
 | 
			
		||||
@ -15,7 +20,7 @@
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <div class="ui-g-12 ui-md-9">
 | 
			
		||||
    <p-panel>
 | 
			
		||||
    <p-panel [showHeader]="false">
 | 
			
		||||
      <!-- <button class="ui-button-danger ui-button-width-fit" type="button" label="Stop" icon="ui-icon-close" pButton (click)="onRequestStop()"></button> -->
 | 
			
		||||
      <of-discovery-result #discoveryResult *ngIf="requested else info" 
 | 
			
		||||
      [probeHost]="selectedProbe" 
 | 
			
		||||
@ -28,7 +33,7 @@
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
<ng-template #info>
 | 
			
		||||
  <div style="min-height: 100vh">
 | 
			
		||||
  <div style="min-height: 100px">
 | 
			
		||||
    Network Discovery 설명 페이지
 | 
			
		||||
  </div>
 | 
			
		||||
</ng-template>
 | 
			
		||||
@ -1,11 +1,11 @@
 | 
			
		||||
<div class="ui-inputgroup">
 | 
			
		||||
  <span style="margin-right: 18px">{{title}} </span>
 | 
			
		||||
  <input [disabled]="fixed >= 0"type="text" pInputText placeholder="127" maxlength="3" [(ngModel)]="first" value="{{first}}" (keyup)="onIpInput($event)">
 | 
			
		||||
  <span class="ui-inputgroup-addon">.</span>
 | 
			
		||||
  <span class="ui-inputgroup-addon" style="min-width: 5px !important">.</span>
 | 
			
		||||
  <input [disabled]="fixed > 1" type="text" pInputText placeholder="0" maxlength="3" [(ngModel)]="second" value="{{second}}" (keyup)="onIpInput($event)">
 | 
			
		||||
  <span class="ui-inputgroup-addon">.</span>
 | 
			
		||||
  <span class="ui-inputgroup-addon" style="min-width: 5px !important">.</span>
 | 
			
		||||
  <input [disabled]="fixed > 2" type="text" pInputText placeholder="0" maxlength="3" [(ngModel)]="third" value="{{third}}" (keyup)="onIpInput($event)">
 | 
			
		||||
  <span class="ui-inputgroup-addon">.</span>
 | 
			
		||||
  <span class="ui-inputgroup-addon" style="min-width: 5px !important">.</span>
 | 
			
		||||
  <input type="text" pInputText placeholder="1" maxlength="3" [(ngModel)]="fourth" value="{{fourth}}" (keyup)="onIpInput($event)">
 | 
			
		||||
</div>
 | 
			
		||||
 | 
			
		||||
 | 
			
		||||
@ -1,16 +1,24 @@
 | 
			
		||||
<div *ngIf="discoverZone">
 | 
			
		||||
  <of-key-value [key]="'Host Range'" [value]="hostRange"></of-key-value>
 | 
			
		||||
  <of-key-value [key]="'Port Range'" [value]="portRange"></of-key-value>
 | 
			
		||||
  <span *ngIf="discoverZone.discoverHost.discoverPort.includeTCP">TCP</span>
 | 
			
		||||
  <span *ngIf="discoverZone.discoverHost.discoverPort.includeUDP">UDP</span>
 | 
			
		||||
 | 
			
		||||
  <div *ngIf="services.length > 0">
 | 
			
		||||
      <p-overlayPanel #op>
 | 
			
		||||
        <div *ngFor="let service of services">
 | 
			
		||||
          {{service}}
 | 
			
		||||
<div *ngIf="discoverZone" class="ui-key-value ui-left-info2">
 | 
			
		||||
    <div class="ui-g">
 | 
			
		||||
        <of-key-value [key]="'Host Range'" [value]="hostRange"></of-key-value>
 | 
			
		||||
        <of-key-value [key]="'Port Range'" [value]="portRange"></of-key-value>
 | 
			
		||||
        <div class="of-key-value-div">
 | 
			
		||||
            <span>Port type</span>
 | 
			
		||||
            <span class="ng-star-inserted ui-nopad">
 | 
			
		||||
                <span *ngIf="discoverZone.discoverHost.discoverPort.includeTCP">TCP</span>
 | 
			
		||||
                <span *ngIf="discoverZone.discoverHost.discoverPort.includeUDP">UDP</span>
 | 
			
		||||
            </span>
 | 
			
		||||
        </div>
 | 
			
		||||
      </p-overlayPanel>
 | 
			
		||||
 | 
			
		||||
      <a style="cursor: pointer" (click)="op.toggle($event)">{{services.length}} services has selected.</a>
 | 
			
		||||
 | 
			
		||||
        <div *ngIf="services.length > 0" class="ui-g-12 ui-top-border-1" style="text-align: right">
 | 
			
		||||
            <p-overlayPanel #op>
 | 
			
		||||
                <div *ngFor="let service of services">
 | 
			
		||||
                  {{service}}
 | 
			
		||||
                </div>
 | 
			
		||||
            </p-overlayPanel>
 | 
			
		||||
 | 
			
		||||
            <a style="cursor: pointer" (click)="op.toggle($event)">{{services.length}} services has selected.</a>
 | 
			
		||||
        </div>
 | 
			
		||||
    </div>
 | 
			
		||||
</div>
 | 
			
		||||
@ -57,21 +57,22 @@
 | 
			
		||||
    <label>Range</label>
 | 
			
		||||
  </div>
 | 
			
		||||
  <div class="ui-g-12 ui-g-nopad ui-bottom-space-20">
 | 
			
		||||
    <div class="ui-g-4">
 | 
			
		||||
    <div class="ui-g-6">
 | 
			
		||||
      <input #startPort id="float-input" type="number" maxlength="5" min="1" max="65535" pInputText [disabled]="!portChecked" value="1"
 | 
			
		||||
        (keyup)="onInputPort(startPort.value, 0)">
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="ui-g-4">
 | 
			
		||||
    <div class="ui-g-6">
 | 
			
		||||
      <input #endPort id="float-input" type="number" maxlength="5" min="1" max="65535" pInputText [disabled]="!portChecked" value="1024"
 | 
			
		||||
        (keyup)="onInputPort(endPort.value, 1)">
 | 
			
		||||
    </div>
 | 
			
		||||
    <div class="ui-g-12 ui-g-nopad" style="margin-left: 0.5em">
 | 
			
		||||
        <a style="cursor: pointer" (click)="portExcludeDisplay = true">
 | 
			
		||||
          <span *ngIf="excludePorts.length === 0">Add Exclude Ports</span>
 | 
			
		||||
          <span *ngIf="excludePorts.length > 0">{{excludePorts.length}} ports are excluded.</span>
 | 
			
		||||
        </a>
 | 
			
		||||
      </div>
 | 
			
		||||
  </div>
 | 
			
		||||
  <div class="ui-g-12">
 | 
			
		||||
    <a style="cursor: pointer" (click)="portExcludeDisplay = true">
 | 
			
		||||
      <span *ngIf="excludePorts.length === 0">Add Exclude Ports</span>
 | 
			
		||||
      <span *ngIf="excludePorts.length > 0">{{excludePorts.length}} ports are excluded.</span>
 | 
			
		||||
    </a>
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
  <div *ngIf="portErrMsg" class="ui-message ui-messages-error ui-corner-all">
 | 
			
		||||
    {{portErrMsg}}
 | 
			
		||||
  </div>
 | 
			
		||||
 | 
			
		||||
@ -3,8 +3,10 @@
 | 
			
		||||
    <of-block-progressbar [target]="content" [pending]="pending$ | async"></of-block-progressbar>
 | 
			
		||||
    <p-panel #content [showHeader]="false" class="block-panel">
 | 
			
		||||
        <div class="ui-g" dir="rtl">
 | 
			
		||||
            <a style="cursor: pointer" (click)="onUnselectAll()">Unselect All</a>
 | 
			
		||||
            <a style="cursor: pointer" (click)="onSelectAll()">Select All</a>
 | 
			
		||||
            <button pButton type="button" class="ui-button-secondary ui-button-width-fit ui-s-button" label="Unselect All" style="margin-bottom: 3px;"
 | 
			
		||||
            (click)="onUnselectAll()"></button>
 | 
			
		||||
            <button pButton type="button" class="ui-button-secondary ui-button-width-fit ui-s-button" label="Select All" style="margin-bottom: 3px;"
 | 
			
		||||
            (click)="onSelectAll()"></button>
 | 
			
		||||
        </div>
 | 
			
		||||
 | 
			
		||||
        <p-table selectionMode="multiple" [scrollable]="true" scrollHeight="200px" [value]="metaCrawlers" [(selection)]="includeServices"
 | 
			
		||||
 | 
			
		||||
@ -1,14 +1,16 @@
 | 
			
		||||
<div *ngIf="probeHost" class="ui-g">
 | 
			
		||||
  <div class="ui-g-12 ui-md-4 ui-nopad ui-key-value">
 | 
			
		||||
    <of-key-value [key]="'Status'" [value]="connectionStatus"></of-key-value>
 | 
			
		||||
    <of-key-value [key]="'CIDR'" [value]="probeHost.probe.cidr"></of-key-value>
 | 
			
		||||
<p-panel [showHeader]="false" class="ui-top-space-10">
 | 
			
		||||
  <div *ngIf="probeHost" class="ui-g">
 | 
			
		||||
      <div class="ui-g-12 ui-md-4 ui-key-value">
 | 
			
		||||
        <of-key-value [key]="'Status'" [value]="connectionStatus"></of-key-value>
 | 
			
		||||
        <of-key-value [key]="'CIDR'" [value]="probeHost.probe.cidr"></of-key-value>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="ui-g-12 ui-md-4 ui-key-value">
 | 
			
		||||
        <of-key-value [key]="'Name'" [value]="probeHost.probe.displayName"></of-key-value>
 | 
			
		||||
        <of-key-value [key]="'OS'" [value]="probeHost.infraHost.infraOS.metaInfraVendor.name"></of-key-value>
 | 
			
		||||
      </div>
 | 
			
		||||
      <div class="ui-g-12 ui-md-4 ui-key-value">
 | 
			
		||||
          <of-key-value [key]="'IPv4'" [value]="probeHost.infraHost.ipv4"></of-key-value>
 | 
			
		||||
          <of-key-value [key]="'Mac Address'" [value]="probeHost.infraHost.mac"></of-key-value>
 | 
			
		||||
      </div>
 | 
			
		||||
  </div>
 | 
			
		||||
  <div class="ui-g-12 ui-md-4 ui-nopad ui-key-value">
 | 
			
		||||
    <of-key-value [key]="'Name'" [value]="probeHost.probe.displayName"></of-key-value>
 | 
			
		||||
    <of-key-value [key]="'OS'" [value]="probeHost.infraHost.infraOS.metaInfraVendor.name"></of-key-value>
 | 
			
		||||
  </div>
 | 
			
		||||
  <div class="ui-g-12 ui-md-4 ui-nopad ui-key-value">
 | 
			
		||||
      <of-key-value [key]="'IPv4'" [value]="probeHost.infraHost.ipv4"></of-key-value>
 | 
			
		||||
      <of-key-value [key]="'Mac Address'" [value]="probeHost.infraHost.mac"></of-key-value>
 | 
			
		||||
  </div>
 | 
			
		||||
</div>
 | 
			
		||||
</p-panel>
 | 
			
		||||
@ -1565,6 +1565,7 @@
 | 
			
		||||
}
 | 
			
		||||
.ui-button-secondary:hover{
 | 
			
		||||
    color : #5e6166 !important;
 | 
			
		||||
    background-color : #ededee !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ui-button-large {
 | 
			
		||||
@ -1580,6 +1581,9 @@
 | 
			
		||||
 | 
			
		||||
.ui-top-space-10{
 | 
			
		||||
    margin-top: 10px;
 | 
			
		||||
    .ui-panel{
 | 
			
		||||
        margin-top: 10px;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ui-top-space--0-5em{
 | 
			
		||||
@ -1617,7 +1621,7 @@
 | 
			
		||||
 | 
			
		||||
.ui-s-button{
 | 
			
		||||
    .ui-button-text {
 | 
			
		||||
        padding: 2px !important;
 | 
			
		||||
        padding: 0 !important;
 | 
			
		||||
        .ui-button-text-icon-left {
 | 
			
		||||
            padding: 2px 12px 2px 4px !important;
 | 
			
		||||
        }
 | 
			
		||||
@ -1628,6 +1632,19 @@
 | 
			
		||||
    font-size: 0.8em !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ui-xs-button{
 | 
			
		||||
    .ui-button-text {
 | 
			
		||||
        padding: 2px !important;
 | 
			
		||||
        .ui-button-text-icon-left {
 | 
			
		||||
            padding: 2px 12px 2px 4px !important;
 | 
			
		||||
        }
 | 
			
		||||
        .ui-button-text-icon-right {
 | 
			
		||||
            padding: 2px 4px 2px 12px !important;
 | 
			
		||||
        }
 | 
			
		||||
    }
 | 
			
		||||
    font-size: 0.6em !important;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ui-status-icon{
 | 
			
		||||
    //margin-top: 3px;
 | 
			
		||||
    //position: static;
 | 
			
		||||
@ -1761,6 +1778,20 @@
 | 
			
		||||
        width: 105px !important;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
.ui-left-info2{
 | 
			
		||||
    padding: 10px !important;
 | 
			
		||||
    margin-left: -15px !important;
 | 
			
		||||
    min-width: 300px !important;
 | 
			
		||||
    span::after {
 | 
			
		||||
        content: " : ";
 | 
			
		||||
    }
 | 
			
		||||
    span{
 | 
			
		||||
        width: 95px !important;
 | 
			
		||||
    }
 | 
			
		||||
    span.ng-star-inserted, a.ng-star-inserted>span {
 | 
			
		||||
        width: auto !important;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
.ui-bottom-border-1 {
 | 
			
		||||
    border-bottom: #bdbdbd 1px solid;
 | 
			
		||||
@ -1770,6 +1801,9 @@
 | 
			
		||||
        border-bottom: #bdbdbd 1px solid;
 | 
			
		||||
    }
 | 
			
		||||
}
 | 
			
		||||
.ui-top-border-1 {
 | 
			
		||||
    border-top: #bdbdbd 1px solid;
 | 
			
		||||
}
 | 
			
		||||
/*.layout-container .ultima-menu{
 | 
			
		||||
    width: 100% ;
 | 
			
		||||
}*/
 | 
			
		||||
 | 
			
		||||
		Loading…
	
	
			
			x
			
			
		
	
		Reference in New Issue
	
	Block a user