From 9634327c9094fb2d2b5bb2a3e630971cd65d3112 Mon Sep 17 00:00:00 2001
From: 沈斌 <bluelazysb@hotmail.com>
Date: Tue, 13 Mar 2018 13:37:25 +0800
Subject: [PATCH] 工作台数据统计页面
---
src/app/routes/dashboard/workplace/workplace.component.html | 110 +++++++++++++++++++-----------------
src/app/routes/dashboard/workplace/workplace.component.ts | 23 +++++++
2 files changed, 80 insertions(+), 53 deletions(-)
diff --git a/src/app/routes/dashboard/workplace/workplace.component.html b/src/app/routes/dashboard/workplace/workplace.component.html
index 9a90a97..e74510f 100644
--- a/src/app/routes/dashboard/workplace/workplace.component.html
+++ b/src/app/routes/dashboard/workplace/workplace.component.html
@@ -9,7 +9,7 @@
<div class="page-header">
<div class="avatar"><nz-avatar nzSize="large" nzSrc="https://gw.alipayobjects.com/zos/rmsportal/lctvVCLfRpYCkYxAsiVQ.png"></nz-avatar></div>
<div class="desc">
- <div class="desc-title">���������������������</div>
+ <div class="desc-title">���������admin���</div>
<p>��������������� | ������������������������������������������������������������</p>
</div>
</div>
@@ -17,18 +17,18 @@
<ng-template #extra>
<div class="page-extra">
<div>
- <p>������������</p>
+ <p>������</p>
<p>8<span> / 24</span></p>
</div>
<div>
<p>���������</p>
<p>20</p>
</div>
+ <!--
<div>
<p>���������</p>
- <p>560</p>
+ <p>1532</p>
</div>
- <!--
<div>
<p>������������</p>
<p>2,223</p>
@@ -41,70 +41,34 @@
<div nz-row [nzGutter]="24" class="pt-lg" style="margin-top: -24px">
<div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
<chart-card
- [title]="'������������'"
- total="�� 126,560"
+ [title]="'���������������'"
+ total="{{totalDeviceCount}}"
contentHeight="46px"
[action]="action1"
[footer]="footer1">
<ng-template #action1>
- <nz-tooltip [nzTitle]="'������������'">
+ <nz-tooltip [nzTitle]="'���������������������������������������������������������'">
<nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
</nz-tooltip>
</ng-template>
+ <!--
<trend flag="up" style="display:block; margin-top:2px;">���������<span class="pl-sm">12%</span></trend>
<trend flag="down">���������<span class="pl-sm">11%</span></trend>
+ -->
+ <mini-bar height="46" [data]="totalDeviceCountList"></mini-bar>
<ng-template #footer1>
- <p class="text-truncate">���������������<span class="ml-sm">���12,423</span></p>
+ <p class="text-truncate">������������������:<span class="ml-sm">{{avgDeviceCount}}</span></p>
</ng-template>
</chart-card>
</div>
<div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
- <chart-card [title]="'���������'"
- total="8,848"
+ <chart-card [title]="'������������������'"
+ total="78%"
contentHeight="46px"
[action]="action2"
[footer]="footer2">
<ng-template #action2>
- <nz-tooltip [nzTitle]="'������������'">
- <nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
- </nz-tooltip>
- </ng-template>
- <mini-area
- color="#975FE4"
- height="46"
- [data]="data.visitData"></mini-area>
- <ng-template #footer2>
- <p class="text-truncate">������������<span class="ml-sm">1,234</span></p>
- </ng-template>
- </chart-card>
- </div>
- <div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
- <chart-card [title]="'������������'"
- total="6,560"
- contentHeight="46px"
- [action]="action3"
- [footer]="footer3">
- <ng-template #action3>
- <nz-tooltip [nzTitle]="'������������'">
- <nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
- </nz-tooltip>
- </ng-template>
- <mini-bar
- height="46"
- [data]="data.visitData"></mini-bar>
- <ng-template #footer3>
- <p class="text-truncate">���������<span class="ml-sm">60%</span></p>
- </ng-template>
- </chart-card>
- </div>
- <div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
- <chart-card [title]="'������������������'"
- total="78%"
- contentHeight="46px"
- [action]="action4"
- [footer]="footer4">
- <ng-template #action4>
- <nz-tooltip [nzTitle]="'������������'">
+ <nz-tooltip [nzTitle]="'������������������������������������������������������'">
<nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
</nz-tooltip>
</ng-template>
@@ -114,14 +78,54 @@
strokeWidth="8"
target="80"
color="#13C2C2"></mini-progress>
- <ng-template #footer4>
+ <ng-template #footer2>
<div class="d-flex justify-content-between">
- <trend flag="up">���������<span class="pl-sm">12%</span></trend>
- <trend flag="down">���������<span class="pl-sm">11%</span></trend>
+ <trend flag="up">���������<span class="pl-sm">8%</span></trend>
+ <trend flag="down">���������<span class="pl-sm">2%</span></trend>
</div>
</ng-template>
</chart-card>
</div>
+ <div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
+ <chart-card [title]="'������������'"
+ total="8,848"
+ contentHeight="46px"
+ [action]="action3"
+ [footer]="footer3">
+ <ng-template #action3>
+ <nz-tooltip [nzTitle]="'���������������������������������������������'">
+ <nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
+ </nz-tooltip>
+ </ng-template>
+ <mini-area
+ color="#975FE4"
+ height="46"
+ [data]="data.visitData"></mini-area>
+ <ng-template #footer3>
+ <p class="text-truncate">������������������:<span class="ml-sm">1,234</span></p>
+ </ng-template>
+ </chart-card>
+ </div>
+ <div nz-col nzXs="24" nzSm="12" nzMd="12" nzLg="6">
+ <chart-card [title]="'���������������'"
+ total="6,560"
+ contentHeight="46px"
+ [action]="action4"
+ [footer]="footer4">
+ <ng-template #action4>
+ <nz-tooltip [nzTitle]="'������������������������������������������������'">
+ <nz-icon nz-tooltip nzType="info-circle-o"></nz-icon>
+ </nz-tooltip>
+ </ng-template>
+ <mini-bar
+ height="46"
+ color="orange"
+ [data]="data.visitData"></mini-bar>
+ <ng-template #footer4>
+ <p class="text-truncate">������������������:<span class="ml-sm">220</span></p>
+ </ng-template>
+ </chart-card>
+ </div>
</div>
<nz-card [nzLoading]="loading" [nzBordered]="false" nzNoPadding class="sales-card">
<ng-template #body>
diff --git a/src/app/routes/dashboard/workplace/workplace.component.ts b/src/app/routes/dashboard/workplace/workplace.component.ts
index 6e47987..7698053 100644
--- a/src/app/routes/dashboard/workplace/workplace.component.ts
+++ b/src/app/routes/dashboard/workplace/workplace.component.ts
@@ -12,6 +12,11 @@
styleUrls: ['./workplace.component.less']
})
export class DashboardWorkplaceComponent implements OnInit, OnDestroy {
+
+ totalDeviceCountList: any[] = [];
+ totalDeviceCount = 0;
+ avgDeviceCount: string;
+
notice: any[] = [];
activities: any[] = [];
radarData: any[] = [];
@@ -102,6 +107,21 @@
private http2: HttpClient) {}
ngOnInit() {
+
+ const today = new Date().getTime();
+ const fakeDC = [60, 135, 70, 112, 80, 170, 200, 140, 52, 119, 164, 230];
+ for (let i = 0; i < 12; i += 1) {
+ this.totalDeviceCountList.push({
+ x: moment(today).subtract(-1*i, 'months').format(
+ "YYYY-MM"
+ ),
+ y: fakeDC[i]
+ });
+ this.totalDeviceCount += fakeDC[i];
+ }
+ this.avgDeviceCount = (this.totalDeviceCount/12).toFixed(0);
+
+
const visitData = [];
const beginDay = new Date().getTime();
@@ -497,6 +517,9 @@
});
return item;
});
+
+
+
}
setDate(type: any) {
--
Gitblit v1.8.0