From ba6f868ccc79328594f42d85ea34ca254e5d51d8 Mon Sep 17 00:00:00 2001
From: fengxiang <110431245@qq.com>
Date: Sat, 24 Mar 2018 23:05:43 +0800
Subject: [PATCH] grid 冻结 功能 延迟bug修复

---
 src/app/routes/analysis/query/query.component.html |   62 +++++++++++++++++++++++++------
 1 files changed, 50 insertions(+), 12 deletions(-)

diff --git a/src/app/routes/analysis/query/query.component.html b/src/app/routes/analysis/query/query.component.html
index 7f0441c..2d511a8 100644
--- a/src/app/routes/analysis/query/query.component.html
+++ b/src/app/routes/analysis/query/query.component.html
@@ -17,7 +17,7 @@
                                 </ng-template>
                             </nz-input>
                             <ng-template #nzTemplate>
-                                <div [ngStyle]="{'width': '200px', 'height': '300px', 'overflow-y' :'auto'}">
+                                <div [ngStyle]="{'width': '240px', 'height': '240px', 'overflow-y' :'auto'}">
                                     <nz-tree [nzNodes]="sensorOptions" [nzCheckable]="true" (nzCheck)="onSensorSelect($event)"></nz-tree>
                                 </div>
                             </ng-template>
@@ -54,7 +54,7 @@
                             <div nz-form-control class="flex-1">
                                 <nz-select name="actualYear"  [(ngModel)]="actualYear" [nzPlaceHolder]="'������ ������������'"
                                 (ngModelChange)="setTimeUnit($event)"    [nzNotFoundContent]="'������������'">
-                                    <nz-option *ngFor="let option of actualYearOptions" [nzLabel]="option" [nzValue]="option">
+                                    <nz-option *ngFor="let option of actualYearOptions" [nzLabel]="option + ' ���'" [nzValue]="option">
                                     </nz-option>
                                 </nz-select>
                               </div>
@@ -62,16 +62,16 @@
                     </div>
                 </div>
         </div>
-        <div *ngIf="!isCollapse" nz-row [nzGutter]="24">
+        <div  [ngStyle]="{'display':isCollapse ? 'none' : 'block' }" nz-row [nzGutter]="24">
             <div nz-col [nzSpan]="8" class="mb-md">
                 <div nz-form-item class="d-flex">
                     <div [ngStyle]="{'width': '70px'}" nz-form-label>
                         <label>���������</label>
                     </div>
                     <div nz-form-control class="flex-1">
-                        <nz-cascader [class.class123]="true" (nzChange)="setAreaCodes($event)"
-                            (nzLoad)="areaLazyLoad($event)" [nzPlaceHolder]="'������ ���/���/���'"
-                            [nzAllowClear]="false" [nzChangeOnSelect]="true" [(ngModel)]="_areas" name="_areas">
+                        <nz-cascader [class.class123]="true"
+                            (nzLoad)="areaLazyLoad($event)" [nzPlaceHolder]="'������ ���/���/���'" (nzSelectionChange) = "setAreasData($event)"
+                            [nzAllowClear]="false" [nzChangeOnSelect]="true" [ngModel]="_areas" name="areasData">
                         </nz-cascader>
                     </div>
                 </div>
@@ -121,14 +121,28 @@
             </div>
     </form>
 </nz-card>
+<nz-card>
+<div nz-row [nzGutter]="16">
+        <div nz-col [ngStyle]="{'display':isChartCollapse ? 'none' : 'block' }"  [nzMd]="24">
+            <div echarts   style="margin-top: 12px;" [options]="chartOption" [loading]="chartLoading" class="line-chart" (chartInit)="onChartInit($event)"></div>
+        </div>
+        <div *ngIf="isChartCollapse" style="width:100%; text-align:center;">
+            <span style="font-size:18px; font-weight: bold;">{{ _chartTitleTemp }}</span>
+        </div>
+        <a *ngIf="!!echartsIntance"  style="position: absolute; right: 0; top: -10px;" class="pl-sm" (click)="toggleChartCollapse()">
+            ������
+            <i class="anticon" [class.anticon-down]="isChartCollapse" [class.anticon-up]="!isChartCollapse"></i>
+        </a>
+</div>
+</nz-card>
 <div nz-row [nzGutter]="16">
     <div nz-col [nzMd]="24">
         <nz-card>
