传感器历史数据页面增加了一个主题的选择框

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

@@ -143,42 +143,55 @@
           </nz-table>
         </nz-tab>
         <nz-tab nzTitle="图表">
-          <div class="cards">
-            <div class="card" *ngFor="let one of actualData;let i = index">
-              <div class="title">
-                {{one.alias}}
-                <div class="rightSpan canClick" (click)="OnReqHistroyChart(i)">查看数据</div>
-              </div>
-              <div class="middle">
-                <div class="left">{{one.value}}{{one.unit === '-' ? '' : one.unit}}</div>
-                <div class="right">
-                  {{one.rangeMin}}{{one.unit === '-' ? '' : one.unit}} - {{one.rangeMax}}{{one.unit === '-' ? '' : one.unit}}
+          <nz-row style="min-height: 50px;">
+            <nz-col [nzSpan]="2">
+              <p>请选择主题</p>
+            </nz-col>
+            <nz-col [nzSpan]="5">
+              <nz-select [(ngModel)]="selectedTopicValue" nzAllowClear nzPlaceHolder="Choose" style="min-width: 300px">
+                <nz-option *ngFor="let one of deviceData" [nzValue]="one.topicName" [nzLabel]="one.topicName"></nz-option>
+              </nz-select>
+            </nz-col>
+
+          </nz-row>
+          <nz-row>
+            <div class="cards">
+              <div class="card" *ngFor="let one of actualData;let i = index">
+                <div class="title">
+                  {{one.alias}}
+                  <div class="rightSpan canClick" (click)="OnReqHistroyChart(i)">查看数据</div>
+                </div>
+                <div class="middle">
+                  <div class="left">{{one.value}}{{one.unit === '-' ? '' : one.unit}}</div>
+                  <div class="right">
+                    {{one.rangeMin}}{{one.unit === '-' ? '' : one.unit}} - {{one.rangeMax}}{{one.unit === '-' ? '' : one.unit}}
+                  </div>
+                </div>
+                <div class="bottom">
+                  {{one.time | date: 'yyyy-MM-dd HH:mm:ss'}}
                 </div>
               </div>
-              <div class="bottom">
-                {{one.time | date: 'yyyy-MM-dd HH:mm:ss'}}
-              </div>
-            </div>
-          </div>
-          <div class="charts" *ngIf="isClose">
-            <div style="width: calc(100% - 80px);display: inline-block;vertical-align: top;padding-left: 15px;">
-              <app-search-select inModal="true" [label]="'selectTime' | translate" [(value)]="selectTime3"
-                                 optL="a" optV="b" [data]="[{a: '1小时', b: 1}, {a: '24小时', b: 24}, {a: '7天', b: 144}, {a: '自定义', b: 0}]"></app-search-select>
-              <app-search-date *ngIf="selectTime3 === 0" inModal="true" [label]="'startTime' | translate" [(value)]="req3.startTime"
-                               showTime="true"></app-search-date>
-              <app-search-date *ngIf="selectTime3 === 0" inModal="true" [label]="'endTime' | translate" [(value)]="req3.endTime"
-                               showTime="true"></app-search-date>
             </div>
-            <button nz-button class="searchBtn" [nzType]="'primary'" [nzLoading]="isLoading" (click)="onSearch()">
-              <span>{{'search' | translate}}</span></button>
-            <nz-tabset style="border-top: 1px solid #cccccc">
-              <nz-tab nzTitle="图表"><div echarts [options] = "chartOption" class="demo-chart"></div></nz-tab>
-            </nz-tabset>
-            <div class="btnLine">
-              <button nz-button class="searchBtn" [nzType]="'default'" [nzLoading]="isLoading" (click)="isClose = false;">
-                <span>{{'close' | translate}}</span></button>
+            <div class="charts" *ngIf="isClose">
+              <div style="width: calc(100% - 80px);display: inline-block;vertical-align: top;padding-left: 15px;">
+                <app-search-select inModal="true" [label]="'selectTime' | translate" [(value)]="selectTime3"
+                                   optL="a" optV="b" [data]="[{a: '1小时', b: 1}, {a: '24小时', b: 24}, {a: '7天', b: 144}, {a: '自定义', b: 0}]"></app-search-select>
+                <app-search-date *ngIf="selectTime3 === 0" inModal="true" [label]="'startTime' | translate" [(value)]="req3.startTime"
+                                 showTime="true"></app-search-date>
+                <app-search-date *ngIf="selectTime3 === 0" inModal="true" [label]="'endTime' | translate" [(value)]="req3.endTime"
+                                 showTime="true"></app-search-date>
+              </div>
+              <button nz-button class="searchBtn" [nzType]="'primary'" [nzLoading]="isLoading" (click)="onSearch()">
+                <span>{{'search' | translate}}</span></button>
+              <nz-tabset style="border-top: 1px solid #cccccc">
+                <nz-tab nzTitle="图表"><div echarts [options] = "chartOption" class="demo-chart"></div></nz-tab>
+              </nz-tabset>
+              <div class="btnLine">
+                <button nz-button class="searchBtn" [nzType]="'default'" [nzLoading]="isLoading" (click)="isClose = false;">
+                  <span>{{'close' | translate}}</span></button>
+              </div>
             </div>
-          </div>
+          </nz-row>
         </nz-tab>
       </nz-tabset>
     </nz-tab>

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

@@ -52,6 +52,7 @@ export class SensorDetailComponent implements OnInit {
   hisTopicName;
   hisAlias;
   hisDevInfo;
+  selectedTopicValue;
 
   constructor(private api: ApiService, private message: NzMessageService, private router: Router, private ck: CheckService,
               private ac: ActivatedRoute, private modalService: NzModalService, private translate: TranslateService) {
@@ -180,7 +181,8 @@ export class SensorDetailComponent implements OnInit {
 
 
   getHistoryData(): void {
-    this.hisTopicName = this.wayData[0].topicName;
+    // this.hisTopicName = this.wayData[0].topicName;
+    this.hisTopicName = this.selectedTopicValue;
     this.api.data.getHisData([{   alias: this.hisDevInfo.alias, deviceList: [{sn: this.hisDevInfo.SN,
         type: this.hisDevInfo.dType}], endTime: this.selectTime3 ? new Date().getTime() : this.req3.startTime,
        offset: 0 - new Date().getTimezoneOffset() / 60,