Skip to content
basic-edit.component.html 23.3 KiB
Newer Older
wangqinghua's avatar
wangqinghua committed
<!--添加资源-->
<nz-modal [nzWidth]="980" [nzFooter]="null" [(nzVisible)]="isBasicEdit" nzTitle="{{modalTitle}}" (nzOnCancel)="handleEditCancel()" (nzOnOk)="handEditleOk()">
    <nz-tabset [nzSelectedIndex]="tabNum" style="padding-bottom: 25px;min-height: 500px">
        <nz-tab nzTitle="资源信息">
            <div nz-form  class="ant-advanced-search-form form-select">
                <div nz-row [nzGutter]="24">
                    <div nz-col [nzSpan]="12">
                        <nz-form-item nzFlex>
                            <nz-form-label [nzOffset]="4" [nzSpan]="6" nzRequired nzFor="equipmentType">设备类型</nz-form-label>
                            <nz-form-control [nzSpan]="14">
                                <nz-select  name="equipmentType" nzShowSearch nzAllowClear nzPlaceHolder="选择设备类型"  [(ngModel)]="validateForm.hostExtend.equipmentType">
                                    <nz-option nzValue="存储" nzLabel="存储"></nz-option>
                                    <nz-option nzValue="交换机" nzLabel="交换机"></nz-option>
                                    <nz-option nzValue="服务器" nzLabel="服务器"></nz-option>
                                    <nz-option nzValue="数据库" nzLabel="数据库"></nz-option>
                                    <nz-option nzValue="网络" nzLabel="网络"></nz-option>
                                    <nz-option nzValue="中间件" nzLabel="中间件"></nz-option>
                                    <nz-option nzValue="虚拟化" nzLabel="虚拟化"></nz-option>
                                    <nz-option nzValue="应用服务" nzLabel="应用服务"></nz-option>
                                </nz-select>
                            </nz-form-control>
                        </nz-form-item>
                    </div>

                    <div nz-col [nzSpan]="12">
                        <nz-form-item nzFlex>
                            <nz-form-label [nzSpan]="6" nzFor="os">操作系统</nz-form-label>
                            <nz-form-control [nzSpan]="14">
                                <input id="os" nz-input placeholder="操作系统" name="inventory_os" [(ngModel)]="validateForm.inventory.os">
                            </nz-form-control>
                        </nz-form-item>
                    </div>
                </div>

                <div nz-row [nzGutter]="24">
                    <div nz-col [nzSpan]="12">
                    <nz-form-item nzFlex>
                        <nz-form-label [nzOffset]="4" [nzSpan]="6" nzRequired nzFor="secondLevelType">二级类型</nz-form-label>
                        <nz-form-control [nzSpan]="14">
                            <nz-select  name="secondLevelType" nzShowSearch nzAllowClear nzPlaceHolder="选择二级类型"  [(ngModel)]="validateForm.hostExtend.secondLevelType">
                                <nz-option nzValue="存储" nzLabel="存储"></nz-option>
                                <nz-option nzValue="交换机" nzLabel="交换机"></nz-option>
                                <nz-option nzValue="服务器" nzLabel="服务器"></nz-option>
                                <nz-option nzValue="数据库" nzLabel="数据库"></nz-option>
                                <nz-option nzValue="网络" nzLabel="网络"></nz-option>
                                <nz-option nzValue="中间件" nzLabel="中间件"></nz-option>
                                <nz-option nzValue="虚拟化" nzLabel="虚拟化"></nz-option>
                                <nz-option nzValue="应用服务" nzLabel="应用服务"></nz-option>
                            </nz-select>
                        </nz-form-control>
                    </nz-form-item>
                </div>

                    <div nz-col [nzSpan]="12">
                    <nz-form-item nzFlex>
                        <nz-form-label [nzSpan]="6" nzFor="name">厂商</nz-form-label>
                        <nz-form-control [nzSpan]="14">
                            <input id="inventory_name" nz-input placeholder="厂商" name="inventory_name" [(ngModel)]="validateForm.inventory.name">
                        </nz-form-control>
                    </nz-form-item>
                </div>
                </div>

                <div nz-row [nzGutter]="24">
                    <div nz-col [nzSpan]="12">
                        <nz-form-item nzFlex>
                            <nz-form-label [nzOffset]="4" [nzSpan]="6" nzRequired nzFor="name">显示名</nz-form-label>
                            <nz-form-control [nzSpan]="14">
                                <input id="name" nz-input placeholder="显示名" name="name" [(ngModel)]="validateForm.name">
                            </nz-form-control>
                        </nz-form-item>
                    </div>

                    <div nz-col [nzSpan]="12">
                        <nz-form-item nzFlex>
                            <nz-form-label [nzSpan]="6" nzFor="serialno_a">产品序列号</nz-form-label>
                            <nz-form-control [nzSpan]="14">
                                <input id="serialno_a" nz-input placeholder="产品序列号" name="inventory_serialno_a" [(ngModel)]="validateForm.inventory.serialno_a">
                            </nz-form-control>
                        </nz-form-item>
                    </div>
                </div>

                <nz-form-item>
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="host">IP地址</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <input id="host" type="text" nz-input name="host" [(ngModel)]="validateForm.host">
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item>
                    <nz-form-label [nzSpan]="4" nzRequired nzFor="groups">所在分组</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-checkbox-group [(ngModel)]="groupList" name="groupList"></nz-checkbox-group>
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item>
                    <nz-form-label [nzSpan]="4"  nzFor="serviceid">关联业务</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-select name="serviceid" [(ngModel)]="validateForm.hostExtend.serviceid" nzPlaceHolder="无关联业务">
                            <nz-option nzValue="" nzLabel="无"></nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item  >
                    <nz-form-label [nzSpan]="4">添加接口</nz-form-label>
                    <nz-form-control [nzSpan]="20">
                        <div nz-row [nzGutter]="12">
                            <ng-container *ngFor="let item of interfaceslist;let i = index;">
                                <nz-form-control nz-col [nzSpan]="4">
                                    <nz-select name="main" nzPlaceHolder="选择接口类型" [(ngModel)]="item.main">
                                        <nz-option nzValue="1" nzLabel="默认"></nz-option>
                                        <nz-option nzValue="0" nzLabel="不默认"></nz-option>
                                    </nz-select>
                                </nz-form-control>
                                <nz-form-control nz-col [nzSpan]="4">
                                    <input type="text" placeholder="IP地址" nz-input name="ip" [(ngModel)]="item.ip">
                                </nz-form-control>
                                <nz-form-control nz-col [nzSpan]="4">
                                    <input type="text" placeholder="DNS名称" nz-input name="dns" [(ngModel)]="item.dns">
                                </nz-form-control>
                                <nz-form-control nz-col [nzSpan]="6">
                                    <nz-select  name="type" nzPlaceHolder="连接类型" [(ngModel)]="item.type" (ngModelChange)="changePort(i)">
                                        <nz-option nzValue="1" nzLabel="agent代理程序接口"></nz-option>
                                        <nz-option nzValue="2" nzLabel="SNMP接口"></nz-option>
                                        <nz-option nzValue="3" nzLabel="JMX接口"></nz-option>
                                        <nz-option nzValue="4" nzLabel="IPMI接口"></nz-option>
                                    </nz-select>
                                </nz-form-control>
                                <nz-form-control nz-col [nzSpan]="3">
                                        <input type="text" placeholder="端口" nz-input  name="port" [(ngModel)]="item.port">
                                </nz-form-control>
                                <nz-form-control nz-col [nzSpan]="2">
                                    <span class="cursor" (click)="deleteInterfaces(i)">X</span>
                                </nz-form-control>
                            </ng-container>
                        </div>
                        <button nz-button (click)="addInterfaces()" nzType="default">添加</button>
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item>
                    <nz-form-label [nzSpan]="4"  nzFor="test3">由agent代理程序检测</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-select name="test3" name="test3" nzPlaceHolder="无agen代理程序">
                            <nz-option nzValue=""  nzLabel="无agen代理程序"></nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>

                <nz-form-item>
                    <nz-form-label [nzSpan]="4"  nzFor="templates">监控策略</nz-form-label>
                    <nz-form-control [nzSpan]="14">
                        <nz-select name="templates" style="width: 100%" [(ngModel)]="validateForm.templates" [nzSize]="nzSize" nzMode="tags" nzPlaceHolder="选择监控策略">
                            <nz-option *ngFor="let option of tempList" [nzLabel]="option.name" [nzValue]="option.templateid"></nz-option>
                        </nz-select>
                    </nz-form-control>
                </nz-form-item>
            </div>

            <div class="modal-footer-btn">
                <button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>
                <button nz-button (click)="tabsChange(1)" nzType="primary">下一步</button>
            </div>
        </nz-tab>

        <nz-tab nzTitle="配置信息">
            <nz-collapse>
                <nz-collapse-panel  [nzHeader]="panel1.name" [nzActive]="panel1.active">
                    <form nz-form  class="ant-advanced-search-form">
                        <div nz-row [nzGutter]="24">
                            <div nz-col [nzSpan]="12">
                                <nz-form-item nzFlex>
                                    <nz-form-label [nzOffset]="4" [nzSpan]="6" nzFor="ipmi_authtype">认证算法</nz-form-label>
                                    <nz-form-control [nzSpan]="14">
                                        <nz-select style="width: 200px;" name="ipmi_authtype" nzShowSearch nzAllowClear nzPlaceHolder="选择设备类型"  [(ngModel)]="validateForm.ipmi_authtype">
                                            <nz-option nzValue="-1" nzLabel="默认"></nz-option>
                                            <nz-option nzValue="0" nzLabel="无"></nz-option>
                                            <nz-option nzValue="1" nzLabel="MD2"></nz-option>
                                            <nz-option nzValue="2" nzLabel="MD5"></nz-option>
                                            <nz-option nzValue="3" nzLabel="straight"></nz-option>
                                            <nz-option nzValue="4" nzLabel="OEM"></nz-option>
                                            <nz-option nzValue="5" nzLabel="RMCP+"></nz-option>
                                        </nz-select>
                                    </nz-form-control>
                                </nz-form-item>
                            </div>

                            <div nz-col [nzSpan]="12">
                                <nz-form-item nzFlex>
                                    <nz-form-label [nzSpan]="6" nzFor="ipmi_username">用户名称</nz-form-label>
                                    <nz-form-control [nzSpan]="14">
                                        <input id="ipmi_username" name="ipmi_username" nz-input placeholder="用户名称" [(ngModel)]="validateForm.ipmi_username">
                                    </nz-form-control>
                                </nz-form-item>
                            </div>
                        </div>

                        <div nz-row [nzGutter]="24">
                            <div nz-col [nzSpan]="12">
                                <nz-form-item nzFlex>
                                    <nz-form-label [nzOffset]="4" [nzSpan]="6" nzFor="ipmi_privilege">优先权层级</nz-form-label>
                                    <nz-form-control [nzSpan]="14">
                                        <nz-select name="ipmi_privilege" nzShowSearch nzAllowClear nzPlaceHolder="选择设备类型"  [(ngModel)]="validateForm.ipmi_privilege">
                                            <nz-option nzValue="1" nzLabel="回调"></nz-option>
                                            <nz-option nzValue="2" nzLabel="用户"></nz-option>
                                            <nz-option nzValue="3" nzLabel="操作者"></nz-option>
                                            <nz-option nzValue="4" nzLabel="管理者"></nz-option>
                                            <nz-option nzValue="5" nzLabel="OEM"></nz-option>
                                        </nz-select>
                                    </nz-form-control>
                                </nz-form-item>
                            </div>

                            <div nz-col [nzSpan]="12">
                                <nz-form-item nzFlex>
                                    <nz-form-label [nzSpan]="6" nzFor="ipmi_password">密码</nz-form-label>
                                    <nz-form-control [nzSpan]="14">
                                        <input id="ipmi_password" name="ipmi_password" nz-input placeholder="密码" [(ngModel)]="validateForm.ipmi_password">
                                    </nz-form-control>
                                </nz-form-item>
                            </div>
                        </div>
                    </form>
                </nz-collapse-panel>
            </nz-collapse>
            <nz-collapse>
                <nz-collapse-panel  [nzHeader]="panel2.name" [nzActive]="panel2.active">
                    <div nz-row [nzGutter]="24" >
                        <div nz-col [nzSpan]="12">
                            <nz-form-item nzFlex>
                                <nz-form-control [nzOffset]="4" [nzSpan]="14">
                                    <nz-radio-group [(ngModel)]="macroTYpe">
                                        <label nz-radio-button nzValue="macro"><span>主机宏</span></label>
                                        <label nz-radio-button nzValue="macroExpand"><span>继承以及主机宏</span></label>
                                    </nz-radio-group>
                                </nz-form-control>
                            </nz-form-item>
                        </div>
                    </div>
                    <div  *ngIf="macroTYpe == 'macro'">
                        <div nz-row [nzGutter]="24">
                            <div nz-col [nzOffset]="2" [nzSpan]="6">

                            </div>
                            <div nz-col [nzSpan]="6">

                            </div>
                        </div>

                        <div nz-row *ngFor="let item of macroList;let i = index;" [nzGutter]="24">
                            <nz-form-control [nzOffset]="2" nz-col [nzSpan]="6">
                                <input  nz-input placeholder="{$SNMP_COMMUNITY}" value="{{item.macro}}">
                            </nz-form-control>
                            <nz-form-control nz-col [nzSpan]="1">
                                =>
                            </nz-form-control>
                            <nz-form-control nz-col [nzSpan]="6">
                                <input  nz-input placeholder="public" value="{{item.value}}">
                            </nz-form-control>
                            <nz-form-control nz-col [nzSpan]="3">
                                <span (click)="deleteMacro(i)">移除</span>
                            </nz-form-control>
                        </div>
                        <button nz-button (click)="addMacro()" nzType="default">添加</button>
                    </div>
                    <div  *ngIf="macroTYpe == 'macroExpand'">
                        <div nz-row [nzGutter]="24" >
                            <div nz-col [nzOffset]="2" [nzSpan]="6">

                            </div>
                            <div nz-col [nzSpan]="1">
                            </div>
                            <div nz-col [nzSpan]="6">

                            </div>
                            <div nz-col [nzSpan]="3">
                                模版值
                            </div>
                            <div nz-col [nzSpan]="1">
                            </div>
                            <div nz-col [nzSpan]="3">
                                全局值(配置)
                            </div>
                        </div>
                        <div nz-row [nzGutter]="12" *ngFor="let item of macroList">
                            <nz-form-control nz-col [nzOffset]="2" [nzSpan]="6">
                                <input  nz-input placeholder="{$SNMP_COMMUNITY}" value="{{item.macro}}">
                            </nz-form-control>
                            <div nz-col [nzSpan]="1">
                                =>
                            </div>
                            <nz-form-control nz-col [nzSpan]="6">
                                <input  nz-input placeholder="public" value="{{item.value}}">
                            </nz-form-control>
                            <div nz-col [nzSpan]="3">
                                <button nz-button nzType="default">更改</button>
                            </div>
                            <div nz-col [nzSpan]="1">
                                <span></span>
                            </div>
                            <div nz-col [nzSpan]="3">
                                <span>"public"</span>
                            </div>
                            <div nz-col [nzSpan]="2">
                                <span>移除</span>
                            </div>
                        </div>

                        <button nz-button nzType="default">添加</button>
                    </div>
                </nz-collapse-panel>
            </nz-collapse>

            <div class="modal-footer-btn">
                <button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>
                <button nz-button (click)="tabsChange(0)" nzType="primary">上一步</button>
                <button nz-button (click)="handEditleOk()" nzType="primary">完成</button>
            </div>
        </nz-tab>

        <!--<nz-tab nzTitle="加密">-->
            <!--<form nz-form  class="ant-advanced-search-form">-->
                <!--<nz-form-item>-->
                    <!--<nz-form-label [nzSpan]="6" nzFor="host">连接主机</nz-form-label>-->
                    <!--<nz-form-control [nzSpan]="14">-->
                        <!--<nz-radio-group [(ngModel)] ="mainHost" name="mainHost">-->
                            <!--<label nz-radio-button nzValue="hostType1"><span>非加密</span></label>-->
                            <!--<label nz-radio-button nzValue="hostType2"><span>共享密钥(PSK)</span></label>-->
                            <!--<label nz-radio-button nzValue="hostType3"><span>证书</span></label>-->
                        <!--</nz-radio-group>-->
                    <!--</nz-form-control>-->
                <!--</nz-form-item>-->

                <!--<nz-form-item>-->
                    <!--<nz-form-label [nzSpan]="6" nzFor="host">从主机连接</nz-form-label>-->
                    <!--<nz-form-control [nzSpan]="14">-->
                        <!--<nz-radio-group [(ngModel)]="otherHost" name="otherHost">-->
                            <!--<label nz-radio [ngStyle]="style" nzValue="A">非加密</label>-->
                            <!--<label nz-radio [ngStyle]="style" nzValue="B">共享密钥(PSK)</label>-->
                            <!--<label nz-radio [ngStyle]="style" nzValue="C">证书</label>-->
                        <!--</nz-radio-group>-->
                    <!--</nz-form-control>-->
                <!--</nz-form-item>-->

                <!--<ng-container *ngIf="mainHost == 'hostType2'">-->
                    <!--<nz-form-item>-->
                        <!--<nz-form-label [nzSpan]="6"  nzFor="tls_psk_identity">共享密钥一致性</nz-form-label>-->
                        <!--<nz-form-control [nzSpan]="14">-->
                            <!--<input type="text" name="tls_psk_identity" nz-input [(ngModel)]="tls_psk_identity">-->
                        <!--</nz-form-control>-->
                    <!--</nz-form-item>-->
                    <!--<nz-form-item>-->
                        <!--<nz-form-label [nzSpan]="6"  nzFor="tls_psk">共享密钥(PSK)</nz-form-label>-->
                        <!--<nz-form-control [nzSpan]="14">-->
                            <!--<input type="text" nz-input name="tls_psk" [(ngModel)]="tls_psk">-->
                        <!--</nz-form-control>-->
                    <!--</nz-form-item>-->
                <!--</ng-container>-->

                <!--<ng-container *ngIf="mainHost == 'hostType3'">-->
                    <!--<nz-form-item>-->
                        <!--<nz-form-label [nzSpan]="6"  nzFor="tls_issuer">发行者</nz-form-label>-->
                        <!--<nz-form-control [nzSpan]="14">-->
                            <!--<input type="text" name="tls_issuer" nz-input [(ngModel)]="tls_issuer">-->
                        <!--</nz-form-control>-->
                    <!--</nz-form-item>-->
                    <!--<nz-form-item>-->
                        <!--<nz-form-label [nzSpan]="6"  nzFor="tls_subject">主体</nz-form-label>-->
                        <!--<nz-form-control [nzSpan]="14">-->
                            <!--<input type="text" name="tls_subject" nz-input [(ngModel)]="tls_subject">-->
                        <!--</nz-form-control>-->
                    <!--</nz-form-item>-->
                <!--</ng-container>-->

            <!--</form>-->
            <!--<div class="modal-footer-btn">-->
                <!--<button nz-button (click)="handleEditCancel()" nzType="primary">取消</button>-->
                <!--<button nz-button (click)="tabsChange(1)" nzType="primary">上一步</button>-->
                <!--<button nz-button (click)="handEditleOk()"  nzType="primary">完成</button>-->
            <!--</div>-->
        <!--</nz-tab>-->
    </nz-tabset>
</nz-modal>