member_webapp/src/packages/discovery/component/setting/setting.component.html

<div *ngIf="!started">

  <!-- <mat-dialog-actions fxLayoutAlign="end">
    <button mat-button mat-dialog-close>Cancel</button>
    <button mat-button color="primary" (click)="discovery()">Start</button>
  </mat-dialog-actions> -->

  <p-card title="Zone" subtitle="192.168.1.0/24" [style]="{width: '360px'}" styleClass="ui-card-shadow">
    <p-header>

    </p-header>
    <div>

      <div class="ui-g" style="width:250px;margin-bottom:10px">
        <div class="ui-g-12">
          <p-checkbox name="group1" value="host" label="Host" [(ngModel)]="selectedCities" inputId="la"></p-checkbox>
        </div>
      </div>

      <span class="ui-float-label">
          <input id="float-input" type="text" size="30" pInputText> 
          <label for="float-input">Start Ip</label>
      </span>

      <span class="ui-float-label">
          <input id="float-input" type="text" size="30" pInputText> 
          <label for="float-input">End Ip</label>
      </span>

      <div class="ui-g" style="width:250px;margin-bottom:10px">
          <div class="ui-g-12">
            <p-checkbox name="group1" value="port" label="Port" [(ngModel)]="selectedCities" inputId="la"></p-checkbox>
          </div>
        </div>
  
        <span class="ui-float-label">
            <input id="float-input" type="text" size="30" pInputText> 
            <label for="float-input">Start Port</label>
        </span>
  
        <span class="ui-float-label">
            <input id="float-input" type="text" size="30" pInputText> 
            <label for="float-input">End Port</label>
        </span>

        <p-listbox [options]="cities" [(ngModel)]="selectedCities" multiple="multiple" checkbox="checkbox" filter="filter" optionLabel="name">
            <p-header>
              <i class="fa fa-car"></i>
              Cars
            </p-header>
          </p-listbox>

    </div>
    <p-footer>
      <button pButton type="button" label="Save" icon="fa-check"></button>
      <button pButton type="button" label="Cancel" icon="fa-close" class="ui-button-secondary"></button>
    </p-footer>
  </p-card>








</div>

<div *ngIf="started">

  <p-card title="Discovery Result" [style]="{width: '360px'}" styleClass="ui-card-shadow">
    <p-header>

    </p-header>
    <div>
      <p-tree [value]="treeNodes" selectionMode="checkbox" [(selection)]="filesTree4"></p-tree>
      <div>Selected Nodes:
        <span *ngFor="let file of filesTree4">{{file.label}} </span>
      </div>
    </div>
    <p-footer>
      <button pButton type="button" label="Save" icon="fa-check"></button>
      <button pButton type="button" label="Cancel" icon="fa-close" class="ui-button-secondary"></button>
    </p-footer>
  </p-card>


  <!-- <mat-dialog-actions fxLayoutAlign="end">
    <button mat-button mat-dialog-close>Cancel</button>
    <button mat-button color="primary" (click)="discoveryResultSave()">Save</button>
  </mat-dialog-actions> -->
</div>