提交一下

src/app/layout/layout.component.html

@@ -14,12 +14,8 @@
     <nz-header class="logoBackground bottomLine" style="background-color: #002661;padding:0;position:fixed; width:100%;z-index: 99;border-bottom: 1px solid rgb(230, 230, 230);">
       <i class="io trigger textStyle1 whenHover" [class.i-shou]="!isCollapsed"
          [class.i-fang]="isCollapsed" (click)="changeCollapsed()"></i>
-      <label class="linkToPersonSetting whenHover textStyle1" routerLink="/app/system/person">
-        <i class="io i-person"></i>
-        {{'person' | translate}}
-      </label>
       <label class="loginOut whenHover textStyle1" (click)="loginOut()">
-        {{'signOut' | translate}}
+        <i class="io i-out"></i>
       </label>
     </nz-header>
     <nz-content id="layoutCon" style="margin-top:64px;overflow: auto;">

src/app/main/gateway/gateway.component.html

@@ -31,13 +31,13 @@
       <th nz-th><span>{{'type' | translate}}</span></th>
       <th nz-th><span>{{'simCardNum' | translate}}</span></th>
       <th nz-th><span>{{'off/on' | translate}}</span></th>
-      <th nz-th><span>{{'belongCompany' | translate}}</span></th>
       <th nz-th
           nzShowFilter
           [nzFilterMultiple]="false"
           [nzFilters]="listOfBind"
           (nzFilterChange)="filter($event)">
         <span>{{'isbind' | translate}}</span></th>
+      <th nz-th><span>{{'belongCompany' | translate}}</span></th>
       <th nz-th><span>{{'oper' | translate}}</span></th>
     </tr>
     </thead>
@@ -83,34 +83,56 @@
   </div>
 </div>
 <nz-modal [(nzVisible)]="isAddConV" [nzContent]="con1" nzWidth="500"
-          [nzFooter]="foot1" (nzOnCancel)="cancel(isAddConV)" nzMaskClosable="false">
+          [nzFooter]="foot1" (nzOnCancel)="cancel('isAddConV')" nzMaskClosable="false">
   <ng-template #con1>
-    11111111
+    新增网关
   </ng-template>
   <ng-template #foot1>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isAddConV)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isAddConV)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isAddConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>
 
 <nz-modal [(nzVisible)]="isMultiAddConV" [nzContent]="con2" nzWidth="500"
-          [nzFooter]="foot2" (nzOnCancel)="cancel(isMultiAddConV)" nzMaskClosable="false">
+          [nzFooter]="foot2" (nzOnCancel)="cancel('isMultiAddConV')" nzMaskClosable="false">
   <ng-template #con2>
-    11111111
+    批量新增网关
   </ng-template>
   <ng-template #foot2>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isMultiAddConV)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isMultiAddConV)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isMultiAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isMultiAddConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>
 
-<nz-modal [(nzVisible)]="isBindCon" [nzContent]="con3" nzWidth="500"
-          [nzFooter]="foot3" (nzOnCancel)="cancel(isBindCon)" nzMaskClosable="false">
+<nz-modal [(nzVisible)]="isBindConV" [nzContent]="con3" nzWidth="500"
+          [nzFooter]="foot3" (nzOnCancel)="cancel('isBindConV')" nzMaskClosable="false">
   <ng-template #con3>
-    11111111
+    绑定/批量绑定网关
   </ng-template>
   <ng-template #foot3>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isBindCon)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isBindCon)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isBindConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isBindConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isUpdateConV" [nzContent]="con4" nzWidth="500"
+          [nzFooter]="foot4" (nzOnCancel)="cancel('isUpdateConV')" nzMaskClosable="false">
+  <ng-template #con4>
+    编辑网关
+  </ng-template>
+  <ng-template #foot4>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isUpdateConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isUpdateConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isDivideConV" [nzContent]="con5" nzWidth="500"
+          [nzFooter]="foot5" (nzOnCancel)="cancel('isDivideConV')" nzMaskClosable="false">
+  <ng-template #con5>
+    分配网关
+  </ng-template>
+  <ng-template #foot5>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isDivideConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isDivideConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>

