From 46d4905467aeaf1979613a156753b6625608820b Mon Sep 17 00:00:00 2001
From: xufenglei <xufenglei>
Date: Fri, 03 Aug 2018 17:24:02 +0800
Subject: [PATCH] 页面 优化
---
src/app/routes/statistics/calendar/calendar.component.html | 90 ++++++++++----------------------------------
1 files changed, 21 insertions(+), 69 deletions(-)
diff --git a/src/app/routes/statistics/calendar/calendar.component.html b/src/app/routes/statistics/calendar/calendar.component.html
index 121743b..49de164 100644
--- a/src/app/routes/statistics/calendar/calendar.component.html
+++ b/src/app/routes/statistics/calendar/calendar.component.html
@@ -1,75 +1,27 @@
+<div class="content__title">
+ <h1>
+ ������������
+ <small>������������������������</small>
+ </h1>
+</div>
<div nz-row [nzGutter]="24" style="padding: 20px">
- <div nz-col nzXs="24" nzSm="12" nzMd="24" nzLg="9">
+ <div nz-col nzXs="24" nzMd="24">
<div nz-form-control nz-col [nzSm]="20">
- <nz-datepicker></nz-datepicker>
+ <nz-card [nzBordered]="false">
+ <nz-calendar [nzLocale]="'zh-cn'" >
+ <ng-template #dateCell let-day>
+ <div *ngIf="!isExpire(day.date) && isCellExist(day.date)" style="width: 80px;height: 80px;display: block;position: absolute;" (click)="calendarClick(day.date)">
+ <nz-badge [nzStatus]="calendarDayCells[day.date|date:'dd']['status']" [nzText]="calendarDayCells[day.date|date:'dd']['statusName']" ></nz-badge>
+ <!-- <nz-badge [nzStatus]="'success'" [nzText]="'Sunday'" *ngIf="(day.date|date:'EEE')==='Sun'"></nz-badge>
+ {{day.date|date:'EEE'}}
+ {{day.date|date:'dd'}}
+ {{calendarDayCells[day.date|date:'dd']['status']}} -->
+ </div>
+ </ng-template>
+ </nz-calendar>
+ </nz-card>
</div>
- </div>
- <div nz-col nzXs="24" nzSm="12" nzMd="24" nzLg="15">
- <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">100</div>
- <p class="text-nowrap mb0">AQI</p>
- </div>
- </div>
- </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">30 ���</div>
- <p class="text-nowrap mb0">������</p>
- </div>
- </div>
- </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">2.5</div>
- <p class="text-nowrap mb0">������</p>
- </div>
- </div>
- </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">78 mg/m��</div>
- <p class="text-nowrap">PM2.5</p>
- </div>
- </div>
- </div>
- <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">100</div>
- <p class="text-nowrap mb0">AQI</p>
- </div>
- </div>
- </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">30 ���</div>
- <p class="text-nowrap mb0">������</p>
- </div>
- </div>
- </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">2.5</div>
- <p class="text-nowrap mb0">������</p>
- </div>
- </div>
- </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">78 mg/m��</div>
- <p class="text-nowrap">PM2.5</p>
- </div>
- </div>
- </div>
- </div>
+ </div>
</div>
--
Gitblit v1.8.0