From 1fdd2c6fe276c5d9849c14739eaba37061264eb5 Mon Sep 17 00:00:00 2001 From: fengxiang <110431245@qq.com> Date: Mon, 16 Jul 2018 11:36:33 +0800 Subject: [PATCH] 统计分析 划分独立模块 --- src/app/routes/home-page/home-page/home-page.component.html | 150 ++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 140 insertions(+), 10 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 b3a8e0b..ca221fc 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 @@ -96,14 +96,144 @@ </div> </div> <div nz-row [nzGutter]="24" class="pt-lg"> - <div nz-col nzXs="24" nzMd="12"> - <nz-card [nzBordered]="false"> - <div echarts style="margin-top: 12px;" [options]="chartOption" [loading]="aqiChartLoading" class="line-chart" (chartInit)="onApiChartInit($event)"></div> - </nz-card> - </div> - <div nz-col nzXs="24" nzMd="12"> - <nz-card [nzBordered]="false"> - 22222222222 - </nz-card> - </div> + <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> + 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> + </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]="'online'"><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