组织配置

fengxiang

2018-01-12 f0b742d34e95811b6874bcaedbc7a06451d39da1

 src/app/routes/systems/organization/organization-config/organization-config.component.html

@@ -1,67 +1,131 @@
<form>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
    <p>111111111111111111111111111<br/>
      222222222222222222222222222<br/>
      333333333333333333333333333<br/>
   </p>
   <p>111111111111111111111111111<br/>
       222222222222222222222222222<br/>
       333333333333333333333333333<br/>
    </p>
   <footer-toolbar errorCollect>
<form nz-form [formGroup]="validateForm" (ngSubmit)="save($event,validateForm.value,validateForm.valid)" [nzLayout]="'vertical'"
    #f="ngForm">
    <nz-card [nzBordered]="false" nzTitle="报警阀值（注意，只有部分选项有 反向三级 数值，没有可不填)">
        <nz-table #nzTable [nzDataSource]="grid.data" [nzPageSize]="10" [nzLoading]="grid.loading" [nzShowTotal]="true">
            <thead nz-thead>
                <tr>
                    <th nz-th [nzCheckbox]="true">
                        <label nz-checkbox formControlName="_allChecked" [nzIndeterminate]="indeterminate" (ngModelChange)="checkAll($event)"></label>
                    </th>
                    <th nz-th>
                        传感器名称
                    </th>
                    <th nz-th>
                        一级
                    </th>
                    <th nz-th>
                        二级
                    </th>
                    <th nz-th>
                        三级
                    </th>
                    <th nz-th>
                        反向一级
                    </th>
                    <th nz-th>
                        反向二级
                    </th>
                    <th nz-th>
                        反向三级
                    </th>
                </tr>
            </thead>
            <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let row of nzTable.data">
                    <td nz-td [nzCheckbox]="true">
                        <label nz-checkbox formControlName="{{row.key}}_enable"></label>
                    </td>
                    <td>
                        <span>
                            {{ row.name }}
                        </span>
                    </td>
                    <td>
                        <div nz-form-item>
                            <div nz-form-control nzHasFeedback>
                                <nz-input formControlName="{{row.key}}_level_increment_1" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}"></nz-input>
                            </div>
                        </div>
                    </td>
                    <td>
                        <div nz-form-item>
                            <div nz-form-control nzHasFeedback>
                                <nz-input formControlName="{{row.key}}_level_increment_2" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}" 
                                validateGreater></nz-input>                                
                            </div>
                        </div>
                    </td>
                    <td>
                        <div nz-form-item>
                            <div nz-form-control nzHasFeedback>
                                <nz-input formControlName="{{row.key}}_level_increment_3" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}"></nz-input>
                            </div>
                        </div>
                    </td>
                    <td>
                        <div nz-form-item>
                            <div nz-form-control nzHasFeedback>
                                <nz-input formControlName="{{row.key}}_level_degression_1" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}"></nz-input>
                            </div>
                        </div>
                    </td>
                    <td>
                        <div nz-form-item>
                            <div nz-form-control nzHasFeedback>
                                <nz-input formControlName="{{row.key}}_level_degression_2" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}"></nz-input>
                            </div>
                        </div>
                    </td>
                    <td>
                    <div nz-form-item>
                        <div nz-form-control nzHasFeedback>
                            <nz-input formControlName="{{row.key}}_level_degression_3" maxlength="20" nzDisabled="{{ !f.value[row.key+'_enable'] }}"></nz-input>
                        </div>
                    </div>
                    </td>
                </tr>
            </tbody>
        </nz-table>
    </nz-card>
    <div [ngStyle]="{'background-color':'#f5f7fa','width':'110%','left':'-5%','height':'20px','position':'relative'}"></div>
    <nz-card [nzBordered]="false" nzTitle="报警方式">
        <label nz-checkbox formControlName="mode_enable">
            <span>启用报警</span>
        </label>
        <div [ngStyle]="{'margin-left': '20%'}">
            <br/>
            <br/>
            <br/>
            <div *ngFor="let i of [1,2,3]" nz-form-item nz-row class="mb-sm">
                <div nz-form-label nz-col [nzSm]="3" [nzXs]="24">
                    <span [ngSwitch]="i">
                        <label *ngSwitchCase="1">一级报警方式:</label>
                        <label *ngSwitchCase="2">二级报警方式:</label>
                        <label *ngSwitchCase="3">三级报警方式:</label>
                    </span>
                </div>
                <div nz-form-control nz-col [nzSpan]="12" nzHasFeedback>
                    <nz-select formControlName="mode_level{{i}}" [nzMode]="'multiple'" [nzPlaceHolder]="'选择 报警方式'" [nzNotFoundContent]="'无法找到'"
                        nzDisabled="{{ !f.value['mode_enable'] }}">
                        <nz-option *ngFor="let option of alarmModes" [nzLabel]="option.label" [nzValue]="option.value" [nzDisabled]="option.disabled">
                        </nz-option>
                    </nz-select>
                </div>
                <br/>
                <br/>
                <br/>
            </div>
        </div>
    </nz-card>
    <footer-toolbar ng-content = '错误提示' errorCollect>
        <label>组织名称：</label>
        <span [ngStyle]="{'font-size': '16px','font-weight': 'bold','margin-right':'30px'}">{{ organization.name }}</span>
        <button nz-button type="button" (click)="backToList()">返回</button>
        <button nz-button [nzType]="'primary'" [nzLoading]="isSaving">
          <span>
            保存
            <span *ngIf="isSaving">中</span>
          </span>
            <span>
                保存
                <span *ngIf="isSaving">中</span>
            </span>
        </button>
    </footer-toolbar>
</form>