src/app/main/gateway/gateway.component.ts

@@ -35,14 +35,13 @@ export class GatewayComponent implements OnInit {
   selectedOne: any = {};
   isAddConV = false;
   isMultiAddConV = false;
-  isBindCon = false;
+  isBindConV = false;
   isMulti = false;
-  addReq = {};
-  bindReq = {};
-  divideReq = {};
   canbind = false;
   canUnbind = false;
   isCheckedOne = false;
+  isUpdateConV = false;
+  isDivideConV = false;
 
   constructor(private api: ApiService, private message: NzMessageService, private router: Router,
               private modalService: NzModalService, private translate: TranslateService) {
@@ -75,6 +74,13 @@ export class GatewayComponent implements OnInit {
     this.api.loginlog.getAll(this.page, this.rows, ['', this.next]);
   }
 
+  onSearch() {
+  }
+
+  onGetAll() {
+  }
+
+  // 复选框的方法
   initCheckArray(b) {
     if (b) {
       this.isCheckedOne = true;
@@ -82,12 +88,6 @@ export class GatewayComponent implements OnInit {
     this.data.map((one) => one.checked = b);
   }
 
-  onSearch() {
-  }
-
-  onGetAll() {
-  }
-
   checkAll(e) {
     this.isIndeterminate = false;
     this.initCheckArray(e);
@@ -128,76 +128,103 @@ export class GatewayComponent implements OnInit {
     }
   }
 
+  // 筛选
   filter(a, b) {
     console.log(a, b);
   }
 
-  deleteConfirm(one) {
-    this.modalService.confirm({
-      nzTitle  : '<i></i>',
-      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
-      nzOnOk   : () => this.delete(one)
-    });
+  // 跳转详情
+  toSee(e) {
+    this.router.navigate(['/app/deviceCenter/gatewayMgr/gatewaySee']);
   }
 
-  allDelete() {
+  // 单个的方法
+  add() {
+    this.isMulti = false;
+    this.isAddConV = true;
+  }
+
+  bind(one) {
+    this.isMulti = false;
+    this.selectedOne = one;
+    this.isBindConV = true;
+  }
+
+  unbind(one) {
     this.modalService.confirm({
-      nzTitle  : '<i></i>',
+      nzTitle  : '<i> </i>',
       nzContent: '<b>' + this.translate.instant('confirmDeleteSelectedRecord') + '</b>',
-      nzOnOk   : () => this.deleteAll()
+      nzOnOk   : () => this.unbindOne(one)
     });
   }
 
-  delete(one) {}
+  unbindOne(one) {}
 
-  deleteAll() {}
+  update(one) {
+    this.isMulti = false;
+    this.selectedOne = one;
+    this.isUpdateConV = true;
+  }
 
-  allDivide() {
-    this.isMulti = true;
+  cancel(v) {
+    this[v] = false;
   }
 
-  allBind() {
-    this.isMulti = true;
+  save(v) {
+    this[v] = false;
   }
 
-  allUnbind() {
-    this.isMulti = true;
+  deleteConfirm(one) {
+    this.modalService.confirm({
+      nzTitle  : '<i> </i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
+      nzOnOk   : () => this.delete(one)
+    });
   }
 
+  delete(one) {}
+
+  // 批量的方法
   allUpdate() {
     this.isMulti = true;
+    this.isUpdateConV = true;
   }
 
   multiAdd() {
     this.isMulti = true;
+    this.isMultiAddConV = true;
   }
 
-  toSee(e) {
-    this.router.navigate(['/app/deviceCenter/gatewayMgr/gatewaySee']);
+  allDivide() {
+    this.isMulti = true;
+    this.isDivideConV = true;
   }
 
-  add() {
-    this.isMulti = false;
-    this.isAddConV = true;
+  allBind() {
+    this.isMulti = true;
+    this.isBindConV = true;
   }
 
-  bind(one) {
-    this.isMulti = false;
-    this.selectedOne = one;
+  allDelete() {
+    this.modalService.confirm({
+      nzTitle  : '<i> </i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteSelectedRecord') + '</b>',
+      nzOnOk   : () => this.deleteAll()
+    });
   }
 
-  update(one) {
-    this.isMulti = false;
-    this.selectedOne = one;
-  }
+  deleteAll() {}
 
-  cancel(v) {
-    this[v] = false;
-  }
-  save(v) {
-    this[v] = false;
+  allUnbind() {
+    this.modalService.confirm({
+      nzTitle  : '<i> </i>',
+      nzContent: '<b>' + this.translate.instant('confirmUnbindSelectedRecord') + '</b>',
+      nzOnOk   : () => this.unbindAll()
+    });
   }
 
+  unbindAll() {}
+
   toggleOn(one) {
     one.isLoading = true;
     setTimeout(() => {

src/app/main/module-mgr/module-mgr.component.html

@@ -45,3 +45,24 @@
     </tbody>
   </nz-table>
 </div>
+<nz-modal [(nzVisible)]="isAddConV" [nzContent]="con1" nzWidth="500"
+          [nzFooter]="foot1" (nzOnCancel)="cancel('isAddConV')" nzMaskClosable="false">
+  <ng-template #con1>
+    新增/编辑通道模板
+  </ng-template>
+  <ng-template #foot1>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isAddConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isSaveOther" [nzContent]="con2" nzWidth="500"
+          [nzFooter]="foot2" (nzOnCancel)="cancel('isSaveOther')" nzMaskClosable="false">
+  <ng-template #con2>
+    另存为通道模板
+  </ng-template>
+  <ng-template #foot2>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isSaveOther')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isSaveOther')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>

src/app/main/module-mgr/module-mgr.component.ts

 import {Component, OnInit} from '@angular/core';
 import {ApiService} from '../../service/api';
-import {NzMessageService} from 'ng-zorro-antd';
+import {NzMessageService, NzModalService} from 'ng-zorro-antd';
 import {TranslateService} from '@ngx-translate/core';
 import {fadeIn} from '../../animation/fade-in';
 import {Router} from '@angular/router';
@@ -19,8 +19,11 @@ export class ModuleMgrComponent implements OnInit {
   page: any = 1;
   rows: any = 10;
   total: any;
+  isAddConV = false;
+  isSaveOther = false;
+  isUpdate = false;
 
-  constructor(private api: ApiService, private message: NzMessageService,
+  constructor(private api: ApiService, private message: NzMessageService, private modalService: NzModalService,
               private translate: TranslateService, private router: Router) {
   }
 
@@ -75,11 +78,35 @@ export class ModuleMgrComponent implements OnInit {
     this.router.navigate(['/app/deviceCenter/moduleMgr/moduleDetail']);
   }
 
-  saveOther(one) {}
+  saveOther(one) {
+    this.isSaveOther = true;
+  }
 
-  update(one) {}
+  add() {
+    this.isUpdate = false;
+    this.isAddConV = true;
+  }
 
-  deleteConfirm(one) {}
+  update(one) {
+    this.isUpdate = true;
+    this.isAddConV = true;
+  }
+
+  cancel(v) {
+    this[v] = false;
+  }
+
+  save(v) {
+    this[v] = false;
+  }
+
+  deleteConfirm(one) {
+    this.modalService.confirm({
+      nzTitle  : '<i> </i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
+      nzOnOk   : () => this.delete(one)
+    });
+  }
 
-  add() {}
+  delete(one) {}
 }

src/app/main/sensor-mgr/sensor-mgr.component.html

@@ -43,7 +43,7 @@
     </thead>
     <tbody nz-tbody>
     <tr *ngFor="let one of nzTable.data,let i = index">
-      <td nzShowCheckbox [(nzChecked)]="checkArray[i]" (nzCheckedChange)="oneCheck(i)"></td>
+      <td nzShowCheckbox [(nzChecked)]="one.checked" (nzCheckedChange)="oneCheck()"></td>
       <td nz-td class="canClick" (click)="toSee(one)">设备{{i}}</td>
       <td nz-td>{{one.realName}}</td>
       <td nz-td>{{one.userName}}</td>
@@ -65,15 +65,15 @@
     </tbody>
   </nz-table>
   <div class="btnLine whenOneLine" style="text-align: left; margin-top: 10px;">
-    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" (click)="allDelete()">
+    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" [disabled]="!isCheckedOne" (click)="allDelete()">
       <span>{{'delete' | translate}}</span></button>
-    <button nz-button class="btnAll" [nzLoading]="isLoading" (click)="allBind()"><span>{{'bind' | translate}}</span>
+    <button nz-button class="btnAll" [nzLoading]="isLoading" [disabled]="!canbind" (click)="allBind()"><span>{{'bind' | translate}}</span>
     </button>
-    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" (click)="allUnbind()">
+    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" [disabled]="!canUnbind" (click)="allUnbind()">
       <span>{{'unbind' | translate}}</span></button>
-    <button nz-button class="btnAll" [nzLoading]="isLoading" (click)="allDivide()"><span>{{'divide' | translate}}</span>
+    <button nz-button class="btnAll" [nzLoading]="isLoading" [disabled]="!isCheckedOne" (click)="allDivide()"><span>{{'divide' | translate}}</span>
     </button>
-    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" (click)="allUpdate()">
+    <button nz-button [nzType]="'primary'" [nzLoading]="isLoading" [disabled]="!isCheckedOne" (click)="allUpdate()">
       <span>{{'update' | translate}}</span></button>
   </div>
   <div class="pagePart whenOneLine">
@@ -82,35 +82,58 @@
     <ng-template #totalTemplate> 共 {{ total }} 项</ng-template>
   </div>
 </div>
+
 <nz-modal [(nzVisible)]="isAddConV" [nzContent]="con1" nzWidth="500"
-          [nzFooter]="foot1" (nzOnCancel)="cancel(isAddConV)" nzMaskClosable="false">
+          [nzFooter]="foot1" (nzOnCancel)="cancel('isAddConV')" nzMaskClosable="false">
   <ng-template #con1>
-    11111111
+    新增传感器
   </ng-template>
   <ng-template #foot1>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isAddConV)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isAddConV)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isAddConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>
 
 <nz-modal [(nzVisible)]="isMultiAddConV" [nzContent]="con2" nzWidth="500"
-          [nzFooter]="foot2" (nzOnCancel)="cancel(isMultiAddConV)" nzMaskClosable="false">
+          [nzFooter]="foot2" (nzOnCancel)="cancel('isMultiAddConV')" nzMaskClosable="false">
   <ng-template #con2>
-    11111111
+    批量新增传感器
   </ng-template>
   <ng-template #foot2>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isMultiAddConV)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isMultiAddConV)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isMultiAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isMultiAddConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>
 
-<nz-modal [(nzVisible)]="isBindCon" [nzContent]="con3" nzWidth="500"
-          [nzFooter]="foot3" (nzOnCancel)="cancel(isBindCon)" nzMaskClosable="false">
+<nz-modal [(nzVisible)]="isBindConV" [nzContent]="con3" nzWidth="500"
+          [nzFooter]="foot3" (nzOnCancel)="cancel('isBindConV')" nzMaskClosable="false">
   <ng-template #con3>
-    11111111
+    绑定/批量绑定传感器
   </ng-template>
   <ng-template #foot3>
-    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel(isBindCon)"><span>{{'cancel' | translate}}</span></button>
-    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save(isBindCon)"><span>{{'confirm' | translate}}</span></button>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isBindConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isBindConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isUpdateConV" [nzContent]="con4" nzWidth="500"
+          [nzFooter]="foot4" (nzOnCancel)="cancel('isUpdateConV')" nzMaskClosable="false">
+  <ng-template #con4>
+    编辑传感器
+  </ng-template>
+  <ng-template #foot4>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isUpdateConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isUpdateConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isDivideConV" [nzContent]="con5" nzWidth="500"
+          [nzFooter]="foot5" (nzOnCancel)="cancel('isDivideConV')" nzMaskClosable="false">
+  <ng-template #con5>
+    分配传感器
+  </ng-template>
+  <ng-template #foot5>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isDivideConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isDivideConV')"><span>{{'confirm' | translate}}</span></button>
   </ng-template>
 </nz-modal>

src/app/main/sensor-mgr/sensor-mgr.component.ts

@@ -22,13 +22,12 @@ export class SensorMgrComponent implements OnInit {
 
   data = [];
   query = {
-    sensorName: '',
-    sensorSN: ''
+    gatewayName: '',
+    gatewaySN: ''
   };
   isLoading = false;
   isAllCheck = false;
   isIndeterminate = false;
-  checkArray = [];
   page = 1;
   rows = 10;
   total = 125;
@@ -36,11 +35,13 @@ export class SensorMgrComponent implements OnInit {
   selectedOne: any = {};
   isAddConV = false;
   isMultiAddConV = false;
-  isBindCon = false;
+  isBindConV = false;
   isMulti = false;
-  addReq = {};
-  bindReq = {};
-  divideReq = {};
+  canbind = false;
+  canUnbind = false;
+  isCheckedOne = false;
+  isDivideConV = false;
+  isUpdateConV = false;
 
   constructor(private api: ApiService, private message: NzMessageService, private router: Router,
               private modalService: NzModalService, private translate: TranslateService) {
@@ -56,9 +57,8 @@ export class SensorMgrComponent implements OnInit {
 
   next = (data) => {
     if (data && data.rows && data.rows.constructor === Array) {
-      this.data = data.rows;
+      this.data = data.rows.filter(one => { one.isOn = Math.random() > 0.5; return one; });
       this.total = data.total;
-      this.initCheckArray(data.rows.length, false);
     } else if (data.code === 1) {
       this.message.success(data && data.message ? data.message : '操作成功');
     } else if (data.code === 0) {
@@ -67,130 +67,164 @@ export class SensorMgrComponent implements OnInit {
       this.message.error(data && data.message ? data.message : '获取数据失败');
     }
     this.isLoading = false;
-  };
+  }
 
   getData() {
     this.isLoading = true;
     this.api.loginlog.getAll(this.page, this.rows, ['', this.next]);
   }
 
-  initCheckArray(n, b) {
-    const obj = [];
-    while (n > 0) {
-      obj.push(b);
-      n--;
-    }
-    this.checkArray = obj;
-  }
-
   onSearch() {
   }
 
   onGetAll() {
   }
 
+  // 复选框的方法
+  initCheckArray(b) {
+    if (b) {
+      this.isCheckedOne = true;
+    }
+    this.data.map((one) => one.checked = b);
+  }
+
   checkAll(e) {
     this.isIndeterminate = false;
-    this.initCheckArray(this.checkArray.length, e);
+    this.initCheckArray(e);
+    this.checkCanBind();
   }
 
-  oneCheck(i) {
-    const x = this.checkArray.filter(k => k).length;
-    if (x === this.checkArray.length) {
-      this.isIndeterminate = false;
+  oneCheck() {
+    this.isCheckedOne = true;
+    this.isIndeterminate = false;
+    this.isAllCheck = false;
+    const sum = this.data.filter((one) => one.checked).length;
+    if (sum === this.data.length) {
       this.isAllCheck = true;
-    } else if (x === 0) {
-      this.isIndeterminate = false;
-      this.isAllCheck = false;
+    } else if (sum === 0) {
+      this.isCheckedOne = false;
+      this.canbind = false;
+      this.canUnbind = false;
     } else {
       this.isIndeterminate = true;
-      this.isAllCheck = false;
+    }
+    this.checkCanBind();
+  }
+
+  checkCanBind() {
+    const obj = this.data.filter(one => one.checked);
+    if (obj.length === 0) {
+      this.canbind = false;
+      this.canUnbind = false;
+    } else {
+      const flag = obj[0].isOn;
+      if (obj.filter(one => one.isOn === flag).length === obj.length) {
+        this.canbind = flag;
+        this.canUnbind = !flag;
+      } else {
+        this.canbind = false;
+        this.canUnbind = false;
+      }
     }
   }
 
+  // 筛选
   filter(a, b) {
     console.log(a, b);
   }
 
-  getAllChecked() {
-    const obj = [];
-    this.data.map((one, index) => {
-      if (this.checkArray[index]) {
-        obj.push(index);
-      }
-    });
-    return obj;
+  // 跳转详情
+  toSee(e) {
+    this.router.navigate(['/app/deviceCenter/gatewayMgr/gatewaySee']);
   }
 
-  deleteConfirm(one) {
-    this.modalService.confirm({
-      nzTitle  : '<i></i>',
-      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
-      nzOnOk   : () => this.delete(one)
-    });
+  // 单个的方法
+  add() {
+    this.isMulti = false;
+    this.isAddConV = true;
   }
 
-  allDelete() {
+  bind(one) {
+    this.isMulti = false;
+    this.selectedOne = one;
+    this.isBindConV = true;
+  }
+
+  unbind(one) {
     this.modalService.confirm({
       nzTitle  : '<i></i>',
       nzContent: '<b>' + this.translate.instant('confirmDeleteSelectedRecord') + '</b>',
-      nzOnOk   : () => this.deleteAll()
+      nzOnOk   : () => this.unbindOne(one)
     });
   }
 
-  delete(one) {}
+  unbindOne(one) {}
 
-  deleteAll() {
-    const obj = this.getAllChecked();
-    console.log(obj);
+  update(one) {
+    this.isMulti = false;
+    this.selectedOne = one;
+    this.isUpdateConV = true;
   }
 
-  allDivide() {
-    this.isMulti = true;
+  cancel(v) {
+    this[v] = false;
   }
 
-  allBind() {
-    this.isMulti = true;
+  save(v) {
+    this[v] = false;
   }
 
-  allUnbind() {
-    this.isMulti = true;
+  deleteConfirm(one) {
+    this.modalService.confirm({
+      nzTitle  : '<i></i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
+      nzOnOk   : () => this.delete(one)
+    });
   }
 
+  delete(one) {}
+
+  // 批量的方法
   allUpdate() {
     this.isMulti = true;
+    this.isUpdateConV = true;
   }
 
   multiAdd() {
     this.isMulti = true;
+    this.isMultiAddConV = true;
   }
 
-  toSee(e) {
-    this.router.navigate(['/app/deviceCenter/sensorMgr/sensorDetail']);
+  allDivide() {
+    this.isMulti = true;
+    this.isDivideConV = true;
   }
 
-  add() {
-    this.isMulti = false;
-    this.isAddConV = true;
+  allBind() {
+    this.isMulti = true;
+    this.isBindConV = true;
   }
 
-  bind(one) {
-    this.isMulti = false;
-    this.selectedOne = one;
+  allDelete() {
+    this.modalService.confirm({
+      nzTitle  : '<i></i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteSelectedRecord') + '</b>',
+      nzOnOk   : () => this.deleteAll()
+    });
   }
 
-  update(one) {
-    this.isMulti = false;
-    this.selectedOne = one;
-  }
+  deleteAll() {}
 
-  cancel(v) {
-    this[v] = false;
-  }
-  save(v) {
-    this[v] = false;
+  allUnbind() {
+    this.modalService.confirm({
+      nzTitle  : '<i></i>',
+      nzContent: '<b>' + this.translate.instant('confirmUnbindSelectedRecord') + '</b>',
+      nzOnOk   : () => this.unbindAll()
+    });
   }
 
+  unbindAll() {}
+
   toggleOn(one) {
     one.isLoading = true;
     setTimeout(() => {

src/app/main/topic-module-mgr/topic-module-mgr.component.html

@@ -49,3 +49,24 @@
     </tbody>
   </nz-table>
 </div>
+<nz-modal [(nzVisible)]="isAddConV" [nzContent]="con1" nzWidth="500"
+          [nzFooter]="foot1" (nzOnCancel)="cancel('isAddConV')" nzMaskClosable="false">
+  <ng-template #con1>
+    新增/编辑主题模板
+  </ng-template>
+  <ng-template #foot1>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isAddConV')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isAddConV')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>
+
+<nz-modal [(nzVisible)]="isSaveOther" [nzContent]="con2" nzWidth="500"
+          [nzFooter]="foot2" (nzOnCancel)="cancel('isSaveOther')" nzMaskClosable="false">
+  <ng-template #con2>
+    另存为主题模板
+  </ng-template>
+  <ng-template #foot2>
+    <button nz-button nzType="default" [nzLoading]="isLoading" (click)="cancel('isSaveOther')"><span>{{'cancel' | translate}}</span></button>
+    <button nz-button nzType="primary" [nzLoading]="isLoading" (click)="save('isSaveOther')"><span>{{'confirm' | translate}}</span></button>
+  </ng-template>
+</nz-modal>

src/app/main/topic-module-mgr/topic-module-mgr.component.ts

 import {Component, OnInit} from '@angular/core';
 import {ApiService} from '../../service/api';
-import {NzMessageService} from 'ng-zorro-antd';
+import {NzMessageService, NzModalService} from 'ng-zorro-antd';
 import {TranslateService} from '@ngx-translate/core';
 import {fadeIn} from '../../animation/fade-in';
 import {Router} from '@angular/router';
@@ -19,8 +19,11 @@ export class TopicModuleMgrComponent implements OnInit {
   page: any = 1;
   rows: any = 10;
   total: any;
+  isAddConV = false;
+  isUpdate = false;
+  isSaveOther = false;
 
-  constructor(private api: ApiService, private message: NzMessageService,
+  constructor(private api: ApiService, private message: NzMessageService, private modalService: NzModalService,
               private translate: TranslateService, private router: Router) {
   }
 
@@ -61,7 +64,7 @@ export class TopicModuleMgrComponent implements OnInit {
       this.message.error(data.message || this.translate.instant('wrongToGetData'));
     }
     this.isLoading = false;
-  };
+  }
 
   searchData() {
     if (this.req.startTime || this.req.endTime) {
@@ -75,11 +78,35 @@ export class TopicModuleMgrComponent implements OnInit {
     this.router.navigate(['/app/deviceCenter/topicModuleMgr/topicModuleDetail']);
   }
 
-  saveOther(one) {}
+  saveOther(one) {
+    this.isSaveOther = true;
+  }
+
+  add() {
+    this.isUpdate = false;
+    this.isAddConV = true;
+  }
+
+  update(one) {
+    this.isUpdate = true;
+    this.isAddConV = true;
+  }
 
-  update(one) {}
+  cancel(v) {
+    this[v] = false;
+  }
 
-  deleteConfirm(one) {}
+  save(v) {
+    this[v] = false;
+  }
+
+  deleteConfirm(one) {
+    this.modalService.confirm({
+      nzTitle  : '<i> </i>',
+      nzContent: '<b>' + this.translate.instant('confirmDeleteThisRecord') + '</b>',
+      nzOnOk   : () => this.delete(one)
+    });
+  }
 
-  add() {}
+  delete(one) {}
 }

src/styles.scss

@@ -133,7 +133,7 @@ ol, ul {
   cursor: pointer;
 }
 
-.whenHover:hover, .whenHover:focus {
+.textStyle2:hover, .textStyle2:focus {
   color: #005691 !important;
 }