-            <nz-table #nzTable [nzScroll]="{ x:5000,y:400 }" [nzDataSource]="grid.data" [nzIsPagination]="false" [nzLoading]="grid.loading">
+            <nz-table #nzTable [nzScroll]="{ x:tableWidth,y:360 }" [nzDataSource]="grid.data" [nzIsPagination]="false" [nzLoading]="grid.loading">
                 <ng-template #nzFixedHeader>
                 <thead nz-thead>
                     <tr>
-                        <th nz-th [nzWidth]="'80px'" >
+                        <th nz-th [nzWidth]="'160px'" [ngStyle]="{'position': 'relative', 'text-align':'center', 'left':sensorNameScrollLeft+'px'}">
                             <span>������������</span>
                         </th>
                         <th nz-th [nzWidth]="'80px'" *ngFor="let col of grid.columns" [ngStyle]="{'width':col.width,'text-align':col['align'] === undefined?'left':col.align}">
@@ -138,20 +152,44 @@
                 </thead>
                </ng-template>
                 <tbody nz-tbody>
-                    <tr nz-tbody-tr *ngFor="let row of nzTable.data,index as i">
-                        <td  nz-td>
-                            <span>{{ gridSensorNames[i] }}</span>
+                    <tr nz-tbody-tr style="cursor:pointer;" *ngFor="let row of nzTable.data,index as i"
+                    (click) = "switchSensor(i)"
+                    (mouseover) ="sensorTableFocus(i)" (mouseout) ="sensorTableBlur(i)"
+                    [ngClass]="{'table-tr-focus-bgcolor': i === sensorTableFocusIndex,'table-tr-bgcolor-blur': i !== sensorTableFocusIndex}">
+                        <td  nz-td class='sensor-name' [ngStyle]="{'background-color': '#FFF'}">
+                            <span><span>{{ row.sensor.name+'('+row.sensor.unit+')' }}</span>&nbsp;<i *ngIf="chartSelectedIndex==i"  class="anticon anticon-line-chart"></i></span>
                         </td>
                         <td nz-td *ngFor="let col of grid.columns,index as n" [ngStyle]="{'width':col.width,'text-align':col['align'] === undefined?'left':col.align}">
                             <span [ngSwitch]="col.type">
                                 <!-- ������������������������������������ -->
-                                <span title="{{ row[n]|tyepHandle:col:row }}" style="width:100%; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;" *ngSwitchDefault> {{ row[n]|tyepHandle:col:row }} </span>
+                                <span title="{{ row.data[n]|tyepHandle:col:row }}" style="width:100%; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;" *ngSwitchDefault> {{ row.data[n]|tyepHandle:col:row }} </span>
                                 <!-- ������������������������������������ -->
                             </span>
                         </td>
                     </tr>
                 </tbody>
             </nz-table>
+            <div  *ngIf="grid.data.length>0" [ngClass]="{'table-scroll-box-shadow': sensorNameScrollLeft>2 }"  [ngStyle]="{'position': 'absolute', 'z-index':'99','top': '24px'}">
+                    <nz-table #nzTable  [nzDataSource]="grid.data" [nzIsPagination]="false">
+                            <thead nz-thead>
+                                    <tr>
+                                        <th nz-th [nzWidth]="'160px'" [ngStyle]="{'text-align':'center'}">
+                                            <span>������������</span>
+                                        </th>
+                                    </tr>
+                                </thead>
+                                <tbody nz-tbody>
+                                    <tr nz-tbody-tr   style="cursor:pointer;" *ngFor="let row of nzTable.data,index as i"
+                                    (mouseover) ="sensorTableFocus(i)" (mouseout) ="sensorTableBlur(i)"
+                                    [ngClass]="{'table-tr-focus-bgcolor': i === sensorTableFocusIndex,'table-tr-bgcolor-blur': i !== sensorTableFocusIndex}"
+                                    (click) = "switchSensor(i)">
+                                        <td  nz-td class='sensor-name'  [ngStyle]="{'width':'160px','text-align': 'center'}">
+                                            <span><span>{{ row.sensor.name+'('+row.sensor.unit+')' }}</span>&nbsp;<i *ngIf="chartSelectedIndex==i"  class="anticon anticon-line-chart"></i></span>
+                                        </td>
+                                    </tr>
+                                </tbody>
+                    </nz-table>
+                </div>
         </nz-card>
     </div>
 </div>

--
Gitblit v1.8.0