fengxiang
2018-03-23 ffa0c63b06be82359b92004324e4d66949fe890a
src/app/routes/analysis/query/query.component.html
@@ -10,14 +10,14 @@
                        <label>监测项目</label>
                    </div>
                    <div nz-form-control class="flex-1">
                        <nz-popover [nzTitle]="'请选择'" [(nzVisible)]="visible" [nzPlacement]="'bottomLeft'" [nzTrigger]="'hover'">
                        <nz-popover [nzTitle]="'请选择'" [nzPlacement]="'bottomLeft'" [nzTrigger]="'hover'">
                            <nz-input [nzType]="'input'" nz-popover [ngModel]="sensorNames" name="sensorNames" [nzReadonly]="true" [nzPlaceHolder]="'请选择监控类型'">
                                <ng-template #suffix>
                                    <i class="anticon anticon-plus ant-input-search-icon"></i>
                                </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;">{{ !isChartCollapse?'':chartTitle }}</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}">
                            <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,14 +152,15 @@
                </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)">
                        <td  nz-td class='sensor-name' [ngStyle]="{'background-color': '#FFF','position': 'relative','text-align': 'center', 'left':sensorNameScrollLeft}">
                            <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>