From af9fa5a094ca652293a890f06634b59c955e1067 Mon Sep 17 00:00:00 2001
From: fengxiang <110431245@qq.com>
Date: Mon, 30 Jul 2018 09:06:15 +0800
Subject: [PATCH] token刷新
---
src/app/routes/home-page/home-page/home-page.component.html | 346 +++++++++++++++++++++++++++------------------------------
1 files changed, 164 insertions(+), 182 deletions(-)
diff --git a/src/app/routes/home-page/home-page/home-page.component.html b/src/app/routes/home-page/home-page/home-page.component.html
index a503f58..612f176 100644
--- a/src/app/routes/home-page/home-page/home-page.component.html
+++ b/src/app/routes/home-page/home-page/home-page.component.html
@@ -3,36 +3,45 @@
</div>
<div nz-row [nzGutter]="24" class="pt-lg">
<div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">
- <div nz-row nzType="flex" nzAlign="middle" class="bg-primary rounded-md">
- <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
- <div style="height: 40px;" class="h2 mt0">{{ cardData.api }}</div>
- <p class="text-nowrap mb0">AQI</p>
+ <nz-spin [nzSpinning]="firstRowLoading">
+ <div nz-row nzType="flex" nzAlign="middle" class="bg-primary rounded-md">
+ <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
+ <div style="height: 40px;" class="h2 mt0">{{ cardData.aqi }}</div>
+ <p class="text-nowrap mb0">AQI</p>
+ </div>
+
</div>
- </div>
+ </nz-spin>
</div>
<div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">
- <div nz-row nzType="flex" nzAlign="middle" class="bg-success rounded-md">
- <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
- <div style="height: 40px;" class="h2 mt0">{{ cardData.temperature }} ���</div>
- <p class="text-nowrap mb0">������</p>
+ <nz-spin [nzSpinning]="firstRowLoading">
+ <div nz-row nzType="flex" nzAlign="middle" class="bg-success rounded-md">
+ <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
+ <div style="height: 40px;" class="h2 mt0">{{ cardData.temperature }} ���</div>
+ <p class="text-nowrap mb0">������</p>
+ </div>
</div>
- </div>
+ </nz-spin>
</div>
<div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">
- <div nz-row nzType="flex" nzAlign="middle" class="bg-orange rounded-md">
- <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
- <div style="height: 40px;" class="h2 mt0">{{ cardData.windDirection }}</div>
- <p class="text-nowrap mb0">������</p>
+ <nz-spin [nzSpinning]="firstRowLoading">
+ <div nz-row nzType="flex" nzAlign="middle" class="bg-orange rounded-md">
+ <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
+ <div style="height: 40px;" class="h2 mt0">{{ cardData.windDirection }}</div>
+ <p class="text-nowrap mb0">������</p>
+ </div>
</div>
- </div>
+ </nz-spin>
</div>
<div nz-col nzXs="24" nzSm="12" nzMd="6" class="mb-md">
- <div nz-row nzType="flex" nzAlign="middle" class="bg-pink rounded-md">
- <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
- <div style="height: 40px;" class="h2 mt0">{{ cardData.pm25 }} mg/m��</div>
- <p class="text-nowrap">PM2.5</p>
+ <nz-spin [nzSpinning]="firstRowLoading">
+ <div nz-row nzType="flex" nzAlign="middle" class="bg-pink rounded-md">
+ <div nz-col nzSpan="24" class="p-md text-white" style="height: 90px;text-align: center;">
+ <div style="height: 40px;" class="h2 mt0">{{ cardData.pm25 }} mg/m��</div>
+ <p class="text-nowrap">PM2.5</p>
+ </div>
</div>
- </div>
+ </nz-spin>
</div>
</div>
<div nz-row [nzGutter]="24" class="pt-lg">
@@ -56,31 +65,24 @@
<div nz-col nzXs="24" nzMd="24">
<nz-card [nzBordered]="false">
<ng-template #title>
- AQI���������������
+ AQI���������������(������24������)
<nz-dropdown>
<a class="ant-dropdown-link" nz-dropdown>
- PM2.5 <i class="anticon anticon-down"></i>
+ {{ selectedApiItem.name }}
+ <i class="anticon anticon-down"></i>
</a>
<ul nz-menu>
- <li nz-menu-item>
- PM10
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������
- </li>
+ <li *ngFor="let item of aqiItems" [ngClass]="{'ant-dropdown-menu-item-selected':item.selected}"
+ (click) ="setSelectedApiItem(item)" nz-menu-item>
+ {{ item.name }}
+ </li>
</ul>
- </nz-dropdown>
+ </nz-dropdown>
</ng-template>
- <bar height="275" [data]="salesData"></bar>
+ <nz-spin [nzTip]="'���������...'" [nzSpinning]="aqiDataLoading">
+ <p class="text-left text-md">������:{{ selectedApiItem.unit }}</p>
+ <bar height="275" [data]="aqiData"></bar>
+ </nz-spin>
</nz-card>
</div>
</div>
@@ -88,152 +90,132 @@
<div nz-col nzXs="24" nzMd="24">
<nz-card [nzBordered]="false">
<ng-template #title>
- ������������GIS������
- <small class="text-sm font-weight-normal">������: 128</small>
+ ������������GIS������
+ <small class="text-sm font-weight-normal">������: 128</small>
</ng-template>
- <iframe style="width: 100%; height: 500px;" target="_top" src="http://monitor-api2.7drlb.com/screen/map-page?areaCode=320583&accountId=1" frameborder="0"></iframe>
+ <iframe style="width: 100%; height: 500px;" target="_top" src="http://monitor-api2.7drlb.com/screen/map-page?areaCode=320583&accountId=1"
+ frameborder="0"></iframe>
</nz-card>
</div>
- </div>
- <div nz-row [nzGutter]="24" class="pt-lg">
+</div>
+<div nz-row [nzGutter]="24" class="pt-lg">
<div nz-col style="display: block;" nzXs="24" nzMd="24">
- <nz-card [nzBordered]="false">
+ <nz-card [nzBordered]="false">
<ng-template #title>
- ������������������
- <nz-dropdown>
- <a class="ant-dropdown-link" nz-dropdown>
- PM2.5 <i class="anticon anticon-down"></i>
- </a>
- <ul nz-menu>
- <li nz-menu-item>
- PM10
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������
- </li>
- </ul>
- </nz-dropdown>
- </ng-template>
- <div echarts style="margin-top: 12px;" class="line-chart" [options]="aqiChartOption" [loading]="aqiChartLoading" (chartInit)="onApiChartInit($event)"></div>
- </nz-card>
+ ������������������(24������)
+ <nz-dropdown>
+ <a class="ant-dropdown-link" nz-dropdown>
+ {{ selectedApiForecastItem.name }}
+ <i class="anticon anticon-down"></i>
+ </a>
+ <ul nz-menu>
+ <li *ngFor="let item of aqiForecastItems" [ngClass]="{'ant-dropdown-menu-item-selected':item.selected}"
+ (click) ="setSelectedApiForecastItem(item)" nz-menu-item>
+ {{ item.name }}
+ </li>
+ </ul>
+ </nz-dropdown>
+ </ng-template>
+ <p class="text-left text-md">������:{{ selectedApiForecastItem.unit }}</p>
+ <div echarts style="margin: 0;height: 300px;" class="line-chart" [options]="aqiChartOption" [loading]="aqiForecastDataLoading" (chartInit)="onApiChartInit($event)"></div>
+ </nz-card>
</div>
- </div>
- <div nz-row [nzGutter]="24" class="pt-lg">
- <div nz-col style="display: block;" nzXs="24" nzMd="24">
- <nz-card [nzBordered]="false">
- <ng-template #title>
- ������������
- <nz-dropdown>
- <a class="ant-dropdown-link" nz-dropdown>
- ������<i class="anticon anticon-down"></i>
- </a>
- <ul nz-menu>
- <li nz-menu-item>
- ������
- </li>
- <li nz-menu-item>
- ������
- </li>
- <li nz-menu-item>
- ������
- </li>
- <li nz-menu-item>
- ������
- </li>
- </ul>
- </nz-dropdown>
- </ng-template>
- <div echarts style="margin-top: 12px;" class="line-chart" [options]="meteChartOption" [loading]="meteChartLoading" (chartInit)="onMeteChartInit($event)"></div>
- </nz-card>
- </div>
- </div>
- <div nz-row [nzGutter]="24">
- <div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="12">
- <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="������������������">
- <ng-template #extra>
- <nz-dropdown>
- <nz-dropdown>
- <a class="ant-dropdown-link" nz-dropdown>
- PM2.5 <i class="anticon anticon-down"></i>
- </a>
- <ul nz-menu>
- <li nz-menu-item>
- PM10
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������������
- </li>
- <li nz-menu-item>
- ������
- </li>
- </ul>
- </nz-dropdown>
- </nz-dropdown>
- </ng-template>
- <ng-template #body>
- <nz-table #keyTable [nzDataSource]="data.searchData" [nzPageSize]="5" nzSize="small">
- <thead nz-thead>
- <tr>
- <th nz-th><span>������</span></th>
- <th nz-th><span>������������������</span></th>
- <th nz-th class="text-right">
- <span>������������������</span>
- <nz-table-sort (nzValueChange)="sort('count',$event)"></nz-table-sort>
- </th>
- </tr>
- </thead>
- <tbody nz-tbody>
- <tr nz-tbody-tr *ngFor="let i of keyTable.data">
- <td nz-td>{{i.index}}</td>
- <td nz-td><a (click)="msg.success(i.keyword)">{{i.keyword}}</a></td>
- <td nz-td class="text-right">{{i.count}}</td>
- </tr>
- </tbody>
- </nz-table>
- </ng-template>
- </nz-card>
- </div>
- <div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="12">
- <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="������������������" [nzBodyStyle]="{'padding.px': 24}" class="sales-card" style="min-height: 482px;">
- <ng-template #extra>
- <div class="sales-card-extra">
- <div class="sales-type-radio">
- <nz-radio-group [(ngModel)]="salesType" (ngModelChange)="changeSaleType()" [nzSize]="'large'">
- <label nz-radio-button [nzValue]="'all'"><span>������</span></label>
- <label nz-radio-button [nzValue]="'online'"><span>������</span></label>
- <label nz-radio-button [nzValue]="'offline'"><span>������</span></label>
- <label nz-radio-button [nzValue]="'online2'"><span>������</span></label>
- </nz-radio-group>
- </div>
- </div>
- </ng-template>
- <ng-template #body>
- <h4 class="margin:8px 0 32px 0;">������������</h4>
- <pie
- [hasLegend]="true"
- subTitle="������������"
- [height]="248"
- [lineWidth]="4"
- [total]="salesTotal"
- [data]="salesPieData"
- [valueFormat]="handlePieValueFormat">
- </pie>
- </ng-template>
- </nz-card>
- </div>
- </div>
+</div>
+<div nz-row [nzGutter]="24" class="pt-lg">
+ <div nz-col style="display: block;" nzXs="24" nzMd="24">
+ <nz-card [nzBordered]="false">
+ <ng-template #title>
+ ������������(24������)
+ <nz-dropdown>
+ <a class="ant-dropdown-link" nz-dropdown>
+ {{ selectedMeteItem.name }}
+ <i class="anticon anticon-down"></i>
+ </a>
+ <ul nz-menu>
+ <li *ngFor="let item of meteItems" [ngClass]="{'ant-dropdown-menu-item-selected':item.selected}"
+ (click) ="setSelectedMeteItem(item)" nz-menu-item>
+ {{ item.name }}
+ </li>
+ </ul>
+ </nz-dropdown>
+ </ng-template>
+ <p class="text-left text-md">������:{{ selectedMeteItem.unit }}</p>
+ <div echarts style="margin: 0;height: 300px;" class="line-chart" [options]="meteChartOption" [loading]="meteChartLoading" (chartInit)="onMeteChartInit($event)"></div>
+ </nz-card>
+ </div>
+</div>
+<div nz-row [nzGutter]="24">
+ <div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="12">
+ <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="������������������">
+ <ng-template #extra>
+ <nz-dropdown>
+ <a class="ant-dropdown-link" nz-dropdown>
+ {{ selectedApiSortedItem.name }}
+ <i class="anticon anticon-down"></i>
+ </a>
+ <ul nz-menu>
+ <li *ngFor="let item of apiSortedItems" [ngClass]="{'ant-dropdown-menu-item-selected':item.selected}"
+ (click) ="setSelectedApiSortedItem(item)" nz-menu-item>
+ {{ item.name }}
+ </li>
+ </ul>
+ </nz-dropdown>
+ </ng-template>
+ <ng-template #body>
+ <nz-table #keyTable [nzDataSource]="apiSortedTableList" [nzLoading]="apiSortedTableLoading" [nzPageSize]="8" nzSize="small">
+ <thead nz-thead>
+ <tr>
+ <th nz-th>
+ <span>������</span>
+ </th>
+ <th nz-th>
+ <span>������������������</span>
+ </th>
+ <th nz-th class="text-right">
+ <span>������({{selectedApiSortedItem.unit}})</span>
+ <nz-table-sort (nzValueChange)="aqiSortedTableSort('sum',$event)"></nz-table-sort>
+ </th>
+ </tr>
+ </thead>
+ <tbody nz-tbody>
+ <tr nz-tbody-tr *ngFor="let i of keyTable.data;let j = index">
+ <td nz-td>{{j + 1}}</td>
+ <td nz-td><a>{{i.name}}</a></td>
+ <td nz-td class="text-right">{{i.avg}}</td>
+ </tr>
+ </tbody>
+ </nz-table>
+ </ng-template>
+ </nz-card>
+ </div>
+ <div nz-col nzXs="24" nzSm="24" nzMd="24" nzLg="12">
+ <nz-card [nzLoading]="loading" [nzBordered]="false" nzTitle="������������������" [nzBodyStyle]="{'padding.px': 24}" class="sales-card"
+ style="min-height: 482px;">
+ <ng-template #extra>
+ <div class="sales-card-extra">
+ <div class="sales-type-radio">
+ <nz-radio-group [(ngModel)]="salesType" (ngModelChange)="changeSaleType()" [nzSize]="'large'">
+ <label nz-radio-button [nzValue]="'all'">
+ <span>������</span>
+ </label>
+ <label nz-radio-button [nzValue]="'online'">
+ <span>������</span>
+ </label>
+ <label nz-radio-button [nzValue]="'offline'">
+ <span>������</span>
+ </label>
+ <label nz-radio-button [nzValue]="'online2'">
+ <span>������</span>
+ </label>
+ </nz-radio-group>
+ </div>
+ </div>
+ </ng-template>
+ <ng-template #body>
+ <h4 class="margin:8px 0 32px 0;">������������</h4>
+ <pie [hasLegend]="true" subTitle="������������" [height]="248" [lineWidth]="4" [total]="salesTotal" [data]="salesPieData" [valueFormat]="handlePieValueFormat">
+ </pie>
+ </ng-template>
+ </nz-card>
+ </div>
+</div>
--
Gitblit v1.8.0